@keyframes floatAndFade {
  0% { opacity: 0; transform: translate(0, 0) rotate(0deg); }
  20% { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--random-x, 0px), -100px) rotate(var(--random-rotation, 0deg)); }
}

@keyframes birdFly {
  0% { transform: translateX(-50px) translateY(0); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateX(calc(100vw + 50px)) translateY(-100px); opacity: 0; }
}

@keyframes touchSparkle {
  0% { transform: scale(0) rotate(0deg); opacity: 0; }
  50% { transform: scale(1.5) rotate(180deg); opacity: 1; }
  100% { transform: scale(0) rotate(360deg); opacity: 0; }
}

@keyframes kidsFloat {
  0% { transform: translateY(-50px) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateY(120vh) rotate(360deg); opacity: 0; }
}

@keyframes neonLine {
  0% { transform: scaleY(0); opacity: 0; }
  50% { transform: scaleY(1); opacity: 0.8; }
  100% { transform: scaleY(0); opacity: 0; }
}

@keyframes floorLightPulse {
  0% { transform: scale(0); opacity: 0; }
  50% { transform: scale(1); opacity: 0.8; }
  100% { transform: scale(2); opacity: 0; }
}

@keyframes clockSpin {
  0% { transform: rotate(-180deg); opacity: 0; }
  20% { opacity: 1; }
  100% { transform: rotate(180deg); opacity: 0; }
}

@keyframes staticGlitch {
  0% { transform: scaleX(0); opacity: 0.8; }
  50% { transform: scaleX(1); opacity: 0.4; }
  100% { transform: scaleX(0); opacity: 0; }
}

@keyframes driverRain {
  0% { transform: translateY(-20px) rotate(15deg); opacity: 0; }
  10% { opacity: 1; }
  100% { transform: translateY(100vh) rotate(15deg); opacity: 0; }
}

@keyframes rotatePrism {
  0% { transform: rotate(0deg) scale(0); opacity: 0; }
  50% { transform: rotate(180deg) scale(1); opacity: 1; }
  100% { transform: rotate(360deg) scale(0); opacity: 0; }
}

@keyframes swirlSpin {
  0% { transform: translate(-50%, -50%) rotate(0deg) scale(0); opacity: 0; }
  50% { transform: translate(-50%, -50%) rotate(720deg) scale(1); opacity: 0.8; }
  100% { transform: translate(-50%, -50%) rotate(1440deg) scale(0); opacity: 0; }
}

@keyframes matrixFall {
  0% { transform: translateY(0) scale(1); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateY(100vh) scale(0.5); opacity: 0; }
}

@keyframes lightningFlash {
  0% { opacity: 0; transform: scaleX(1); }
  10% { opacity: 1; transform: scaleX(3); }
  20% { opacity: 0; transform: scaleX(1); }
  30% { opacity: 1; transform: scaleX(2); }
  100% { opacity: 0; transform: scaleX(1); }
}

@keyframes smileSkullFloat {
  0% { 
    opacity: 0;
    transform: scale(0.5) rotate(-20deg);
  }
  20% { 
    opacity: 1;
    transform: scale(1.2) rotate(20deg);
  }
  80% {
    opacity: 0.8;
    transform: scale(1) rotate(-10deg) translate(30px, -30px);
  }
  100% {
    opacity: 0;
    transform: scale(0.5) rotate(20deg) translate(50px, -50px);
  }
}

@keyframes smileRoseFall {
  0% {
    opacity: 0;
    transform: translateY(-50px) rotate(0deg);
  }
  10% {
    opacity: 1;
    transform: translateY(0) rotate(45deg);
  }
  90% {
    opacity: 1;
    transform: translateY(90vh) rotate(315deg);
  }
  100% {
    opacity: 0;
    transform: translateY(100vh) rotate(360deg);
  }
}

@keyframes smileHeartRise {
  0% {
    opacity: 0;
    transform: translateY(0) scale(0.5);
  }
  20% {
    opacity: 1;
    transform: translateY(-100px) scale(1.2);
  }
  80% {
    opacity: 0.8;
    transform: translateY(-200px) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateY(-300px) scale(0.5);
  }
}

@keyframes pumpExplosion {
  0% { transform: scale(1); opacity: 1; }
  100% { transform: scale(50); opacity: 0; }
}

@keyframes summerGlow {
  0% {
    transform: scale(0) rotate(var(--rotation));
    opacity: 0;
  }
  50% {
    transform: scale(1) rotate(var(--rotation));
    opacity: 0.8;
  }
  100% {
    transform: scale(2) rotate(var(--rotation));
    opacity: 0;
  }
}

