/* Phase 7.7 viewport and control sizes. Earlier art styles remain unchanged. */
:root{
  --kg-hud-height:76px;
  --kg-tower-bar-height:86px;
  --kg-hud-button:46px;
  --kg-build-button:44px;
  --kg-skill-button:58px;
  --kg-panel-padding:18px;
  --kg-modal-width:900px;
  --kg-sheet-height:43dvh;
}
.app{min-height:100vh;min-height:100dvh}
.tower-legend,.upgrade-cards{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.upgrade-modal{max-width:var(--kg-modal-width)}
.side-panel{padding:var(--kg-panel-padding)}
@media(min-width:1200px){
  .battlefield{width:min(100%,1200px,calc((100dvh - 206px)*1.765))}
}
@media(max-height:500px) and (orientation:landscape){
  :root{--kg-hud-height:54px;--kg-tower-bar-height:68px;--kg-hud-button:48px;--kg-build-button:54px;--kg-skill-button:50px;--kg-panel-padding:8px;--kg-sheet-height:184px}
  .app{height:100vh;height:100dvh;min-height:0}
  .topbar{height:calc(var(--kg-hud-height) + env(safe-area-inset-top));min-height:calc(var(--kg-hud-height) + env(safe-area-inset-top));padding-top:calc(3px + env(safe-area-inset-top))}
  .bottom-bar{height:calc(var(--kg-tower-bar-height) + env(safe-area-inset-bottom));min-height:calc(var(--kg-tower-bar-height) + env(safe-area-inset-bottom))}
  .battlefield{width:min(calc((100dvh - 128px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*1.765),calc(100vw - 288px))}
  .top-actions .icon-button{min-width:var(--kg-hud-button);width:var(--kg-hud-button);height:var(--kg-hud-button)}
  .tower-legend button{min-height:var(--kg-build-button)}
  .hero-skills{width:156px;gap:3px}
  .hero-skills button{width:var(--kg-skill-button);min-width:var(--kg-skill-button);height:var(--kg-skill-button);min-height:var(--kg-skill-button)}
  .side-panel{max-height:min(var(--kg-sheet-height),calc(100dvh - 126px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));padding:var(--kg-panel-padding) 11px}
  .side-panel:has(.choice-row){left:0;right:0;bottom:0;width:100%;max-width:none;height:calc(var(--kg-tower-bar-height) + env(safe-area-inset-bottom));min-height:0;max-height:none;display:flex;align-items:center;justify-content:center;gap:5px;padding:3px max(8px,env(safe-area-inset-right)) calc(3px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));border-radius:0;overflow-x:auto;overflow-y:hidden}
  .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{display:none}
  .side-panel:has(.choice-row) .choice-row{flex:0 0 69px;width:69px;min-width:69px;margin:0}
  .side-panel:has(.choice-row) .tower-choice{height:54px;min-height:54px}
  .side-panel:has(.choice-row) .panel-close{position:static;order:10;flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;padding:0}
  .side-panel:has(.battle-sheet-actions):not(:has(.choice-row)){left:0;right:0;bottom:0;width:100%;max-width:none;height:auto;max-height:150px;display:grid;grid-template-columns:minmax(150px,175px) minmax(0,1fr) minmax(175px,205px) 44px;grid-template-rows:auto auto;gap:3px 6px;align-items:center;padding:7px max(8px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));border-radius:0}
  .side-panel:has(.battle-sheet-actions) .battle-sheet-heading{grid-column:1;grid-row:1;padding-right:0}
  .side-panel:has(.battle-sheet-actions) .battle-sheet-stats{grid-column:2;grid-row:1;margin:0}
  .side-panel:has(.battle-sheet-actions) .battle-sheet-actions{grid-column:3;grid-row:1}
  .side-panel:has(.battle-sheet-actions) .battle-sheet-actions button{min-height:44px;font-size:10px;padding:4px 5px}
  .side-panel:has(.battle-sheet-actions) .battle-sheet-more{grid-column:1/-1;grid-row:2;margin:0}
  .side-panel:has(.battle-sheet-actions) .panel-close{position:static;grid-column:4;grid-row:1;width:44px;height:44px;min-width:44px;min-height:44px;padding:0}
  .overlay-card{max-height:calc(100dvh - 12px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
}
@media(max-width:760px) and (orientation:portrait){
  .menu-content{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
  .kingdom-header,.world-header{padding-top:max(7px,env(safe-area-inset-top))}
  .kingdom-scroll,.world-scroll{scroll-padding-bottom:calc(24px + env(safe-area-inset-bottom))}
  .side-panel{max-height:min(var(--kg-sheet-height),270px)}
}
/* Tower atelier: shared battlefield portraits, inset enamel, clear purchase prices. */
.choice-icon:has(.tower-portrait){width:62px;height:62px;flex:0 0 62px;display:grid;place-items:center;border:1px solid #cda86655;border-radius:12px;background:radial-gradient(ellipse at 50% 70%,#47628c88,#142740 75%);box-shadow:inset 0 1px #ffffff15}
.tower-portrait{display:block;width:72px;height:72px;object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 2px #0005)}
.choice-row .tower-choice{background:linear-gradient(115deg,#263f61,#162a44);border-color:#829bc13d;gap:10px;padding:6px 9px;min-height:76px;box-shadow:inset 0 1px #ffffff0c,0 3px 8px #0002}
.choice-row .tower-choice:hover:not(:disabled),.choice-row .tower-choice:focus-visible{border-color:#edcd8a;background:linear-gradient(115deg,#385579,#203953)}
.choice-row .choice-text strong{color:#fff0d3;letter-spacing:.02em}.choice-row .choice-text small{color:#c4d2e4;line-height:1.35}
.choice-row .tower-choice>b{color:#ffe1a0;white-space:nowrap;font-variant-numeric:tabular-nums}
.choice-row .restricted .tower-portrait{filter:grayscale(1);opacity:.5}
@media(max-width:900px) and (orientation:landscape){
 .side-panel:has(.choice-row) .choice-icon:has(.tower-portrait){width:40px;height:34px;flex-basis:34px;border:0;background:none;box-shadow:none}
 .side-panel:has(.choice-row) .tower-portrait{width:45px;height:45px;margin-top:-7px}
 .side-panel:has(.choice-row) .tower-choice{min-height:54px;padding:2px;gap:0}
}
@media(max-width:600px) and (orientation:portrait){
 .choice-row .tower-choice{min-height:65px;padding:4px 7px;gap:7px}.choice-icon:has(.tower-portrait){width:48px;height:48px;flex-basis:48px}.tower-portrait{width:58px;height:58px}
}
.tower-legend button .tower-portrait{width:39px;height:35px;margin:-4px 0 -1px}.tower-legend button.unaffordable .tower-portrait{filter:grayscale(.75);opacity:.65}
@media(min-width:901px){.tower-legend button .tower-portrait{width:46px;height:40px}.tower-legend button{background:linear-gradient(#294260,#192e47);border-color:#c6ac714d}}
/* Archive portraits share the battlefield's actual character artwork. */
.unit-portrait{display:block;width:76px;height:76px;object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 2px #0005)}
.collection-card>b:has(.unit-portrait),.bestiary-entry>span:has(.unit-portrait){width:80px;min-width:80px;height:80px;display:grid;place-items:center;border:1px solid #c5aa6b55;border-radius:12px;background:radial-gradient(ellipse at 50% 60%,#52678288,#15263b 78%);box-shadow:inset 0 1px #ffffff17}
@media(max-width:600px){.unit-portrait{width:62px;height:62px}.collection-card>b:has(.unit-portrait),.bestiary-entry>span:has(.unit-portrait){width:64px;min-width:64px;height:64px}}
