/* Maintenance page and authenticated staff preview. Shared typography and spacing tokens. */
.maintenance-page { min-height: 100svh; background: radial-gradient(ellipse at top right, rgb(var(--accent-rgb) / 12%), transparent 65%), var(--ink); }
.maintenance-content { min-height: 100svh; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: var(--space-5); }
.maintenance-logo { width: min(100%, 320px); height: auto; margin-bottom: var(--space-6); }
.maintenance-content .eyebrow { color: var(--accent); }
.maintenance-content h1 { overflow-wrap: anywhere; }
.maintenance-content .lead { color: var(--muted); }
.maintenance-staff-link { font-size: var(--text-small); color: var(--muted); }
.maintenance-staff-link a { display: inline-flex; align-items: center; min-height: 44px; }
.maintenance-preview { position: fixed; inset: 0 0 auto; z-index: 60; background: var(--amber); color: var(--ink-deep); border-bottom: 1px solid var(--amber-on-light); }
.maintenance-preview .container { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding-block: var(--space-3); }
.maintenance-preview p { font-size: var(--text-small); }
.maintenance-preview strong { display: block; }
.maintenance-preview a { font-size: var(--text-small); font-weight: 800; flex-shrink: 0; min-height: 44px; display: inline-flex; align-items: center; }
html:has(.maintenance-preview:not([hidden])) { --maintenance-offset: 80px; scroll-padding-top: calc(var(--header-height) + var(--maintenance-offset) + 24px); }
body:has(.maintenance-preview:not([hidden])) { padding-top: var(--maintenance-offset); }
body:has(.maintenance-preview:not([hidden])) .site-header { top: var(--maintenance-offset); }
@media (max-width: 1099px) {
  body:has(.maintenance-preview:not([hidden])) .main-nav { top: calc(var(--header-height) + var(--maintenance-offset) - 4px); max-height: calc(100dvh - var(--header-height) - var(--maintenance-offset) - 24px); }
}
@media (max-width: 767px) {
  html:has(.maintenance-preview:not([hidden])) { --maintenance-offset: 140px; }
  .maintenance-preview .container { flex-wrap: wrap; gap: var(--space-1); }
}