/* Setup has no live defense yet. Keep the board: it owns non-expanded dialogs. */
#play[data-scene=setup] .hud,
#play[data-scene=setup] .command,
#play[data-scene=setup] .tower-dock,
#play[data-scene=setup] .dock-actions,
#play[data-scene=setup] .battle-footer,
#play[data-scene=setup] .board-badge,
#play[data-scene=setup] #mission-tip,
#play[data-scene=setup] #defense-readout,
#play[data-scene=setup] #round-advice,
#play[data-scene=setup] .game-tools>button:not(#exit-game):not(#language-game):not(#fullscreen){display:none!important}
#play[data-scene=setup] .game-layout{grid-template-columns:minmax(0,1fr)!important}
#play[data-scene=setup] .board{padding:0!important}
/* hidden must win over the existing flex/grid and phone toolbar rules. */
#play button[hidden],#play #prep-clock[hidden]{display:none!important}
#play:not([data-scene=battle]) #snare,
#play:not([data-scene=battle]) #cycle-target{display:none!important}
#play[data-scene=prepare] #round-clock{display:none!important}
#play[data-scene=prepare] .board-badge:has(#contract-badge[hidden]){display:none!important}
#play[data-scene=prepare]:has(#mission-tip:not([hidden])) .game-toast[data-tone=info]{display:none!important}
#play .dock-actions:not(:has(> :not([hidden]))){display:none!important}
/* A default selected card is not an explicit request for its detailed stats. */
#play[data-has-selection=false][data-catalog-open=false] #commands-panel{display:none!important}
#play[data-scene=prepare]:not(.is-practicing) .battle-footer>span:first-child{visibility:hidden}
/* An idle desktop inspector becomes a short row rather than an empty column. */
@media(min-width:1101px){
 #play.desktop-battlefield:is(.is-viewport,.is-fullscreen):not([data-scene=setup]) .game-layout{
  grid-template-columns:minmax(0,1fr) clamp(248px,17vw,316px);
  background:#102d39;
 }
 #play.desktop-battlefield .game-top>.hud{
  order:1;display:flex;justify-content:center;align-items:center;gap:clamp(14px,2.4vw,42px);
  flex:1;min-width:0;height:45px;max-height:45px;padding:0 8px;background:transparent;
 }
 #play.desktop-battlefield .game-top>.map-label{order:0;flex:none}
 #play.desktop-battlefield .game-top>.game-tools{order:2;flex:none;margin-left:auto}
 #play.desktop-battlefield .game-top .gold-wallet{min-width:120px;padding:3px 8px;gap:7px}
 #play.desktop-battlefield .game-top .hud strong{font-size:18px}
 #play.desktop-battlefield .game-top #gold{font-size:24px}
 #play.desktop-battlefield .game-top .hud small{font-size:8px}
 #play.desktop-battlefield .game-top .hud .gold-context{font-size:8px}
 #play.desktop-battlefield .game-top .hud-icon{font-size:17px}
 #play.desktop-battlefield .game-top .round-tracker{display:none}
 #play.desktop-battlefield .command{
  min-width:0;padding:10px;gap:8px;overflow:auto;overscroll-behavior:contain;
  background:#e8ecd9;border-left:1px solid #849c90;
 }
 #play.desktop-battlefield .command .tower-dock{padding:0;background:none;border:0;z-index:auto}
 #play.desktop-battlefield .command .tower-dock .tower-shop{grid-template-columns:repeat(2,minmax(0,1fr))}
 #play.desktop-battlefield .command .tower-card{min-height:52px;padding:5px;grid-template-columns:25px minmax(0,1fr)}
 #play.desktop-battlefield .command .tower-copy strong{font-size:11px}
 #play.desktop-battlefield .command .tower-icon{width:24px;height:26px;font-size:19px}
 #play.desktop-battlefield .command .tower-copy small{font-size:8px;white-space:normal}
 #play.desktop-battlefield #tower-drag-hint:not([hidden]){padding:4px 6px;margin:4px 0 6px;font-size:10px}
 #play.desktop-battlefield .command>.dock-actions{
  position:sticky;bottom:-10px;z-index:7;display:flex;align-items:stretch;flex-wrap:wrap;
  gap:5px;margin:auto -10px -10px;padding:8px 10px;background:#e3e9d4;
  border-top:1px solid #b8c8ad;
 }
 #play.desktop-battlefield .command>.dock-actions #quick-wave{order:5;min-width:0;margin:0;width:100%;justify-content:space-between}
 #play.desktop-battlefield .command>.dock-actions #round-recap{width:100%;padding:4px 6px;font-size:10px}
 #play.desktop-battlefield .command>.dock-actions #round-advice{display:flex;flex-wrap:wrap;padding:3px 4px;gap:5px;background:none;font-size:10px;width:100%}
 #play.desktop-battlefield .command>.dock-actions #round-advice button{min-height:26px}
 #play.desktop-battlefield .battle-footer{min-height:30px;justify-content:flex-end;gap:8px;background:#173f41}
 #play.desktop-battlefield .battle-footer>span:first-child{display:none}
 #play.desktop-battlefield .mission-tip:not([hidden]){min-height:0;padding:4px 10px;background:#1d4548;color:#e3ead1}
 #play.desktop-battlefield .mission-tip p{margin:0;font-size:11px}
 #play.desktop-battlefield .board{background:radial-gradient(ellipse at center,#24525f,#102b38 85%)}
}
@media(min-width:1101px) and (max-width:1399px){
 #play.desktop-battlefield .game-top>.map-label .mode-label{display:none}
 #play.desktop-battlefield .game-top>.hud{gap:12px}
 #play.desktop-battlefield .game-top{min-height:52px;padding-block:4px}
 #play.desktop-battlefield .battle-footer{padding-block:3px}
}
@media(max-width:700px) and (orientation:portrait){
 #play[data-has-selection=false][data-catalog-open=false]:not(.is-practicing) .command[data-panel=commands]{height:88px!important;flex:0 0 88px!important}
 #play[data-catalog-open=true][data-has-selection=false]:not(.is-practicing) .command[data-panel=commands]{height:170px!important;flex:0 0 170px!important}
 #play[data-catalog-open=true][data-has-selection=false] #commands-panel:not([hidden]){display:block!important}
}
@media(prefers-reduced-motion:no-preference){
 #play[data-scene=battle] #pulse:not([hidden]),#play[data-scene=battle] #snare:not([hidden]){animation:deck-reveal .18s ease-out}
}
.mobile-play-controls{display:flex;gap:6px;flex-shrink:0}
.mobile-play-controls[hidden],#mobile-more-panel[hidden]{display:none!important}
.mobile-play-controls button,#mobile-close-details{min-height:44px;min-width:44px;padding:6px 10px;background:#26665b;color:#fff6da;border:1px solid #8aa88b;border-radius:6px;font-size:12px;font-weight:750;touch-action:manipulation}
#mobile-build{background:#efd28b;color:#174b48;border-color:#f4dfa7}
#mobile-more-panel{position:absolute;z-index:240;top:58px;right:8px;width:min(320px,calc(100% - 16px));max-height:calc(100% - 66px);overflow:auto;overscroll-behavior:contain;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;border:1px solid #a3b98e;border-radius:9px;background:#f4f3e0;box-shadow:0 8px 28px #082c3c88}
#mobile-more-panel button{min-height:44px;padding:7px;font-size:12px;border:1px solid #99af8a;border-radius:5px;background:#e3ead2;color:#20524b}
#mobile-more-close{grid-column:2;justify-self:end;min-width:44px}
.more-title{grid-column:1;grid-row:1;align-self:center;font-size:14px;color:#245a51}
#mobile-more-close{grid-row:1}
.settings-pause-note{grid-column:1/-1;grid-row:2;font-size:11px;line-height:1.4;color:#4a7063;padding:3px 0}
.more-title,#mobile-more-close{position:sticky;top:0;z-index:1;background:#f4f3e0}
#mobile-more-panel .logbook-text{display:inline!important}
#mobile-more-panel .logbook-icon{display:none!important}
#play .overlay.expanded .modal:has(>#close-help){display:flex;flex-direction:column;gap:10px;overflow:hidden;max-width:620px}
#play .guide-scroll{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding-right:5px;text-align:left}
#play .modal>#close-help{flex:0 0 auto;margin:0;min-height:44px}
.tower-shop{position:relative}
.build-cancel-cue{position:absolute;inset:0;z-index:9;display:flex;align-items:center;justify-content:center;padding:12px;border:2px dashed #dce8c2;border-radius:8px;background:#214d50ed;color:#fff3c9;font-size:13px;font-weight:750;line-height:1.5;text-align:center;pointer-events:none}
.build-cancel-cue[hidden]{display:none!important}
.build-site-badge{display:inline-block;margin-bottom:4px;padding:2px 6px;border-radius:4px;background:#f4e3a9;color:#214e47;font-size:10px;font-weight:800}
.build-site-badge[hidden]{display:none!important}
.drag-ghost[data-mode=cancel]{border-color:#bdd1c8!important;background:#315658f5!important}
.drag-ghost>div{min-width:0}
.drag-ghost>span{flex-shrink:0}
.drag-ghost .drag-budget{white-space:normal;line-height:1.4;font-style:normal}
.drag-ghost[data-positioned=true]{translate:none;max-width:270px;box-sizing:border-box}
.drag-cancel-tip{display:block;margin-top:5px;font-size:9px;line-height:1.4;color:#d5e5d5}
.drag-cancel-tip[hidden]{display:none!important}
.game-toast[data-tone=action]{border-color:#a9cead;background:#285c52f2}
#play.mobile-compact #mobile-close-details{white-space:nowrap;flex-shrink:0;font-size:11px;padding:4px 7px}
#play #quick-wave .prep-state-label{display:block!important;font-size:9px;line-height:12px;letter-spacing:0;white-space:nowrap;text-transform:none;margin:0}
#play #quick-wave #launch-action-label{display:inline;line-height:1.3}
#play #quick-wave[data-prep-state=confirm]{background:#f5d5a1;border-color:#c58d53;color:#673e22}
#play #quick-wave[data-prep-state=building],#play #quick-wave[data-prep-state=transport]{border-inline-start:3px solid #579397}
#play #quick-wave[data-prep-state=ready]{border-inline-start:3px solid #548458}
#play #quick-wave::after{
 content:"";position:absolute;inset:auto 8px 1px;height:2px;border-radius:2px;
 background:#548458;pointer-events:none;transform-origin:left;transform:scaleX(var(--prep-time-left,1));
}
#play #quick-wave.urgent::after{background:#a96037}
#prep-brief[hidden],#prep-brief-details[hidden]{display:none!important}
#prep-brief{
 flex:0 0 auto;width:100%;min-width:0;border:1px solid #bacbb7;border-radius:6px;
 color:#234b42;background:#eef1e3;
}
#prep-brief>button{
 display:flex;align-items:center;justify-content:space-between;gap:5px;width:100%;
 min-height:44px;padding:5px 8px;border:0;border-radius:5px;background:transparent;
 color:inherit;text-align:start;font:inherit;font-size:11px;font-weight:800;touch-action:manipulation;
}
#prep-brief>button:active{background:#dde8d3}
#prep-brief>button:focus-visible{outline:2px solid #32675d;outline-offset:-3px}
#prep-brief>button i{
 flex:none;width:6px;height:6px;margin-right:2px;border:solid currentColor;
 border-width:0 2px 2px 0;transform:translateY(-2px) rotate(45deg);
}
#prep-brief>button[aria-expanded=true] i{transform:translateY(2px) rotate(225deg)}
#prep-brief-details{display:grid;gap:3px;margin:0 8px;padding:5px 0 7px;border-top:1px solid #c7d6c1;line-height:1.25}
#prep-brief-details :is(strong,small){font-size:10px;overflow-wrap:anywhere}
#play[data-build-layout] .dock-actions>*{visibility:hidden!important;pointer-events:none!important}
#play[data-build-layout] .mission-tip[hidden],#play[data-build-layout] #round-advice[hidden]{visibility:hidden!important}
#play.mobile-compact[data-build-open=false] .tower-dock .tower-shop{display:none!important}
#play.mobile-compact .dock-actions{flex-wrap:wrap;gap:6px;margin-bottom:0;min-height:44px}
#play.mobile-compact .dock-actions>button{min-height:44px!important}
#play.mobile-compact .battle-footer{display:none!important}
#play.mobile-compact .site-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
#play.mobile-compact .site-grid button{min-height:44px}
#play.mobile-compact[data-has-selection=false][data-catalog-open=false] .command[data-panel=commands] .control-heading{display:none!important}
#play.mobile-compact.is-aiming .mobile-play-controls,#play.mobile-compact.skill-aiming .mobile-play-controls{visibility:hidden;pointer-events:none}
@media(max-width:700px) and (orientation:portrait){
 #play.mobile-compact .game-top{display:flex!important;justify-content:space-between;align-items:center;gap:5px;min-height:52px;padding:4px 8px}
 #play.mobile-compact .map-label{display:none!important}
 #play.mobile-compact .game-tools{display:contents!important}
 #play.mobile-compact .game-top>#fullscreen{min-width:88px;min-height:44px;padding:5px 8px;font-size:11px}
 #play.mobile-compact .game-tools>.icon-button{min-height:44px;min-width:38px;padding:5px 7px}
 #play.mobile-compact[data-has-selection=false][data-catalog-open=false] .command[data-panel=commands]{display:none!important}
 #play.mobile-compact .tower-dock{padding:7px 8px}
 #play.mobile-compact[data-scene=battle] .dock-actions{min-height:94px;align-content:center}
 #play.mobile-compact[data-scene=battle] .dock-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(44px,.6fr);grid-template-rows:44px 44px;align-items:stretch}
 #play.mobile-compact[data-scene=battle] .dock-actions #pulse{grid-row:1;grid-column:1;min-width:0;margin:0}
 #play.mobile-compact[data-scene=battle] .dock-actions #snare{grid-row:1;grid-column:2;min-width:0;margin:0}
 #play.mobile-compact[data-scene=battle] .dock-actions #cycle-target,#play.mobile-compact[data-scene=battle] .dock-actions #skill-cancel{grid-row:1;grid-column:3;min-width:0;margin:0;padding:4px;font-size:10px}
 #play.mobile-compact[data-scene=battle] .dock-actions .mobile-play-controls,#play.mobile-compact[data-scene=battle] .dock-actions #aim-info{grid-row:2;grid-column:1/-1;width:100%;min-width:0;margin:0}
 #play.mobile-compact[data-scene=battle] .mobile-play-controls button{flex:1}
 #play.mobile-compact[data-build-open=true] .tower-dock .tower-shop{margin-top:7px}
 #play.mobile-compact .mission-tip{padding:6px 10px;min-height:30px}
 #play.mobile-compact .tutorial-steps{display:none}
 #play.mobile-compact .mission-tip p{font-size:10px;line-height:1.4}
 #play.mobile-compact .control-heading{gap:5px}
 #play.mobile-compact .control-tabs{flex:1}
 #play.mobile-compact .command.has-mobile-actions:not([data-expanded=true]){height:202px!important}
}
@media(max-width:1100px) and (max-height:550px) and (orientation:landscape){
 #play.mobile-compact[data-build-open=false][data-has-selection=false][data-catalog-open=false]:not([data-interface-hidden=true]):has(.command[data-panel=commands]) .game-layout{grid-template-columns:minmax(0,1fr) 150px!important}
 #play.mobile-compact .mobile-play-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:3px}
 #play.mobile-compact .mobile-play-controls button{min-width:0;font-size:10px;padding:4px 2px;overflow-wrap:anywhere}
 #play.mobile-compact .dock-actions{gap:5px}
 #play.mobile-compact[data-build-open=false][data-has-selection=false][data-catalog-open=false] .dock-actions>button{flex:1 1 100%}
 #play.mobile-compact .control-tabs button{font-size:9px}
 #play.mobile-compact #mobile-close-details{padding:4px;min-width:44px;min-height:44px}
 #play.mobile-compact .site-selector .site-grid{top:100%;bottom:auto;left:auto;right:0;width:264px;max-width:calc(100vw - 16px)}
}

/* Live phone play starts with the battlefield, not onboarding or header copy. */
#play.mobile-compact:not([data-scene=setup]) .game-top>.map-label,
#play.mobile-compact:not([data-scene=setup]) .game-top>.game-brand,
#play.mobile-compact:not([data-scene=setup]) .game-top>.game-title,
#play.mobile-compact:not([data-scene=setup]) .game-top>strong,
#play.mobile-compact:not([data-scene=setup]) .mission-tip,
#play.mobile-compact:not([data-scene=setup]) .board-badge{display:none!important}
#play.mobile-compact[data-opening=true] .game-toast[data-tone=info]{display:none!important}
#play.mobile-compact:not([data-scene=setup]) .game-top{min-height:44px;padding:3px 8px;gap:5px;justify-content:flex-end;flex-wrap:nowrap}
#play.mobile-compact:not([data-scene=setup]) .game-top .game-tools{gap:5px;flex-wrap:nowrap;width:auto}
/* Reserve a real HUD row. An absolute HUD was covering the first 48px of all
   three islands in landscape; board fitting now sees only unobstructed space. */
#play.mobile-compact:not([data-scene=setup]) .hud{position:relative!important;inset:auto!important;flex:0 0 48px;height:48px!important;min-height:48px;max-height:48px;z-index:auto;border-radius:0;padding:2px 6px;box-sizing:border-box;overflow:visible}
#play.mobile-compact:not([data-scene=setup]) .hud .gold-wallet{min-width:118px;padding:2px 6px;gap:5px}
#play.mobile-compact:not([data-scene=setup]) .hud #gold{font-size:27px;line-height:1}
#play.mobile-compact:not([data-scene=setup]) .hud .gold-wallet small{font-size:7px;line-height:1;margin:0 0 2px}
#play.mobile-compact:not([data-scene=setup]) .hud .gold-context{display:none}
#play.mobile-compact:not([data-scene=setup]) .hud>div:not(.gold-wallet){min-width:0;gap:4px}
#play.mobile-compact:not([data-scene=setup]) .hud>div:not(.gold-wallet)>.hud-icon{display:none}
#play.mobile-compact:not([data-scene=setup]) .hud strong{font-size:18px;line-height:1.1}
#play.mobile-compact:not([data-scene=setup]) .hud small{font-size:7px}
#play.mobile-compact:not([data-scene=setup]) .board{padding:0!important}

#play.mobile-compact.landscape-stage:not([data-scene=setup]) .game-top{height:50px;min-height:50px;max-height:50px}
#play.mobile-compact.landscape-stage:not([data-scene=setup]) .game-top>.hud{flex:1 1 auto!important;min-width:270px;max-width:600px;height:44px!important;min-height:44px;max-height:44px;background:none;padding:0 5px}
#play.mobile-compact.landscape-stage:not([data-scene=setup]) .game-top>.hud .gold-wallet{min-width:112px}
#play.mobile-compact:not([data-scene=setup]) .game-top .game-tools>button,#play.mobile-compact:not([data-scene=setup]) .game-top>#fullscreen{min-width:44px!important;min-height:44px!important}

/* A tapped empty site needs the tower cards and a way back, not the inspector. */
#play.mobile-compact[data-site-catalog=true] .control-heading,
#play.mobile-compact[data-site-catalog=true] #commands-panel{
 display:none!important;
}
.site-build-heading{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:8px;
 margin-bottom:4px;
 padding-inline-start:4px;
 color:#1e564d;
}
.site-build-heading[hidden]{display:none}
.site-build-heading strong,.site-build-heading small{display:block}
.site-build-heading strong{font-size:13px}
.site-build-heading small{font-size:10px;line-height:1.3}
@media(max-width:700px) and (orientation:portrait){
 #play.mobile-compact[data-site-catalog=true] .command,
 #play.mobile-compact[data-build-open=true][data-scene=battle]:not(.is-practicing):has(.site-build-heading:not([hidden])) .command{display:none!important}
}
#play.mobile-compact[data-scene=battle]:not(.is-practicing):has(.site-build-heading:not([hidden])) .dock-actions{
 display:none!important;
}
@media(max-width:1100px) and (max-height:550px) and (orientation:landscape){
 #play.mobile-compact:has(.site-build-heading:not([hidden])):not([data-interface-hidden=true]) .game-layout{
  grid-template-columns:minmax(0,1fr) 150px!important;
 }
 #play.mobile-compact:has(.site-build-heading:not([hidden])) .tower-dock .tower-shop{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
 }
}

