/* The script advances the solid palette in small ten-second steps.
   Do not interpolate foreground and background independently: every committed
   frame is a contrast-checked palette, including reduced-motion environments. */
html[data-daylight-mode="auto"] #aurora-bg {
  opacity: 0 !important;
}

html[data-daylight-mode="auto"] .amara-contact-form [data-contact-status][data-state="error"] {
  padding-inline-start: 0.65em;
  color: var(--error-ink);
  font-weight: 650;
  border-inline-start: 3px solid var(--error-accent);
}

html[data-daylight-mode="auto"] .amara-contact-form :is(input, select, textarea) {
  color: var(--ink);
  background: var(--paper-deep);
}

/* Existing components may animate hover colours. During an automatic palette
   polarity change, commit every foreground/background colour in one frame;
   keep the established non-colour interaction motion. */
html[data-daylight-mode="auto"] :where(*, *::before, *::after) {
  transition-property: opacity, transform, filter, box-shadow, width, height, max-height, visibility !important;
}

html[data-daylight-mode="auto"],
html[data-daylight-mode="auto"] body,
html[data-daylight-mode="auto"] body::before,
html[data-daylight-mode="auto"] .home-opening,
html[data-daylight-mode="auto"] .topbar,
html[data-daylight-mode="auto"] .menu-panel {
  transition: none !important;
}