/* plinth — 디자인 시스템 정본 (DESIGN.md 와 같은 값)
 * 이름은 Tailwind 4 @theme 이름공간을 따르되 선언은 :root 에 둔다 — 브라우저는 @theme 블록을 읽지 않는다(lessons #73).
 * 렌즈: industrial-brutalist-ui · Swiss Industrial Print(밝은 바탕) 한 가지만 쓴다.
 * 모서리 0 · 그림자 0 · 그라데이션 0 — 면은 1px 잉크 선으로만 나눈다.
 */
:root {
  /* ── 색 ── 바탕은 표백하지 않은 도록 종이(hue 40°), 강조는 로트 딱지 주홍(hue 10°) 하나 */
  --color-paper: #e6dcc8;        /* 바탕 — 전 페이지 */
  --color-ink: #17140f;          /* 글자·1px 선·버튼 면 */
  --color-muted: #5c5346;        /* 보조 글자(메타·SOLD 줄) — 종이 위 5.55:1 */
  --color-sunk: #d9cdb4;         /* 표 머리 줄·각도 눈금 띠·자리표시자 면 */
  --color-sheet: #f3ede1;        /* 호버 미리보기 종이·딱지 글자 */
  --color-accent: #c8361a;       /* 주홍 — 바늘·포커스 링·입력 오류 테두리·색인 줄 4×4 사각(작은 면만, 글자는 큰 글자만) */
  --color-accent-ink: #a82a10;   /* 딱지 면(sheet 글자 6.00:1) · 종이 위 작은 주홍 글자 5.14:1 — sunk 위 금지(4.44) */
  --color-stage: #e0d8c3;        /* 턴테이블 칸 — 프레임 가장자리 6점 실측 평균(#dcd5c1~#f1ecda). 프레임이 무대를 꽉 채워 싣기 전에만 보인다 */
  --color-line: #17140f;         /* 구획선 = 잉크 */
  --color-line-faint: #b8aa8e;   /* 표 안 가는 선(장식 — 대비 요구 없음) */

  /* ── 서체 ── display·읽는 글 = Cormorant Garamond(300·400·500 + 이탤릭) · 데이터·UI = JetBrains Mono */
  --font-display: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --font-serif: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* ── 글자 크기 ── 폭 표(wireframe §6)로 실측한 상한. 모노는 고정, 세리프만 유동 */
  --text-mono-s: 0.75rem;                                   /* 12px — 메타·라벨, 대문자 + 자간 0.08em */
  --text-mono: 0.8125rem;                                   /* 13px — 표 값·버튼 */
  --text-mono-l: 1rem;                                      /* 16px — 가격·각도 읽기값 */
  --text-body: clamp(1.1875rem, 1.05rem + 0.4vw, 1.375rem); /* 19→22px — 큐레이터 노트(Cormorant 400) */
  --text-index: clamp(1.25rem, 1rem + 0.9vw, 1.75rem);      /* 20→28px — 색인 줄 오브젝트 이름 */
  --text-h2: clamp(2.25rem, 1.25rem + 2.6vw, 4.5rem);       /* 36→72px — 절 제목 */
  --text-h1: clamp(3rem, 0.75rem + 5vw, 6.5rem);            /* 48→104px — 이번 주 오브젝트 이름 */
  --text-numeral: clamp(10rem, 4rem + 22vw, 24rem);         /* 160→384px — 다음 회차 번호 "048" 하나 */
  --text-masthead: clamp(2.25rem, 0.75rem + 5vw, 5.5rem);   /* 36→88px — 제호 워드마크 PLINTH(대문자, 폭 전체로 벌림) */

  --leading-display: 0.92;
  --leading-body: 1.45;
  --leading-mono: 1.35;
  --tracking-display: -0.02em;
  --tracking-mono: 0.08em;

  /* ── 간격 ── 4px 척도 + 유동 둘(여백·간격에만, 테두리 상자 padding 은 리터럴 단계 — lessons #50) */
  --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-gutter: clamp(1rem, 0.5rem + 2vw, 2rem);
  --spacing-section: clamp(4rem, 2rem + 6vw, 9rem);
  --spacing-masthead: clamp(3rem, 1.5rem + 5vw, 6.5rem);  /* 제호 줄 높이 48→104px (1440: 96) */
  --spacing-bar: 2.5rem;          /* 목차 줄 높이 40px — sticky, 섹션 scroll-margin-top 도 이 값 */
  --spacing-ruler: 3.5rem;        /* 각도 눈금 띠 높이 56px */
  --spacing-container: 100rem;    /* 1600px 상한 */

  /* ── 모서리·그림자 ── 렌즈 규칙: 전부 0 */
  --radius-none: 0;
  --shadow-none: none;
  --shadow-ring: 0 0 0 1px var(--color-ink);   /* 호버 미리보기 테두리 — 그림자가 아니라 선 */

  /* ── 움직임 ── */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-linear: linear;
  --duration-press: 100ms;
  --duration-swap: 160ms;
  --duration-open: 240ms;
  --duration-hint: 600ms;
}