/* ========== АНИМАЦИИ ========== */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes heartbeat {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
}

@keyframes nevalyashka {
    0% { transform: rotate(0deg); }
    20% { transform: rotate(-8deg); }
    40% { transform: rotate(6deg); }
    60% { transform: rotate(-4deg); }
    80% { transform: rotate(2deg); }
    100% { transform: rotate(0deg); }
}

@keyframes nevalyashkaRotated {
    0% { transform: rotate(12deg); }
    20% { transform: rotate(4deg); }
    40% { transform: rotate(18deg); }
    60% { transform: rotate(8deg); }
    80% { transform: rotate(14deg); }
    100% { transform: rotate(12deg); }
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.animate-spin {
    animation: spin 1s linear infinite;
}

.heart-beat {
    animation: heartbeat 2.5s infinite;
}

.animate-nevalyashka {
    animation: nevalyashka 0.8s cubic-bezier(0.45, 0.05, 0.55, 0.95);
    transform-origin: bottom center;
}

.animate-nevalyashka-rotated {
    animation: nevalyashkaRotated 0.8s cubic-bezier(0.45, 0.05, 0.55, 0.95);
    transform-origin: bottom center;
}

/* Уведомления */
#customNotification {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 1000;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 640px) {
    #customNotification {
        bottom: 16px;
        right: 16px;
        left: 16px;
    }
    #customNotification > div {
        max-width: none;
        width: calc(100% - 32px);
    }
}