/* reader-enhance.css — 讲解页统一增强（暗色变量兜底 + 主题按钮 + 移动端）
   2026-10-18 立。存在理由：84 篇讲解页的 CSS 是各自内联的，暗色变量表
   会随新学科/新组件漏项（geo 徽章、block-bg 就各漏过一次）。
   本文件在 </head> 最后加载，以同特异性覆盖 :root 变量，成为全站暗色的
   最后一道兜底；同时承载只在阅读端需要的移动端规则。

   维护规则：改这里 → 同步复制到库根 reader-enhance.css（本地 8899 用）。
   部署源在 _build/site-assets/，deploy.py 会自动带到站点根。 */

/* 亮色兜底：老内容页没有 page-shell 的这两个变量，而 SVG 底板已改用它们。
   值与 page-shell 的亮色完全一致，已有定义的页面不受影响。 */
:root{ --block-bg:#f3ede3; --tint:#ece2d2; }

/* ── 暗色变量并集：首页体系 + 老内容页体系 + page-shell 体系 ── */
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#1b1815; --surface:#231f19; --surface-2:#2b2620;
    --surface-3:#2f2a23; --surface-4:#272219; --ai-bg:#2b2419;
    --line:#3a332b; --line-2:#453d33; --line-3:#4a4034; --line-soft:#312b24;
    --line-strong:#4a4335;
    --text:#e9e3d9; --strong:#ded6c9; --body:#c4bbac;
    --muted:#a89e93; --faint:#948a7e; --faint-2:#756c61;
    --accent:#d9873a; --accent-deep:#eda45f; --accent-fg:#241c12;
    --gold:#e0a94f; --gold-soft:#2e2718;
    --up:#e06b5e; --down:#5fbf7f;
    --up-bg:#2f1e1c; --up-ln:#4c302c;
    --down-bg:#16261c; --down-ln:#2c483a;
    --warn:#e3ab5c; --warn-bg:#2d2314; --warn-ln:#463619;
    --done-bg:#182a20; --done-ln:#2c483a; --done:#74c795;
    --todo-bg:#2a2620; --todo-ln:#3a332b; --todo:#a89e93;
    --info-bg:#1a2130; --info-ln:#2b3850; --info:#93b3e0;
    --err-bg:#2f1e1c; --err-ln:#4c302c; --err:#e59a90;
    --qa:#a98cd0; --qa-ink:#c4a9e3;
    --ink:#e9e3d9; --ink-2:#a89e93; --card:#231f19; --sub:#a89e93;
    --navy:#9db4d8; --navy2:#8fa8cc;
    --ocean:#4ea8c7; --ocean-dark:#62b8d4; --ocean-light:#1a2a31;
    --red:#e0705f; --red-deep:#e08577; --red-soft:#3a2420;
    --danger:#e06b5e; --danger-light:#2f1e1c;
    --green:#5fbf7f; --green-light:#16261c; --green-soft:#1a2b21;
    --sand:#e0b45f; --sand-light:#2d2718;
    --purple:#9d94e8; --purple-2:#a29bef; --purple-light:#262438;
    /* page-shell 体系：这两项此前 43 页全漏，图例块/表头因此变白块 */
    --block-bg:#2b2620; --tint:#2f2a23;
    /* 首页体系 */
    --hover-ln:#5c4a33; --card-hover-ln:#4c4335;
    --desc:#b5aba0; --cp-k:#d3cabd; --label:#d3cabd; --notice:#b5aba0;
    --zone-h:#948a7e; --zone-line:#3a332b;
    --mf-name:#b5aba0; --mf-tag:#948a7e; --mf-dot:#4c4335;
    --files-bg:#201c17; --footer-bg:#1a1714; --mark-bg:#4a3a1c;
    --grain:rgba(255,255,255,.022);
    --sbar-bg:rgba(27,24,21,.93); --input-focus-bg:#2b2620;
    --focus-ring:rgba(217,135,58,.16);
    --hero-a:#26211a; --hero-b:#211c16; --hero-c:#1c1813;
    --hero-glow:rgba(217,135,58,.13);
    --mask-bg:rgba(0,0,0,.58);
    --sel-fg:#1b1815; --sel-bg:#d9873a;
    --bdg-econ-bg:#2e2418; --bdg-econ-ln:#4a3a22;
    --bdg-psy-bg:#241f2e;  --bdg-psy-ln:#3c3350;
    --bdg-hist-bg:#1c262b; --bdg-hist-ln:#2f4149;
    --bdg-soc-bg:#1f2a20;  --bdg-soc-ln:#334534;
    --bdg-tch-bg:#2a2518;  --bdg-tch-ln:#443c26;
    --bdg-geo-bg:#2a2521;  --bdg-geo-ln:#463c33;
    --bdg-next-bg:#242620; --bdg-next-ln:#3a3d34;
    --shadow:0 1px 2px rgba(0,0,0,.35), 0 4px 16px rgba(0,0,0,.40);
    --shadow-hi:0 2px 4px rgba(0,0,0,.40), 0 12px 28px rgba(0,0,0,.50);
    --shadow-stuck:0 4px 18px rgba(0,0,0,.45);
    --shadow-pop:0 12px 30px rgba(0,0,0,.55);
    --shadow-modal:0 24px 64px rgba(0,0,0,.62);
  }
}
:root[data-theme="dark"]{
  --bg:#1b1815; --surface:#231f19; --surface-2:#2b2620;
  --surface-3:#2f2a23; --surface-4:#272219; --ai-bg:#2b2419;
  --line:#3a332b; --line-2:#453d33; --line-3:#4a4034; --line-soft:#312b24;
  --line-strong:#4a4335;
  --text:#e9e3d9; --strong:#ded6c9; --body:#c4bbac;
  --muted:#a89e93; --faint:#948a7e; --faint-2:#756c61;
  --accent:#d9873a; --accent-deep:#eda45f; --accent-fg:#241c12;
  --gold:#e0a94f; --gold-soft:#2e2718;
  --up:#e06b5e; --down:#5fbf7f;
  --up-bg:#2f1e1c; --up-ln:#4c302c;
  --down-bg:#16261c; --down-ln:#2c483a;
  --warn:#e3ab5c; --warn-bg:#2d2314; --warn-ln:#463619;
  --done-bg:#182a20; --done-ln:#2c483a; --done:#74c795;
  --todo-bg:#2a2620; --todo-ln:#3a332b; --todo:#a89e93;
  --info-bg:#1a2130; --info-ln:#2b3850; --info:#93b3e0;
  --err-bg:#2f1e1c; --err-ln:#4c302c; --err:#e59a90;
  --qa:#a98cd0; --qa-ink:#c4a9e3;
  --ink:#e9e3d9; --ink-2:#a89e93; --card:#231f19; --sub:#a89e93;
  --navy:#9db4d8; --navy2:#8fa8cc;
  --ocean:#4ea8c7; --ocean-dark:#62b8d4; --ocean-light:#1a2a31;
  --red:#e0705f; --red-deep:#e08577; --red-soft:#3a2420;
  --danger:#e06b5e; --danger-light:#2f1e1c;
  --green:#5fbf7f; --green-light:#16261c; --green-soft:#1a2b21;
  --sand:#e0b45f; --sand-light:#2d2718;
  --purple:#9d94e8; --purple-2:#a29bef; --purple-light:#262438;
  --block-bg:#2b2620; --tint:#2f2a23;
  --hover-ln:#5c4a33; --card-hover-ln:#4c4335;
  --desc:#b5aba0; --cp-k:#d3cabd; --label:#d3cabd; --notice:#b5aba0;
  --zone-h:#948a7e; --zone-line:#3a332b;
  --mf-name:#b5aba0; --mf-tag:#948a7e; --mf-dot:#4c4335;
  --files-bg:#201c17; --footer-bg:#1a1714; --mark-bg:#4a3a1c;
  --grain:rgba(255,255,255,.022);
  --sbar-bg:rgba(27,24,21,.93); --input-focus-bg:#2b2620;
  --focus-ring:rgba(217,135,58,.16);
  --hero-a:#26211a; --hero-b:#211c16; --hero-c:#1c1813;
  --hero-glow:rgba(217,135,58,.13);
  --mask-bg:rgba(0,0,0,.58);
  --sel-fg:#1b1815; --sel-bg:#d9873a;
  --bdg-econ-bg:#2e2418; --bdg-econ-ln:#4a3a22;
  --bdg-psy-bg:#241f2e;  --bdg-psy-ln:#3c3350;
  --bdg-hist-bg:#1c262b; --bdg-hist-ln:#2f4149;
  --bdg-soc-bg:#1f2a20;  --bdg-soc-ln:#334534;
  --bdg-tch-bg:#2a2518;  --bdg-tch-ln:#443c26;
  --bdg-geo-bg:#2a2521;  --bdg-geo-ln:#463c33;
  --bdg-next-bg:#242620; --bdg-next-ln:#3a3d34;
  --shadow:0 1px 2px rgba(0,0,0,.35), 0 4px 16px rgba(0,0,0,.40);
  --shadow-hi:0 2px 4px rgba(0,0,0,.40), 0 12px 28px rgba(0,0,0,.50);
  --shadow-stuck:0 4px 18px rgba(0,0,0,.45);
  --shadow-pop:0 12px 30px rgba(0,0,0,.55);
  --shadow-modal:0 24px 64px rgba(0,0,0,.62);
}

