/* ==========================================================
   HOWGUAN DESIGN TOKENS v1 · Swiss Systematic
   來源:howguan-design-spec.md §1–§2 / howguan-design-system.html
   所有頁面先載入本檔,再載入 components.css
   ========================================================== */
:root{
  /* Brand */
  --hg-indigo-700:#3730A3;
  --hg-indigo-600:#4F46E5;   /* 主色 */
  --hg-indigo-400:#818CF8;   /* 深色模式主色替身 */
  --hg-indigo-100:#E0E7FF;
  --hg-orange-600:#E8551E;   /* CTA hover */
  --hg-orange-500:#FF6B35;   /* CTA(每畫面最多一顆,面積 <10%) */
  --hg-orange-100:#FFE8DE;

  /* Status(語意鎖定,全系統一致:綠=成功/有效、琥珀=將到期/待補、紅=失敗/失效) */
  --hg-ok-600:#0B7C5C;
  --hg-ok-500:#10B981;
  --hg-ok-100:#D1FAE5;
  --hg-warn-600:#9A6604;
  --hg-warn-500:#F59E0B;
  --hg-warn-100:#FEF3C7;
  --hg-fail-600:#C22525;
  --hg-fail-500:#EF4444;
  --hg-fail-100:#FEE2E2;

  /* Neutral */
  --hg-ink:#1E1B34;          /* 主文字、強調分隔線 */
  --hg-ink-soft:#5B5876;     /* 次要文字 */
  --hg-ink-mute:#9490AD;     /* 弱文字、placeholder、表頭 */
  --hg-line:#E1E0EA;         /* 一般分隔線、表格線、輸入框邊框 */
  --hg-line-strong:#1E1B34;  /* 強調線(瑞士風簽名元素) */
  --hg-paper:#FAFAFC;        /* 頁面底 */
  --hg-card:#FFFFFF;         /* 卡片底 */

  /* Layout */
  --hg-radius:0px;           /* 零圓角 */
  --hg-radius-input:2px;     /* 全系統唯一圓角:輸入框 */
  --hg-space:8px;            /* 間距基數,一律 8 的倍數 */
  --hg-font:'Noto Sans TC',sans-serif;
  --hg-font-num:'Space Grotesk',monospace;  /* 金額、統計、日期、代碼 */
  --hg-shadow-float:0 10px 30px rgba(30,27,52,.15); /* 僅 Modal 與 Toast 可用 */
}

/* ---------- Reset & Base ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--hg-font);
  background:var(--hg-paper);
  color:var(--hg-ink);
  font-size:14px;
  line-height:1.6;
}
img{max-width:100%;display:block}
a{color:var(--hg-indigo-600)}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--hg-indigo-600);outline-offset:2px}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition:none !important;animation:none !important}
}

/* ---------- 字體階層(spec §2) ---------- */
.t-h1{font-size:28px;font-weight:900;line-height:1.3}
.t-h2{font-size:20px;font-weight:900;line-height:1.35}
.t-h3{font-size:16px;font-weight:700}
.t-body{font-size:14px;font-weight:400}
.t-sub{font-size:13px;color:var(--hg-ink-soft)}
.t-cap{font-size:11px;font-weight:700;color:var(--hg-ink-mute);letter-spacing:.08em}
.mono,.num{font-family:var(--hg-font-num)}
.num-lg{font-family:var(--hg-font-num);font-size:30px;font-weight:700;letter-spacing:-.02em}