/* =========================================================
   RPG Legend - animations.css
   ========================================================= */

.roll-die.spinning{ animation: tumbleForward 0.5s linear infinite; }
.roll-die.settled{ animation: settleForward .4s ease-out; box-shadow: 0 0 22px rgba(201,162,39,0.5); }
@keyframes tumbleForward{
  0%{ transform: rotateX(0deg) rotateY(0deg) translateZ(0px); }
  50%{ transform: rotateX(200deg) rotateY(40deg) translateZ(14px); }
  100%{ transform: rotateX(400deg) rotateY(0deg) translateZ(0px); }
}
@keyframes settleForward{
  0%{ transform: rotateX(60deg) scale(1.3); }
  60%{ transform: rotateX(-15deg) scale(0.92); }
  100%{ transform: rotateX(0deg) scale(1); }
}

/* dano flutuante, sobe e desaparece */
@keyframes floatUp{
  0%{ transform: translateY(0); opacity: 1; }
  100%{ transform: translateY(-46px); opacity: 0; }
}
.floating-text{ animation: floatUp 1s ease-out forwards; }
.floating-text.dmg{ color: #ff6b6b; }
.floating-text.heal{ color: #7fcdb8; }
.floating-text.gold{ color: var(--gold-bright); }
.floating-text.xp{ color: var(--xp); }
.floating-text.crit{ color: #ffd35c; font-size: 17px; }

/* piscada de nivel */
@keyframes levelFlash{
  0%{ box-shadow: 0 0 0 rgba(232,198,90,0); }
  30%{ box-shadow: 0 0 26px rgba(232,198,90,0.85); }
  100%{ box-shadow: 0 0 0 rgba(232,198,90,0); }
}
.level-flash{ animation: levelFlash .9s ease-out; }

/* tremida ao tomar dano */
@keyframes shake{
  0%,100%{ transform: translateX(0); }
  20%{ transform: translateX(-4px); }
  40%{ transform: translateX(4px); }
  60%{ transform: translateX(-3px); }
  80%{ transform: translateX(3px); }
}
.shake{ animation: shake .3s ease-in-out; }

/* pulso de aparecimento do chefe */
@keyframes bossPulse{
  0%{ transform: scale(0.9); opacity: 0; }
  60%{ transform: scale(1.05); opacity: 1; }
  100%{ transform: scale(1); opacity: 1; }
}
.combat-scene .cs-icon{ animation: bossPulse .4s ease-out; }

/* fade padrao entre telas */
@keyframes fadeIn{ from{ opacity:0; transform: translateY(6px);} to{ opacity:1; transform: translateY(0);} }
#gameScreen:not(.hidden), #creationScreen:not(.hidden), #menuScreen:not(.hidden){ animation: fadeIn .25s ease-out; }