:root{
  --blue:#2563EB; --blue-deep:#1B3FA0; --blue-wash:#EAF1FF;
  --ink:#0C1425; --ink2:#4A5468; --ink3:#8A94A6;
  --paper:#FFFFFF; --sheet:#FFFDF7; --bg:#E9EDF4;
  --line:#DCE2EC; --line2:#C3CCDA;
  --warn:#B45309; --warn-wash:#FDF3E3;
  --danger:#B42318; --danger-wash:#FDEDEA;
  --ok:#0F7A5A;
  --hi-y:#FFF0A8; --hi-b:#CFE0FF;
  --pen:#1E5AC8;
  --sans:"Pretendard Variable",Pretendard,-apple-system,system-ui,sans-serif;
  --serif:"Gowun Batang",serif;
  --hand:"Nanum Pen Script",cursive;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;height:100%}
body{
  background:var(--bg);font-family:var(--sans);color:var(--ink);
  font-size:15px;line-height:1.62;letter-spacing:-.015em;
  -webkit-font-smoothing:antialiased;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;background:none;color:inherit}
button:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* ---------- 모바일 레이아웃 고정 (PC 포함) ---------- */
#shell{
  width:min(430px,100vw);
  height:100vh;
  height:100dvh;
  background:var(--paper);
  display:flex;flex-direction:column;overflow:hidden;position:relative;
}
@media(min-width:480px) and (min-height:700px){
  #shell{border-radius:26px;box-shadow:0 0 0 1px var(--line),0 30px 70px rgba(12,20,37,.16)}
}
@media(max-width:767px){
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),textarea,select{font-size:16px!important}
}

.bar{
  flex:0 0 auto;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);padding:14px 20px;
  display:flex;align-items:center;gap:10px;
}
.bar .mark{width:9px;height:9px;border-radius:2px;background:var(--blue);transform:rotate(45deg)}
.bar .t{font-weight:800;font-size:.94rem;letter-spacing:-.03em}
.bar .s{margin-left:auto;font-size:.72rem;color:var(--ink3);font-weight:600}

.screen{display:none;flex:1;min-height:0;flex-direction:column}
.screen.on{display:flex}
.scroll{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}