/* Kinetics — spring-physics micro-interactions for touch feedback,
   modeled on the ckissi/kinetics gallery patterns (copy-paste CSS gallery,
   so these are the project's vendored equivalents, driven by kinetics.js).
   Classes are added/removed by JS; nothing here is decorative-only —
   each maps to a game event: press, drop-snap, revert-shake, arrival. */

@keyframes kin-press {
  0% { transform: scale(1); }
  40% { transform: scale(0.94); }
  100% { transform: scale(0.97); }
}
@keyframes kin-release {
  0% { transform: scale(0.97); }
  55% { transform: scale(1.02); }
  100% { transform: scale(1); }
}
@keyframes kin-snap {
  0% { transform: scale(1); }
  35% { transform: scale(0.92); }
  70% { transform: scale(1.06); }
  100% { transform: scale(1); }
}
@keyframes kin-shake {
  0% { transform: translateX(0); }
  20% { transform: translateX(-6px); }
  40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(2px); }
  100% { transform: translateX(0); }
}
@keyframes kin-rise {
  0% { opacity: 0; transform: translateY(8px); }
  60% { opacity: 1; transform: translateY(-2px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes kin-pop {
  0% { transform: scale(1); }
  45% { transform: scale(1.12); }
  100% { transform: scale(1); }
}

.kin-press { animation: kin-press 0.12s ease-out both; }
.kin-release { animation: kin-release 0.18s cubic-bezier(0.34, 1.56, 0.64, 1) both; }
.kin-snap { animation: kin-snap 0.32s cubic-bezier(0.34, 1.56, 0.64, 1) both; }
.kin-shake { animation: kin-shake 0.32s ease both; }
.kin-rise { animation: kin-rise 0.24s cubic-bezier(0.34, 1.56, 0.64, 1) both; }
.kin-pop { animation: kin-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) both; }

@media (prefers-reduced-motion: reduce) {
  .kin-press, .kin-release, .kin-snap, .kin-shake, .kin-rise, .kin-pop { animation: none; }
}