/* Reserve the shared page layout before any React bundle mounts.
   Header sizes match header.css, including the mobile navigation row. */
.site-shell-page {
  --site-shell-header-height: 80px;
  --site-shell-mobile-nav-height: 2.75rem;
}

.site-shell-page--tv {
  --site-shell-mobile-nav-height: 0px;
}

.site-shell-page #header-root {
  min-height: var(--site-shell-header-height);
}

.site-shell-page .site-shell-main {
  box-sizing: border-box;
  min-height: calc(100vh - var(--site-shell-header-height));
  min-height: calc(100svh - var(--site-shell-header-height));
}

@media (max-width: 1024px) {
  .site-shell-page {
    --site-shell-header-height: calc(60px + var(--site-shell-mobile-nav-height));
  }
}

@media (max-width: 359px) {
  .site-shell-page {
    --site-shell-header-height: calc(52px + var(--site-shell-mobile-nav-height));
  }
}

html.is-webview .site-shell-page {
  --site-shell-header-height: 0px;
}