.hdr{
  position:sticky;
  z-index:10;
  top:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:var(--sp-2);
  align-items:center;
  min-height:var(--hdr-h-sp);
  padding:var(--sp-2) var(--sp-3);
  background:var(--bg-panel);
  border-bottom:1px solid var(--line);
}
.hdr__title{
  grid-column:1/-1;
  margin:0;
  font-size:17px;
  line-height:1.2;
}
.hdr__title-sub{
  font-size:.75em;
}
.hdr__loc{
  min-width:0;
}
.hdr__stage,.hdr__depth{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.hdr__stage{
  font-size:12px;
  color:var(--text-mid);
}
.tabs{
  position:fixed;
  z-index:20;
  right:0;
  bottom:0;
  left:0;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  min-height:var(--tabbar-h);
  background:var(--bg-panel);
  border-top:1px solid var(--line);
}
.page{
  width:100%;
  max-width:var(--page-max);
  min-width:0;
  margin:0 auto;
  padding:var(--sp-3) var(--sp-3) calc(var(--tabbar-h) + var(--sp-4));
}
.view{
  min-width:0;
}
.view[data-view="battle"]{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--sp-3);
}
.battle-main,.battle-info,.enemy-area,.party-area{
  min-width:0;
}
.fx-layer{
  z-index:30;
}
.toast-layer{
  z-index:100;
}
.modal-layer{
  z-index:200;
}
.overlay-layer{
  z-index:300;
}
@media (min-width:880px){
  .hdr{
    grid-template-columns:minmax(260px,1fr) minmax(280px,2fr) auto auto;
    min-height:var(--hdr-h);
    padding:var(--sp-2) var(--sp-5);
  }
  .hdr__title{
    grid-column:auto;
    font-size:20px;
  }
  .hdr__stage,.hdr__depth{
    display:inline;
  }
  .tabs{
    position:sticky;
    top:var(--hdr-h);
    max-width:var(--page-max);
    margin:0 auto;
    border:1px solid var(--line);
    border-top:0;
    border-radius:0 0 var(--r-md) var(--r-md);
  }
  .page{
    padding:var(--sp-5);
    padding-bottom:var(--sp-5);
  }
  .view[data-view="battle"]{
    grid-template-columns:minmax(0,2fr) minmax(280px,1fr);
    gap:var(--sp-4);
  }
  .battle-main{
    grid-column:1;
  }
  .battle-info{
    grid-column:2;
  }
}