/* All styles mapped to Tailwind in index.html and app.js */

/* Power-up purchase animations */
@keyframes pu-card-flash {
  0%   { transform: scale(1);    background-color: inherit; }
  20%  { transform: scale(1.03); background-color: #d1fae5; } /* green-100 */
  60%  { transform: scale(1.01); background-color: #d1fae5; }
  100% { transform: scale(1);    background-color: inherit; }
}
@keyframes pu-count-pop {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.6); color: #00b96b; }
  70%  { transform: scale(0.9); }
  100% { transform: scale(1); }
}
@keyframes pu-coin-deduct {
  0%   { transform: scale(1);    color: inherit; }
  30%  { transform: scale(0.85); color: #c0262d; }
  70%  { transform: scale(1.05); }
  100% { transform: scale(1);    color: inherit; }
}
@keyframes pu-btn-bought {
  0%   { transform: scale(1); }
  30%  { transform: scale(0.88); }
  70%  { transform: scale(1.08); }
  100% { transform: scale(1); }
}

.pu-card-flash  { animation: pu-card-flash  0.55s ease forwards; }
.pu-count-pop   { animation: pu-count-pop   0.45s cubic-bezier(.36,.07,.19,.97) forwards; }
.pu-coin-deduct { animation: pu-coin-deduct 0.4s ease forwards; }
.pu-btn-bought  { animation: pu-btn-bought  0.35s ease forwards; }