/* ── 正文裸链接：page-shell 没给 a 设色，暗色下会掉成浏览器默认深蓝（1.88:1） ── */
main a:not([class]){
  color:var(--accent-deep,var(--accent));
  text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;
}
main a:not([class]):hover{color:var(--accent);text-decoration-thickness:2px}

/* ── 档位徽章：page-shell 的浅底深字在暗色下像三块灯，换成深底亮字 ── */
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .f.m{background:#1c2b22;color:#74c795;border-color:#2c483a}
  :root:not([data-theme="light"]) .f.i{background:#2d2314;color:#e3ab5c;border-color:#463619}
  :root:not([data-theme="light"]) .f.u{background:#1a2130;color:#93b3e0;border-color:#2b3850}
}
:root[data-theme="dark"] .f.m{background:#1c2b22;color:#74c795;border-color:#2c483a}
:root[data-theme="dark"] .f.i{background:#2d2314;color:#e3ab5c;border-color:#463619}
:root[data-theme="dark"] .f.u{background:#1a2130;color:#93b3e0;border-color:#2b3850}

/* ── 讲解页主题按钮（theme.js 自建；首页有原生按钮，不会重复） ── */
.kb-themebtn{
  position:fixed;right:18px;bottom:76px;width:48px;height:48px;padding:0;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:50%;
  background:var(--surface);color:var(--accent);
  box-shadow:0 2px 10px rgba(0,0,0,.14);cursor:pointer;z-index:70;
  -webkit-tap-highlight-color:transparent;
}
.kb-themebtn:hover{border-color:var(--accent)}
.kb-themebtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.kb-themebtn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;pointer-events:none}
.kb-themebtn .kb-ic-sun{display:none}
:root[data-theme="dark"] .kb-themebtn .kb-ic-sun{display:block}
:root[data-theme="dark"] .kb-themebtn .kb-ic-moon{display:none}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .kb-themebtn .kb-ic-sun{display:block}
  :root:not([data-theme="light"]) .kb-themebtn .kb-ic-moon{display:none}
}
@media(max-width:480px){
  .kb-themebtn{right:14px;bottom:72px;width:46px;height:46px}
}

/* ── 移动端：触控热区（用伪元素扩大，不改视觉尺寸） ── */
@media(pointer:coarse){
  .readtoggle{position:relative}
  .readtoggle::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;
    transform:translate(-50%,-50%);border-radius:8px}
  .desc-more,.filesmore button{position:relative}
  .desc-more::after,.filesmore button::after{content:"";position:absolute;left:0;right:0;
    top:50%;height:44px;transform:translateY(-50%)}
  .chip{min-height:44px;padding-top:10px;padding-bottom:10px}
  .herotools .syncfab{min-width:46px;min-height:46px}
  .kbback{min-height:44px;padding-top:10px;padding-bottom:10px}
  nav.toc .grp{min-height:44px}
  nav.toc .items a{min-height:40px;display:flex;align-items:center}
}

/* ── 手机：表格保列宽、可横滑，并给滑动提示 ── */
@media(max-width:560px){
  .tw{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tw table{min-width:600px}
  .tw::after{content:"← 表格可左右滑动 →";display:block;position:sticky;left:0;
    font-size:11px;color:var(--muted);padding:4px 2px 2px;background:var(--bg)}
  .kb-themebtn{box-shadow:0 2px 12px rgba(0,0,0,.2)}
}

/* ── 手机 / 平板竖屏：目录默认收起，首屏留给正文（theme.js 插按钮） ── */
@media(max-width:900px){
  .kb-toc-toggle{display:flex;align-items:center;justify-content:space-between;
    width:100%;min-height:44px;margin:0 0 8px;padding:10px 14px;
    border:1px solid var(--line);border-radius:10px;background:var(--surface);
    color:var(--text);font-family:var(--font);font-size:14px;font-weight:700;cursor:pointer}
  .kb-toc-toggle .kb-toc-arw{transition:transform .18s}
  .kb-toc-toggle[aria-expanded="true"] .kb-toc-arw{transform:rotate(180deg)}
  nav.toc.kb-toc-collapsed{display:none}
  nav.toc.kb-toc-collapsed.kb-open{display:block;border-bottom:1px solid var(--line)}
  /* 平板：正文别拉满 768，居中留白更好读 */
  main{max-width:720px;margin-left:auto;margin-right:auto}
}

/* ── 手机：字号抬到 16px ── */
@media(max-width:560px){
  body{font-size:16px}
}

/* ── 打印：隐藏悬浮按钮，别印出来 ── */
@media print{
  .kb-themebtn,.kb-toc-toggle{display:none!important}
}
