/* TnB pages — shared tokens, type, controls.
   Palette follows the project proposal deck: ink + box-tape orange on warm paper. */
@import url('https://cdn.jsdelivr.net/npm/pretendard@1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.css');

:root {
  --bg:#f7f5f1; --fg:#1c1b1a; --muted:#6b665f; --line:#e3ded5; --soft:#efebe4;
  --tape:#e8590c; --tape-soft:#fbe9dc; --accent:#e8590c;
  --free:#dff3e4; --free-fg:#1d6b39;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#171615; --fg:#eeebe5; --muted:#a39d94; --line:#34312d; --soft:#221f1d;
    --tape:#f07a33; --tape-soft:#2d2019; --accent:#f07a33;
    --free:#173d24; --free-fg:#b9eac7;
  }
}

* { box-sizing:border-box; }
body {
  margin:0; background:var(--bg); color:var(--fg);
  font:16px/1.6 'Pretendard Variable', Pretendard, -apple-system, system-ui, 'Apple SD Gothic Neo', sans-serif;
  -webkit-font-smoothing:antialiased; word-break:keep-all;
}
::selection { background:var(--tape); color:#fff; }

/* Box-tape label: the one hand-made detail */
.tape {
  display:inline-block; background:var(--tape); color:#fff; font-size:12px; font-weight:700;
  padding:3px 10px 2px; transform:rotate(-1.5deg); letter-spacing:.01em;
}

/* Controls */
select, input, .btn {
  font:inherit; font-size:14px; padding:8px 11px; border:1px solid var(--line); border-radius:6px;
  background:var(--bg); color:var(--fg);
}
select:focus-visible, input:focus-visible, button:focus-visible { outline:2px solid var(--tape); outline-offset:1px; }
.btn.primary { background:var(--fg); color:var(--bg); border-color:var(--fg); font-weight:600; cursor:pointer; }
.btn { cursor:pointer; }
.btn:hover { border-color:var(--muted); }
.btn:disabled { opacity:.5; cursor:default; }
.err { color:#c2410c; font-size:13px; width:100%; }
.err:empty { display:none; }