/* Shared tokens for index.html and slides.html */
@font-face{font-family:"Inter";src:url(fonts/inter-var.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(fonts/jbmono-var.woff2) format("woff2");font-weight:100 800;font-display:swap}
@font-face{font-family:"Pi CJK";src:url(fonts/cjk-400.woff2) format("woff2");font-weight:100 500;font-display:swap}
@font-face{font-family:"Pi CJK";src:url(fonts/cjk-700.woff2) format("woff2");font-weight:600 900;font-display:swap}
:root{
  --font:"Inter","Pi CJK","PingFang SC","Noto Sans CJK SC","Microsoft YaHei",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,"Pi CJK",monospace;
  --bg:#ffffff;--bg-2:#f7f8fa;--surface:#ffffff;--surface-2:#f9fafb;--border:#e7e9ee;--border-2:#d9dde4;
  --text:#0b0d12;--text-2:#475061;--text-3:#8a93a3;--accent:#6b4cf6;--accent-2:#8b5cf6;--accent-soft:#f1edff;
  --code-bg:#f3f4f7;--code-text:#3b2a8a;--shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px -12px rgba(16,24,40,.12);
  --modes:#f59e0b;--coding:#8b5cf6;--ext:#14b8a6;--agent:#3b82f6;--ai:#10b981;--tui:#ec4899;--infra:#a3adbb;--err:#ef4444;
  --modes-bg:#fff6e5;--coding-bg:#f2edff;--ext-bg:#e5f8f5;--agent-bg:#e8f0ff;--ai-bg:#e6f7ef;--tui-bg:#fdebf4;--infra-bg:#f3f5f8;
  --modes-fg:#7a3e06;--coding-fg:#3b1a7a;--ext-fg:#0f4c45;--agent-fg:#1e3a8a;--ai-fg:#064e3b;--tui-fg:#831843;--infra-fg:#334155;
  color-scheme:light;
}
:root[data-theme=dark]{
  --bg:#0a0b0f;--bg-2:#0d0f14;--surface:#0f1218;--surface-2:#12151c;--border:#1f232d;--border-2:#2a2f3b;
  --text:#eef0f4;--text-2:#a6adbb;--text-3:#6c7484;--accent:#a78bfa;--accent-2:#c4b5fd;--accent-soft:#1d1736;
  --code-bg:#171a23;--code-text:#d4c8ff;--shadow:0 1px 2px rgba(0,0,0,.3),0 12px 32px -16px rgba(0,0,0,.6);
  --modes:#f5a524;--coding:#a78bfa;--ext:#2dd4bf;--agent:#60a5fa;--ai:#34d399;--tui:#f472b6;--infra:#566173;--err:#f87171;
  --modes-bg:#2a1f0e;--coding-bg:#211a3b;--ext-bg:#0e2926;--agent-bg:#12203b;--ai-bg:#0e291f;--tui-bg:#2d1323;--infra-bg:#181c25;
  --modes-fg:#fde7b5;--coding-fg:#ebe4ff;--ext-fg:#c9f5ee;--agent-fg:#dbe7ff;--ai-fg:#c9f3e1;--tui-fg:#fbd5e8;--infra-fg:#cbd5e1;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);font-feature-settings:"cv11","ss01","ss03"}
code,kbd,.mono{font-family:var(--mono);font-feature-settings:normal}
:root[data-lang=en] .zh,:root:not([data-lang=en]) .en{display:none!important}
button{font:inherit;color:inherit}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;line-height:1;padding:5px 9px 5px 8px;border-radius:999px;background:var(--l-bg);color:var(--l-fg);border:1px solid color-mix(in srgb,var(--l) 35%,transparent);white-space:nowrap;letter-spacing:.01em}
.chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--l)}
.L-modes{--l:var(--modes);--l-bg:var(--modes-bg);--l-fg:var(--modes-fg)}
.L-coding{--l:var(--coding);--l-bg:var(--coding-bg);--l-fg:var(--coding-fg)}
.L-ext{--l:var(--ext);--l-bg:var(--ext-bg);--l-fg:var(--ext-fg)}
.L-agent{--l:var(--agent);--l-bg:var(--agent-bg);--l-fg:var(--agent-fg)}
.L-ai{--l:var(--ai);--l-bg:var(--ai-bg);--l-fg:var(--ai-fg)}
.L-tui{--l:var(--tui);--l-bg:var(--tui-bg);--l-fg:var(--tui-fg)}
.L-infra{--l:var(--infra);--l-bg:var(--infra-bg);--l-fg:var(--infra-fg)}
.mmd{line-height:1.2}
.mmd svg{display:block;margin:0 auto;height:auto}
.mmd .nodeLabel,.mmd .edgeLabel{font-family:var(--font)}
.mmd .edgeLabel{font-size:12.5px}
.mmd .cluster-label .nodeLabel{font-size:12.5px;font-weight:600;letter-spacing:.02em;color:var(--text-3)!important}
.mmd-error{padding:24px;border:1px dashed var(--err);color:var(--err);border-radius:12px;font-size:14px}
/* lightbox */
.lb{position:fixed;inset:0;z-index:1000;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px);display:flex;flex-direction:column;animation:lbIn .18s ease}
.lb[hidden]{display:none}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
.lb-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border)}
.lb-title{font-weight:650;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-tools{display:flex;align-items:center;gap:6px}
.lb-tools button{min-width:36px;height:34px;padding:0 10px;border-radius:9px;border:1px solid var(--border-2);background:var(--surface);cursor:pointer;font-size:14px;font-weight:600}
.lb-tools button:hover{border-color:var(--accent)}
.lb-pct{font:500 12px var(--mono);color:var(--text-3);min-width:46px;text-align:center}
.lb-stage{flex:1;position:relative;overflow:hidden;cursor:grab;touch-action:none}
.lb-stage.drag{cursor:grabbing}
.lb-canvas{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.lb-canvas svg{display:block;max-width:none!important}
.lb-hint{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);font-size:12px;color:var(--text-3);background:var(--surface);border:1px solid var(--border);padding:6px 12px;border-radius:999px;white-space:nowrap;pointer-events:none}
html.lb-open{overflow:hidden}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}