:root{--bg:#0a0f1e;--bg2:#111a31;--ink:#e8edf7;--mute:#93a3bd;--line:rgba(255,255,255,.1);--ind:#7c8cff;--mint:#5eead4;--gold:#f5c36b;--r:20px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{font:400 1.05rem/1.65 Manrope,system-ui,sans-serif;color:var(--ink);background:var(--bg);background-image:radial-gradient(900px 500px at 85% -5%,rgba(124,140,255,.18),transparent 70%),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:auto,56px 56px,56px 56px;background-repeat:no-repeat,repeat,repeat}
h1,h2,h3{line-height:1.12;letter-spacing:-.025em}
h1{font-size:clamp(2.3rem,5vw,4.1rem);font-weight:800}
h2{font-size:clamp(1.7rem,3.2vw,2.4rem);font-weight:800;margin-bottom:1.6rem}
h3{font-size:1.15rem;font-weight:700;margin-bottom:.5rem}
a{color:inherit}:focus-visible{outline:3px solid var(--mint);outline-offset:3px}
.wrap{max-width:1120px;margin:0 auto;padding:4.5rem 1.5rem}
.nav{position:sticky;top:0;z-index:9;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.7rem 1.5rem;background:rgba(10,15,30,.78);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:.7rem;font-weight:800;text-decoration:none}
.brand img{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:top;border:1.5px solid var(--mint)}
.nav nav{display:flex;gap:1.3rem;align-items:center;font-size:.92rem;overflow-x:auto}
.nav nav a{text-decoration:none;color:var(--mute);white-space:nowrap}.nav nav a:hover{color:#fff}
.pill{background:var(--mint);color:#06201c!important;padding:.4rem 1rem;border-radius:99px;font-weight:700}
.btn{display:inline-block;padding:.75rem 1.3rem;border:1.5px solid var(--line);border-radius:99px;text-decoration:none;font-weight:700;transition:background .2s,color .2s,border-color .2s}
.btn:hover{border-color:var(--mint);color:var(--mint)}.btn.solid{background:var(--ind);border-color:var(--ind);color:#fff}.btn.solid:hover{background:var(--mint);border-color:var(--mint);color:#06201c}
.cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem}
.hero{max-width:1180px;margin:0 auto;padding:4.5rem 1.5rem 2rem;display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center}
.status{display:inline-flex;align-items:center;gap:.6rem;font:600 .82rem "JetBrains Mono",monospace;color:var(--mute);margin-bottom:1.2rem}
.status i{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(94,234,212,.18)}
.lead{margin-top:1.3rem;color:var(--mute);font-size:1.12rem;max-width:54ch}
.win{background:rgba(17,26,49,.85);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 40px 80px rgba(0,0,0,.45);overflow:hidden}
.bar{display:flex;align-items:center;gap:.4rem;padding:.8rem 1rem;border-bottom:1px solid var(--line)}
.bar span{width:10px;height:10px;border-radius:50%;background:#2b3858}.bar em{margin-left:.8rem;font:.78rem "JetBrains Mono",monospace;color:var(--mute);font-style:normal}
.term{padding:1.2rem 1.3rem;min-height:290px;font:.88rem/1.7 "JetBrains Mono",monospace;color:var(--mint)}
.term b{font-weight:600;color:#fff}.term .r{color:var(--mute);margin-bottom:.7rem}
.cur{display:inline-block;width:8px;height:1em;background:var(--mint);vertical-align:-2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.stats{max-width:1120px;margin:0 auto;padding:0 1.5rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1px}
.stats div{padding:1.2rem 1rem;border-top:1px solid var(--line)}
.stats b{display:block;font-size:1.9rem;font-weight:800;color:var(--gold)}.stats span{color:var(--mute);font-size:.9rem}
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.bento article{padding:1.7rem}.bento .a{grid-column:span 2;grid-row:span 2}.bento .b{grid-column:span 2}
.spot,.card{position:relative;overflow:hidden;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r)}
.spot::before,.card::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .25s;background:radial-gradient(320px circle at var(--x,50%) var(--y,50%),rgba(124,140,255,.2),transparent 70%)}
.spot:hover::before,.card:hover::before{opacity:1}
.bento p,.card p{color:var(--mute);font-size:.97rem}
.flow{list-style:none;padding:0;margin:1.6rem 0 0;display:flex;flex-direction:column;gap:.5rem;position:relative}
.flow li{font:.82rem "JetBrains Mono",monospace;padding:.55rem .9rem;border:1px solid var(--line);border-radius:10px;background:rgba(124,140,255,.08);position:relative}
.flow li+li::before{content:"";position:absolute;left:1.2rem;top:-.5rem;height:.5rem;border-left:2px dashed var(--mint)}
.tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.6rem}
.tabs button{font:600 .9rem Manrope,sans-serif;color:var(--mute);background:none;border:1px solid var(--line);border-radius:99px;padding:.45rem 1rem;cursor:pointer}
.tabs button:hover{color:#fff}.tabs button.on{background:var(--ind);border-color:var(--ind);color:#fff}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.2rem}
.card{display:flex;flex-direction:column;gap:.7rem;padding:1.6rem;text-decoration:none;transition:border-color .2s}.card:hover{border-color:var(--ind)}
.card>*{position:relative}.card .go{margin-top:auto;font-weight:700;color:var(--mint)}
.cloud{align-self:flex-start;font-size:.78rem;font-weight:700;background:rgba(94,234,212,.12);color:var(--mint);padding:.15rem .7rem;border-radius:99px}
.tags{display:flex;flex-wrap:wrap;gap:.4rem}.tags span{font:.78rem "JetBrains Mono",monospace;border:1px solid var(--line);padding:.15rem .6rem;border-radius:6px;color:var(--mute)}
.panel{padding:1.6rem;border:1px solid var(--line);border-radius:var(--r);background:var(--bg2);min-height:120px}.panel .tags span{font-size:.88rem;padding:.3rem .8rem;color:var(--ink)}
.timeline{list-style:none;padding:0;border-left:2px solid var(--line)}
.timeline>li{position:relative;padding:0 0 2rem 1.8rem}.timeline>li::before{content:"";position:absolute;left:-7px;top:.45rem;width:12px;height:12px;border-radius:50%;background:var(--mint)}
.when{display:block;font:.82rem "JetBrains Mono",monospace;color:var(--mint);margin-bottom:.3rem}
.timeline ul{margin:.8rem 0 0 1.1rem;color:var(--mute)}.timeline ul li{margin-bottom:.35rem}
.two{display:grid;grid-template-columns:1fr 1fr;gap:3rem}
.plain{list-style:none;padding:0}.plain li{padding:.9rem 0;border-bottom:1px solid var(--line)}.plain b{display:block}.plain span{color:var(--mute);font-size:.93rem}
.link{color:var(--mint);font-weight:700}
.contact{text-align:center}.contact .sub{color:var(--mute);margin:-.6rem auto 0;max-width:55ch}.contact .cta{justify-content:center}
footer{text-align:center;padding:2rem;color:var(--mute);font-size:.88rem;border-top:1px solid var(--line)}
.detail .wrap{max-width:900px;padding-top:3rem}.detail h1{font-size:clamp(2rem,4.5vw,3rem);margin:.8rem 0 1rem}
.detail ul.pts{margin:1.2rem 0 2rem 1.2rem;color:var(--mute)}.detail ul.pts li{margin-bottom:.5rem}
.diagram{border:1px solid var(--line);border-radius:var(--r);padding:1rem;background:#fff;margin-top:1rem}.diagram img{width:100%;height:auto;display:block}
.nodiag{color:#51627a;padding:2rem;text-align:center}
@media(max-width:860px){.hero,.two{grid-template-columns:1fr}.bento{grid-template-columns:1fr 1fr}.bento .a,.bento .b{grid-column:span 2}.bento .a{grid-row:auto}.stats{grid-template-columns:1fr 1fr}.nav nav a:not(.pill){display:none}.wrap{padding:3.5rem 1.2rem}}
@media(max-width:520px){.bento{grid-template-columns:1fr}.bento .a,.bento .b{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.cur{animation:none}html{scroll-behavior:auto}}