.brawl-mode .game-viewport{aspect-ratio:5/3;background:#242d3b}.brawl-mode.brawl-lobby-open .game-viewport{aspect-ratio:auto;background:#f1eee1}.brawl-mode.brawl-lobby-open #arena{display:none}.brawl-mode #arena{touch-action:none;image-rendering:pixelated}.brawl-mode .stage-label,.brawl-mode .health-track,.brawl-mode .stamina-track{display:none}.brawl-mode .game-hud{height:86px}.brawl-mode .score{font-size:25px;white-space:nowrap;font-weight:600;color:#b56d43}.brawl-mode .p2 .score{color:#477d6d}.brawl-mode .player-detail{margin-top:8px;gap:8px;min-width:0}.brawl-mode .player-detail>span{font-size:10px;color:#596a50;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brawl-mode .player-detail>.brawl-stocks{font-size:15px;letter-spacing:2px;color:#bc7b51;flex-shrink:0;overflow:visible}.brawl-mode .p2 .brawl-stocks{color:#669b82}.brawl-mode .center-hud{width:76px;flex-shrink:0}.brawl-mode .center-hud>span{font-size:9px;color:#586950;letter-spacing:0}.brawl-mode .center-hud>strong{font-size:28px;line-height:1.2}.brawl-mode .room-overlay{top:40%}.brawl-mode .room-overlay.fight h2{color:#ffdb93}.brawl-lobby{padding:24px;background:linear-gradient(135deg,#f5f1e4,#e9ecdc)}.brawl-lobby-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px}.brawl-lobby-heading h2{font-size:23px;letter-spacing:-.6px;margin:0 0 4px;font-weight:600}.brawl-lobby-heading p{font-size:12px;color:#63725b;line-height:1.6;margin:0}.brawl-lobby-heading>span{font:9px var(--mono);color:#648153;letter-spacing:.5px;text-align:right}.brawl-roster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.brawl-choice{display:flex;align-items:center;gap:10px;position:relative;min-width:0;text-align:left;min-height:98px;padding:9px;border:1px solid #c4cdb5;border-radius:5px;background:#fffdf5;color:#2a493a;box-shadow:0 2px 0 #cbd3bf}.brawl-choice canvas{width:76px;height:76px;flex:0 0 76px;image-rendering:pixelated;background:#e7ebdc;border-radius:3px}.brawl-choice strong{display:block;font-size:13px;line-height:1.4;letter-spacing:-.2px}.brawl-choice small{display:block;color:#657657;font-size:10px;line-height:1.5;margin-top:4px}.brawl-choice[aria-pressed=true]{border-color:#627e4e;background:#e2eacd;box-shadow:inset 0 0 0 1px #78925f,0 2px 0 #b6c9a0}.brawl-choice:disabled{opacity:.65}.brawl-choice[aria-pressed=true]:after{content:'YOU';position:absolute;right:7px;top:6px;font:7px var(--mono);color:#476839}.brawl-stage-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:20px 0 9px;font-size:12px;font-weight:600}.brawl-stage-heading>small{font:9px var(--mono);font-weight:400;color:#69775d}.brawl-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.brawl-stage{padding:0;border:1px solid #bfcab0;border-radius:5px;overflow:hidden;min-width:0;background:#fffdf5;text-align:left;color:#34503c}.brawl-stage canvas{display:block;width:100%;height:auto;aspect-ratio:5/3;image-rendering:pixelated}.brawl-stage>span{display:flex;align-items:center;justify-content:space-between;padding:10px;font-size:11px;font-weight:600;gap:6px}.brawl-stage small{font:8px var(--mono);color:#697e57}.brawl-stage[aria-pressed=true]{border-color:#617e4e;box-shadow:0 0 0 1px #617e4e}.brawl-stage[aria-pressed=true] small{color:#3f653c}.brawl-move-card{padding:18px 20px;border:1px solid #c9d2b9;border-radius:6px;background:#faf8ec}.brawl-move-card h2{font-size:16px;margin:0 0 6px;letter-spacing:-.3px}.brawl-move-card>p{font-size:12px;line-height:1.6;color:#65725b;margin:0 0 14px}.brawl-moves{display:grid;grid-template-columns:1fr;gap:10px}.brawl-moves>div{border-top:1px solid #dce1cf;padding-top:9px}.brawl-moves strong{display:block;font-size:11px;color:#3e5a41}.brawl-moves small{display:block;font-size:11px;line-height:1.55;color:#65725b;margin-top:4px}.brawl-controls{display:none;padding:12px;gap:8px;background:#e9eddf;border-top:1px solid #c9d2b9;user-select:none;touch-action:none}.brawl-controls>div{display:grid;gap:6px}.brawl-directions{align-self:center;grid-template-columns:repeat(3,minmax(0,1fr));width:150px;flex-shrink:0}.brawl-directions [data-brawl-action=up]{grid-column:2}.brawl-directions [data-brawl-action=left]{grid-column:1}.brawl-actions{grid-template-columns:repeat(3,minmax(0,1fr));flex:1}.brawl-controls button{min-width:0;min-height:44px;padding:9px 5px;background:#fcfbef;border:1px solid #aebd9e;border-radius:4px;color:#405c37;font:10px var(--mono);touch-action:none;box-shadow:0 2px 0 #c0cdb1}.brawl-controls [data-brawl-action=attack]{background:#edba89;border-color:#c39466;color:#6c482d}.brawl-controls [data-brawl-action=special]{background:#d4ded1;border-color:#9eb8a0}.brawl-controls button.is-held{background:#a7bd94;box-shadow:inset 0 1px 2px #48693844}.brawl-help{font-size:12px;line-height:1.6;color:#65725b}.brawl-mode .control-line .wide-key{font-size:9px;min-width:50px}
@media(pointer:coarse),(max-width:800px){.brawl-mode .brawl-controls{display:flex}}
@media(max-width:1100px){.brawl-choice{gap:6px}.brawl-choice canvas{width:60px;height:70px;flex-basis:60px}.brawl-choice strong{font-size:12px}.brawl-lobby{padding:18px}}
@media(max-width:800px){.brawl-move-card{grid-column:2}.brawl-roster{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:480px){.brawl-lobby{padding:14px 10px}.brawl-lobby-heading{align-items:flex-start;gap:10px;margin-bottom:12px}.brawl-lobby-heading h2{font-size:20px}.brawl-lobby-heading p{font-size:11px}.brawl-lobby-heading>span{font-size:8px;max-width:68px;line-height:1.5}.brawl-roster{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.brawl-choice{min-height:120px;flex-direction:column;gap:4px;text-align:center;padding:7px 5px}.brawl-choice canvas{width:75px;height:64px;flex-basis:64px}.brawl-choice strong{font-size:11px}.brawl-choice small{font-size:9px;margin-top:2px}.brawl-choice[aria-pressed=true]:after{font-size:6px}.brawl-stage-heading{font-size:11px;margin-top:17px}.brawl-stage-heading>small{font-size:8px}.brawl-stages{gap:5px}.brawl-stage>span{padding:8px 5px;font-size:9px;flex-direction:column;align-items:flex-start;gap:3px}.brawl-stage small{font-size:7px}.brawl-move-card{grid-column:1}.brawl-mode .game-hud{height:86px;padding:12px 9px;gap:8px}.brawl-mode .center-hud{width:56px}.brawl-mode .center-hud>span{font-size:8px}.brawl-mode .center-hud>strong{font-size:24px}.brawl-mode .score{font-size:19px}.brawl-mode .player-heading{gap:3px}.brawl-mode .player-detail{gap:3px}.brawl-mode .player-detail>span{font-size:9px}.brawl-mode .player-detail>.brawl-stocks{font-size:11px;letter-spacing:0}.brawl-controls{padding:10px 7px;gap:7px}.brawl-directions{width:142px;gap:5px!important}.brawl-actions{gap:5px!important;grid-template-columns:repeat(2,minmax(0,1fr))}.brawl-controls button{font-size:9px;padding:8px 3px}.brawl-mode .objective-bar{line-height:1.6}.brawl-mode .room-overlay h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){.brawl-controls button{transform:none!important;transition:none}}

@media(min-width:801px){.room-app.brawl-mode:not(.board-mode):not(.card-mode):not(:fullscreen){max-width:min(1460px,calc((100dvh - 365px)*1.666667 + 380px))}.brawl-mode:not(.brawl-lobby-open) .game-viewport{max-height:max(240px,calc(100dvh - 340px))}}

/* The fighter portraits and stage postcards share the live arena artwork. */
.brawl-choice{border-color:#bec9b0;background:linear-gradient(145deg,#fffdf5,#f8f7ea);box-shadow:0 2px 0 #c2ccb5,inset 0 1px 0 #fffef7}
.brawl-choice canvas{box-shadow:inset 0 0 0 1px #9eaf8c;outline:1px solid #bfc9b1;outline-offset:-1px;border-radius:2px}
.brawl-choice small{color:#586c4f}
.brawl-choice[aria-pressed=true]{border-color:#688349;background:linear-gradient(135deg,#e8eed7,#dae6c5);box-shadow:inset 0 0 0 1px #849b64,0 2px 0 #aebf96}
.brawl-choice[aria-pressed=true]:after{font-size:8px;letter-spacing:.3px;background:#f5f4df;padding:2px 4px;border-radius:2px}
.brawl-stage{box-shadow:0 2px 0 #c2ccb5}
.brawl-stage canvas{border-bottom:1px solid #b8c5ab}
.brawl-stage>span{background:linear-gradient(145deg,#fffdf5,#f1f2e3)}
.brawl-stage small{color:#506b42}
.brawl-stage[aria-pressed=true]>span{background:#e5eccf}
.brawl-choice:focus-visible,.brawl-stage:focus-visible{outline:2px solid #345c44;outline-offset:3px}
.brawl-move-card{box-shadow:inset 3px 0 0 #becbac;background:linear-gradient(135deg,#faf8ec,#f3f3e4)}
.brawl-controls button{box-shadow:0 2px 0 #b5c5a4,inset 0 1px 0 #ffffff8c}
@media(hover:hover){.brawl-choice:hover:enabled,.brawl-stage:hover:enabled{border-color:#789060}}
@media(max-width:480px){.brawl-choice[aria-pressed=true]:after{font-size:8px;right:4px;top:4px}.brawl-stage small{font-size:8px}}