:root{
  --bg:#0b0714;--bg2:#100a1c;--panel:#140d22;--panel2:#1a1130;--line:#2b2140;--line2:#3a2c56;
  --ink:#f4effc;--soft:#cfc4e8;--dim:#9a8db8;--faint:#76699a;
  --p:#7020D0;--m:#F020B0;--n:#E030F0;--pink:#F060C0;--plum:#503050;
  --grad:linear-gradient(100deg,var(--p) 0%,var(--m) 55%,var(--n) 100%);
  --head:'Bricolage Grotesque','Arial Black',system-ui,sans-serif;
  --body:'Hanken Grotesk',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --loud:'Tektur','Bricolage Grotesque',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--pink);text-decoration:none}a:hover{color:#fff}
::selection{background:var(--m);color:#fff}

/* atmosphere: neon glows + engineering grid + grain */
.bgfx{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 520px at 78% -6%,rgba(240,32,176,.20),transparent 62%),
    radial-gradient(760px 520px at 4% 18%,rgba(112,32,208,.26),transparent 60%),
    radial-gradient(700px 600px at 50% 120%,rgba(224,48,240,.10),transparent 60%),
    var(--bg)}
.bgfx:before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(154,141,184,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(154,141,184,.07) 1px,transparent 1px);
  background-size:44px 44px;mask-image:radial-gradient(ellipse 85% 70% at 50% 25%,#000 30%,transparent 80%)}
.bgfx:after{content:"";position:absolute;inset:-50%;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

/* nav */
nav{position:sticky;top:0;z-index:20;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:rgba(11,7,20,.72);border-bottom:1px solid rgba(43,33,64,.8)}
nav .wrap{display:flex;align-items:center;gap:28px;height:66px}
.brand{display:flex;align-items:center;gap:11px;color:#fff;font:800 20px/1 var(--head);letter-spacing:-.01em}
.brand img{width:34px;height:34px}
.brand b{color:var(--m);font-weight:800}
.brand .tag{font:600 10px var(--mono);letter-spacing:.22em;color:var(--dim);border:1px solid var(--line2);border-radius:6px;padding:4px 7px}
nav .links{display:flex;gap:24px;margin-left:auto;font:500 14px var(--body)}
nav .links a{color:var(--soft)}nav .links a:hover{color:#fff}
.btn{white-space:nowrap;display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;color:#fff;background:var(--grad);border-radius:12px;padding:12px 20px;font:800 13px var(--loud);letter-spacing:.08em;text-transform:uppercase;box-shadow:0 8px 30px -8px rgba(240,32,176,.6),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 36px -8px rgba(240,32,176,.8),inset 0 1px 0 rgba(255,255,255,.3);color:#fff}
.btn.ghost{background:transparent;border:1px solid var(--line2);box-shadow:none}
.btn.ghost:hover{border-color:var(--m)}

/* hero */
.hero{display:grid;grid-template-columns:1.02fr 1fr;gap:56px;align-items:center;padding:84px 0 40px}
.kick{display:inline-flex;align-items:center;gap:10px;font:600 12px var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--pink);background:rgba(240,32,176,.08);border:1px solid rgba(240,32,176,.28);border-radius:999px;padding:7px 14px 7px 10px}
.kick i{width:8px;height:8px;border-radius:50%;background:var(--m);box-shadow:0 0 12px var(--m);animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.35}}
h1{font:800 clamp(2.7rem,6.2vw,5.1rem)/.98 var(--head);letter-spacing:-.035em;margin:22px 0 22px}
h1 .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 28px rgba(240,32,176,.35))}
.lead{font-size:1.18rem;color:var(--soft);max-width:520px;margin:0 0 30px}
.cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.cta small{font:500 13px var(--mono);color:var(--dim);margin-left:4px}

/* holo-foil terminal */
.term{position:relative;border-radius:18px;padding:1.5px;background:conic-gradient(from var(--a),#7020D0,#F020B0,#E030F0,#F060C0,#503050,#7020D0);animation:spin 7s linear infinite;box-shadow:0 30px 80px -20px rgba(112,32,208,.55),0 0 0 1px rgba(255,255,255,.04)}
@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes spin{to{--a:360deg}}
.term-in{background:#0a0612;border-radius:16.5px;overflow:hidden}
.term-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line);background:#0e0918}
.term-bar span{width:11px;height:11px;border-radius:50%;background:#2b2140}
.term-bar span:nth-child(1){background:#F020B0}.term-bar span:nth-child(2){background:#7020D0}
.term-bar em{margin-left:auto;font:500 12px var(--mono);color:var(--faint);font-style:normal}
.term pre{margin:0;padding:20px 22px 24px;font:13.5px/1.62 var(--mono);color:#e9ddff;min-height:404px;white-space:pre-wrap;word-break:break-word}
.t-c{color:#8a7cab}.t-p{color:var(--m)}.t-k{color:#c9a8ff}.t-s{color:#ffb3e6}.t-n{color:#F060C0}.t-ok{color:#8affc8}
.caret{display:inline-block;width:8px;height:15px;background:var(--m);vertical-align:-2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:40px 0 0;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(26,17,48,.75),rgba(20,13,34,.75));overflow:hidden}
.stats div{padding:26px 26px 22px;border-right:1px solid var(--line)}
.stats div:last-child{border-right:0}
.stats b{display:block;font:800 clamp(1.9rem,3.4vw,2.9rem)/1 var(--loud);letter-spacing:.01em;background:linear-gradient(180deg,#fff 30%,#d9c8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.stats span{display:block;margin-top:10px;font:600 11px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}

/* sections */
section{padding:96px 0 0}
.eyebrow{font:600 12px var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--pink);margin:0 0 14px;display:flex;align-items:center;gap:12px}
.eyebrow:before{content:"";width:28px;height:2px;background:var(--grad)}
h2{font:800 clamp(2rem,4vw,3.1rem)/1.02 var(--head);letter-spacing:-.03em;margin:0 0 16px;max-width:760px}
h2 .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{color:var(--soft);font-size:1.08rem;max-width:640px;margin:0 0 40px}

/* language wall */
.langs{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.lang{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 16px 14px;overflow:hidden;transition:border-color .2s,transform .2s}
.lang:hover{border-color:var(--line2);transform:translateY(-2px)}
.lang .code{font:800 13px var(--loud);letter-spacing:.06em;color:var(--pink);text-transform:uppercase}
.lang .nm{font:600 15px var(--body);color:var(--ink);margin:4px 0 12px}
.lang .num{font:600 13px var(--mono);color:var(--dim);display:flex;justify-content:space-between}
.lang .bar{height:4px;border-radius:4px;background:#241838;margin-top:10px;overflow:hidden}
.lang .bar i{display:block;height:100%;background:var(--grad);border-radius:4px}
.lang.deep{border-color:rgba(240,32,176,.45);background:linear-gradient(160deg,rgba(240,32,176,.10),var(--panel) 55%)}
.lang.deep:after{content:"DEEPEST";position:absolute;top:13px;right:12px;font:800 9px var(--loud);letter-spacing:.14em;color:#0b0714;background:var(--m);border-radius:5px;padding:3px 6px}
.note{font:500 13px var(--mono);color:var(--faint);margin-top:16px}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px 22px 24px}
.plan h3{font:800 13px var(--loud);letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:0 0 18px}
.price{font:800 2.6rem/1 var(--head);letter-spacing:-.03em;color:#fff}
.price small{font:500 14px var(--body);color:var(--dim);letter-spacing:0}
.reqs{font:600 13px var(--mono);color:var(--pink);margin:10px 0 18px}
.plan ul{list-style:none;margin:0 0 22px;padding:0;color:var(--soft);font-size:15px}
.plan li{padding:7px 0 7px 24px;position:relative;border-top:1px solid rgba(43,33,64,.7)}
.plan li:before{content:"";position:absolute;left:2px;top:14px;width:10px;height:6px;border-left:2px solid var(--m);border-bottom:2px solid var(--m);transform:rotate(-45deg)}
.plan li.no{color:var(--faint)}.plan li.no:before{border:0;width:10px;height:2px;background:var(--faint);transform:none;top:18px}
.plan .use{margin-top:auto;font:600 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.plan.hot{border:0;padding:27.5px 23.5px 25.5px;background:linear-gradient(var(--panel2),var(--panel2)) padding-box,conic-gradient(from var(--a),#7020D0,#F020B0,#E030F0,#F060C0,#7020D0) border-box;border:1.5px solid transparent;animation:spin 7s linear infinite;box-shadow:0 24px 60px -24px rgba(240,32,176,.55)}
.plan.hot .flag{position:absolute;top:-12px;left:22px;font:800 10px var(--loud);letter-spacing:.14em;color:#fff;background:var(--grad);border-radius:6px;padding:5px 9px}

/* consoles (forms) */
.console{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;position:relative;overflow:hidden}
.console:before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--grad)}
.console h3{font:800 1.35rem var(--head);margin:0 0 6px;letter-spacing:-.01em}
.console p.d{color:var(--dim);margin:0 0 18px;font-size:15px}
form{display:flex;gap:10px;flex-wrap:wrap}
input[type=email],input[type=text],#upkey{flex:1;min-width:230px;background:#0a0612;border:1px solid var(--line2);color:var(--ink);border-radius:12px;padding:14px 16px;font:500 15px var(--mono);outline:none;transition:border-color .15s,box-shadow .15s}
input:focus{border-color:var(--m);box-shadow:0 0 0 4px rgba(240,32,176,.15)}
.check{flex-basis:100%;display:flex;gap:10px;align-items:flex-start;color:var(--dim);font-size:14px;margin-top:4px}
.check span{flex:1}
.check input{accent-color:#F020B0;width:17px;height:17px;margin-top:3px;flex:none}
.out{display:none;margin:14px 0 0;background:#0a0612;border:1px solid var(--line);border-radius:12px;padding:14px 16px;font:13px/1.6 var(--mono);color:#e9ddff;white-space:pre-wrap;word-break:break-all}
#up input{flex-basis:100%}#up .btn{flex:1;justify-content:center}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}

/* code tabs */
.tabs{background:#0a0612;border:1px solid var(--line);border-radius:18px;overflow:hidden}
.tabbar{display:flex;gap:2px;padding:8px;border-bottom:1px solid var(--line);background:#0e0918;flex-wrap:wrap}
.tabbar button{background:transparent;border:0;color:var(--dim);font:600 13px var(--mono);padding:9px 14px;border-radius:9px;cursor:pointer}
.tabbar button[aria-selected=true]{color:#fff;background:var(--panel2);box-shadow:inset 0 -2px 0 var(--m)}
.tabs pre{margin:0;padding:22px 24px;font:13.5px/1.65 var(--mono);color:#e9ddff;overflow-x:auto;display:none}
.tabs pre.on{display:block}

/* endpoints */
.eps{border:1px solid var(--line);border-radius:18px;overflow:hidden}
.ep code{word-break:break-all}
.ep{display:grid;grid-template-columns:76px 1fr 1.1fr;gap:18px;align-items:center;padding:16px 20px;border-top:1px solid var(--line);background:var(--panel)}
.ep:first-child{border-top:0}
.ep:hover{background:var(--panel2)}
.verb{font:800 11px var(--loud);letter-spacing:.1em;text-align:center;border-radius:6px;padding:5px 0;color:#efe6ff;background:#3a2c56;border:1px solid #5a4680}
.verb.post{background:var(--m);border-color:var(--m);color:#fff}
.ep code{font:500 14px var(--mono);color:#fff}
.ep .what{color:var(--dim);font-size:15px}
.links2{margin-top:18px;font:500 14px var(--mono);color:var(--dim);display:flex;gap:18px;flex-wrap:wrap}

/* faq */
.faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}
details{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:0 20px}
details[open]{border-color:var(--line2)}
summary{list-style:none;cursor:pointer;padding:18px 28px 18px 0;font:700 16px var(--body);position:relative}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";position:absolute;right:0;top:14px;font:800 20px var(--loud);color:var(--m);transition:transform .2s}
details[open] summary:after{transform:rotate(45deg)}
details p{margin:0 0 18px;color:var(--soft);font-size:15px}

footer{margin:110px 0 0;border-top:1px solid var(--line);padding:30px 0 44px;color:var(--faint);font-size:13px}
footer .wrap{display:flex;gap:24px;justify-content:space-between;flex-wrap:wrap}
footer a{color:var(--soft)}

/* load-in */
.rise{opacity:0;transform:translateY(16px);animation:rise .8s cubic-bezier(.2,.7,.2,1) forwards}
.d1{animation-delay:.05s}.d2{animation-delay:.15s}.d3{animation-delay:.25s}.d4{animation-delay:.35s}.d5{animation-delay:.5s}
@keyframes rise{to{opacity:1;transform:none}}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rise,.reveal{opacity:1;transform:none}}

@media (max-width:980px){
  .hero{grid-template-columns:1fr;gap:40px;padding-top:56px}
  .plans{grid-template-columns:1fr 1fr}
  .twocol,.faq{grid-template-columns:1fr}
  nav .links a.hide{display:none}
}
@media (max-width:620px){
  .wrap{padding:0 16px}
  .stats{grid-template-columns:1fr 1fr}.stats div:nth-child(2){border-right:0}.stats div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .plans{grid-template-columns:1fr}
  .ep{grid-template-columns:58px 1fr;gap:6px 14px}.ep .what{grid-column:2}
  .term pre{font-size:11px;min-height:340px;padding:16px}
  .langs{grid-template-columns:1fr 1fr;gap:10px}.lang{padding:13px 12px 12px}.lang .num{flex-direction:column;gap:2px}.lang.deep:after{top:12px;right:10px}
  nav .btn{padding:10px 13px;font-size:11px}
  nav .links{gap:14px}nav .links a.hide2{display:none}
  .brand .tag{display:none}
}

.crumbs{font:500 13px var(--mono);color:var(--dim);margin:40px 0 0}.crumbs a{color:var(--soft)}
.lhero{padding:40px 0 10px;max-width:880px}
.lhero h1{font-size:clamp(2.4rem,5.6vw,4.4rem)}
.native{font:600 1.1rem var(--body);color:var(--pink);margin:-8px 0 18px}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0 0}
.chip{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 16px}
.chip b{display:block;font:800 1.6rem/1 var(--loud);color:#fff}.chip span{font:600 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.sets{border:1px solid var(--line);border-radius:18px;overflow:hidden}
.setrow{display:grid;grid-template-columns:1.4fr 1fr 110px 90px;gap:14px;padding:14px 20px;border-top:1px solid var(--line);background:var(--panel);align-items:center}
.setrow:first-child{border-top:0}.setrow .nm{color:#fff;font-weight:600}.setrow .en{color:var(--dim)}.setrow code{font:500 13px var(--mono);color:var(--pink)}.setrow .n{font:600 13px var(--mono);color:var(--soft);text-align:right}
.codebox{background:#0a0612;border:1px solid var(--line);border-radius:18px;padding:20px 22px;font:13.5px/1.62 var(--mono);color:#e9ddff;white-space:pre-wrap;word-break:break-word;margin:0}
.others{display:flex;flex-wrap:wrap;gap:10px}.others a{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:8px 14px;font:600 14px var(--body);color:var(--soft)}.others a:hover{border-color:var(--m);color:#fff}
@media (max-width:620px){.setrow{grid-template-columns:1fr 70px}.setrow .en,.setrow code{display:none}}