/* ============================================================
   nokaji デザインシステム — 共有 canonical トークン  v1.0.3
   ------------------------------------------------------------
   Astro 本体 + 独立 PWA(moshi / warmup) + トップ(public/index.html) が
   共通参照する唯一の真実。

   v1.0.3 変更（2026-08-18）: **コントラストの床割れ 2 件を修正**。
     --nk-mute #8a8073 → #71695f   （和紙 3.63:1 → 5.05:1／沈め面 3.24:1 → 4.51:1）
     --nk-warn #b7791f → #9b671a   （和紙 3.41:1 → 4.52:1）
     どちらも色相・彩度は保持し、**実際に使われている全ての地で 4.5:1 を満たす
     最も明るい値**を計算探索して選んだ（存在感を捨てずに床だけ通す）。
     mute が満たす地 = 和紙 #faf7f2 5.05 / 沈め面 #f1eade 4.51 /
                      トップの沈め面 #efeae0 4.50 / 白カード #ffffff 5.40。
     ⚠️ 最初 #72695f を選んだが、トップの #efeae0 上で 4.49:1 と 0.01 足りず却下した。
        「主要な地 2 つ」で決めると足りない。**実在する地を全部集めてから決めること。**
     発見の経緯 = claude.ai/design のデザインシステムを作り直す際に全 18 用途を実測。
     影響 = 模試 / warmup / TOEIC の補助文・設問番号・タイマー・履歴・フッタ、
            および blog 本文の強調（.prose em）。実使用 19 箇所が床未満だった。
     ⚠️ 同型の事故は 2026-08-17 にも出ている（--ink3 #858c96 が 3.39:1）。
        原因も同じ＝**パレットを置き換えた時に、置き換え前が通していた検査を引き継がなかった。**
        恒久策 = 色を変えたら `Reports/nokaji_ds_rebuild_20260818/fix_plan.py` の要領で
        「実使用箇所を実 font-size 付きで」測り直す。トークン単体で測ると用途を見落とす。

   v1.0.2 変更: ブランド色を 藍 → 朱/forge(ember) に確定（CEO 6/13 採択 "B"）。
     根拠 = nokaji トップ(public/index.html)が既に「和紙 + 墨 + 朱」の鍛冶
     identity で完成済み。野鍛冶=炉で鉄を打つ→朱/炎が最も literal。
     ⇒ トップの既存パレットを canonical に採用し全 surface へ統一（色合い統一）。

   設計思想（reference: Reports/Sidehustle/nokaji_design_system_v0.1_20260613.md §0.5）
   = 機能美は「引き算 + 精度」。ただし ⚠️ warm-functional（CEO「削りすぎ注意」）。
     朱×墨×和紙は鍛冶=用の美の温かい配色。

   ⚠️ 機能アプリ(模試/ドリル)の主ボタンは **--nk-ink(墨)** を使う。
     朱(--nk-accent)は「誤答=赤 / 警告=琥珀」と色相が近いので、test 文脈では
     朱を **アクセント限定**（ブランドマーク・リンク・開始/次の一歩 CTA）にして
     主ボタン=墨で意味色と分離する。マーケ/トップは朱 CTA で可（feedback 色が無いため）。

   ⚠️ 意味色（ok / danger / warn）を淡く敷いた面の上に、同じ色の文字を置かないこと。
     10% で敷くだけで ok 4.13:1 / danger 4.40:1 まで落ちる（実測）。地は白か和紙のまま、
     囲みたい時は罫線で囲む。

   ⚠️ 沈め面 --nk-paper-2 の上に置いてよいのは墨系だけ。
     朱 4.26:1 / warn 4.04:1 / ok 4.18:1 はいずれも床未満（実測）。
     沈め面の上で朱を使う時は --nk-accent-deep（6.20:1）。

   ⚠️ ファイル名バージョン化 = SW / nginx(WEXAL) cache 事故の予防（教訓 6/12）。
     色や値を変えたら -1.0.4.css 等にリネームして参照側も差し替える。
     参照側 = public/moshi/index.html・public/warmup/index.html・public/warmup/sw.js
              （sw.js は ASSETS の path と CACHE 名の両方）・src/styles/global.css の @theme
   ============================================================ */

