/* Critical shell layout — reserve fixed-header space before and during shell load */

:root {
  --topbar-banner-offset: 34px;
  --topbar-height: 78px;
  --topbar-height-scrolled: 64px;
}

#topbar-container {
  display: contents;
}

body:has(#topbar-container),
body:has(#banner-container),
body:has(.topbar) {
  padding-top: var(--topbar-height);
}

body:has(#banner-container):has(#topbar-container),
body:has(.urgency-banner):has(.topbar),
body:has(.urgency-banner):has(#topbar-container) {
  padding-top: calc(var(--topbar-banner-offset) + var(--topbar-height));
}

body:has(.topbar.is-scrolled),
body:has(#topbar-container):has(.topbar.is-scrolled) {
  --topbar-height: var(--topbar-height-scrolled);
}