.cassette-svg { display: block; width: 100%; height: auto; overflow: visible; }
.cassette-svg .f { transform-box: fill-box; transform-origin: 50% 100%; animation: cas-flicker 2.8s ease-in-out infinite; }
.cassette-svg .f2 { animation-duration: 3.4s; animation-delay: -.8s; }
.cassette-svg .f3 { animation-duration: 2.4s; animation-delay: -1.4s; }
.cassette-svg .f4 { animation-duration: 1.9s; animation-delay: -.3s; }
.cassette-svg .cas-glow { animation: cas-glow 4.5s ease-in-out infinite; }

@keyframes cas-flicker {
  0%, 100% { transform: scale(1, 1) skewX(0deg); opacity: .95; }
  30% { transform: scale(.96, 1.06) skewX(-2deg); opacity: 1; }
  60% { transform: scale(1.03, .94) skewX(1.5deg); opacity: .9; }
}
@keyframes cas-glow {
  0%, 100% { opacity: .75; }
  50% { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .cassette-svg .f, .cassette-svg .cas-glow { animation: none; }
}
