/* Skeleton shimmer */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.skeleton {
  background: linear-gradient(
    90deg,
    var(--bg-secondary) 25%,
    var(--bg-tertiary) 50%,
    var(--bg-secondary) 75%
  );
  background-size: 200% 100%;
  animation: shimmer 1.5s ease infinite;
  border-radius: var(--radius);
}

.skeleton--text {
  height: 1em;
  width: 60%;
  margin: var(--space-2) 0;
}

.skeleton--card {
  height: 120px;
  width: 100%;
  margin-bottom: var(--space-4);
}

.skeleton--row {
  height: 48px;
  width: 100%;
  margin-bottom: var(--space-2);
}

/* Staggered fade-in */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.reveal {
  opacity: 0;
  animation: fadeUp 0.4s ease forwards;
}

.reveal-stagger > * {
  opacity: 0;
  animation: fadeUp 0.4s ease forwards;
}

.reveal-stagger > *:nth-child(1) { animation-delay: 0ms; }
.reveal-stagger > *:nth-child(2) { animation-delay: 55ms; }
.reveal-stagger > *:nth-child(3) { animation-delay: 110ms; }
.reveal-stagger > *:nth-child(4) { animation-delay: 165ms; }
.reveal-stagger > *:nth-child(5) { animation-delay: 220ms; }
.reveal-stagger > *:nth-child(6) { animation-delay: 275ms; }
.reveal-stagger > *:nth-child(7) { animation-delay: 330ms; }
.reveal-stagger > *:nth-child(8) { animation-delay: 385ms; }
.reveal-stagger > *:nth-child(9) { animation-delay: 440ms; }
.reveal-stagger > *:nth-child(10) { animation-delay: 495ms; }

/* Page transition */
@keyframes pageOut {
  to {
    opacity: 0;
    transform: translateY(-8px);
  }
}

@keyframes pageIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.page-exit {
  animation: pageOut 0.15s ease forwards;
}

.page-enter {
  animation: pageIn 0.3s ease forwards;
}

/* Count-up shimmer effect on APY */
@keyframes apyGlow {
  0% { text-shadow: 0 0 8px rgba(197, 240, 46, 0.6); }
  100% { text-shadow: none; }
}

.apy-counted {
  animation: apyGlow 0.6s ease forwards;
}
