/* 生成物（手で直さない）: node scripts/gen-tokens.mjs が shared/design-tokens.json と site/src/styles/theme.css（色） から書く。--check で一致を preflight が見る（D-81） */
/* ツール群用（別 Worker・CSP で inline 不可）。site.css より先に読む */
:root {
  /* @colors theme.css の写し */
  --paper: #fbf6ec;
  --band: #f4ecdb;
  --card: #fffdf6;
  --ink: #262016;
  --body: #6b6152;
  --read: #4a4134;
  --faint: #7a6852;
  --line: #e5dcc8;
  --line-strong: #c9bca1;
  --accent: #e8622c;
  --accent-strong: #b6461b;
  --on-ink: #d9cdb4;
  --on-ink-muted: #ab9a80;
  /* @colors:end */
  /* 字（--t-<段> サイズ・-lh 行間・-w 太さ）。12px 未満は作らない（--t-min が下限） */
  --t-display: clamp(34px, calc(27.7391px + 1.7391vw), 50px);
  --t-display-lh: 1.3;
  --t-display-w: 900;
  --t-title: clamp(28px, calc(24.8696px + 0.8696vw), 36px);
  --t-title-lh: 1.35;
  --t-title-w: 900;
  --t-section: clamp(22px, calc(20.4348px + 0.4348vw), 26px);
  --t-section-lh: 1.45;
  --t-section-w: 700;
  --t-item: clamp(17px, calc(16.6087px + 0.1087vw), 18px);
  --t-item-lh: 1.5;
  --t-item-w: 700;
  --t-lead: clamp(16px, calc(15.6087px + 0.1087vw), 17px);
  --t-lead-lh: 1.85;
  --t-body: 16px;
  --t-body-lh: 1.8;
  --t-read: 17px;
  --t-read-lh: 1.95;
  --t-caption: 13px;
  --t-caption-lh: 1.6;
  --t-min: 12px;
  --t-min-lh: 1.6;
  /* 読みやすさ（ツール群の既存名・readability.md） */
  --font-body: 17px;
  --font-body-sub: 15px;
  --font-input: 16px;
  --measure: 680px;
  /* 余白の段階 */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 72px;
  --s-9: 112px;
  /* 角丸（2 段だけ） */
  --r-frame: 4px;
  --r-pill: 999px;
  /* 罫（色は theme.css のトークン） */
  --rule: 1px solid var(--line);
  --rule-frame: 1px solid var(--line-strong);
  --rule-state: 2px solid var(--accent);
  /* 影（増やさない） */
  --shadow-card: 0 8px 24px rgba(38, 32, 22, 0.08);
  /* モーション（意味名）。--m-<名> 長さ・--m-<名>-ease 緩急 */
  --ease-out: cubic-bezier(0.2, 0.7, 0.3, 1);
  --ease-settle: cubic-bezier(0.3, 0, 0.2, 1);
  --ease-draw: cubic-bezier(0.45, 0, 0.2, 1);
  --ease-drop: cubic-bezier(0.55, 0, 0.9, 0.45);
  --m-press: 100ms;
  --m-press-ease: ease;
  --m-hover: 180ms;
  --m-hover-ease: var(--ease-out);
  --m-swap: 160ms;
  --m-swap-ease: var(--ease-out);
  --m-demo: 420ms;
  --m-demo-max: 500ms;
  --m-demo-ease: var(--ease-out);
  --m-hero: 700ms;
  --m-hero-ease: var(--ease-draw);
  --m-page: 180ms;
  --m-page-ease: ease;
  /* 動く量（N25/N28 の名前） */
  --lift: -3px;
  --lift-sm: -2px;
  --nudge: 3px;
  --press: 0.985;
  --motion-rise: 14px;
  --reveal-span: 30;
  --stagger-step: 8;
  /* ブレークポイント（メディアクエリは var() を読めない＝CSS は同じ数値を直書きする。ここは数値の正） */
  --bp-phone: 360px;
  --bp-narrow: 640px;
  --bp-tablet: 760px;
  --bp-wide: 1080px;
  --bp-desktop: 1280px;
  /* 互換名（N28）→ 意味名。新しい CSS は右側を使う */
  --hover-ms: var(--m-hover);
  --hover-ease: var(--ease-out);
  --press-ms: var(--m-press);
}
