/* =============================================================
   v24.9.1 Mobile Safe Area Fix
   - Playable route unchanged
   - Save/ranking/gacha logic untouched
   - Fixes phone bottom-nav overlap and cramped formation/list pages
   ============================================================= */
:root{
  --v2491-safe-bottom:env(safe-area-inset-bottom, 0px);
  --v2491-nav-h:64px;
  --v2491-nav-space:calc(var(--v2491-nav-h) + var(--v2491-safe-bottom) + 48px);
}
/* Use one smaller bottom navigation bar. */
#v246BottomNav,
.v246BottomNav,
.bottomNav,
.v2487BottomNav,
.bottomNavV24{
  height:60px!important;
  min-height:60px!important;
  width:min(94vw, 440px)!important;
  padding:5px 7px!important;
  bottom:calc(var(--v2491-safe-bottom) + 4px)!important;
  border-radius:18px!important;
  gap:5px!important;
  background:rgba(34,30,25,.62)!important;
  box-shadow:0 6px 20px rgba(0,0,0,.20)!important;
}
#v246BottomNav button,
.v246BottomNav button,
.bottomNav button,
.v2487BottomNav button,
.bottomNavV24 button{
  height:50px!important;
  min-height:50px!important;
  padding:2px 1px!important;
  border-radius:14px!important;
  font-size:9px!important;
  line-height:1.02!important;
}
.v246BottomNav.v2487NavLight .v2487NavIcon,
#v246BottomNav .v2487NavIcon{
  width:24px!important;
  height:24px!important;
  object-fit:contain!important;
  display:block!important;
  margin:0 auto 1px!important;
}
.v246BottomNav.v2487NavLight .v2487NavLabel,
#v246BottomNav .v2487NavLabel{
  font-size:9px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
/* Hide global nav on sub-pages that already have a back button. This immediately fixes login/gacha/highscore overlap. */
body.v2491-subnav-hidden #v246BottomNav,
body.v2491-subnav-hidden .v246BottomNav,
body.v2491-subnav-hidden .bottomNav,
body.v2491-subnav-hidden .v2487BottomNav,
body.v2491-subnav-hidden .bottomNavV24{
  display:none!important;
}
body.v2491-subnav-hidden .screen.active:not(#titleScreen):not(#gameScreen),
body.v2491-subnav-hidden .screen.active:not(#titleScreen):not(#gameScreen)>.pad{
  padding-bottom:calc(var(--v2491-safe-bottom) + 26px)!important;
}
/* Every navigated phone page gets extra scroll tail so final content is reachable above the nav/browser bar. */
.screen.active:not(#titleScreen):not(#gameScreen)::after{
  content:"";
  display:block;
  height:var(--v2491-nav-space);
  flex:0 0 auto;
}
body.v2491-subnav-hidden .screen.active:not(#titleScreen):not(#gameScreen)::after{
  height:calc(var(--v2491-safe-bottom) + 26px)!important;
}
.screen.active:not(#titleScreen):not(#gameScreen)>.pad{
  padding-bottom:var(--v2491-nav-space)!important;
}
/* Result screen has its own action buttons; no bottom nav. */
#resultScreen .pad,
#gachaScreen .pad,
#loginBonusScreen .pad,
#highScoreScreen .pad,
#missionScreen .pad,
#itemScreen .pad,
#profileScreen .pad,
#presentBoxScreen .pad,
#awakenScreen .pad,
#bossScreen .pad{
  padding-bottom:calc(var(--v2491-safe-bottom) + 28px)!important;
}
/* Stage map: reserve nav space without covering the last nodes. */
#stageMapScreen .stageMapPage{
  padding-bottom:var(--v2491-nav-space)!important;
}
#stageMapScreen .stageMapWrap{
  height:calc(100svh - 128px - var(--v2491-nav-h) - var(--v2491-safe-bottom))!important;
  min-height:420px!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
