/* ============ 深色模式（全站共用部分） ============
   由 /theme.js 在 <html> 上写 data-theme="dark|light"。
   这里放：切换按钮、顶部导航、文章类页面（articles.css）。
   有独立样式的页面（图解、路线图、首页等），深色规则写在各自页面的 <style id="dark-theme"> 里。 */

:root{
  --d-bg:#151517;--d-surface:#1c1c1f;--d-surface-2:#232327;--d-line:#2e2e33;
  --d-ink:#e4e4e7;--d-ink-2:#c2c2c7;--d-muted:#8e8e94;
}

/* ---------- 切换按钮：固定在顶部导航条右端 ---------- */
html body button.theme-toggle{
  position:fixed;z-index:1001;top:6px;right:14px;bottom:auto;left:auto;width:36px;height:36px;padding:0;margin:0;
  display:grid;place-items:center;border:0;border-radius:50%;background:transparent;box-shadow:none;cursor:pointer;
  color:rgba(29,29,31,.78);transition:color .2s ease,background-color .2s ease;
}
html body button.theme-toggle:hover{color:#000;background:rgba(0,0,0,.05)}
html body button.theme-toggle:focus-visible{outline:2px solid #0071e3;outline-offset:1px}
.theme-toggle svg{grid-area:1/1;width:18px;height:18px}
.theme-toggle .i-moon{fill:currentColor}
.theme-toggle .i-sun{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.theme-toggle .i-sun circle{fill:currentColor;stroke:none}
.theme-toggle .i-sun{display:none}
[data-theme="dark"] .theme-toggle .i-sun{display:block}
[data-theme="dark"] .theme-toggle .i-moon{display:none}
html[data-theme="dark"] body button.theme-toggle{color:rgba(245,245,247,.8)}
html[data-theme="dark"] body button.theme-toggle:hover{color:#fff;background:rgba(255,255,255,.08)}
/* 没有顶部导航条的页面（半导体产业链等）：按钮浮在右下角 */
html:not(.has-topbar) body button.theme-toggle{top:auto;bottom:18px;right:18px;width:40px;height:40px;
  background:rgba(251,251,253,.9);box-shadow:0 2px 10px rgba(0,0,0,.12),0 0 0 1px rgba(0,0,0,.06)}
html[data-theme="dark"]:not(.has-topbar) body button.theme-toggle{background:rgba(36,36,40,.92);box-shadow:0 2px 10px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.08)}
/* 窄屏：导航条横向滚动，按钮做成导航条右端的一小块，左侧渐隐，盖住滚到下面的链接 */
@media(max-width:860px){
  html.has-topbar body button.theme-toggle,html.has-topbar body button.theme-toggle:hover{top:0;right:0;width:52px;height:44px;border-radius:0;padding-left:10px;
    background:linear-gradient(90deg,rgba(251,251,253,0),#fbfbfd 34%)}
  html.has-topbar[data-theme="dark"] body button.theme-toggle,html.has-topbar[data-theme="dark"] body button.theme-toggle:hover{background:linear-gradient(90deg,rgba(24,24,27,0),#18181b 34%)}
  html.has-topbar body nav[aria-label="主导航"]{padding-right:56px!important}
}

/* ---------- 深色：通用 ---------- */
html[data-theme="dark"]{color-scheme:dark;background:var(--d-bg)}
/* 外链截图大多是白底，压暗一点不刺眼 */
html[data-theme="dark"] .prose img,html[data-theme="dark"] .article-diagram img{filter:brightness(.86) contrast(1.04)}
html[data-theme="dark"] ::selection{background:rgba(255,225,77,.32)}

/* ---------- 深色：顶部导航条 ---------- */
html[data-theme="dark"] body nav[aria-label="主导航"]{
  background:rgba(24,24,27,.78)!important;border-bottom-color:rgba(255,255,255,.08)!important;color:#f5f5f7;
}
html[data-theme="dark"] body nav.centered-nav[aria-label="主导航"]{background:rgba(24,24,27,.96)!important}
html[data-theme="dark"] body nav[aria-label="主导航"] a{color:rgba(245,245,247,.82)!important}
html[data-theme="dark"] body nav[aria-label="主导航"] a:hover,
html[data-theme="dark"] body nav[aria-label="主导航"] a[aria-current]{color:#fff!important}
@media(prefers-reduced-transparency:reduce){html[data-theme="dark"] body nav[aria-label="主导航"]{background:#18181b!important}}

/* ---------- 深色：文章类页面（articles.css） ---------- */
html[data-theme="dark"]:has(link[href^="/articles.css"]){
  --ink:var(--d-ink);--muted:var(--d-muted);--line:var(--d-line);
}
html[data-theme="dark"]:has(link[href^="/articles.css"]) body{background:var(--d-bg);color:var(--d-ink)}
html[data-theme="dark"]:has(link[href^="/articles.css"]) a:hover{color:#fff}
html[data-theme="dark"]:has(link[href^="/articles.css"]) a:focus-visible{outline-color:#ddd}
html[data-theme="dark"] .prose blockquote{border-left-color:#3d3d43;color:var(--d-ink-2)}
html[data-theme="dark"] .prose pre{background:var(--d-surface);border-color:var(--d-line)}
html[data-theme="dark"] .prose code{background:var(--d-surface-2)}
html[data-theme="dark"] .prose pre code{background:none}
html[data-theme="dark"] .prose th,html[data-theme="dark"] .prose td{border-color:var(--d-line)}
html[data-theme="dark"] .prose th{background:var(--d-surface)}
html[data-theme="dark"] .interest-list li:before{background:#666}
html[data-theme="dark"] .series-nav a:hover{background:var(--d-surface)}
/* Python 代码高亮：换成深色配色 */
html[data-theme="dark"] .prose .language-python{color:#e6edf3}
html[data-theme="dark"] .prose .language-python :is(.k,.kc,.kd,.kn,.kp,.kr,.kt,.ow){color:#ff7b72}
html[data-theme="dark"] .prose .language-python :is(.s,.sa,.sb,.sc,.dl,.sd,.s2,.se,.sh,.si,.sx,.sr,.s1,.ss){color:#a5d6ff}
html[data-theme="dark"] .prose .language-python :is(.c,.ch,.cm,.cp,.cpf,.c1,.cs){color:#8b949e}
html[data-theme="dark"] .prose .language-python :is(.m,.mb,.mf,.mh,.mi,.il,.mo,.nb,.bp){color:#79c0ff}
html[data-theme="dark"] .prose .language-python :is(.nf,.fm,.nc,.nd){color:#d2a8ff}
/* 系列目录卡片（从零手写大模型 / 从零手写 Agent） */
html[data-theme="dark"] .card-sub{color:var(--d-ink-2)}
html[data-theme="dark"] .ep-list{border-top-color:rgba(255,255,255,.07)}
html[data-theme="dark"] .flow-arrow{color:#666}
html[data-theme="dark"] .series-section .part-title{color:var(--d-ink-2)}
html[data-theme="dark"] #inference.series-card,html[data-theme="dark"] #agent-part-advanced.series-card{background:#161c26;border-color:#26324a}
html[data-theme="dark"] #training.series-card{background:#15201a;border-color:#24382b}
html[data-theme="dark"] #gpt2-to-llama.series-card,html[data-theme="dark"] #agent-part-teardown.series-card{background:#221d14;border-color:#3d3322}
html[data-theme="dark"] #llama-to-deepseek.series-card{background:#1c1926;border-color:#332c47}
html[data-theme="dark"] #agent-from-scratch.series-card,html[data-theme="dark"] #agent-part-core.series-card{background:#142120;border-color:#233b38}