/* 철판클럽 토큰 — 2026-10-06 재작업(outputs/rework-2026-10-06/plan.md 배정값).
   색·서체·radius·모션 값은 이 파일에만 둔다. site.css·franchise.css는 var()만 쓴다. */
:root {
  color-scheme: light;

  /* 바탕 — 유채 크림. 쟁반 위 유산지의 색이다. 섹션 교대는 밝은 크림(surface)과 진한 크림(bg-deep)으로만 한다 */
  --bg: #fbe9c8;
  --bg-deep: #f4d9a3;
  --surface: #fff7e8;
  --surface-rgb: 255 247 232;

  /* 먹 — 따뜻한 갈색 먹. 패티 가장자리의 색. 크림 위 대비 14.3:1 */
  --ink: #26190f;
  --ink-soft: #5c4a39; /* 7.0:1 */
  --ink-faint: #6b5744; /* 5.7:1 — 보조 라벨 하한 */
  --ink-rgb: 38 25 15;
  --on-ink: #fbe9c8;
  --on-ink-soft: #e9d2a8; /* 먹 위 11.6:1 */
  --on-ink-faint: #c9b79b; /* 먹 위 8.7:1 */

  /* 선 — 크림보다 한 단 진한 모래색 */
  --line: #e2c99e;
  --line-strong: #b89a6c;

  /* 강조 — 코발트(유지). 쟁반과 클립의 색. 크림 위 5.6:1, 흰 글자 6.7:1 */
  --blue: #2147e7;
  --blue-dark: #1533ac;
  --blue-pale: #dbe3ff;
  --on-blue: #ffffff;
  --on-blue-soft: #dbe3ff; /* 코발트 위 5.3:1 */

  /* 치즈 — 스티커 한 장에만 쓴다 */
  --cheese: #ffc642;
  --on-cheese: #26190f; /* 10.9:1 */

  /* 상태 */
  --danger: #b33124; /* 크림 위 5.2:1 */
  --success: #17683b; /* 5.7:1 */
  --pause: #7a5a10; /* 5.3:1 */
  --focus: #2147e7;

  /* 서체 — 표제 Jua(한 굵기), 본문 Gothic A1. 둘 다 Google Fonts OFL, 한글 슬라이스 서브셋 */
  --font-display: "Jua", "Gothic A1", "Apple SD Gothic Neo", sans-serif;
  --font-body: "Gothic A1", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --weight-body: 500;
  --weight-strong: 700;
  --weight-heavy: 800;

  /* 타입 스케일 — 본문 16, 표제는 vw 보간 */
  --text-xs: 13px;
  --text-sm: 14px;
  --text-md: 16px;
  --text-lg: clamp(17px, 1.4vw, 19px);
  --text-h3: clamp(24px, 2.2vw, 30px);
  --text-h2: clamp(36px, 4.4vw, 60px);
  --text-h1: clamp(46px, 6.2vw, 92px);
  --leading-body: 1.7;
  --leading-tight: 1.2;
  --leading-display: 1.14;
  --tracking-display: -0.01em;

  /* 폭 */
  --wrap: 1180px;
  --measure: 36em;
  --hero-wide: 2160px;
  --stage-wide: 1680px;
  --workbench-wide: 1480px;
  --copy-wide: 880px;
  --media-wide: 1100px;
  --gutter: clamp(18px, 4vw, 52px);
  --section: clamp(72px, 9vw, 128px);

  /* 간격 */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;

  /* radius — 알약과 16px, 둘뿐이다 */
  --radius: 16px;
  --radius-pill: 999px;

  /* 깊이 — 그림자는 콜라주 조각에만 */
  --shadow-piece: 0 24px 60px rgb(38 25 15 / 18%);
  --shadow-card: 0 10px 30px rgb(38 25 15 / 10%);

  /* 모션 — 스태거 등장(히어로 조각) + 마퀴. 감소 모션에서는 전부 0 */
  --dur: 520ms;
  --dur-fast: 180ms;
  --stagger: 90ms;
  --shift: 28px;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --marquee-dur: 32s;

  --header-height: 72px;
  --action-bar-height: 64px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

@media (max-width: 720px) {
  :root {
    --header-height: 60px;
    --section: 64px;
  }
}

@media (min-width: 120rem) {
  :root {
    --wrap: 1320px;
  }
}

@media (min-width: 150rem) {
  :root {
    --wrap: 1400px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur: 0.01ms;
    --dur-fast: 0.01ms;
    --stagger: 0ms;
    --shift: 0px;
    --marquee-dur: 0.01ms;
  }
}