/* ═══════════════════════════════════════════════
   Animations v3 — Light Tech
   ═══════════════════════════════════════════════ */

@keyframes fadeInUp {
  from { opacity:0; transform:translateY(30px) }
  to   { opacity:1; transform:translateY(0) }
}
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes fadeInScale { from{opacity:0;transform:scale(.92)} to{opacity:1;transform:scale(1)} }
@keyframes slideDown { from{opacity:0;transform:translateY(-10px)} to{opacity:1;transform:translateY(0)} }
@keyframes spin { to{transform:rotate(360deg)} }
@keyframes toastIn { from{opacity:0;transform:translateX(40px)} to{opacity:1;transform:translateX(0)} }

@keyframes float {
  0%,100% { transform:translateY(0) }
  50%     { transform:translateY(-14px) }
}
@keyframes pulse {
  0%,100% { opacity:1 }
  50%     { opacity:.5 }
}
@keyframes gradientFlow {
  0%   { background-position:0% 50% }
  50%  { background-position:100% 50% }
  100% { background-position:0% 50% }
}
@keyframes gridPulse {
  0%,100% { opacity:.4 }
  50%     { opacity:.7 }
}
@keyframes shimmer {
  0%   { background-position:-200% 0 }
  100% { background-position:200% 0 }
}
@keyframes orbitDots {
  from { transform:rotate(0deg) }
  to   { transform:rotate(360deg) }
}

/* ── 工具类 ── */
.anim-fadeInUp   { animation:fadeInUp .6s cubic-bezier(0,0,.2,1) both }
.anim-fadeIn     { animation:fadeIn .5s ease both }
.anim-fadeInScale{ animation:fadeInScale .4s ease both }
.anim-slideDown  { animation:slideDown .3s ease both }
.anim-float      { animation:float 6s ease-in-out infinite }

.anim-stagger > * { opacity:0; animation:fadeInUp .6s cubic-bezier(0,0,.2,1) forwards }
.anim-stagger > *:nth-child(1){ animation-delay:0s }
.anim-stagger > *:nth-child(2){ animation-delay:.08s }
.anim-stagger > *:nth-child(3){ animation-delay:.16s }
.anim-stagger > *:nth-child(4){ animation-delay:.24s }
.anim-stagger > *:nth-child(5){ animation-delay:.32s }
.anim-stagger > *:nth-child(6){ animation-delay:.4s }

/* ── IntersectionObserver ── */
.reveal{
  opacity:0; transform:translateY(30px);
  transition:opacity .7s cubic-bezier(0,0,.2,1), transform .7s cubic-bezier(0,0,.2,1);
}
.reveal.visible{ opacity:1; transform:translateY(0) }

/* ── Skeleton ── */
.skeleton{
  background:linear-gradient(90deg, var(--surface) 25%, #e2e8f0 50%, var(--surface) 75%);
  background-size:200% 100%; animation:shimmer 1.5s ease-in-out infinite;
  border-radius:var(--radius-sm);
}