:root{--shell:#C4C4C8;--shell-lo:#9C9CA2;--shell-hi:#E2E2E6;--bezel:#4A4A55;--bezel-hi:#5E5E6B;--ink:#2E2E36;--label:#2E2E8A;--lcd-1:#9BBC0F;--lcd-2:#8BAC0F;--lcd-3:#306230;--lcd-4:#0F380F;--btn:#8B1D45;--btn-edge:#5E1230;--pad:#24242B;--void:#05070F;--nebula-1:#2B2A6E;--nebula-2:#163A5C;--nebula-3:#4E2A63;--portal:#E8B54A;--cloud:#E9E4F2;--mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;--body:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",sans-serif;--btnf:"Source Code Pro",ui-monospace,Menlo,monospace;color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--void);color:#EDEAF5;font-family:var(--body)}body{min-height:100svh;overflow-x:hidden}a{color:inherit}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.skip{position:absolute;left:12px;top:-60px;z-index:20;background:var(--lcd-1);color:var(--lcd-4);padding:10px 14px;border-radius:8px;font:700 15px var(--body)}.skip:focus{top:calc(12px + env(safe-area-inset-top,0px))}
.cosmos{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:radial-gradient(60vmax 40vmax at 20% 15%,color-mix(in oklab,var(--nebula-3) 70%,transparent),transparent 60%),radial-gradient(70vmax 50vmax at 85% 30%,color-mix(in oklab,var(--nebula-1) 80%,transparent),transparent 62%),radial-gradient(80vmax 60vmax at 50% 70%,color-mix(in oklab,var(--nebula-2) 75%,transparent),transparent 65%),var(--void)}.stars{position:absolute;inset:-50%;width:2px;height:2px;border-radius:50%;background:transparent}.portal{position:absolute;left:50%;top:44%;width:min(150vmin,1200px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:conic-gradient(from 0deg,#0000 0 6%,var(--portal) 9%,#FFE9B8 12%,#0000 17% 33%,color-mix(in oklab,var(--portal) 80%,#fff) 40%,#0000 47% 60%,var(--portal) 66%,#FFF4D6 70%,#0000 76% 100%);-webkit-mask:radial-gradient(circle,#0000 61%,#000 62%,#000 63.5%,#0000 64.5%,#0000 67%,#000a 67.6%,#0000 69%);mask:radial-gradient(circle,#0000 61%,#000 62%,#000 63.5%,#0000 64.5%,#0000 67%,#000a 67.6%,#0000 69%);filter:drop-shadow(0 0 18px color-mix(in oklab,var(--portal) 70%,transparent));opacity:.85;animation:turn 140s linear infinite}.portal.two{width:min(118vmin,940px);opacity:.55;animation-duration:200s;animation-direction:reverse}.glow{position:absolute;left:50%;top:44%;width:min(110vmin,880px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,#9fd0ff 22%,transparent) 0%,color-mix(in oklab,var(--nebula-1) 30%,transparent) 45%,transparent 70%)}.clouds{position:absolute;left:-10%;right:-10%;bottom:-8vh;height:38vh;background:radial-gradient(28% 60% at 12% 70%,color-mix(in oklab,var(--cloud) 55%,transparent),transparent 70%),radial-gradient(24% 55% at 34% 82%,color-mix(in oklab,var(--cloud) 40%,transparent),transparent 70%),radial-gradient(30% 65% at 62% 78%,color-mix(in oklab,var(--cloud) 48%,transparent),transparent 70%),radial-gradient(26% 58% at 88% 72%,color-mix(in oklab,var(--cloud) 52%,transparent),transparent 70%);filter:blur(18px);animation:drift 60s ease-in-out infinite alternate}@keyframes turn{to{rotate:360deg}}@keyframes drift{to{translate:3% 0}}
.stage{position:relative;z-index:1;min-height:100svh;display:grid;place-items:center;padding:calc(18px + env(safe-area-inset-top,0px)) 14px calc(18px + env(safe-area-inset-bottom,0px));gap:14px}.fallback{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;font:400 14px var(--body);color:#D9D4E8;text-shadow:0 1px 2px #000}.fallback a{color:#F1E8C8}.fallback a.primary{font-weight:700}
.device{--w:min(92vw,470px,calc((100svh - 90px) * .6));width:var(--w);position:relative;background:linear-gradient(160deg,var(--shell-hi) 0%,var(--shell) 22%,var(--shell) 70%,var(--shell-lo) 100%);border-radius:calc(var(--w)*.05) calc(var(--w)*.05) calc(var(--w)*.2) calc(var(--w)*.05);padding:calc(var(--w)*.06) calc(var(--w)*.065) calc(var(--w)*.07);box-shadow:inset 0 2px 0 #fff8,inset 0 -6px 14px #0003,0 30px 60px -20px #000c,0 0 0 1px #0006,0 0 80px color-mix(in oklab,var(--portal) 18%,transparent);font-size:calc(var(--w)*.032)}.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:calc(var(--w)*.035);font:700 .62em var(--mono);letter-spacing:.12em;color:var(--ink);opacity:.75}.led{display:inline-flex;align-items:center;gap:.5em}.led i{width:.8em;height:.8em;border-radius:50%;background:#e03a52;box-shadow:0 0 8px #ff4d6a}.bezel{background:linear-gradient(180deg,var(--bezel-hi),var(--bezel));border-radius:calc(var(--w)*.03) calc(var(--w)*.03) calc(var(--w)*.1) calc(var(--w)*.03);padding:calc(var(--w)*.05) calc(var(--w)*.055) calc(var(--w)*.04);box-shadow:inset 0 3px 6px #0008}.bezel-label{display:flex;align-items:center;gap:.6em;margin:0 0 .7em;font:700 .55em var(--mono);letter-spacing:.14em;color:#C9C9D6}.bezel-label b{flex:1;height:2px;background:linear-gradient(90deg,#d6447a,#4b4bd6)}.lcd{position:relative;aspect-ratio:1/1.02;background:var(--lcd-2);color:var(--lcd-4);border-radius:4px;overflow:hidden;box-shadow:inset 0 0 0 3px #0f380f22,inset 0 0 28px #0f380f55;font:500 .78em/1.35 var(--mono)}.lcd::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,#0f380f0d 0 1px,#0000 1px 3px),repeating-linear-gradient(90deg,#0f380f08 0 1px,#0000 1px 3px)}.scan{position:absolute;left:0;right:0;height:18%;top:-20%;background:linear-gradient(#0000,#9bbc0f55,#0000);pointer-events:none}.scan.go{animation:scan 1.6s steps(16) 1}@keyframes scan{to{top:110%}}.screen{position:absolute;inset:0;padding:5.5% 6%;display:flex;flex-direction:column;gap:.55em;overflow:hidden}.screen[hidden]{display:none}.log{margin:0;padding:0;list-style:none;display:grid;gap:.15em;font-size:.86em;letter-spacing:.02em;text-transform:uppercase}.log li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.log time{opacity:.75;margin-right:.6em}.log b{font-weight:800}
.coin{display:block;width:100%;margin:.1em auto;flex:none}.coin svg{display:block;width:100%;height:auto;overflow:visible;shape-rendering:crispEdges}.coin .rim-side{fill:var(--lcd-3)}.coin .rim-top{fill:var(--lcd-4)}.coin .rim-hi{fill:none;stroke:var(--lcd-1);stroke-width:.45}.coin .reed{fill:none;stroke:var(--lcd-3);stroke-width:.5;stroke-dasharray:.6 .9}.coin .px-side{fill:var(--lcd-3)}.coin .px-deep{fill:var(--lcd-4);opacity:.55}.coin .px-top{fill:var(--lcd-4)}.coin .px-hi{fill:var(--lcd-1)}.coin .cents{fill:var(--lcd-4);font:800 2.5px var(--mono);letter-spacing:.08em}.building .px{opacity:0;animation:fillin .01s steps(1) forwards;animation-delay:calc(.35s + var(--i)*28ms)}.building .rim{opacity:0;animation:rimin .5s steps(5) forwards}@keyframes rimin{from{opacity:0;transform:scaleY(.1)}to{opacity:1;transform:none}}.coin .rim{transform-box:fill-box;transform-origin:center}.tag{margin:0;text-align:center;font:800 1.02em/1.3 var(--mono)}.sub{margin:0;text-align:center;font:500 .82em/1.4 var(--mono)}.menu{margin:0;padding:0;list-style:none;display:grid;gap:.25em;font:700 .9em var(--mono)}.menu li{display:flex;gap:.6em;align-items:center;padding:.25em .4em;border-radius:3px}.menu li[aria-current="true"]{background:var(--lcd-4);color:var(--lcd-1)}.menu .k{margin-left:auto;font-weight:500;opacity:.85;font-size:.85em}.legend{margin-top:auto;display:flex;flex-wrap:wrap;gap:.25em .9em;justify-content:center;font:500 .72em var(--mono);border-top:2px dashed var(--lcd-3);padding-top:.5em}.cursor{display:inline-block;animation:blink 1s steps(1) 4}@keyframes blink{50%{opacity:0}}.pixart{width:44%;margin:.3em auto 0;display:block;shape-rendering:crispEdges}.pixart .k{fill:var(--lcd-4)}.pixart .m{fill:var(--lcd-3)}.pixart .l{fill:var(--lcd-1)}.slide h2,.screen h2{margin:0;font:800 1.15em var(--mono);text-align:center}.slide p{margin:0;text-align:center;font:500 .85em/1.45 var(--mono)}.dots{display:flex;gap:.45em;justify-content:center}.dots i{width:.6em;height:.6em;border:2px solid var(--lcd-4)}.dots i.on{background:var(--lcd-4)}.pop{animation:pop .45s steps(4) both}@keyframes pop{from{transform:scale(.6);opacity:0}}.bar{height:.9em;border:2px solid var(--lcd-4);padding:2px;display:flex;gap:2px}.bar i{flex:1;background:var(--lcd-4);opacity:0;animation:fillin .01s steps(1) forwards}@keyframes fillin{to{opacity:1}}.uc-cone{animation:bob .8s steps(2) infinite}@keyframes bob{50%{translate:0 -6%}}
.plate{display:flex;align-items:baseline;justify-content:center;gap:.4em;margin:calc(var(--w)*.035) 0 calc(var(--w)*.05);color:var(--label)}.plate strong{font:800 1.55em/1 var(--mono);font-style:italic;letter-spacing:-.02em}.plate span{font:700 .7em var(--mono);letter-spacing:.2em}.controls{display:grid;grid-template-columns:1fr 1fr;align-items:center;row-gap:calc(var(--w)*.05)}.dpad{--s:calc(var(--w)*.34);width:var(--s);height:var(--s);position:relative;justify-self:start;margin-left:calc(var(--w)*-.01)}.dpad button{position:absolute;width:33.4%;height:33.4%;border:0;background:var(--pad);color:#cfcfd8;display:grid;place-items:center;cursor:pointer;box-shadow:inset 0 2px 0 #ffffff1a,0 3px 0 #000;font:700 .9em var(--mono);touch-action:manipulation}.dpad .u{left:33.3%;top:0;border-radius:5px 5px 0 0}.dpad .d{left:33.3%;bottom:0;border-radius:0 0 5px 5px}.dpad .l{left:0;top:33.3%;border-radius:5px 0 0 5px}.dpad .r{right:0;top:33.3%;border-radius:0 5px 5px 0}.dpad .c{position:absolute;left:33.3%;top:33.3%;width:33.4%;height:33.4%;background:var(--pad)}.dpad .c::after{content:"";position:absolute;inset:28%;border-radius:50%;background:radial-gradient(circle at 40% 35%,#3a3a44,#15151a)}.dpad button:active,.dpad button.press{translate:0 2px;box-shadow:inset 0 2px 0 #ffffff12,0 1px 0 #000;background:#2f2f38}.ab{justify-self:end;display:flex;gap:calc(var(--w)*.05);rotate:-24deg;margin-right:calc(var(--w)*.01)}.ab div{display:grid;justify-items:center;gap:.3em}.ab button{width:calc(var(--w)*.15);aspect-ratio:1;border-radius:50%;border:2px solid var(--btn-edge);cursor:pointer;background:radial-gradient(circle at 35% 30%,#b23a66,var(--btn) 55%,#6f1636);color:#fff;font:800 .95em var(--btnf);box-shadow:0 4px 0 #3f0c20,inset 0 2px 0 #ffffff33;touch-action:manipulation}.ab button:active,.ab button.press{translate:0 3px;box-shadow:0 1px 0 #3f0c20,inset 0 2px 0 #ffffff22}.ab span,.pills span{font:800 .62em var(--mono);color:var(--label);letter-spacing:.12em}.pills{grid-column:1/-1;display:flex;justify-content:center;gap:calc(var(--w)*.06);rotate:-24deg;translate:0 calc(var(--w)*-.01)}.pills div{display:grid;justify-items:center;gap:.35em}.pills button{width:calc(var(--w)*.15);height:calc(var(--w)*.04);border-radius:99px;border:0;cursor:pointer;background:var(--shell-lo);box-shadow:inset 0 2px 3px #0006,0 1px 0 #fff6;touch-action:manipulation}.pills button:active,.pills button.press{background:#7c7c84}.grille{position:absolute;right:calc(var(--w)*.07);bottom:calc(var(--w)*.065);width:calc(var(--w)*.16);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#0005 26%,#0000 28%) 0 0/calc(var(--w)*.022) calc(var(--w)*.022);-webkit-mask:radial-gradient(circle,#000 62%,#0000 64%);mask:radial-gradient(circle,#000 62%,#0000 64%);opacity:.8}.device button:focus-visible{outline:3px solid #FFE08A;outline-offset:3px}.foot{padding:.4em .9em;border-radius:8px;background:color-mix(in oklab,var(--void) 72%,transparent);font:400 13px var(--body);color:#CFC9DF;text-align:center;text-shadow:0 1px 2px #000}
@media (prefers-reduced-motion:reduce){.portal,.clouds,.uc-cone,.cursor,.scan.go,.pop,.bar i,.building .px,.building .rim{animation:none!important}.bar i,.building .px,.building .rim{opacity:1}}

.soundrow{display:flex;justify-content:center;margin:-2px 0 0}
.soundrow button{font:700 .8rem var(--mono);color:#FFF3CD;background:#101225;border:1px solid #F2C35B;border-radius:99px;padding:.7em 1.1em;min-height:44px;cursor:pointer}
.soundrow button:focus-visible{outline:3px solid #FFE08A;outline-offset:3px}