@keyframes sparkLife {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(20); opacity: 0.5; }
  100% { transform: scale(1); opacity: 0; }
}

@keyframes caramellSpin {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.5); }
  100% { transform: rotate(360deg) scale(1); }
}

@keyframes caramellBounce {
  0% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-100px) scale(0.8) rotate(180deg); }
  100% { transform: translateY(0) scale(1) rotate(360deg); }
}

@keyframes questionPop {
  0% { transform: scale(0.1); opacity: 0; }
  50% { transform: scale(1.5); opacity: 1; }
  100% { transform: scale(1); opacity: 0; }
}

@keyframes starFall {
  0% { transform: translateY(-50px) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  100% { transform: translateY(120vh) rotate(720deg); opacity: 0; }
}

@keyframes fallAndSpin {
  0% { transform: translateY(-50px) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateY(120vh) rotate(720deg); opacity: 0; }
}

@keyframes neonPulse {
  0% { opacity: 0; transform: scale(0.5) translateY(0); }
  50% { opacity: 1; transform: scale(1.2) translateY(-20px); }
  100% { opacity: 0; transform: scale(0.8) translateY(-40px); }
}

@keyframes randomRotate {
  from { transform: scale(0.5) rotate(-45deg); }
  to { transform: scale(1) rotate(0deg); }
}

@keyframes gucciFloat {
  0% {
    transform: translateY(100vh) rotate(0deg) scale(0.5);
    opacity: 0;
  }
  50% {
    transform: translateY(50vh) rotate(180deg) scale(1.2);
    opacity: 1;
  }
  100% {
    transform: translateY(-20vh) rotate(360deg) scale(0.5);
    opacity: 0;
  }
}

@keyframes glowPulse {
  0% { transform: scale(0.5); opacity: 0; }
  50% { transform: scale(1.2); opacity: 1; }
  100% { transform: scale(0.8); opacity: 0; }
}

@keyframes timeTextAnim {
  0% { transform: scale(0) rotate(0deg); opacity: 0; }
  20% { transform: scale(1.2) rotate(20deg); opacity: 1; }
  80% { transform: scale(1) rotate(-10deg); opacity: 0.8; }
  100% { transform: scale(0.5) rotate(0deg); opacity: 0; }
}

@keyframes latinStarFall {
  0% { transform: translateY(0) scale(1); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; transform: translateY(90vh) scale(0.5); }
  100% { opacity: 0; transform: translateY(100vh) scale(0.1); }
}

@keyframes kanjiReveal {
  0% { 
    transform: scale(0) rotate(-30deg); 
    opacity: 0;
    filter: blur(10px);
  }
  30% { 
    transform: scale(1.2) rotate(0deg); 
    opacity: 1;
    filter: blur(0);
  }
  100% { 
    transform: scale(0.8) translateY(-100px) rotate(30deg);
    opacity: 0;
    filter: blur(5px);
  }
}

@keyframes inkExpand {
  0% { 
    transform: scale(0);
    opacity: 0;
  }
  50% { 
    transform: scale(1.5);
    opacity: 0.6;
  }
  100% { 
    transform: scale(2);
    opacity: 0;
  }
}

@keyframes waveRipple {
  0% { transform: scale(0); opacity: 1; }
  100% { transform: scale(3); opacity: 0; }
}

@keyframes bloodDrip {
  0% { transform: scaleY(0); opacity: 0; }
  100% { transform: scaleY(1); opacity: 1; }
}

@keyframes driftCar {
  0% { 
    transform: translateX(100vw) rotate(0deg);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% { 
    transform: translateX(-100vw) rotate(10deg);
    opacity: 0;
  }
}

@keyframes speedLine {
  0% {
    transform: translateX(-100%) scaleX(0);
    opacity: 0;
  }
  20% {
    opacity: 0.8;
  }
  100% {
    transform: translateX(100%) scaleX(2);
    opacity: 0;
  }
}

@keyframes neonHeart {
  0% {
    transform: scale(0.1) rotate(-30deg);
    opacity: 0;
  }
  20% {
    transform: scale(1.2) rotate(15deg);
    opacity: 1;
  }
  100% {
    transform: scale(0.5) rotate(30deg);
    opacity: 0;
  }
}

@keyframes tearfall {
  0% { transform: translateY(0) scale(1); opacity: 0.8; }
  80% { opacity: 0.8; }
  100% { transform: translateY(100vh) scale(0.5); opacity: 0; }
}

@keyframes glowPulse {
  0% { transform: scale(0.1); opacity: 0; }
  50% { transform: scale(1.5); opacity: 0.4; }
  100% { transform: scale(2); opacity: 0; }
}

@keyframes hopeShine {
  0% { transform: scale(0) rotate(0deg); opacity: 0; }
  50% { transform: scale(1.5) rotate(180deg); opacity: 0.8; }
  100% { transform: scale(0) rotate(360deg); opacity: 0; }
}

@keyframes blockFall {
  0% {
    transform: translateY(-50px) rotate(0deg);
    opacity: 1;
  }
  100% {
    transform: translateY(100vh) rotate(360deg);
    opacity: 1;
  }
}

@keyframes veinPulse {
  0%, 100% { opacity: 0.3; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.2); }
}

@keyframes fadeOutUp {
  0% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(-50px); opacity: 0; }
}

