@keyframes pop-in {
  0% { transform: scale(0.7); opacity: 0; }
  60% { transform: scale(1.08); opacity: 1; }
  100% { transform: scale(1); }
}

@keyframes star-burst {
  0% { transform: scale(0.2) rotate(-40deg); opacity: 0; }
  70% { transform: scale(1.2) rotate(8deg); opacity: 1; }
  100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

@keyframes wobble {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-5deg); }
  75% { transform: rotate(5deg); }
}

@keyframes hint-glow {
  0%, 100% { filter: drop-shadow(0 0 0 rgba(255, 143, 163, 0)); }
  50% { filter: drop-shadow(0 0 14px rgba(255, 143, 163, 0.95)); }
}

@keyframes nudge-x {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(-8px); }
}

@keyframes cloud-drift {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

@keyframes float-slow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

@keyframes shake-wrong {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-6px); }
  40%, 80% { transform: translateX(6px); }
}

@keyframes snap-glow {
  0% { box-shadow: 0 0 0 0 rgba(127, 214, 127, 0.8); }
  70% { box-shadow: 0 0 0 15px rgba(127, 214, 127, 0); }
  100% { box-shadow: 0 0 0 0 rgba(127, 214, 127, 0); }
}

.basket.pop,
.choice-card.is-correct {
  animation: pop-in 340ms ease-out;
}

.celebrate-star {
  animation: star-burst 520ms cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.reward-card {
  animation: pop-in 420ms ease-out both;
}

.sort-piece.returning,
.weight-piece.returning {
  transition: transform 300ms cubic-bezier(0.34, 1.4, 0.5, 1);
}

.sort-piece.dragging,
.weight-piece.dragging {
  transition: none;
}

/* The hint ladder: a glow first, then an arrow, then a spoken line. */
.hint-glow {
  animation: hint-glow 1.1s ease-in-out infinite;
}

.hint-arrow {
  position: fixed;
  z-index: 45;
  pointer-events: none;
  animation: nudge-x 900ms ease-in-out infinite;
}

.instrument-wrap.snap-pop {
  animation: pop-in 360ms ease-out;
}

.instrument-wrap.is-revealing {
  transform: translateX(140px);
  opacity: 0;
  transition: transform 620ms cubic-bezier(0.22, 1, 0.36, 1), opacity 320ms ease-out;
}
.instrument-wrap.is-revealing.is-settled {
  transform: translateX(0);
  opacity: 1;
}

.balance-beam {
  transform-box: fill-box;
}

.drop-near {
  animation: wobble 600ms ease-in-out infinite;
}

.float-animation {
  animation: float-slow 4s ease-in-out infinite;
}

.shake-animation {
  animation: shake-wrong 400ms ease-in-out;
}

.snap-glow-effect {
  animation: snap-glow 600ms ease-out;
}

/* Reduced motion still communicates state — it just stops moving to do it. */
body.reduced-motion *,
body.reduced-motion *::before,
body.reduced-motion *::after {
  animation-duration: 0.001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.001ms !important;
}

@media (prefers-reduced-motion: reduce) {
  .hint-arrow,
  .drop-near,
  .hint-glow {
    animation: none;
  }
}