/* ===== P3 — MICRO-ANIMATIONS VICTOIRE ===== */
/* prefers-reduced-motion global déjà géré dans css/misc.css */

/* ── CLASSIQUE : pop de l'image + typewriter du nom ── */
@keyframes revealClassic {
  0%   { transform: scale(0.5); opacity: 0; }
  70%  { transform: scale(1.06); }
  100% { transform: scale(1);   opacity: 1; }
}
.anim-reveal-classic {
  animation: revealClassic 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes typewriter {
  from { clip-path: inset(0 100% 0 0); }
  to   { clip-path: inset(0 0%   0 0); }
}
.anim-typewriter {
  display: inline-block;
  clip-path: inset(0 100% 0 0);
  animation: typewriter 0.7s steps(22, end) 0.35s both;
}

/* ── WANTED : tampon TROUVÉ ! ── */
@keyframes stampIn {
  from { transform: translateX(-50%) rotate(-18deg) scale(0); opacity: 0.5; }
  to   { transform: translateX(-50%) rotate(-18deg) scale(1); opacity: 0.9; }
}
.anim-stamp {
  position: absolute;
  top: 38%;
  left: 50%;
  transform: translateX(-50%) rotate(-18deg) scale(0);
  color: #cc0000;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(1.1rem, 4.5vw, 2rem);
  font-weight: 900;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  border: 3px solid #cc0000;
  padding: 3px 14px;
  border-radius: 4px;
  pointer-events: none;
  z-index: 10;
  white-space: nowrap;
  text-shadow: 0 1px 4px rgba(0,0,0,0.35);
  animation: stampIn 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) 0.15s both;
}

/* ── PAVILLON : flash doré de victoire ── */
@keyframes flagVictory {
  0%   { filter: brightness(1); }
  30%  { filter: brightness(1.55) sepia(0.35); }
  65%  { filter: brightness(1.18); }
  100% { filter: brightness(1); }
}
.anim-wave-flag {
  animation: flagVictory 0.85s ease both;
}

/* ── FRUIT DU DÉMON : rotation 360° + rebond + aura par type ── */
@keyframes fruitSpin {
  0%   { transform: rotate(0deg)   scale(1); }
  70%  { transform: rotate(360deg) scale(1.12); }
  85%  { transform: rotate(360deg) scale(0.92); }
  100% { transform: rotate(360deg) scale(1); }
}
.anim-reveal-fruit {
  animation: fruitSpin 0.65s cubic-bezier(0.34, 1.56, 0.64, 1) both;
  border-radius: 10px;
}
.aura-logia     { box-shadow: 0 0 24px 10px rgba(180,220,255,0.85); }
.aura-zoan      { box-shadow: 0 0 24px 10px rgba(34,197,94,0.80);   }
.aura-paramecia { box-shadow: 0 0 24px 10px rgba(96,165,250,0.80);  }
.aura-mythique  { box-shadow: 0 0 24px 10px rgba(168,85,247,0.85);  }

/* ── ÉMOJI : cascade de sauts + pop de la révélation ── */
@keyframes emojiJump {
  0%   { transform: translateY(0)    scale(1);    }
  35%  { transform: translateY(-14px) scale(1.28); }
  60%  { transform: translateY(0)    scale(0.92); }
  80%  { transform: translateY(-5px)  scale(1.07); }
  100% { transform: translateY(0)    scale(1);    }
}
.anim-jump {
  animation: emojiJump 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes popReveal {
  from { transform: scale(0.7); opacity: 0; }
  to   { transform: scale(1);   opacity: 1; }
}
.anim-pop {
  animation: popReveal 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

/* ── TRANSITIONS ONGLETS (FLIP) — keyframes utilisés via style inline JS ── */
@keyframes slideInRight {
  from { transform: translateX(30px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}
@keyframes slideInLeft {
  from { transform: translateX(-30px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}

/* ── OPENING : fondu glissé + numéro en grand ── */
@keyframes audioReveal {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0);    }
}
.anim-reveal-audio {
  animation: audioReveal 0.5s ease both;
}

@keyframes numPop {
  from { opacity: 0; transform: scale(1.5); }
  to   { opacity: 1; transform: scale(1);   }
}
.anim-num-big {
  display: inline-block;
  animation: numPop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) 0.1s both;
}