/* MyWeatha v71 — one viewport owner, one bottom navigation.
   All sizes are relative to the *usable* dynamic viewport, NEVER screen.height.
   This replaces the v69/v70 iOS physical-screen workarounds. */
@media (max-width:520px),(orientation:landscape) and (max-height:520px) {
 html, body {
  width:100%!important;height:100%!important;min-height:0!important;
  margin:0!important;padding:0!important;
  overflow:hidden!important;overscroll-behavior:none!important;
  background-color:var(--dock,#102d59)!important;
 }
 body>.stage {
  position:fixed!important;inset:0!important;
  width:100%!important;height:100dvh!important;
  min-height:0!important;max-height:none!important;
  margin:0!important;padding:0!important;
  display:block!important;overflow:hidden!important;
  box-sizing:border-box!important;transform:none!important;
  overscroll-behavior:none!important;
 }
 body>.stage>.phone {
  position:relative!important;inset:auto!important;
  width:100%!important;max-width:100%!important;
  height:100%!important;min-height:0!important;max-height:none!important;
  border:0!important;border-radius:0!important;margin:0!important;
  box-shadow:none!important;overflow:hidden!important;
  box-sizing:border-box!important;
 }
 body>.stage>.phone>.viewport {
  height:100%!important;max-height:100%!important;
  overflow-x:hidden!important;overflow-y:auto!important;
  overscroll-behavior-y:contain!important;
  -webkit-overflow-scrolling:touch;
  box-sizing:border-box!important;
  padding-bottom:calc(var(--wa-v71-dock-height,82px) + 16px)!important;
 }
 body>.stage>.phone>nav.dock {
  position:absolute!important;inset:auto 0 0 0!important;
  bottom:0!important;left:0!important;right:0!important;
  display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:center!important;justify-items:stretch!important;
  width:100%!important;min-height:0!important;max-height:none!important;
  box-sizing:border-box!important;margin:0!important;
  padding:5px 9px max(7px,env(safe-area-inset-bottom,0px))!important;
  border:1px solid var(--border,rgba(210,240,255,.35))!important;
  border-bottom:0!important;border-radius:21px 21px 0 0!important;
  background:var(--wa-lab-dock,var(--dock,#0b2859))!important;
  box-shadow:0 -7px 23px rgba(0,14,46,.23),inset 0 1px rgba(245,252,255,.2)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  isolation:isolate!important;overflow:visible!important;
  z-index:1900!important;
 }
 body:not([data-wa-lab="on"])>.stage>.phone>nav.dock {
  background:linear-gradient(115deg,rgba(10,38,85,.99),rgba(35,43,107,.99))!important;
 }
 .phone>nav.dock>.tab {
  display:flex!important;flex-direction:column!important;
  justify-content:center!important;align-items:center!important;
  min-width:0!important;min-height:48px!important;
  gap:2px!important;padding:4px 1px 3px!important;
  line-height:1.12!important;font-size:10px!important;
  text-align:center!important;white-space:nowrap!important;
  touch-action:manipulation;
 }
 .phone>nav.dock>.tab svg {width:21px!important;height:21px!important;flex-shrink:0!important;}
 .phone>nav.dock>.tab[data-go="studio"],
 body[data-theme] .phone>nav.dock>.tab[data-go="studio"] {
  min-height:56px!important;padding:5px 1px 3px!important;
  transform:translateY(-5px)!important;
  font-size:10px!important;gap:2px!important;border-radius:19px!important;
 }
 .phone>nav.dock>.tab[data-go="studio"] svg {
  width:25px!important;height:25px!important;
 }
 /* The iOS status-bar backdrop is sharp; only the scrollable content moves. */
 body>.stage::before {
  content:"";position:absolute;top:0;left:0;right:0;
  height:max(54px,env(safe-area-inset-top,0px));
  pointer-events:none;z-index:12;
  background:linear-gradient(180deg,var(--wa-b,#102d56),
    color-mix(in srgb,var(--wa-b,#102d56) 94%,var(--wa-p,#2867a5)))!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
 }
}
@media (orientation:landscape) and (max-height:520px) {
 body>.stage>.phone>nav.dock {
  padding:2px 9px max(3px,env(safe-area-inset-bottom,0px))!important;
 }
 .phone>nav.dock>.tab {min-height:44px!important;padding:2px 1px!important;}
 .phone>nav.dock>.tab[data-go="studio"],
 body[data-theme] .phone>nav.dock>.tab[data-go="studio"] {
  min-height:49px!important;transform:translateY(-3px)!important;
  padding:2px 1px!important;
 }
 body>.stage::before {height:max(12px,env(safe-area-inset-top,0px));}
}