:root{--shared-bar:28px;--shared-header-height:calc(var(--shared-bar) + env(safe-area-inset-top));--mobile-header:var(--shared-header-height)}
body .app>.topbar.shared-header{box-sizing:border-box;position:relative;z-index:10000;display:flex;flex-wrap:nowrap;gap:8px;height:var(--shared-header-height)!important;min-height:var(--shared-header-height)!important;max-height:var(--shared-header-height);padding:env(safe-area-inset-top) max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left))!important;overflow:visible;width:100%;max-width:none;flex-shrink:0}
body .topbar.shared-header .brand{display:flex;align-items:center;gap:6px;min-height:0;height:var(--shared-bar);padding:0 8px;border:0;border-radius:0;background:transparent;color:#f4e9c9;font:700 14px/1.15 sans-serif;letter-spacing:0;white-space:nowrap;cursor:pointer}
body .topbar.shared-header .brandmark{width:19px;height:19px;min-width:19px;border-radius:4px;font-size:17px}
body .topbar.shared-header .tag{display:none}
body .topbar.shared-header .mobile-utility-toggle{display:none!important}
body .topbar.shared-header [data-shared-menu]{margin-left:auto;display:block;width:104px;height:var(--shared-bar);min-height:0;padding:0 8px;border:0;border-left:1px solid #596674;background:#15202b;color:#f4e9c9;font:700 14px/1 sans-serif;cursor:pointer}
body .topbar.shared-header button:focus-visible{outline:2px solid #ffe59a;outline-offset:-2px}
body .topbar.shared-header .top-actions{display:none!important}
body .topbar.shared-header.shared-menu-open .top-actions{display:flex!important;position:absolute;top:100%;right:max(8px,env(safe-area-inset-right));width:min(400px,calc(100vw - 24px));max-height:calc(100dvh - var(--shared-header-height) - 16px);overflow:auto;flex-wrap:wrap;gap:8px;padding:14px;background:#101923;border:1px solid #9b8250;box-shadow:0 12px 35px #000d;border-radius:0 0 12px 12px;box-sizing:border-box}
body .shared-header .top-actions .btn{min-height:44px;font-size:14px;flex:1 0 110px;white-space:normal}
body .shared-header .audio-controls{width:100%;justify-content:center}
body .shared-header .menu-version{display:block;width:100%;font-size:12px;color:#b5b8c3}
body .shared-header .top-actions [hidden]{display:none!important}
body .account-foundation-collapsed{display:none!important}
body .account-foundation:not(.account-foundation-collapsed){top:calc(var(--shared-header-height) + 6px)!important;z-index:9000;max-height:calc(100dvh - var(--shared-header-height) - 14px)}
body :is(.gacha-player-screen,.cosmetic-player-screen,.mission-player-screen,.card-pool-overlay,.modal-backdrop,.online-reconnect-overlay,.ranked-cpu-proposal-overlay,.service-recovery-notice){top:var(--shared-header-height)!important;max-height:calc(100dvh - var(--shared-header-height));box-sizing:border-box}
body .fixed-landscape-ui .gacha-frame{height:100%}
body .game-app,body .match-flow-app{--battle-header:var(--shared-header-height);--mobile-header:var(--shared-header-height)}
body .game-app{grid-template-rows:var(--shared-header-height) minmax(0,1fr)!important}
body .mana-zone-main .zone-label{flex-direction:column;align-items:flex-start;gap:2px}
body .mana-zone-main .zone-label b{white-space:nowrap;flex-shrink:0}
body .mana-zone-main .zone-label span{font-size:9px}
@media(orientation:landscape){body .title-app,body .mode-select-app,body .profile-app{height:100dvh;min-height:0;display:flex;flex-direction:column}body .title-screen-v2317,body .mode-select-screen{flex:1;min-height:0}body .title-screen-v2317{height:calc(100dvh - var(--shared-header-height))!important}}
.home-confirm-overlay{position:fixed;inset:0;z-index:20000;display:grid;place-items:center;background:#02060bd9;padding:16px}
.home-confirm-overlay>div{width:min(520px,100%);box-sizing:border-box;padding:24px;border:1px solid #bc9a57;border-radius:16px;background:#131d29;color:#f7f1dc}
.home-confirm-overlay h2{font-size:23px;margin:0 0 16px}.home-confirm-overlay p{white-space:pre-line;font-size:16px;line-height:1.7}.home-confirm-actions{display:flex;gap:12px;margin-top:22px}.home-confirm-actions button{flex:1;min-height:44px;border:1px solid #9c8758;border-radius:8px;background:#1d2b3b;color:#fff;font-size:15px;cursor:pointer}.home-confirm-actions button:last-child{background:#805c25}
@media(max-width:1180px) and (max-height:600px) and (orientation:landscape){
 body.battle-screen-active .combatant .mana-orb{width:74px;min-width:74px;height:36px!important}
 body.battle-screen-active .combatant .mana-orb small{font-size:11px!important;white-space:nowrap;line-height:12px}
 body.battle-screen-active .mana-zone-main .zone-label b{font-size:11px;white-space:nowrap}
 body.battle-screen-active .mana-compact-core small{font-size:10px;white-space:nowrap}
 body.battle-screen-active .mana-zone-main{min-width:106px}
 body.battle-screen-active .play-dock{grid-template-columns:108px minmax(0,1fr) 52px!important}
}

.home-wait-status{position:fixed;top:calc(var(--shared-header-height) + 6px);left:50%;transform:translateX(-50%);z-index:15000;max-width:90vw;padding:10px 16px;background:#26364b;color:#ffe3a2;border:1px solid #bea05e;border-radius:8px;font-size:14px;pointer-events:none}
/* The common menu and the latest panel share one stacking context. */
body .app:has(>.shared-header){isolation:auto!important}
body .shared-panel-front{z-index:9500!important}

/* Normal CPU difficulty selection; learning and online modes remain separate. */
.cpu-difficulty{margin:0 0 18px;padding:0;border:0;min-width:0}
.cpu-difficulty legend{margin-bottom:10px;font-weight:700;color:var(--text,#f5f1df)}
.cpu-difficulty-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.cpu-difficulty-option{position:relative;display:flex;align-items:center;gap:9px;min-height:74px;padding:12px;border:1px solid #716342;border-radius:12px;background:#171b24;cursor:pointer;text-align:left}
.cpu-difficulty-option input{flex:none;accent-color:#eac86a;width:18px;height:18px;margin:0}
.cpu-difficulty-option span{display:grid;gap:5px;min-width:0}
.cpu-difficulty-option b{font-size:1.05rem;color:#fff5d6}
.cpu-difficulty-option small{font-size:.78rem;line-height:1.45;color:#cbc7ba}
.cpu-difficulty-option:has(input:checked){border-color:#f3cf70;background:#332c1d;box-shadow:inset 0 0 0 1px #f3cf70}
.cpu-difficulty-option:focus-within{outline:3px solid #f3cf70;outline-offset:3px}
@media(max-width:540px){.cpu-difficulty-options{grid-template-columns:1fr;gap:7px}.cpu-difficulty-option{min-height:52px;padding:9px 12px}.cpu-difficulty-option span{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}}

/* PR108: keep the CPU difficulty and mode choices in separate layout rows. */
@media(orientation:landscape) and (max-width:1180px) and (max-height:600px){
 body.general-mobile-active .mode-select-screen{overflow:auto;place-items:start center}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty){box-sizing:border-box;display:flex!important;flex-direction:column;height:auto;min-height:100%;align-content:start;gap:8px;overflow:visible}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .cpu-difficulty{display:flex;flex:0 0 auto;flex-direction:column;margin:0;min-height:0}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .cpu-difficulty legend{margin-bottom:6px;font-size:13px}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .cpu-difficulty-option{min-height:58px;padding:8px 10px}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .cpu-difficulty-option b{font-size:15px}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .cpu-difficulty-option small{font-size:11px;line-height:1.3}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .shared-mode-grid{flex:0 0 auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .shared-mode-grid .title-entry-v2317{min-height:76px;padding:9px 18px 9px 52px}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .shared-mode-grid .title-entry-v2317>b{font-size:20px}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .shared-mode-grid .title-entry-v2317>small{font-size:12px;line-height:1.35}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .cpu-tutorial-entry{margin:0}
}
@media(max-width:540px){
 body.general-mobile-active .mode-select-screen{overflow:auto;place-items:start center}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty){box-sizing:border-box;display:flex!important;flex-direction:column;height:auto;min-height:100%;align-content:start;gap:10px;overflow:visible}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .cpu-difficulty{margin:0}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .shared-mode-grid{grid-template-columns:1fr;gap:8px}
 body.general-mobile-active .mode-select-panel:has(.cpu-difficulty) .shared-mode-grid .title-entry-v2317{min-height:88px;padding:12px 18px 12px 56px}
}