:root{--void:#04070C;--panel:#08111C;--panel-2:#0C1826;--grid:rgba(60,230,255,.06);--edge:#16324A;--text:#DCEBF5;--dim:#8AA2B4;--cyan:#3CE6FF;--threat:#FF3D6E;--ok:#5CFFB0;
--display:"Chakra Petch","Arial Narrow",system-ui,sans-serif;--body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;--wrap:1180px;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);color-scheme:dark}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 84px);background:var(--void)}
body{margin:0;color:var(--text);font:400 1.0625rem/1.7 var(--body);-webkit-font-smoothing:antialiased;
background:linear-gradient(var(--grid) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,var(--grid) 1px,transparent 1px) 0 0/48px 48px,radial-gradient(1000px 600px at 80% -10%,rgba(60,230,255,.08),transparent 60%),var(--void)}
a{color:var(--cyan);text-underline-offset:3px}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(18px,4.5vw,40px)}
.skip{position:absolute;left:-999px;top:12px;background:var(--cyan);color:var(--void);padding:10px 16px;z-index:300;font-weight:600}.skip:focus{left:12px}
header.site{position:sticky;top:0;z-index:50;padding-top:env(safe-area-inset-top,0px);background:rgba(4,7,12,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--edge)}
.bar{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.brand{font:700 1.05rem/1 var(--display);text-decoration:none;color:var(--text);display:flex;align-items:center;gap:10px;letter-spacing:.02em}
.brand svg{width:24px;height:24px;flex:none}.brand small{display:block;font:400 .66rem/1.2 var(--mono);color:var(--cyan);margin-top:3px}
header.site nav ul{display:flex;gap:2px;list-style:none;margin:0;padding:0}
header.site nav a{display:block;text-decoration:none;color:var(--dim);font:500 .8rem/1 var(--mono);padding:9px 10px}
header.site nav a:hover{color:var(--cyan)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:28px 0 0;font:400 .78rem/1.4 var(--mono);color:var(--dim)}
.crumbs li+li::before{content:"/";margin-right:8px;color:var(--edge)}
.crumbs a{color:var(--dim);text-decoration:none}.crumbs a:hover{color:var(--cyan)}
.post-head{padding:34px 0 36px;border-bottom:1px solid var(--edge);margin-bottom:40px;max-width:900px}
.kcat{font:400 .78rem/1 var(--mono);color:var(--cyan);margin:0 0 14px}
h1{font:700 clamp(2rem,4.6vw,3.3rem)/1.08 var(--display);margin:0 0 18px;text-wrap:balance}
.post-lede{font-size:clamp(1.05rem,1.5vw,1.2rem);color:var(--dim);max-width:62ch;margin:0 0 18px}
.post-meta{font:400 .8rem/1.5 var(--mono);color:var(--dim);margin:0}.post-meta span{color:var(--edge);margin:0 6px}
.post-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start}
.toc{position:sticky;top:96px;border-left:1px solid var(--edge);padding-left:18px}
.toc-title{font:600 .74rem/1 var(--mono);color:var(--cyan);margin:0 0 14px}
.toc ol{list-style:none;margin:0;padding:0}.toc li{margin:0 0 10px}
.toc a{color:var(--dim);text-decoration:none;font-size:.88rem;line-height:1.35;display:block}.toc a:hover{color:var(--text)}
.prose{max-width:72ch}
.prose h2{font:700 clamp(1.4rem,2.4vw,1.85rem)/1.2 var(--display);margin:2.2em 0 .6em;scroll-margin-top:96px}
.prose h2:first-of-type{margin-top:.6em}
.prose h3{font:600 1.12rem/1.3 var(--display);margin:1.6em 0 .4em}
.prose p{margin:0 0 1.1em;color:#C6D8E6}
.prose strong{color:var(--text);font-weight:600}
.prose ul,.prose ol{margin:0 0 1.3em;padding-left:1.3em;color:#C6D8E6}
.prose li{margin-bottom:.5em}.prose li::marker{color:var(--cyan)}
.prose em{color:var(--text)}
.refs{font-size:.92rem}.refs li{margin-bottom:.6em}.refs a{word-break:break-word}
.post-faq{margin-top:3em}
.qa{border:1px solid var(--edge);background:rgba(8,17,28,.7);margin-bottom:10px}
.qa summary{cursor:pointer;list-style:none;padding:16px 52px 16px 18px;position:relative}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font:600 1.2rem var(--mono);color:var(--cyan);transition:transform .2s}
.qa[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.qa summary h3{margin:0;font-size:1rem}
.qa p{padding:0 18px 16px;margin:0;color:var(--dim)}
.author{margin-top:3em;padding:24px;border:1px solid var(--edge);border-left:3px solid var(--cyan);background:linear-gradient(135deg,rgba(60,230,255,.06),rgba(8,17,28,.8))}
.author .author-name{font:700 1.15rem/1.2 var(--display);color:var(--text);margin:0 0 8px}
.author p{color:var(--dim);margin:0 0 10px}.author p:last-child{margin:0;font:500 .85rem var(--mono)}
.related{padding:70px 0 20px}
.related h2{font:700 1.7rem/1.1 var(--display);margin:0 0 26px}
.kgrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.kgrid.three{grid-template-columns:repeat(3,1fr)}
.kcard a{display:flex;flex-direction:column;height:100%;padding:24px 22px 20px;border:1px solid var(--edge);background:rgba(8,17,28,.8);text-decoration:none;color:var(--text);transition:border-color .2s,background .2s;position:relative}
.kcard a:hover{border-color:var(--cyan);background:var(--panel-2)}
.kcard a::before{content:"";position:absolute;top:-1px;left:-1px;width:12px;height:12px;border-top:2px solid var(--cyan);border-left:2px solid var(--cyan)}
.kcard h3{font:600 1.15rem/1.3 var(--display);margin:0 0 10px}
.kcard p{color:var(--dim);font-size:.95rem;margin:0 0 16px;line-height:1.55}
.kmeta{margin-top:auto;font:400 .74rem/1 var(--mono);color:var(--dim)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.chip{font:500 .8rem/1 var(--mono);padding:10px 14px;border:1px solid var(--edge);background:transparent;color:var(--dim);cursor:pointer}
.chip:hover{color:var(--cyan);border-color:var(--cyan)}.chip.on{background:var(--cyan);color:var(--void);border-color:var(--cyan)}
footer.site{border-top:1px solid var(--edge);margin-top:80px;padding:24px 0 34px;font:400 .78rem/1.6 var(--mono);color:var(--dim)}
footer.site .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer.site a{color:var(--dim)}
@media (max-width:900px){.post-grid{grid-template-columns:1fr}.toc{position:static;border:1px solid var(--edge);padding:18px;background:rgba(8,17,28,.7)}.kgrid.three{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.kgrid,.kgrid.three{grid-template-columns:1fr}header.site nav li:nth-child(3){display:none}header.site nav a{padding:9px 6px;font-size:.74rem}.brand small{display:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
