@keyframes floatUp{
  0%{transform:translateY(0);opacity:1;}
  100%{transform:translateY(-70px);opacity:0;}
}
@keyframes popIn{
  from{transform:scale(.85);opacity:0;}
  to{transform:scale(1);opacity:1;}
}
.overlay-card{animation:popIn .25s ease-out;}
.results-card{animation:popIn .3s ease-out;}

@keyframes shakeX{
  0%,100%{transform:translateX(0);}
  20%{transform:translateX(-8px);}
  40%{transform:translateX(8px);}
  60%{transform:translateX(-5px);}
  80%{transform:translateX(5px);}
}
.shake{animation:shakeX .4s ease-in-out;}

@keyframes pulseGreen{
  0%{box-shadow:0 0 0 0 rgba(42,157,92,.5);}
  100%{box-shadow:0 0 0 16px rgba(42,157,92,0);}
}
.answer-btn.correct{animation:pulseGreen .6s ease-out;}

@keyframes streakPop{
  0%{transform:scale(1);}
  50%{transform:scale(1.35);}
  100%{transform:scale(1);}
}
.streak-pop{animation:streakPop .3s ease-out;}

@keyframes fadeIn{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}
#question-area{animation:fadeIn .3s ease-out;}