/* saQutto Design System — Foundations v2 (ロゴ基準 / Green + Magenta)
   出典: Claude Design 2026-07-24 / 旧インディゴ基調は廃止

   上流（語彙の正）= design-system/styles.css（Claude Design プロジェクト saqutto3-design のミラー）。
   このファイルはその実装への唯一の配給コピー。値を変えるときは DS 側を先に直す。
   運用ルールは design-system/SYNC.md。 */
:root {
  /* ブランド(Primary グリーン) */
  --green-50: oklch(0.96 0.02 158);
  --green-100: oklch(0.94 0.04 158);
  --green-300: oklch(0.72 0.10 158);
  --green-500: oklch(0.52 0.12 158);
  --green-600: oklch(0.45 0.12 158);
  --green-700: oklch(0.37 0.10 158);
  --primary: var(--green-500);
  --primary-hover: var(--green-600);
  --primary-active: var(--green-700);
  /* アクセント(マゼンタ) */
  --magenta-100: oklch(0.94 0.06 352);
  --magenta-500: oklch(0.58 0.22 352);
  --magenta-700: oklch(0.48 0.20 352);
  --accent: var(--magenta-500);
  /* ニュートラル(L: 0.18/0.26/0.34/0.40/0.55/0.68/0.78/0.88/0.93/0.965)
     --ink-strong と --n-350 は DS 側で 2026-07-29 に追加された段(main 742fb73 / PR #496)。
     n-300(0.88)→n-400(0.68) が 0.20 空いており、--ink より濃い段も無かったため、
     実装がそこを生 hex(#111・#bbb 等)で埋め続けていた。 */
  --ink-strong: oklch(0.18 0.010 255);
  --ink: oklch(0.26 0.008 255);
  --n-700: oklch(0.40 0.008 255);
  --n-500: oklch(0.55 0.010 255);
  --n-400: oklch(0.68 0.007 255);
  --n-350: oklch(0.78 0.007 255);
  --n-300: oklch(0.88 0.006 255);
  --n-200: oklch(0.93 0.005 255);
  --n-100: oklch(0.965 0.004 250);
  --surface: #ffffff;
  --charcoal: oklch(0.34 0.01 255);
  /* セマンティック(状態) */
  --success: oklch(0.58 0.13 155);  --success-bg: oklch(0.95 0.05 155);  --success-border: oklch(0.85 0.08 155);
  --warning: oklch(0.62 0.13 80);  --warning-bg: oklch(0.96 0.06 80);  --warning-border: oklch(0.85 0.10 80);
  --danger: oklch(0.55 0.20 27);  --danger-bg: oklch(0.96 0.05 27);  --danger-border: oklch(0.85 0.09 27);
  --info: oklch(0.52 0.12 250);  --info-bg: oklch(0.95 0.04 250);  --info-border: oklch(0.85 0.07 250);
  /* タイポグラフィ */
  --font-ui: 'Noto Sans JP','Hiragino Kaku Gothic ProN','Hiragino Sans',sans-serif;
  --font-mono: 'Space Mono',ui-monospace,monospace;
  --fs-display: 32px;  --fw-display: 900;
  --fs-h1: 24px;  --fw-h1: 900;
  --fs-h2: 20px;  --fw-h2: 700;
  --fs-body-l: 16px;  --fw-body-l: 500;
  --fs-body: 14px;  --fw-body: 400;
  --fs-caption: 12px;  --fw-caption: 500;
  /* --fw-* (6個) は impl-only。DS は要素ルール(例: h1 の font-weight 直書き)で持つためトークン化
     されていない。DS へ書き戻さない（DesignSync は差分検知ができず往復コストが高いため）。 */
  --lh-heading: 1.3;
  --lh-body: 1.7;
  /* スペーシング(4px基準) */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  /* 角丸 */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-full: 999px;
  /* 影(elevation) */
  --sh-sm: 0 1px 2px rgba(0,0,0,0.05);
  --sh-md: 0 4px 12px rgba(0,0,0,0.08);
  --sh-lg: 0 12px 32px rgba(0,0,0,0.14);
}