/* Public page content integration. The shared chrome itself is isolated in a
   shadow root so legacy page styles cannot change its controls or typography. */
html[data-site-shell-mode] [data-site-shell-old] { display: none !important; }
html[data-site-shell-mode] body {
    --header-height: var(--site-shell-header-height, 64px);
    --nav-height: var(--site-shell-header-height, 64px);
    --footer-height: var(--site-shell-footer-height, 42px);
    padding-top: calc(var(--header-height) + 12px) !important;
    padding-bottom: 54px !important;
    box-sizing: border-box;
    min-height: 100dvh;
    max-width: 100%;
}
html[data-site-shell-mode="mobile"] body {
    --header-height: 64px;
    --footer-height: 22px;
    padding-top: 72px !important;
    padding-bottom: 34px !important;
}
html[data-site-shell-mode] .main-scroll { top: var(--header-height); bottom: var(--footer-height); }
html[data-site-shell-mode] .update-selector { top: var(--header-height); }
html[data-site-shell-mode] .main-content { bottom: var(--footer-height); }
html[data-site-shell-mode] .site-header-spacer { display: none; }
html[data-site-shell-mode] #mobile-fallback { top: 64px; bottom: var(--footer-height); height: auto; overflow-y: auto; }
html[data-site-shell-mode="mobile"] #studio-app { display: none !important; }
html[data-site-shell-mode="mobile"] #mobile-fallback { display: flex !important; }
html[data-site-shell-mode="desktop"] #studio-app { height: calc(100dvh - 130px); }
html[data-site-shell-mode="mobile"] .rental-page .marimba-stage { margin-inline: 0; }
html[data-site-shell-mode] .payment-shell,
html[data-site-shell-mode] .page-shell,
html[data-site-shell-mode] main { max-width: 100%; }
html[data-site-shell-mode] { scroll-padding-top: 76px; scroll-padding-bottom: 54px; }
