/* ═══════════════════════════════════════════════════════
   CLASSFLOW — ANIMATIONS
═══════════════════════════════════════════════════════ */

/* ── Loading ── */
@keyframes loadFadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes loadBar {
  0% { width: 0%; }
  20% { width: 30%; }
  50% { width: 60%; }
  80% { width: 85%; }
  100% { width: 100%; }
}
@keyframes drawPath {
  from { stroke-dashoffset: 200; stroke-dasharray: 200; opacity: 0; }
  to { stroke-dashoffset: 0; stroke-dasharray: 200; opacity: 1; }
}
@keyframes popIn {
  from { opacity: 0; transform: scale(0.7); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes floatParticle {
  0% { transform: translateY(100vh) scale(0); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateY(-10vh) scale(1); opacity: 0; }
}
@keyframes shimmer {
  0%,100% { transform: translateX(-100%); }
  50% { transform: translateX(100%); }
}

/* ── Auth ── */
@keyframes authCardIn {
  from { opacity: 0; transform: translateY(24px) scale(0.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes pulseWave {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}

/* ── App transitions ── */
@keyframes viewIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* ── Timer ── */
@keyframes urgentFlash {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
@keyframes timerDone {
  0% { transform: scale(1); }
  40% { transform: scale(1.08); }
  100% { transform: scale(1); }
}
@keyframes screenFlash {
  0%, 100% { background: transparent; }
  50% { background: rgba(255,60,60,0.15); }
}

/* ── Scoreboard ── */
@keyframes scoreBump {
  0% { transform: scale(1); }
  50% { transform: scale(1.3); }
  100% { transform: scale(1); }
}

/* ── Toast ── */
@keyframes toastIn {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes toastOut {
  from { opacity: 1; transform: translateX(0); }
  to { opacity: 0; transform: translateX(20px); }
}

/* ── Wheel spin ── */
@keyframes wheelWiggle {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-3deg); }
  75% { transform: rotate(3deg); }
}

/* ── Misc ── */
@keyframes slideDown {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
.anim-slide-down { animation: slideDown 0.2s ease both; }

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.anim-fade { animation: fadeIn 0.25s ease both; }

/* ── Screen flash (timer end) ── */
.screen-flash {
  animation: screenFlash 0.4s ease 3;
}