html[data-embed="os"] {
  color-scheme: dark;
}

html[data-embed="os"] body {
  min-height: auto;
}

html[data-embed="os"] .progress-bar,
html[data-embed="os"] [data-theme-toggle],
html[data-embed="os"] .theme-toggle,
html[data-embed="os"] .header__theme-toggle {
  display: none !important;
}

html[data-embed="os"] .site-header,
html[data-embed="os"] .header {
  position: sticky;
  top: 0;
}

html[data-embed="os"] .site-header--hidden,
html[data-embed="os"] .header--hidden {
  transform: none !important;
}

html[data-embed="os"] .hero {
  min-height: auto !important;
  align-items: start !important;
  justify-content: start !important;
}

html[data-embed="os"] .desktop-only {
  display: none;
}

html[data-embed="os"] .site-header {
  backdrop-filter: none;
}

html[data-embed="os"] .header,
html[data-embed="os"] .site-header {
  backdrop-filter: none;
}

html[data-embed="os"] .hero::before {
  opacity: 0.35;
}

html[data-embed="os"] .hero-text,
html[data-embed="os"] .hero__content {
  min-width: 0;
}

html[data-embed="os"] .hero-cta,
html[data-embed="os"] .btn,
html[data-embed="os"] .hero__nav-btn,
html[data-embed="os"] .header__nav-btn,
html[data-embed="os"] .pill {
  transition-duration: 120ms;
}

html[data-embed="os"] .nav-inner,
html[data-embed="os"] .header-inner,
html[data-embed="os"] .header__inner {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

html[data-embed="os"] .nav-links,
html[data-embed="os"] .header-nav,
html[data-embed="os"] .header__nav {
  gap: 0.8rem;
}

html[data-embed="os"] .header-nav,
html[data-embed="os"] .nav-links {
  overflow-x: auto;
  scrollbar-width: none;
}

html[data-embed="os"] .header-nav::-webkit-scrollbar,
html[data-embed="os"] .nav-links::-webkit-scrollbar {
  display: none;
}

html[data-embed="os"] .hero-badge,
html[data-embed="os"] .hero__label,
html[data-embed="os"] .hero-eyebrow {
  margin-bottom: 1rem !important;
}

html[data-embed="os"] .hero-subtitle,
html[data-embed="os"] .hero__sub,
html[data-embed="os"] .hero-sub {
  margin-top: 1rem !important;
  margin-bottom: 0 !important;
}

html[data-embed="os"] .hero-cta,
html[data-embed="os"] .hero-cta-row,
html[data-embed="os"] .hero-stats,
html[data-embed="os"] .hero__stats {
  margin-top: 1.4rem !important;
}

html[data-embed="os"] .hero-cta-row {
  margin-bottom: 1rem !important;
}

html[data-embed="os"] .hero {
  padding: 2.4rem 2rem 1.8rem !important;
}

html[data-embed="os"] .hero-inner {
  gap: 2rem !important;
}

html[data-embed="os"] .hero-title {
  font-size: clamp(2.6rem, 1.4rem + 4.2vw, 5rem) !important;
  line-height: 1.02 !important;
}

html[data-embed="os"] .hero__heading {
  font-size: clamp(2.8rem, 1.8rem + 3vw, 4.8rem) !important;
  line-height: 1.04 !important;
  margin-bottom: 1.2rem !important;
}

html[data-embed="os"] .hero-subtitle,
html[data-embed="os"] .hero__sub,
html[data-embed="os"] .hero-sub {
  font-size: clamp(1.5rem, 1.1rem + 0.7vw, 1.8rem) !important;
  line-height: 1.55 !important;
  max-width: 46ch !important;
}

html[data-embed="os"] .hero-visual,
html[data-embed="os"] .hero-diagram {
  display: none !important;
}

html[data-embed="os"] .hero-inner {
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start !important;
}

html[data-embed="os"] .hero-cta {
  margin-top: 1.5rem !important;
}

html[data-embed="os"] .hero__stats,
html[data-embed="os"] .hero-stats {
  gap: 1.6rem !important;
}

html[data-embed="os"] .hero-stats .stat,
html[data-embed="os"] .hero__stat {
  min-width: 0;
}

html[data-embed="os"] .stats-bar {
  padding-top: 1.4rem !important;
  gap: 1rem !important;
}

html[data-embed="os"] .filters-bar {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

html[data-embed="os"] #map {
  height: min(64vh, 58rem) !important;
  min-height: 42rem !important;
}

html[data-embed="os"] .overview {
  padding-top: 0 !important;
}

html[data-embed="os"] .overview__inner {
  grid-template-columns: 1fr !important;
}

html[data-embed="os"] .overview__copy {
  padding: 2rem !important;
}

html[data-embed="os"] .cards-section,
html[data-embed="os"] .timeline-section,
html[data-embed="os"] .viz-section,
html[data-embed="os"] .overview,
html[data-embed="os"] .filters,
html[data-embed="os"] .main,
html[data-embed="os"] .legend-section,
html[data-embed="os"] .data-table-section {
  scroll-margin-top: 6rem;
}

@media (max-height: 820px) {
  html[data-embed="os"] .hero {
    padding-top: 1.8rem !important;
    padding-bottom: 1.5rem !important;
  }

  html[data-embed="os"] .hero-title {
    font-size: clamp(2.2rem, 1.2rem + 3.6vw, 4.2rem) !important;
  }

  html[data-embed="os"] .hero__heading {
    font-size: clamp(2.4rem, 1.5rem + 2.8vw, 4rem) !important;
  }

  html[data-embed="os"] .hero-subtitle,
  html[data-embed="os"] .hero__sub,
  html[data-embed="os"] .hero-sub {
    font-size: 1.4rem !important;
  }

  html[data-embed="os"] .hero__stats,
  html[data-embed="os"] .hero-stats {
    margin-top: 1rem !important;
    gap: 1.2rem !important;
  }

  html[data-embed="os"] .hero-stats {
    flex-wrap: wrap;
  }

  html[data-embed="os"] .stats-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}