@keyframes gradientShift {
  0% { filter: hue-rotate(0deg) saturate(110%); }
  50% { filter: hue-rotate(18deg) saturate(120%); }
  100% { filter: hue-rotate(0deg) saturate(110%); }
}

body { animation: gradientShift 18s linear infinite; }

@keyframes reel-spin-fast {
  0% { transform: translateY(0); filter: blur(0px); }
  40% { filter: blur(1px); }
  100% { transform: translateY(-3600px); filter: blur(0px); }
}
@keyframes reel-spin-med {
  0% { transform: translateY(0); filter: blur(0px); }
  40% { filter: blur(1px); }
  100% { transform: translateY(-4200px); filter: blur(0px); }
}
@keyframes reel-spin-slow {
  0% { transform: translateY(0); filter: blur(0px); }
  40% { filter: blur(1px); }
  100% { transform: translateY(-4800px); filter: blur(0px); }
}

@keyframes winPulse {
  0% { opacity: 0; transform: scale(.96); }
  50% { opacity: 1; transform: scale(1.02); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes lossFlash {
  0% { opacity: 0; }
  40% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes neonLoop {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes symbolTwirl {
  0% { transform: translateZ(0) scale(0.96) rotate(-4deg); opacity: 0; }
  40% { transform: translateZ(0) scale(1.06) rotate(2deg); opacity: 1; }
  100% { transform: translateZ(0) scale(1) rotate(0deg); opacity: 1; }
}

@keyframes textGlowLoss {
  0% { text-shadow: 0 0 0 rgba(255,80,110,0); }
  10% { text-shadow: 0 0 8px rgba(255,80,110,.85), 0 0 18px rgba(255,0,64,.6); }
  90% { text-shadow: 0 0 8px rgba(255,80,110,.85), 0 0 18px rgba(255,0,64,.6); }
  100% { text-shadow: 0 0 0 rgba(255,80,110,0); }
}

@media (prefers-reduced-motion: reduce) {
  body { animation: none; }
  .reel.spin-fast .reel-track { animation: reel-spin-fast 1800ms linear; }
  .reel.spin-med .reel-track { animation: reel-spin-med 2000ms linear; }
  .reel.spin-slow .reel-track { animation: reel-spin-slow 2200ms linear; }
}
