/* Optional landscape presentation; portrait rules remain the default. */
.desktopLayoutSwitch { position:fixed; top:18px; right:24px; z-index:40; display:flex; gap:10px; }
.desktopLayoutSwitch[hidden] { display:none; }
.desktopLayoutSwitch button { border:1px solid #78b7d9; border-radius:22px; padding:8px 16px; color:#eaf6ff; background:linear-gradient(#173f64,#071b30); font-size:14px; font-weight:700; cursor:pointer; display:inline-flex; align-items:center; gap:7px; }
.desktopLayoutSwitch button[aria-pressed="true"] { background:linear-gradient(#2272c0,#104882); border-color:#94d9ff; }
.desktopLayoutSwitch button:focus-visible { outline:2px solid #ffd275; outline-offset:3px; }
body.desktop-layout { --game-stage-max-width:var(--desktop-width,1000px); }
body.desktop-layout #player-panel { width:var(--desktop-width); max-width:none; height:var(--desktop-height); min-height:0; zoom:var(--desktop-scale); position:fixed; left:50%; bottom:var(--desktop-bottom); transform:translateX(-50%); margin:0; box-sizing:border-box; overflow:visible; border:1px solid #6192ae; border-radius:14px; }
body.desktop-layout #player-panel .enemyMonsterContainer { height:var(--desktop-height) !important; }
body.desktop-layout #player-panel .enemyMonsterHud { top:33% !important; }
body.desktop-layout #player-panel .enemyMonsterHud--milestone-boss { top:25% !important; --milestone-boss-size:280px; }
body.desktop-layout #player-panel #levelUIContainer { top:70px; left:50%; width:520px; max-width:calc(100% - 180px); transform:translateX(-50%); }
body.desktop-layout #player-panel .gameSideActions { top:100px; right:8px; gap:7px; }
body.desktop-layout #player-panel .gameSideActions > button { width:50px; max-width:50px; height:50px; box-sizing:border-box; border-radius:8px; }
body.desktop-layout #player-panel .prestigeSideButton { border-right:1px solid rgba(180,116,255,.62); }
body.desktop-layout #player-panel .prestigeSoulRate { border-right:1px solid rgba(214,177,255,.5); }
body.desktop-layout #player-panel #uiBtnContainer { bottom:70px !important; left:50% !important; width:600px !important; max-width:calc(100% - 180px); padding:0 !important; transform:translateX(-50%) !important; }
body.desktop-layout #player-panel #uiLvlContainer { left:50%; right:auto; bottom:8px; width:600px; max-width:calc(100% - 180px); transform:translateX(-50%); }
body.desktop-layout #player-panel .battleRewardTray { left:0; top:calc(100% + var(--desktop-tray-gap)); bottom:auto; width:100%; box-sizing:border-box; transform:none; max-height:none; }
body.desktop-layout #player-panel .battleRewardTrayItems { flex-wrap:nowrap; max-height:none; overflow-x:auto; overflow-y:hidden; gap:7px; }
body.desktop-layout #player-panel .battleRewardItem { flex:0 0 54px; width:54px; height:54px; }
body.desktop-layout #player-panel .headerBar { font-size:20px; top:14px; }
body.desktop-layout #player-panel #enemyMonsterName { font-size:18px !important; }
body.desktop-layout #player-panel #enemyMonsterHpValue { font-size:13px !important; }
body.desktop-layout #player-panel .optimalCrystalZone { font-size:11px; }
body.desktop-layout #player-panel .optimalCrystalZone strong { font-size:11px; }
body.desktop-layout #player-panel .statValue { font-size:20px; }
body.desktop-layout #player-panel .statLabel { font-size:11px; }
body.desktop-layout #player-panel #monsterContainer { max-height:calc(var(--desktop-height) - 170px); width:100%; }
body.desktop-layout #player-panel .towerWorldPortal { top:auto; bottom:16px; left:16px; right:auto; transform:none; }
@media (prefers-reduced-motion:reduce) { .desktopLayoutSwitch button { transition:none; } }

/* Clip scenery independently, leaving the reward tray outside the arena. */
.desktopSceneryViewport { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:-1; }
body.desktop-layout #player-panel .desktopSceneryViewport { border-radius:inherit; }
body.desktop-layout #player-panel::before,
body.desktop-layout #player-panel::after { content:none; display:none; }
body.desktop-layout #player-panel { box-shadow:none; }
body.desktop-layout #player-panel .headerBar { background:none; border:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
body.desktop-layout #player-panel .headerBar::before { content:""; position:absolute; top:0; bottom:0; left:50%; width:520px; max-width:calc(100% - 150px); transform:translateX(-50%); border:1px solid var(--ui-line); border-radius:16px; background:linear-gradient(180deg,rgba(16,55,89,.38),rgba(4,22,43,.48)); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); box-shadow:inset 0 1px 0 rgba(255,255,255,.12); z-index:-1; }
body.desktop-layout #player-panel .headerBar > .col-5,
body.desktop-layout #player-panel .headerBar > .col-7 { position:absolute; width:min(260px,calc((100% - 150px)/2)); max-width:none; flex:none; padding-left:0 !important; }
body.desktop-layout #player-panel .headerBar > .col-5 { right:50%; }
body.desktop-layout #player-panel .headerBar > .col-7 { left:50%; }
body.desktop-layout #player-panel .towerWorldPortal > img { animation:towerPortalFloat 3.6s ease-in-out infinite; }
html.fx-ambient-off body.desktop-layout #player-panel .towerWorldPortal > img { animation:none; }
@media (prefers-reduced-motion:reduce) { body.desktop-layout #player-panel .towerWorldPortal > img { animation:none; } }

/* Landscape chapter art follows the same server-selected chapter as portrait. */
body.desktop-layout #player-panel,
body.desktop-layout #player-panel .normalWorldBackground { background-image:var(--game-desktop-background, var(--game-battle-background)); }

body.desktop-layout #player-panel .leaderboardSideButton { right:8px; width:50px; height:50px; box-sizing:border-box; border-radius:8px; }

/* Equal outer width for team and damage bars; larger desktop portraits. */
body.desktop-layout #player-panel #uiLvlContainer { padding:0; box-sizing:border-box; }
body.desktop-layout #player-panel .teamQuickBar { height:112px; }
body.desktop-layout #player-panel .teamQuickSlot { height:108px; }
body.desktop-layout #player-panel .creatureMedallion--quick { scale:1.25; transform-origin:center center; }

/* Uniform 125% creature sheet zoom, including navigation and controls. */
body.desktop-layout #creatureUpgradePanel .creatureUpgradePanelShell { zoom:1.25; width:min(430px,calc((100vw - 96px)/1.25)); }
body.desktop-layout #creatureUpgradePanel .creatureUpgradePanelDialog { max-height:calc((100dvh - 28px)/1.25); }
body.desktop-layout #creatureUpgradePanel .creatureUpgradePanelBody { max-height:calc((100dvh - 28px)/1.25 - 44px); }

/* Desktop sheets: scale the established UI uniformly, once per dialog tree.
   Creature sheets keep their separately validated 125% shell zoom. */
body.desktop-layout :is([role="dialog"],[role="alertdialog"],dialog):not(#creatureUpgradePanel, #creatureUpgradePanel *):not(:is([role="dialog"],[role="alertdialog"],dialog) *) {
    zoom:1.2;
    max-width:calc((100vw - 40px)/1.2);
    max-height:calc((100dvh - 28px)/1.2);
}
/* Nested sheets inherit the zoom; don't multiply it a second time. */
body.desktop-layout :is([role="dialog"],[role="alertdialog"],dialog):not(#creatureUpgradePanel, #creatureUpgradePanel *) {
    max-width:calc((100vw - 40px)/1.2);
    max-height:calc((100dvh - 28px)/1.2);
}

/* Original automation buttons, docked outside the collection in desktop mode. */
.desktopAutomationDock { display:none; }
body.desktop-layout #player-panel .desktopAutomationDock { position:absolute; right:16px; bottom:16px; z-index:10; display:flex; align-items:center; gap:7px; padding:8px; border:1px solid var(--ui-line); border-radius:12px; background:rgba(4,22,43,.6); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
body.desktop-layout #player-panel .desktopAutomationDock:empty { display:none; }
body.desktop-layout #player-panel .desktopAutomationDock .premiumAutomationSwitch { width:30px; height:30px; flex-basis:30px; font-size:13px; margin:0; }

/* Use the free right gutter without covering the team or damage panels. */
body.desktop-layout #player-panel .desktopAutomationDock #premiumAutomationOpen { color:#fff; }
body.desktop-layout #player-panel .desktopAutomationDock.is-compact { display:grid; grid-template-columns:repeat(var(--automation-columns,2),24px); gap:4px; padding:4px; }
body.desktop-layout #player-panel .desktopAutomationDock.is-compact .premiumAutomationSwitch { width:24px; height:24px; min-width:0; flex-basis:24px; font-size:11px; padding:2px; }
body.desktop-layout #player-panel .desktopAutomationDock.is-compact .premiumAutomationSwitch img { width:16px; height:16px; }

/* Closed native dialogs must stay hidden, including with Bootstrap's reset. */
dialog:not([open]) { display:none !important; }
/* Portrait side fades do not belong to the landscape arena. */
body.desktop-layout .pageAmbientMagicSide::before,
body.desktop-layout .pageAmbientMagicSide::after { content:none; display:none; }

/* Landscape scenery for the special dungeon hub. */
body.desktop-layout #player-panel .towerWorldBackground { background-image:var(--tower-desktop-background, var(--tower-world-background)); }

/* Tower floor selector aligned with the desktop currency panel. */
body.desktop-layout #player-panel .towerFloorHud { width:520px; max-width:calc(100% - 150px); box-sizing:border-box; }