* { -webkit-tap-highlight-color: transparent; }
input, textarea, button { -webkit-appearance: none; }
textarea { font-size: 16px; }

/* ─── Card ─── */
.card {
  position: relative;
  will-change: transform;
  transition: box-shadow 0.2s ease;
}
.card:active { transform: scale(0.985); }

/* ─── Emoji bounce ─── */
@keyframes emoji-bounce {
  0%   { transform: scale(0.4); opacity: 0; }
  60%  { transform: scale(1.18); opacity: 1; }
  82%  { transform: scale(0.92); }
  100% { transform: scale(1); }
}

/* Flip reveal */
@keyframes flip-out {
  from { transform: perspective(900px) rotateY(0deg) scale(1); opacity: 1; }
  to   { transform: perspective(900px) rotateY(-90deg) scale(0.94); opacity: 0; }
}
@keyframes flip-in {
  from { transform: perspective(900px) rotateY(90deg) scale(0.94); opacity: 0; }
  to   { transform: perspective(900px) rotateY(0deg) scale(1); opacity: 1; }
}

/* Card entry */
/* ─── Lettre par lettre ─── */
@keyframes letter-in {
  from { opacity: 0; transform: translateY(7px) scale(0.75); }
  to   { opacity: 1; transform: translateY(0)   scale(1); }
}

@keyframes card-enter {
  from { transform: translateY(18px) scale(0.96); opacity: 0; }
  to   { transform: translateY(0) scale(1);       opacity: 1; }
}

/* Card exits — directional */
@keyframes card-exit-right {
  0%   { transform: translateX(0) rotate(0deg) scale(1); opacity: 1; }
  18%  { transform: translateX(14px) rotate(4deg) scale(1.03); opacity: 1; }
  100% { transform: translateX(115%) rotate(18deg) scale(0.9); opacity: 0; }
}
@keyframes card-exit-left {
  0%   { transform: translateX(0) rotate(0deg) scale(1); opacity: 1; }
  18%  { transform: translateX(-14px) rotate(-4deg) scale(1.03); opacity: 1; }
  100% { transform: translateX(-115%) rotate(-18deg) scale(0.9); opacity: 0; }
}
@keyframes card-exit-up {
  0%   { transform: translateY(0) scale(1); opacity: 1; }
  18%  { transform: translateY(-10px) scale(1.03); opacity: 1; }
  100% { transform: translateY(-85%) scale(0.78); opacity: 0; }
}
@keyframes card-exit-down {
  0%   { transform: translateY(0) scale(1); opacity: 1; }
  18%  { transform: translateY(10px) scale(1.03); opacity: 1; }
  100% { transform: translateY(85%) scale(0.78); opacity: 0; }
}

/* Verdict flash (box-shadow coloré) */
@keyframes card-flash-green {
  0%   { box-shadow: inset 0 0 0px rgba(52,211,153,0); }
  22%  { box-shadow: inset 0 0 80px rgba(52,211,153,0.55), 0 0 50px rgba(52,211,153,0.45); }
  100% { box-shadow: inset 0 0 0px rgba(52,211,153,0); }
}
@keyframes card-flash-red {
  0%   { box-shadow: inset 0 0 0px rgba(244,63,94,0); }
  22%  { box-shadow: inset 0 0 80px rgba(244,63,94,0.55), 0 0 50px rgba(244,63,94,0.45); }
  100% { box-shadow: inset 0 0 0px rgba(244,63,94,0); }
}
@keyframes card-flash-amber {
  0%   { box-shadow: inset 0 0 0px rgba(251,191,36,0); }
  22%  { box-shadow: inset 0 0 80px rgba(251,191,36,0.55), 0 0 50px rgba(251,191,36,0.45); }
  100% { box-shadow: inset 0 0 0px rgba(251,191,36,0); }
}

/* ─── Swipe overlay ─── */
.swipe-overlay {
  position: absolute;
  inset: 0;
  border-radius: 24px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.1s ease;
}

/* ─── Rating buttons ─── */
@keyframes rating-appear {
  from { transform: translateY(22px) scale(0.85); opacity: 0; }
  to   { transform: translateY(0)    scale(1);    opacity: 1; }
}
.rating-anim { animation: rating-appear 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) both; }

/* ─── XP Toast ─── */
@keyframes toast-in {
  0%   { transform: translateY(16px) scale(0.8); opacity: 0; }
  55%  { transform: translateY(-5px) scale(1.1); opacity: 1; }
  75%  { transform: translateY(2px)  scale(0.97); }
  100% { transform: translateY(0)    scale(1);    opacity: 1; }
}
@keyframes toast-out {
  from { transform: translateY(0) scale(1); opacity: 1; }
  to   { transform: translateY(-14px) scale(0.85); opacity: 0; }
}

/* ─── Count-up pop ─── */
@keyframes count-pop {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.35); color: #c4b5fd; }
  100% { transform: scale(1); }
}
.count-pop { animation: count-pop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1); }

/* ─── Confetti ─── */
@keyframes confetti-fall {
  0%   { transform: translateY(-20px) rotate(0deg) scale(1);    opacity: 1; }
  80%  { opacity: 1; }
  100% { transform: translateY(105vh) rotate(720deg) scale(0.6); opacity: 0; }
}
.confetti-piece {
  position: fixed;
  pointer-events: none;
  animation: confetti-fall linear forwards;
  z-index: 200;
  border-radius: 2px;
}

/* ─── Streak fire pulse ─── */
@keyframes fire-pulse {
  0%, 100% { transform: scale(1); filter: brightness(1); }
  50%       { transform: scale(1.2); filter: brightness(1.4) drop-shadow(0 0 6px #f97316); }
}
.streak-fire { animation: fire-pulse 1.8s ease-in-out infinite; display: inline-block; }

/* ─── Progress bar shimmer ─── */
@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.bar-shimmer {
  background: linear-gradient(90deg,
    transparent 20%, rgba(255,255,255,0.18) 50%, transparent 80%);
  background-size: 200% 100%;
  animation: shimmer 2.4s infinite linear;
}

/* ─── Slide up ─── */
@keyframes slide-up {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.slide-up { animation: slide-up 0.3s ease forwards; }

/* ─── Badge pop ─── */
@keyframes badge-pop {
  from { transform: scale(0.5) rotate(-10deg); opacity: 0; }
  70%  { transform: scale(1.15) rotate(3deg); opacity: 1; }
  to   { transform: scale(1) rotate(0deg); opacity: 1; }
}
.badge-new { animation: badge-pop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; }

/* ─── Misc ─── */
@media (max-width: 640px) {
  .max-w-2xl { padding-left: 1rem; padding-right: 1rem; }
}