/*
 * still-cup — 디자인 시스템 정본 (3단계 · designer · 2026-09-25)
 * 이름은 Tailwind 4 @theme 이름공간 그대로 — 승급할 때 globals.css 의 @theme { } 안으로 옮기면 된다.
 * 정적 사이트에서는 브라우저가 @theme 를 모르므로 :root 에 둔다.
 * style.css 는 이 파일의 var() 만 쓴다(raw 색 금지 — G2 ⑨). 값의 이유는 _design/DESIGN.md.
 */
:root {
  /* ── 색 ─────────────────────────────────────────────────────────────
   * 바탕 = 제이다이트(옥빛 우유 유리 머그의 색). OKLCH L .871 C .066 h 155 — 종이색 판정(h 40–120) 밖.
   * 가장 가까운 바탕: dana-koh #cfd8e3 ΔE .071 · moim #dcf5b8 ΔE .078 · orin #e6e8ea ΔE .089 — 옅게·노랗게 고치지 않는다. */
  --color-bg: #b3e2c2;          /* 페이지 바탕 — jadeite */
  --color-surface: #daf3e1;     /* milk glass — 쪽지(slip) 속면 · 시즌 띠 · 표 머리 */
  --color-band: #9ccfaf;        /* 짙은 유약 — 쪽지 겉테 · 지도 바닥 · 꼬리 */
  --color-ink: #0d251b;         /* 본문·제목 — 병초록 먹 (bg 11.23:1) */
  --color-ink-soft: #355243;    /* 설명·방주·라벨 (bg 5.97 · band 4.90) */
  --color-accent: #3b358c;      /* 만년필 잉크 인디고 (h 281) — Open now · 오늘의 원두 이름 · 오늘 요일 · 고른 칩 · 가게 점 · 포커스 (bg 7.03) */
  --color-on-accent: #f0f7f0;   /* 인디고 면 위 글자 — 고른 칩 (9.29:1) */
  --color-espresso: #402719;    /* 삽화 전용 — 잔 속 커피 */
  --color-crema: #b48862;       /* 삽화 전용 — 커피 윗면 테두리. 글자에 쓰지 않는다 */
  --color-line: #769d85;        /* 장식 전용 — 지시선 점·머리카락 선·지도 길. 글자에 쓰지 않는다 */

  /* ── 서체 ───────────────────────────────────────────────────────────
   * Fraunces 는 opsz 9–144 축이 있다 — font-optical-sizing: auto 로 크기에 맞는 자형이 나온다(큰 이름 = opsz 144). */
  --font-display: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --font-body: "Pretendard Variable", Pretendard, system-ui, -apple-system, sans-serif;

  /* ── 글자 크기 (+ 행간) ───────────────────────────────────────────── */
  --text-micro: 0.75rem;            /* 12 — 대문자 라벨·눈썹, 자간 .16em */
  --text-micro--line-height: 1.4;
  --text-note: 0.9375rem;           /* 15 — 방주(Fraunces 이탤릭)·표 설명 */
  --text-note--line-height: 1.45;
  --text-body: 1.0625rem;           /* 17 — 본문·메뉴 이름·가격 */
  --text-body--line-height: 1.6;
  --text-lead: clamp(1.1875rem, 1rem + 0.6vw, 1.4375rem);   /* 19→23 — 상태 줄·오늘의 원두 한 줄 */
  --text-lead--line-height: 1.4;
  --text-h3: clamp(1.375rem, 1.15rem + 0.7vw, 1.75rem);     /* 22→28 — 메뉴 분류·블록 소제목 */
  --text-h3--line-height: 1.2;
  --text-h2: clamp(2.25rem, 1.5rem + 2.4vw, 3.75rem);       /* 36→60 — 블록 제목 */
  --text-h2--line-height: 1.02;
  --text-title: clamp(3.5rem, 2rem + 5.2vw, 7.5rem);        /* 56→120 — 메뉴 페이지 제목 */
  --text-title--line-height: 0.92;
  /* 홈 이름 — 칼럼을 넘는 유일한 글자. Fraunces 300 이탤릭 "Still Cup" 실측 폭 = 글자 크기 × 2.99
   * → 390: 99px(폭 ≈326, 여백 안) · 1024: 208px · 1440: 280px(폭 ≈837 ≈ 칼럼+거터+방주 848). opsz 144 자형이 좁아 이 크기가 필요하다. */
  --text-name: clamp(4.75rem, 2rem + 17.2vw, 18rem);
  --text-name--line-height: 0.88;

  /* ── 간격 ───────────────────────────────────────────────────────────
   * 격자: [여백 1fr] [칼럼 36rem] [거터 3rem] [방주 14rem] [여백 1.6fr] — 칼럼이 왼쪽으로 치우친다. */
  --spacing: 0.25rem;                                        /* 기본 단위 (Tailwind 4) */
  --spacing-page-x: clamp(1.25rem, 5vw, 4.5rem);            /* 20 → 72 */
  --spacing-column: 36rem;                                   /* 576 — 본문 칼럼 */
  --spacing-gutter: 3rem;                                    /* 48 — 칼럼↔방주 */
  --spacing-note: 14rem;                                     /* 224 — 방주 칸 (1024 미만에서 사라지고 본문 안으로 접힌다) */
  --spacing-section: clamp(6rem, 3.5rem + 6vw, 10rem);      /* 96 → 160 — 블록 사이 (렌즈: py-24~py-40) */
  --spacing-block: clamp(2.5rem, 1.75rem + 2.4vw, 4.5rem);  /* 40 → 72 — 블록 안 제목↔내용 */
  --spacing-row: 0.875rem;                                   /* 14 — 메뉴 줄 위아래 */
  --spacing-nav-top: clamp(0.75rem, 0.5rem + 1vw, 1.5rem);  /* 건너뛰기 링크가 위에서 떨어진 거리 */
  --spacing-cup: clamp(2.75rem, 2.25rem + 1.2vw, 3.5rem);   /* 44 → 56 — 잔 높이 */

  /* ── 모서리 ─────────────────────────────────────────────────────── */
  --radius-sm: 0.25rem;                        /* 단추 · 칩 · 건너뛰기 · 지도 꼬리표 — 알약 대신(헤더 재설계 2026-10-09) */
  --radius-slip: 2rem;                         /* 쪽지 겉테 (double-bezel outer) */
  --radius-slip-core: 1.5rem;                  /* 쪽지 속면 = 2rem − 겉테 패딩 .5rem (동심) */
  --radius-cup: 0 0 42% 42% / 0 0 62% 62%;     /* 잔 몸통 — 아래만 둥글다 */

  /* ── 그림자 — 넓고 옅게. 진한 그림자·1px 회색 테두리 금지(렌즈) ── */
  --shadow-slip: inset 0 1px 0 rgb(255 255 255 / 0.55), 0 32px 64px -40px rgb(16 38 27 / 0.42);
  --shadow-pill: inset 0 1px 0 rgb(255 255 255 / 0.6), 0 12px 28px -18px rgb(16 38 27 / 0.5);
  --shadow-cup: inset 0 -0.35rem 0 rgb(16 38 27 / 0.08);

  /* ── 이징 — linear·ease-in-out 키워드 금지(렌즈) ────────────────── */
  --ease-fluid: cubic-bezier(0.32, 0.72, 0, 1);   /* 기본 — hover·press·칩·내비 */
  --ease-reveal: cubic-bezier(0.16, 1, 0.3, 1);   /* 드러남 — 이름 Reveal · Scroll reveal · 잔 수위 Tween */
  --ease-steam: cubic-bezier(0.37, 0, 0.63, 1);   /* 김 Float 왕복(sine) — 유일한 반복 */
}