/* ============================================================
   tokens.css — 設計 token（換膚只改這一檔）
   v7 預設主題：「墨・和紙・金」東方靜奢（= v6a 勝出版配色）

   規則（Phase 1 鐵則）：
   - 所有顏色都在這裡，base.css 一律用 var(--token)，不寫死 hex。
   - 深色模式只「覆寫同一組 token」，不另寫一套 selector。
   - 換主題 = 複製這檔改值，或在 index.html 換掉這支 <link>。
   ============================================================ */

:root {
  /* 主強調（歷史變數名沿用 --green，實際為金/青銅，換主題時改值即可） */
  --green: #8F806B;        /* 金（主強調） */
  --green-d: #746E67;      /* 青銅（hover／深，淺底可讀） */
  --green-bg: #ECEAE5;     /* 金 淺底 */

  /* 表面 */
  --page: #F0EDE9;         /* 和紙 暖米白（頁底） */
  --card: #FCFBF9;         /* 紙 暖白（卡片） */

  /* 文字 */
  --fg: #393632;           /* 墨 主文 */
  --fg-soft: #746E67;      /* 暖次文字 */
  --ink: #393632;          /* 墨 內文 */
  --muted: #857F76;        /* 暖弱化 */
  --muted-light: #A8A199;  /* 暖更弱 */

  /* 界線 / 連結 */
  --border: #DEDBD2;
  --border-d: #CEC8BE;
  --link: #746E67;

  /* 形狀 / 陰影 */
  --radius: 12px;
  --shadow-sm: 0 1px 2px rgba(40, 33, 20, 0.05);
  --shadow-md: 0 4px 16px rgba(40, 33, 20, 0.10);

  /* 語意色（callout 用，深色在下方覆寫） */
  --note-bg: #E7EDE9;      --note-bd: #CFE0D7;  --note-bar: #38604F;  --note-head: #2C4D3F;
  --warn-bg: #FBF1DE;      --warn-bd: #EBDCB5;  --warn-bar: #D89A2C;  --warn-head: #7A5A1C;
  --important-bg: #F7E7E4; --important-bd: #EBD0CC; --important-bar: #B4564C; --important-head: #8F3F37;

  /* 內文元素 */
  --code-bg: #f1f3f5;  --code-fg: #c2410c;     /* 行內 code */
  --pre-bg: #1f2329;   --pre-fg: #e8eaed;      /* code 區塊（終端風，深淺一致） */
  --np-bg: #ECEAE5;                            /* 路徑膠囊底 */
  --h2-rule: #ECEAE5;                          /* h2 底線 */
  --collapse-open-bg: #EEEAE5;                 /* 摺疊展開底 */
  --hero-top: #ECEAE5;                         /* 首頁 hero 漸層頂（暖米，貼 bronze 主題） */
}

/* 深色：只覆寫同一組 token */
html[data-theme="dark"] {
  --green: #AFA48B;
  --green-d: #C2BCB6;
  --green-bg: rgba(175, 164, 139, 0.16);
  --page: #151413;
  --card: #1C1B1A;
  --fg: #EEEAE5;
  --fg-soft: #C2BCB6;
  --ink: #EEEAE5;
  --muted: #9A938A;
  --muted-light: #706B66;
  --border: #45423F;
  --border-d: #57534F;
  --link: #C2BCB6;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.5);

  --note-bg: rgba(56, 96, 79, 0.20);   --note-bd: #3C5A4C;  --note-bar: #6FAE8F;  --note-head: #8FC4AC;
  --warn-bg: rgba(216, 154, 44, 0.15); --warn-bd: #5A4A22;  --warn-bar: #D89A2C;  --warn-head: #E6B65A;
  --important-bg: rgba(180, 86, 76, 0.18); --important-bd: #5A3A36; --important-bar: #C56A60; --important-head: #DD8A80;

  --code-bg: #383633;  --code-fg: #E0B97A;
  --pre-bg: #1f2329;   --pre-fg: #e8eaed;
  --np-bg: #383633;
  --h2-rule: #45423F;
  --collapse-open-bg: #151413;
  --hero-top: #211D16;
}