:root{color-scheme:dark;--ink:#03050a;--glass:#ffffff06;--edge:#ffffff1a;--text:#eef3fb;--mute:#8d9bb0;--cyan:#4bd4ff;--blue:#168cff;--violet:#7c5cff;--disp:"Space Grotesk",system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--ink);color:var(--text);font-family:Inter,system-ui,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}button,select{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
img{display:block;max-width:100%;height:auto}
.wrap{max-width:1180px;margin:auto;padding:0 24px}section{padding:110px 0;position:relative}.flush{padding-inline:0}
h1,h2,h3{font-family:var(--disp);margin:0;letter-spacing:-.03em}h2{font-size:clamp(34px,5vw,60px);line-height:1.02}em{font-style:normal}
.grad{background:linear-gradient(100deg,var(--cyan),var(--blue) 55%,var(--violet));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shift 8s ease-in-out infinite alternate}
@keyframes shift{to{background-position:100% 0}}
.grad .w{background:linear-gradient(100deg,var(--cyan),var(--blue) 55%,var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:var(--mute);line-height:1.7;font-size:17px;max-width:540px}
.glass{background:linear-gradient(135deg,#ffffff12,#ffffff04 45%,#ffffff09);border:1px solid #ffffff1f;border-radius:24px;-webkit-backdrop-filter:blur(24px) saturate(1.7) brightness(1.08);backdrop-filter:blur(24px) saturate(1.7) brightness(1.08);box-shadow:inset 0 1px 0 #ffffff38,inset 0 -1px 0 #ffffff0d,inset 1px 0 0 #ffffff12,0 10px 36px #0005}
.progress{position:fixed;z-index:80;top:0;left:0;height:3px;width:100%;background:linear-gradient(90deg,var(--cyan),var(--violet));transform-origin:0 50%;transform:scaleX(var(--p,0))}
.glow{position:fixed;z-index:-1;width:60vw;height:60vw;border-radius:50%;filter:blur(90px);opacity:.35;pointer-events:none;transform:translateY(calc(var(--sy,0)*-.12px))}
.g1{top:-20vw;left:20vw;background:#168cff}.g2{top:40vh;right:-20vw;background:#7c5cff;opacity:.22}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 26px;border-radius:999px;border:1px solid #ffffff30;background:linear-gradient(135deg,var(--blue),var(--violet));font-weight:600;font-size:15px;cursor:pointer;box-shadow:0 0 40px #168cff55,inset 0 1px #fff4;transition:box-shadow .25s,translate .25s}
.btn:hover{box-shadow:0 0 64px #4bd4ff77,inset 0 1px #fff5}.btn.ghost{background:#ffffff0d;box-shadow:inset 0 1px 0 #ffffff30;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.btn.ghost:hover{border-color:var(--cyan)}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;font-size:13px;color:#cfe0f5}
.dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan);animation:pulse 2s infinite}@keyframes pulse{50%{opacity:.3;scale:.7}}
.nav{position:fixed;z-index:70;top:16px;left:50%;transform:translateX(-50%);width:min(980px,calc(100% - 24px));display:flex;align-items:center;gap:8px;padding:8px 8px 8px 18px;border-radius:999px;transition:background .3s,top .3s}
.nav.stuck{background:#0a101c5c;top:10px}.brand{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:700;font-size:18px;margin-right:auto}
.links{display:flex;gap:2px}.links a{padding:9px 13px;border-radius:999px;font-size:14px;color:#b4c3d8;transition:.2s}.links a:hover{background:#ffffff14;color:#fff}.nav .btn{min-height:40px;padding:0 18px;font-size:14px}
.burger{display:none;background:none;border:0;padding:10px;cursor:pointer}.burger span{display:block;width:22px;height:2px;background:#fff;margin:5px 0;transition:.3s}
.burger[aria-expanded=true] span:first-child{translate:0 3.5px;rotate:45deg}.burger[aria-expanded=true] span:last-child{translate:0 -3.5px;rotate:-45deg}
.hero{padding:150px 0 40px;text-align:center}
.hero h1{font-size:clamp(46px,9vw,118px);line-height:.95;margin:22px auto;max-width:12ch}.hero .lead{margin:0 auto}
.w{display:inline-block;opacity:0;transform:translateY(40px) rotateX(-50deg);filter:blur(8px);animation:wordin .9s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(var(--i)*.09s + .15s)}
@keyframes wordin{to{opacity:1;transform:none;filter:none}}
.hero .chip,.hero .lead,.hero .cta{animation:rise .9s .1s both}.hero .lead{animation-delay:.6s}.hero .cta{animation-delay:.8s}.stage{animation:rise 1.2s .9s both}
@keyframes rise{from{opacity:0;transform:translateY(30px)}}
.cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px}
.stage{--rx:0deg;--ry:0deg;position:relative;height:min(700px,130vw);margin-top:30px;perspective:1300px;display:grid;place-items:center}
.wave{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:clamp(3px,.6vw,8px);-webkit-mask-image:radial-gradient(closest-side,#000 40%,transparent);mask-image:radial-gradient(closest-side,#000 40%,transparent)}
.wave i{width:clamp(3px,.6vw,7px);height:calc(14% + var(--h)*70%);border-radius:9px;background:linear-gradient(var(--cyan),var(--violet));opacity:.55;animation:bar 1.6s ease-in-out infinite;animation-delay:calc(var(--i)*-.09s)}@keyframes bar{50%{transform:scaleY(.35)}}
.rig{position:relative;width:min(290px,56vw);aspect-ratio:1080/2340;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .15s;transform-style:preserve-3d}
.phone{position:absolute;inset:0;border-radius:36px;overflow:hidden;border:1px solid #ffffff40;box-shadow:0 40px 100px #000c,0 0 80px #168cff40;background:#000}.phone img{width:100%;height:100%;object-fit:cover}
.phone.l{transform:translate(-72%,calc(var(--sy,0)*-.03px)) translateZ(-120px) rotateY(18deg) scale(.86)}.phone.r{transform:translate(72%,calc(var(--sy,0)*.03px)) translateZ(-120px) rotateY(-18deg) scale(.86)}.phone.c{animation:hover 7s ease-in-out infinite}
@keyframes hover{50%{translate:0 -12px}}
.float{position:absolute;z-index:3;white-space:nowrap;animation:bob 6s ease-in-out infinite}@keyframes bob{50%{translate:0 -14px}}
.ticker{overflow:hidden;border-block:1px solid var(--edge);padding:18px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ticker div{display:flex;gap:48px;width:max-content;animation:slide 34s linear infinite;color:var(--mute);font-family:var(--disp);font-size:20px}@keyframes slide{to{transform:translateX(-50%)}}
.head{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap;margin-bottom:48px}
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.card{--mx:50%;--my:50%;position:relative;padding:28px;overflow:hidden;min-height:200px;transition:border-color .3s,translate .3s}
.card:before{content:"";position:absolute;inset:0;background:radial-gradient(320px circle at var(--mx) var(--my),#4bd4ff22,transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.card:hover{border-color:#4bd4ff66;translate:0 -4px}.card:hover:before{opacity:1}
.card h3{font-size:24px;margin-bottom:8px}.card p{color:var(--mute);line-height:1.6;margin:0;font-size:15px}
.b1{grid-column:span 3;grid-row:span 2}.b2,.b3{grid-column:span 3}.b4,.b5,.b6{grid-column:span 2}
.crop{display:flex;justify-content:center;height:360px;overflow:hidden;margin:26px -28px -28px;-webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}
.crop img{width:min(250px,68%);height:auto;align-self:flex-start;border-radius:30px 30px 0 0;border:1px solid #ffffff30;transition:translate .5s}.b1:hover .crop img{translate:0 -10px}
.eq{display:flex;align-items:end;gap:6px;height:76px;margin-top:22px}.eq i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(var(--cyan),var(--blue));height:calc(var(--h)*100%);animation:bar 1.4s ease-in-out infinite;animation-delay:calc(var(--i)*-.12s);transform-origin:bottom}
.more{display:inline-block;margin-top:16px;color:var(--cyan);font-size:14px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.ticks{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:16px;color:var(--mute);line-height:1.6}.ticks li{padding-left:30px;position:relative}.ticks li:before{content:"";position:absolute;left:0;top:8px;width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,var(--cyan),var(--violet));box-shadow:0 0 14px var(--cyan)}.ticks b{color:var(--text)}
.sharewrap{--rx:0deg;--ry:0deg;position:relative;display:grid;place-items:center;perspective:1200px}
.halo{position:absolute;width:80%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 0deg,var(--cyan),var(--violet),var(--blue),var(--cyan));filter:blur(70px);opacity:.4;animation:spin 14s linear infinite}@keyframes spin{to{rotate:360deg}}
.sharecard{position:relative;width:min(400px,100%);border-radius:30px;border:1px solid #ffffff30;box-shadow:0 40px 100px #000b;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .15s}
.rail{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px max(24px,calc((100vw - 1180px)/2 + 24px)) 30px;scrollbar-width:thin}
.rail figure{flex:0 0 min(270px,70vw);margin:0;scroll-snap-align:center}
.frame{aspect-ratio:1080/2340;border-radius:28px;overflow:hidden;border:1px solid #ffffff30;box-shadow:0 30px 70px #000a;background:#000;transition:transform .35s,box-shadow .35s}.frame img{width:100%;height:100%;object-fit:cover}
.rail figure:hover .frame{transform:translateY(-10px) rotate(-1.2deg);box-shadow:0 40px 80px #000a,0 0 50px #4bd4ff44}
.rail figcaption{padding:16px 4px;color:var(--mute);font-size:14px}.rail figcaption b{display:block;color:var(--text);font-family:var(--disp);font-size:18px;margin-bottom:4px}
.tabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.tab{padding:11px 18px;border-radius:999px;background:var(--glass);border:1px solid var(--edge);cursor:pointer;font-size:14px;transition:.25s}.tab:hover{border-color:var(--cyan)}.tab[aria-selected=true]{background:linear-gradient(135deg,var(--blue),var(--violet));border-color:#fff4}
.panel{padding:40px;min-height:230px}.panel h3{font-size:34px;margin-bottom:12px}.panel p{color:var(--mute);line-height:1.7;font-size:17px;margin:0}.panel.swap h3,.panel.swap p{animation:rise .5s both}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.step b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--violet));font-family:var(--disp);margin-bottom:18px}
.dl{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:48px;align-items:center}
.dl:before{content:"";position:absolute;inset:-1px;border-radius:25px;padding:1px;background:conic-gradient(from var(--a,0deg),transparent 50%,var(--cyan),var(--violet),transparent 95%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:edge 6s linear infinite;pointer-events:none}
@property --a{syntax:"<angle>";initial-value:0deg;inherits:false}@keyframes edge{to{--a:360deg}}
.dl-card{display:grid;gap:14px}.dl-card label{font-size:13px;color:var(--mute)}.rel{display:flex;align-items:baseline;gap:12px}.rel span{color:var(--mute);font-size:13px}.rel b{font-family:var(--disp);font-size:34px}.rel small{color:var(--mute)}
select{width:100%;min-height:48px;background:#ffffff08;border:1px solid var(--edge);border-radius:14px;padding:0 16px}
.file{padding:14px 16px;border-radius:14px;background:#ffffff08;border:1px solid var(--edge);display:grid;gap:4px;font-size:14px;word-break:break-all}.file small{color:var(--mute)}
.links2{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--mute)}.links2 a:hover{color:var(--cyan)}.err{color:#ff9b9b;font-size:13px;margin:0}.dl-card.flash{animation:flash 1s}@keyframes flash{30%{box-shadow:0 0 0 3px #4bd4ff66}}
.stack{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stack small{color:var(--mute);font-size:12px}.stack b{display:block;font-family:var(--disp);font-size:24px;margin:8px 0 4px}.stack span{color:var(--mute);font-size:14px}
.faq{display:grid;gap:12px;max-width:820px}.faq details{padding:0 24px;border-radius:18px}.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;padding:22px 0;font-family:var(--disp);font-size:19px}.faq summary::-webkit-details-marker{display:none}
.faq i{font-style:normal;color:var(--cyan);transition:rotate .25s}.faq details[open] i{rotate:45deg}.faq p{color:var(--mute);line-height:1.7;margin:0 0 22px}
footer{border-top:1px solid var(--edge);padding:40px 0;color:var(--mute);font-size:14px}footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
.rv{opacity:0;transform:translateY(34px) scale(.98);transition:opacity .8s cubic-bezier(.2,.8,.2,1) var(--d,0s),transform .8s cubic-bezier(.2,.8,.2,1) var(--d,0s)}.rv.in{opacity:1;transform:none}
html:not(.js) .rv,html:not(.js) .w{opacity:1;transform:none;filter:none;animation:none}
@media(max-width:860px){section{padding:72px 0}.links{display:none;position:absolute;top:64px;left:0;right:0;flex-direction:column;padding:12px;border-radius:24px;background:#0a101cc2;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid var(--edge)}.links.open{display:flex}.burger{display:block}.nav .btn{display:none}
.bento,.split,.steps,.dl,.stack{grid-template-columns:1fr}.b1,.b2,.b3,.b4,.b5,.b6{grid-column:auto;grid-row:auto}.dl{padding:26px}.float,.phone.l,.phone.r{display:none}.stage{height:min(640px,150vw)}.rig{width:min(300px,70vw)}}
@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}.rv,.w{opacity:1;transform:none;filter:none}}