/* ============================================================
   AirTracer — Motion. Playful & springy, transform/opacity only.
   Fully disabled under prefers-reduced-motion.
   ============================================================ */

@keyframes mic-pulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.06); }
}
@keyframes pop-in {
  0%   { transform: scale(0.6); opacity: 0; }
  70%  { transform: scale(1.08); opacity: 1; }
  100% { transform: scale(1); }
}
@keyframes drop-in {
  0%   { transform: translateY(-46px) scale(1.12); opacity: 0; }
  60%  { transform: translateY(4px) scale(0.98); opacity: 1; }
  100% { transform: translateY(0) scale(1); }
}
@keyframes confetti-fall {
  0%   { transform: translateY(-10px) rotate(0); opacity: 1; }
  100% { transform: translateY(64vh) rotate(560deg); opacity: 0; }
}
@keyframes mascot-bob {
  0%, 100% { translate: 0 0; rotate: -1deg; }
  50%      { translate: 0 -8px; rotate: 1.5deg; }
}
@keyframes dot-float {
  0%, 100% { translate: 0 0; }
  50%      { translate: 0 -7px; }
}

/* Idle mascot + drifting confetti */
.mascot--hero { animation: mascot-bob 4.5s ease-in-out infinite; }
.confetti-dot, .confetti-letter { animation: dot-float 5s ease-in-out infinite; }
.confetti-dot:nth-child(odd), .confetti-letter:nth-child(odd) { animation-duration: 6.2s; animation-delay: -1.4s; }

/* Scroll-reveal */
.reveal {
  opacity: 0; transform: translateY(20px);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-spring);
}
.reveal.in-view { opacity: 1; transform: none; }

/* Springy entrances used by JS */
.animate-pop { animation: pop-in 0.5s var(--ease-spring) both; }
.tray-letter.just-done { animation: drop-in 0.55s var(--ease-spring) both; }

/* Celebration overlay */
.celebrate { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; pointer-events: none; }
.celebrate__badge {
  background: var(--color-pure-white); color: var(--color-ink-black);
  border: var(--line-2); border-radius: var(--radius-large);
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(32px, 6vw, 60px); letter-spacing: -1px;
  padding: 20px 44px;
  animation: pop-in 0.5s var(--ease-spring) both;
}
/* size, colour and organic border-radius are set per-piece in celebrations.js */
.confetti { position: absolute; top: 0; width: 10px; height: 10px; animation: confetti-fall 1.7s ease-in forwards; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  .reveal { opacity: 1 !important; transform: none !important; }
  .mic.is-listening, .mascot--hero, .confetti-dot { animation: none !important; }
}