/* 火榜主題 token（2026-10-11，深色＝方案 B 石墨＋藏青）
 * 淺色值＝現行冷白・藏青，改版前後淺色畫面不變。
 * 深色只在使用者手動切換時套用（:root[data-theme="dark"]），不跟隨系統 prefers-color-scheme（2026-10-11 使用者決定）。
 * 共用樣式用 var(--hb-*)；各頁寫死的顏色由 theme.js 在深色時產生覆蓋表（見該檔說明）。 */
:root{
  --hb-bg:#f4f6f9; --hb-surface:#ffffff; --hb-raised:#eef3fb; --hb-sunk:#f3f4f6;
  --hb-fg:#1f1d18; --hb-fg-2:#4a4f59; --hb-fg-3:#5b6370; --hb-ink:#15130f;
  --hb-line:#dfe4ec; --hb-line-strong:#8a96a8;
  --hb-accent:#1e3a5f; --hb-accent-ink:#ffffff; --hb-link:#1e3a5f;
  --hb-flame:#c0392b; --hb-flame-bg:#fdecea;
  --hb-ok:#15803d; --hb-ok-bg:#e8f7ee; --hb-bad:#b42318; --hb-bad-bg:#fdecea;
  --hb-warn:#8a4b12; --hb-warn-bg:#fdf3e3; --hb-mark:#15202e; --hb-mark-bg:#e4ecf7;
  --hb-gold:#8a6a1f; --hb-exam:#1f6b45; --hb-exam-bg:#eef6f0;
  --hb-shadow:rgba(16,24,40,.14);
}
:root[data-theme="dark"]{
  --hb-bg:#111315; --hb-surface:#181b1f; --hb-raised:#20242a; --hb-sunk:#15181b;
  --hb-fg:#e8eaed; --hb-fg-2:#bec3cb; --hb-fg-3:#a9b0ba; --hb-ink:#e8eaed;
  --hb-line:#2a2f36; --hb-line-strong:#6d7581;
  --hb-accent:#7eaef0; --hb-accent-ink:#0e1013; --hb-link:#8fb9f3;
  --hb-flame:#ff9890; --hb-flame-bg:#341a1b;
  --hb-ok:#7ccf9c; --hb-ok-bg:#14291d; --hb-bad:#ff9890; --hb-bad-bg:#341a1b;
  --hb-warn:#e9be76; --hb-warn-bg:#2e2513; --hb-mark:#f0f3f7; --hb-mark-bg:#1c2e48;
  --hb-gold:#d3b06b; --hb-exam:#83cca2; --hb-exam-bg:#13251d;
  --hb-shadow:rgba(0,0,0,.5);
  color-scheme:dark;
}

/* 頂欄切換鈕 44×44（theme.js 掛進頂欄右側） */
.hb-theme-wrap{position:relative;display:inline-flex;align-items:center;flex:0 0 auto}
.hb-theme-btn{appearance:none;-webkit-appearance:none;display:inline-grid;place-items:center;width:44px;height:44px;margin:0 2px;padding:0;border:0;border-radius:12px;background:transparent;color:var(--hb-fg-2);cursor:pointer;font:inherit;transition:background-color .15s cubic-bezier(.22,1,.36,1),color .15s cubic-bezier(.22,1,.36,1)}
.hb-theme-btn:hover{background:var(--hb-raised);color:var(--hb-fg)}
.hb-theme-btn:active{transform:scale(.96)}
.hb-theme-btn:focus-visible{outline:2px solid var(--hb-link);outline-offset:2px}
.hb-theme-btn svg{display:block;width:20px;height:20px}
.hb-theme-btn .hb-ti-sun{display:none}
.hb-theme-btn[data-dark="1"] .hb-ti-sun{display:block}
.hb-theme-btn[data-dark="1"] .hb-ti-moon{display:none}
.hb-theme-pop{position:absolute;top:calc(100% + 6px);right:0;z-index:400;min-width:168px;padding:8px;background:var(--hb-surface);border:1px solid var(--hb-line);border-radius:12px;box-shadow:0 12px 32px var(--hb-shadow)}
.hb-theme-pop[hidden]{display:none}
.hb-theme-pop-t{font-size:12px;font-weight:700;color:var(--hb-fg-3);padding:4px 10px 6px;letter-spacing:.04em}
.hb-theme-pop button{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--hb-fg);font:500 15px/1.4 inherit;font-family:inherit;text-align:left;cursor:pointer}
.hb-theme-pop button::before{content:"";flex:0 0 auto;width:14px;height:14px;border-radius:50%;border:1.5px solid var(--hb-line-strong)}
.hb-theme-pop button[aria-checked="true"]{color:var(--hb-link);font-weight:700}
.hb-theme-pop button[aria-checked="true"]::before{border-color:var(--hb-link);background:radial-gradient(circle,var(--hb-link) 0 4px,transparent 4.5px)}
.hb-theme-pop button:hover{background:var(--hb-raised)}
.hb-theme-pop button:focus-visible{outline:2px solid var(--hb-link);outline-offset:-2px}
@media (max-width:420px){.hb-theme-btn{margin:0}nav.nav>.hb-theme-wrap{margin-left:-8px}}
@media (prefers-reduced-motion: reduce){.hb-theme-btn{transition:none}.hb-theme-btn:active{transform:none}}

