/* isobar — 디자인 시스템 정본. 이름은 Tailwind 4 @theme 이름공간, 선언은 :root(브라우저가 @theme 를 읽지 않는다 #73).
 * 셰이더·재질 색도 여기서 읽는다(kit.js tokenColor) — main.js·scene.js 에 raw hex 0. */
:root {
  /* 바탕·글자 — Tactical Telemetry(어두움) 한 벌만 */
  --color-bg: #080b0d;          /* 꺼진 관제 화면 · 3D 바탕 · 글자 장애물 안 */
  --color-panel: #0f1417;       /* 코드 블록 · 탭 몸통 */
  --color-line: #263034;        /* 1px 칸막이 · 경위선 — 글자 금지 */
  --color-ink: #e4ebe8;         /* 모든 본문·제목 · 주 단추 바탕 */
  --color-mute: #8b9894;        /* 보조 글자 — 단색 바탕(bg·panel) 위만 */
  --color-accent: #2ad1d6;      /* OKLCH h 198° — 선·점·2px 줄만, 면 금지 */

  /* 3D 전용 (DOM 금지) */
  --color-particle: #c9d4d1;     /* 빠른 입자 — 가산 혼합 시작색 */
  --color-particle-dim: #4a5754; /* 느린 입자 · 밤쪽 */
  --color-graticule: #1a2226;    /* 15° 경위선 */

  /* 서체 — 서가 가족만 */
  --font-display: "Chivo", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Chivo", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* 글자 크기 — display 는 800 · 대문자 · 자간 -0.04em · 행간 0.88 (폭 표 wireframe 4절) */
  --text-hero: clamp(4rem, 11vw, 11rem);
  --text-scene: clamp(3rem, 6.4vw, 7rem);
  --text-h2: clamp(2.25rem, 4.4vw, 4.5rem);
  --text-price: clamp(2.5rem, 4vw, 3.5rem);
  --text-figure: clamp(1.5rem, 2.2vw, 2rem);
  --text-call: clamp(1rem, 1.6vw, 1.5rem);
  --text-lead: clamp(1.0625rem, 1.2vw, 1.25rem);
  --text-body: 1rem;
  --text-small: 0.875rem;
  --text-code: 0.8125rem;
  --text-ticker: 0.8125rem;
  --text-field: 0.6875rem;

  --font-weight-display: 800;
  --tracking-display: -0.04em;
  --leading-display: 0.88;
  --tracking-field: 0.08em;
  --tracking-wordmark: 0.12em;

  /* 간격 (4px 단위) */
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-3: 0.75rem;
  --spacing-4: 1rem;
  --spacing-6: 1.5rem;
  --spacing-8: 2rem;
  --spacing-12: 3rem;
  --spacing-16: 4rem;
  --spacing-24: 6rem;
  --spacing-32: 8rem;
  --spacing-gutter: clamp(1rem, 3vw, 2.5rem);
  --spacing-copy: min(36vw, 34rem);
  --spacing-hero: min(60vw, 56rem);
  --spacing-ticker: 2.5rem;
  --spacing-ticker-m: 2.75rem;
  --spacing-obstacle: 1.5rem;   /* 입자가 글자 사각을 비켜 가는 거리 */

  /* 모서리 — 직각만 */
  --radius-none: 0;

  /* 그림자 — 쓰지 않는다. 포커스만 */
  --shadow-none: none;
  --shadow-focus: 0 0 0 2px var(--color-bg), 0 0 0 4px var(--color-ink);

  /* 이징 */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out-sine: cubic-bezier(0.37, 0, 0.63, 1);
  --ease-out-quad: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-linear: linear;

  /* 시간(120·160·240·400·480ms)은 Tailwind @theme 이름공간이 없어 DESIGN.md 모션 표에만 둔다 */
}