/* ============ KEYFRAMES ============ */
@keyframes pulse{
  0%,100%{opacity:1}
  50%{opacity:.3}
}
@keyframes spin{
  to{transform:rotate(360deg)}
}
@keyframes cardIn{
  from{opacity:0;transform:translateY(24px) scale(.96)}
  to{opacity:1;transform:none}
}
@keyframes screenIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:none}
}
@keyframes qIn{
  from{opacity:0;transform:translateY(16px) scale(.98)}
  to{opacity:1;transform:none}
}
@keyframes confettiFall{
  0%{opacity:1;transform:translateY(0) rotate(0)}
  100%{opacity:0;transform:translateY(100vh) rotate(720deg)}
}
@keyframes toastIn{
  from{opacity:0;transform:translateX(-50%) translateY(20px)}
  to{opacity:1;transform:translateX(-50%) translateY(0)}
}

/* ============ APPLIED ANIMATIONS ============ */
.vibe-card{animation:cardIn .8s cubic-bezier(.2,.8,.2,1)}
.screen{animation:screenIn .4s ease}
.q-card{animation:qIn .35s cubic-bezier(.2,.8,.2,1)}

/* ============ CONFETTI ============ */
.confetti{
  position:fixed;inset:0;
  pointer-events:none;z-index:100;
  overflow:hidden;
}
.confetti-piece{
  position:absolute;
  width:10px;height:10px;
  top:-20px;opacity:0;
  animation:confettiFall linear forwards;
}