:root{--ink:#10121c;--ui:#1a1c2c;--navy:#1d2b53;--navy-2:#2a2c5f;--plum:#7e2553;--gray:#5f574f;--light:#c2c3c7;--white:#fff1e8;--red:#ff004d;--orange:#ffa300;--yellow:#ffec27;--lime:#00e436;--green:#008751;--blue:#29adff;--lavender:#83769c;--pink:#ff77a8;--peach:#fca;--panel:#10121c9e;--pixel:"Press Start 2P", ui-monospace, monospace;--text:"Pixelify Sans", ui-monospace, monospace;--sat:env(safe-area-inset-top,0px);--sar:env(safe-area-inset-right,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px)}[hidden]{display:none!important}*{box-sizing:border-box}html,body{background:var(--ink);height:100%;color:var(--white);overscroll-behavior:none;margin:0;overflow:hidden}body{font-family:var(--text);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:none}button{font:inherit;color:inherit}#app{background:var(--ink);flex-direction:column;display:flex;position:fixed;inset:0}#stage{background:var(--navy);--fs-s:clamp(7px, 2cqh, 10px);--fs-m:clamp(9px, 2.6cqh, 16px);--fs-l:clamp(16px, 5.4cqh, 40px);--gap:clamp(8px, 2.6cqh, 20px);--edge-t:calc(var(--gap) + var(--sat));--edge-r:calc(var(--gap) + var(--sar));--edge-b:calc(var(--gap) + var(--sab));--edge-l:calc(var(--gap) + var(--sal));flex:auto;min-height:0;position:relative;overflow:hidden;container-type:size}#game,#zones{position:absolute;inset:0}#game canvas{display:block;width:100%!important;height:100%!important}#zones{touch-action:none;display:none}.state-ready #zones,.state-running #zones{display:block}#hud{pointer-events:none;visibility:hidden;font-family:var(--pixel);font-size:var(--fs-m);line-height:1;position:absolute;inset:0}.state-ready #hud,.state-running #hud,.state-paused #hud,.state-finished #hud,.state-results #hud{visibility:visible}.hud-panel{background:var(--panel);border:3px solid var(--ink);box-shadow:inset 0 0 0 2px var(--navy);padding:calc(var(--gap) * .6) calc(var(--gap) * .7)}.hud-level{left:var(--edge-l);top:var(--edge-t);gap:calc(var(--gap) * .4);flex-direction:column;display:flex;position:absolute}.hud-id{color:var(--yellow)}.hud-name{font-size:var(--fs-s)}.hud-cp{font-family:var(--text);font-size:calc(var(--fs-m) * .95);color:var(--light);align-items:center;gap:6px;display:flex}.hud-cp i{background:var(--red);width:8px;height:10px;box-shadow:-2px 0 0 var(--light)}.hud-cp.on{color:var(--lime)}.hud-cp.on i{background:var(--lime)}.hud-center{left:50%;top:var(--edge-t);align-items:center;gap:calc(var(--gap) * .5);flex-direction:column;display:flex;position:absolute;transform:translate(-50%)}.hud-timer{font-size:var(--fs-l);color:var(--white);text-shadow:.1em .1em 0 var(--ink);font-variant-numeric:tabular-nums}.hud-target{background:var(--panel);font-size:var(--fs-s);color:var(--yellow);align-items:center;gap:8px;padding:5px 8px;display:flex}.hud-target.silver{color:var(--light)}.hud-target.bronze{color:var(--peach)}.hud-target.none{color:var(--lavender)}.hud-lap{background:var(--panel);border:2px solid var(--lavender);font-size:var(--fs-s);color:var(--white);padding:4px 8px;display:none}.hud-lap:not(:empty){display:block}.hud-right{right:var(--edge-r);top:var(--edge-t);align-items:flex-start;gap:calc(var(--gap) * .6);display:flex;position:absolute}.hud-delta{align-items:flex-end;gap:calc(var(--gap) * .4);flex-direction:column;display:flex}.delta{color:var(--light)}.delta.ahead{color:var(--lime)}.delta.behind{color:var(--red)}.hud-small{font-size:var(--fs-s);color:var(--light)}.icon-btn{pointer-events:auto;width:max(44px, calc(var(--fs-l) * 1.4));height:max(44px, calc(var(--fs-l) * 1.4));background:var(--panel);border:3px solid var(--ink);box-shadow:inset 0 0 0 2px var(--navy);cursor:pointer;justify-content:center;align-items:center;gap:18%;padding:0;display:flex}.icon-btn span{background:var(--white);width:18%;height:46%}.icon-btn:focus-visible{outline:3px solid var(--yellow)}.icon-btn svg{width:48%;height:48%;fill:var(--white)}.fs-btn:hover{background:var(--navy-2)}.is-portrait #btn-fs-hud{display:none}#btn-fs-menu{top:calc(12px + var(--sat));right:calc(12px + var(--sar));z-index:2;width:52px;height:52px;display:none;position:absolute}.state-title #btn-fs-menu,.state-levels #btn-fs-menu,.state-characters #btn-fs-menu,.state-versus #btn-fs-menu,.state-community #btn-fs-menu,.state-paused #btn-fs-menu,.state-results #btn-fs-menu,.show-options #btn-fs-menu{display:flex}.hud-speed{left:var(--edge-l);bottom:var(--edge-b);gap:calc(var(--gap) * .5);flex-direction:column;display:flex;position:absolute}.hud-speed-top{font-size:var(--fs-s);color:var(--light);justify-content:space-between;gap:16px;display:flex}#hud-overmax{color:var(--pink);visibility:hidden;animation:.5s step-end infinite blink}#hud-overmax.on{visibility:visible}.bars{align-items:flex-end;gap:3px;display:flex}.bar{background:var(--navy-2);width:clamp(6px,1.3cqh,14px);height:clamp(8px,2cqh,20px)}.bar.over{height:clamp(10px,2.5cqh,24px)}.bar.on{background:var(--blue)}.bar.over.on:nth-child(10){background:var(--orange)}.bar.over.on:nth-child(11){background:var(--red)}.bar.over.on:nth-child(n+12){background:var(--pink)}.bar.max{background:var(--white);width:3px;height:clamp(12px,3cqh,30px)}.hud-keys{right:var(--edge-r);bottom:var(--edge-b);font-family:var(--text);gap:8px;font-size:clamp(12px,2.4cqh,16px);display:flex;position:absolute}.chip{background:var(--panel);align-items:center;gap:8px;padding:6px 10px;display:flex}kbd{font:inherit;background:var(--white);color:var(--ink);box-shadow:inset 0 -3px 0 var(--lavender);padding:3px 7px;font-weight:600}.is-touch .hud-keys{display:none}.touch-hint{bottom:var(--edge-b);width:clamp(64px,24cqh,110px);height:clamp(64px,24cqh,110px);font-size:var(--fs-s);border:4px solid var(--yellow);color:var(--yellow);opacity:.85;background:#10121c80;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:6px;display:none;position:absolute}.touch-hint svg{fill:currentColor;width:38%;height:auto}.touch-hint.hook{border-color:var(--blue);color:var(--white);background:#29adff2e}.touch-hint.active{transform:scale(.94);box-shadow:0 0 0 5px #fff1e859}.hint-a{left:var(--edge-l)}.hint-b{right:var(--edge-r)}.is-touch:not(.is-portrait) .touch-hint{display:flex}.is-touch:not(.is-portrait) .hud-speed{left:calc(var(--edge-l) + clamp(64px, 24cqh, 110px) + var(--gap))}.ready{text-align:center;font-size:var(--fs-m);color:var(--white);text-shadow:3px 3px 0 var(--ink);flex-direction:column;align-items:center;gap:12px;padding:0 16px;display:none;position:absolute;top:42%;left:0;right:0}.state-ready .ready{display:flex}.ready-sub{font-family:var(--text);color:var(--peach);font-size:clamp(12px,2.6cqh,18px)}.toast{text-align:center;font-size:var(--fs-m);color:var(--lime);text-shadow:3px 3px 0 var(--ink);opacity:0;transition:opacity .15s,transform .15s;position:absolute;top:28%;left:0;right:0;transform:translateY(8px)}.toast.show{opacity:1;transform:none}.blink{animation:1.1s step-end infinite blink}@keyframes blink{0%,55%{opacity:1}56%,to{opacity:.2}}#deck{display:none}.is-portrait #stage{flex:none;height:calc(min(80vw,56vh) + 58px)}.is-portrait #deck{padding:18px 16px calc(28px + var(--sab));background:var(--ui);border-top:4px solid var(--ink);flex-direction:column;flex:auto;justify-content:space-between;gap:18px;display:flex}.deck-status{font-family:var(--pixel);flex-direction:column;gap:12px;font-size:9px;display:flex}.deck-speed{color:var(--light);justify-content:space-between;display:flex}#deck-over{color:var(--pink);visibility:hidden;animation:.5s step-end infinite blink}#deck-over.on{visibility:visible}.progress{background:var(--navy);border:3px solid var(--ink);height:12px;box-shadow:0 0 0 2px var(--navy-2);position:relative}.progress-fill{background:var(--blue);width:0;position:absolute;top:0;bottom:0;left:0}.progress i{width:8px;height:14px;position:absolute;top:50%;transform:translate(-50%,-50%)}.prog-cp{background:var(--lime)}.prog-flag{background-color:var(--white);background-image:conic-gradient(var(--ink) 25%, transparent 0 50%, var(--ink) 0 75%, transparent 0);background-size:4px 4px;left:100%}.prog-ghost{background:var(--light);opacity:.6;display:none}.prog-ghost.on{display:block}.prog-me{background:var(--orange);box-shadow:0 0 0 2px var(--ink);width:10px!important;height:18px!important}.deck-buttons{justify-content:space-around;gap:16px;display:flex}.swap .deck-buttons{flex-direction:row-reverse}.deck-col{flex-direction:column;align-items:center;gap:12px;display:flex}.deck-btn{--size:min(38vw, 26vh, 170px);width:var(--size);height:var(--size);font-family:var(--pixel);color:var(--ink);border:5px solid var(--ink);cursor:pointer;touch-action:none;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:10px;font-size:12px;display:flex}.deck-btn svg{width:30%;height:auto;fill:var(--ink)}.deck-btn.jump{background:var(--yellow);box-shadow:inset -6px -8px 0 var(--orange), 0 0 0 4px var(--plum)}.deck-btn.hook{background:var(--blue);box-shadow:inset -6px -8px 0 #1d6fb0, 0 0 0 4px var(--navy)}.deck-btn.active{filter:brightness(1.15);transform:scale(.95)}.deck-note,.deck-foot{color:var(--light);text-align:center;font-size:14px}.deck-foot{color:var(--lavender)}.is-portrait.state-levels #deck,.is-portrait.state-characters #deck,.is-portrait.state-versus #deck,.is-portrait.state-community #deck,.is-portrait.state-title #deck,.is-portrait.state-results #deck,.is-portrait.state-paused #deck{visibility:hidden}.is-portrait .hud-speed,.is-portrait .hud-name,.is-portrait .hud-cp,.is-portrait .hud-small,.is-portrait .touch-hint{display:none}.is-portrait .hud-panel{padding:6px 8px}#screens{pointer-events:none;position:fixed;inset:0}.screen{pointer-events:auto;padding:calc(16px + var(--sat)) calc(16px + var(--sar)) calc(16px + var(--sab)) calc(16px + var(--sal));display:none;position:absolute;inset:0}.state-title #screen-title,.state-levels #screen-levels,.state-characters #screen-characters,.state-versus #screen-versus,.state-community #screen-community,.state-paused #screen-pause,.state-results #screen-results,.show-options #screen-options{display:flex}.show-options #screen-title,.show-options #screen-pause{display:none}.screen-title{font-family:var(--pixel);text-align:center;background:#10121c73;flex-direction:column;justify-content:center;align-items:center;gap:clamp(14px,4vh,36px)}.logo{flex-direction:column;align-items:center;gap:clamp(8px,2vh,18px);display:flex}.logo-a,.logo-b{text-shadow:.08em .08em 0 var(--red), .16em .16em 0 var(--ink);line-height:1}.logo-a{color:var(--white);letter-spacing:.05em;font-size:min(9vw,10vh,72px)}.logo-b{color:var(--yellow);letter-spacing:.06em;font-size:min(12vw,13vh,96px)}.tagline{color:var(--peach);text-shadow:2px 2px 0 var(--ink);margin-top:6px;font-size:min(2.4vw,2.6vh,16px)}.menu{flex-direction:column;gap:14px;width:min(360px,80vw);display:flex}.prompt{text-shadow:3px 3px 0 var(--ink);font-size:min(2.6vw,2.6vh,16px)}.install-hint{text-align:center;max-width:min(420px,86vw);color:var(--ink);background:var(--yellow);box-shadow:4px 4px 0 var(--ink);padding:10px 14px;font-size:min(2.2vw,2.2vh,13px);line-height:1.6}.install-hint[hidden]{display:none}.versus-panel{width:min(900px,100%)}.versus-opts{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.versus-opt{text-align:left;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:12px;min-height:150px;padding:16px 14px;display:flex}.versus-ico{background:#10121c40;flex:none;justify-content:center;align-items:center;width:52px;height:52px;display:flex}.versus-ico svg{fill:currentColor;shape-rendering:crispedges;width:32px;height:32px}.versus-text{flex-direction:column;gap:10px;display:flex}.versus-text b{font-size:clamp(12px,1.5vw,15px);font-weight:400;line-height:1.5}.versus-opt small{font-family:var(--text);text-transform:none;opacity:.9;font-size:17px;line-height:1.25}.is-portrait .versus-opts{grid-template-columns:minmax(0,1fr);gap:14px}.is-portrait .versus-opt{flex-direction:row;align-items:center;gap:14px;min-height:108px}.is-portrait .versus-text b{font-size:13px}.btn-char{justify-content:center;align-items:center;gap:12px;display:flex}.btn-char canvas,.char-card canvas{image-rendering:pixelated}.btn-char canvas{width:32px;height:32px}.btn-char b{color:var(--yellow);font-weight:400}.panel.wide{width:min(860px,100%)}.tiles-panel{overflow:hidden}.level-tiles{--tile-min:168px;grid-template-columns:repeat(auto-fill, minmax(var(--tile-min), 1fr));overscroll-behavior:contain;scrollbar-color:var(--lavender) var(--ui);flex:auto;grid-auto-rows:max-content;align-content:start;gap:14px;min-height:0;margin:-8px -12px -8px -8px;padding:8px 12px 12px 8px;display:grid;position:relative;overflow:hidden auto}.level-tiles:empty{display:none}.tiles-foot{flex-direction:column;gap:14px;display:flex}@media (max-width:560px){.level-tiles{--tile-min:128px;gap:10px}}@media (max-height:520px){.tiles-panel{height:100%}.level-tiles{scroll-snap-type:x proximity;grid-template-rows:100%;grid-template-columns:none;grid-auto-columns:max-content;grid-auto-flow:column;align-content:stretch;overflow:auto hidden}.level-tiles>.level-tile{aspect-ratio:1;scroll-snap-align:start;width:auto;height:100%}.level-tiles>.level-tile:before{content:none}.tiles-foot{flex-flow:wrap;justify-content:center;align-items:center;gap:10px}}.community-note{font-family:var(--text);color:var(--peach);text-align:center;font-size:16px}.community-code{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.community-code label{color:var(--light);font-size:12px}.community-code input{width:9ch;font:inherit;letter-spacing:2px;text-transform:uppercase;color:var(--white);background:var(--navy);border:3px solid var(--white);padding:10px 12px;font-size:16px}.link-btn{font:inherit;color:var(--lavender);cursor:pointer;background:0 0;border:0;align-self:center;padding:6px;font-size:10px}.link-btn:hover,.link-btn:focus-visible{color:var(--white)}.char-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}@media (min-width:960px){.char-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}.char-card{text-align:center;flex-direction:column;align-items:center;gap:8px;padding:12px 8px;display:flex}.char-card canvas{aspect-ratio:1;background:var(--navy-2);width:96px;max-width:100%;height:auto}.char-card small{font-family:var(--text);color:var(--light);font-size:14px;line-height:1.25}.char-card.selected{outline:4px solid var(--yellow);outline-offset:2px}@media (max-width:560px){.char-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.char-card{padding:8px 4px;font-size:10px}.char-card canvas{width:72px}.char-card small{font-size:12px}}@media (max-height:560px){.char-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.char-card canvas{width:64px}.char-card small{display:none}}.title-foot{right:calc(16px + var(--sar));bottom:calc(12px + var(--sab));color:var(--lavender);font-size:8px;position:absolute}.btn{min-height:48px;font-family:var(--pixel);color:var(--white);background:var(--navy);border:4px solid var(--ink);box-shadow:inset -4px -4px 0 var(--ink), 4px 4px 0 var(--ink);cursor:pointer;touch-action:manipulation;padding:10px 16px;font-size:clamp(11px,1.6vw,16px);line-height:1.3}.btn:hover{background:var(--navy-2)}.btn:active{box-shadow:inset -4px -4px 0 var(--ink), 2px 2px 0 var(--ink);transform:translate(2px,2px)}.btn:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}.btn.primary{background:var(--yellow);color:var(--ink);box-shadow:inset -4px -4px 0 var(--orange), 4px 4px 0 var(--ink)}.btn.primary:hover{background:#fff36b}.btn:disabled{cursor:default;opacity:.5;transform:none}.btn.toggle{text-align:left;justify-content:space-between;gap:16px;display:flex}.btn.toggle b{color:var(--yellow);font-weight:400}.screen-panel{background:#10121c9e;justify-content:center;align-items:center}.is-portrait .screen-panel{padding-top:calc(76px + var(--sat))}@media (max-width:1100px){#app:not(.is-portrait) .screen-panel{padding-left:calc(76px + var(--sal));padding-right:calc(76px + var(--sar))}}.panel{background:var(--ink);border:4px solid var(--white);width:min(560px,100%);max-height:100%;box-shadow:0 0 0 4px var(--ink), 10px 10px 0 4px var(--red);flex-direction:column;gap:14px;padding:clamp(16px,4vh,32px) clamp(16px,4vw,36px);display:flex;overflow:auto}.panel h2{font-family:var(--pixel);color:var(--yellow);text-align:center;text-shadow:3px 3px 0 var(--red);margin:0 0 6px;font-size:clamp(16px,min(4vh,5.5vw),28px);font-weight:400}.results{text-align:center;align-items:center;width:min(640px,100%)}.res-name{color:var(--peach);font-size:20px}.res-time-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 16px;display:flex}.res-time{font-family:var(--pixel);font-variant-numeric:tabular-nums;font-size:clamp(24px,min(7vh,8vw),48px)}.res-best{font-family:var(--pixel);background:var(--lime);color:var(--ink);padding:8px 10px;font-size:9px;line-height:1.4}.res-best[hidden]{display:none}.medals{justify-content:center;gap:12px;width:100%;display:flex}.medal-card{background:var(--navy);max-width:160px;font-family:var(--pixel);opacity:.4;flex-direction:column;flex:1 1 0;align-items:center;gap:8px;padding:12px 6px;font-size:8px;display:flex}.medal-card b{font-family:var(--text);font-size:16px;font-weight:400}.medal-card .medal{font-size:clamp(24px,6vh,44px)}.medal-card.got{opacity:1}.medal-card.best{background:var(--navy-2);outline:4px solid var(--yellow)}.stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;width:100%;display:grid}.stats div{border:2px solid var(--navy-2);flex-direction:column;align-items:center;gap:4px;padding:8px 0;display:flex}.stats span{color:var(--light);font-size:13px}.stats b{font-size:20px;font-weight:400}.res-dev{color:var(--lavender);font-size:15px}.res-buttons{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.medal{clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%);background:var(--yellow);width:1em;height:1em;box-shadow:inset -.15em -.15em 0 var(--orange);font-size:12px;display:inline-block}.medal.silver{background:var(--light);box-shadow:inset -.15em -.15em 0 var(--lavender)}.medal.bronze{background:var(--brown,#ab5236);box-shadow:inset -.15em -.15em 0 var(--plum)}.medal.none{background:var(--gray);box-shadow:none}@media (max-height:520px){.panel{gap:8px}.res-name,.res-dev{display:none}.medal-card{flex-direction:row;gap:8px;padding:8px}.medal-card .medal{font-size:20px}.stats div{padding:4px 0}.stats b{font-size:16px}.btn{min-height:44px;padding:8px 12px}}.celebration{pointer-events:none;width:100%;height:100%;display:none;position:fixed;inset:0}.celebration.on{display:block}.state-results .results{animation:.45s cubic-bezier(.2,1.6,.4,1) both results-pop}.state-results h2.clear span{animation:.9s ease-in-out infinite clear-hop,1.6s step-end infinite clear-rainbow;animation-delay:calc(var(--i) * 70ms);display:inline-block}.state-results .results.out h2.clear span{color:var(--pink);animation:1.8s ease-in-out infinite clear-hop;animation-delay:calc(var(--i) * .12s)}.state-results .medal-card.got{animation:.5s cubic-bezier(.2,1.8,.4,1) both medal-pop;animation-delay:calc(.25s + var(--i) * .15s)}.state-results .medal-card.best .medal{animation:.6s ease-in-out infinite alternate medal-shine}@keyframes results-pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}@keyframes clear-hop{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-.4em)}}@keyframes clear-rainbow{0%{color:var(--yellow)}25%{color:var(--lime)}50%{color:var(--blue)}75%{color:var(--pink)}}@keyframes medal-pop{0%{transform:scale(0)rotate(-25deg)}to{transform:none}}@keyframes medal-shine{0%{filter:brightness();transform:scale(1)}to{filter:brightness(1.35);transform:scale(1.15)}}@media (prefers-reduced-motion:reduce){.state-results .results,.state-results h2.clear span,.state-results .results.out h2.clear span,.state-results .medal-card.got,.state-results .medal-card.best .medal{animation:none}}.noscript{padding:24px;font-size:18px}#party-frame{z-index:100;background:#10121c;border:0;width:100%;height:100%;position:fixed;inset:0}