@keyframes spiralAppear {
            0% { opacity: 0; transform: scale(0) rotate(180deg) translateX(200px) translateY(200px); }
            50% { opacity: 0.7; transform: scale(1.1) rotate(90deg) translateX(50px) translateY(50px); }
            100% { opacity: 1; transform: scale(1) rotate(0deg) translateX(0) translateY(0); }
        }

        @keyframes bounceAppear {
            0% { opacity: 0; transform: translateY(-100px) scale(0.3) rotate(-10deg); }
            50% { opacity: 0.8; transform: translateY(20px) scale(1.1) rotate(5deg); }
            70% { transform: translateY(-10px) scale(0.95) rotate(-2deg); }
            85% { transform: translateY(5px) scale(1.02) rotate(1deg); }
            100% { opacity: 1; transform: translateY(0) scale(1) rotate(0deg); }
        }

        @keyframes fadeAppear {
            0% { opacity: 0; transform: scale(0.8) translateY(20px); filter: blur(5px); }
            60% { opacity: 0.8; transform: scale(1.05) translateY(-5px); filter: blur(1px); }
            100% { opacity: 1; transform: scale(1) translateY(0); filter: blur(0px); }
        }
        @keyframes flipAppear {
            0% { opacity: 0; transform: rotateX(90deg) scale(0.8) translateZ(-100px); }
            40% { opacity: 0.7; transform: rotateX(-15deg) scale(1.1) translateZ(20px); }
            70% { transform: rotateX(10deg) scale(0.95) translateZ(-10px); }
            100% { opacity: 1; transform: rotateX(0deg) scale(1) translateZ(0px); }
        }
        @keyframes zoomAppear {
            0% { opacity: 0; transform: scale(0) rotateZ(180deg); filter: brightness(2) blur(10px); }
            30% { opacity: 0.6; transform: scale(0.3) rotateZ(90deg); filter: brightness(1.5) blur(5px); }
            60% { opacity: 0.9; transform: scale(1.15) rotateZ(-10deg); filter: brightness(1.2) blur(1px); }
            80% { transform: scale(0.95) rotateZ(5deg); filter: brightness(1.1) blur(0px); }
            100% { opacity: 1; transform: scale(1) rotateZ(0deg); filter: brightness(1) blur(0px); }
        }

        @keyframes waveAppear {
            0% { opacity: 0; transform: translateY(50px) skewX(15deg) rotateZ(-5deg); }
            25% { opacity: 0.4; transform: translateY(20px) skewX(-10deg) rotateZ(3deg); }
            50% { opacity: 0.7; transform: translateY(-10px) skewX(8deg) rotateZ(-2deg); }
            75% { opacity: 0.9; transform: translateY(5px) skewX(-3deg) rotateZ(1deg); }
            100% { opacity: 1; transform: translateY(0) skewX(0deg) rotateZ(0deg); }
        }

        @keyframes pulseAppear {
            0% { opacity: 0; transform: scale(0); box-shadow: 0 0 0 0 rgba(255, 107, 107, 0.7); }
            20% { opacity: 0.3; transform: scale(0.4); box-shadow: 0 0 0 20px rgba(255, 107, 107, 0.5); }
            40% { opacity: 0.6; transform: scale(0.8); box-shadow: 0 0 0 40px rgba(78, 205, 196, 0.3); }
            60% { opacity: 0.8; transform: scale(1.1); box-shadow: 0 0 0 60px rgba(69, 183, 209, 0.2); }
            80% { opacity: 0.95; transform: scale(0.95); box-shadow: 0 0 0 80px rgba(150, 206, 180, 0.1); }
            100% { opacity: 1; transform: scale(1); box-shadow: 0 0 0 0 rgba(254, 202, 87, 0); }
        }

        @keyframes rainFallSway {
            0% { 
                opacity: 0; 
                transform: translateY(-100vh) translateX(0px) rotate(0deg) scale(0.8); 
            }
            10% { 
                opacity: 1; 
                transform: translateY(-80vh) translateX(10px) rotate(2deg) scale(0.9); 
            }
            25% { 
                transform: translateY(-60vh) translateX(-5px) rotate(-1deg) scale(1); 
            }
            50% { 
                transform: translateY(-30vh) translateX(15px) rotate(3deg) scale(1.05); 
            }
            75% { 
                transform: translateY(-10vh) translateX(-8px) rotate(-2deg) scale(1); 
            }
            90% { 
                transform: translateY(5vh) translateX(5px) rotate(1deg) scale(0.95); 
            }
            100% { 
                opacity: 0.8; 
                transform: translateY(110vh) translateX(0px) rotate(0deg) scale(0.9); 
            }
        }

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

        @keyframes blockAppear {
            0% { 
                opacity: 0; 
                transform: translateY(-30px) scale(0.9); 
            }
            50% { 
                opacity: 0.8; 
                transform: translateY(5px) scale(1.05); 
            }
            100% { 
                opacity: 1; 
                transform: translateY(0) scale(1); 
            }
        }

        @keyframes smoothCardAppear {
            0% { opacity: 0; transform: translateY(20px) scale(0.8); }
            50% { opacity: 0.8; transform: translateY(-3px) scale(1.05); }
            100% { opacity: 1; transform: translateY(0) scale(1); }
        }

        @keyframes smoothSymbolAppear {
            0% { opacity: 0; transform: translateY(15px) scale(0.7) rotate(-10deg); }
            50% { opacity: 0.8; transform: translateY(-2px) scale(1.1) rotate(5deg); }
            100% { opacity: 1; transform: translateY(0) scale(1) rotate(0deg); }
        }

        @keyframes smoothTotalAppear {
            0% { opacity: 0; transform: translateY(20px) scale(0.8); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); }
            30% { opacity: 0.6; transform: translateY(-5px) scale(1.15); box-shadow: 0 6px 15px rgba(255, 215, 0, 0.4); }
            60% { opacity: 0.9; transform: translateY(2px) scale(0.95); box-shadow: 0 4px 12px rgba(255, 215, 0, 0.3); }
            100% { opacity: 1; transform: translateY(0) scale(1); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4); }
        }

        @keyframes lightTotalAppear {
            0% {
                opacity: 0;
                transform: scale(2.5);
                box-shadow: 0 0 0 0 rgba(78, 205, 196, 0.7);
            }
            30% {
                opacity: 0.6;
                transform: scale(1.3);
                box-shadow: 0 0 0 12px rgba(78, 205, 196, 0.4);
            }
            60% {
                opacity: 0.8;
                transform: scale(0.8);
                box-shadow: 0 0 0 20px rgba(78, 205, 196, 0.2);
            }
            80% {
                opacity: 0.95;
                transform: scale(1.1);
                box-shadow: 0 0 0 25px rgba(78, 205, 196, 0.1);
            }
            100% {
                opacity: 1;
                transform: scale(1);
                box-shadow: 0 3px 8px rgba(0, 0, 0, 0.4);
            }
        }

        @keyframes lightSymbolAppear {
            0% {
                opacity: 0;
                transform: scale(1.8) rotate(-20deg);
            }
            50% {
                opacity: 0.8;
                transform: scale(0.8) rotate(10deg);
            }
            80% {
                opacity: 0.95;
                transform: scale(1.05) rotate(-5deg);
            }
            100% {
                opacity: 1;
                transform: scale(1) rotate(0deg);
            }
        }

        @keyframes lightNumberAppear {
            0% {
                opacity: 0;
                transform: scale(2.0);
            }
            40% {
                opacity: 0.7;
                transform: scale(0.8);
            }
            70% {
                opacity: 0.9;
                transform: scale(1.1);
            }
            100% {
                opacity: 1;
                transform: scale(1);
            }
        }

        @keyframes pulseGlow {
            0% { box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3); }
            50% { box-shadow: 0 6px 25px rgba(255, 107, 107, 0.6); }
            100% { box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3); }
        }

        @keyframes handPoint {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(-8px);
            }
        }

        @keyframes arrowBounce {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(10px);
            }
        }

        @keyframes tryButtonPulse {
            0%, 100% {
                transform: scale(1);
                box-shadow: 0 4px 15px rgba(255, 107, 107, 0.4);
            }
            50% {
                transform: scale(1.05);
                box-shadow: 0 6px 25px rgba(255, 107, 107, 0.7);
            }
        }

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

        @keyframes startupGlow {
            0% { text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5), 0 0 20px rgba(255, 255, 255, 0.3); }
            100% { text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5), 0 0 30px rgba(255, 255, 255, 0.6); }
        }

        @keyframes rainFall {
            0% {
                transform: translateY(-100px) rotate(0deg);
                opacity: 0;
            }
            10% {
                opacity: 1;
            }
            90% {
                opacity: 1;
            }
            100% {
                transform: translateY(calc(100vh + 100px)) rotate(360deg);
                opacity: 0;
            }
        }

        @keyframes rejectionPulse {
            0%, 100% { 
                transform: scale(1); 
                box-shadow: 0 4px 16px rgba(220, 53, 69, 0.4); 
            }
            50% { 
                transform: scale(1.02); 
                box-shadow: 0 6px 20px rgba(220, 53, 69, 0.6); 
            }
        }
        
        @keyframes warningPulse {
            0%, 100% { transform: scale(1); box-shadow: 0 4px 12px rgba(255, 107, 107, 0.3); }
            50% { transform: scale(1.02); box-shadow: 0 6px 16px rgba(255, 107, 107, 0.5); }
        }

      @keyframes shimmer {
            0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); }
            50% { transform: translateX(100%) translateY(100%) rotate(45deg); }
            100% { transform: translateX(-100%) translateY(-100%) rotate(45deg); }
        }

         @keyframes welcomeGlow {
            0% { text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5), 0 0 20px rgba(255, 255, 255, 0.3); }
            100% { text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5), 0 0 30px rgba(255, 255, 255, 0.6); }
        }

        @keyframes taglineFade {
            0% { opacity: 0; transform: translateY(20px); }
            100% { opacity: 1; transform: translateY(0); }
        }

        @keyframes symbolBounce {
            0%, 20%, 50%, 80%, 100% { 
                opacity: 1;
                transform: translateY(0); 
            }
            40% { 
                transform: translateY(-10px); 
            }
            60% { 
                transform: translateY(-5px); 
            }
        }

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

        @keyframes bounce {
            0%, 20%, 50%, 80%, 100% {
                transform: translateY(0);
            }
            40% {
                transform: translateY(-10px);
            }
            60% {
                transform: translateY(-5px);
            }
        }

        @keyframes highlight {
            0% { box-shadow: 0 0 0 0 rgba(255, 215, 0, 0.7); }
            25% { box-shadow: 0 0 20px 10px rgba(255, 215, 0, 0.5); }
            50% { box-shadow: 0 0 30px 15px rgba(255, 215, 0, 0.3); }
            75% { box-shadow: 0 0 20px 10px rgba(255, 215, 0, 0.5); }
            100% { box-shadow: 0 0 0 0 rgba(255, 215, 0, 0); }
        }

      /* Animations */
        @keyframes mysteryPulse {
            0%, 100% { 
                text-shadow: 0 0 20px rgba(255, 215, 0, 0.6);
                transform: scale(1);
            }
            50% { 
                text-shadow: 0 0 30px rgba(255, 215, 0, 0.9), 0 0 40px rgba(255, 215, 0, 0.6);
                transform: scale(1.05);
            }
        }

        @keyframes floatOrbit {
            0% { 
                transform: rotate(0deg) translateX(35px) rotate(0deg);
                opacity: 0.4;
            }
            50% {
                opacity: 1;
            }
            100% { 
                transform: rotate(360deg) translateX(35px) rotate(-360deg);
                opacity: 0.4;
            }
        }

        @keyframes logoGlow {
            0%, 100% { opacity: 0.5; transform: scale(1) rotate(0deg); }
            50% { opacity: 0.8; transform: scale(1.1) rotate(180deg); }
        }