/* A: controls occupy their own rails; the playable canvas starts below them. */
body.framed-ui{--rail-top:calc(60px + env(safe-area-inset-top));--rail-bottom:calc(72px + env(safe-area-inset-bottom));background:#344e3e}
.framed-ui .board{top:var(--rail-top);bottom:var(--rail-bottom);left:4px;right:4px;border:2px solid #839366;overflow:hidden}
.framed-ui .hud{top:0;left:0;right:0;height:var(--rail-top);max-width:none;padding:calc(8px + env(safe-area-inset-top)) 70px 8px 16px;gap:24px;border:0;border-bottom:4px solid #a69a70;border-radius:0;background:#eadcb1;box-shadow:inset 0 2px #fff4cf;backdrop-filter:none}
.framed-ui .hud-brand{display:none}.framed-ui .hud .vital-stat,.framed-ui .hud .wave-stat{gap:8px}.framed-ui .hud strong{font:700 17px 'Courier New',monospace}.framed-ui .hud small{font-size:10px}.framed-ui .hud .life-track{display:none}.framed-ui .hud .stat-symbol svg{width:21px;height:21px}
.framed-ui .game-menu{top:calc(8px + env(safe-area-inset-top));right:12px}.framed-ui .game-menu>summary{width:40px;height:40px;border-radius:0;border:2px solid #8d8053;background:#eadcb1;box-shadow:inset -3px -3px #b4a377,inset 2px 2px #fff5cc,2px 2px #213e31;font:24px 'Courier New',monospace}
.framed-ui .wave-controls{left:0;right:0;bottom:0;transform:none;width:100%;height:var(--rail-bottom);padding:8px 12px calc(8px + env(safe-area-inset-bottom));display:flex;justify-content:center;gap:14px;background:#344e3e;border:0;border-top:4px solid #afac7b;border-radius:0;box-shadow:none}
.framed-ui .wave-status,.framed-ui #notice,.framed-ui #mobile-help{display:none!important}.framed-ui .wave-buttons{display:flex;gap:14px;width:auto}.framed-ui .playback{top:auto;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));padding:0;background:none;border:0;border-radius:0;box-shadow:none;gap:8px}.framed-ui .playback #pause{display:grid}
.framed-ui .wave-controls #build-mode,.framed-ui .wave-controls #start,.framed-ui .wave-controls #wave-preview,.framed-ui .playback button{position:relative;display:grid;place-items:center;width:44px;min-width:44px;height:44px;min-height:44px;padding:8px;border:2px solid #8d8053;border-radius:0;background:#eadcb1;color:#294c40;box-shadow:inset -3px -3px #b4a377,inset 2px 2px #fff5cc,2px 2px #213e31}
.framed-ui .wave-controls #start{width:50px;height:50px;background:#d5b96d;border-color:#a69159}.framed-ui .wave-controls svg{width:24px;height:24px;shape-rendering:crispEdges}.framed-ui #build-mode small{display:none}.framed-ui #build-mode.unavailable{display:none}.framed-ui #build-mode strong{position:absolute;right:-5px;top:-5px;background:#d9bc74;color:#294c40;border:2px solid #685d36;border-radius:0;min-width:19px;height:20px;padding:0 2px;font:700 11px/16px 'Courier New',monospace}.framed-ui #build-mode[aria-pressed=true]{background:#a8c3a0;box-shadow:inset 2px 2px #6d8866}.framed-ui .game-menu>.menu-panel{top:var(--rail-top)}
@media(max-width:420px){.framed-ui .hud{gap:18px;padding-left:12px}.framed-ui .hud strong{font-size:15px}.framed-ui .wave-controls{justify-content:flex-start;padding-left:14px;gap:12px}.framed-ui .wave-buttons{gap:12px}.framed-ui .playback{right:12px}}
@media(orientation:landscape) and (max-height:500px){body.framed-ui{--rail-top:48px;--rail-bottom:60px}.framed-ui .hud{padding:3px 65px 3px 14px}.framed-ui .hud small{display:none}.framed-ui .game-menu{top:4px}.framed-ui .wave-controls{padding-top:5px;padding-bottom:5px}.framed-ui .playback{bottom:8px}.framed-ui .wave-controls #start{height:44px;width:44px}}

/* Local confirmation follows the preview, keeping the sprite clear. */
#build-panel.confirm-placement{display:flex;align-items:center;gap:8px;padding:0;background:transparent;border:0;box-shadow:none;overflow:visible;max-height:none!important}
#build-panel.confirm-placement #tower-shop{display:flex;gap:0}
#build-panel.confirm-placement .build-icon[hidden]{display:none!important}
#build-panel.confirm-placement #close-shop{display:grid!important;position:static;width:52px;min-width:52px;height:52px;min-height:52px;padding:0;place-items:center;border-radius:50%;background:#eee6c9;color:#975b48;border:2px solid #9f8e70;box-shadow:0 3px 7px #203c3540;font:26px 'Trebuchet MS',sans-serif}
#build-panel.confirm-placement .build-icon{width:52px;min-width:52px;height:52px;padding:6px}

#build-panel[hidden]{display:none!important}

#build-panel.type-selection{transform:translate(-50%,-50%);width:min(760px,calc(100vw - 32px));padding:24px;background:#f5ebd0;border:3px solid #8c9872;border-radius:4px;box-shadow:0 0 0 100vmax #203d3580,5px 5px 0 #344e3e;overflow:auto;z-index:5}
#build-panel.type-selection #build-title{position:static;width:auto;height:auto;clip:auto;clip-path:none;white-space:normal;overflow:visible;text-align:center;margin:0 0 20px;font:700 24px 'Courier New',monospace}
#build-panel.type-selection #tower-shop{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}
.build-option{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0}.build-option[hidden]{display:none!important}
#build-panel.type-selection .build-option{padding:14px;background:#e4e6c6;border:2px solid #a1ac82}
#build-panel.type-selection .build-icon{width:100%;height:130px;min-width:0;background:#d4ddba;border:0;border-radius:0;box-shadow:none;padding:12px}
#build-panel.type-selection .build-icon img{width:88px;height:104px;object-fit:contain}
.build-name{font:700 15px 'Courier New',monospace;text-align:center;color:#294f40}.build-details{padding:7px 12px;min-height:40px;font-size:13px;background:#f5ebd0;border:1px solid #94a17b;box-shadow:none}
#build-panel.confirm-placement{transform:none}#build-panel.confirm-placement .build-name,#build-panel.confirm-placement .build-details{display:none}
#build-info{z-index:7}#build-info:has(#close-build-details){transform:translate(-50%,-50%);width:min(430px,calc(100vw - 32px));padding:24px;background:#f5ebd0;border:3px solid #8c9872;box-shadow:0 0 0 100vmax #203d3580;max-height:calc(100dvh - 150px);overflow:auto;display:block}
#build-info[hidden]{display:none!important}#close-build-details{position:absolute;right:8px;top:8px;background:transparent;border:0;box-shadow:none}#build-info>img{width:90px;height:110px;object-fit:contain;display:block;margin:0 auto 16px}#build-info strong{font-size:20px}#build-info .hold-hint:empty{display:none}
@media(max-width:420px){#build-panel.type-selection{padding:18px 12px}#build-panel.type-selection #tower-shop{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#build-panel.type-selection .build-option{padding:10px}#build-panel.type-selection .build-icon{height:112px}#build-panel.type-selection .build-icon img{width:76px;height:94px}}
#build-panel.type-selection{display:block}#build-panel.type-selection #tower-shop{width:100%;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
@media(max-width:420px){#build-panel.type-selection #tower-shop{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hero-selection>.modal{width:min(1000px,100%);padding:24px}.hero-selection #choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.hero-card{display:flex;flex-direction:column;align-items:center;text-align:left;padding:14px;background:#e7e5c7;border:2px solid #9caa7c;border-radius:3px;box-shadow:3px 3px #53694840;color:#294f40;min-width:0}.hero-card:hover{background:#f4ebd0;border-color:#557d61}.hero-card img{width:100%;height:190px;object-fit:contain;image-rendering:pixelated;margin-bottom:12px;background:#d4ddba}.hero-card strong{font:700 20px 'Courier New',monospace;align-self:flex-start}.hero-card p{font-size:13px;line-height:1.5;margin:10px 0;flex:1;color:#52674c}.hero-card small{font-size:11px;line-height:1.5;color:#647653;align-self:flex-start}.hero-select{display:block;background:#365d49;color:#f8edcc;padding:10px;margin-top:16px;text-align:center;width:100%;font-weight:bold}.hero-selection .modal-symbol{display:none}#menu-hero{display:flex;gap:12px;padding-bottom:16px;margin-bottom:18px;border-bottom:2px solid #b9c2a0}#menu-hero[hidden]{display:none}#menu-hero img{width:78px;height:104px;object-fit:contain;image-rendering:pixelated}#menu-hero p{margin:6px 0;font-size:12px}#menu-hero small{font-size:10px}
@media(max-width:650px){.hero-selection>.modal{padding:16px}.hero-selection #choices{grid-template-columns:1fr;gap:12px}.hero-card{display:grid;grid-template-columns:90px 1fr;gap:8px 14px;align-items:start}.hero-card img{grid-column:1;grid-row:1/5;width:90px;height:130px;margin:0}.hero-card strong{font-size:17px}.hero-card p{margin:0;font-size:12px}.hero-card small{grid-column:2}.hero-select{grid-column:2;margin:0;padding:8px}}

.active-synergies button{position:relative}.synergy-stacks{position:absolute;right:-3px;bottom:-3px;background:#f1dfaa;color:#294f40;font:700 11px monospace;padding:1px 3px;border:1px solid #8b9a70}

.hero-selection #choices:has([data-evolve]){grid-template-columns:repeat(2,minmax(0,1fr))}#build-panel.type-selection .build-icon .upgrade-icon{width:88px;height:104px}@media(max-width:650px){.hero-selection #choices:has([data-evolve]){grid-template-columns:1fr}}

.build-name small{font-size:11px;color:#617f50}

.hero-power-symbol{display:grid;place-items:center;width:100%;height:150px;margin-bottom:12px;background:#d4ddba}.hero-power-symbol .upgrade-icon{width:100px;height:100px}@media(max-width:650px){.hero-power-symbol{grid-column:1;grid-row:1/5;width:90px;height:130px}.hero-power-symbol .upgrade-icon{width:70px;height:70px}}

.framed-ui .playback,.framed-ui #wave-preview{display:none!important}.tempo-choice{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:16px 0;font-size:14px}.tempo-choice select{font:inherit;padding:10px 20px;border:2px solid #9da681;background:#eee6c9;color:#294f40;min-height:44px}.framed-ui #start{touch-action:manipulation;-webkit-touch-callout:none;user-select:none}.framed-ui #start.holding{box-shadow:inset 0 -4px #71986b,inset 2px 2px #fff5cc,2px 2px #213e31}
