/* ============================================================
 * design-tokens.css — L0 Shared Root (全站設計變數唯一根)
 * ------------------------------------------------------------
 * 建立：2026-05-24 · Stage 0 of LAVENTIS-VISUAL-REFACTOR-DEBT-PLAN
 * 定位：全站設計變數的單一真實來源 (single source of truth)。
 *       L1 quiz-tokens / L2 laventis-console / L3 report-analytics
 *       與所有頁面最終都引用本檔，逐步退役各自的重複定義。
 *
 * 採用原則：所有數值一律「收斂自既有檔的實測值」，不發明新數值。
 *   - 色 / 字級 / 間距 / 圓角 / 陰影 / 動效 / 觸控 ← quiz-tokens.css
 *   - 語義訊號色 (signal-*) ← laventis-console.css (promote 為全站共用)
 *   - 六人格識別色 ← persona-tokens.css
 *   - 字型家族 ← console + brand-intro + persona-card (本就一致)
 *
 * ⚠ 非破壞性新增：截至 Stage 0，尚無任何頁面 <link> 本檔。
 *    Stage 1 起，模板隨遷移逐步接上，再退役 inline / 重複 token。
 *
 * 【品牌分歧 · 金色已鎖定 2026-05-24】盤點發現兩處平行 token：
 *   - 金色：✅ 鎖定 #C8A96A 古銅 為品牌主題色（2026-06 起）。理由：主力
 *     業務之一為「傳統製造業轉型半導體電子供應鏈」，古銅銜接傳統金屬工藝
 *     與半導體電子未來。console #d4a84f 退為會員情境 override（保留於
 *     laventis-console.css），不再視為品牌主色。
 *   - 底色：global 維持 #060e1a（近黑）為 canonical；console #0b1f3b 為情境
 *     override。註：新 B2B 供應鏈形象頁將採古銅調背景（page-level，參考
 *     Stitch 設計稿），屬該頁專屬處理，不改 global bg。
 * ============================================================ */

