/* ============================================================
   animations.css — motion for menus, panels, HUD, celebrations
   Aiming/gameplay itself is drawn on canvas every frame and is
   intentionally excluded here so shot precision never competes
   with CSS transitions.
   ============================================================ */

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.fade-in { animation: fadeIn 0.45s ease both; }

@keyframes popIn {
  0% { opacity: 0; transform: scale(0.88) translateY(10px); }
  60% { opacity: 1; transform: scale(1.02) translateY(0); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}
.pop-in { animation: popIn 0.32s cubic-bezier(.2,.9,.3,1.2) both; }

@keyframes floatBall {
  0%, 100% { transform: translateY(0) translateX(0); }
  50% { transform: translateY(-18px) translateX(10px); }
}
.menu-ball--1 { animation: floatBall 7s ease-in-out infinite; }
.menu-ball--2 { animation: floatBall 9s ease-in-out infinite reverse; }
.menu-ball--3 { animation: floatBall 6.2s ease-in-out infinite; }

@keyframes starPop {
  0% { transform: scale(0.4); opacity: 0; }
  60% { transform: scale(1.25); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}
.star--filled { animation: starPop 0.35s ease both; }
.star--filled:nth-child(2) { animation-delay: 0.1s; }
.star--filled:nth-child(3) { animation-delay: 0.2s; }

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(232,163,61,0.0); }
  50% { box-shadow: 0 0 0 6px rgba(232,163,61,0.18); }
}
.btn--primary:not(:active) { animation: pulseGlow 2.6s ease-in-out infinite; }

@keyframes toggleKnob {
  from { transform: scale(0.85); }
  to { transform: scale(1); }
}

.overlay { transition: background 0.2s ease; }
.overlay.visible .panel { will-change: transform, opacity; }

@keyframes levelUnlockShine {
  0% { filter: brightness(1); }
  50% { filter: brightness(1.6); }
  100% { filter: brightness(1); }
}
.level-tile:not(.is-locked) { transition: transform 0.15s ease; }
.level-tile:not(.is-locked):active { transform: scale(0.94); }

@keyframes toastSlide {
  from { opacity: 0; transform: translateY(-14px); }
  to { opacity: 1; transform: translateY(0); }
}

.btn-icon, .toggle, .segmented button, .level-tile, .mc-btn {
  transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.btn-icon:active, .mc-btn:active { transform: scale(0.92); }