/* A focus view leaves the canvas and a reachable restore button. */
#play.mobile-compact #interface-toggle{
 min-width:44px;
 min-height:44px;
 padding:4px 6px;
 font-size:10px;
 font-weight:750;
 color:#fff3ce;
 background:#286258;
 border-color:#8ab49c;
}
#play[data-interface-hidden=true] #interface-toggle{
 color:#164e4b;
 background:#efd28b;
 border-color:#f3d692;
 font-size:11px;
}
#focus-preparation{
 display:flex;
 align-items:center;
 justify-content:center;
 gap:6px;
 padding:5px 7px;
 color:#d6ead8;
 border:1px solid #50877f;
 border-radius:6px;
 font-size:10px;
 line-height:1.25;
 text-align:center;
}
#focus-preparation[hidden]{display:none!important}
#focus-preparation strong{font-size:17px;color:#fff0bc;font-variant-numeric:tabular-nums}
#focus-preparation.urgent{color:#fff4d0;background:#694534;border-color:#e7ad73}
#play.landscape-stage #focus-preparation{flex-direction:column;gap:3px}
#play.mobile-compact[data-scene=prepare] #round-advice{margin-bottom:0;padding-block:2px}
#play.mobile-compact[data-scene=prepare] #round-advice[data-leaks=true]{background:#fae9cb;border-top-color:#d7a473;color:#683d27}
#play.mobile-compact[data-scene=prepare] #open-wave-recap{min-width:44px;min-height:44px}
#play.mobile-compact.landscape-stage .dock-actions #round-advice{
 flex:1 1 100%;
 grid-column:1/-1;
 min-width:0;
 display:grid;
 gap:4px;
 padding:6px;
 border:1px solid #bdcfa9;
 border-radius:6px;
 font-size:10px;
}
#play.mobile-compact.landscape-stage .dock-actions #round-advice[data-leaks=true]{border-color:#d7a473}
#play.mobile-compact.landscape-stage .dock-actions #open-wave-recap{width:100%;max-width:none}
#play.mobile-compact.landscape-stage:is([data-build-open=true],[data-has-selection=true]) .dock-actions #round-advice{display:none}
#play.mobile-compact.recap-coverage #round-advice{display:none!important}
#play.mobile-compact .hud{pointer-events:none}
#play.mobile-compact .hud #round-breakdown{display:none}
#play[data-interface-hidden=true] .game-top>:not(.game-tools),
#play[data-interface-hidden=true] .game-tools>:not(#interface-toggle):not(#focus-preparation),
#play[data-interface-hidden=true] .battle-column>.hud,
#play[data-interface-hidden=true] :is(.command,.tower-dock,#defense-readout,#round-advice),
#play[data-interface-hidden=true] .board>:not(canvas):not(#overlay){
 display:none!important;
}
#play[data-interface-hidden=true] .game-layout{
 grid-template-columns:minmax(0,1fr)!important;
 background:#123c4f;
}
@media(max-width:700px) and (orientation:portrait){
 #play.mobile-compact[data-dialog=""]:not([data-scene=setup]) .game-top>#fullscreen{
  min-width:66px!important;
  padding-inline:5px;
 }
 #play.mobile-compact[data-dialog=""]:not([data-scene=setup]) .game-top>#fullscreen .fullscreen-label{
  font-size:10px;
  margin-left:2px;
 }
}
@media(max-width:1100px) and (max-height:550px) and (orientation:landscape){
 /* Move the resources into a side rail only where a full-height map fits. */
 #play.mobile-compact.landscape-stage.side-controls:not([hidden]),
 #play.landscape-stage[data-interface-hidden=true]:not([hidden]){
  display:grid!important;
  grid-template-columns:var(--interface-rail,112px) minmax(0,1fr);
  grid-template-rows:minmax(0,1fr);
 }
 #play.mobile-compact.landscape-stage.side-controls>.game-top,
 #play.mobile-compact.landscape-stage[data-interface-hidden=true]>.game-top{
  height:auto;
  min-height:0;
  max-height:none;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:stretch;
  gap:8px;
  padding:6px;
  box-sizing:border-box;
 }
 #play.mobile-compact.landscape-stage.side-controls>.game-top>.hud{
  flex:0 0 auto!important;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  justify-content:stretch;
  align-content:start;
  min-width:0;
  width:100%;
  height:auto!important;
  min-height:0;
  max-height:none;
  gap:8px;
  padding:0;
 }
 #play.mobile-compact.landscape-stage.side-controls .game-top>.hud .gold-wallet{
  min-width:0;
 }
 #play.mobile-compact.landscape-stage.side-controls .gold-wallet>.hud-icon{
  font-size:14px;
 }
 #play.mobile-compact.landscape-stage.side-controls .gold-delta{
  font-size:10px;
  top:2px;
  right:5px;
 }
 #play.mobile-compact.landscape-stage.side-controls .game-tools{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
 }
 #play.mobile-compact.landscape-stage.side-controls .game-tools>button{
  padding-inline:2px;
  font-size:10px;
 }
 #play.mobile-compact.landscape-stage.side-controls .game-tools #interface-toggle{
  order:-1;
  grid-column:1/-1;
 }
 #play.mobile-compact.landscape-stage.side-controls #fullscreen>span:first-child{
  display:none;
 }
 #play.mobile-compact.landscape-stage.side-controls #fullscreen .fullscreen-label{
  font-size:9px;
  margin:0;
 }
 #play.mobile-compact.landscape-stage.side-controls #mobile-more-panel{
  top:8px;
  left:112px;
  right:auto;
  width:min(320px,calc(100% - 120px));
  max-height:calc(100% - 16px);
 }
 #play.landscape-stage[data-interface-hidden=true]{
  --interface-rail:80px;
  background:#123c4f;
 }
 #play.mobile-compact.landscape-stage[data-interface-hidden=true]>.game-top{
  background:transparent;
  border:none;
 }
 #play.mobile-compact.landscape-stage[data-interface-hidden=true] .game-top .game-tools{
  display:flex;
  flex-direction:column;
 }
 #play.landscape-stage[data-interface-hidden=true] #interface-toggle{width:100%}
 #play.landscape-stage[data-interface-hidden=true][data-centered-focus=true]>.game-layout{padding-inline-end:80px}
}

