/* ===== FALLING ANIMATIONS ===== */

@keyframes fall {
  0% {
    transform: translateY(0) translateX(0) rotate(0deg);
    opacity: 1;
  }
  25% {
    transform: translateY(25vh) translateX(calc(var(--drift) * 0.5)) rotate(calc(var(--rotation) * 0.25));
  }
  50% {
    transform: translateY(50vh) translateX(var(--drift)) rotate(calc(var(--rotation) * 0.5));
  }
  75% {
    transform: translateY(75vh) translateX(calc(var(--drift) * 0.5)) rotate(calc(var(--rotation) * 0.75));
  }
  100% {
    transform: translateY(100vh) translateX(0) rotate(var(--rotation));
    opacity: 0;
  }
}