@keyframes blob {
    0% { transform: translate(0px, 0px) scale(1); }
    33% { transform: translate(30px, -50px) scale(1.1); }
    66% { transform: translate(-20px, 20px) scale(0.9); }
    100% { transform: translate(0px, 0px) scale(1); }
}

.animate-blob {
    animation: blob 7s infinite;
}

.animation-delay-2000 {
    animation-delay: 2s;
}

.animation-delay-4000 {
    animation-delay: 4s;
}

.animate-bounce-slow {
    animation: bounce 3s infinite;
}

@keyframes loading-dots-pulse {
    0%, 80%, 100% {
        transform: scale(0.6);
        opacity: 0.35;
    }
    40% {
        transform: scale(1);
        opacity: 1;
    }
}

.loading-dots {
    --loading-dot-size: 0.45rem;
    --loading-dot-gap: 0.35rem;
    --loading-dot-color: currentColor;
    display: inline-flex;
    align-items: center;
    gap: var(--loading-dot-gap);
}

.loading-dots span {
    width: var(--loading-dot-size);
    height: var(--loading-dot-size);
    border-radius: 9999px;
    background: var(--loading-dot-color);
    animation: loading-dots-pulse 1.1s ease-in-out infinite;
}

.loading-dots span:nth-child(2) {
    animation-delay: 0.15s;
}

.loading-dots span:nth-child(3) {
    animation-delay: 0.3s;
}

.loading-button {
    position: relative;
}

.loading-button .loading-label {
    transition: opacity 0.2s ease;
}

.loading-button .loading-dots {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

.loading-button[aria-busy="true"] .loading-label {
    opacity: 0;
}

.loading-button[aria-busy="true"] .loading-dots {
    opacity: 1;
}