body > nav {
  transition: background-color 220ms ease, box-shadow 220ms ease;
}

html:not(.theme-dark):not(.theme-contrast) body > nav.header-scrolled {
  background: rgba(243, 240, 245, 0.54);
  box-shadow: 0 4px 16px rgba(21, 37, 30, 0.045);
}

html.theme-dark body > nav.header-scrolled {
  background: rgba(18, 27, 22, 0.56);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
}

@media (prefers-reduced-motion: reduce) {
  body > nav {
    transition: none;
  }
}