/* Game FX Animations */

/* Pop Animation (Success) */
@keyframes pop {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
        filter: brightness(1.3);
    }

    100% {
        transform: scale(1);
        filter: brightness(1);
    }
}

/* Shake Animation (Error) */
@keyframes shake {
    0% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-5px);
    }

    50% {
        transform: translateX(5px);
    }

    75% {
        transform: translateX(-5px);
    }

    100% {
        transform: translateX(0);
    }
}

/* Float Up Animation (Feedback Text) */
@keyframes floatUp {
    0% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    100% {
        opacity: 0;
        transform: translateY(-50px) scale(1.2);
    }
}

/* Particle Explosion */
@keyframes particleFade {
    0% {
        opacity: 1;
        transform: translate(0, 0) scale(1);
    }

    100% {
        opacity: 0;
        transform: translate(var(--tx), var(--ty)) scale(0);
    }
}

/* Feedback Overlay */
.feedback-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 9999;
}

.feedback-text {
    font-family: 'Cinzel', serif;
    font-size: 1.5rem;
    font-weight: bold;
    color: #ffd700;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.8);
    position: absolute;
    animation: floatUp 1s ease-out forwards;
}

.feedback-text.error {
    color: #ff4444;
    text-shadow: 0 0 10px rgba(255, 68, 68, 0.8);
}

.particle {
    position: absolute;
    width: 8px;
    height: 8px;
    background: gold;
    border-radius: 50%;
    animation: particleFade 0.8s ease-out forwards;
}

/* Button States */
.option-btn.correct {
    background: linear-gradient(90deg, #00c853, #69f0ae) !important;
    border-color: #b9f6ca !important;
    color: #000 !important;
    box-shadow: 0 0 15px #00e676;
    animation: pop 0.4s ease-out;
}

.option-btn.wrong {
    background: rgba(255, 68, 68, 0.2) !important;
    border-color: #ff4444 !important;
    color: #ffcccc !important;
    animation: shake 0.4s ease-in-out;
}

/* Return Sweep Impact Pulse (Visual Feedback) */
@keyframes impactPulseAnim {
    0% {
        transform: translate(-50%, -50%) scale(1);
        box-shadow: 0 0 10px rgba(138, 43, 226, 0.5);
        /* Blue/Purple glow */
        background: rgba(138, 43, 226, 0.1);
    }

    50% {
        transform: translate(-50%, -50%) scale(2.0);
        box-shadow: 0 0 40px rgba(0, 255, 255, 0.8), 0 0 80px rgba(138, 43, 226, 0.5);
        background: rgba(255, 255, 255, 0.6);
    }

    100% {
        transform: translate(-50%, -50%) scale(1.2);
        box-shadow: 0 0 20px rgba(138, 43, 226, 0.0);
        background: rgba(255, 255, 255, 0.0);
    }
}

.impact-pulse {
    /* Use !important to override default cursor styles temporarily */
    animation: impactPulseAnim 0.6s ease-out forwards !important;
    border-radius: 50%;
    z-index: 10001;
    /* Ensure on top */
}