/* Miracle Arena: soft magical-girl colors with arcade match framing. */
:root{color-scheme:light;--bg:#fff9fc;--panel:#fff;--line:#e8ddec;--text:#493653;--muted:#806d89;--lime:#a94378;--purple:#8059b5;--pink:#c4477b}
body{background:radial-gradient(ellipse at 4% 0,#ffe1ed 0,transparent 38%),radial-gradient(ellipse at 100% 18%,#e5e1ff 0,transparent 38%),linear-gradient(150deg,#fffafc,#fff8fc 65%,#f2f7ff);background-attachment:fixed;color:var(--text)}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.4;background-image:radial-gradient(#d1b4df 1px,transparent 1px);background-size:24px 24px}
::selection{background:#f7c2dc;color:#613659}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #9c62c5;outline-offset:4px}
button:disabled{opacity:.5}
.site-header{border-color:#e6d2e7;height:94px}
.brand-star{color:#d85d94;text-shadow:0 2px 0 #fff,0 0 20px #efacd0}
.brand-series{color:#9d5982}
.brand-name .brand-light{color:#77509c;font-weight:900;letter-spacing:.06em}
.build{color:#856685;letter-spacing:1.2px}.build b{background:#fff;color:#94568a;border-color:#e6d3e5;border-radius:6px}
.build i,.live-dot,.status-light{background:#d95d91;box-shadow:0 0 0 3px #f7dce9}
.icon-button{background:#fff;border-color:#dfcae4;color:#8c5b96;box-shadow:0 3px 0 #eeddeb}
.eyebrow{color:#a1457c;font-weight:800}.page-heading{padding-top:32px}.page-heading h1{font-weight:900;letter-spacing:.02em;color:#65466f}.heading-note{color:#8a728e}
.flow-step{color:#96739d;font-weight:700}.flow-toolbar>.text-button{font-size:11px}
.mode-intro{margin-bottom:15px}.mode-cast{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(115deg,#fffdfde8,#fff0f8dd 50%,#f1edffdd);border:1px solid #e4d2eb;border-radius:22px;padding:18px 28px;margin-bottom:24px;position:relative;overflow:hidden;box-shadow:0 8px 24px #ab6ca30a}
.mode-cast::after{content:'✧';position:absolute;right:38%;top:12px;font-size:76px;color:#e5c5e180;pointer-events:none}
.mode-cast-copy{flex:1}.mode-cast-copy>span{font:800 12px 'Barlow Condensed',sans-serif;letter-spacing:3px;color:#ab4b80}.mode-cast-copy>p{font-size:18px;font-weight:800;line-height:1.7;margin:7px 0 0;color:#73527e}
.mode-cast-art{display:flex;gap:10px;flex-shrink:0}.mode-portrait{width:86px;height:86px;display:block;overflow:hidden;border-radius:50%;background:linear-gradient(#fff,#f4e7ff);border:3px solid #fff;box-shadow:0 0 0 1px #dac2e8,0 5px 10px #b78cc121}
.mode-portrait:nth-child(2){background:#ffe1ee;box-shadow:0 0 0 1px #efbbd1,0 5px 10px #b78cc121}.mode-portrait:nth-child(3){background:#fff4de}.mode-portrait:nth-child(4){background:#eee6fa}.mode-portrait:nth-child(5){background:#ddf7fa}
.mode-grid{gap:20px}.mode-card{--mode-accent:#a95cbd;--mode-tint:#f6ecff;background:linear-gradient(145deg,#fff 30%,var(--mode-tint));border:1px solid #dec9e8;border-radius:20px;min-height:330px;box-shadow:0 6px 0 #ead9ee,0 12px 24px #9c709414;isolation:isolate}
.mode-card.online-mode{--mode-accent:#d05b8f;--mode-tint:#fff0f7;border-color:#ecc8da;box-shadow:0 6px 0 #f4dce8,0 12px 24px #9c709414}.mode-card:nth-child(3){--mode-accent:#318492;--mode-tint:#ecf9fc;border-color:#bcdfe5;box-shadow:0 6px 0 #d5ecf1,0 12px 24px #9c709414}
.mode-card::before{border-color:color-mix(in srgb,var(--mode-accent) 14%,transparent);box-shadow:0 0 0 28px color-mix(in srgb,var(--mode-accent) 4%,transparent),0 0 0 56px color-mix(in srgb,var(--mode-accent) 3%,transparent);z-index:-1}
.mode-card::after{content:'';position:absolute;top:0;left:27px;width:52px;height:5px;transform:skewX(-25deg);background:var(--mode-accent);border-radius:0 0 3px 3px}
.mode-card:hover{background:linear-gradient(145deg,#fff,var(--mode-tint));border-color:var(--mode-accent);transform:translateY(-4px)}
.mode-number{color:var(--mode-accent);font-weight:800}.mode-emblem,.online-mode .mode-emblem,.mode-card:nth-child(3) .mode-emblem{color:var(--mode-accent);text-shadow:0 3px 0 #fff;font-size:59px;margin:18px 0 14px}
.mode-english{color:var(--mode-accent);font-weight:800}.mode-card>strong{color:#553c62;font-weight:900}.mode-card>p{color:#816b8d}.mode-card-bottom{border-color:#dfcee8;color:#6c517c}.mode-card-bottom b{color:var(--mode-accent);background:#fff;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;font-size:21px;box-shadow:0 2px 0 #e5d4ea}
.mode-footnote{color:#947c9d}.text-button{color:#87638e;font-weight:600}.text-button:hover{color:#bc487d}
.primary-button{background:linear-gradient(110deg,#ce518b,#9b5fb9);color:#fff;border:1px solid #fff8;border-radius:12px;box-shadow:0 4px 0 #ab477f,0 8px 20px #bd5a9c26;letter-spacing:.02em}.primary-button:hover{background:linear-gradient(110deg,#dd629c,#a76bc9);box-shadow:0 5px 0 #ab477f,0 10px 24px #bd5a9c35}
.secondary-button{background:#fff;border-color:#dec7e5;color:#7b508c;border-radius:10px;box-shadow:0 2px 0 #ecddef}.secondary-button:hover{background:#fff3fa}
.fighter-showcase{background:linear-gradient(155deg,#fff5fc,#eee9ff 65%,#fff);border-color:#dcc8e7;border-radius:20px;box-shadow:0 7px 0 #ece0f0}
.showcase-glow{background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--fighter-color) 36%,white),transparent 64%)}
.showcase-art{filter:drop-shadow(0 8px 12px #ac83b52e)}.showcase-copy{background:linear-gradient(transparent,#fff9fd 20%)}.showcase-copy>p{color:#97639f;font-weight:800}.showcase-copy h2{color:#624374;font-weight:900}.showcase-copy>span{color:#816a8e}#showcase-stats span{color:#92769f}#showcase-stats b{color:#b069bb}
.selection-tabs button{background:#fff;border-color:#e1d0e7;color:#805e8a;border-radius:12px}.selection-tabs button.selected{background:#fff0f8;border-color:#cb6c9e;box-shadow:inset 0 -3px #e2a0c3}.selection-tabs small{color:#957d9e}.selection-tabs .selected small{color:#b44f84}.selection-tabs strong{font-weight:800}
.fighter-card{background:linear-gradient(#fff,#f9f1ff);border-color:#decee9;border-radius:13px;box-shadow:0 3px 0 #e8dced}.fighter-card:hover{background:#fff2fa;border-color:#bb7bc1;transform:translateY(-2px)}.fighter-card.selected{background:linear-gradient(#fff,#fce6f5);border-color:#c16aa5;box-shadow:0 0 0 2px #d68cbb,0 5px 0 #ecc7df}.fighter-card.selected::after{background:#ae5a98;color:#fff;border-radius:4px;font-weight:800;padding:3px 5px}.fighter-card>strong{color:#674772;font-weight:700}.fighter-card>small{color:#94729f}.fighter-card-art{filter:drop-shadow(0 3px 5px #a97fb72b)}
.selection-options label{color:#82618f}.selection-options select,.demo-select select,.setup-item select,.motion-controls select{background:#fff;color:#71547e;border:1px solid #dac6e4;border-radius:9px}.selection-options select{padding:10px}
.online-lobby{background:radial-gradient(ellipse at 50% 0,#f5dff5,transparent 70%),#fff;border-color:#dfc9e6;border-radius:24px;box-shadow:0 8px 0 #eddff1}.online-lobby h2{color:#704c82;font-weight:900}.online-lobby>p:not(.eyebrow){color:#876d94}.lobby-fighter>span:not(.lobby-versus){background:#f6edff;border-radius:10px;color:#805399;border-color:#b58acb}.lobby-fighter>span:last-child{background:#fff0f7;border-color:#df90b3;color:#b14f82}.lobby-versus{color:#bf4f8b;font-weight:900;text-shadow:2px 2px #f4d6e6}
#invite-link-box>label{color:#825b91}#invite-link{background:#fff;color:#745181;border-color:#dbc2e3;border-radius:8px}#invite-link-box>p{color:#8e739a}
.arena-panel{border:2px solid #dec5e7;border-radius:18px;box-shadow:0 8px 0 #ead9ef,0 15px 35px #ab71ac17}.arena-toolbar{background:#fff8fd;border-bottom:1px solid #e9d7ee;height:46px}.arena-label{color:#805a8e;font-weight:700}.toolbar-divider{background:#dfc9e7}.toolbar-actions button{color:#8b628e}.toolbar-actions #training-magic{color:#2c7eab}.toolbar-actions #training-shot{color:#a55488}
.game-frame{background:#e4d6f6}.game-frame:focus-visible{box-shadow:inset 0 0 0 3px #c969a7}.game-frame:fullscreen{background:#e2d4ef}.hud{filter:none;color:#5c3e6e;top:5%}.fighter-hud{background:linear-gradient(110deg,#fffdfbef,#fff2fccc);padding:11px 13px;border:1px solid #fff;border-radius:13px 4px 13px 4px;box-shadow:0 3px 12px #7f588028}.fighter-hud.right{border-radius:4px 13px 4px 13px;background:linear-gradient(250deg,#fffdfbef,#fff0f6cc)}.fighter-caption strong{letter-spacing:.03em;text-shadow:0 1px #fff}.player-tag{background:#9c6aba;color:#fff;border-radius:4px}.player-tag.pink{background:#d56a99;color:#fff}.round-dots{color:#b6762e;text-shadow:0 1px #fff;letter-spacing:2px}
.health-track{background:#e7d4e7;border-color:#b78fae;box-shadow:inset 0 1px 3px #ab819950}.health-fill,.right .health-fill{background:linear-gradient(90deg,#efa741,#ffdd7e)!important}.health-ghost,.right .health-ghost{background:#e17e9f!important}.meter-row{color:#696a94}.magic-track{background:#cfd6ec}.magic-track i,.right .magic-track i{background:linear-gradient(90deg,#548bd1,#62c6e3)!important}.magic-track.ready{box-shadow:0 0 9px #579ce9}
.shield-row{color:#2c8478}.shield-track{background:#c8e4db}.shield-track i{background:linear-gradient(90deg,#43a38a,#74c6ad)}.shield-row.low{color:#a86423}.shield-row.low i{background:#d99a4e}.shield-row.locked{color:#c24d72}.shield-row.locked .shield-track{background:repeating-linear-gradient(135deg,#e8a3b926 0 5px,#e8a3b908 5px 10px)}
.fighter-status{color:#675090}.fighter-status.dizzy{color:#bb5171}.timer-box{color:#734884;text-shadow:0 2px #fff}.timer-box strong{font-weight:800;filter:drop-shadow(0 2px 2px #fff)}.timer-box small,.timer-box>span{color:#815d8c;background:#fff9;padding:3px 5px;border-radius:4px}.timer-box strong{background:#fff7;border-radius:9px;padding:0 3px}
.stage-caption{color:#80618c}.arena-footer{background:#fff7fc;color:#85658e;border-top:1px solid #e8d5eb}.arena-footer kbd{background:#f5e9f7;color:#84518c;border-color:#dcc2e4}.game-message{color:#fff;text-shadow:3px 3px 0 #b65b9e,-2px -2px 0 #b65b9e,0 6px 18px #9a5c8c66}.game-message small{color:#fff;letter-spacing:2px;text-shadow:0 2px 3px #70466a}
.game-overlay{background:linear-gradient(90deg,#f8dcf133,#fff1f7c9 35%,#f2e4ffcf 65%,#f8dcf133)}.pause-card{background:#fffcfeef;border-color:#dfc3e7;border-radius:20px;box-shadow:0 7px 0 #d9b3d388,0 15px 50px #83548630}.pause-card h2{color:#86549b}.pause-card p,.start-copy,.enter-hint{color:#87628d}.start-card h2{color:#ac518e;text-shadow:0 3px #fff}.start-card h2 em{color:#8e62b9}.start-card .eyebrow{color:#aa4c83}
.controls-card,.tips-card{background:#fffcfe;border-color:#e1cde9;border-radius:18px;box-shadow:0 4px 0 #efdfef}.section-top h2{color:#79538a;font-weight:800}.section-top h2>span{color:#bd73aa}.section-description{color:#887492}.keyboard-plus{color:#c38bb9}kbd{background:linear-gradient(#fff,#f9eefa);border-color:#d9bfe2;border-bottom-color:#c79ccc;color:#8b5799;box-shadow:0 2px 0 #eedced}.special-key{background:linear-gradient(#ffeff6,#f9d8e8)!important;border-color:#df9fc0!important;color:#b3477f!important}.movement-keys>span{color:#775c83}.movement-keys>span i{color:#8e7699}.attack-keys .key-row>div>span{color:#85658f}.extra-keys{color:#866790}.extra-keys small{color:#9a7fa4}.defense-hint{color:#41877b}.tip-item>span{color:#c57db4}.tip-item h3{color:#7d558f;font-weight:700}.tip-item p{color:#8b7396}.moves-link{background:#f8eefa!important;color:#9d568f!important;border-color:#dfc7e6!important}.move-routes,.combo-route{color:#a14b80!important}#fighter-air-route{color:#3d7c9c!important}
.setup-bar{background:#fff;border-color:#e1cde9}.setup-item label{color:#84618f}.setup-item label span{color:#9f87a8}.touch-group button{background:#fff5fc;color:#8b5999;border-color:#d8b7e1;box-shadow:0 3px 0 #e6d2eb}.touch-group button:active{background:#f3d9eb}
dialog{background:#fffafd;color:#71527e;border-color:#d8b8e3;border-radius:20px;box-shadow:0 25px 100px #75477640}dialog::backdrop{background:#80518a44;backdrop-filter:blur(4px)}.dialog-heading h2{color:#805395}.dialog-bottom>span{color:#8d729c}.muted{color:#8b7495!important}.guide-grid{color:#83628d}.binding-tabs button,.binding-row button{background:#fff;border-color:#d9bfe2;color:#81598e;border-radius:8px}.binding-tabs .selected{background:#b267a3;color:#fff;border-color:#b267a3}.binding-row{border-color:#e8d8ee}.binding-row button.listening{color:#ad5185;border-color:#ce83b5;background:#fff0f8}
.motion-preview{background:#fff;border-color:#dfc9e7;border-radius:14px}.motion-preview>p{color:#8c709a}.motion-heading span{color:#9c4f89;border-color:#e4bfdb;background:#fff1f9;border-radius:6px}.motion-tabs button,.motion-controls button,.preview-context button{background:#fff;color:#8c629a;border-color:#dbc4e4;border-radius:8px}.motion-tabs .selected,.preview-context .selected{background:#a968a7;border-color:#a968a7;color:#fff}.motion-controls{border-color:#e7d5ed}.motion-controls input{accent-color:#b866a8}.preview-context>span{color:#957c9e}.demo-select{color:#87658f}.move-card{background:#fff;border-color:#e3d0eb;border-radius:12px}.move-card h4,.move-card:last-child h4{color:#a45494}.move-entry{border-color:#eadcf0}.move-entry b{color:#95699e}.move-description{color:#8e7399}.move-concept{color:#886395}.move-card h5,.air-entry b{color:#438098}
.page-footer{color:#9d819f}.page-footer>.footer-brand{color:#a56796;font-weight:700}
@media(min-width:1500px){.mode-card{min-height:350px}}
@media(max-width:1000px){.mode-cast{padding:18px 20px;gap:12px}.mode-portrait{width:65px;height:65px}.mode-cast-copy>p{font-size:15px}.mode-cast-art{gap:8px}}
@media(max-width:640px){.site-header{height:76px}.page-heading{padding:26px 0 20px}.page-heading h1{font-size:21px}.mode-cast{display:block;padding:14px 12px;margin-bottom:20px;border-radius:16px}.mode-cast-copy{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 2px 13px}.mode-cast-copy>span{font-size:9px;letter-spacing:1.5px}.mode-cast-copy>p{font-size:9px;margin:0;line-height:1.6}.mode-cast-art{justify-content:space-between;gap:6px}.mode-portrait{width:calc((100vw - 94px)/6);height:calc((100vw - 94px)/6);max-width:80px;max-height:80px;border-width:2px}.mode-cast::after{display:none}.mode-card{min-height:190px;padding:20px 21px 17px 110px;border-radius:17px}.mode-card::after{left:20px;width:33px}.mode-emblem,.online-mode .mode-emblem,.mode-card:nth-child(3) .mode-emblem{position:absolute;left:24px;top:53px;font-size:53px;margin:0}.mode-card-bottom b{font-size:19px;width:25px;height:25px}.mode-grid{gap:17px}.mode-footnote{margin-top:25px}.fighter-showcase{min-height:245px}.showcase-copy{background:transparent}.showcase-copy h2{font-size:18px}.fighter-card{border-radius:10px}.fighter-hud{padding:5px 6px;border-radius:7px 2px;min-width:0}.fighter-hud.right{border-radius:2px 7px}.hud{top:3%;left:2%;width:96%;gap:6px;grid-template-columns:1fr 34px 1fr}.fighter-caption{gap:3px}.fighter-caption strong{font-size:8px;letter-spacing:0}.round-dots{font-size:10px;letter-spacing:0}.player-tag{font-size:6px;padding:2px 3px}.timer-box strong{font-size:30px}.timer-box small{font-size:5px;letter-spacing:.6px;padding:2px}.timer-box>span{font-size:4px;letter-spacing:.3px;padding:2px}.meter-row{gap:4px;font-size:6px}.meter-row b{font-size:7px}.shield-row{font-size:6px;gap:3px}.shield-row>span{width:23px}.shield-row>b{width:26px}.health-track{height:18px}.health-fill,.health-ghost{height:12px}.fighter-status{font-size:6px;height:10px;margin-top:3px}.arena-toolbar{height:40px}.arena-label{letter-spacing:.2px;font-size:7px}.toolbar-actions{gap:6px}.toolbar-actions button{font-size:12px}.arena-panel{border-radius:13px}.page-footer{gap:6px}.page-footer>.footer-brand{font-size:8px}.page-footer>span:last-child{font-size:8px;letter-spacing:.5px}.flow-screen{min-height:0}.mode-footnote>span{font-size:8px}.mode-footnote .text-button{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Keep long fighter names and keyboard guides inside narrow layouts. */
.fighter-caption strong{min-width:0;flex:1;max-width:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fighter-status:empty{display:none}
.controls-card,.tips-card{min-width:0}
dialog>p,.guide-grid p{color:#7c6488}
@media(max-width:640px){.below-grid{grid-template-columns:minmax(0,1fr)}.keyboard-guide{flex-wrap:wrap;gap:12px}.controls-card,.tips-card{padding:20px 17px}.section-top{flex-wrap:wrap;gap:8px}.keyboard-plus{font-size:14px}.fighter-caption{margin-bottom:4px}.fighter-caption strong{font-size:7px}.health-track{height:16px}.health-fill,.health-ghost{height:10px}.meter-row{margin-top:4px}.shield-row{margin-top:3px}.fighter-status{height:8px;margin-top:2px}.timer-box>span{display:none}.arena-toolbar{height:auto;min-height:40px;padding:7px 8px;gap:8px}.arena-label{flex-shrink:0}.toolbar-actions{flex-wrap:wrap;justify-content:flex-end;gap:6px}.toolbar-actions #training-guard,.toolbar-actions #training-shot{font-size:8px}.toolbar-actions #training-magic{font-size:9px}.toolbar-divider{margin:0}.mode-cast-art .character-portrait{object-fit:cover}}


.new-stage-picker{margin:0 0 22px}.stage-picker-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:0 0 10px}.stage-picker-heading>span{font:800 11px 'Barlow Condensed',sans-serif;letter-spacing:2px;color:#b45991}.stage-picker-heading>small{font-size:9px;color:#92769d}.stage-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stage-card{position:relative;overflow:hidden;text-align:left;padding:0 0 12px;background:#fff;border:1px solid #dfcce7;border-radius:12px;box-shadow:0 3px 0 #ecdfef;transition:transform .15s,border-color .15s}.stage-card:hover{border-color:#c37dac;transform:translateY(-2px)}.stage-card.selected{border-color:#b868a0;box-shadow:0 0 0 2px #d995c1,0 4px 0 #ecd3e6}.stage-card.selected::after{content:'SELECTED';position:absolute;right:6px;top:6px;background:#a75c98;color:white;font:700 9px 'Barlow Condensed',sans-serif;letter-spacing:1px;padding:4px 6px;border-radius:5px}.stage-card img{width:100%;height:auto;aspect-ratio:1280/620;object-fit:contain;display:block;image-rendering:pixelated;border-bottom:1px solid #eadceb}.stage-card strong{display:block;font-size:11px;line-height:1.7;color:#73517e;padding:9px 12px 3px}.stage-card>span{display:block;font-size:9px;line-height:1.8;color:#94789c;padding:0 12px}.arena-label #stage-label{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stage-caption{background:#fff8;padding:3px 6px;border-radius:4px}.stage-caption>span{color:#796082}
@media(max-width:640px){.stage-gallery{gap:10px}.stage-card strong{font-size:9px;padding:8px 8px 2px}.stage-card>span{font-size:8px;padding:0 8px}.stage-card.selected::after{font-size:7px;padding:3px 4px}.arena-label #stage-label{max-width:83px;font-size:7px}.stage-picker-heading>small{font-size:8px}.stage-caption{font-size:6px;letter-spacing:.2px;left:6px;right:6px}}

/* Gauges occupy their own row; the scene and its overlays never paint beneath it. */
.game-frame{display:flex;flex-direction:column;aspect-ratio:auto;padding:0}
.game-frame>.hud{position:relative;inset:auto;width:100%;flex:0 0 auto;grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr);gap:18px;align-items:start;padding:12px 18px;background:linear-gradient(110deg,#fff6fc,#f4edff);border-bottom:1px solid #dfc7e7}
.game-frame>.hud .fighter-hud{min-width:0;padding:8px 11px;box-shadow:0 2px 6px #a17aaa17}
.game-frame>.hud .fighter-status{display:block;height:15px;line-height:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.battle-stage{position:relative;width:100%;aspect-ratio:1280/732;flex:0 0 auto;min-height:0;overflow:hidden;background:#e4d6f6}
.game-frame .battle-stage>canvas{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:contain}
.battle-stage>.game-message{top:38%}
.game-frame:fullscreen{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;padding:0}
.game-frame:fullscreen>.hud{flex:0 0 auto}
.game-frame:fullscreen>.battle-stage{flex:1 1 0;aspect-ratio:auto;min-height:0}
.game-frame:fullscreen .battle-stage>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
@media(max-width:900px){.game-frame>.hud{grid-template-columns:minmax(0,1fr) 52px minmax(0,1fr);gap:10px;padding:10px 12px}}
@media(max-width:640px){.game-frame>.hud{grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);gap:5px;padding:7px 6px}.game-frame>.hud .fighter-hud{padding:5px 6px}.game-frame>.hud .fighter-status{height:9px;line-height:9px;font-size:6px;margin-top:2px}.battle-stage{aspect-ratio:1280/732}.game-frame .battle-stage>canvas{object-fit:cover}.game-frame:fullscreen .battle-stage>canvas{object-fit:contain}.battle-stage>.game-message{top:38%}}

/* Six playable characters; keep all portraits visible on small screens. */
.fighter-roster{grid-template-columns:repeat(3,minmax(0,1fr))}.mode-portrait:nth-child(6){background:#ffe6f2}

/* Five character-select ratings, on a fixed ten-step scale. */
.showcase-ratings{margin-top:20px}
.rating-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#80568c}
.rating-heading strong{font-size:11px;font-weight:700}.rating-heading small{font-size:10px;color:#92769f}
#showcase-stats{max-width:none;margin-top:10px}
#showcase-stats>.rating-row{display:grid;grid-template-columns:70px minmax(0,1fr) 34px;gap:9px;align-items:center;margin-top:10px}
#showcase-stats .rating-label{font-family:inherit;font-size:11px;letter-spacing:0;color:#795e87;white-space:nowrap}
.rating-meter{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:3px;min-width:0;height:10px}
.rating-meter i{display:block;border-radius:2px;background:#e8dcea;box-shadow:inset 0 0 0 1px #d6c3dc55}
.rating-meter i.filled{background:#ae6eb7;box-shadow:inset 0 1px 0 #dba8e0}
#showcase-stats .rating-number{font-family:inherit;font-size:11px;font-weight:700;letter-spacing:0;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:#80568c}
.rating-help{margin:10px 0 0;color:#92769f;font-size:10px;line-height:1.7}.rating-help[hidden]{display:none}
.rating-definitions{margin-top:9px;color:#876594;font-size:10px;line-height:1.7}.rating-definitions summary{cursor:pointer;width:fit-content;padding:3px 0}.rating-definitions summary:focus-visible{outline:2px solid #ad70b6;outline-offset:3px;border-radius:3px}
.rating-definitions dl{margin:8px 0 0;display:grid;grid-template-columns:72px minmax(0,1fr);gap:6px 8px}.rating-definitions dt{font-weight:700}.rating-definitions dd{margin:0}
@media(max-width:640px){.showcase-art{width:40%}.showcase-copy{margin-left:40%;padding-right:12px}.showcase-ratings{margin-top:14px}#showcase-stats>.rating-row{grid-template-columns:56px minmax(0,1fr) 30px;gap:5px;margin-top:9px}#showcase-stats .rating-label,#showcase-stats .rating-number{font-size:9px}.rating-meter{height:8px;gap:2px}.rating-heading strong,.rating-heading small,.rating-help,.rating-definitions{font-size:9px}.rating-definitions dl{display:block}.rating-definitions dd{margin:0 0 6px}.fighter-showcase{min-height:335px}}

/* Stay in the same mode/room while choosing a new matchup. */
.selection-roster-toolbar{display:flex;align-items:center;gap:14px;margin:12px 0;min-height:36px}.random-fighter{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex-shrink:0;padding:9px 16px;background:#fff8fd;color:#985a9b;border:1px solid #d7b6df;border-radius:9px;font-family:inherit;font-size:11px;font-weight:700;cursor:pointer}.random-fighter>span{font-size:19px;line-height:1}.random-fighter:hover{background:#f8e8f5;border-color:#b975b7}.random-fighter:focus-visible{outline:3px solid #cc9bd3;outline-offset:3px}#random-result{font-size:10px;color:#98719f;line-height:1.6}.customize-state{padding:12px 14px;margin:12px 0;border:1px solid #e1c7e6;border-radius:9px;background:#fbf2ff;color:#855391;font-size:11px;line-height:1.8}.customize-state[hidden],.customize-edit[hidden]{display:none}.customize-edit{width:100%;margin-top:10px}.customize-menu-button{display:block;width:100%;margin-top:12px}.fighter-card:disabled,.stage-card:disabled{cursor:default}.random-fighter:disabled{opacity:.5;cursor:default}
@media(max-width:640px){.selection-roster-toolbar{gap:9px}.random-fighter{font-size:10px;padding:8px 12px}#random-result{font-size:9px}.customize-state{font-size:10px;padding:10px 12px}.pause-card .customize-menu-button{font-size:11px}}

.customize-error{font-size:11px;line-height:1.8;color:#b64e7b}.customize-error[hidden]{display:none}

/* Use the supplied original official illustrations for all menu portraits. */
.official-character-art{display:block;width:100%;height:100%;overflow:hidden}
.showcase-art{background:transparent;border-radius:15px;overflow:hidden}
.fighter-card-art{background:transparent;overflow:hidden}
.mode-portrait{background:transparent!important}
@media(min-width:901px){.showcase-copy{margin-top:394px}}
@media(min-width:641px) and (max-width:900px){.showcase-copy{margin-top:344px}}

/* Scoped controller configuration; combat presentation is unchanged. */
#gamepad-device{font-size:12px;overflow-wrap:anywhere}#settings-dialog .binding-row button{max-width:68%;white-space:normal;overflow-wrap:anywhere}#settings-dialog .dialog-bottom{flex-wrap:wrap;gap:10px}#cancel-gamepad-binding[hidden]{display:none}