/* A phone's landscape viewport is a bounded interface, not a long web page. */
#mobile-settings-button{display:none}
body.mobile-landscape.playing,body.mobile-landscape.compact-selection{overflow:hidden;overscroll-behavior:none}
body.mobile-landscape.playing>.topbar,body.mobile-landscape.playing>footer,body.compact-selection>.topbar,body.compact-selection>footer,body.compact-selection>.music-lobby,body.compact-selection>#resource-preload{display:none}
body.compact-selection>#resource-preload:has(#resource-retry:not([hidden])){display:flex;position:fixed;top:32px;left:20%;right:20%;z-index:40;background:#12253e;border:1px solid #7be8fa;padding:6px}

body.mobile-landscape.playing #battle{position:fixed;inset:0;z-index:10;width:100%;height:var(--mobile-viewport-height,100dvh);min-height:0;max-width:none;margin:0;padding:0;display:block;overflow:hidden}
body.mobile-landscape #battle .battle-toolbar{position:absolute;inset:0 0 auto;height:32px;min-height:32px;z-index:10;display:flex;gap:8px;padding:0 max(82px,env(safe-area-inset-right)) 0 max(10px,env(safe-area-inset-left));background:#081321ed;border-bottom:1px solid #34475f;font-size:10px}
body.mobile-landscape #battle .battle-toolbar>div:last-child{display:flex;gap:12px;margin-left:auto;align-items:center}
body.mobile-landscape #battle .battle-toolbar button{font-size:11px;min-height:30px;padding:3px 0;white-space:nowrap}
body.mobile-landscape #battle .battle-location{display:flex;min-width:0;overflow:hidden;white-space:nowrap;font-size:9px;gap:8px}
body.mobile-landscape #match-stage,body.mobile-landscape .toolbar-dot,body.mobile-landscape .pace-badge,body.mobile-landscape #pause-button kbd{display:none}
body.mobile-landscape #mobile-settings-button{display:inline-block}
body.mobile-landscape #battle>.music-battle,body.mobile-landscape #battle>.battle-bottom,body.mobile-landscape #battle>.mobile-guide,body.mobile-landscape #battle>#training-panel,body.mobile-landscape #battle>#online-battle-status{display:none}
body.mobile-landscape #arena{position:absolute;inset:32px max(0px,env(safe-area-inset-right)) 0 max(0px,env(safe-area-inset-left));display:block;width:auto;height:auto;margin:0;min-height:0;max-height:none;aspect-ratio:auto;border:0;border-radius:0;box-shadow:none}
body.mobile-landscape #arena .battle-screen{position:absolute;inset:0;width:100%;height:100%;min-height:0;aspect-ratio:auto;overflow:hidden}
body.mobile-landscape #game-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
body.mobile-landscape #arena .arena-top{inset:48px 10px auto;justify-content:center;pointer-events:none}
body.mobile-landscape #arena .arena-label{display:none}
body.mobile-landscape #timer{font-size:14px;line-height:20px;text-shadow:0 1px 4px #000,0 0 6px #000}
body.mobile-landscape #arena .hud{position:absolute;inset:5px 8px auto;z-index:3;display:flex;min-height:0;height:40px;padding:3px 8px;gap:20px;background:#081526b8;border:1px solid #65839945;border-radius:6px}
body.mobile-landscape #arena .hud-player{max-width:360px;gap:5px}
body.mobile-landscape #arena .hud-avatar{display:none}
body.mobile-landscape #arena .hud-body:has(.health-meter){display:grid;grid-template-columns:1fr auto;grid-template-rows:12px 5px 4px;row-gap:3px;column-gap:8px}
body.mobile-landscape #arena .hud-name{grid-column:1;grid-row:1;font-size:9px;line-height:12px}
body.mobile-landscape #arena .hud-body:has(.health-meter) .percent{grid-column:2;grid-row:1;font-size:13px;line-height:13px}
body.mobile-landscape #arena .percent small{font-size:9px}
body.mobile-landscape #arena .hud-body .health-meter{grid-column:1/-1;grid-row:2;height:5px;margin:0}
body.mobile-landscape #arena .hud-body:has(.health-meter) .ultimate-meter{grid-column:1/-1;grid-row:3;height:3px;margin:0}
body.mobile-landscape #arena .ultimate-status,body.mobile-landscape #arena .stocks,body.mobile-landscape #arena .recovery-state{display:none}
body.mobile-landscape #battle.has-team-hud #hud{display:none}
body.mobile-landscape #campaign-team-status{position:absolute;z-index:6;top:36px;left:calc(env(safe-area-inset-left) + 6px);right:calc(env(safe-area-inset-right) + 6px);height:38px;display:flex;flex-wrap:nowrap;align-items:stretch;overflow-x:auto;overflow-y:hidden;gap:4px;margin:0;padding:0;scrollbar-width:none;overscroll-behavior-x:contain}
body.mobile-landscape #campaign-team-status>span{min-width:100px;max-width:220px;flex:1 0 100px;height:38px;padding:2px 5px;overflow:hidden;border-radius:4px}
body.mobile-landscape #campaign-team-status strong,body.mobile-landscape #campaign-team-status small{font-size:8px;line-height:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.mobile-landscape #campaign-team-status .health-meter{height:4px;margin:2px 0}
body.mobile-landscape #campaign-team-status .ultimate-meter{height:2px;margin:0;width:100%}
body.mobile-landscape #campaign-team-status .ultimate-status{display:none}
body.mobile-landscape #campaign-team-status>span>small:nth-of-type(2){display:none}
body.mobile-landscape #arena .boss-health-bars{position:absolute;z-index:4;inset:47px 8px auto;padding:2px 6px;gap:3px;background:#071322c9}
body.mobile-landscape #arena .boss-health-label{font-size:8px;line-height:10px;margin-bottom:3px}
body.mobile-landscape #arena .boss-health-track{height:8px}
body.mobile-landscape #battle.has-boss-hud .arena-top{top:80px}
body.mobile-landscape.touch-mode #arena .touch-controls{position:absolute;inset:0;display:block!important;width:100%;height:100%;min-height:0;margin:0;padding:0;background:transparent;pointer-events:none;z-index:4}
body.mobile-landscape #arena .stick-area{position:absolute;left:12px;bottom:12px;width:140px;height:140px;padding:0;transform:scale(var(--mobile-control-scale));transform-origin:left bottom}
body.mobile-landscape #arena .joystick{width:140px;height:140px;pointer-events:auto}
body.mobile-landscape #arena .stick-track{width:128px;height:128px;transform:none}
body.mobile-landscape #arena .action-area{position:absolute;right:12px;bottom:12px;display:block;width:184px;height:184px;transform:scale(var(--mobile-control-scale));transform-origin:right bottom}
body.mobile-landscape #arena .action-area>.stick-label{position:absolute;left:0;right:0;bottom:calc(100% + 6px);width:184px;max-width:none;min-height:0;max-height:30px;padding:2px 4px;font-size:10px;line-height:13px;overflow:hidden}
body.mobile-landscape #arena .touch-actions{display:block;width:184px;height:184px;transform:none}
body.mobile-landscape #arena .touch-actions button{width:58px;height:58px;pointer-events:auto}
body.mobile-landscape #arena .touch-actions .touch-x{left:63px;top:0}
body.mobile-landscape #arena .touch-actions .touch-a{left:126px;top:63px}
body.mobile-landscape #arena .touch-actions .touch-b{left:63px;top:126px}
body.mobile-landscape #arena .touch-actions .touch-y{left:0;top:63px}
body.mobile-landscape #arena .overlay-card{max-height:calc(var(--mobile-viewport-height) - 48px);overflow:auto}
/* Only the report body scrolls; the actions never leave the viewport. */
body.mobile-landscape #overlay.result-overlay{height:var(--mobile-viewport-height,100dvh);padding:max(8px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));overflow:hidden}
body.mobile-landscape #overlay.result-overlay .overlay-card{display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;height:100%;max-height:none;min-height:0;overflow:hidden;padding:10px 14px;border-radius:10px}
body.mobile-landscape #overlay.result-overlay .eyebrow{font-size:8px;line-height:12px;margin:0}
body.mobile-landscape #overlay.result-overlay h2{font-size:22px;line-height:28px;margin:4px 0}
body.mobile-landscape #overlay.result-overlay #overlay-description{font-size:10px;line-height:16px;margin:0 0 6px}
body.mobile-landscape #overlay.result-overlay #result-content{min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;padding-right:5px;scrollbar-width:thin}
body.mobile-landscape #overlay.result-overlay .overlay-actions{gap:20px;min-height:44px;margin-top:6px;padding:4px 0 0;border-top:1px solid #7a95b133;background:#101a2c;touch-action:manipulation}
body.mobile-landscape #overlay.result-overlay .overlay-actions button{min-height:36px;margin:0;padding:8px 24px;font-size:12px}
body.mobile-landscape.showing-results #touch-controls{visibility:hidden;pointer-events:none}
#mobile-battle-settings{width:min(560px,90vw);max-height:85dvh;overflow:auto;border:1px solid #536f8b;border-radius:12px;background:#0b1729;color:#e2f3ff;padding:18px}
#mobile-battle-settings::backdrop{background:#020611aa}
#mobile-battle-settings .dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:12px}
#mobile-battle-settings .music-battle{display:flex;flex-wrap:wrap;gap:12px;padding:10px 0}
#mobile-battle-settings .music-battle small{display:none}
#mobile-battle-settings .training-panel{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0;padding:8px;font-size:11px}
#mobile-battle-settings .training-panel .recovery-tip{display:none}
.mobile-setting-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 0;font-size:12px}

