/* =============================================
   LET'S SCORE - Animations
   ============================================= */

/* Card entrance */
@keyframes cardIn {
  from {
    opacity: 0;
    transform: translateY(24px) scale(0.94);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.card-animate {
  animation: cardIn 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* Stagger effect for grids */
.player-card:nth-child(1)  { animation-delay: 0.03s; }
.player-card:nth-child(2)  { animation-delay: 0.06s; }
.player-card:nth-child(3)  { animation-delay: 0.09s; }
.player-card:nth-child(4)  { animation-delay: 0.12s; }
.player-card:nth-child(5)  { animation-delay: 0.15s; }
.player-card:nth-child(6)  { animation-delay: 0.18s; }
.player-card:nth-child(7)  { animation-delay: 0.21s; }
.player-card:nth-child(8)  { animation-delay: 0.24s; }
.player-card:nth-child(9)  { animation-delay: 0.27s; }
.player-card:nth-child(10) { animation-delay: 0.30s; }
.player-card:nth-child(11) { animation-delay: 0.33s; }
.player-card:nth-child(12) { animation-delay: 0.36s; }

/* Fade in up */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

.fade-up {
  animation: fadeUp 0.6s ease forwards;
}

/* Countdown pulse on urgent */
@keyframes pulse-green {
  0%   { box-shadow: 0 0 0 0 rgba(46,170,56,0.5); }
  70%  { box-shadow: 0 0 0 10px rgba(46,170,56,0); }
  100% { box-shadow: 0 0 0 0 rgba(46,170,56,0); }
}

.countdown-urgent .countdown-num {
  animation: pulse-green 1.5s infinite;
  border-color: var(--green-400);
  color: #4dcc57;
}

/* Glow pulse for registration button */
@keyframes btnGlow {
  0%, 100% { box-shadow: 0 4px 20px rgba(46,170,56,0.35); }
  50%       { box-shadow: 0 4px 30px rgba(46,170,56,0.65); }
}

.btn-primary.pulse {
  animation: btnGlow 2s ease-in-out infinite;
}

/* Shimmer loading effect */
@keyframes shimmer {
  from { background-position: -400px 0; }
  to   { background-position: 400px 0; }
}

.skeleton {
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0.04) 0%,
    rgba(255,255,255,0.1) 50%,
    rgba(255,255,255,0.04) 100%
  );
  background-size: 800px 100%;
  animation: shimmer 1.6s infinite;
  border-radius: var(--radius-sm);
}

.skeleton-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  margin: 0 auto 0.75rem;
}

.skeleton-line {
  height: 12px;
  margin-bottom: 0.5rem;
  width: 80%;
  margin-inline: auto;
}

.skeleton-line-short {
  height: 10px;
  width: 55%;
  margin-inline: auto;
}

/* Hero logo pulse animation */
@keyframes logoPulse {
  0%   { transform: scale(1); filter: drop-shadow(0 0 0 rgba(46, 170, 56, 0)); }
  50%  { transform: scale(1.08); filter: drop-shadow(0 0 20px rgba(46, 170, 56, 0.4)); }
  100% { transform: scale(1); filter: drop-shadow(0 0 0 rgba(46, 170, 56, 0)); }
}

.hero-ball {
  display: block;
  margin: 0 auto 1rem;
  animation: logoPulse 3s ease-in-out infinite;
  width: 120px;
  height: 120px;
}

/* Star rating fill animation */
@keyframes starFill {
  from { transform: scale(0); opacity: 0; }
  to   { transform: scale(1); opacity: 1; }
}

/* Registration success pop */
@keyframes popIn {
  0%   { transform: scale(0.5); opacity: 0; }
  70%  { transform: scale(1.08); }
  100% { transform: scale(1); opacity: 1; }
}

.pop-in {
  animation: popIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* Waiting list slide */
@keyframes slideRight {
  from { opacity: 0; transform: translateX(30px); }
  to   { opacity: 1; transform: translateX(0); }
}

.slide-in { animation: slideRight 0.4s ease forwards; }

/* Team card appear */
@keyframes teamReveal {
  from { opacity: 0; transform: scale(0.88) rotateY(10deg); }
  to   { opacity: 1; transform: scale(1) rotateY(0); }
}

.team-reveal {
  animation: teamReveal 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.team-card:nth-child(2) { animation-delay: 0.15s; }