/* theme.css — 디자인 변수와 기본 부품(단추·카드·표·알림). 결과 HTML과 같은 남색·놋쇠색 계열. 외부 글꼴 없이 기기 글꼴만 쓴다. */
:root{
  --ink:#101C33; --ink-soft:#3E4A63; --ink-mute:#5B6680;
  --navy:#1B3358; --navy-deep:#0F2038;
  --brass:#8A6630; --brass-soft:#C9A15A;
  --paper:#F4F6F9; --surface:#FFFFFF;
  --line:#D8DEE7; --line-soft:#E9EDF3;
  --good:#1E6B3A; --good-bg:#E8F4EC;
  --bad:#A12A22;  --bad-bg:#FBEDEB;
  --warn:#7A5A12; --warn-bg:#FBF4E4;
  --radius:6px; --tap:44px;
  --sans:-apple-system,"Malgun Gothic","Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;
  --mono:ui-monospace,Consolas,"D2Coding",monospace;
  --shadow:0 1px 2px rgba(16,35,63,.05),0 6px 18px rgba(16,35,63,.06);
  --fs:16px;
}
html.lg{--fs:19px}
*{box-sizing:border-box}
html{font-size:var(--fs);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1rem;line-height:1.6;word-break:keep-all;overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
:focus-visible{outline:3px solid var(--brass-soft);outline-offset:2px}
a{color:var(--navy)}
h1{font-size:1.5rem;line-height:1.3;margin:.2rem 0 .5rem;color:var(--navy-deep)}
h2{font-size:1.1rem;margin:0 0 .6rem;color:var(--navy-deep)}
.offscreen{position:fixed;left:-9999px;top:0;width:1px;height:1px;opacity:0}
[hidden]{display:none!important}

/* 단추 — 누름 영역 44px 이상 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;min-height:var(--tap);min-width:var(--tap);padding:.55rem 1.1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--navy-deep);font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.btn:hover{border-color:var(--navy)}
.btn.primary{background:var(--navy-deep);border-color:var(--navy-deep);color:#fff}
.btn.primary:hover{background:var(--navy)}
.btn.danger{border-color:var(--bad);color:var(--bad)}
.btn.danger.primary{background:var(--bad);color:#fff}
.btn.big{min-height:52px;padding:.7rem 1.4rem}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.row{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0}
.row.end{justify-content:flex-end}

/* 카드·알림 */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1rem 1.1rem;margin:1rem 0}
.note{margin:.8rem 0;padding:.7rem .9rem;border-radius:var(--radius);background:#EEF2F8;border-left:4px solid var(--navy)}
.note.warn{background:var(--warn-bg);border-left-color:var(--brass-soft)}
.note.err{background:var(--bad-bg);border-left-color:var(--bad)}
.note-tag{font-weight:700;font-size:.85em}
.muted{color:var(--ink-mute)}
.later{display:inline-block;font-size:.85em;color:var(--warn);background:var(--warn-bg);border:1px dashed var(--brass-soft);border-radius:20px;padding:0 .6em}

/* 상태 표시 — 색만으로 구분하지 않도록 ✓·✕ 글자를 함께 쓴다 */
.st{font-weight:600}
.st.good{color:var(--good)}
.st.bad{color:var(--bad)}

/* 표 */
.tw{overflow-x:auto;margin:1rem 0}
.tbl{width:100%;border-collapse:collapse;background:var(--surface);font-size:.92rem}
.tbl th,.tbl td{border:1px solid var(--line);padding:.5rem .6rem;text-align:left;vertical-align:top}
.tbl th{background:#EBF0F6;color:var(--navy)}
.tbl .num{text-align:right;font-family:var(--mono)}
.tbl .mono{font-family:var(--mono)}
.tbl .name{max-width:18rem}

/* 확인 창 */
.dlg-back{position:fixed;inset:0;background:rgba(15,32,56,.45);display:grid;place-items:center;padding:1rem;z-index:50}
.dlg{background:var(--surface);border-radius:var(--radius);padding:1.2rem;max-width:28rem;width:100%;box-shadow:0 12px 40px rgba(0,0,0,.25)}

/* 알림 띠 */
.toast{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));transform:translateX(-50%);width:max-content;max-width:min(92vw,36rem);background:var(--navy-deep);color:#fff;padding:.75rem 1rem;border-radius:var(--radius);box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:60}
.toast[hidden]{display:none}