@keyframes floatAmongUs {
  0% { transform: translateY(0) scale(1) rotate(0deg); opacity: 0.8; }
  50% { transform: translateY(-30px) scale(1.1) rotate(10deg); opacity: 1; }
  100% { transform: translateY(0) scale(1) rotate(0deg); opacity: 0.8; }
}

@keyframes amongUsStar {
  0% { transform: translateY(100vh) scale(0.2); opacity: 0; }
  25% { opacity: 1; }
  90% { opacity: 0.8; }
  100% { transform: translateY(-20vh) scale(1); opacity: 0; }
}

@keyframes loveHeartBeat {
  0% { transform: scale(1); }
  50% { transform: scale(1.3); }
  100% { transform: scale(1); }
}

@keyframes aloneParticle {
  0% { transform: translateY(0) scale(0); opacity: 0; }
  50% { transform: translateY(100px) scale(1); opacity: 1; }
  100% { transform: translateY(200px) scale(0); opacity: 0.1; }
}

@keyframes cupidArrow {
  0% { transform: translateX(-100vw) translateY(0); }
  100% { transform: translateX(100vw) translateY(-20vh); }
}

@keyframes frogyJump {
  0% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-100px) scale(1.2); }
  100% { transform: translateY(0) scale(1); }
}

@keyframes criminalEffect {
  0% { 
    transform: translate(0, -50px) rotate(0deg) scale(0.5); 
    opacity: 0; 
  }
  20% { 
    transform: translate(-20px, 20vh) rotate(90deg) scale(1.2); 
    opacity: 1; 
  }
  40% { 
    transform: translate(20px, 40vh) rotate(180deg) scale(1); 
    opacity: 1; 
  }
  60% { 
    transform: translate(-20px, 60vh) rotate(270deg) scale(1.2); 
    opacity: 1; 
  }
  100% { 
    transform: translate(0, 100vh) rotate(360deg) scale(0.5); 
    opacity: 0; 
  }
}

@keyframes symphonyNote {
  0% { transform: scale(0) rotate(0deg); opacity: 0; }
  50% { transform: scale(1) rotate(180deg); opacity: 1; }
  100% { transform: scale(0) rotate(360deg); opacity: 0; }
}

@keyframes seeTinhLantern {
  0% { transform: translateY(0) scale(1); opacity: 0; }
  50% { transform: translateY(-100px) scale(1.2); opacity: 1; }
  100% { transform: translateY(-200px) scale(0.8); opacity: 0; }
}

@keyframes dontTalkBubble {
  0% { transform: scale(0.3) translateY(0); opacity: 0; }
  50% { transform: scale(1) translateY(-50px); opacity: 1; }
  100% { transform: scale(0.3) translateY(-100px); opacity: 0; }
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}

