
:root{--bg:#0B1120;--bg2:#0F172A;--panel:#131F35;--line:#22314b;--line2:#2d3f60;
--cyan:#0EA5E9;--cyan2:#38BDF8;--amber:#F59E0B;--green:#34D399;
--text:#E2E8F0;--muted:#94A3B8;--faint:#64748B}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--text);font-family:'Inter',-apple-system,sans-serif;line-height:1.7}
a{color:var(--cyan);text-decoration:none}a:hover{text-decoration:underline}
code{font-family:'JetBrains Mono',monospace;background:#0A101E;border:1px solid var(--line);
border-radius:5px;padding:1px 6px;font-size:.88em;color:#7DD3FC}
pre{background:#0A101E;border:1px solid var(--line2);border-radius:10px;padding:16px 18px;
overflow-x:auto;margin:14px 0;line-height:1.6}
pre code{background:none;border:none;padding:0;color:var(--text)}
.layout{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
aside{background:var(--bg2);border-right:1px solid var(--line);padding:22px 18px;position:sticky;top:0;height:100vh;overflow-y:auto}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.brand img{height:34px;width:34px;border-radius:8px;border:1px solid var(--line2)}
.brand b{font-size:14px;letter-spacing:.1em}.brand b span{color:var(--cyan)}
.brand small{display:block;color:var(--faint);font-size:10.5px;letter-spacing:.16em}
#q{width:100%;background:var(--panel);border:1px solid var(--line2);border-radius:8px;
padding:8px 12px;color:var(--text);font-size:13px;margin-bottom:16px}
aside h4{font-size:10.5px;letter-spacing:.18em;color:var(--faint);margin:16px 0 6px;text-transform:uppercase}
aside a.pg{display:block;padding:6px 10px;border-radius:7px;color:var(--muted);font-size:13.5px}
aside a.pg:hover{background:var(--panel);color:var(--text);text-decoration:none}
aside a.pg.on{background:rgba(14,165,233,.12);color:var(--cyan)}
main{padding:40px 48px;max-width:880px}
main h1{font-size:30px;font-weight:700;letter-spacing:-.01em;margin-bottom:6px}
.crumb{color:var(--faint);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px}
main h2{font-size:20px;margin:34px 0 10px;padding-top:10px;border-top:1px solid var(--line)}
main h3{font-size:16px;margin:22px 0 8px;color:var(--cyan2)}
main p{margin:10px 0;color:var(--muted)}
main li{margin:6px 0 6px 22px;color:var(--muted)}
main b,main strong{color:var(--text)}
table{border-collapse:collapse;width:100%;margin:14px 0;font-size:14px}
th,td{border:1px solid var(--line);padding:9px 13px;text-align:left}
th{background:var(--panel);color:var(--text)}td{color:var(--muted)}
.tip{border-left:3px solid var(--green);background:rgba(52,211,153,.06);padding:12px 16px;border-radius:0 8px 8px 0;margin:14px 0}
.warn{border-left:3px solid var(--amber);background:rgba(245,158,11,.06);padding:12px 16px;border-radius:0 8px 8px 0;margin:14px 0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-top:22px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px;display:block}
.card:hover{border-color:var(--cyan);text-decoration:none}
.card b{font-size:15px}.card p{font-size:13px;margin-top:6px}
footer{margin-top:50px;padding-top:16px;border-top:1px solid var(--line);color:var(--faint);font-size:12.5px}
@media(max-width:860px){.layout{grid-template-columns:1fr}aside{position:static;height:auto}main{padding:26px 20px}}
