@font-face{font-family:'Pixelify Sans';font-weight:500;font-display:swap;src:url(/assets/fonts/pixelify-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Pixelify Sans';font-weight:700;font-display:swap;src:url(/assets/fonts/pixelify-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-weight:600;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-600-normal.woff2) format('woff2')}
:root{--desk:#2A1760;--desk2:#3A2488;--void:#12082E;--win:#E6DDFB;--paper:#F4EFFF;--ink:#1A1033;--violet:#6D3FE0;--pink:#FF5CC8;--mint:#6EF0C2;--yellow:#FFE45E;--mute:#4B3A82;--mute2:#2E2159;--lav:#CDB8FF;--lav2:#BBA9F0;--dash:#8E78D6;--px:'Pixelify Sans',ui-monospace,monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background-color:var(--desk);background-image:radial-gradient(#3A2488 1.5px,transparent 1.5px);background-size:12px 12px;color:var(--paper);font:400 15px/1.6 'IBM Plex Mono',ui-monospace,monospace;padding-bottom:64px;overflow-x:hidden}
h1,h2,h3,p,ul,dl,dd{margin:0}
ul{padding:0;list-style:none}
a{color:var(--violet)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--yellow);color:var(--ink);padding:10px 14px;z-index:200;font-family:var(--px);font-weight:700}.skip:focus{left:8px}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.px{font-family:var(--px);font-weight:700}
.h2{font:700 44px/1.1 var(--px);color:var(--paper)}
.muted-l{color:var(--lav)}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:8px 16px;background:var(--pink);color:var(--ink);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);font:700 17px var(--px);text-decoration:none;cursor:pointer;transition:transform .08s steps(2),box-shadow .08s steps(2)}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.btn:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--ink)}
.btn.paper{background:var(--paper)}
.btn.big{min-height:52px;padding:12px 24px;font-size:20px}
.btn.wide{min-height:56px;font-size:22px;box-shadow:5px 5px 0 var(--ink)}
.btn.row{justify-content:space-between;width:100%;min-height:56px;padding:14px 18px}
.btn.row small{font:400 14px 'IBM Plex Mono',monospace;color:var(--mute);text-align:right;overflow-wrap:anywhere}
.chip{min-height:44px;padding:6px 18px;background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font:700 17px var(--px);cursor:pointer}
.chip:hover{background:#D5C6F7}
.chip[aria-pressed="true"]{background:var(--pink)}
.chips{display:flex;flex-wrap:wrap;gap:12px}
/* windows */
.win{background:var(--win);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink);color:var(--ink);min-width:0}
.win.sm{box-shadow:6px 6px 0 var(--ink)}
.win.dark{background:var(--void);color:var(--lav)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 10px;background:var(--violet);color:#fff;border-bottom:3px solid var(--ink);font:500 16px var(--px)}
.dark .bar{background:var(--desk2);color:var(--paper)}
.bar small{font:400 13px 'IBM Plex Mono',monospace;color:var(--lav)}
.wbtns{display:flex;gap:6px}
.wb{width:24px;height:24px;padding:0;display:flex;align-items:center;justify-content:center;background:var(--win);border:2px solid var(--ink);cursor:pointer}.wb.x{background:var(--pink)}.wb.min{align-items:flex-end}
.body{padding:28px}
.pop{animation:pop .45s steps(5) both}
@keyframes pop{0%{opacity:0;transform:scale(.94) translateY(10px)}100%{opacity:1;transform:none}}
/* header / marquee */
.menubar{background:var(--win);border-bottom:3px solid var(--ink);position:relative}
.menubar .wrap{padding-top:10px;padding-bottom:10px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px}
.logo{display:flex;align-items:center;text-decoration:none;min-height:44px}
.lockup{display:block;width:240px;height:40px;shape-rendering:crispEdges}
.nav{display:flex;flex-wrap:wrap;gap:4px;flex:1 1 auto}
.nav a{color:var(--ink);text-decoration:none;padding:10px 14px;font-weight:500}
.nav a:hover,.nav a[aria-current]{background:var(--violet);color:#fff}
.burger{display:none;margin-left:auto;background:var(--paper);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);width:48px;height:44px;align-items:center;justify-content:center;cursor:pointer;padding:0}
.burger[aria-expanded="true"]{background:var(--lav)}
.marquee{background:var(--void);border-bottom:3px solid var(--ink);overflow:hidden;white-space:nowrap}
.marq{display:flex;width:max-content;padding:8px 0;font:400 17px var(--px);letter-spacing:.08em;color:var(--lav);animation:marquee 30s linear infinite}
.marq:hover{animation-play-state:paused}
.marq span{padding-right:36px}.marq .p{color:var(--pink)}.marq .m{color:var(--mint)}
@keyframes marquee{to{transform:translateX(-50%)}}
/* hero */
.hero{padding:56px 0 40px}
.hero .wrap{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start}
.hero .main{flex:1 1 580px;min-width:0}
.hero .side{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:28px}
.welcome .body{padding:40px 40px 44px}
.kick{font-size:13px;letter-spacing:.14em;color:var(--mute);font-weight:600;margin-bottom:14px}
.headline{margin-bottom:20px;color:var(--ink)}
.headline .l1{font:700 64px/1.08 var(--px)}
.headline .l2{font:700 32px/1.2 var(--px);color:var(--mute);margin-top:6px}
.typed{font:700 64px/1.08 var(--px);color:var(--violet);white-space:nowrap;min-height:1.1em}
.typed .cur{display:inline-block;width:.45em;height:.78em;background:var(--violet);margin-left:6px;vertical-align:-.02em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.lead{max-width:520px;font-size:17px;color:var(--mute2);margin-bottom:28px}
.hero .cta{display:flex;flex-wrap:wrap;gap:16px}
.restore{display:none}
.restore.on{display:inline-flex}
/* crystal */
.crystal{position:relative;background:var(--void);height:220px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.crystal button{background:transparent;border:0;padding:0;cursor:pointer;width:62%;max-width:300px;transition:transform .12s steps(3)}
.crystal svg{display:block;overflow:visible;width:100%;height:auto}
.crystal g{transition:transform .12s steps(3)}
.sq{position:absolute;animation:bob 2.4s steps(6) infinite}
@keyframes bob{50%{transform:translateY(-8px)}}
/* terminal */
.term{background:var(--void);color:var(--lav);font-size:14px;line-height:1.8;padding:20px 22px}
.term .log{min-height:190px}
.term .log div{white-space:pre-wrap;overflow-wrap:anywhere}
.term .ok{color:var(--mint)}.term .soon{color:var(--yellow)}.term .dim{color:#A793E6}
.term form{display:flex;align-items:center;gap:8px;margin-top:8px}
.term label{color:var(--mint)}
.term input{flex:1;min-width:0;background:transparent;border:0;border-bottom:2px dashed #5B45B0;color:var(--paper);font:inherit;padding:6px 0;min-height:36px}
.term .cmds{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.term .cmds button{background:var(--desk2);color:var(--paper);border:2px solid #B79CFF;padding:6px 12px;font:13px 'IBM Plex Mono',monospace;cursor:pointer;min-height:36px}
.term .cmds button:hover{background:var(--violet)}
.term[data-js] .static{display:none}
/* sections */
.sec{padding:40px 0 56px}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}
.sec-head p{color:var(--lav);max-width:460px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:32px}
.grid.g3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.card{background:var(--win);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);color:var(--ink);display:flex;flex-direction:column;text-decoration:none;transition:transform .12s steps(3),box-shadow .12s steps(3);min-width:0}
a.card:hover,.card.hov:hover{transform:translate(-4px,-4px);box-shadow:10px 10px 0 var(--ink)}
.card .tag{background:var(--violet);color:#fff;padding:6px 10px;border-bottom:3px solid var(--ink);font:500 15px var(--px)}
.card .in{padding:20px;display:flex;flex-direction:column;gap:14px;flex:1}
.card h3{font:700 26px/1.15 var(--px)}
.card p{color:var(--mute2);flex:1}
.card .foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.price{font:700 24px var(--px)}
.thumb{position:relative;overflow:hidden;background-color:#CDB8FF;background-image:linear-gradient(45deg,#C2A9FA 25%,transparent 25%,transparent 50%,#C2A9FA 50%,#C2A9FA 75%,transparent 75%);background-size:32px 32px;aspect-ratio:16/10;border:3px solid var(--ink);display:flex;align-items:center;justify-content:center}
.thumb:after{content:"";position:absolute;left:0;right:0;top:-30%;height:24%;background:rgba(255,255,255,.45);pointer-events:none}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.thumb .lbl{position:relative;z-index:1;background:var(--ink);color:var(--win);font-size:12px;padding:4px 8px}
.card:hover .thumb,.stage:hover .thumb{animation:stripes .7s linear infinite}
.card:hover .thumb:after,.stage:hover .thumb:after{animation:sweep 1s linear infinite}
@keyframes stripes{to{background-position:32px 0}}
@keyframes sweep{to{top:130%}}
.soon-badge{background:var(--yellow);border:2px solid var(--ink);padding:0 8px;font-size:13px}
/* stepper */
.steps{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start}
.steps .list{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:18px}
.step{text-align:left;background:var(--desk2);color:var(--paper);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:18px 22px;cursor:pointer;display:flex;gap:18px;align-items:flex-start;font:inherit;min-height:56px}
.step .n{font:700 40px/1 var(--px);color:var(--pink)}
.step .t{display:block;font:700 23px/1.1 var(--px);margin-bottom:4px}
.step .d{font-size:14px;color:#DCCFFF}
.step[aria-pressed="true"]{background:var(--violet);box-shadow:2px 2px 0 var(--ink)}
.step[aria-pressed="true"] .n{color:var(--yellow)}
.step[aria-pressed="true"] .d{color:var(--paper)}
.demo{flex:1 1 440px}
.demo .body{min-height:230px;display:flex;flex-direction:column;justify-content:center;gap:16px}
.demo [hidden]{display:none!important}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.tile{background:var(--paper);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:16px 8px;text-align:center;font:700 16px var(--px)}
.tile i{display:block;width:28px;height:28px;margin:0 auto 10px;border:3px solid var(--ink);animation:bob 2.4s steps(6) infinite}
.progress{height:30px;border:3px solid var(--ink);background:var(--paper);padding:3px}
.progress b{display:block;height:100%;width:0;background-color:var(--violet);background-image:repeating-linear-gradient(90deg,transparent 0 12px,var(--win) 12px 15px)}
.demo.run .progress b{animation:fill 1.8s steps(14) both}
.ready{align-self:flex-start;background:var(--mint);border:3px solid var(--ink);padding:6px 14px;font:700 18px var(--px);opacity:0}
.demo.run .ready{animation:pop .45s steps(5) 1.7s both}
@keyframes fill{from{width:0}to{width:100%}}
.bubble{max-width:85%;padding:10px 14px;border:3px solid var(--ink);font-size:14px}
.bubble.a{align-self:flex-start;background:var(--paper)}.bubble.b{align-self:flex-end;background:var(--violet);color:#fff}
.note{font-size:12px;color:var(--mute)}
/* help */
.help .body{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start;padding:36px 40px}
.help .l{flex:1 1 320px;min-width:0}
.help .l h2{font:700 40px/1.1 var(--px);margin-bottom:12px}
.help .l p{color:var(--mute2)}
.help .r{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:14px}
.help .r .pair{display:flex;gap:12px;align-items:stretch}
.help .r .pair .btn.row{flex:1}
.copy{min-width:104px;background:var(--paper)}.copy.ok{background:var(--mint)}
/* footer */
.footer{background:var(--void);border-top:3px solid var(--violet);padding:48px 0 36px;color:var(--lav2);font-size:14px}
.footer .cols{display:flex;flex-wrap:wrap;gap:36px 64px;justify-content:space-between}
.footer .brand{flex:1 1 280px;max-width:380px}
.footer .brand .logo{min-height:0;margin-bottom:12px}.footer .lockup{width:180px;height:30px}
.footer nav{display:flex;flex-wrap:wrap;gap:36px 64px}
.footer nav div{display:flex;flex-direction:column;gap:10px}
.footer nav b{font:400 18px var(--px);color:var(--paper)}
.footer a{color:var(--lav);text-decoration:none}.footer a:hover{color:var(--pink)}
.footer .legal{margin-top:36px;padding-top:20px;border-top:2px dashed var(--desk2);font-size:13px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}
.ph{color:inherit;border-bottom:1px dashed currentColor}
/* taskbar */
.taskbar{position:fixed;left:0;right:0;bottom:0;height:52px;background:var(--win);border-top:3px solid var(--ink);box-shadow:inset 0 3px 0 #fff;display:flex;align-items:center;gap:8px;padding:0 8px;z-index:70;color:var(--ink)}
.tb{height:38px;padding:0 12px;display:flex;align-items:center;gap:8px;background:var(--paper);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);cursor:pointer;font:700 18px var(--px);color:var(--ink)}
.tb[aria-expanded="true"],.tb[aria-pressed="true"]{background:var(--lav)}
.tb .led{width:10px;height:10px;background:var(--dash);border:2px solid var(--ink)}
.tb[aria-pressed="true"] .led{background:var(--mint)}
.tb.crt{font-size:16px;padding:0 10px}
.chipbox{height:38px;padding:0 14px;display:flex;align-items:center;gap:8px;background:var(--paper);border:2px solid var(--ink);box-shadow:inset 2px 2px 0 var(--dash);font-size:13px;white-space:nowrap}
.chipbox i{width:10px;height:10px;background:var(--violet);display:inline-block}
.clock{height:38px;padding:0 10px;display:flex;align-items:center;background:var(--paper);border:2px solid var(--ink);box-shadow:inset 2px 2px 0 var(--dash);font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.sp{flex:1}
.start-menu{position:fixed;left:8px;bottom:60px;width:270px;max-width:calc(100vw - 16px);z-index:72;background:var(--win);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);display:flex;color:var(--ink)}
.start-menu[hidden]{display:none}
.start-menu .stripe{background:var(--violet);width:34px;flex:none;display:flex;align-items:flex-end;justify-content:center;padding:10px 0}
.start-menu .stripe span{writing-mode:vertical-rl;transform:rotate(180deg);font:700 22px var(--px);color:#fff;letter-spacing:.08em}
.start-menu nav{flex:1;min-width:0;display:flex;flex-direction:column}
.sm-item{display:flex;flex-direction:column;justify-content:center;padding:10px 14px;text-decoration:none;color:var(--ink);min-height:52px;border:0;border-bottom:2px solid var(--lav);background:transparent;text-align:left;cursor:pointer;font:inherit}
.sm-item b{font:700 19px/1.1 var(--px)}.sm-item small{font-size:12px;color:var(--mute)}
.sm-item:hover{background:var(--violet);color:#fff}.sm-item:hover small{color:#fff}
.scrim{position:fixed;inset:0;z-index:65;background:transparent;border:0;cursor:default}
.scrim[hidden]{display:none}
.crt-on:before,.crt-on:after{content:"";position:fixed;inset:0;pointer-events:none}
.crt-on:before{z-index:60;background-image:repeating-linear-gradient(0deg,rgba(18,8,46,.28) 0 1px,transparent 1px 3px);animation:flick .16s steps(2) infinite}
.crt-on:after{z-index:61;background-image:radial-gradient(ellipse at center,transparent 55%,rgba(18,8,46,.6) 100%)}
@keyframes flick{0%,100%{opacity:1}50%{opacity:.86}}
.off{position:fixed;inset:0;z-index:100;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:24px;text-align:center}
.off[hidden]{display:none}
.off p{font:700 28px/1.3 var(--px);color:#FFB454;max-width:520px}
.off .btn{border-color:var(--paper);box-shadow:4px 4px 0 var(--violet)}
/* breadcrumb / product */
.crumbs{padding:28px 0 20px;font-size:14px;color:var(--lav)}
.crumbs a{color:var(--lav);text-decoration:none}.crumbs a:hover{color:var(--pink)}.crumbs span{color:var(--paper)}
.buyzone{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start;padding-bottom:48px}
.buyzone .gal{flex:1 1 560px;min-width:0}
.buyzone .buy{flex:1 1 380px;min-width:0}
.gal .body{padding:20px;display:flex;flex-direction:column;gap:16px}
.gal .nav2{display:flex;gap:12px;align-items:stretch}
.gal .arrow{flex:none;width:48px;background:var(--paper);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center}
.gal .thumbs{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.gal .th{aspect-ratio:16/10;border:3px solid var(--ink);cursor:pointer;padding:0;overflow:hidden;background:#CDB8FF}
.gal .th img{width:100%;height:100%;object-fit:cover;display:block}
.gal .th[aria-pressed="true"]{border-color:var(--violet);box-shadow:3px 3px 0 var(--violet)}
.stage .thumb{background-color:var(--stage,#CDB8FF)}
.buy .body{display:flex;flex-direction:column;gap:18px}
.stock{background:var(--mint);color:var(--ink);padding:0 8px;font-size:14px;border:2px solid var(--ink)}
.stock.up{background:var(--yellow)}
.kindtag{align-self:flex-start;background:var(--ink);color:var(--win);font-size:12px;letter-spacing:.12em;padding:4px 10px}
.buy h1{font:700 44px/1.05 var(--px)}
.buy .lede{color:var(--mute2)}
.label{font-size:13px;letter-spacing:.12em;font-weight:600;color:var(--mute);margin-bottom:8px}
.lic{background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:8px 20px;font:700 18px var(--px);cursor:pointer;min-height:44px}
.lic[aria-pressed="true"]{background:var(--violet);color:#fff}
.licnote{margin-top:10px;font-size:13px;color:var(--mute)}
.pricerow{display:flex;align-items:baseline;gap:10px;border-top:3px dashed var(--ink);padding-top:16px}
.pricerow .price{font-size:48px;line-height:1}
.pricerow small{font-size:13px;color:var(--mute)}
.checks{display:flex;flex-direction:column;gap:8px;font-size:14px}
.checks li{display:flex;gap:10px;align-items:flex-start}
.checks svg{flex:none;margin-top:4px}
.buy a.inline{font-weight:600;font-size:14px}
.tabs{display:flex;flex-wrap:wrap;border-bottom:3px solid var(--ink);margin-bottom:40px}
.tab{background:var(--win);color:var(--ink);border:3px solid var(--ink);border-bottom:0;margin-right:6px;padding:12px 26px;font:700 19px var(--px);cursor:pointer;min-height:50px}
.tab[aria-pressed="true"]{background:var(--violet);color:#fff}
.panel{padding-bottom:56px}
.panel[hidden]{display:none}
.panel>h2{margin-bottom:24px}
.two{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start;margin-bottom:32px}
.two>.main{flex:1 1 560px;min-width:0}.two>.side{flex:1 1 340px;min-width:0}
.feats{padding:28px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.feat{background:var(--paper);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:16px}
.feat .n{font:700 32px/1 var(--px);color:var(--violet)}
.feat h3{margin:6px 0;font:700 22px/1.15 var(--px)}
.feat p{color:var(--mute2);font-size:14px}
dl.compat{padding:8px 24px 16px;font-size:14px}
dl.compat div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:2px dashed var(--dash)}
dl.compat div:last-child{border:0}
dl.compat dt{color:var(--mute)}dl.compat dd{font-weight:600;text-align:right}
.cmp{position:relative;aspect-ratio:16/7;border:3px solid var(--ink);overflow:hidden;background:var(--violet)}
.cmp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cmp .before{position:absolute;inset:0;clip-path:inset(0 var(--r,45%) 0 0)}
.cmp .tagc{position:absolute;top:12px;background:var(--ink);color:var(--paper);font-size:12px;letter-spacing:.12em;padding:4px 10px}
.cmp .line{position:absolute;top:0;bottom:0;left:var(--p,55%);width:4px;margin-left:-2px;background:var(--ink)}
.cmp .knob{position:absolute;top:50%;left:var(--p,55%);width:28px;height:28px;margin:-14px 0 0 -14px;background:var(--yellow);border:3px solid var(--ink)}
.cmprow{display:flex;align-items:center;gap:14px;margin-top:16px}
.cmprow label,.cmprow span{font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--mute)}
.cmprow input{flex:1;accent-color:var(--pink);height:32px;cursor:pointer}
.videos .body{padding:24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.vcell{display:flex;flex-direction:column;gap:10px;min-width:0}
.vid{position:relative;aspect-ratio:16/9;background:var(--void);border:3px solid var(--ink);width:100%}
.vid iframe,.vbtn,.vbtn img{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid.empty{display:flex;align-items:center;justify-content:center;color:var(--lav);font:700 14px var(--px);letter-spacing:.1em;background-image:repeating-linear-gradient(45deg,#1d0f45 0 12px,var(--void) 12px 24px)}
.vbtn{padding:0;background:none;border:0;cursor:pointer}.vbtn img{object-fit:cover}
.play{position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;background:var(--pink);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.play:after{content:"";position:absolute;left:26px;top:18px;border-left:22px solid var(--ink);border-top:14px solid transparent;border-bottom:14px solid transparent}
.vbtn:hover .play{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.sup3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-bottom:32px}
.sup3 .card{padding:24px;gap:8px}
.sup3 .card b{font:700 26px var(--px)}
.sup3 .card span{color:var(--mute2);font-size:14px}
.sup3 .card em{font-style:normal;color:var(--violet);font-weight:600;margin-top:4px}
.ticket .body{padding:24px;display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start}
.ticket .k{flex:1 1 280px;min-width:0}
.ticket .out{flex:1 1 360px;min-width:0;background:var(--paper);border:3px solid var(--ink);padding:18px;display:flex;flex-direction:column;gap:10px}
.ticket .out .where{font-size:13px;color:var(--mute)}.ticket .out .where strong{color:var(--ink)}
.ticket .out p{font-size:14px;color:var(--mute2)}
.ticket .out .btn{align-self:flex-start;min-height:46px}
.faq .search{padding:16px 24px;border-bottom:2px dashed var(--dash);display:flex;align-items:center;gap:12px}
.faq .search label{font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--mute)}
.faq input{flex:1;min-width:0;background:#fff;border:3px solid var(--ink);padding:8px 12px;font:15px 'IBM Plex Mono',monospace;min-height:44px;color:var(--ink)}
.q{border-bottom:2px dashed var(--dash)}
.q h3{margin:0}
.q button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;background:transparent;border:0;padding:16px 24px;font:600 16px 'IBM Plex Mono',monospace;color:var(--ink);text-align:left;cursor:pointer;min-height:56px}
.q button:hover{background:#D5C6F7}
.q button i{font:400 26px var(--px);font-style:normal;color:var(--violet);flex:none}
.q p{padding:0 24px 20px;color:var(--mute2);font-size:14px}
.q[hidden],.q p[hidden]{display:none}
.nomatch{padding:20px 24px;font-size:14px;color:var(--mute2)}
.stack{display:flex;flex-direction:column;gap:32px}
.contact .body{padding:24px;font-size:14px;display:flex;flex-direction:column;gap:6px}
.contact .em{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.contact .em a{color:var(--ink);font-weight:600;font-size:16px;overflow-wrap:anywhere}
.contact .copy{min-height:36px;padding:4px 12px;font-size:15px;box-shadow:3px 3px 0 var(--ink)}
.log .body{padding:8px 28px}
.rel{display:flex;flex-wrap:wrap;gap:8px 28px;padding:20px 0;border-bottom:2px dashed var(--dash)}
.rel:last-child{border:0}
.rel .v{flex:0 0 160px}.rel .v b{display:block;font:700 22px var(--px)}.rel .v small{font-size:13px;color:var(--mute)}
.rel ul{flex:1 1 320px;padding-left:20px;list-style:disc;font-size:14px;color:var(--mute2)}
.dlg{position:fixed;inset:0;z-index:80;background:rgba(18,8,46,.78);display:flex;align-items:center;justify-content:center;padding:16px}
.dlg[hidden]{display:none}
.dlg .win{width:440px;max-width:100%}
.dlg .body{display:flex;flex-direction:column;gap:16px}
.dlg h2{font:700 24px var(--px)}
.dlg .acts{display:flex;gap:12px;flex-wrap:wrap}
.dlg .btn{min-height:46px;padding:8px 20px;font-size:18px}
.prose{padding:28px;max-width:760px;display:flex;flex-direction:column;gap:14px}
.prose h2{font:700 26px var(--px);margin-top:10px}
.prose p,.prose li{color:var(--mute2)}
.err{padding:56px 0 72px}
.bsod{background:#1c3fd6;color:#fff;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:36px}
.bsod h1{font:700 40px/1.1 var(--px);background:#fff;color:#1c3fd6;display:inline-block;padding:2px 12px;margin-bottom:20px}
.bsod p{margin-bottom:14px;max-width:60ch}
@media(max-width:760px){
body{font-size:14px}
.wrap{padding:0 16px}
.menubar .wrap{padding-top:8px;padding-bottom:8px;flex-wrap:nowrap;gap:12px}
.lockup{width:180px;height:30px}
.burger{display:flex}
.nav{display:none;position:absolute;left:0;right:0;top:100%;z-index:50;flex-direction:column;gap:0;background:var(--paper);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.nav.open{display:flex}
.nav a{padding:14px 20px;font:700 20px var(--px);border-bottom:2px solid var(--lav)}
.menubar .join{display:none}
.nav .joinm{display:block;background:var(--pink)}
.marq{font-size:15px;padding:6px 0}.marq span{padding-right:28px}
.hero{padding:32px 0 24px}.hero .wrap{gap:24px}
.welcome .body{padding:24px 20px 28px}
.headline .l1,.typed{font-size:42px}.headline .l2{font-size:24px}
.lead{font-size:16px}
.h2{font-size:36px}
.sec{padding:32px 0 40px}
.grid{gap:24px}
.step .n{font-size:34px}.step .t{font-size:20px}
.help .body{padding:24px 20px}.help .l h2{font-size:32px}
.help .r .pair{flex-direction:column}
.chipbox{display:none}
.buy h1{font-size:34px}
.pricerow .price{font-size:40px}
.tab{padding:10px 14px;font-size:16px;margin-right:4px;flex:1}
.panel>h2{font-size:32px}
.feats{padding:20px}
.term{padding:16px}
.crystal{height:200px}
.rel .v{flex:0 0 100%}
.bsod{padding:22px}.bsod h1{font-size:28px}
}
@media(min-width:761px){.nav .joinm{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.pop,.marq,.typed .cur,.sq,.tile i,.demo.run .progress b,.demo.run .ready,.crt-on:before,a.card:hover .thumb,a.card:hover .thumb:after,.stage:hover .thumb,.stage:hover .thumb:after{animation:none!important}.demo.run .progress b{width:100%}.demo.run .ready{opacity:1}.ready{opacity:1}}