/* 🏴‍☠️ ANIMATIONS COMBAT — Académie Pirate */

/* Overlay vidéo combat */
#combat-overlay {
  position: fixed; inset: 0; z-index: 9000;
  display: none; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.9);
  cursor: pointer;
}
#combat-overlay.active { display: flex; animation: fadeIn .15s ease; }
@keyframes fadeIn { from { opacity:0 } to { opacity:1 } }

#combat-video {
  max-width: min(90vw, 480px);
  border: 4px solid #f5a623;
  border-radius: 10px;
  box-shadow: 0 0 60px rgba(245,166,35,.5), 0 0 120px rgba(245,166,35,.2);
}

/* GIF réaction (coin bas droit) */
#combat-gif-overlay {
  position: fixed; bottom: 80px; right: 16px;
  z-index: 8000; width: min(180px, 35vw);
  display: none; border-radius: 8px; overflow: hidden;
  border: 3px solid #f5a623;
  box-shadow: 0 0 30px rgba(245,166,35,.4);
}
#combat-gif-overlay.active {
  display: block;
  animation: gifPop .4s cubic-bezier(.175,.885,.32,1.275);
}
#combat-gif-overlay img { width: 100%; display: block; }
@keyframes gifPop {
  from { transform: scale(0) rotate(-12deg); opacity:0 }
  to   { transform: scale(1) rotate(0);      opacity:1 }
}

/* Timer circulaire */
.question-timer {
  width: 48px; height: 48px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Bangers', cursive; font-size: 1.1rem; color: #f5a623;
  border: 3px solid #f5a623; transition: all 1s linear;
  box-shadow: 0 0 12px rgba(245,166,35,.3);
}
.question-timer.urgent {
  color: #e63946; border-color: #e63946;
  animation: timerUrgent .4s ease infinite;
  box-shadow: 0 0 20px rgba(230,57,70,.5);
}
@keyframes timerUrgent { 0%,100% { transform:scale(1) } 50% { transform:scale(1.15) } }

/* Vies / coeurs */
.lives-bar { display:flex; gap:6px; align-items:center; font-size:1.4rem; }
.life-heart.lost {
  filter: grayscale(1); opacity: .3;
  animation: heartLost .5s ease forwards;
}
@keyframes heartLost {
  0%  { transform: scale(1.5) rotate(15deg) }
  100%{ transform: scale(1)   rotate(0)     }
}

/* Boss panel */
.boss-panel {
  border: 4px solid #e63946 !important;
  box-shadow: 0 0 50px rgba(230,57,70,.6), 6px 6px 0 #000 !important;
  animation: bossIn .6s cubic-bezier(.175,.885,.32,1.275);
}
@keyframes bossIn {
  from { transform: scale(.5) rotate(-5deg); opacity:0 }
  to   { transform: scale(1)  rotate(0);     opacity:1 }
}

/* Combo streak explosion */
.combo-text {
  position: fixed; top: 40%; left: 50%;
  transform: translate(-50%,-50%) scale(0);
  font-family: 'Bangers', cursive;
  font-size: clamp(2.5rem,8vw,5rem);
  letter-spacing: 4px; color: #f5a623;
  -webkit-text-stroke: 3px #000;
  text-shadow: 4px 4px 0 #000, 0 0 40px rgba(245,166,35,.8);
  z-index: 7000; pointer-events: none;
}
.combo-text.fire {
  animation: comboExplode .8s cubic-bezier(.175,.885,.32,1.275) forwards;
}
@keyframes comboExplode {
  0%  { transform: translate(-50%,-50%) scale(0) rotate(-10deg); opacity:1 }
  50% { transform: translate(-50%,-50%) scale(1.3) rotate(3deg);  opacity:1 }
  100%{ transform: translate(-50%,-50%) scale(.9) rotate(0);       opacity:0 }
}