/* Sortie prep: keep fixed puzzle button readable and keep nav from stealing taps. */
#prepScreen .sortiePad{
  padding-bottom:calc(var(--v2491-nav-space) + 96px)!important;
}
#v2489FixedStart,
#startGame{
  bottom:calc(var(--v2491-nav-h) + var(--v2491-safe-bottom) + 10px)!important;
  width:min(88vw, 440px)!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  z-index:3300!important;
}
body.v2489-prep-active #v246BottomNav,
body.v2489-prep-active .v246BottomNav{
  opacity:.24!important;
  pointer-events:none!important;
}
/* Formation: prevent horizontal clipping; make current party a compact grid. */
#formationScreenV24 .pad{
  padding-bottom:var(--v2491-nav-space)!important;
}
#formationRootV24{
  overflow-x:hidden!important;
  padding-bottom:calc(var(--v2491-nav-space) + 14px)!important;
}
#formationRootV24 .v2462Hero{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:3px!important;
  padding:10px 12px!important;
}
#formationRootV24 .v2462DiffTabs{
  gap:7px!important;
  padding:2px 2px 6px!important;
  scroll-padding-left:2px!important;
}
#formationRootV24 .v2462DiffTabs button{
  min-width:110px!important;
  padding:8px!important;
}
#formationRootV24 .v2462TeamSlots{
  display:grid!important;
  grid-template-columns:repeat(4, minmax(0,1fr))!important;
  gap:7px!important;
  overflow:visible!important;
  padding:0!important;
}
#formationRootV24 .v2462Slot{
  min-width:0!important;
  max-width:none!important;
  width:100%!important;
  padding:6px 3px!important;
  border-radius:14px!important;
}
#formationRootV24 .v2462Slot img{
  width:48px!important;
  height:48px!important;
  border-radius:12px!important;
}
#formationRootV24 .v2462Slot b{font-size:9px!important;}
#formationRootV24 .v2462Slot span{font-size:10px!important;}
#formationRootV24 .v2462Slot small{font-size:9px!important;line-height:1.1!important;}
#formationRootV24 .v2462Actions{
  gap:7px!important;
  margin-top:9px!important;
}
#formationRootV24 .v2462Actions button{
  min-height:38px!important;
  font-size:13px!important;
}
#formationRootV24 .v2462RosterPanel{
  margin-top:12px!important;
  max-height:none!important;
}
#formationRootV24 .v2462Roster{
  max-height:42svh!important;
  padding-bottom:calc(var(--v2491-nav-space) + 18px)!important;
  overflow-y:auto!important;
}
/* Training/detail: content should scroll beyond nav, not be hidden by it. */
#trainingScreenV24 .pad,
#trainingScreen .pad{
  padding-bottom:calc(var(--v2491-nav-space) + 28px)!important;
}
#trainingScreenV24 .v24TrainingActions,
#trainingScreenV24 .v2462Actions{
  margin-bottom:12px!important;
}
/* Gacha/result/login/highscore pages become page-local scroll areas without nav. */
#gachaScreen .gachaResultCard,
#gachaScreen .section,
#highScoreScreen .section,
#loginBonusScreen .section,
#missionScreen .section,
#itemScreen .section,
#profileScreen .section{
  margin-bottom:12px!important;
}
#gachaScreen .gachaResultCard{
  max-height:none!important;
  overflow:visible!important;
}
#resultScreen .resultActions{
  padding-bottom:calc(var(--v2491-safe-bottom) + 12px)!important;
}
#resultScreen .resultActions button{
  min-height:42px!important;
}
#highScoreScreen .endlessRankingList,
#highScoreScreen .stageRecordList{
  max-height:36svh!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
/* Dark screens: heading uses light text; cards use dark text. */
body.v2491-subnav-hidden .topbar b,
#loginBonusScreen .topbar b,
#gachaScreen .topbar b,
#highScoreScreen .topbar b,
#missionScreen .topbar b,
#itemScreen .topbar b,
#profileScreen .topbar b{
  color:#fff7d6!important;
  text-shadow:0 2px 8px rgba(0,0,0,.65)!important;
}
#loginBonusScreen .section,
#gachaScreen .section,
#highScoreScreen .section,
#missionScreen .missionCard,
#itemScreen .itemCard2,
#profileScreen .section{
  color:#20163e!important;
  background:rgba(255,255,255,.82)!important;
}
#loginBonusScreen .section *,
#gachaScreen .section *,
#highScoreScreen .section *,
#profileScreen .section *{
  text-shadow:none!important;
}
/* Keep battle nav hidden. */
body.battle-active #v246BottomNav,
body.battle-active .v246BottomNav,
body.v2491-game-active #v246BottomNav,
body.v2491-game-active .v246BottomNav{
  display:none!important;
}
@media(max-width:390px){
  :root{--v2491-nav-h:58px;--v2491-nav-space:calc(var(--v2491-nav-h) + var(--v2491-safe-bottom) + 44px)}
  #v246BottomNav,.v246BottomNav,.bottomNav,.v2487BottomNav,.bottomNavV24{height:56px!important;min-height:56px!important;width:96vw!important;}
  #v246BottomNav button,.v246BottomNav button,.bottomNav button,.v2487BottomNav button,.bottomNavV24 button{height:47px!important;min-height:47px!important;font-size:8px!important;}
  .v246BottomNav.v2487NavLight .v2487NavIcon,#v246BottomNav .v2487NavIcon{width:22px!important;height:22px!important;}
  #formationRootV24 .v2462TeamSlots{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;}
  #formationRootV24 .v2462Slot img{width:42px!important;height:42px!important;}
  #formationRootV24 .v2462Slot small{display:none!important;}
}