/**
 * css/animations.css — 60fps GPU Animations
 */
@keyframes pageFadeSlideIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes staggerItemIn { from { opacity: 0; transform: translateY(12px) scale(0.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes pulseFlame { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
@keyframes skeletonPulse { 0%, 100% { opacity: 0.45; } 50% { opacity: 0.85; } }

.page-enter { animation: pageFadeSlideIn var(--dur-normal) var(--ease-out) forwards; }
.stagger-list > * { opacity: 0; animation: staggerItemIn var(--dur-normal) var(--ease-out) forwards; }
.stagger-list > *:nth-child(1) { animation-delay: 0ms; }
.stagger-list > *:nth-child(2) { animation-delay: 45ms; }
.stagger-list > *:nth-child(3) { animation-delay: 90ms; }
.stagger-list > *:nth-child(4) { animation-delay: 135ms; }

.flame-active { animation: pulseFlame 2.2s ease-in-out infinite; }
.skeleton { background: var(--surface-muted); border-radius: var(--radius-md); animation: skeletonPulse 1.4s ease-in-out infinite; }
.progress-ring__circle { transition: stroke-dashoffset 600ms var(--ease-out); transform: rotate(-90deg); transform-origin: 50% 50%; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}