@keyframes rotate {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes shake {
  10%, 90% { transform: translate3d(-2px, 0, 0); }
  20%, 80% { transform: translate3d(4px, 0, 0); }
  30%, 50%, 70% { transform: translate3d(-8px, 0, 0); }
  40%, 60% { transform: translate3d(8px, 0, 0); }
}

@keyframes fall {
  0% { transform: translateY(0) rotate(0deg); }
  100% { transform: translateY(100vh) rotate(720deg); }
}

@keyframes legendSparkle {
  0% { transform: scale(0.1); opacity: 0; }
  50% { transform: scale(1.5); opacity: 1; }
  100% { transform: scale(0.1); opacity: 0; }
}

@keyframes heartFall {
  0% { transform: translateY(-50px) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  100% { transform: translateY(120vh) rotate(720deg); opacity: 0; }
}

@keyframes maskReveal {
  0% { transform: scale(0.1) rotate(-180deg); opacity: 0; }
  50% { transform: scale(1.2) rotate(0deg); opacity: 1; }
  100% { transform: scale(0.1) rotate(180deg); opacity: 0; }
}

@keyframes expandRing {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(3);
    opacity: 0;
  }
}

@keyframes sugarFall {
  0% {
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    transform: translateY(100vh) rotate(360deg);
    opacity: 0;
  }
}

@keyframes waveExpand {
  0% {
    transform: scaleX(0);
    opacity: 0.5;
  }
  50% {
    transform: scaleX(1);
    opacity: 0.8;
  }
  100% {
    transform: scaleX(0);
    opacity: 0;
  }
}

@keyframes fireRise {
  0% { 
    transform: translateY(0) scale(1);
    opacity: 0.8;
  }
  100% { 
    transform: translateY(-100px) scale(0.2);
    opacity: 0;
  }
}

@keyframes skyfallDrop {
  0% { transform: translateY(-50px) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  100% { transform: translateY(120vh) rotate(720deg); opacity: 0; }
}

@keyframes letterFall {
  0% { transform: translateY(-50px) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateY(120vh) rotate(720deg); opacity: 0; }
}

@keyframes moonGlow {
  0% { transform: scale(0.1); opacity: 0; }
  50% { transform: scale(1.2); opacity: 1; }
  100% { transform: scale(0.1); opacity: 0; }
}

@keyframes stereoWave {
  0% { transform: translate(-50%, -50%) scale(0); opacity: 1; }
  100% { transform: translate(-50%, -50%) scale(10); opacity: 0; }
}

@keyframes rocketLaunch {
  0% { transform: translateY(0) scale(0.1); opacity: 0; }
  20% { transform: translateY(-100px) scale(1); opacity: 1; }
  100% { transform: translateY(-120vh) scale(0.1); opacity: 0; }
}

@keyframes tusaFloat {
  0% { transform: translateY(0) rotate(0deg); opacity: 0; }
  20% { opacity: 1; }
  100% { transform: translateY(120vh) rotate(360deg); opacity: 0; }
}

@keyframes floatBottom {
  0% {
    transform: translateY(0) rotate(0deg);
    opacity: 0.8;
  }
  50% {
    transform: translateY(-100px) rotate(180deg);
    opacity: 0.5;
  }
  100% {
    transform: translateY(-200px) rotate(360deg);
    opacity: 0;
  }
}

@keyframes floatLeft {
  0% {
    transform: translate(0, 100px) rotate(0deg);
    opacity: 0.8;
  }
  50% {
    transform: translate(100px, -50px) rotate(180deg);
    opacity: 0.5;
  }
  100% {
    transform: translate(200px, -200px) rotate(360deg);
    opacity: 0;
  }
}

@keyframes floatRight {
  0% {
    transform: translate(0, 100px) rotate(0deg);
    opacity: 0.8;
  }
  50% {
    transform: translate(-100px, -50px) rotate(180deg);
    opacity: 0.5;
  }
  100% {
    transform: translate(-200px, -200px) rotate(360deg);
    opacity: 0;
  }
}

@keyframes sheSad {
  0% { transform: translate(-5px, 0); }
  25% { transform: translate(5px, 0); }
  50% { transform: translate(-3px, 0); }
  75% { transform: translate(3px, 0); }
  100% { transform: translate(-5px, 0); }
}

@keyframes snowfall {
  0% {
    transform: translateY(-10px);
    opacity: 0.8;
  }
  100% {
    transform: translateY(100vh) translateX(20px);
    opacity: 0.3;
  }
}

@keyframes bubbleCounter {
  0%, 100% { transform: translate(-50%, 0) scale(1); }
  50% { transform: translate(-50%, -10px) scale(1.05); }
}

@keyframes heartBeat {
  0% { transform: translate(-50%, 0) scale(1); }
  14% { transform: translate(-50%, 0) scale(1.1); }
  28% { transform: translate(-50%, 0) scale(1); }
  42% { transform: translate(-50%, 0) scale(1.1); }
  70% { transform: translate(-50%, 0) scale(1); }
}

@keyframes changeSkin {
  0% { transform: scale(1) rotate(0deg); opacity: 1; }
  50% { transform: scale(0.8) rotate(180deg); opacity: 0; }
  100% { transform: scale(1) rotate(360deg); opacity: 1; }
}

@keyframes pulse {
  0% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(1.1); }
  100% { transform: translate(-50%, -50%) scale(1); }
}

@keyframes bubbleFloat {
  0% {
    transform: translateY(0) scale(0.3);
    opacity: 0;
  }
  20% {
    opacity: 0.8;
  }
  100% {
    transform: translateY(-100vh) scale(1.2);
    opacity: 0;
  }
}

@keyframes fadeInOut {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.5); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.2); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(0.5); }
}