:root {
  /* ── 基底：warm 和紙ペーパー + 墨（トップと同値）── */
  --nk-paper:        #faf7f2;   /* 基底背景・和紙の温白 */
  --nk-paper-2:      #f1eade;   /* 一段沈めた面（strip / table th） */
  --nk-ink:          #2b2926;   /* 主テキスト・見出し・機能アプリ主ボタン（墨） */
  --nk-ink-2:        #5c554d;   /* 副テキスト */
  --nk-mute:         #71695f;   /* 補助・キャプション（v1.0.3 で #8a8073 から修正） */
  --nk-line:         #e4ddd2;   /* 罫線・カード境界（warm hairline） */
  --nk-line-strong:  #d6ccbb;   /* 濃いめ区切り（稀） */

  /* ── ブランドアクセント = 朱/forge(ember) ※セマンティック命名 --nk-accent ──
        マーケ=CTA可 / 機能アプリ=アクセント限定（主ボタンは墨）── */
  --nk-accent:       #b4502a;   /* 朱 primary：ブランドマーク / リンク / 開始CTA / 強調 */
  --nk-accent-deep:  #8f3c1f;   /* 深い朱：pressed / 本文リンク / 沈め面の上の朱文字 */
  --nk-accent-soft:  #d97742;   /* 朱 soft：hover halo / 明るい差し色。⚠️ 文字に使わない(2.95:1) */
  --nk-accent-wash:  rgba(180,80,42,0.08); /* 淡い面・ハイライト */

  /* ── 機能色：意味を持つ色（装飾でない・ブランド色と独立・削らない）── */
  --nk-ok:           #2f7d5a;   /* 正解（緑・和紙 4.68:1） */
  --nk-danger:       #c0392b;   /* 誤答・エラー（赤・和紙 5.09:1） */
  --nk-warn:         #9b671a;   /* ペース警告（琥珀・v1.0.3 で #b7791f から修正） */

  /* ── 副アクセント：稀なデータ可視化のみ（本文 / CTA に使わない）── */
  --nk-cyan:         #357a8d;
  --nk-violet:       #6f6594;

  /* ── タイポ（デジタル庁公式準拠：本文 Noto Sans JP / 行高 1.6+）── */
  --nk-font-display: 'Zen Kaku Gothic New','Noto Sans JP',system-ui,-apple-system,sans-serif; /* 見出し */
  --nk-font-body:    'Noto Sans JP','游ゴシック体','Yu Gothic','Hiragino Sans',system-ui,-apple-system,sans-serif; /* 本文 */
  --nk-font-mono:    'JetBrains Mono',ui-monospace,'SFMono-Regular',Consolas,monospace; /* 数字・クロック */
  --nk-leading-body:  1.85;
  --nk-leading-tight: 1.3;
  --nk-tracking-tight: -0.02em;

  /* ── 余白：潤沢に（Stripe 原理）── */
  --nk-space-1:  4px;  --nk-space-2:  8px;  --nk-space-3: 12px; --nk-space-4: 16px;
  --nk-space-5: 20px;  --nk-space-6: 24px;  --nk-space-8: 32px; --nk-space-10:40px;
  --nk-space-12:48px;  --nk-space-16:64px;  --nk-space-20:80px;

  /* ── 角丸：適度な丸み = warmth ── */
  --nk-radius-sm:   8px;
  --nk-radius-md:  12px;
  --nk-radius-lg:  16px;
  --nk-radius-xl:  24px;
  --nk-radius-pill:9999px;

  /* ── 影：ほぼフラット（盛らない）── */
  --nk-shadow-card: 0 1px 0 rgba(43,41,38,.02);
  --nk-shadow-pop:  0 8px 24px -12px rgba(43,41,38,.16);

  /* ── モーション：やさしい ── */
  --nk-ease:       cubic-bezier(.2,.7,.2,1);
  --nk-dur-quick:  150ms;
  --nk-dur-base:   220ms;

  /* ── タップ最小：機能アプリの death-line（WCAG）── */
  --nk-tap-min:    44px;
}