:root{color-scheme:dark;--bg:#07090e;--ink:#ECEFF6;--mut:#97A3BB;--faint:#5C6781;--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);--panel:rgba(255,255,255,.025);--acc:#5FE0C2;--acc2:#7FA8FF;--warn:#FF9090;--disp:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;--ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,sans-serif;--mono:ui-monospace,"SF Mono",Menlo,monospace;--ease:cubic-bezier(.22,.7,.2,1)}*{box-sizing:border-box;margin:0}[hidden]{display:none!important}html,body{height:100%}body{font-family:var(--ui);color:var(--ink);background:var(--bg);min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:clamp(1.25rem,4vw,3rem);position:relative;overflow-x:hidden;-webkit-font-smoothing:antialiased}svg{display:block}.glow{position:fixed;inset:0;z-index:-4;background:radial-gradient(60% 42% at 50% -6%,rgba(95,224,194,.1),transparent 62%),radial-gradient(55% 40% at 50% -10%,rgba(127,168,255,.1),transparent 58%),linear-gradient(180deg,#0a0d13,#07090e 60%)}.gfx{position:fixed;inset:0;z-index:-3;width:100%;height:100%;display:block;opacity:0;transition:opacity 1.2s ease;pointer-events:none}.gfx.on{opacity:1}.gfx.on~.aurora{display:none}.aurora{position:fixed;inset:-25%;z-index:-3;pointer-events:none;filter:blur(90px);opacity:.55;will-change:transform;transition:transform .6s ease-out}.aurora:before,.aurora:after{content:"";position:absolute;border-radius:50%}.aurora:before{width:52vw;height:52vw;left:6%;top:-12%;background:radial-gradient(circle,rgba(95,224,194,.38),transparent 62%);animation:drift1 24s ease-in-out infinite}.aurora:after{width:46vw;height:46vw;right:4%;top:-16%;background:radial-gradient(circle,rgba(127,168,255,.32),transparent 62%);animation:drift2 30s ease-in-out infinite}.mesh{position:fixed;inset:0;z-index:-2;opacity:.35;pointer-events:none;will-change:transform;transition:transform .6s ease-out;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:54px 54px;mask-image:radial-gradient(110% 70% at 50% 0,#000 25%,transparent 75%)}.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}@keyframes drift1{0%,to{transform:translate(0) scale(1)}50%{transform:translate(7vw,6vh) scale(1.14)}}@keyframes drift2{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-6vw,5vh) scale(1.1)}}.reveal{opacity:0;transform:translateY(22px);transition:opacity .75s var(--ease),transform .75s var(--ease)}.reveal.in{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.aurora{animation:none}.aurora:before,.aurora:after{animation:none}}.auth{position:fixed;top:1rem;right:1rem;z-index:5;display:flex;align-items:center;gap:.6rem}.auth .who{display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:#c7d2e8}.auth img{width:26px;height:26px;border-radius:50%;border:1px solid var(--line2)}.auth button{font:inherit;font-size:.82rem;font-weight:500;color:var(--mut);background:transparent;border:1px solid var(--line2);border-radius:9px;padding:.4rem .75rem;cursor:pointer;transition:.15s}.auth button:hover{color:var(--ink);border-color:#ffffff4d}main{width:100%;max-width:42rem;margin:auto 0;display:flex;flex-direction:column;align-items:center;text-align:center}.brand{display:inline-flex;align-items:center;gap:.5rem;color:#b9c6e2;font-family:var(--mono);font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;opacity:0;animation:rise .7s .04s var(--ease) forwards}.brand svg{width:15px;height:15px;color:var(--acc)}h1{font-family:var(--disp);font-weight:700;letter-spacing:-.022em;line-height:1.08;font-size:clamp(1.85rem,4.4vw,2.75rem);margin-top:1.1rem;max-width:22ch;opacity:0;animation:rise .8s .1s var(--ease) forwards}h1 .g{background:linear-gradient(100deg,var(--acc2),var(--acc));-webkit-background-clip:text;background-clip:text;color:transparent}h1 .ar{color:var(--faint)}p.sub{margin-top:1rem;max-width:40ch;color:var(--mut);font-size:clamp(.96rem,1.6vw,1.05rem);line-height:1.62;opacity:0;animation:rise .8s .18s var(--ease) forwards}p.sub code{font-family:var(--mono);font-size:.85em;color:#cbd6ec;background:#ffffff0f;padding:.05em .36em;border-radius:5px}.card{position:relative;width:100%;margin-top:2.1rem;padding:clamp(1.1rem,3vw,1.7rem);border-radius:18px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(8px);box-shadow:0 24px 60px -34px #000000d9;opacity:0;animation:rise .85s .26s var(--ease) forwards}.gate{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.6rem 1rem}.gate .ic{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;border:1px solid var(--line2);color:var(--acc)}.gate .ic svg{width:22px;height:22px}.gate p{color:var(--mut);max-width:30ch;line-height:1.55}.gbtn{display:inline-flex;align-items:center;gap:.7rem;font:inherit;font-weight:600;font-size:.97rem;color:#1f2430;background:#fff;border:0;border-radius:11px;padding:.8rem 1.4rem;cursor:pointer;transition:transform .12s var(--ease),box-shadow .2s;box-shadow:0 10px 26px -14px #0009}.gbtn:hover{transform:translateY(-1px)}.gbtn svg{width:18px;height:18px}.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;width:100%;min-height:9rem;padding:1.7rem;cursor:pointer;text-align:center;border-radius:13px;border:1.5px dashed var(--line2);background:#ffffff03;transition:border-color .2s var(--ease),background .2s var(--ease)}.drop:hover{border-color:#ffffff47;background:#ffffff08}.drop.hot{border-color:var(--acc);background:#5fe0c20d}.drop .ic{width:40px;height:40px;display:grid;place-items:center;border-radius:11px;border:1px solid var(--line2);color:#cbd6ec}.drop.hot .ic,.drop.has .ic{color:var(--acc);border-color:#5fe0c266}.drop .ic svg{width:20px;height:20px}.drop b{font-weight:600;font-size:1rem;color:#dce4f2}.drop small{color:var(--faint);font-family:var(--mono);font-size:.73rem}.drop.has small{color:var(--acc)}.actions{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap;margin-top:1.15rem}.btn{font:inherit;font-weight:600;font-size:.97rem;cursor:pointer;border-radius:11px;padding:.78rem 1.5rem;display:inline-flex;align-items:center;gap:.5rem;border:1px solid transparent;transition:transform .12s var(--ease),background .2s,border-color .2s,color .2s,opacity .2s;text-decoration:none}.btn svg{width:17px;height:17px}.btn.primary{color:#04130f;background:var(--acc);box-shadow:0 10px 26px -12px #5fe0c28c}.btn.primary:hover:not(:disabled){transform:translateY(-1px)}.btn.primary:disabled{opacity:.35;cursor:not-allowed}.btn.ghost{color:var(--mut);background:transparent;border-color:var(--line2)}.btn.ghost:hover{color:var(--ink);border-color:#ffffff4d}.proc{display:flex;flex-direction:column;gap:1rem;padding:.4rem .2rem}.proc .head{display:flex;align-items:center;justify-content:space-between;gap:1rem}.proc .stage{display:flex;align-items:center;gap:.6rem;font-weight:600;color:#dce4f2;font-size:1.02rem;text-align:left}.spin{width:18px;height:18px;color:var(--acc);flex:none;animation:spin 1s linear infinite}.pct{font-family:var(--mono);font-size:.92rem;color:var(--acc);font-variant-numeric:tabular-nums}.bar{height:7px;border-radius:99px;background:#ffffff12;overflow:hidden;position:relative}.bar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--acc2),var(--acc));transition:width .5s var(--ease);position:relative}.bar i:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:translate(-100%);animation:shimmer 1.6s ease-in-out infinite}.steps{display:flex;align-items:center;justify-content:space-between;gap:.4rem}.step{flex:1;display:flex;align-items:center;gap:.45rem;font-size:.72rem;color:var(--faint);font-family:var(--mono)}.step .d{width:7px;height:7px;border-radius:50%;background:#ffffff29;flex:none;transition:.3s}.step.on .d{background:var(--acc);box-shadow:0 0 0 4px #5fe0c224}.step.done .d{background:var(--acc)}.step.on,.step.done{color:#afbad2}.foot{display:flex;align-items:center;justify-content:center;gap:.5rem;color:var(--faint);font-size:.8rem;font-family:var(--mono)}.foot .t{color:#afbad2}.res{display:flex;flex-direction:column;gap:1.1rem;align-items:center}.ok{display:inline-flex;align-items:center;gap:.6rem;color:var(--acc);font-weight:600}.ok svg{width:22px;height:22px}.ok .draw{stroke-dasharray:40;stroke-dashoffset:40;animation:draw .6s .1s var(--ease) forwards}.res .meta{color:var(--mut);font-size:.95rem}.res .meta b{color:var(--ink);font-weight:600}.player{width:100%;display:flex;align-items:center;gap:.85rem;padding:.8rem .9rem;border-radius:13px;border:1px solid var(--line);background:#ffffff05}.pp{width:42px;height:42px;flex:none;border-radius:11px;border:0;cursor:pointer;display:grid;place-items:center;color:#04130f;background:var(--acc);transition:transform .12s var(--ease)}.pp:hover{transform:scale(1.05)}.pp svg{width:19px;height:19px}.pbody{flex:1;display:flex;flex-direction:column;gap:.4rem;min-width:0}.plabel{display:flex;align-items:center;gap:.5rem;color:#c7d2e8;font-size:.82rem}.plabel svg{width:15px;height:15px;color:var(--acc)}.seek{height:6px;border-radius:99px;background:#ffffff1a;cursor:pointer;position:relative}.seek i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--acc2),var(--acc))}.ptime{font-family:var(--mono);font-size:.72rem;color:var(--faint);display:flex;justify-content:space-between}.dls{display:flex;gap:.7rem;width:100%;flex-wrap:wrap}.dls .btn{flex:1;justify-content:center;min-width:11rem}.howto{color:var(--faint);font-size:.8rem;line-height:1.5;max-width:34rem}.howto b{color:#afbad2;font-weight:600}.msg{min-height:1.2rem;color:var(--mut);font-size:.92rem;margin-top:.2rem}.msg.err,.err-ic{color:var(--warn)}.err-ic svg{width:30px;height:30px}.history{width:100%;max-width:42rem;margin-top:1.6rem;opacity:0;animation:rise .8s .3s var(--ease) forwards}.history h3{font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);text-align:left;margin-bottom:.6rem}.hrow{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.65rem .85rem;border:1px solid var(--line);border-radius:11px;background:#ffffff04;margin-bottom:.5rem}.hrow .l{display:flex;align-items:center;gap:.6rem;min-width:0;font-size:.86rem;color:#c7d2e8}.hrow .l svg{width:15px;height:15px;color:var(--acc);flex:none}.hrow .hname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:16rem}.hrow .hpersona{flex:none;font-family:var(--mono);font-size:.62rem;letter-spacing:.04em;text-transform:uppercase;color:var(--acc);border:1px solid rgba(95,224,194,.28);border-radius:6px;padding:.1rem .4rem}.hrow .when{font-family:var(--mono);font-size:.7rem;color:var(--faint)}.hrow a{font-size:.8rem;color:var(--acc);text-decoration:none;font-weight:600;white-space:nowrap}.hrow .st{font-family:var(--mono);font-size:.7rem;color:var(--faint)}.promo{position:relative;width:100%;max-width:44rem;margin-top:1.9rem;border-radius:18px;overflow:hidden;border:1px solid var(--line2);box-shadow:0 30px 70px -30px #000c;aspect-ratio:16/9;background:#0a0d13}.promo video{width:100%;height:100%;display:block;object-fit:cover}.promoplay{position:absolute;inset:0;margin:auto;width:66px;height:66px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;color:#04130f;background:var(--acc);box-shadow:0 12px 34px -8px #5fe0c299;transition:transform .15s var(--ease)}.promoplay:hover{transform:scale(1.07)}.promoplay svg{width:26px;height:26px;margin-left:3px}.promobadge{position:absolute;top:.7rem;right:.7rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.05em;color:#c7d2e8;background:#00000073;border:1px solid var(--line2);border-radius:999px;padding:.2rem .55rem}.promo.playing .promoplay,.promo.playing .promobadge{opacity:0;pointer-events:none;transition:opacity .2s}.how{width:100%;max-width:52rem;margin-top:2.4rem}.how h3{font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);text-align:center;margin-bottom:1.1rem}.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.stepc{margin:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel);text-align:left}.stepc img{width:100%;height:auto;display:block;border-bottom:1px solid var(--line)}.stepc figcaption{padding:.8rem .9rem}.stepc b{display:block;font-size:.9rem;color:#dce4f2}.stepc span{display:block;color:var(--mut);font-size:.8rem;line-height:1.45;margin-top:.3rem}@media (max-width:720px){.steps3{grid-template-columns:1fr}}.demo{width:100%;max-width:40rem;margin-top:1.5rem;padding:1rem 1.1rem;border-radius:16px;border:1px solid var(--line);background:#ffffff05;text-align:center}.dsrc{font-size:.85rem;color:#c7d2e8;line-height:1.5}.dsrc span{color:var(--faint)}.dchips{display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center;margin:.8rem 0 .65rem}.dchip{display:inline-flex;align-items:center;gap:.4rem;font:inherit;font-size:.8rem;color:#c7d2e8;background:#ffffff08;border:1px solid var(--line2);border-radius:999px;padding:.38rem .8rem;cursor:pointer;transition:.15s}.dchip:hover{border-color:#ffffff52}.dchip.on{color:#04130f;background:var(--acc);border-color:var(--acc);font-weight:600}.dchip svg{width:12px;height:12px}.dline{min-height:1.4rem;font-size:.92rem;color:#dce4f2;font-style:italic;transition:opacity .2s}.modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:1.25rem;background:#04060aad;backdrop-filter:blur(7px);animation:fade .25s ease}.sheet{width:100%;max-width:33rem;max-height:90dvh;overflow:auto;border-radius:22px;border:1px solid var(--line2);background:linear-gradient(180deg,#0f131b,#0a0d13);box-shadow:0 44px 100px -34px #000000eb;padding:clamp(1.3rem,3.5vw,1.9rem);position:relative;animation:pop .34s var(--ease)}.sheet h2{font-family:var(--disp);font-weight:700;font-size:1.42rem;letter-spacing:-.02em}.sheet .msub{color:var(--mut);font-size:.9rem;margin-top:.35rem;line-height:1.5}.x{position:absolute;top:1rem;right:1rem;width:30px;height:30px;border-radius:9px;border:1px solid var(--line2);background:transparent;color:var(--mut);cursor:pointer;display:grid;place-items:center;transition:.15s}.x:hover{color:var(--ink);border-color:#ffffff4d}.x svg{width:15px;height:15px}.grp{margin-top:1.35rem;text-align:left}.glabel{display:block;font-family:var(--mono);font-size:.67rem;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:.6rem}.sel{width:100%;font:inherit;font-size:.95rem;color:var(--ink);background:#ffffff08;border:1px solid var(--line2);border-radius:11px;padding:.72rem .85rem;cursor:pointer;transition:border-color .15s}.sel:hover{border-color:#ffffff4d}.sel:focus{outline:none;border-color:var(--acc)}.cards{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.pcard{text-align:left;border:1px solid var(--line2);border-radius:13px;padding:.7rem .8rem;cursor:pointer;background:#ffffff03;transition:border-color .15s,background .15s;position:relative}.pcard:hover{border-color:#ffffff4d}.pcard.sel{border-color:var(--acc);background:#5fe0c20f}.pcard b{display:block;font-size:.9rem;color:#dce4f2;font-weight:600}.pcard small{display:block;color:var(--faint);font-size:.73rem;margin-top:.18rem;line-height:1.32;padding-right:1.6rem}.ppreview{position:absolute;bottom:.5rem;right:.5rem;width:24px;height:24px;display:grid;place-items:center;border-radius:7px;border:1px solid var(--line2);color:#afbad2;background:#0000002e;transition:.15s}.ppreview:hover{color:var(--acc);border-color:#5fe0c273}.ppreview svg{width:11px;height:11px}.pcard.playing .ppreview{color:var(--acc);border-color:var(--acc)}.pcard .ck{position:absolute;top:.5rem;right:.5rem;width:15px;height:15px;color:var(--acc);opacity:0;transition:opacity .15s}.pcard.sel .ck{opacity:1}.seg{display:flex;gap:.5rem}.chip{flex:1;text-align:center;font:inherit;font-size:.85rem;color:var(--mut);border:1px solid var(--line2);border-radius:10px;padding:.56rem;cursor:pointer;transition:.15s}.chip:hover{color:var(--ink)}.chip.sel{color:#04130f;background:var(--acc);border-color:var(--acc);font-weight:600}#startDub{width:100%;margin-top:1.6rem;justify-content:center}@keyframes fade{0%{opacity:0}}@keyframes pop{0%{opacity:0;transform:translateY(18px) scale(.985)}}@media (max-width:480px){.cards{grid-template-columns:1fr}}.specs{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;margin-top:1.9rem;opacity:0;animation:rise .8s .36s var(--ease) forwards}.specs span{font-family:var(--mono);font-size:.69rem;letter-spacing:.03em;color:#8b97b2;border:1px solid var(--line);border-radius:7px;padding:.34rem .6rem}.specs b{color:var(--acc);font-weight:500}footer{margin-top:2.1rem;font-family:var(--mono);font-size:.71rem;color:var(--faint);letter-spacing:.05em;opacity:0;animation:rise .8s .44s forwards}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{transform:translate(-100%)}60%,to{transform:translate(100%)}}@keyframes draw{to{stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){*{animation-duration:1ms!important}}@media (max-width:480px){.step span{display:none}.steps{justify-content:space-around}.auth .who span{display:none}}