/* 深色共用細節（只在深色生效；淺色畫面不受影響） */
:root[data-hb-dark]{color-scheme:dark}
:root[data-hb-dark] body{scrollbar-color:#3a4049 #111315}
:root[data-hb-dark] ::selection{background:#1c2e48;color:#f0f3f7}
/* 照片、掃描圖：降一點亮度，避免整塊白光；SVG 圖解與圖示不動（已由 theme.js 換色） */
:root[data-hb-dark] img:not([src$=".svg"]):not([src^="data:image/svg"]):not(.hb-nofilter){filter:brightness(.78) contrast(1.06)}
/* 頂欄產品標籤的分類連結用行內 opacity:.7 變淡，深色底上對比不足 */
:root[data-hb-dark] .nav-tag a{opacity:.9!important}
/* <mark> 只設底色時字色是瀏覽器預設黑：深色改淺字 */
:root[data-hb-dark] mark{color:#f0f3f7}
/* 讀書頁「標記熟悉度」平時半透明、展開箭頭 .55 透明：深色底上看不清，改不透明 */
:root[data-hb-dark] .mark-btn{opacity:1!important}
:root[data-hb-dark] .subj-caret,:root[data-hb-dark] .ch-caret{opacity:.9}
/* 頂欄放不下時（theme.js fit）收進漢堡選單當一列 */
.hb-ti-label{display:none}
.nav-links>.hb-theme-wrap.hb-theme-inmenu{display:none}
.nav.menu-open .nav-links>.hb-theme-wrap.hb-theme-inmenu{display:flex;width:100%}
.hb-theme-inmenu .hb-theme-btn{width:100%;height:auto;min-height:44px;display:flex;justify-content:flex-start;gap:10px;padding:0 12px;margin:0;font-size:.875rem;font-weight:600;color:inherit}
.hb-theme-inmenu .hb-ti-label{display:inline}
/* 刷題頁未開通科目卡整張 .55 透明：深色底上「需開通方案」字對比不足，深色改 .8 */
:root[data-hb-dark] .subj-card.locked{opacity:.8}
/* 頂欄沒空間又沒有漢堡選單的頁面（隱私／條款等）：左下角浮動鈕 */
.hb-theme-wrap.hb-theme-float{position:fixed;left:12px;bottom:12px;z-index:350}
.hb-theme-float .hb-theme-btn{background:var(--hb-surface);border:1px solid var(--hb-line);box-shadow:0 4px 14px var(--hb-shadow)}
.hb-theme-float .hb-theme-pop{top:auto;bottom:calc(100% + 6px);left:0;right:auto}

/* 淺色對比補強（2026-10-11 全量掃描：淺色原本就 <4.5:1 的小字）。只在淺色生效、只提高不透明度或加深同色相，其餘外觀不變。
 * 帳號 chip 的 ▾（auth.js 行內 opacity .55 → 4.0:1）、頂欄分區標籤（site-nav.js 行內 .7 → 4.4:1）、
 * 讀書頁「標記熟悉度」靜止態（.45 → 1.9:1；滑過卡片與觸控裝置照舊 1）、讀書頁側欄科目／章節 ▾（.55／.6 → 3.0／3.4:1） */
:root:not([data-hb-dark]) a[data-hb-chip] .hb-chip-txt + span{opacity:.6!important}
:root:not([data-hb-dark]) .nav-tag > a{opacity:.72!important}
:root:not([data-hb-dark]) .mark-btn:not(.on){opacity:.92}
:root:not([data-hb-dark]) .ch-body .art-card:hover .mark-btn,:root:not([data-hb-dark]) .ch-body article.card:hover .mark-btn{opacity:1}
:root:not([data-hb-dark]) .subj-caret,:root:not([data-hb-dark]) .ch-caret{opacity:.72}