:root {
  /* ===== 品牌核心色 (canonical · 採 public/quiz 品牌主色) ===== */
  --bg-base:        #060e1a;                 /* 全站底 */
  --bg-card:        rgba(12, 31, 59, 0.72);
  --bg-card-hover:  rgba(18, 34, 58, 0.82);
  --text-primary:   #e8e0d4;
  --text-dim:       #8a9ab5;
  --text-muted:     #5a6a85;

  /* ===== 金色系 (品牌主色) ===== */
  --gold:        #C8A96A;
  --gold-soft:   rgba(200, 169, 106, 0.12);
  --gold-glow:   0 0 24px rgba(200, 169, 106, 0.28);
  --gold-line:   rgba(200, 169, 106, 0.18);

  /* ===== 語義訊號色 (promote 自 console · 跨 public/member/report 共用) ===== */
  --signal-up:        #4ec9a8;   /* 信心↑、paid、成功、訊號正向 */
  --signal-up-soft:   rgba(78, 201, 168, 0.12);
  --signal-down:      #e85b5b;   /* 信心↓、failed、警示、訊號反轉 */
  --signal-down-soft: rgba(232, 91, 91, 0.12);
  --signal-warn:      #e8a85b;   /* 待處理、即將過期、需要決策 */
  --signal-warn-soft: rgba(232, 168, 91, 0.12);
  --signal-info:      #5b9bd9;   /* 中性事實（日期、ID、無方向性數字）*/
  --signal-neutral:   #8a9ab5;   /* ghost data、提示、灰字 */

  /* ===== Legacy 安全 / 警示色 (quiz · unlock/fail 情境)
     遷移時與 signal-up/down 收斂；現階段並存以維持相容 ===== */
  --safe:        #4a9a6a;
  --safe-soft:   rgba(106, 200, 150, 0.12);
  --safe-glow:   0 0 24px rgba(106, 200, 150, 0.28);
  --safe-line:   rgba(106, 200, 150, 0.22);
  --danger:      #c0392b;
  --danger-soft: rgba(212, 131, 106, 0.10);
  --danger-glow: 0 0 24px rgba(212, 131, 106, 0.22);
  --danger-line: rgba(212, 131, 106, 0.20);

  /* ===== 六人格識別色 (promote 自 persona-tokens · WCAG AA ≥4.5:1 on #060e1a) ===== */
  --persona-visionary: #7B6EF6;  /* 紫水晶 — 先見 */
  --persona-operator:  #4FA8D5;  /* 冷藍 — 撐住 */
  --persona-builder:   #E8834A;  /* 琥珀 — 系統秩序 */
  --persona-analyst:   #5BC8A0;  /* 青翡 — 精算校準 */
  --persona-catalyst:  #D45E7A;  /* 火焰珊瑚 — 點火 */
  --persona-adapter:   #B8A86E;  /* 石黃 — 隨形變化 */
  --persona-card-bg:     rgba(8, 20, 40, 0.88);
  --persona-card-border: rgba(255, 255, 255, 0.08);
  --persona-card-radius: 16px;

  /* ===== Typography · 四層字型棧 (families 全站一致) ===== */
  --font-body:  "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;  /* 中文 body */
  --font-brand: "Cormorant Garamond", "Noto Serif TC", Georgia, serif;                        /* 品牌標題、大字 */
  --font-label: "Raleway", "Noto Sans TC", sans-serif;                                         /* nav / chip / label */
  --font-mono:  "DM Mono", ui-monospace, "Courier New", monospace;                             /* 數字 / id / timestamp */

  /* ===== 字級階 (收斂自 quiz · L3 實機值；單位 px) ===== */
  --fs-tag:       11px;   --fs-kicker:    11px;   --fs-label:    12px;   --fs-note:     13px;
  --fs-body:      15px;   --fs-core:      16px;   --fs-body-lg:  18px;
  --fs-title-sm:  22px;   --fs-title:     24px;   --fs-display:  30px;
  --fs-hero:      38px;   --fs-hero-lg:   42px;   --fs-hero-xl:  52px;

  /* Mobile 字級 (@media max-width:600px 使用 · 原則：盡量不縮) */
  --fs-body-m:    15px;   --fs-body-lg-m: 18px;   --fs-core-m:   16px;
  --fs-title-sm-m:20px;   --fs-title-m:   22px;   --fs-display-m:26px;
  --fs-hero-m:    30px;   --fs-hero-lg-m: 36px;

  /* ===== 間距階 (8px 基數) ===== */
  --space-1:  4px;   --space-2:  8px;   --space-3:  12px;  --space-4:  16px;
  --space-5:  22px;  --space-6:  28px;  --space-8:  40px;

  /* ===== 圓角 ===== */
  --radius-card:  14px;   --radius-btn:  12px;   --radius-tag:  999px;

  /* ===== 陰影 (由淺入深) ===== */
  --shadow-soft:         0 2px 10px rgba(0, 0, 0, 0.18);
  --shadow-card:         0 8px 24px rgba(0, 0, 0, 0.28);
  --shadow-card-strong:  0 8px 32px rgba(0, 0, 0, 0.4);
  --shadow-lift:         0 14px 38px rgba(0, 0, 0, 0.38);

  /* ===== 動效曲線與時長 ===== */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);   /* 進場、reveal */
  --ease-inout:  cubic-bezier(0.4, 0, 0.2, 1);     /* 元件狀態切換 */
  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);    /* meter fill、bar（彈出感）*/
  --dur-fast:    160ms;   --dur-base:    240ms;   --dur-slow:    420ms;   --dur-reveal:  700ms;

  /* ===== 觸控 / 互動 ===== */
  --min-touch:          44px;   /* 全站下限 */
  --min-touch-m:        52px;   /* 行動端選項 */
  --min-touch-m-coarse: 56px;   /* hover:none ∧ pointer:coarse */
}

/* ===== 人格 data-attribute 映射 → --persona-color ===== */
[data-persona="VISIONARY"] { --persona-color: var(--persona-visionary); }
[data-persona="OPERATOR"]  { --persona-color: var(--persona-operator); }
[data-persona="BUILDER"]   { --persona-color: var(--persona-builder); }
[data-persona="ANALYST"]   { --persona-color: var(--persona-analyst); }
[data-persona="CATALYST"]  { --persona-color: var(--persona-catalyst); }
[data-persona="ADAPTER"]   { --persona-color: var(--persona-adapter); }

/* ===== a11y · reduced-motion 全站守則 ===== */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast:   0ms;
    --dur-base:   0ms;
    --dur-slow:   0ms;
    --dur-reveal: 0ms;
  }
}