/* Readiness is always visible. Cast receipts use a separate, secondary line. */
#play .skill-receipt[hidden]{display:none!important}
#play .dock-actions :is(#pulse-state,#snare-state,#flare-state){
 display:block!important;
 font-size:10px;
 line-height:1.15;
 font-variant-numeric:tabular-nums;
}
#play.mobile-compact .dock-actions :is(#pulse,#snare) strong{font-size:10px!important}
#play .dock-actions button[data-availability="cooldown"] :is(#pulse-state,#snare-state),
#play .dock-actions button[data-availability="empty"] #snare-state{color:#ffe1a7}

/* The free starting hero is shown before the normal Start action. */
#play .hero-intro{
 display:flex;
 align-items:center;
 gap:12px;
}
#play .hero-intro>img{flex:none;width:56px;height:64px;border:1px solid #97b49c;border-radius:8px;object-fit:cover}
#play .hero-intro>div{flex:1;min-width:0}
#play .hero-intro h2{font-size:25px!important;line-height:1.15;margin:2px 0 4px!important}
#play .hero-intro .eyebrow{font-size:9px!important;line-height:1.2;margin:0!important}
#play .hero-intro>div>span{font-size:11px;line-height:1.3;display:block}
#play .hero-intro>button{flex:none;min-height:44px;padding:6px 10px;border:1px solid #9eb58b;border-radius:6px;background:#e1ead5;color:#255b50;font-weight:750;font-size:11px}
#play .modal:has(#close-hero){display:flex;flex-direction:column;max-width:665px;text-align:left;overflow:hidden}
.hero-profile-scroll{min-height:0;overflow:auto;overscroll-behavior:contain}
.hero-heading{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.hero-heading img{flex:none;width:50px;height:55px;object-fit:cover;border-radius:7px;background:#23514d}
#play .hero-heading h2{margin:0;font-size:24px;line-height:1.2}
#play .hero-heading p{margin:4px 0 0}
.hero-skill-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.hero-skill-cards section{padding:9px 11px;border:1px solid #a2ba9d;border-radius:7px;background:#e6edda;color:#204b46}
.hero-skill-cards section:last-child{background:#f2e8c9;border-color:#c9b380}
.skill-guide-heading{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 7px;margin-bottom:5px}
.hero-skill-cards h3{margin:0;font-size:16px;line-height:1.2}
#play .hero-skill-cards p{margin:0 0 5px;font-size:11px;line-height:1.45}
.hero-skill-cards small{font-size:10px;font-weight:700}
.hero-skill-values,.skill-guide-state{font-variant-numeric:tabular-nums;font-weight:750}
.skill-guide-target{color:#486453}
.skill-guide-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:3px 8px;border-top:1px solid #b4c4a8;padding-top:5px}
#play .skill-guide-footer p{margin:0}
.skill-guide-state{color:#254c44}
.hero-profile-actions{flex:none;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;margin-top:7px}
#play .hero-guide-controls{margin:0;font-size:11px}
#play .modal:has(#close-hero) #close-hero{min-height:44px;margin:0}
#play .mobile-play-controls #hero-profile{background:#e6eccc;color:#215248}
#play .dock-actions #pulse .hero-skill-portrait{width:28px;height:34px;object-fit:cover;border-radius:5px;border:1px solid #b0cba4;flex:none}
@media(max-width:520px){
 #play .hero-intro{gap:8px}
 #play .hero-intro>img{width:42px;height:48px}
 #play .hero-intro h2{font-size:19px!important}
 #play .hero-intro>div>span{font-size:9px}
 #play .hero-intro .eyebrow{font-size:8px!important;display:block!important}
 #play .hero-intro>button{padding:5px 7px;font-size:10px}
 .hero-skill-cards{grid-template-columns:1fr}
 .hero-profile-actions{grid-template-columns:1fr}
}
@media(max-height:550px) and (orientation:landscape){
 #play .hero-intro{gap:8px}
 #play .hero-intro>img{width:40px;height:46px}
 #play .hero-intro h2{font-size:20px!important}
 #play .hero-intro .eyebrow{display:none!important}
 #play .hero-intro>div>span{font-size:10px}
 #play[data-dialog=hero-profile] .overlay.expanded{inset:52px 0 0;padding:6px 8px}
 #play[data-dialog=hero-profile] .modal{max-height:100%;max-width:690px;padding:10px 15px}
 #play .hero-heading h2{font-size:20px}
 .hero-heading{margin-bottom:5px}
 .hero-heading img{width:30px;height:34px}
 .hero-skill-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 .hero-skill-cards section{padding:6px 9px}
 .hero-profile-actions{grid-template-columns:minmax(0,1fr) auto}
 #play .hero-guide-controls{font-size:10px}
 #play .hero-skill-cards p{line-height:1.32;margin-bottom:4px}
 #play .skill-guide-footer p{margin:0}
}


#play .intro-overlay:has(.hero-intro) :is(#begin,#begin-fullscreen){min-height:44px!important}

/* A site and a tower are both chosen before the tap path can spend gold. */
#tap-build-confirm{display:none}
#play.mobile-compact #tap-build-confirm:not([hidden]){
 display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;
 margin:0 0 5px;padding:3px 4px;background:#e3ebd6;border:1px solid #aebf9d;border-radius:7px;
}
#tap-build-confirm strong,#tap-build-confirm small{display:block;line-height:1.2;overflow-wrap:anywhere}
#tap-build-confirm strong{font-size:11px;color:#163e3f}
#tap-build-confirm small{font-size:10px;color:#3a614f;margin-top:2px}
#tap-build-confirm button{
 min-width:44px;min-height:44px;padding:4px 7px;border:1px solid #99752f;border-radius:5px;
 background:#f1d58f;color:#193c3b;font-size:11px;font-weight:800;touch-action:manipulation;
}
#tap-build-confirm[data-affordable=false] small{color:#8b4531}
#tap-build-confirm button:disabled{background:#e4e6db;border-color:#a8ad9e;color:#626c63;opacity:1}
#tap-build-confirm button:active:not(:disabled){transform:scale(.96)}
@media(max-height:420px) and (orientation:landscape){
 #play.mobile-compact[data-site-catalog=true] .tower-dock .tower-card{min-height:44px;padding-block:3px}
 #play.mobile-compact[data-site-catalog=true] .site-build-heading{margin-bottom:2px}
}

#play.mobile-compact[data-scene=prepare]:not(.is-practicing):has(.site-build-heading:not([hidden])) .dock-actions{display:none!important}
.site-build-heading time:not([hidden]){display:inline-block;margin-inline-start:4px;font-size:9px;font-variant-numeric:tabular-nums;color:#455e47}

/* Mobile drawers share the same battlefield frame while controls are visible. */
@media(max-width:1100px) and (max-height:550px) and (orientation:landscape){
 #play.game-shell.is-viewport.mobile-compact.landscape-stage[data-dialog=""]:is([data-scene=prepare],[data-scene=battle]):not([data-interface-hidden=true]) .game-layout{
  grid-template-columns:minmax(0,1fr) clamp(150px,22vw,176px)!important;
 }
}
#play.mobile-compact .command > #mobile-close-details{align-self:flex-start;margin:0 0 4px}
#play.mobile-compact #mobile-close-details:not([hidden]){display:inline-flex;align-items:center;justify-content:center}
#first-defense-tip{display:flex;align-items:center;gap:5px;padding:4px 5px 4px 8px;margin:0 0 5px;background:#e5efda;color:#245547;border:1px solid #a2b896;border-radius:6px}
#first-defense-tip[hidden]{display:none}
#first-defense-tip p{flex:1;margin:0;font-size:11px;font-weight:650;line-height:1.35}
#first-defense-tip button{flex:none;min-height:44px;min-width:44px;background:transparent;color:inherit;font-size:19px}
/* The picker occupies the same command frame as skills, with an explicit exit. */
#tower-drag-hint{display:flex;align-items:center;gap:7px;margin:0 0 5px;padding:6px 8px;border:1px solid #9cba8d;border-radius:6px;background:#eaf0d9;color:#245447;font-size:11px;font-weight:650;line-height:1.35;flex:none}
#tower-drag-hint[hidden]{display:none}
#tower-drag-hint i{flex:none;display:grid;place-items:center;width:23px;height:26px;font-size:22px;font-style:normal;color:#47764e}
#tower-drag-hint[data-coach=true]{border-color:#c99f42;background:#fff0bd}
#tower-drag-hint[data-coach=true] i{animation:tower-drag-nudge 2.8s ease-in-out 3}
@keyframes tower-drag-nudge{0%,72%,100%{transform:translateX(0)}35%,52%{transform:translateX(4px)}}
@media(prefers-reduced-motion:reduce){#tower-drag-hint i{animation:none!important}}
#play.mobile-compact[data-tower-picker=true]:not(.skill-confirming) .dock-actions,
#play.mobile-compact[data-tower-details=true]:not(.skill-confirming) .dock-actions{display:none!important}
#play.mobile-compact .site-build-heading>strong{min-width:0;flex:1;line-height:1.3}
#prep-launch-slot[hidden]{display:none!important}
#play.mobile-compact.landscape-stage #prep-launch-slot{
 order:99;flex:0 0 auto;min-height:48px;margin-top:auto;width:100%;padding-top:4px;
}
#play.mobile-compact.landscape-stage #prep-brief:not([hidden]){margin-bottom:4px}
#play.mobile-compact.landscape-stage[data-prep-launch=true] .dock-actions #round-advice:not([hidden]){
 grid-template-columns:minmax(0,1fr) minmax(44px,auto);align-items:center;gap:4px;padding:3px 4px;
}
#play.mobile-compact.landscape-stage[data-prep-launch=true] .dock-actions #open-wave-recap{
 max-width:65px;padding:3px;white-space:normal;line-height:1.15;
}
#play.mobile-compact.landscape-stage #prep-launch-slot #quick-wave{
 position:relative!important;inset:auto!important;display:flex;align-items:center;justify-content:space-between;
 width:100%;height:44px;min-height:44px!important;margin:0!important;padding:4px 8px;
 flex:none!important;gap:5px;border-radius:6px;
}
#play.mobile-compact.landscape-stage #prep-launch-slot #quick-time{font-size:17px!important;line-height:1}
#play.mobile-compact.landscape-stage #prep-launch-slot #launch-action-label{font-size:10px!important;white-space:normal}
#play.mobile-compact.landscape-stage #prep-launch-slot #quick-wave>span{flex:none}
#play.mobile-compact.landscape-stage #prep-launch-slot #quick-wave b{display:flex;align-items:center;align-self:flex-end;justify-content:flex-end;gap:4px;font-size:10px!important;flex:1;min-width:0}
#play.mobile-compact.landscape-stage #prep-launch-slot #launch-action-label{min-width:0;flex:1}
#play.mobile-compact.landscape-stage #prep-launch-slot #quick-wave b>em{flex:none;font-size:18px;margin:0}
#play.mobile-compact.landscape-stage #prep-launch-slot .early-bonus{position:absolute;top:4px;right:6px;bottom:auto;left:auto;margin:0;padding:0;min-height:0;border:0;box-shadow:none;background:transparent;font-size:8px;line-height:10px;color:#456447}
#play.mobile-compact.landscape-stage[data-prep-launch=true] .command{min-height:0}
#play.mobile-compact[data-tower-picker=true] .command .control-heading{display:none!important}
#play.mobile-compact.landscape-stage[data-prep-launch=true][data-tower-details=true] .command .control-heading{display:none!important}
#play.mobile-compact.landscape-stage[data-prep-launch=true] .tower-dock{min-height:0;flex:0 1 auto;overflow-y:auto}
@media(max-height:360px) and (orientation:landscape){
 #play.mobile-compact[data-prep-launch=true] .site-build-heading{margin-bottom:2px}
 #play.mobile-compact[data-prep-launch=true][data-tower-details=true] .mobile-action-dock>strong{font-size:10px;line-height:12px;margin-bottom:1px}
 #play.mobile-compact[data-prep-launch=true][data-tower-details=true] .tower-actions{gap:1px!important}
 #play.mobile-compact[data-prep-launch=true][data-tower-details=true] .tower-actions .action-detail{display:none!important}
 #play.mobile-compact[data-prep-launch=true][data-tower-details=true] .tower-actions button{height:44px;min-height:44px!important;padding:4px!important}
 #play.mobile-compact[data-prep-launch=true] #tower-drag-hint{padding:2px 3px;margin-bottom:3px;gap:3px;font-size:9px;line-height:1.25}
 #play.mobile-compact[data-prep-launch=true] #tower-drag-hint i{width:15px;height:14px;font-size:16px}
}
#play.mobile-compact .site-build-heading>strong>span{display:inline}
#play.mobile-compact .site-build-heading #mobile-close-details{flex:none}
#play.mobile-compact .site-build-heading:has(#tap-build-confirm:not([hidden]))>strong{display:none}
#play.mobile-compact .site-build-heading #tap-build-confirm:not([hidden]){display:block;flex:1;min-width:0;margin:0;padding:0;border:0;background:none}
#play.mobile-compact .site-build-heading #tap-build-confirm>div{display:none}
#play.mobile-compact .site-build-heading #tap-build-confirm button{width:100%;min-width:0;min-height:44px;white-space:normal}
@media(max-width:1100px) and (max-height:550px) and (orientation:landscape){
 #play.mobile-compact #tower-drag-hint{gap:5px;padding:4px 5px;font-size:10px;line-height:1.3}
 #play.mobile-compact #tower-drag-hint i{width:16px;height:22px;font-size:19px}
 #play.mobile-compact[data-tower-picker=true] .tower-dock{min-height:0;flex-shrink:0}
 #play.mobile-compact[data-tower-picker=true] .site-build-heading{margin-bottom:3px}
 #play.mobile-compact[data-tower-picker=true] .tower-shop{margin-top:0!important}
 #play.mobile-compact:not([data-tower-picker=true]):not([data-tower-details=true]):not(.skill-confirming) .dock-actions{display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;flex-shrink:0;width:100%}
 #play.mobile-compact.landscape-stage[data-prep-launch=true]:not(.skill-confirming) .command>.dock-actions{
  flex-shrink:1;min-height:0;overflow-y:auto;
 }
 #play.mobile-compact:not(.skill-confirming) .dock-actions>:is(#pulse,#snare,#flare,#cycle-target){box-sizing:border-box;width:100%;max-width:none;min-width:0;min-height:44px!important;flex:none!important;white-space:normal}
 #play.mobile-compact .dock-actions :is(#pulse,#snare,#flare)>span:not(:first-child){min-width:0;flex:1}
 #play.mobile-compact .dock-actions :is(#pulse,#snare,#flare) strong{white-space:normal;overflow-wrap:anywhere;line-height:1.2}
}
@media(max-width:1100px) and (max-height:360px) and (orientation:landscape){
 #play.mobile-compact[data-scene=battle]:not([data-tower-picker=true]):not([data-tower-details=true]):not(.skill-confirming) .command[data-panel=commands]>.dock-actions{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:4px;
 }
 #play.mobile-compact[data-scene=battle]:not(.skill-confirming) .command>.dock-actions .mobile-play-controls{order:2;grid-column:1/-1}
 #play.mobile-compact[data-scene=battle]:not(.skill-confirming) .command>.dock-actions #cycle-target{order:1}
 #play.mobile-compact[data-scene=battle]:not(.skill-confirming) .command>.dock-actions:has(#flare[hidden]) #cycle-target{grid-column:1/-1}
 #play.mobile-compact[data-scene=battle] .command>.dock-actions :is(#pulse,#snare,#flare){padding:4px;gap:3px}
 #play.mobile-compact[data-scene=battle] .command>.dock-actions :is(.hero-skill-portrait,.flare-icon){width:15px;height:17px}
}
#play.game-shell.mobile-compact[data-tower-picker=true] .tower-dock .tower-shop{
 grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px;
}
#play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock{
 min-height:0;flex:0 1 auto;overflow-y:auto;overscroll-behavior:contain;padding-inline:2px;
}
#tower-scroll-controls[hidden]{display:none!important}
#tower-scroll-controls{display:flex;flex:none;gap:7px;order:80}
#tower-scroll-controls button{
 flex:1;min-height:44px;border:1px solid #a9beaa;border-radius:6px;background:#e8eee0;color:#205347;
 font-size:17px;font-weight:750;touch-action:manipulation;
}
#tower-scroll-controls button:disabled{opacity:.4}

