/* Ambient Clean Minimal Background */
body {
    background-color: #F8FAFC;
    background-image:
        radial-gradient(circle at 10% 20%, rgba(2, 132, 199, 0.04) 0%, transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(34, 197, 94, 0.04) 0%, transparent 40%),
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 1) 0%, rgba(248, 250, 252, 1) 100%);
}

/* Dash animation for gray dashed spoke lines */
@keyframes spokeDash {
    to {
        stroke-dashoffset: -20;
    }
}

.gray-spoke-line {
    stroke: #94A3B8;
    stroke-width: 2.2;
    stroke-dasharray: 5, 5;
    animation: spokeDash 2.5s linear infinite;
}

/* Message Pulse Effect */
@keyframes clickPulse {
    0% {
        transform: scale(0.8);
        opacity: 0;
    }

    50% {
        transform: scale(1.15);
        opacity: 1;
    }

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

.click-green-badge {
    animation: clickPulse 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

/* Focus states for accessibility */
input:focus-visible,
button:focus-visible,
a:focus-visible {
    outline: 2px solid #0052CC;
    outline-offset: 2px;
}