.power-track{position:relative;height:10px;width:100%;margin-top:7px;background:#152737;border:1px solid #97b9bc80;overflow:hidden;transform:skew(-10deg)}
.power-track::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 32.6%,#0c1b29 32.6% 33.7%,transparent 33.7% 65.9%,#0c1b29 65.9% 67%,transparent 67%);pointer-events:none}
.power-track>div{height:100%;background:linear-gradient(90deg,#4187bf,#82dace);transform-origin:left}
.power-track.is-ready{border-color:#ffe09a;box-shadow:0 0 7px #f3be5260}
.power-track.is-ready>div{background:#ffd27a}
.power-label{display:block;font:bold 9px/1.4 monospace;color:#bedbdc;margin-top:3px;white-space:nowrap}
.power-label.is-ready{color:#ffe2a2}
.p2 .power-track{margin-left:auto}.p2 .power-track>div{transform-origin:right}
.attacks button.is-super-ready{outline:2px solid #ffd275;outline-offset:3px;box-shadow:0 0 13px #f3bf6280}
.attacks{display:grid;grid-template-columns:repeat(4,62px);gap:8px}
.attacks button[data-action]{width:62px;min-width:48px;height:62px;min-height:48px}
.attacks button.block-button{grid-area:auto;margin:0;align-self:center}
.attacks button .move-cost{display:block;font:bold 8px monospace;margin-top:3px;color:#dceee8}
.attacks button.power-button{background:#493952;color:#ffe6a8}
.attacks button.ex-button{background:#25484b;color:#baf7e7}
.attacks button.is-ex-armed{outline:2px solid #96ffe1;outline-offset:2px;background:#317b70}
.attacks button.is-unavailable{opacity:.55;border-style:dashed}
.mobile-layout .attacks,.portrait-mode .attacks{grid-template-columns:repeat(3,var(--key-size));grid-template-rows:repeat(3,var(--key-size));gap:6px}
.mobile-layout .attacks button[data-action],.portrait-mode .attacks button[data-action]{width:var(--key-size);height:var(--key-size);grid-area:auto;margin:0;align-self:center}
.mobile-layout .attacks button[data-action="block"],.portrait-mode .attacks button[data-action="block"]{grid-area:1/1}
.mobile-layout .attacks button[data-action="punch"],.portrait-mode .attacks button[data-action="punch"]{grid-area:1/2}
.mobile-layout .attacks button[data-action="kick"],.portrait-mode .attacks button[data-action="kick"]{grid-area:1/3}
.mobile-layout .attacks button[data-action="ex"],.portrait-mode .attacks button[data-action="ex"]{grid-area:2/1}
.mobile-layout .attacks button[data-action="special"],.portrait-mode .attacks button[data-action="special"]{grid-area:2/2}
.mobile-layout .attacks button[data-action="alternate"],.portrait-mode .attacks button[data-action="alternate"]{grid-area:2/3}
.mobile-layout .attacks button[data-action="breaker"],.portrait-mode .attacks button[data-action="breaker"]{grid-area:3/2}
.mobile-layout .attacks button[data-action="super"],.portrait-mode .attacks button[data-action="super"]{grid-area:3/3}
.mobile-layout .attacks button .move-cost,.portrait-mode .attacks button .move-cost{display:block;font-size:8px;margin-top:3px}
.mobile-layout{--key-size:clamp(48px,14dvh,58px)}
.portrait-mode{--key-size:clamp(48px,13vw,56px);--stick-size:clamp(100px,29vw,124px)}
.portrait-mode .controls{min-height:200px;margin-left:12px;margin-right:12px}
.portrait-mode .controls::before{top:0}
@media(orientation:landscape) and (max-height:360px){.mobile-layout{--key-size:48px}.mobile-layout .attacks{bottom:6px}}
@media(max-width:600px){.power-track{height:4px;margin-top:4px}.power-label{font-size:7px;margin-top:2px}}
.mobile-layout .power-track{height:7px;margin-top:4px}.mobile-layout .power-label{font-size:8px;margin-top:2px}
.portrait-mode .power-track{height:5px;margin-top:3px}.portrait-mode .power-label{font-size:7px;margin-top:1px}
#local-super{display:none}
html[data-local-preview] #local-super{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;position:absolute;top:18%;right:8px;z-index:8;min-width:86px;min-height:56px;padding:8px 10px;border:2px solid #ffe09a;border-radius:10px;background:#14251fee;color:#ffe09a;font:bold 11px/1.1 monospace;cursor:pointer;touch-action:manipulation}
html[data-local-preview] #local-super small{font:bold 7px/1 monospace;letter-spacing:.7px;color:#9fd9c8}
html[data-local-preview] #local-super[hidden]{display:none}
html[data-local-preview] #local-super:disabled{opacity:.4;cursor:default}
html[data-local-preview] #local-super:not(:disabled):active{background:#2a4a3eee}
html[data-local-preview] #local-super{top:26%}
html.portrait-mode[data-local-preview] #local-super{top:28%;right:4px;min-height:30px;min-width:70px;padding:4px;font-size:8px}