:root{--px:3px;--night:#140f2e;--night-2:#231a52;--edge:#4b3a99;--sun:#ffcf3a;--paper:#fff2d4;--mute:#b0a3d6;--p1:#ff4d4d;--p2:#4a93ff;--soco:#ff8a3d;--chute:#34d6b4;--esp:#c084ff;--black:#000;--pixel:"Press Start 2P", ui-monospace, monospace;--read:"VT323", ui-monospace, monospace}*{box-sizing:border-box}html,body{height:100%;color:var(--paper);font-family:var(--pixel);-webkit-user-select:none;user-select:none;background:#07060d;margin:0;overflow:hidden}#app{place-items:center;width:100vw;height:100vh;display:grid}#stage-wrap{width:calc(var(--px) * 384);height:calc(var(--px) * 216);position:relative;overflow:hidden}#screen{width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;display:block}#ui{font-size:calc(var(--px) * 6);pointer-events:none;line-height:1.4;position:absolute;inset:0}#ui>*{pointer-events:auto}.pixelated{image-rendering:pixelated}button{font:inherit}:focus-visible{outline:calc(var(--px) * 1) solid var(--sun)}.screen-layer{justify-content:center;align-items:center;gap:calc(var(--px) * 6);flex-direction:column;display:flex;position:absolute;inset:0}.dim{background:#0806149e}.screen-head{align-items:baseline;gap:calc(var(--px) * 8);width:100%;display:flex}.screen-title{font-size:calc(var(--px) * 10);color:var(--sun);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--p1), calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--black)}.screen-sub{font-family:var(--read);font-size:calc(var(--px) * 11);color:var(--paper);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black)}.blink{animation:1s steps(2,start) infinite blink}@keyframes blink{to{visibility:hidden}}@media (prefers-reduced-motion:reduce){.blink{animation:none}.menu-item{transition:none}}.keycap{justify-content:center;align-items:center;gap:calc(var(--px) * 1);min-width:calc(var(--px) * 11);height:calc(var(--px) * 11);padding:0 calc(var(--px) * 2);font-family:var(--pixel);font-size:calc(var(--px) * 6);color:var(--paper);background:var(--night-2);border:calc(var(--px) * 1) solid var(--mute);box-shadow:0 calc(var(--px) * 1) 0 var(--black);display:inline-flex}.keycap.small{min-width:calc(var(--px) * 9);height:calc(var(--px) * 9);font-size:calc(var(--px) * 4)}.keycap.round{min-width:calc(var(--px) * 11);border-radius:50%;padding:0}.keycap svg{width:calc(var(--px) * 5);height:calc(var(--px) * 5)}.key-arrow svg{width:calc(var(--px) * 6);height:calc(var(--px) * 6)}.arrow-icon{width:calc(var(--px) * 7);height:calc(var(--px) * 7);fill:var(--paper);flex-shrink:0;display:inline-block}.chip{height:calc(var(--px) * 9);padding:0 calc(var(--px) * 3);font-family:var(--pixel);font-size:calc(var(--px) * 5);color:var(--night);box-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black);align-items:center;display:inline-flex}.chip-soco{background:var(--soco)}.chip-chute{background:var(--chute)}.chip-esp{background:var(--esp)}.seq{align-items:center;gap:calc(var(--px) * 2);display:inline-flex}.seq-plus{font-size:calc(var(--px) * 6);color:var(--mute)}.seq-text{font-family:var(--read);font-size:calc(var(--px) * 10);color:var(--mute)}.hint-bar{gap:calc(var(--px) * 10);font-family:var(--read);font-size:calc(var(--px) * 10);color:var(--mute);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black);justify-content:center;display:flex}.hint-item{align-items:center;gap:calc(var(--px) * 3);display:inline-flex}.hint-bar .keycap svg{width:calc(var(--px) * 4);height:calc(var(--px) * 4)}.menu{gap:calc(var(--px) * 3);flex-direction:column;display:flex}.menu.slabs{filter:drop-shadow(calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--black))}.menu-title{font-size:calc(var(--px) * 10);color:var(--sun);margin-bottom:calc(var(--px) * 3);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--p1)}.menu-item{all:unset;cursor:pointer;align-items:center;gap:calc(var(--px) * 8);width:calc(var(--px) * 136);padding:calc(var(--px) * 4) calc(var(--px) * 14) calc(var(--px) * 4) calc(var(--px) * 8);font-family:var(--pixel);font-size:calc(var(--px) * 7);color:var(--paper);background:var(--night);clip-path:polygon(0 0, 100% 0, calc(100% - var(--px) * 8) 100%, 0 100%);transition:transform 90ms steps(2,end);display:flex}.menu-item.active{background:var(--sun);color:var(--night);transform:translateX(calc(var(--px) * 8))}.menu-item .value{margin-left:auto}.section-options{gap:calc(var(--px) * 6);justify-content:center;display:flex}.option-item{all:unset;cursor:pointer;align-items:center;gap:calc(var(--px) * 5);padding:calc(var(--px) * 3) calc(var(--px) * 6);font-family:var(--pixel);font-size:calc(var(--px) * 5);color:var(--mute);border:calc(var(--px) * 1) solid var(--edge);background:#140f2ee6;display:inline-flex}.option-item .value{color:var(--paper);align-items:center;gap:calc(var(--px) * 3);display:inline-flex}.option-item .value:before,.option-item .value:after{content:"";border-top:calc(var(--px) * 3) solid transparent;border-bottom:calc(var(--px) * 3) solid transparent}.option-item .value:before{border-right:calc(var(--px) * 3) solid var(--edge)}.option-item .value:after{border-left:calc(var(--px) * 3) solid var(--edge)}.option-item.active{color:var(--sun);border-color:var(--sun)}.option-item.active .value{color:var(--sun)}.option-item.active .value:before{border-right-color:var(--sun)}.option-item.active .value:after{border-left-color:var(--sun)}.menu-desc{font-family:var(--read);font-size:calc(var(--px) * 11);color:var(--paper);text-align:center;text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black);min-height:calc(var(--px) * 22);line-height:1.05}.title-screen{gap:calc(var(--px) * 16);padding-bottom:calc(var(--px) * 20)}.title-block{align-items:center;gap:calc(var(--px) * 6);flex-direction:column;display:flex}.title-logo{font-size:calc(var(--px) * 22);color:var(--sun);letter-spacing:calc(var(--px) * 1);text-shadow:calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--p1), calc(var(--px) * 4) calc(var(--px) * 4) 0 var(--black);transform:skew(-8deg)}.title-sub{font-family:var(--read);font-size:calc(var(--px) * 14);color:var(--paper);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black)}.title-press{font-size:calc(var(--px) * 6);color:var(--paper);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black)}.mode-screen{padding:calc(var(--px) * 10) calc(var(--px) * 16) calc(var(--px) * 6);justify-content:space-between;align-items:stretch;gap:calc(var(--px) * 4)}.mode-logo{font-size:calc(var(--px) * 9);color:var(--sun);transform-origin:0;text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--p1), calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--black);transform:skew(-8deg)}.mode-main{flex:1;justify-content:space-between;align-items:center;display:flex}.mode-side{width:calc(var(--px) * 176);align-items:center;gap:calc(var(--px) * 4);flex-direction:column;display:flex}.mode-art{height:calc(var(--px) * 116);justify-content:center;align-items:flex-end;display:flex}.select-screen{padding:calc(var(--px) * 8) calc(var(--px) * 8) calc(var(--px) * 6);justify-content:flex-start;gap:calc(var(--px) * 4)}.versus{justify-content:space-between;align-items:flex-end;gap:calc(var(--px) * 2);flex:1;width:100%;display:flex}.vs-mark{width:calc(var(--px) * 30);text-align:center;font-size:calc(var(--px) * 14);color:var(--sun);text-shadow:calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--p1), calc(var(--px) * 3) calc(var(--px) * 3) 0 var(--black);flex-shrink:0;align-self:center;transform:skew(-10deg)}.fighter-panel{align-items:flex-end;gap:calc(var(--px) * 3);width:calc(var(--px) * 166);height:calc(var(--px) * 126);display:flex}.fighter-panel.side-1{text-align:right;flex-direction:row-reverse}.fighter-panel.hidden{visibility:hidden}.fighter-panel.waiting{justify-content:center;align-items:center}.fighter-panel.waiting .fighter-text{align-items:center;width:auto}.fighter-sprite{width:calc(var(--px) * 74);flex-shrink:0;justify-content:center;align-items:flex-end;height:100%;display:flex;overflow:visible}.fighter-text{gap:calc(var(--px) * 2);width:calc(var(--px) * 88);padding-bottom:calc(var(--px) * 2);flex-direction:column;flex-shrink:0;display:flex}.side-1 .fighter-text{align-items:flex-end}.player-tag{padding:calc(var(--px) * 1) calc(var(--px) * 3);font-size:calc(var(--px) * 5);color:var(--paper);background:var(--p1);align-self:flex-start}.side-1 .player-tag{background:var(--p2);align-self:flex-end}.fighter-name{font-size:calc(var(--px) * 9);color:var(--sun);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black)}.fighter-title{font-family:var(--read);font-size:calc(var(--px) * 10);color:var(--paper);white-space:nowrap;text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black);line-height:1}.fighter-style{font-family:var(--read);font-size:calc(var(--px) * 9);color:var(--mute);white-space:nowrap;margin-bottom:calc(var(--px) * 2);line-height:1}.fighter-ready{font-size:calc(var(--px) * 6);color:var(--sun);margin-top:calc(var(--px) * 3);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black)}.fighter-text{z-index:1;position:relative}.locked .fighter-name{color:var(--paper)}.stats{gap:calc(var(--px) * 1);flex-direction:column;display:flex}.stat-row{align-items:center;gap:calc(var(--px) * 3);display:flex}.side-1 .stat-row{flex-direction:row-reverse}.stat-label{width:calc(var(--px) * 40);font-family:var(--read);font-size:calc(var(--px) * 9);color:var(--mute);text-transform:lowercase;line-height:1}.stat-bar{gap:calc(var(--px) * 1);display:flex}.stat-pip{width:calc(var(--px) * 6);height:calc(var(--px) * 3);background:#2d2560}.stat-pip.on{background:var(--sun)}.card-row{gap:calc(var(--px) * 3);display:flex}.card{width:calc(var(--px) * 38);height:calc(var(--px) * 38);padding:calc(var(--px) * 1);background:var(--night);border:calc(var(--px) * 1) solid var(--edge);cursor:pointer;position:relative}.card.c1{border:calc(var(--px) * 2) solid var(--p1);padding:0}.card.c2{border:calc(var(--px) * 2) solid var(--p2);padding:0}.card.c1.c2{border-color:var(--sun)}.card-label{top:calc(var(--px) * -1);font-size:calc(var(--px) * 4);color:var(--paper);padding:0 calc(var(--px) * 1);position:absolute}.card-label:empty{display:none}.card-label.l1{left:calc(var(--px) * -1);background:var(--p1)}.card-label.l2{right:calc(var(--px) * -1);background:var(--p2)}.stage-screen{padding:calc(var(--px) * 8) calc(var(--px) * 12) calc(var(--px) * 6);justify-content:flex-start;gap:calc(var(--px) * 6)}.stage-stage{align-items:center;gap:calc(var(--px) * 10);display:flex}.stage-frame{border:calc(var(--px) * 2) solid var(--sun);box-shadow:calc(var(--px) * 3) calc(var(--px) * 3) 0 var(--black);position:relative}.stage-preview{width:calc(var(--px) * 240);height:calc(var(--px) * 135);image-rendering:pixelated;cursor:pointer;display:block}.stage-name{left:calc(var(--px) * -8);bottom:calc(var(--px) * 8);padding:calc(var(--px) * 4) calc(var(--px) * 14) calc(var(--px) * 4) calc(var(--px) * 8);font-size:calc(var(--px) * 7);color:var(--night);background:var(--sun);clip-path:polygon(0 0, 100% 0, calc(100% - var(--px) * 8) 100%, 0 100%);position:absolute}.stage-arrow{all:unset;cursor:pointer}.stage-arrow .arrow-icon{width:calc(var(--px) * 10);height:calc(var(--px) * 10);fill:var(--sun)}.stage-dots{gap:calc(var(--px) * 4);display:flex}.stage-dot{width:calc(var(--px) * 5);height:calc(var(--px) * 5);background:var(--edge);cursor:pointer}.stage-dot.on{background:var(--sun)}.htp-screen{padding:calc(var(--px) * 8) calc(var(--px) * 12) calc(var(--px) * 6);justify-content:flex-start;gap:calc(var(--px) * 6)}.tabs{gap:calc(var(--px) * 3);margin-left:auto;display:flex}.tab{all:unset;cursor:pointer;padding:calc(var(--px) * 3) calc(var(--px) * 10) calc(var(--px) * 3) calc(var(--px) * 6);font-family:var(--pixel);font-size:calc(var(--px) * 6);color:var(--mute);background:var(--night);clip-path:polygon(0 0, 100% 0, calc(100% - var(--px) * 6) 100%, 0 100%)}.tab.active{color:var(--night);background:var(--sun)}.htp-body{flex:1;justify-content:center;align-items:flex-start;width:100%;display:flex}.htp-card,.htp-list,.htp-specials,.move-panel,.pause-box{border:calc(var(--px) * 1) solid var(--edge);box-shadow:calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--black);background:#140f2ef0}.htp-page.htp-buttons{gap:calc(var(--px) * 6);grid-template-columns:repeat(3,minmax(0,1fr));width:100%;display:grid}.htp-card{align-items:center;gap:calc(var(--px) * 6);padding:calc(var(--px) * 6) calc(var(--px) * 4);flex-direction:column;display:flex}.card-title{font-size:calc(var(--px) * 6);color:var(--sun)}.kb-layout{align-items:center;gap:calc(var(--px) * 8);flex-direction:column;display:flex}.kb-move{align-items:center;gap:calc(var(--px) * 2);flex-direction:column;display:flex}.kb-row{gap:calc(var(--px) * 2);justify-content:center;display:flex}.kb-caption{font-family:var(--read);font-size:calc(var(--px) * 9);color:var(--mute);text-align:center;line-height:1}.action-keys{gap:calc(var(--px) * 4);display:flex}.action-key{align-items:center;gap:calc(var(--px) * 3);flex-direction:column;display:flex}.kb-shortcuts{justify-content:center;column-gap:calc(var(--px) * 7);row-gap:calc(var(--px) * 3);flex-wrap:wrap;display:flex}.kb-shortcut{align-items:center;gap:calc(var(--px) * 3);font-family:var(--read);font-size:calc(var(--px) * 10);color:var(--paper);display:flex}.pad-list{gap:calc(var(--px) * 4);flex-direction:column;display:flex}.pad-row{align-items:center;gap:calc(var(--px) * 5);display:flex}.pad-text{font-family:var(--read);font-size:calc(var(--px) * 10);color:var(--paper)}.htp-list{grid-template-columns:calc(var(--px) * 76) calc(var(--px) * 56) 1fr;column-gap:calc(var(--px) * 8);row-gap:calc(var(--px) * 3);width:100%;padding:calc(var(--px) * 6) calc(var(--px) * 10);align-items:center;display:grid}.basic-row{display:contents}.basic-cmd{justify-content:flex-end;display:flex}.basic-name{font-size:calc(var(--px) * 6);color:var(--sun)}.basic-text{font-family:var(--read);font-size:calc(var(--px) * 10);color:var(--paper);line-height:1}.htp-specials{gap:calc(var(--px) * 6);width:100%;padding:calc(var(--px) * 7) calc(var(--px) * 10);flex-direction:column;display:flex}.htp-lead{font-family:var(--read);font-size:calc(var(--px) * 11);color:var(--paper);line-height:1}.htp-foot{font-family:var(--read);font-size:calc(var(--px) * 9);color:var(--mute);line-height:1}.special-table{row-gap:calc(var(--px) * 5);column-gap:calc(var(--px) * 10);grid-template-columns:auto 1fr 1fr;align-items:center;display:grid}.special-row{display:contents}.special-head span{font-size:calc(var(--px) * 5);color:var(--mute)}.special-slot{font-size:calc(var(--px) * 6);color:var(--sun)}.move-none{color:var(--mute);font-family:var(--read);font-size:calc(var(--px) * 10)}.move-panel{width:calc(var(--px) * 352);max-height:calc(var(--px) * 186);padding:calc(var(--px) * 5) calc(var(--px) * 8);gap:calc(var(--px) * 3);flex-direction:column;display:flex}.move-panel-head,.move-card{grid-template-columns:1fr calc(var(--px) * 74) calc(var(--px) * 74);column-gap:calc(var(--px) * 6);align-items:center;display:grid}.move-panel-head{border-bottom:calc(var(--px) * 1) solid var(--edge);padding-bottom:calc(var(--px) * 3);align-items:end}.move-who{align-items:flex-end;gap:calc(var(--px) * 5);display:flex}.panel-title{font-size:calc(var(--px) * 7);color:var(--sun)}.panel-sub{font-family:var(--read);font-size:calc(var(--px) * 9);color:var(--mute);line-height:1}.col-label{font-size:calc(var(--px) * 4);color:var(--mute);text-align:center}.move-info{min-width:0}.move-head{align-items:center;gap:calc(var(--px) * 4);display:flex}.move-slot{font-size:calc(var(--px) * 4);color:var(--night);background:var(--mute);padding:calc(var(--px) * 1) calc(var(--px) * 2)}.move-name{font-size:calc(var(--px) * 6);color:var(--paper)}.move-desc{font-family:var(--read);font-size:calc(var(--px) * 10);color:var(--mute);margin-top:calc(var(--px) * 1);line-height:.95}.move-note{font-family:var(--read);font-size:calc(var(--px) * 10);color:var(--sun);line-height:.95}.move-cmd{justify-content:center;display:flex}.panel-foot{font-family:var(--read);font-size:calc(var(--px) * 9);color:var(--mute);line-height:1}.pause-box{padding:calc(var(--px) * 7) calc(var(--px) * 14) calc(var(--px) * 7) calc(var(--px) * 10)}.pause-box .menu{gap:calc(var(--px) * 2)}.pause-box .menu-title{font-size:calc(var(--px) * 8);margin-bottom:calc(var(--px) * 2)}.pause-box .menu-item{padding-top:calc(var(--px) * 3);padding-bottom:calc(var(--px) * 3);font-size:calc(var(--px) * 6);width:calc(var(--px) * 150)}.result-screen{padding:calc(var(--px) * 10) calc(var(--px) * 16) calc(var(--px) * 6);justify-content:space-between}.result-main{justify-content:center;align-items:center;gap:calc(var(--px) * 18);flex:1;display:flex}.result-art{align-items:flex-end;gap:calc(var(--px) * 8);display:flex}.result-count{font-size:calc(var(--px) * 20);color:var(--sun);text-shadow:calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--p1)}.result-side{gap:calc(var(--px) * 6);flex-direction:column;display:flex}.result-name{font-size:calc(var(--px) * 12);color:var(--sun);transform-origin:0;text-shadow:calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--p1), calc(var(--px) * 3) calc(var(--px) * 3) 0 var(--black);transform:skew(-8deg)}.result-sub{font-family:var(--read);font-size:calc(var(--px) * 12);color:var(--paper);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black);line-height:1}.online-screen{padding:calc(var(--px) * 10) calc(var(--px) * 16) calc(var(--px) * 6);justify-content:space-between}.online-main{justify-content:center;align-items:center;gap:calc(var(--px) * 7);flex-direction:column;flex:1;display:flex}.online-row{align-items:center;gap:calc(var(--px) * 6);display:flex}.online-status,.online-notice,.online-error,.online-copied,.leave-note{font-family:var(--read);font-size:calc(var(--px) * 11);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black);line-height:1}.online-status{color:var(--paper)}.online-notice{color:var(--sun);max-width:calc(var(--px) * 220);text-align:center}.online-error{color:var(--p1)}.online-copied{color:var(--chute);min-width:calc(var(--px) * 40)}.online-copy{all:unset;cursor:pointer}.keycap.online-copy{padding:0 calc(var(--px) * 6);height:calc(var(--px) * 13);font-size:calc(var(--px) * 5)}.keycap.online-copy:hover{border-color:var(--sun);color:var(--sun)}.code-boxes{gap:calc(var(--px) * 5);filter:drop-shadow(calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--black));display:flex}.code-box{width:calc(var(--px) * 22);height:calc(var(--px) * 26);font-size:calc(var(--px) * 12);color:var(--night);background:var(--night-2);border:calc(var(--px) * 2) solid var(--edge);justify-content:center;align-items:center;display:flex}.code-box.big{width:calc(var(--px) * 32);height:calc(var(--px) * 38);font-size:calc(var(--px) * 18)}.code-box.filled{background:var(--sun);border-color:var(--paper)}.code-box.caret{border-color:var(--sun);animation:1s steps(2,start) infinite blink}.ping-badge{align-items:center;gap:calc(var(--px) * 3);font-family:var(--read);font-size:calc(var(--px) * 10);margin-left:auto;line-height:1;display:inline-flex}.online-main .ping-badge{margin-left:0}.ping-bars{align-items:flex-end;gap:calc(var(--px) * 1);height:calc(var(--px) * 8);display:inline-flex}.ping-bar{width:calc(var(--px) * 2);background:#2d2560}.ping-bar.b1{height:calc(var(--px) * 2)}.ping-bar.b2{height:calc(var(--px) * 4)}.ping-bar.b3{height:calc(var(--px) * 6)}.ping-bar.b4{height:calc(var(--px) * 8)}.ping-good{--ping:#4be37a}.ping-ok{--ping:var(--sun)}.ping-bad{--ping:var(--p1)}.ping-bar.on{background:var(--ping)}.ping-ms{color:var(--ping);text-shadow:calc(var(--px) * 1) calc(var(--px) * 1) 0 var(--black)}.ping-idle .ping-ms,.ping-mode{color:var(--mute)}.stage-arrow.idle{width:calc(var(--px) * 10)}.leave-overlay{background:#08061473}.leave-box{align-items:center;gap:calc(var(--px) * 6);padding:calc(var(--px) * 8);background:var(--night);border:calc(var(--px) * 1) solid var(--edge);flex-direction:column;display:flex}.leave-note{color:var(--mute)}