/* Keep icons in the same two rows as the label and price, including rotated play. */
#play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .tower-card{
 display:grid;grid-template-columns:16px minmax(0,1fr);grid-template-rows:auto auto;
 min-height:44px!important;padding:3px;gap:1px 3px;align-content:center
}
#play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .tower-icon{
 display:grid;place-items:center;grid-column:1;grid-row:2;align-self:center;
 width:16px;height:19px;font-size:13px;margin:0
}
.tower-icon img{display:block;width:100%;height:100%;object-fit:contain}
#play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .tower-copy{grid-column:1/-1;grid-row:1;min-width:0}
#play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .tower-copy strong{
 font-size:9px;line-height:1.08;overflow-wrap:anywhere
}
#play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .price{
 position:static;grid-column:2;grid-row:2;align-self:center;font-size:9px;line-height:1.1;white-space:nowrap
}
@media(max-height:305px) and (orientation:landscape){
 #play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .price :is(i,em){display:none}
}

@media(max-height:305px) and (orientation:landscape){
 #play.mobile-compact.landscape-stage[data-tower-picker=true] .site-build-heading>strong{font-size:10px}
 #play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .tower-copy strong{font-size:8px;overflow-wrap:normal}
 #play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .tower-card{grid-template-columns:15px minmax(0,1fr)}
 #play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .tower-icon{width:15px}
 #play.mobile-compact.landscape-stage[data-tower-picker=true] .tower-dock .price{font-size:8px}
}