@keyframes spin {
  0% { transform: rotateY(0deg); }
  100% { transform: rotateY(360deg); }
}

@keyframes rapTextAnim {
  0% {
    transform: scale(0.5) rotate(-10deg);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  100% {
    transform: scale(1.2) rotate(10deg);
    opacity: 0;
  }
}

@keyframes moveStripes {
  from { transform: translateX(-100px); }
  to { transform: translateX(100px); }
}

@keyframes tileGlow {
  from { box-shadow: 0 0 10px rgba(255, 255, 255, 0.5); }
  to { box-shadow: 0 0 20px rgba(255, 255, 255, 0.8); }
}

@keyframes dubstepColors {
  0% { background: #052e00; }
  20% { background: #002e52; }
  40% { background: #2e0052; }
  60% { background: #520030; }
  80% { background: #525200; }
  100% { background: #052e00; }
}

@keyframes fadeInOut {
  0% { opacity: 0; transform: scale(0.5); }
  50% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(0.5); }
}

@keyframes colorChange {
  0% { background: #ff0000; }
  20% { background: #ff00ff; }
  40% { background: #0000ff; }
  60% { background: #00ff00; }
  80% { background: #ffff00; }
  100% { background: #ff0000; }
}

@keyframes shadowPulse {
  0%, 100% { background: #000; }
  50% { background: #1a1a1a; }
}

@keyframes neonSweep {
  0% { transform: translateX(-100%) skewX(-45deg); }
  100% { transform: translateX(100%) skewX(-45deg); }
}

@keyframes germanFloat {
  0% {
    transform: translateY(100vh) rotate(-20deg);
    opacity: 0;
  }
  50% {
    transform: translateY(50vh) rotate(0deg);
    opacity: 1;
  }
  100% {
    transform: translateY(-20vh) rotate(20deg);
    opacity: 0;
  }
}

@keyframes containerPulse {
  0%, 100% { box-shadow: 0 0 50px rgba(0, 255, 136, 0.4), inset 0 0 30px rgba(0, 255, 136, 0.2); }
  50% { box-shadow: 0 0 70px rgba(0, 255, 136, 0.6), inset 0 0 50px rgba(0, 255, 136, 0.3); }
}

@keyframes waveform {
  0%, 100% { height: 100px; }
  50% { height: 300px; }
}

@keyframes rainfall {
  0% { transform: translate3d(0, -20px, 0) skewX(-15deg); }
  100% { transform: translate3d(0, 100vh, 0) skewX(-15deg); }
}

@keyframes lightning {
  0%, 95%, 98% { background: linear-gradient(to bottom, #1a1a1a, #000833); }
  96%, 99% { background: #fafafa; filter: brightness(1.2); }
  97%, 100% { background: linear-gradient(to bottom, #1a1a1a, #4a4a4a); }
}

@keyframes sigmaFloat {
  0% { transform: scale(0.5) rotate(0deg); }
  50% { transform: scale(1.2) rotate(180deg); }
  100% { transform: scale(0.5) rotate(360deg); }
}

@keyframes twinkle {
  0% {
    transform: scale(0) rotate(0deg);
    opacity: 0;
  }
  50% {
    transform: scale(1.5) rotate(360deg);
    opacity: 1;
  }
  100% {
    transform: scale(0) rotate(720deg);
    opacity: 0;
  }
}

@keyframes starTwinkle {
  0%, 100% { 
    opacity: 0;
    box-shadow: 0 0 0 white;
  }
  50% { 
    opacity: 1;
    box-shadow: 0 0 10px white, 0 0 20px white, 0 0 30px white;
  }
}

@keyframes orbit {
  from {
    transform: rotate(0deg) translate(250px) rotate(0deg);
  }
  to {
    transform: rotate(360deg) translate(250px) rotate(-360deg);
  }
}

@keyframes romanianFloat {
  0% {
    transform: translateY(100vh) scale(0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: translateY(-100px) scale(1);
    opacity: 0;
  }
}

@keyframes gagaFloat {
  0% {
    transform: translateY(100vh) rotate(0deg);
    opacity: 0;
  }
  50% {
    transform: translateY(50vh) rotate(180deg);
    opacity: 1;
  }
  100% {
    transform: translateY(-20vh) rotate(360deg);
    opacity: 0;
  }
}

@keyframes windmillSpin {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}

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

@keyframes noodleFall {
  0% {
    transform: translateY(-20px) rotate(0deg);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    transform: translateY(100vh) rotate(720deg);
    opacity: 0;
  }
}