/* Keep navigation, the roster and the launch button inside one landscape view. */
body.mobile-landscape.compact-selection #lobby{position:fixed;inset:0;z-index:8;width:100%;height:var(--mobile-viewport-height,100dvh);min-height:0;max-width:none;margin:0;padding:4px max(8px,env(safe-area-inset-right)) 4px max(8px,env(safe-area-inset-left));display:grid;grid-template-columns:1fr;grid-template-rows:32px minmax(0,1fr);gap:4px;overflow:hidden;background:#080e1b}
body.mobile-landscape #lobby .intro{display:none}
body.mobile-landscape #lobby .lobby-nav{grid-column:1;grid-row:1;margin:0;font-size:12px;padding-right:78px}
body.mobile-landscape #lobby .setup{grid-column:1;grid-row:2;display:grid;grid-template-columns:clamp(190px,27vw,250px) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:6px 10px;width:100%;height:100%;min-height:0;max-width:none;margin:0;overflow:hidden}
body.mobile-landscape #mobile-selection-settings{grid-column:1;grid-row:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:4px 7px 8px;border:1px solid #30455d;border-radius:7px;scrollbar-width:thin}
body.mobile-landscape #mobile-selection-roster{grid-column:2;grid-row:1;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}
body.mobile-landscape #mobile-selection-footer{grid-column:1/-1;grid-row:2;display:flex;gap:12px;align-items:center;min-height:46px;background:#101d31;border:1px solid #37536c;border-radius:7px;padding:4px 8px}
body.mobile-landscape #mobile-selection-footer .versus-strip{flex:1;min-width:0;margin:0;display:flex;font-size:10px;padding:3px;gap:8px}
body.mobile-landscape #mobile-selection-footer .versus-strip>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.mobile-landscape #mobile-selection-footer .versus-strip strong{font-size:11px;display:inline;margin-left:4px}
body.mobile-landscape #mobile-selection-footer .start-button{flex:0 0 144px;width:auto;min-height:36px;margin:0;padding:8px 12px;font-size:12px}
body.mobile-landscape #mobile-selection-footer .start-button span:last-child,body.mobile-landscape #mobile-selection-footer #start-hint{display:none}
body.mobile-landscape #mobile-selection-roster .roster-heading{flex:none;height:27px;margin:0;font-size:10px}
body.mobile-landscape #mobile-selection-roster .roster-heading>span{font-size:10px}
body.mobile-landscape #mobile-selection-roster .slot-tabs button{padding:5px 12px;font-size:11px}
body.mobile-landscape #mobile-selection-roster .random-selection-tools{flex:none;height:28px;margin:0 0 3px;gap:8px}
body.mobile-landscape #mobile-selection-roster .random-selection-tools button{padding:4px 8px;font-size:10px}
body.mobile-landscape #mobile-selection-roster .random-selection-status{flex:none;margin:0;font-size:9px;line-height:12px;max-height:24px;overflow:hidden}
body.mobile-landscape #mobile-selection-settings .section-heading{font-size:10px;margin:6px 0}
body.mobile-landscape #mobile-selection-settings .section-heading>span{font-size:9px}
body.mobile-landscape #mobile-selection-settings .mode-tabs{gap:4px;margin:0 0 6px}
body.mobile-landscape #mobile-selection-settings .mode-tabs button{padding:6px 3px;font-size:10px;min-height:30px}
body.mobile-landscape #mobile-selection-settings .mode-tabs small{display:none}
body.mobile-landscape #mobile-selection-settings .free-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
body.mobile-landscape #mobile-selection-settings .stage-description,body.mobile-landscape #campaign-description,body.mobile-landscape #mobile-selection-settings [data-gamepad-status],body.mobile-landscape #mobile-selection-settings #match-rule-settings small{display:none}
body.mobile-landscape #mobile-selection-settings .control-settings{gap:6px;margin-bottom:8px;font-size:10px}
body.mobile-landscape #mobile-selection-settings select{padding:4px 5px;font-size:10px;max-width:100%}
body.mobile-landscape #mobile-selection-settings .campaign-current{display:flex;flex-wrap:wrap;gap:5px;padding-bottom:6px}
body.mobile-landscape #mobile-selection-settings .campaign-current strong{font-size:17px}
body.mobile-landscape #mobile-selection-settings .campaign-current small{font-size:9px}
body.mobile-landscape #mobile-selection-settings .stage-option img{height:32px}
body.mobile-landscape #mobile-selection-settings .stage-option strong{font-size:9px;padding:5px 1px}
body.mobile-landscape #mobile-selection-settings .stage-picker{gap:4px}
body.mobile-landscape #mobile-selection-settings .settings-row{display:flex;flex-wrap:wrap;gap:6px;font-size:10px;margin:8px 0}
body.mobile-landscape #mobile-selection-settings .loadout{margin:6px 0;padding:6px;font-size:10px}
body.mobile-landscape #mobile-selection-settings #relay-orders{font-size:9px}
body.mobile-landscape #mobile-selection-settings #relay-orders ol{padding-left:15px}

