/* Combat uses one document scroll surface. HUD, arena and decisions keep their
   own content height; a short viewport must never shrink the arena behind the controls. */
body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])):not(.intro-101){
  height:auto!important;min-height:100dvh!important;overflow-x:hidden!important;overflow-y:auto!important;
}
body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])) main.app-shell{
  height:auto!important;min-height:calc(100dvh - 12px)!important;
}
body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])) #game-panel:not([hidden]){
  height:auto!important;min-height:0!important;flex:none!important;
}
body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])) #map-stage-page#map-stage-page#map-stage-page#map-stage-page#map-stage-page{
  display:flex!important;flex-direction:column!important;flex:none!important;height:auto!important;min-height:0!important;overflow:visible!important;
}
body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene:not([hidden]){
  display:flex!important;flex-direction:column!important;height:auto!important;min-height:0!important;flex:none!important;overflow:visible!important;
}
body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene .battle-stage{
  position:relative!important;inset:auto!important;display:flex!important;flex-direction:column!important;
  height:auto!important;min-height:0!important;flex:none!important;overflow:visible!important;
}
body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene .battle-hud-row{
  flex:none!important;max-height:none!important;overflow:visible!important;
}
body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene #battle-stage .battle-arena{
  flex:none!important;height:clamp(280px,34vh,360px)!important;min-height:280px!important;overflow:hidden;
}
body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene .event-scene-copy{
  position:relative!important;flex:none!important;min-height:0!important;max-height:none!important;overflow:visible!important;
}
body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene #combat-panel{
  position:relative!important;flex:none!important;max-height:none!important;overflow:visible!important;
}
body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene .combat-tools>summary{
  position:static!important;
}
@media(max-width:650px){
  body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene #battle-stage .battle-arena{height:260px!important;min-height:260px!important}
  body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene .battle-hud-row{padding-top:44px!important}
  body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene .floor3-control-layout .battle-hud-row{padding-top:58px!important}
}

/* Opening a modal still owns the scroll; do not move the battlefield behind it. */
body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])):has(dialog[open]){overflow:hidden!important}

@media(max-width:899px){
  body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])) .session-bar{
    display:flex!important;flex-wrap:wrap!important;box-sizing:border-box!important;
    width:100%!important;max-width:100%!important;min-width:0!important;height:auto!important;min-height:34px!important;overflow:visible!important;
  }
  body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])) .session-bar>*{min-width:0!important;max-width:100%!important;white-space:normal!important}
  body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])) .session-state{flex:1 1 100%!important;display:flex;flex-wrap:wrap;gap:6px}
  body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])) #event-team-dock{flex:1 1 140px;max-width:100%!important}
}

/* The compact header scrolls with the page instead of floating over the arena. */
body.battle-fit-117:has(#event-scene.combat-scene:not([hidden])) .hero-header{
  position:relative!important;inset:auto!important;
}
@media(max-width:899px){
  body #event-scene#event-scene#event-scene#event-scene#event-scene.combat-scene #combat-panel :is(.combat-actions,#path-combat-actions)>button{min-height:44px!important}
}
