#screen.art-screen{padding:0;display:grid;place-items:center;background:#070707;container-type:size;overflow:hidden}
.now-playing{position:absolute;right:2%;top:14%;z-index:5;max-width:40%;padding:12px 16px;background:#080808eb;border-left:3px solid #c42128;color:#fff0db;font:clamp(10px,1.2vw,16px) Arial,sans-serif;line-height:1.5;pointer-events:none;opacity:0}
.now-playing.visible{animation:track-title 8s ease both}
@keyframes track-title{0%{opacity:0;transform:translateY(-8px)}6%,80%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.now-playing.visible{animation-name:track-title-still}@keyframes track-title-still{0%,80%{opacity:1}100%{opacity:0}}}
.coin-balance{position:absolute;display:flex;align-items:center;color:#ffe2a0;background:#100e0de8;padding:0 1%;font-size:clamp(12px,2cqw,28px)}
.unlock-cards{display:grid;max-height:32vh;overflow:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.unlock-cards .card{width:100%;min-height:130px;padding:12px}.unlock-cards .card b{font-size:24px}
.progress-menu{max-height:100%;overflow:auto}.progress-menu h1{font-size:clamp(26px,4vw,56px)}
@media(max-width:700px){.unlock-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.unlock-cards button{font-size:14px;padding:8px 12px}.unlock-cards button:disabled{opacity:.45;cursor:not-allowed}
.art-board{position:relative;width:min(100cqw,calc(100cqh * var(--ratio)));aspect-ratio:var(--ratio);background-size:100% 100%;font-family:Impact,'Arial Narrow',sans-serif}
.art-button,.art-setting{position:absolute;margin:0;border:1px solid #d3c4b5;background:#100e0df5;color:#f1e5d3;font-size:clamp(9px,1.6cqw,24px);letter-spacing:1px;padding:0 1%;display:flex;align-items:center;justify-content:flex-start;text-align:left}
.art-button:hover,.art-button:focus-visible,.roster-choice:hover,.roster-choice:focus-visible,.roster-choice.active{background:#24110d;color:#fff2dc;border-color:#ff3b31;box-shadow:0 0 12px #ff241777;outline:2px solid #ef392e;outline-offset:-2px}
.art-setting{justify-content:space-between;gap:5px}.art-setting input{accent-color:#ef392e;max-width:48%;cursor:pointer}.art-setting input[type=checkbox]{width:18px;height:18px}
.art-roster{position:absolute;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:6px;background:#080808;overflow:auto;padding:6px}
.roster-choice{padding:8px 3px;min-height:70px;font-size:clamp(9px,1.3cqw,20px);letter-spacing:0;background:#171311;color:#efdecc;border:1px solid #bfae9d}
.art-fighter{position:absolute;top:43%;width:16%;aspect-ratio:1;background-repeat:no-repeat;background-position:0 0}.art-fighter span{position:absolute;top:110%;left:-20%;width:140%;text-align:center;color:#fff0dc;font-size:clamp(10px,1.6cqw,23px);background:#100b09dd}
.controller-help{position:absolute;left:34%;top:88%;width:57%;font:clamp(8px,1cqw,14px) Arial;color:#fff;background:#100b09ee;padding:5px}.controller-help[open]{top:auto;bottom:5%}.controller-help p{line-height:1.5}
.roster-choice.has-face{position:relative;aspect-ratio:1;min-height:0;background-repeat:no-repeat;padding:0;overflow:hidden}.roster-choice.has-face span{position:absolute;bottom:0;left:0;width:100%;padding:5px 1px;background:#080808dd;color:#fff;font-size:clamp(8px,1.1cqw,16px)}
.art-board .art-fighter{top:37%;width:17.6%;height:34.7%;aspect-ratio:auto;background-color:#111;overflow:hidden}.art-board .art-fighter span{top:auto;bottom:0;left:0;width:100%;padding:5px 0}
#screen.pause-screen,#cabinet:fullscreen #screen.pause-screen{padding:0;background:linear-gradient(90deg,#000d,#0008 45%,#0006);display:block;container-type:size;overflow:auto}
.pause-board{position:relative;min-height:100%;width:100%;color:#ded8ca;box-shadow:inset 0 0 55px #000,inset 0 0 0 2px #a5947144}
.pause-board:after{content:'';position:absolute;inset:1.3%;border:1px solid #b6a17c55;pointer-events:none;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 98%,99% 98%,99% 2%,1% 2%,1% 98%,0 98%)}
.pause-brand{position:absolute;top:3.5cqh;left:40%;width:20%;text-align:center;background:radial-gradient(ellipse,#070504ee,transparent 72%);line-height:1}
.pause-brand small{display:block;font-size:clamp(6px,.65cqw,11px);letter-spacing:2px}.pause-brand b{display:block;font:italic 900 clamp(24px,4.5cqw,70px) Impact,'Arial Narrow',sans-serif;text-transform:uppercase;letter-spacing:-2px;transform:rotate(-4deg);text-shadow:2px 3px #000}.pause-brand em{display:block;color:#db211c;font:bold clamp(10px,1.5cqw,23px) Impact,sans-serif}
.pause-panel{position:relative;padding-top:27cqh;margin-left:4.7%;width:27%;padding-bottom:9cqh}
.pause-panel p{color:#ee322a;font:bold clamp(9px,1.3cqw,20px) Arial;margin:0 0 1cqh}.pause-panel h1{font:900 clamp(32px,6.5cqw,100px)/1 Impact,'Arial Narrow',sans-serif;margin:0 0 3cqh;letter-spacing:-1px;text-shadow:2px 3px #000}
.pause-actions{display:flex;flex-direction:column;gap:1.4cqh}
.pause-actions button{min-height:5.6cqh;padding:1cqh 1.6cqw;text-align:left;border:2px solid #b6af9c;background:linear-gradient(120deg,#17100b80,#000b);color:#ded8ca;font:bold clamp(9px,1.5cqw,23px) 'Arial Narrow',Arial,sans-serif;letter-spacing:1px;box-shadow:inset 0 0 0 2px #000,inset 0 0 15px #000}
.pause-actions button.primary{border-color:#fa4436;box-shadow:0 0 12px #ff261b88,inset 0 0 20px #ad120955;background:#390a0980;color:#fff3e7}
.pause-actions:has(button:hover) button.primary:not(:hover),.pause-actions:has(button:focus-visible) button.primary:not(:focus-visible){border-color:#b6af9c;box-shadow:inset 0 0 15px #000;background:#0009;color:#ded8ca}
.pause-actions button:hover,.pause-actions button:focus-visible{border-color:#ff6455;outline:1px solid #fff0d7;outline-offset:-4px;box-shadow:0 0 15px #ff261ba0,inset 0 0 22px #ad120977;background:#390a09bb;color:#fff}
.pause-hint{display:block;margin-top:2.5cqh;letter-spacing:1px;font-size:clamp(7px,.8cqw,12px);color:#c3bcae}.pause-board footer{position:absolute;bottom:3%;left:3.5%;padding:0;color:#b8ad97;font-size:clamp(7px,.75cqw,12px);letter-spacing:2px}
@media(max-width:700px){.pause-panel{width:40%;padding-top:23cqh}.pause-brand{left:43%;width:25%}.pause-actions button{min-height:6cqh}.pause-panel h1{margin-bottom:2cqh}}
.versus-prompt{position:absolute;left:34%;top:32%;width:33.5%;padding:1% 0;text-align:center;background:#100807ed;border-bottom:2px solid #e93629;color:#fff0db;font:clamp(9px,1.4cqw,22px) Impact,Arial,sans-serif;letter-spacing:1px}
#screen.result-screen,#cabinet:fullscreen #screen.result-screen{padding:0;display:block;background:#080604;container-type:size;overflow:auto}
.result-board{position:relative;min-height:100%;padding:3% 5% 5%;color:#ddd6c6;background:linear-gradient(90deg,#000e,#0009 40%,#0005),var(--result-stage) center/cover;box-shadow:inset 0 0 60px #000,inset 0 0 0 3px #9d886050}
.result-brand{display:block;height:auto;padding:0;margin:0 0 2cqh;border:0;max-width:32%;line-height:1;text-align:left;color:#d9d1bf}
.result-brand small{display:block;font:clamp(7px,.8cqw,12px) Arial;letter-spacing:2px}.result-brand b{display:block;font:italic 900 clamp(25px,4.5cqw,65px) Impact,'Arial Narrow',sans-serif;letter-spacing:-1px;transform:rotate(-3deg);margin:1cqh 0}.result-brand em{display:block;font:clamp(12px,1.8cqw,27px) Impact,sans-serif;color:#df201e}
.result-panel{width:46%;max-width:650px}.result-eyebrow{color:#f0372c;letter-spacing:3px;font:bold clamp(9px,1cqw,15px) Arial;margin:2.5cqh 0 1cqh}
.result-panel h1{font:900 clamp(25px,4.8cqw,73px)/1 Impact,'Arial Narrow',sans-serif;margin:0;overflow-wrap:break-word;letter-spacing:-1px;color:#e5dfd1;text-shadow:2px 3px #000}
.result-panel h2{font:900 clamp(21px,3.3cqw,50px)/1 Impact,sans-serif;margin:1cqh 0 2cqh;color:#dd2d26}.result-stats{font:clamp(9px,1cqw,15px)/1.45 Arial;color:#c4beaf;margin:0 0 2cqh}
.result-actions{width:76%;gap:1cqh}.result-actions button{min-height:4.8cqh;padding:.8cqh 1.3cqw;font-size:clamp(9px,1.3cqw,20px)}
.result-hint{display:block;font:clamp(7px,.75cqw,11px) Arial;letter-spacing:1px;margin-top:2cqh;color:#a69e8a}.result-error{color:#ffd28b;font-size:12px}
.result-board footer{position:absolute;bottom:2%;right:4%;padding:0;color:#bcb09a;font-size:clamp(7px,.8cqw,12px);letter-spacing:2px}
@media(max-width:700px){.result-panel{width:65%}.result-actions{width:90%}.result-brand{max-width:50%}.result-board{padding-bottom:9%}.result-actions button{min-height:28px}.result-board footer{position:static;margin-top:14px}}
/* Gamepad focus must not depend on the browser's keyboard-only focus-visible heuristic. */
#screen button.controller-selected{outline:3px solid #ff5445!important;outline-offset:-3px!important;border-color:#fff0d6!important;box-shadow:0 0 16px #ff302bbb,inset 0 0 14px #c3211744!important;color:#fff4df!important}
#screen button.controller-selected:not(.has-face){background-color:#4a120e!important}
#screen.boss-screen{padding:0;background:#000;display:block}.boss-intro{height:100%;width:100%;position:relative}.boss-intro video{width:100%;height:100%;object-fit:contain}.boss-intro>div{position:absolute;top:3%;right:3%;display:flex;gap:10px}.boss-intro button{background:#100909dd;color:#eee0cf;border-color:#e54b38}
.menu-pad-hints{position:absolute;bottom:1%;left:35%;width:60%;text-align:right;padding:5px 10px;color:#eee0c9;background:#090705d9;font:clamp(8px,1cqw,14px) Arial;pointer-events:none;z-index:9}.menu-pad-hints b{border:1px solid #c4b9a1;border-radius:50%;padding:1px 5px;margin-left:14px}