:root { color-scheme: dark; --bg:#111827; --panel:#172033; --edge:#2b3953; --text:#e6edf7; --muted:#a7b4c9; --link:#71b7ff; --code:#0b1220; --accent:#f7a72c; }
* { box-sizing:border-box; }
body { margin:0; font:16px/1.65 Inter, ui-sans-serif, system-ui, sans-serif; color:var(--text); background:var(--bg); }
.topbar { height:58px; display:flex; align-items:center; gap:24px; padding:0 24px; position:sticky; top:0; z-index:2; border-bottom:1px solid var(--edge); background:#101827; }
.brand { color:#fff; text-decoration:none; font-weight:750; letter-spacing:.2px; white-space:nowrap; }.brand span { color:var(--accent); }
.search { margin-left:auto; display:flex; align-items:center; gap:10px; color:var(--muted); font-size:.8rem; }.search input { width:250px; padding:7px 10px; border:1px solid var(--edge); border-radius:5px; background:var(--code); color:var(--text); }
#menu-toggle { display:none; color:var(--text); background:var(--panel); border:1px solid var(--edge); padding:6px 10px; border-radius:5px; }
.layout { display:grid; grid-template-columns:270px minmax(0, 1fr) 220px; max-width:1540px; min-height:calc(100vh - 58px); margin:auto; }
#sidebar { border-right:1px solid var(--edge); padding:25px 16px; }.nav-title { margin:20px 8px 6px; color:#fff; font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }.nav-title:first-child { margin-top:0; }.nav-link { display:block; padding:4px 8px; border-left:2px solid transparent; color:var(--muted); font-size:.92rem; text-decoration:none; }.nav-link:hover,.nav-link.active { color:#fff; border-left-color:var(--accent); background:#202b40; }.sidebar-note { margin:32px 8px 0; font-size:.78rem; color:var(--muted); }
#content { min-width:0; padding:46px clamp(24px,5vw,78px) 80px; } #doc { max-width:850px; } h1,h2,h3 { color:#fff; line-height:1.25; scroll-margin-top:78px; } h1 { font-size:2.35rem; margin:0 0 12px; } h2 { border-bottom:1px solid var(--edge); padding-bottom:8px; margin-top:46px; font-size:1.55rem; } h3 { margin-top:30px; font-size:1.16rem; } a { color:var(--link); } p,li { overflow-wrap:anywhere; } code { color:#f6d39b; background:var(--code); padding:.12em .32em; border-radius:3px; } pre { position:relative; overflow:auto; padding:16px; border:1px solid var(--edge); border-radius:6px; background:var(--code); } pre code { padding:0; color:#d8e2f0; background:transparent; } table { display:block; overflow:auto; border-collapse:collapse; width:100%; } th,td { padding:9px 11px; border:1px solid var(--edge); text-align:left; } th { background:#202b40; } blockquote { margin:20px 0; padding:4px 18px; border-left:4px solid var(--accent); background:#1a2538; color:#d8e2f0; }
#toc { border-left:1px solid var(--edge); padding:45px 14px; font-size:.82rem; } .toc-title { color:#fff; font-weight:700; margin-bottom:10px; }.toc-link { display:block; padding:4px 0; color:var(--muted); text-decoration:none; }.toc-link.active { color:var(--accent); }.toc-link.level-3 { padding-left:12px; }
@media (max-width:1050px) { .layout { grid-template-columns:250px minmax(0,1fr); } #toc { display:none; } }
@media (max-width:700px) { .topbar { padding:0 14px; gap:12px; }.search span { display:none; }.search input { width:145px; } #menu-toggle { display:block; }.layout { display:block; } #sidebar { display:none; border:0; }.nav-open #sidebar { display:block; position:fixed; z-index:3; top:58px; bottom:0; width:min(310px,90vw); overflow:auto; background:var(--bg); box-shadow:5px 0 20px #0008; } #content { padding:32px 20px 60px; } h1 { font-size:1.9rem; } }