:root{--bg:#fbfaff;--panel:#fff;--ink:#111;--muted:#5d5a70;--line:#e8e3fa;--purple:#7c5cff;--deep:#5b3be0;--soft:#f3eeff;--code:#f5f2ff;--note:#eef5ff;--tip:#ecfbf3;--warn:#fff7e0;--imp:#f6efff}
:root[data-theme=dark]{--bg:#0f0e14;--panel:#16141f;--ink:#ecebf3;--muted:#a19dba;--line:#2a2638;--purple:#9b7bff;--deep:#b9a6ff;--soft:#221d33;--code:#1e1a2c;--note:#14223a;--tip:#10291f;--warn:#2f2610;--imp:#241b38}
*{box-sizing:border-box}html{scroll-padding-top:80px}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.7 Inter,system-ui,sans-serif}
a{color:var(--deep)}
.bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;height:62px;padding:0 20px;background:color-mix(in srgb,var(--panel) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink)}.brand img{height:28px}
.brand span{font:800 19px 'Bricolage Grotesque',sans-serif}.brand em{font:700 11px 'Space Mono',monospace;letter-spacing:.12em;text-transform:uppercase;font-style:normal;color:var(--deep);background:var(--soft);padding:3px 8px;border-radius:99px}
.search{margin-left:24px;flex:0 1 420px;display:flex;align-items:center;justify-content:space-between;gap:10px;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--muted);font:14px Inter,sans-serif;cursor:pointer}
kbd{font:12px 'Space Mono',monospace;border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.theme,.menu{border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:10px;height:38px;width:38px;cursor:pointer;font-size:16px}
.theme{margin-left:auto}.menu{display:none}
.cta{background:var(--purple);color:#fff;text-decoration:none;font-weight:600;font-size:14px;padding:9px 14px;border-radius:10px;white-space:nowrap}
.login{color:var(--ink);font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap}
.layout{display:grid;grid-template-columns:268px minmax(0,1fr) 230px;max-width:1440px;margin:0 auto}
.side{position:sticky;top:62px;height:calc(100vh - 62px);overflow:auto;padding:22px 14px 40px;border-right:1px solid var(--line)}
.grp{margin-bottom:18px}.gt{font:700 11px 'Space Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:0 10px 6px}
.side a{display:block;padding:5px 10px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:14.5px;line-height:1.4}
.side a:hover{background:var(--soft)}.side a.on{background:var(--soft);color:var(--deep);font-weight:600}
main{padding:30px 48px 60px;min-width:0}
.crumbs{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:14px;margin-bottom:6px}
.copy{margin-left:auto;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:8px;padding:5px 10px;font:600 13px Inter,sans-serif;cursor:pointer}
article h1{font:800 42px/1.12 'Bricolage Grotesque',sans-serif;letter-spacing:-.02em;margin:8px 0 14px}
article h2{font:800 27px/1.2 'Bricolage Grotesque',sans-serif;margin:44px 0 12px}
article h3{font:700 19px/1.3 Inter,sans-serif;margin:30px 0 8px}
article h2,article h3{position:relative}.anchor{position:absolute;left:-22px;opacity:0;text-decoration:none;color:var(--muted)}h2:hover .anchor,h3:hover .anchor{opacity:1}
article p,article li{color:var(--ink)}article p:first-of-type{font-size:18px;color:var(--muted)}
article table{width:100%;border-collapse:collapse;margin:14px 0 22px;font-size:14.5px;display:block;overflow-x:auto}
article th{text-align:left;background:var(--soft);padding:9px 12px;border:1px solid var(--line);white-space:nowrap}
article td{padding:9px 12px;border:1px solid var(--line);vertical-align:top}
article code{font:13.5px 'Space Mono',monospace;background:var(--code);padding:2px 6px;border-radius:6px}
article pre{background:#14121c;color:#eceaf5;border-radius:12px;padding:16px;overflow:auto}article pre code{background:none;padding:0;color:inherit}
article img,article video{max-width:100%;border-radius:12px;border:1px solid var(--line)}
article blockquote{margin:16px 0;padding:10px 18px;border-left:4px solid var(--purple);background:var(--soft);border-radius:0 12px 12px 0}
.callout{margin:18px 0;padding:12px 16px;border-radius:12px;border:1px solid var(--line)}.callout b{display:block;font:700 12px 'Space Mono',monospace;letter-spacing:.1em;text-transform:uppercase;margin-bottom:2px}
.callout p{margin:4px 0}.callout.note{background:var(--note)}.callout.tip{background:var(--tip)}.callout.warning{background:var(--warn)}.callout.important{background:var(--imp)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin:18px 0}
.cards a{display:block;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--panel);text-decoration:none;color:var(--ink)}
.cards a:hover{border-color:var(--purple)}.cards b{display:block;font-size:16px;margin-bottom:4px}.cards span{color:var(--muted);font-size:14px}
.steps{counter-reset:s;list-style:none;padding:0}.steps>li{counter-increment:s;position:relative;padding:0 0 14px 44px}
.steps>li::before{content:counter(s);position:absolute;left:0;top:0;width:28px;height:28px;border-radius:50%;background:var(--purple);color:#fff;font:700 14px/28px Inter;text-align:center}
.pager{display:flex;justify-content:space-between;gap:12px;margin-top:48px}
.pager a{flex:1;padding:14px 16px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink);font-weight:600}.pager a.nx{text-align:right}
.pager small{display:block;color:var(--muted);font-weight:400;font-size:13px}
.help{margin-top:28px;padding:14px 16px;border-radius:12px;background:var(--soft);font-size:14.5px;color:var(--muted)}
.toc{position:sticky;top:62px;height:calc(100vh - 62px);overflow:auto;padding:30px 18px;font-size:13.5px}
.toc b{display:block;font:700 11px 'Space Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.toc a{display:block;color:var(--muted);text-decoration:none;padding:3px 0}.toc a.l3{padding-left:12px}.toc a:hover{color:var(--deep)}
.sdlg{position:fixed;inset:0;z-index:50;background:rgba(10,8,20,.45);display:flex;justify-content:center;padding-top:12vh}
.sdlg[hidden]{display:none}.sbox{width:min(640px,92vw);background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.3);overflow:hidden}
.sbox input{width:100%;border:0;border-bottom:1px solid var(--line);padding:16px 18px;font:16px Inter,sans-serif;background:var(--panel);color:var(--ink);outline:none}
.sres{max-height:60vh;overflow:auto}.sres a{display:block;padding:12px 18px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line)}
.sres a:hover{background:var(--soft)}.sres small{margin-left:8px;color:var(--deep);font-size:12px}.sres span{display:block;color:var(--muted);font-size:13.5px}.none{padding:16px 18px;color:var(--muted)}
@media (max-width:1180px){.layout{grid-template-columns:250px minmax(0,1fr)}.toc{display:none}}
@media (max-width:820px){.layout{display:block}.side{display:none;position:fixed;top:62px;left:0;right:0;bottom:0;height:auto;background:var(--panel);z-index:15}
body.nav-open .side{display:block}.menu{display:block}.search span,.login{display:none}.search{flex:0 0 auto;margin-left:auto}.theme{margin-left:0}
main{padding:20px 16px 50px}article h1{font-size:32px}.cta{padding:8px 10px;font-size:13px}.brand em{display:none}}
