/* global.css — 토큰·리셋·접근성 기반. 원본 명세: docs/230 Ⅲ장 (값은 docs/210)
   페이지는 여기 정의를 재정의하지 않는다 — scoped 에는 배치만 (상위 20-Ⅰ) */

:root {
  /* 브랜드 (210) */
  --green-700: #175C3A;
  --green-600: #1F7A4D;
  --green-100: #E8F3EC;
  --flag-500: #F59E0B;
  --paper-50: #FBFAF6;
  --paper-100: #F6F1DE;
  --water: #7DB8D4;

  /* 의미 토큰 (20-Ⅱ 필수 목록) */
  --bg: var(--paper-50);
  --ink: #14211A;
  --ink-soft: #4C5B53;
  --panel: #FFFFFF;
  --line: #E4E2D9;            /* 장식 선 */
  --line-ui: #8A9A90;         /* 기능 테두리 — 흰 바탕 3.05:1 실측 (230 Ⅲ) */
  --accent: var(--flag-500);
  --accent-fg: var(--ink);    /* 주황 위 먹색 — 흰 글자 금지 (210 Ⅳ) */
  --warn: #C2410C;
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-pill: 999px;
  --tap: 44px;
  --shell: 760px;
}

/* 다크 구간(랜딩 밤 챕터): 토큰만 재정의 — 부품은 토큰을 본다 */
body.dark {
  --ink: #F6EFE0;
  --ink-soft: #B9C6D8;
  --panel: #1A2436;
  --line: #2C3A50;
  --line-ui: #6E7F96;
}

/* ── 리셋 ── */
* { box-sizing: border-box; margin: 0; }
html, body { min-height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo",
    "Pretendard", "Noto Sans KR", sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.6;
  word-break: keep-all;
}
img, svg { max-width: 100%; }

/* ── 접근성 기반 (30-Ⅲ) ── */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.skip-link {
  position: absolute; left: 8px; top: -48px; z-index: 100;
  background: var(--panel); color: var(--ink); font-weight: 800;
  border-radius: var(--radius-sm); padding: 10px 16px;
  transition: top .15s;
}
.skip-link:focus { top: 8px; }

/* 스크린리더 전용 (라벨 등) */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* hidden 이 display 지정에 지지 않게 (30-Ⅵ-3) */
[hidden] { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}