/* Desktop command table: the battlefield and its management rail each own their space. */
body.desktop-layout.immersive{--hud-height:72px;--rail-width:320px;padding:0;height:100dvh;overflow:hidden}
body.desktop-layout.immersive>header{height:var(--hud-height);min-height:var(--hud-height);padding:0 24px;gap:16px;background:#101a15}
body.desktop-layout.immersive>header .brand{flex:0 0 auto;gap:12px;font-size:23px;letter-spacing:1.5px}
body.desktop-layout.immersive>header .brand>span:last-child{display:block}
body.desktop-layout.immersive>header .brandmark{border:1px solid #9c8050;border-radius:6px;padding:5px 9px;font-size:30px}
body.desktop-layout.immersive>header .resourcebar{margin:0 auto;gap:32px}
body.desktop-layout.immersive>header .resourcebar>div{min-width:110px;gap:10px}
body.desktop-layout.immersive>header .resourcebar b{font-size:23px}
body.desktop-layout.immersive>header .resourcebar small{font-size:12px;letter-spacing:.5px}
body.desktop-layout.immersive>header .resourcebar em{display:inline}
body.desktop-layout.immersive>header .resourceicon{font-size:25px}
body.desktop-layout.immersive>header #soundBtn{width:60px;flex-basis:60px;font-size:14px}
body.desktop-layout.immersive>header .viewbutton{font-size:14px;max-width:none;padding:8px 14px}
body.desktop-layout.immersive main{display:grid;grid-template-columns:minmax(0,1fr) var(--rail-width);gap:16px;padding:16px 20px;height:calc(100dvh - var(--hud-height));min-height:0;background:radial-gradient(ellipse at top,#1a2a20,#0b130f)}
body.desktop-layout.immersive .battle{display:grid;grid-template-rows:52px minmax(0,1fr) auto auto auto;gap:10px;width:100%;height:100%;min-height:0}
body.desktop-layout.immersive .battle .battleheading,body.desktop-layout.immersive .battle:has(#chestsBtn:not([hidden])) .battleheading{position:static;grid-row:1;height:52px;padding:0 4px;border:0;background:transparent;overflow:visible;pointer-events:none;min-width:0}
body.desktop-layout.immersive .battleheading>div:first-child{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
body.desktop-layout.immersive .battleheading .eyebrow{display:block;font-size:12px;letter-spacing:1.5px}
body.desktop-layout.immersive .battleheading h1{font-size:20px;line-height:1.2;white-space:normal;margin:0}
body.desktop-layout.immersive .battleheading .clock{margin-left:auto;margin-right:4px;display:none}
body.desktop-layout.immersive .battle .field{position:relative;inset:auto;grid-row:2;width:100%;height:100%;min-height:0;border:1px solid #52624a;border-radius:12px;overflow:visible;box-shadow:0 8px 36px #0005}
body.desktop-layout.immersive .battle .map-scroll{width:100%;height:100%;border-radius:11px;background:#14261b;overflow:auto;scrollbar-width:none;cursor:grab}
body.desktop-layout.immersive .battle .map-scroll:active{cursor:grabbing}
body.desktop-layout.immersive .battle .fieldtop{top:-62px;left:auto;right:0;height:52px;gap:6px;justify-content:flex-end}
body.desktop-layout.immersive .battle .fieldtop button{font-size:14px;padding:8px 12px;min-height:44px;height:44px}
body.desktop-layout.immersive .battle .fieldbottom{position:absolute;left:12px;bottom:12px;right:auto;gap:12px}
body.desktop-layout.immersive .battle .keepstatus{width:214px;font-size:12px;padding:10px 12px;min-height:44px}
body.desktop-layout.immersive .battle .keepstatus b{font-size:13px}
body.desktop-layout.immersive .battle .wave-preview{top:12px;left:12px;width:auto;max-width:calc(100% - 380px);font-size:14px;padding:9px 12px;border-radius:8px}
body.desktop-layout.immersive .battle .wave-preview small{font-size:12px}
body.desktop-layout.immersive .battle .boss-hud{top:80px;left:12px;width:320px;max-width:calc(100% - 36px);padding:10px 12px}
body.desktop-layout.immersive .battle .boss-hud strong{font-size:15px;line-height:1.4}
body.desktop-layout.immersive .battle .minimap-panel{top:auto;bottom:12px;right:12px;width:156px}
body.desktop-layout.immersive .battle .minimap-panel:has(#miniMapBody[hidden]){width:100px}
body.desktop-layout.immersive .battle .intro-panel{top:12px;left:auto;right:12px;width:320px;max-width:calc(100% - 24px);max-height:calc(100% - 210px);overflow:auto}
body.desktop-layout.immersive .battle .battlecontrols{position:static;grid-row:3;min-height:56px;display:flex;flex-wrap:wrap;gap:8px;border:1px solid #3f5042;border-radius:10px;padding:6px;background:#142219}
body.desktop-layout.immersive .battle .battlecontrols>div{margin:0;flex:1 1 auto;gap:8px}
body.desktop-layout.immersive .battle .battlecontrols button{height:44px;min-height:44px;font-size:14px;padding:8px 14px}
body.desktop-layout.immersive .battle .battlecontrols>.primary{flex:0 1 240px;max-width:none;min-width:180px}
body.desktop-layout.immersive .battle .build-toggle{display:none}
body.desktop-layout.immersive .battle .ability-bar{position:static;grid-row:4;display:flex;gap:8px;margin:0;pointer-events:auto}
body.desktop-layout.immersive .battle .ability-bar button{flex:1;max-width:none;font-size:14px;min-height:44px;padding:6px 10px;background:#1b2b20}
body.desktop-layout.immersive .battle #message{position:static;grid-row:5;display:block;visibility:visible;height:auto;max-height:48px;min-height:24px;margin:0;padding:0 4px;color:#b9c8b0;background:transparent;font-size:14px;line-height:1.5;white-space:normal;overflow:auto;pointer-events:auto}
body.desktop-layout.immersive .battle .wave-summary{display:none}
body.desktop-layout.immersive #buildAside{display:block;position:relative;inset:auto;grid-column:2;width:100%;height:100%;min-height:0;max-height:none;overflow:auto;padding:14px;border:1px solid #465a43;border-radius:12px;background:#142017;box-shadow:none;backdrop-filter:none;scrollbar-width:thin}
body.desktop-layout.immersive #buildAside .asideheading{display:block;margin:0 0 12px}
body.desktop-layout.immersive #buildAside .asideheading h2{font-size:22px;margin:4px 0 0}
body.desktop-layout.immersive #buildAside .drawer-toolbar{top:-14px;padding:8px 0;z-index:3;background:#142017;margin-bottom:10px}
body.desktop-layout.immersive #buildAside .drawer-toolbar .tabs{position:static;margin:0;background:transparent}
body.desktop-layout.immersive #buildAside .drawer-toolbar .tabs button{font-size:15px;min-height:44px}
body.desktop-layout.immersive #buildAside .aside-close{display:none}
body.desktop-layout.immersive #buildAside .castle-card{padding:12px;min-height:64px;font-size:16px;border-radius:8px}
body.desktop-layout.immersive #buildAside .castle-card small{font-size:13px;line-height:1.4}
body.desktop-layout.immersive #buildAside .economy-cards{grid-template-columns:1fr;gap:6px}
body.desktop-layout.immersive #buildAside .economy-cards button{display:grid;grid-template-columns:48px 1fr;min-height:62px;padding:8px;gap:2px 10px;border-radius:8px;text-align:left}
body.desktop-layout.immersive #buildAside .economy-cards img{grid-row:1/3;width:48px;height:44px}
body.desktop-layout.immersive #buildAside .economy-cards strong{font-size:14px;align-self:end}
body.desktop-layout.immersive #buildAside .economy-cards small{font-size:12px;align-self:start;margin:0}
body.desktop-layout.immersive #buildAside .section-label{font-size:13px;margin:16px 0 8px;line-height:1.5}
body.desktop-layout.immersive #buildAside .wall-cards button{min-height:48px;font-size:14px;border-radius:6px}
body.desktop-layout.immersive #buildAside .slot-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
body.desktop-layout.immersive #buildAside .slot-list button{min-height:52px;border-radius:6px}
body.desktop-layout.immersive #buildAside .full{font-size:14px;min-height:44px;padding:10px;border-radius:7px}
body.desktop-layout.immersive #buildAside .bonus{border-radius:7px;font-size:14px}
body.desktop-layout.immersive #buildAside .menu-legal{gap:10px;font-size:13px}
body.desktop-layout.immersive.context-open #buildAside{overflow:hidden;padding:0;border-color:#ba9b61}
body.desktop-layout.immersive.context-open #buildAside>:not(.context-card){display:none}
body.desktop-layout.immersive #buildAside .context-card{position:relative;inset:auto;width:100%;height:100%;max-height:none;border:0;border-radius:11px;box-shadow:none;background:#142017}
body.desktop-layout.immersive #buildAside .context-card>header{height:auto;min-height:64px;padding:12px;gap:8px;flex:0 0 auto}
body.desktop-layout.immersive #buildAside .context-card>header strong{font-size:16px;line-height:1.4}
body.desktop-layout.immersive #buildAside .context-card .inspect{flex:1;min-height:0;padding:12px;font-size:14px}
body.desktop-layout.immersive #buildAside .context-option{padding:12px;margin:10px 0;border-radius:8px}
body.desktop-layout.immersive #buildAside .context-option strong{font-size:16px}
body.desktop-layout.immersive #buildAside .context-option p,body.desktop-layout.immersive #buildAside .context-status,body.desktop-layout.immersive #buildAside .context-note{font-size:14px;line-height:1.5}
body.desktop-layout.immersive #buildAside .context-option>small{font-size:13px}
body.desktop-layout.immersive #buildAside .context-art{width:60px;height:60px}
body.desktop-layout.immersive #buildAside .context-option button{font-size:14px;min-height:44px;padding:8px}
body.desktop-layout.immersive #buildAside .upgrade-comparison{font-size:13px;margin:12px 0}
body.desktop-layout.immersive #buildAside .upgrade-comparison th,body.desktop-layout.immersive #buildAside .upgrade-comparison td{padding:8px 3px}
body.desktop-layout.immersive #buildAside .context-actions{padding:12px;background:#101b13}
body.desktop-layout.immersive #buildAside .context-actions button{min-height:48px;font-size:15px}
body.desktop-layout.immersive.context-open .battle .minimap-panel,body.desktop-layout.immersive.context-open .battle .wave-preview,body.desktop-layout.immersive.context-open .battle .boss-hud{visibility:visible}
body.desktop-layout.immersive #startDialog{width:min(1180px,calc(100vw - 64px));height:min(840px,calc(100dvh - 48px));margin:auto;border-radius:18px}
body.desktop-layout.immersive #startDialog .start-shell{display:grid;grid-template-columns:46% 54%;overflow:hidden}
body.desktop-layout.immersive #startDialog .start-brand{top:38px}
body.desktop-layout.immersive #startDialog .start-brand h2{font-size:42px}
body.desktop-layout.immersive #startDialog .start-brand p{font-size:16px}
body.desktop-layout.immersive #startDialog .start-setup{padding:28px 36px;gap:20px;overflow:auto;justify-content:flex-start}
body.desktop-layout.immersive #startDialog .start-options{gap:16px}
body.desktop-layout.immersive #startDialog .start-intro{font-size:18px;text-align:left;margin:0}
body.desktop-layout.immersive #startDialog .start-modes button{min-height:90px;gap:5px;border-radius:10px}
body.desktop-layout.immersive #startDialog .start-modes strong{font-size:18px}
body.desktop-layout.immersive #startDialog .start-modes small{font-size:13px}
body.desktop-layout.immersive #startDialog .start-map-label,body.desktop-layout.immersive #startDialog .start-difficulty legend{font-size:14px}
body.desktop-layout.immersive #startDialog .start-map select{font-size:16px}
body.desktop-layout.immersive #startDialog .start-difficulty span{font-size:14px;min-height:46px}
body.desktop-layout.immersive #startDialog .start-launch{text-align:left;margin:0}
body.desktop-layout.immersive #startDialog #startBtn{font-size:18px;min-height:56px}
body.desktop-layout.immersive #startDialog .start-legal{justify-content:flex-start}
body.desktop-layout.immersive #infoDialog{width:min(780px,calc(100vw - 48px))}
body.desktop-layout.immersive #infoDialog .dialogcontent{padding:28px}
@media(min-width:1600px){body.desktop-layout.immersive{--rail-width:360px}body.desktop-layout.immersive main{padding:20px 28px;gap:20px}body.desktop-layout.immersive .battleheading h1{font-size:24px}}
@media(max-height:760px){body.desktop-layout.immersive{--hud-height:60px}body.desktop-layout.immersive main{padding:10px 16px;gap:12px}body.desktop-layout.immersive .battle{grid-template-rows:48px minmax(0,1fr) auto auto auto;gap:8px}body.desktop-layout.immersive .battle .battleheading{height:48px}body.desktop-layout.immersive .battle .fieldtop{top:-56px;height:48px}body.desktop-layout.immersive #startDialog .start-setup{padding:20px 28px;gap:14px}body.desktop-layout.immersive #startDialog .start-modes button{min-height:72px}}
@media(max-width:1200px){body.desktop-layout.immersive{--rail-width:296px}body.desktop-layout.immersive>header{padding-inline:16px;gap:10px}body.desktop-layout.immersive>header .brand{font-size:18px;gap:8px}body.desktop-layout.immersive>header .resourcebar{gap:14px}body.desktop-layout.immersive>header .resourcebar>div{min-width:90px}body.desktop-layout.immersive .battleheading h1{font-size:17px;max-width:230px}body.desktop-layout.immersive .battle .fieldtop button{font-size:13px;padding:7px 9px}body.desktop-layout.immersive .battle .intro-panel{width:270px}body.desktop-layout.immersive .battle .wave-preview{max-width:calc(100% - 300px)}}

body.desktop-layout.immersive .battle .battleheading{padding-right:calc(var(--map-tools-width) + 12px)}
body.desktop-layout.immersive .battleheading .clock{display:flex;flex-direction:column;align-items:flex-end;gap:2px;margin:0 0 0 auto;flex:0 1 170px;min-width:0;text-align:right}
body.desktop-layout.immersive .battleheading .clock>span{font-size:20px;line-height:1.2}
body.desktop-layout.immersive .battleheading .clock small{display:block;font-size:12px;max-width:none;white-space:normal;line-height:1.25}
body.desktop-layout.immersive #buildAside .utility-details{margin-top:12px;border-top:1px solid #435640;padding-top:4px}
body.desktop-layout.immersive #buildAside .utility-details>summary{display:block;cursor:pointer;min-height:44px;padding:12px 2px;font-size:14px;color:#e9c588}
body.desktop-layout.immersive #buildAside .utility-details>summary::after{content:' +';float:right;font-size:20px}
body.desktop-layout.immersive #buildAside .utility-details[open]>summary::after{content:' −'}

body.desktop-layout.immersive .battle #zoomBtn,body.desktop-layout.immersive .battle #zoomOutBtn,body.desktop-layout.immersive .battle #centerBtn{display:none}body.desktop-layout.immersive .battle .map-scroll,body.desktop-layout.immersive .battle .map-scroll:active{cursor:default;overflow:hidden}body.desktop-layout.immersive .battle #miniMap{cursor:default}body.desktop-layout.immersive .battle .edge-warning{cursor:default}body.desktop-layout.immersive #buildAside .context-card>header #closeContextBtn{width:auto;min-width:70px;font-size:14px}body.desktop-layout.immersive .battle .wave-preview{max-width:calc(100% - 350px)}
