*{box-sizing:border-box;margin:0;padding:0;}
:root{--bg:#101014;--panel:#15151b;--line:#24243a;--text:#c8c8da;--dim:#8a8aa8;--head:#ececf4;--a1:#fb923c;--a2:#ec4899;--code:#f9a8d4;}
html{scroll-padding-top:16px;}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);line-height:1.65;font-size:15px;}
a{color:#f9a8d4;text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{display:flex;max-width:1100px;margin:0 auto;min-height:100vh;}
nav.side{width:230px;flex-shrink:0;padding:32px 16px 32px 20px;border-right:1px solid var(--line);position:sticky;top:0;height:100vh;overflow-y:auto;}
nav.side .brand{display:block;font-weight:700;font-size:20px;background:linear-gradient(135deg,var(--a1),var(--a2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:2px;}
nav.side .tag{font-size:11px;color:#55557a;letter-spacing:.1em;text-transform:uppercase;margin-bottom:22px;}
nav.side a.n{display:block;padding:6px 10px;border-radius:7px;color:var(--dim);font-size:14px;margin-bottom:2px;}
nav.side a.n:hover{background:#1b1b24;color:var(--head);text-decoration:none;}
nav.side a.n.on{background:#221a24;color:var(--head);box-shadow:inset 2px 0 0 var(--a2);}
nav.side .back{display:block;margin-top:22px;font-size:12.5px;color:#66668a;}
main{flex:1;min-width:0;padding:40px 36px 80px;}
h1{font-size:32px;font-weight:700;color:var(--head);margin-bottom:8px;line-height:1.25;}
.lead{font-size:16.5px;color:var(--dim);margin-bottom:28px;}
h2{font-size:21px;color:var(--head);margin:40px 0 12px;padding-top:8px;border-top:1px solid var(--line);}
h3{font-size:16px;color:var(--head);margin:26px 0 8px;}
p{margin-bottom:12px;}
ul,ol{margin:0 0 14px 22px;}
li{margin-bottom:5px;}
b,strong{color:var(--head);font-weight:600;}
code{font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--code);background:#1d1a24;padding:1px 5px;border-radius:4px;word-break:break-word;}
pre{background:#0c0c11;border:1px solid var(--line);border-radius:10px;padding:14px 16px;overflow-x:auto;margin:0 0 16px;line-height:1.55;}
pre code{background:none;padding:0;color:#d8d8ea;font-size:12.5px;word-break:normal;}
pre .c{color:#6a6a8a;} pre .k{color:#f472b6;} pre .s{color:#fbbf24;}
table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:13.5px;display:block;overflow-x:auto;}
th,td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--line);vertical-align:top;}
th{color:var(--dim);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.06em;}
td:first-child{white-space:nowrap;}
.tip,.warn{border-radius:10px;padding:12px 16px;margin:0 0 16px;font-size:14px;}
.tip{background:#1a1622;border:1px solid #3a2a48;}
.warn{background:#221a14;border:1px solid #4a3420;}
.tip b:first-child,.warn b:first-child{margin-right:4px;}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px;}
a.box{display:block;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px;color:var(--text);transition:all .15s;}
a.box:hover{border-color:var(--a2);text-decoration:none;transform:translateY(-1px);}
a.box b{display:block;font-size:15px;margin-bottom:4px;}
a.box span{font-size:13px;color:var(--dim);}
.next{display:flex;justify-content:space-between;gap:12px;margin-top:48px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;}
kbd{font-family:'JetBrains Mono',monospace;font-size:11.5px;background:#1f1f2a;border:1px solid #33334a;border-bottom-width:2px;border-radius:4px;padding:0 5px;color:var(--head);}
.toc{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin-bottom:24px;font-size:13.5px;}
.toc a{margin-right:14px;display:inline-block;}
@media (max-width:820px){
  .wrap{display:block;}
  nav.side{position:static;width:auto;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:16px;}
  nav.side .tag{margin-bottom:10px;}
  nav.side a.n{display:inline-block;padding:4px 9px;font-size:13px;}
  nav.side .back{margin-top:8px;}
  main{padding:24px 16px 60px;}
  h1{font-size:26px;}
  .grid{grid-template-columns:1fr;}
}