/* Compact HUD: separate map, navigation and transport lanes. */
#mobile-army{display:none}
.army-body{display:contents}
.action-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;min-width:0}
/* Army controls stay left; base actions stay right, outside the army scroll area. */
@media(min-width:901px){
  .field-actions{left:14px;right:14px;top:auto;bottom:calc(var(--transport-height,73px) + 12px);display:flex;justify-content:space-between;gap:24px;pointer-events:none}
  .field-actions .action-group{grid-template-columns:repeat(3,64px);gap:6px;padding:6px;background:#393426ee;border:1px solid #b8a46b66;border-radius:8px;pointer-events:auto}
  .field-actions button{width:64px;height:58px;min-height:44px;border-radius:6px;border-width:1px;padding:3px;gap:2px;flex-direction:column;font-size:24px;line-height:28px}
  .field-actions img{width:28px;height:28px}.field-actions span{display:block;position:static;opacity:1;background:none;padding:0;font-size:10px;line-height:16px}
  .squad-panel{top:110px;bottom:calc(var(--transport-height,73px) + var(--actions-height,130px) + 24px);max-height:none;overflow:hidden}
  .squad-title{flex-shrink:0}.army-body{display:block;min-height:0;flex:1;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain}
  #squads{overflow:visible;min-height:0}.unit-commands{flex-shrink:0}.unit-commands button{min-height:44px}
  .hint{left:242px;right:242px;transform:none;width:auto;max-width:none;bottom:calc(var(--transport-height,73px) + 12px)}
}
@media(max-width:900px){
  #battlefield{--hud-height:94px;--transport-height:60px;--message-height:0px;--nav-height:60px;--map-tools-height:52px;--map-top:calc(var(--hud-height) + var(--message-height) + var(--map-tools-height));--map-bottom:calc(var(--transport-height) + var(--nav-height))}
  #map{position:absolute;top:var(--map-top);left:0;width:100%;height:calc(100% - var(--map-top) - var(--map-bottom));min-height:1px}
  .top-hud{top:0;padding-top:env(safe-area-inset-top,0px);background:#302c21}
  .top-line{height:46px;padding:0 max(6px,env(safe-area-inset-right)) 0 max(6px,env(safe-area-inset-left));gap:6px}
  .top-line h1{font-size:13px;letter-spacing:1px}.top-line h1 span{display:none!important}
  .top-line button{width:44px;height:44px;min-height:44px;flex-shrink:0}
  #play-mode{height:44px;min-height:44px;max-width:100px;font-size:12px}
  .scoreboard{height:48px;max-width:none;width:100%}.score{min-width:0;min-height:44px;padding:4px 6px;gap:4px;flex-wrap:wrap}
  .score b{font-size:16px}.score span,.score small{font-size:9px;letter-spacing:0}.battle-time{width:70px}.battle-time b{font-size:20px}
  .transport{height:auto;min-height:60px;padding:8px max(6px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left));gap:5px;z-index:8}
  .transport button,.transport select{min-height:44px;height:44px;font-size:12px;padding:6px;min-width:0}
  .transport .play{flex:1;min-width:88px}.transport #reset{min-width:54px;font-size:12px}.transport #save{font-size:11px;padding:6px}
  .transport select{width:52px;max-width:none}.transport .elapsed{display:none}.speed-label{flex-shrink:0}
  .field-actions{left:0;right:0;top:auto;bottom:var(--transport-height);height:var(--nav-height);display:flex;justify-content:space-between;gap:12px;padding:4px max(6px,env(safe-area-inset-right)) 4px max(6px,env(safe-area-inset-left));background:#393426;border-top:1px solid #b8a46b66;z-index:8}
  .field-actions .action-group{width:calc((100% - 12px)/2);max-width:210px}
  .field-actions #mobile-army,.field-actions #move-base{display:flex}.field-actions #formation{display:none}
  .field-actions button{width:100%;height:52px;min-height:44px;padding:3px 1px;gap:1px;border:1px solid #b8a46b66;border-radius:6px;box-shadow:none;flex-direction:column;font-size:23px;line-height:26px}
  .field-actions button[aria-expanded=true]{border-color:#ffe09a;background:#6a603b}
  .field-actions img{width:25px;height:26px}.field-actions span{display:block;position:static;opacity:1;background:none;padding:0;font-size:9px;line-height:16px;white-space:nowrap;color:#fff0c8}
  .minimap-panel{top:calc(var(--hud-height) + var(--message-height));left:0;right:0;width:auto;height:var(--map-tools-height);display:flex;gap:8px;padding:4px max(8px,env(safe-area-inset-right)) 4px max(8px,env(safe-area-inset-left));background:#403925;z-index:3}
  #minimap{display:none}.minimap-panel #overview{width:auto;flex:1;min-height:44px;height:44px;padding:4px 10px;border:1px solid #b3975c;border-radius:5px;box-shadow:none}
  #overview span{font-size:12px;line-height:24px}.zoom{margin:0;gap:4px;background:none;flex:0 0 152px}
  .zoom button{min-width:44px;min-height:44px;height:44px;padding:0;border-radius:5px;font-size:23px}
  .hint{display:none}
  #battle-announcements,#toast{top:calc(var(--hud-height) + 4px);bottom:auto;left:8px;right:8px;width:auto;max-width:none;transform:none;margin:0;padding:6px 10px;max-height:68px;overflow:hidden;font-size:12px;line-height:16px;z-index:4;box-shadow:none}
  #battle-announcements small{display:none}#battle-announcements p{margin:0;font-size:12px;line-height:17px}.has-toast #battle-announcements{display:none}
  .squad-panel{display:none;top:auto;left:8px;right:8px;bottom:calc(var(--map-bottom) + 6px);width:auto;max-height:calc(100dvh - var(--map-top) - var(--map-bottom) - 12px);overflow:hidden;overscroll-behavior:contain;background:#363123fa;border:1px solid #d7bc7f;border-radius:9px;padding:8px;z-index:6;box-shadow:0 0 18px #0005}
  .army-open .squad-panel{display:flex}.army-body{display:block;overflow:auto;overscroll-behavior:contain;min-height:0;scrollbar-width:thin;scroll-padding:5px}
  .squad-title{position:static;min-height:44px;height:44px;font-size:13px;background:#51472e;border:0;flex-shrink:0}
  .squad-title #squad-toggle{width:44px;height:44px;min-height:44px;font-size:24px}.squad-panel #base-picker{min-height:44px;height:44px;font-size:12px;margin-top:4px}
  .deploy-button{min-height:44px;height:auto;font-size:13px;padding:8px;margin:4px 0}
  #teleport-status{font-size:11px;line-height:16px;padding:4px 5px 8px;margin:0 0 5px}
  .army-summary{grid-template-columns:repeat(4,minmax(0,1fr));padding:7px;gap:4px;font-size:10px}.army-summary b{font-size:13px}.army-summary small{display:block;font-size:10px;grid-column:1/-1}
  #squads{overflow:visible;flex-shrink:0;min-height:0;gap:5px}.squad-card{min-height:62px;padding:5px;gap:8px}.squad-card img{width:40px;height:44px}.squad-card strong{font-size:12px}.squad-card small,.squad-card em{font-size:11px}
  .unit-commands{position:static;margin:5px -2px -2px;padding:5px 2px;background:#363123;gap:6px;flex-shrink:0}.unit-commands button{min-height:44px;font-size:13px}
  .selection{top:auto;bottom:calc(var(--map-bottom) + 6px);left:8px;right:8px;transform:none;width:auto;max-width:none;max-height:calc(100dvh - var(--map-top) - var(--map-bottom) - 12px);padding:12px;z-index:6;overscroll-behavior:contain;border-radius:9px;background:#383124fa}
  .selection .close{min-height:44px;width:44px;margin:-8px -8px 0 4px;top:-12px;background:#4f442d}
  .selection h2{font-size:17px}.selection p{font-size:12px;line-height:1.45}.selection small{font-size:11px}
  #selection-actions button{min-height:44px;font-size:12px}.building-bonus>strong{font-size:17px}
  dialog:not(#briefing-dialog){max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 16px);overflow:auto;overscroll-behavior:contain;padding:14px;width:calc(100% - 16px)}
  .dialog-header{position:sticky;top:-14px;background:#302e25;padding:6px 0;z-index:3}.dialog-header button{height:44px;min-height:44px}.dialog-header h2{font-size:19px}
  dialog button,dialog select{min-height:44px}dialog input[type=text],dialog input[type=number]{font-size:16px}
}
@media(min-width:600px) and (max-width:900px) and (max-height:500px){
  .top-hud{display:grid;grid-template-columns:minmax(280px,1fr) minmax(300px,1fr);align-items:center}
  .top-line{height:48px}.scoreboard{height:48px}.score span{font-size:8px}
  .squad-panel,.selection{left:auto;width:360px;max-width:calc(100% - 16px)}
  .army-summary{grid-template-columns:repeat(4,1fr)}
  /* In landscape the open sheet gets its own column, not a tiny scrolling slit. */
  #battlefield:is(.army-open,.object-open) .minimap-panel{right:376px}
  #battlefield:is(.army-open,.object-open) #map{width:calc(100% - 376px)}
  #battlefield:is(.army-open,.object-open) :is(#toast,#battle-announcements){right:384px}
  .squad-panel,.selection{top:calc(var(--hud-height) + 4px);bottom:calc(var(--map-bottom) + 6px);max-height:none}
}
@media(min-width:600px) and (max-width:700px) and (max-height:500px){
  #battlefield:is(.army-open,.object-open) #overview{flex:1;min-width:44px;padding:0}
  #battlefield:is(.army-open,.object-open) #overview span{font-size:0}
  #battlefield:is(.army-open,.object-open) #overview span::after{content:'⤢';font-size:23px}
}