/* GritHQ Alpha4.88 — FINAL PWA shell parity lock
   Scope: installed iOS PWA only (html.ios-standalone).
   Native iOS/Worker shell is intentionally untouched.

   Goals:
   1) Home uses the SAME scroll/overscroll affordance as Profile so it never feels locked.
   2) All four PrimaryDock destinations use the exact Home geometry the user approved:
      equal 25% columns, identical button width/height, centered icons/labels, identical active footprint.
*/
@media (max-width:959px) {
  /* Match Profile's short-page drag/return behavior on Home. The scroll owner
     remains .main-content; Home gets the same small extra scroll runway Profile has. */
  html.ios-standalone body.home-mode:not(.workout-mode) .main-content {
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:100%!important;
    max-height:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-y:auto!important;
    touch-action:pan-y!important;
  }

  html.ios-standalone body.home-mode:not(.workout-mode) #view-home.active {
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:calc(100% + 52px)!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  /* Freeze the PWA dock to the exact geometry of the approved Home state on
     EVERY primary page. Safe-area clearance stays outside the 58px visual dock. */
  html.ios-standalone body:not(.workout-mode) .bottom-nav {
    grid-row:3!important;
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    transform:none!important;
    width:auto!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:6px max(10px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))!important;
    padding:4px!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    grid-auto-columns:minmax(0,1fr)!important;
    gap:0!important;
    align-items:stretch!important;
    align-self:end!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  /* Each destination occupies exactly one equal column regardless of active tab. */
  html.ios-standalone body:not(.workout-mode) .bottom-nav .nav-btn,
  html.ios-standalone body:not(.workout-mode) .bottom-nav .nav-btn.active {
    position:relative!important;
    grid-column:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:50px!important;
    min-height:50px!important;
    max-height:50px!important;
    margin:0!important;
    padding:3px 2px!important;
    display:flex!important;
    flex:none!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    gap:2px!important;
    box-sizing:border-box!important;
  }

  html.ios-standalone body:not(.workout-mode) .bottom-nav .nav-btn svg {
    display:block!important;
    width:21px!important;
    height:21px!important;
    margin:0 auto!important;
    flex:0 0 21px!important;
  }

  html.ios-standalone body:not(.workout-mode) .bottom-nav .nav-btn small {
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
    line-height:1.05!important;
  }
}