/* Phase 7.2 battle components. The map remains the visual anchor. */
.resource{position:relative;font-variant-numeric:tabular-nums}
.resource.lives.danger{border-color:#ff938f;box-shadow:0 0 0 2px #c4474740,inset 0 1px #ffffff22}
.resource.gold-gain strong{color:#ffe18b}.resource.gold-error{animation:kg-error-nudge .26s ease}
@keyframes kg-error-nudge{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.topbar{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
.top-actions .icon-button{min-width:48px;min-height:48px}
.top-actions .icon-button.active-speed{border-color:var(--kg-gold-light);color:var(--kg-gold-light)}
.tower-legend button{position:relative;flex:none;min-height:56px;min-width:69px;padding:4px 7px;display:grid;align-content:center;justify-items:center;gap:1px;touch-action:manipulation}
.tower-legend button .kg-icon{width:25px;height:25px}
.tower-legend button b{font-size:11px;line-height:1.1;margin:0}
.tower-legend button.unaffordable .kg-icon{filter:grayscale(.8);opacity:.7}
.tower-legend button:focus-visible,.hero-skills button:focus-visible,.panel-close:focus-visible{outline:3px solid #fff3b1;outline-offset:2px}
.hero-skills button{min-width:48px;min-height:50px;touch-action:manipulation}
.hero-skills button .kg-icon{position:relative;z-index:1;width:25px;height:25px}
.hero-skills button kbd{position:absolute;z-index:2;top:2px;right:3px;font:700 10px 'Segoe UI',sans-serif;color:#d2e4ff;background:#0f2b4caa;border-radius:3px;padding:0 3px}
.hero-skills button small{font-size:10px;line-height:1.1}
.hero-skills button.locked .kg-icon{filter:grayscale(1);opacity:.45}
.hero-skills button.targeting{outline:2px solid #bde9ff;outline-offset:2px}
.hero-hud.hero-low-hp{animation:heart-pulse 1.8s 2}
.hero-hud.hero-dead .hero-portrait{filter:grayscale(1);opacity:.55}.hero-hud.hero-dead{border-color:#8a98a8;box-shadow:none}
.boss-hud{pointer-events:none}
.boss-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}
.boss-heading .kg-icon{width:18px;height:18px;color:#ffb0a0;vertical-align:-4px}
.boss-track .boss-marker{background:#ffe0b1}
.battle-sheet-heading{display:flex;align-items:center;gap:10px;padding-right:35px}
.battle-sheet-heading h2{margin:0;font-size:18px;line-height:1.2}.battle-sheet-heading h2 small{font:800 11px 'Segoe UI',sans-serif;color:var(--kg-gold-light);white-space:nowrap}
.battle-sheet-icon{display:grid;place-items:center;width:42px;height:42px;flex:none;border:1px solid var(--kg-gold-light);border-radius:10px;background:#1b416d;color:var(--kg-gold-light)}
.battle-sheet-icon .kg-icon{width:28px;height:28px}
.battle-sheet-icon img{width:100%;height:100%;object-fit:cover;border-radius:8px}.battle-sheet-icon.enemy{color:#ffafa7;border-color:#e69598;background:#563249}
.battle-traits{display:flex;gap:5px;flex-wrap:wrap}.battle-traits span{display:inline-flex;align-items:center;gap:3px;padding:3px 6px;border:1px solid #b47d88;border-radius:6px;background:#51334c;color:#ffe0dd;font-size:11px;text-transform:capitalize}.battle-traits .kg-icon{width:15px;height:15px}
.battle-sheet-stats{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:9px 0}
.battle-sheet-stats>span,.battle-sheet-stats>label{display:flex;align-items:center;gap:5px;min-height:31px;padding:4px 7px;border:1px solid #6387b0;border-radius:7px;background:#173557;color:#c9d9eb;font-size:11px;font-weight:900;white-space:nowrap}
.battle-sheet-stats b{color:#fff2bd;font-size:13px}
.battle-sheet-stats select{min-height:27px;border:0;background:#254c7a;color:#fff4d7;font-size:12px;font-weight:900}
.battle-sheet-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.battle-sheet-actions button{min-height:44px;margin:0;font-size:12px;padding:8px 11px}
.battle-sheet-actions .evolve-button{background:linear-gradient(#f8e4a3,#b28d4c);border-color:#fff1c1}
.battle-sheet-actions .battle-sell{margin-left:auto;background:#703c4a;border-color:#ed9d9a;color:#fff2e6}
.battle-sheet-more{margin-top:8px;border-top:1px solid #82a6c977;padding-top:5px}
.battle-sheet-more summary{cursor:pointer;color:#d3e6ff;font-size:12px;font-weight:800;min-height:27px}
.battle-sheet-more-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 14px;font-size:12px}
.battle-sheet-more-grid span{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid #ffffff1f}.battle-sheet-more-grid b{color:#fff2c8}
.side-panel:has(.choice-row) .panel-close{z-index:2}
.side-panel:has(.choice-row) .choice-row .info-button{min-width:34px;min-height:34px}
.upgrade-modal{max-width:min(920px,calc(100vw - 16px))}
.upgrade-card{background:linear-gradient(#315b88,#1b3558)}
.upgrade-card .upgrade-category{color:#c8ddec;font-size:11px}
.upgrade-footer [data-upgrade-skip]{color:#c9dcee}
.overlay-card:has(.result-grid){width:min(650px,calc(100vw - 20px))}
.overlay-card:has(.result-grid) .best-tower{font-size:12px;line-height:1.35}
.overlay-card:has(.result-grid) .run-build{max-height:80px;overflow:auto}
.wave-banner{font-size:clamp(16px,2vw,26px);max-width:80%;text-align:center;white-space:normal}
.next-wave-card{background:#15385fe8;border-color:var(--kg-gold-light)}
.next-wave-card span[title]{display:inline-block;margin:2px 3px;padding:2px 4px;background:#24476e;border-radius:4px}
.next-wave-card span[title] .kg-icon,.wave-preview span[title] .kg-icon{width:15px;height:15px;vertical-align:-3px;color:#ffc9ae}
.next-wave-card span[title] b,.wave-preview span[title] b{font-size:10px;color:#fff3d0}
.mode-battle-badge{align-self:center;white-space:nowrap;font-size:10px;min-height:25px}
.game-toast{pointer-events:none}
body.battle-targeting .battlefield{cursor:crosshair}
body.battle-targeting .hero-skills button.targeting small{color:#c7efff}
body.battle-ui-debug .topbar,body.battle-ui-debug .bottom-bar,body.battle-ui-debug .battlefield,body.battle-ui-debug .side-panel{outline:2px dashed #00f4ff;outline-offset:-2px}
body.battle-ui-debug button{outline:1px dashed #ffe164;outline-offset:-2px}
body.battle-ui-debug .app:after{content:'SAFE AREAS';position:fixed;z-index:29;inset:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);border:2px dotted #ff6a9c;pointer-events:none;color:#ffb6d0;font-size:10px}
.reduced-motion .resource.gold-error,.reduced-motion .hero-hud.hero-low-hp{animation:none}

@media(max-height:500px) and (orientation:landscape){
  .app{height:100dvh;min-height:0;overflow:hidden}
  .topbar{height:54px;min-height:54px;flex:none;gap:6px;padding:3px max(8px,env(safe-area-inset-right)) 3px max(8px,env(safe-area-inset-left))}
  .brand{display:none}.resources{display:flex;flex:1;justify-content:flex-start;gap:5px;min-width:0}
  .resource{height:45px;min-height:45px;min-width:70px;padding:2px 6px}.resource strong{font-size:15px}.resource .kg-icon{width:23px;height:23px}.resource small{font-size:10px}
  #maxLives{display:none}
  .resource.wave{min-width:88px}.resource.mode-score{min-width:64px}
  .top-actions{display:flex;gap:4px;flex:none}.top-actions .icon-button{min-width:48px;width:48px;height:48px;padding:0;font-size:17px}
  #synergiesBtn,#settingsBtn{display:none}
  .game-shell{flex:1;min-height:0;padding:3px 5px;align-items:center;justify-content:center;overflow:visible}
  .battlefield{width:min(calc((100dvh - 128px)*1.765),calc(100vw - 288px));max-width:none;max-height:100%;flex:none;border-width:3px;border-radius:11px;overflow:visible}
  .battlefield canvas{border-radius:8px}
  .bottom-bar{height:68px;min-height:68px;flex:none;display:flex;align-items:center;justify-content:center;gap:0;padding:4px max(8px,env(safe-area-inset-right)) calc(4px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));overflow:hidden}
  .map-name{display:none}.tower-legend{width:100%;max-width:650px;display:flex;justify-content:flex-start;gap:5px;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;scrollbar-width:thin}
  .tower-legend button{flex:0 0 69px;min-width:69px;min-height:54px;padding:3px 4px;font-size:15px}.tower-legend button em{display:none}.tower-legend button b{font-size:11px}
  .hero-skills{position:fixed;z-index:5;right:max(8px,env(safe-area-inset-right));bottom:calc(74px + env(safe-area-inset-bottom));width:166px;height:116px;display:grid;grid-template-columns:repeat(3,50px);grid-template-rows:58px 50px;justify-content:end;align-content:end;gap:4px;margin:0}
  .hero-skills button{position:relative;width:50px;min-width:50px;height:50px;min-height:50px;padding:1px}
  .hero-skills button:nth-child(1){grid-row:2;grid-column:1}.hero-skills button:nth-child(2){grid-row:2;grid-column:2}.hero-skills button:nth-child(3){grid-row:2;grid-column:3}
  .hero-skills button.ultimate-button{grid-row:1;grid-column:3;width:58px;height:58px;min-height:58px;justify-self:end;border-radius:50%}
  .hero-skills button .kg-icon{width:23px;height:23px}.hero-skills button.ultimate-button .kg-icon{width:27px;height:27px}
  .hero-skills button small{font-size:9px}.hero-skills button kbd{display:none}
  .hero-hud{position:absolute;left:auto;right:calc(100% + 7px);top:14px;bottom:auto;width:100px;min-height:92px;padding:5px;display:grid;grid-template-columns:28px 1fr;gap:3px;align-items:center;border-radius:10px}
  .hero-portrait{width:28px;height:28px;flex-basis:28px;grid-row:1}
  .hero-hud-details{grid-column:1/-1;min-width:0}.hero-hud-details strong{font-size:11px}.hero-hud-details small{font-size:10px;line-height:1.1;white-space:normal;overflow:visible}
  .hero-bar{height:5px}
  .wave-controls{position:fixed;z-index:4;left:max(8px,env(safe-area-inset-left));bottom:calc(77px + env(safe-area-inset-bottom));width:155px;display:grid;gap:3px;justify-items:start;margin:0}
  .wave-controls>span{font-size:12px}.wave-controls .wave-preview{display:none}.wave-controls .primary-button{min-height:44px;font-size:12px;padding:6px 10px}
  .next-wave-card{top:4px;left:auto;right:4px;width:145px;max-width:145px;padding:5px 7px}.next-wave-card strong{font-size:11px}.next-wave-card small{font-size:10px}
  .boss-hud{top:3px;left:50%;transform:translateX(-50%);width:min(440px,80%);max-width:80%;padding:3px 7px;border-width:1px}.boss-heading{font-size:11px}.boss-heading span:last-child{font-size:10px}.boss-track{height:9px;margin-top:3px}
  .wave-banner{top:25%;font-size:17px;padding:5px 10px}
  .side-panel{position:fixed;z-index:7;left:max(7px,env(safe-area-inset-left));right:auto;top:auto;bottom:calc(70px + env(safe-area-inset-bottom));width:min(590px,calc(100vw - 190px));height:auto;min-height:0;max-height:min(184px,calc(100dvh - 126px));overflow:auto;padding:8px 11px;border-radius:13px 13px 7px 7px}
  .side-panel h2{font-size:16px;margin:2px 0}.side-panel .panel-copy,.side-panel .panel-hint{font-size:11px;margin:3px 0}
  .side-panel .panel-close{top:2px;right:3px;min-width:42px;min-height:42px}
  .side-panel:has(.choice-row){display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px 4px}
  .side-panel:has(.choice-row)>.panel-kicker,.side-panel:has(.choice-row)>h2,.side-panel:has(.choice-row)>.panel-copy,.side-panel:has(.choice-row)>.panel-hint{grid-column:1/-1}
  .side-panel:has(.choice-row)>.panel-copy{display:none}
  .side-panel:has(.choice-row) .choice-row{width:auto;min-width:0;margin:0;display:block}
  .side-panel:has(.choice-row) .tower-choice{width:100%;height:67px;min-height:67px;margin:0;padding:3px;display:grid;justify-items:center;align-content:center;gap:1px}
  .side-panel:has(.choice-row) .choice-icon .kg-icon{width:22px;height:22px}.side-panel:has(.choice-row) .choice-text{display:none}.side-panel:has(.choice-row) .tower-choice b{font-size:10px}
  .side-panel:has(.choice-row) .info-button{display:none}
  .side-panel:has(.choice-row)>.panel-hint{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .battle-sheet-stats{gap:4px;margin:4px 0}.battle-sheet-stats>span,.battle-sheet-stats>label{min-height:27px;font-size:10px;padding:2px 5px}.battle-sheet-stats b{font-size:11px}.battle-sheet-stats select{min-height:24px}
  .battle-sheet-actions{gap:5px}.battle-sheet-actions button{min-height:44px;font-size:11px;padding:5px 8px}.battle-sheet-more{margin-top:4px}
  .app:has(.side-panel:not(.hidden)) .wave-controls{display:none}
  .upgrade-modal{padding:6px 9px;max-height:calc(100dvh - 8px)}.upgrade-card{min-height:164px;padding:6px;gap:2px}.upgrade-cards{gap:6px}.upgrade-card-actions button{min-height:44px}
  .upgrade-card .upgrade-category{font-size:10px}.upgrade-rarity{font-size:11px}
  .upgrade-overlay[data-view="history"]{place-items:end center;padding:0 8px calc(70px + env(safe-area-inset-bottom))}
  .upgrade-overlay[data-view="history"] .upgrade-modal{width:min(620px,100%);max-height:50dvh;border-radius:16px}
}

@media(min-width:1200px){
  .side-panel{width:300px;flex-basis:300px;padding:18px}
  .battle-sheet-actions button{flex:1}.battle-sheet-actions .battle-sell{flex:0 0 80px}
  .hero-skills button{width:58px;min-height:58px}.hero-skills button.ultimate-button{width:64px;min-height:64px}
}
@media(max-width:700px) and (orientation:portrait){
  .side-panel{position:fixed;left:5px;right:5px;bottom:calc(134px + env(safe-area-inset-bottom));top:auto;width:auto;height:auto;max-height:min(43dvh,270px);overflow:auto;z-index:8}
  .battle-sheet-actions button{flex:1}.battle-sheet-actions .battle-sell{flex:0 0 72px}
}
@media(prefers-reduced-motion:reduce){.resource.gold-error,.hero-hud.hero-low-hp{animation:none}}