/* ============================================================
   ATMOTECT — Design Tokens
   北極星：墨の茶室。地は無彩（墨・グレー・紙）、唯一の有彩色は朱の一点。
   すべて OKLCH。DESIGN.md と対応。
   ============================================================ */
:root {
  /* ── Color · 地は無彩、朱は署名の一点だけ ───────────────── */
  --paper:        oklch(0.985 0 0);   /* 背景の主・紙（ほぼ純白／無彩・No-Cream） */
  --surface:      oklch(0.958 0 0);   /* 淡い面・二次背景・沈み */
  --ink:          oklch(0.190 0 0);   /* 墨・本文/見出し/線の主 */
  --ink-soft:     oklch(0.340 0 0);   /* やや弱い墨・小見出し */
  --muted:        oklch(0.460 0 0);   /* 二次テキスト（paper に対し ~6:1） */
  --faint:        oklch(0.620 0 0);   /* 最弱・キャプション（大きめのみ） */
  --line:         oklch(0.895 0 0);   /* 罫・区切り（hairline） */
  --line-strong:  oklch(0.820 0 0);

  --shu:          oklch(0.520 0.160 32);  /* 朱／辰砂・唯一の有彩色（点） */
  --shu-lift:     oklch(0.610 0.150 34);  /* 暗背景での朱 */

  /* Inverted surfaces（墨地） */
  --ink-on-dark:  oklch(0.985 0 0);
  --paper-dark:   oklch(0.170 0 0);
  --line-on-dark: oklch(0.320 0 0);
  --muted-on-dark:oklch(0.680 0 0);

  /* 暗地・写真の上に載る紙白（落款の煙・画像スライドの白文字）。
     背景の --paper と同値だが役割が違う＝別名で正本化。
     ※ SVG 属性/meta の #FAFAFA はこの値に一致（var() 不可なので直値注記のみ）。 */
  --on-photo:     oklch(0.985 0 0);

  /* ── Type · 魂＝明朝 / 骨格＝グロテスク（和文サンス＋欧文ネオグロテスク） ── */
  --font-mincho: "Shippori Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;   /* 魂・情緒（和文セリフ） */
  --font-gothic: "Zen Kaku Gothic New", system-ui, -apple-system, "Segoe UI", sans-serif; /* 骨格・計器（和文サンス） */
  --font-latin:  "Archivo", var(--font-gothic);  /* 骨格・欧文（中性ネオグロテスク）：ラベル/英コピー/ワードマーク。和文へは Zen Kaku にフォールバック */

  --text-xs:      0.75rem;
  --text-sm:      0.8125rem;
  --text-body:    1rem;
  --text-lead:    1.1875rem;
  --text-title:   clamp(1.25rem, 1.05rem + 0.9vw, 1.55rem);
  --text-head:    clamp(1.6rem, 1.2rem + 1.9vw, 2.4rem);
  --text-display: clamp(2.6rem, 1.4rem + 5vw, 5rem);       /* ≤ 6rem 天井 */

  --lh-tight:  1.22;
  --lh-head:   1.42;
  --lh-body:   1.85;      /* 和文本文は息を多めに */

  --track-caps:   0.2em;  /* オールキャップス・ラベル/ワードマーク */
  --track-label:  0.14em;
  --track-mincho: 0.04em;

  /* ── Space · 4pt ──────────────────────────────────────── */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --space-9: 96px; --space-10: 128px; --space-11: 176px; --space-12: 240px;

  --measure:    40ch;   /* 和文本文の測り */
  --measure-en: 66ch;

  /* ── Shape / hairline ─────────────────────────────────── */
  --radius-0: 0px;
  --radius-1: 2px;
  --hair: 1px;

  /* ── Motion · ease-out 指数、bounce 無し ───────────────── */
  --ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --dur-1: 200ms; --dur-2: 400ms; --dur-3: 700ms; --dur-4: 1100ms;

  /* ── z-index scale（意味づけ） ─────────────────────────── */
  --z-base: 0; --z-header: 100; --z-overlay: 200;
  --z-modal-backdrop: 300; --z-modal: 310; --z-toast: 400; --z-tooltip: 500;

  /* ── Page frame ───────────────────────────────────────── */
  --pad-x: clamp(20px, 6vw, 112px);
  --maxw: 1180px;
}