body.mobile-landscape #roster,body.mobile-landscape #shibuya-roster{flex:1;min-width:0;min-height:0;display:grid;grid-template-columns:none;grid-template-rows:repeat(2,minmax(0,1fr));grid-auto-flow:column;grid-auto-columns:124px;gap:6px;margin:0;padding:3px;overflow-x:auto;overflow-y:hidden;overscroll-behavior:contain;touch-action:pan-x;scrollbar-width:thin;scroll-snap-type:x proximity}
body.mobile-landscape #roster>*,body.mobile-landscape #shibuya-roster>*{min-width:0;min-height:0;scroll-snap-align:start}
body.mobile-landscape #roster .fighter-card,body.mobile-landscape #shibuya-roster .fighter-card{display:flex;flex-direction:column;min-height:0;height:100%;padding:0}
body.mobile-landscape #roster .fighter-card-shell>.fighter-card{padding-bottom:27px}
body.mobile-landscape #roster .fighter-portrait,body.mobile-landscape #shibuya-roster .fighter-portrait{position:relative;flex:1;min-height:0;overflow:hidden}
body.mobile-landscape #roster .fighter-portrait canvas,body.mobile-landscape #shibuya-roster .fighter-portrait canvas{position:absolute;inset:0;width:100%;height:100%}
body.mobile-landscape #roster .fighter-card>canvas,body.mobile-landscape #shibuya-roster .fighter-card>canvas{flex:1;min-height:0;height:auto;width:100%}
body.mobile-landscape #roster .card-top,body.mobile-landscape #shibuya-roster .card-top{z-index:1;inset:3px 4px auto;font-size:6px;letter-spacing:0}
body.mobile-landscape #roster .fighter-info,body.mobile-landscape #shibuya-roster .fighter-info{flex:none;min-width:0;padding:3px 5px}
body.mobile-landscape #roster .fighter-info>div:first-child,body.mobile-landscape #shibuya-roster .fighter-info>div:first-child{display:block}
body.mobile-landscape #roster .fighter-info strong,body.mobile-landscape #shibuya-roster .fighter-info strong{display:block;font-size:11px;line-height:14px;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.mobile-landscape #roster .fighter-info small,body.mobile-landscape #shibuya-roster .fighter-info small{display:block;max-width:100%;font-size:8px;line-height:10px;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}
body.mobile-landscape #roster .fighter-info p,body.mobile-landscape #roster .stat-chips,body.mobile-landscape #roster .character-type-tag,body.mobile-landscape #roster .campaign-wildcard-tag,body.mobile-landscape #shibuya-roster .fighter-info p{display:none}
body.mobile-landscape #roster .card-appearance{bottom:3px;left:4px;right:4px;font-size:8px;gap:3px}
body.mobile-landscape #roster .card-appearance select{height:22px;padding:2px 3px;font-size:9px}
body.mobile-landscape #roster .random-portrait{flex:1;min-height:0;height:auto;display:grid;place-items:center;font-size:32px}
body.mobile-landscape #roster .random-fighter-card>strong{font-size:12px;padding:3px 6px}
body.mobile-landscape #roster .random-fighter-card>p{display:none}
body.mobile-landscape.compact-selection #shibuya-selection{position:fixed;inset:0;z-index:8;display:flex;flex-direction:column;gap:5px;width:100%;height:var(--mobile-viewport-height,100dvh);max-width:none;min-height:0;margin:0;padding:4px max(8px,env(safe-area-inset-right)) 4px max(8px,env(safe-area-inset-left));overflow:hidden;background:#080e1b}
body.mobile-landscape #shibuya-selection-back{align-self:flex-start;flex:none;height:28px;padding:4px 0}
body.mobile-landscape #shibuya-selection>.eyebrow,body.mobile-landscape #shibuya-selection>p:not([id]){display:none}
body.mobile-landscape #shibuya-selection h1{flex:none;font-size:20px;line-height:24px;margin:0}
body.mobile-landscape #shibuya-selection-note{flex:none;font-size:10px;line-height:13px;max-height:26px;margin:0}
body.mobile-landscape #shibuya-selection .shibuya-start{position:static;flex:none;min-height:42px;padding:4px 8px;font-size:11px}
body.mobile-landscape #shibuya-selection .shibuya-start .start-button{padding:8px 16px;min-width:130px;min-height:32px;font-size:12px}
@media(max-height:350px){body.mobile-landscape #roster,body.mobile-landscape #shibuya-roster{grid-template-rows:minmax(0,1fr)}}
#mobile-battle-settings .music-battle .quality-settings small{display:block;flex-basis:100%;margin:0;line-height:1.5}