/* GSAP-driven animations - this file handles initial states only.
   GSAP handles the actual animations in animations.js */

/* Cards start invisible, GSAP will reveal them */
.category-card {
    opacity: 0;
    transform: translateY(20px);
}

/* Score ring glow effect */
.score-ring-wrapper::after {
    content: '';
    position: absolute;
    inset: -20px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--purple-glow) 0%, transparent 70%);
    opacity: 0;
    transition: opacity 0.5s;
}

.score-ring-wrapper.revealed::after {
    opacity: 0.5;
}

/* Shimmer effect for loading */
@keyframes shimmer {
    0% { background-position: -200% center; }
    100% { background-position: 200% center; }
}

.loading-title .gradient-text {
    background-size: 200% auto;
    animation: shimmer 3s linear infinite;
}

/* Card entrance complete state */
.category-card.revealed {
    opacity: 1;
    transform: translateY(0);
}