/* 자동 생성 — design/tokens.css 가 SSOT. 직접 수정 금지.
   style.css 를 안 불러오는 독립 페이지(랜딩·약관·온보딩)용 토큰 전용본. */
/* ══════════════════════════════════════════════════════════════════
   Hyphen 관리자 웹 디자인 토큰 — SSOT (단일 원본)

   이 파일이 정본이다. static/style.css 의 :root 블록은
   `python design/sync.py` 가 이 파일에서 생성한 사본이며 직접 수정 금지.

   값 변경 절차: 이 파일 수정 → design/gallery.html 로 데모 확인
   → 사용자 승인 → `python design/sync.py` 배포 → 커밋.
   상세 = design/SSOT.md
   ══════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────────
   2026-08-12 압축 (사용자 지시) — 토큰 40개 → 정본 12개

   표면·텍스트 3 · 브랜드·상태 3 · 타이포 6. 이 아래 §정본 이 전부다.
   위계는 **색이 아니라 크기와 굵기**로 만든다.

   2026-08-13: **폐기 별칭 블록 전부 삭제 완료** (사용자 지시).
   --muted 194 · --accent 42 · --danger 33 · --surface 29 … 총 362곳을 정본
   이름으로 바꿨다. 별칭은 이미 정본을 가리키고 있었으므로 계산된 색·크기는
   한 곳도 바뀌지 않는다 — 이름만 사라진다 (전 화면 3,954노드 실측 대조).
   되살리지 말 것. lint §4.1 이 옛 이름 사용을 위반으로 잡는다.
   ────────────────────────────────────────────────────────────────── */
:root {
  /* ══ 정본 — 표면·텍스트 3 ══ */
  --bg: #FFFFFF;        /* 모든 면 — 페이지·카드·모달·입력 */
  --fg: #18181B;        /* 모든 글자 */
  --border: #E4E4E7;    /* 모든 선 + 옅은 바탕(hover·표 머리) */

  /* ══ 정본 — 브랜드·상태 3 ══ */
  --primary: #CC1F1F;   /* 브랜드 · 강조 · 위험(삭제) 겸용 — 앱·홈페이지와 같은 값 (2026-08-28) */
  --success: #10B981;   /* 완료 · 정상 */
  --warning: #F59E0B;   /* 주의 · 임박 */

  /* ══ 정본 — 타이포 6단 ══ */
  --fs-h1: 22px;        /* 페이지 제목 */
  --fs-h2: 18px;        /* 모달 제목 */
  --fs-h3: 16px;        /* 카드 제목 */
  --fs-body: 14px;      /* 본문 */
  --fs-sm: 13px;        /* 표 · 버튼 */
  --fs-xs: 12px;        /* 라벨 · 보조 설명 · 뱃지 */

  /* ── 글꼴 (§2-B-모노 차단이 이 토큰을 쓴다 — 없으면 규칙이 무효가 된다) ──
     ※ Pretendard 를 1순위로 올리는 것은 별도 판단 항목 (SSOT §5 D-3) ── */
  --font: -apple-system, BlinkMacSystemFont, "Pretendard", "Segoe UI", sans-serif;

  /* ── 한글 자간 (design-block §2.4 — 항상 음수) ── */
  --ls-title: -0.02em;   /* 18px+ 제목 */
  --ls-body: -0.01em;    /* 12~16px 본문 */

  /* ── radius (design-block §4.3) ── */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;

  /* ── spacing (4px 그리드) ── */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 40px;

  /* 보조 설명 글자의 흐림 정도 (2026-08-13 사용자 결정 — 갤러리 §15 B안).
     색을 늘리지 않고 위계를 만든다. 흰 바탕 대비 5.5:1 로 WCAG AA 통과. */
  --dim: 0.65;

  /* ── 컨트롤 높이 — 하나 (2026-09-04 D115 · 사용자 "버튼 크기나 그런것도 좀 통일") ──
     한 줄에 나란히 서는 것은 전부 이 높이다: 버튼 · 입력칸 · 검색칸 · 칩 · 탭칩 ·
     페이저 화살표. 실측해 보니 33 / 35 / 29 / 26 / 34 / 28 여섯 가지였고,
     그래서 액션바·필터바의 밑선이 컨트롤마다 어긋나 있었다.
     34 인 이유 = 가장 많이 쓰이는 셋(버튼 33 · 입력칸 35 · 탭칩 34)의 한가운데라
     대다수가 ±1 만 움직인다. 글자 13px 기준으로 위아래 여백도 넉넉하다. */
  --ctrl-h: 34px;

  /* ── 자리 예약 높이 (D115 · 레이아웃 시프트 차단) ──
     로딩·빈·에러가 같은 자리에서 갈아 끼워질 때 **셋이 같은 바닥**을 갖게 하는 값.
     없으면 스켈레톤 → 문구 → 실제 내용으로 바뀔 때마다 아래가 튄다.
     정본 규칙 = design/SSOT.md §17. */
  --slot-msg: 76px;          /* .table-msg · .panel-msg — 한 줄 문구 자리 */
  --slot-msg-roomy: 132px;   /* .is-roomy — 두 줄 + 다시 시도 링크가 들어가는 자리 */
  --slot-banner: 37px;       /* .page-banner — 없을 때도 이 높이를 비워 둔다 */

  /* 카카오 브랜드 색 — 우리 팔레트가 아니라 **남의 브랜드 규정** 값이라
     의미 토큰(primary 등)에 섞지 않고 이름을 그대로 쓴다.
     2026-08-23 — 랜딩과 로그인이 같은 hex 를 각자 적고 있었다 (§0-B). */
  --kakao: #FEE500;
  --kakao-hover: #F2D900;
  --kakao-fg: #191919;

  --shadow: 0 1px 3px rgba(0,0,0,0.08);
  /* 떠 있는 것(모달·토스트·고정 배너) 전용. 2026-08-12 신설 —
     같은 성격의 그림자가 화면마다 .15 / .12 / .08 로 제각각이었다. */
  --shadow-lift: 0 8px 24px rgba(0,0,0,0.15);
}