/* ==========================================================================
   Animations — splash, step transitions, toasts, progress bar fill.
   ========================================================================== */

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideFade {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes slideIn {
  from { opacity: 0; transform: translateX(24px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes popIn {
  0% { opacity: 0; transform: scale(0.9); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes splashPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.06); opacity: 0.9; }
}

#splash .brand-logo { animation: splashPulse 1.6s ease-in-out infinite; }
#splash { animation: fadeIn 300ms ease; }
#splash.is-fading { animation: fadeOut 400ms ease forwards; }

@keyframes fadeOut {
  to { opacity: 0; visibility: hidden; }
}

.modal-box { animation: popIn var(--transition-base); }

.bar-fill { transition: width 500ms ease; }

.progress-step .dot { transition: background var(--transition-base), color var(--transition-base); }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}