/* Contenedor de partículas de nieve */
#contenedor-nieve-focalizada {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9999;
}

/* Cada bola de nieve */
.particula-nieve-focalizada {
    position: absolute;
    width: var(--size);
    height: var(--size);
    background-color: white;
    border-radius: 50%;
    opacity: 1;
    box-shadow: 0 0 4px rgba(255, 255, 255, 0.7);
    animation-name: explosionCircular;
    animation-fill-mode: forwards;
}

/* Animación de explosión circular y caída */
@keyframes explosionCircular {
    0% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
    }

    50% {
        transform: translate(var(--picoX), var(--picoY)) scale(1.2);
        opacity: 1;
    }

    100% {
        transform: translate(var(--picoX), var(--caidaY)) scale(0.3);
        opacity: 0;
    }
}

/* POPUP */
.pop {
    animation: pop 0.3s ease forwards;
}

@keyframes pop {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.5);
    }

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

.like-anim {
    animation: burst 0.45s ease-out forwards;
}

@keyframes burst {
    0% {
        transform: scale(1) rotate(0deg);
    }

    50% {
        transform: scale(1.7) rotate(10deg);
    }

    100% {
        transform: scale(1) rotate(0deg);
    }
}