/* ============================================================
   MD3 Animations
   ============================================================ */

/* ── Page enter ────────────────────────────────────────────── */
@keyframes page-enter {
  from { opacity:0; transform: translateY(8px); }
  to   { opacity:1; transform: translateY(0); }
}
.page-enter {
  animation: page-enter 180ms var(--ease-decelerate) both;
}

/* ── Fade in ───────────────────────────────────────────────── */
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.fade-in { animation: fade-in var(--dur-med2) var(--ease-standard) both; }

/* ── Slide up ──────────────────────────────────────────────── */
@keyframes slide-up {
  from { opacity:0; transform: translateY(40px); }
  to   { opacity:1; transform: translateY(0); }
}
.slide-up { animation: slide-up 180ms var(--ease-decelerate) both; }

/* ── Scale in (for cards / dialogs) ─────────────────────────── */
@keyframes scale-in {
  from { opacity:0; transform: scale(.9); }
  to   { opacity:1; transform: scale(1); }
}
.scale-in { animation: scale-in 160ms var(--ease-decelerate) both; }

/* ── Stagger children ──────────────────────────────────────── */
.stagger > * { animation: fade-in 160ms var(--ease-standard) both; }
.stagger > *:nth-child(n) { animation-delay: 0ms; }

/* ── Hero gradient animation ───────────────────────────────── */
@keyframes hero-glow {
  0%   { transform: translate(-15%,-15%) scale(1);   }
  50%  { transform: translate(  5%, 10%) scale(1.1); }
  100% { transform: translate(-15%,-15%) scale(1);   }
}
.hero-glow-orb {
  animation: hero-glow 12s var(--ease-standard) infinite;
}

/* ── Pulse ─────────────────────────────────────────────────── */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: .5; }
}
.pulse { animation: pulse 2s ease-in-out infinite; }

/* ── Bounce in (for success states) ─────────────────────────── */
@keyframes bounce-in {
  0%   { transform: scale(0); }
  60%  { transform: scale(1.1); }
  100% { transform: scale(1); }
}
.bounce-in { animation: bounce-in var(--dur-med3) var(--ease-decelerate) both; }

/* ── Shimmer (skeleton loading) ─────────────────────────────── */
@keyframes shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}
.skeleton {
  background: linear-gradient(
    90deg,
    var(--md-surface-high)      25%,
    var(--md-surface-highest)   37%,
    var(--md-surface-high)      63%
  );
  background-size: 800px 100%;
  animation: shimmer 1.4s ease infinite;
  border-radius: var(--shape-sm);
}
.skeleton-text  { height: 16px; margin: 6px 0; }
.skeleton-title { height: 24px; margin: 12px 0; }
.skeleton-card  { height: 120px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 1ms !important;
  }
}
