/* css/alert-flash.css — Full-screen red flash + clock-display amber freeze at countdown zero. Imported into the components layer. */

@keyframes flash-bg {
  0%   { background-color: var(--bg-primary); }
  50%  { background-color: rgba(239, 68, 68, 0.35); }
  100% { background-color: var(--bg-primary); }
}

body.alert-flash {
  animation: flash-bg 1.4s ease-in-out infinite;
}

body.alert-flash .clock-display__digits {
  color: var(--clock-alert);
  animation: none;
}

/* Accessibility: a full-viewport strobe is a vestibular / photosensitivity risk.
   For users who ask for reduced motion, hold a static red tint instead of
   pulsing — the alert stays unmistakable without the flashing. */
@media (prefers-reduced-motion: reduce) {
  body.alert-flash {
    animation: none;
    background-color: rgba(239, 68, 68, 0.35);
  }
}