/* Forge Fotos v36 — authoritative mobile header and desktop scroll ownership. */
html:not(.modal-open),
html:not(.modal-open) body {
  height: auto !important;
  min-height: 100% !important;
  overflow-y: auto !important;
  overscroll-behavior-y: auto !important;
}

.pwa-install-card {
  pointer-events: auto;
}

.head-actions .avatar {
  display: none !important;
}

.sheet-card,
.upload-sheet,
.side-panel aside,
.side-panel form,
.member-gate form,
.notification-list {
  overflow-y: auto;
  touch-action: pan-y;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

@media (min-width: 769px) {
  body,
  main,
  .view.active {
    touch-action: pan-y !important;
  }

  .top-nav .nav-profile {
    display: flex !important;
  }
}

@media (min-width: 1161px) {
  .top-nav .nav-profile .nav-label {
    display: inline !important;
  }
}

@media (max-width: 768px) {
  body {
    padding-right: env(safe-area-inset-right, 0px) !important;
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
    padding-left: env(safe-area-inset-left, 0px) !important;
  }

  .topbar {
    position: sticky !important;
    z-index: 80 !important;
    top: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas: "nav nav" ". subscribe" !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: calc(8px + env(safe-area-inset-top, 0px)) max(8px, env(safe-area-inset-right, 0px)) 9px max(8px, env(safe-area-inset-left, 0px)) !important;
    gap: 7px !important;
    background: #07090df2 !important;
    box-sizing: border-box !important;
  }

  .brand,
  .mobile-home,
  .head-actions {
    display: none !important;
  }

  body .topbar > .top-nav,
  body > .top-nav {
    position: static !important;
    grid-area: nav !important;
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(52px, 1fr) !important;
    grid-template-columns: none !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: none !important;
    height: 72px !important;
    min-height: 72px !important;
    margin: 0 !important;
    padding: 6px 5px !important;
    gap: 1px !important;
    border: 1px solid #2a323e !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #121820f7, #0b1016f7) !important;
    box-shadow: 0 14px 36px #0009, inset 0 1px #ffffff0d !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    transform: none !important;
    box-sizing: border-box !important;
  }

  .top-nav::-webkit-scrollbar {
    display: none;
  }

  .top-nav .nav-start,
  .top-nav .nav-profile {
    display: flex !important;
  }

  .top-nav .nav-app-button {
    min-width: 52px !important;
    scroll-snap-align: center;
  }

  .top-nav .nav-label,
  .top-nav .nav-profile .nav-label,
  body > .top-nav .nav-label,
  body > .top-nav .nav-profile .nav-label {
    font-size: 9px !important;
    line-height: 11px !important;
  }

  .top-subscribe {
    position: static !important;
    grid-area: subscribe !important;
    align-self: center !important;
    justify-self: end !important;
    width: auto !important;
    min-width: 72px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 5px 10px !important;
    transform: none !important;
  }

  .pwa-install-card {
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .sheet:not(.hidden),
  .side-panel:not(.hidden),
  .member-gate:not(.hidden),
  .modal:not(.hidden) {
    z-index: 120 !important;
    top: 0 !important;
    height: 100dvh !important;
    padding: calc(8px + env(safe-area-inset-top, 0px)) max(8px, env(safe-area-inset-right, 0px)) calc(8px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px)) !important;
    box-sizing: border-box !important;
  }

  .sheet:not(.hidden) > .sheet-card,
  .side-panel:not(.hidden) > aside,
  .side-panel:not(.hidden) > form,
  .member-gate:not(.hidden) > form {
    max-height: calc(100dvh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    overflow-y: auto !important;
  }

  body.auth-pending .topbar > .top-nav {
    visibility: hidden !important;
  }
}