/* ── Raid Incoming Popup — REDESIGN ─────────────────────────── */
.raid-popup {
  width:460px; max-width:92vw;
  background:
    radial-gradient(ellipse at top, rgba(255,50,50,0.18) 0%, transparent 60%),
    linear-gradient(180deg, rgba(20,5,5,0.98) 0%, rgba(8,12,24,0.98) 100%);
  border:2px solid #ff3333;
  border-radius:var(--modal-radius);
  overflow:hidden;
  box-shadow:
    0 0 80px rgba(255, 50, 50, 0.55),
    0 0 0 1px rgba(255, 100, 100, 0.15) inset,
    inset 0 0 60px rgba(255, 50, 50, 0.06);
  animation:raidPopIn 0.4s cubic-bezier(0.16, 1.3, 0.3, 1), raidShake 0.5s 0.4s ease-out;
  position:relative;
}
/* Bandeau scanline rouge animé en haut */
.raid-popup::before {
  content:'';
  position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,
    transparent 0%, #ff3333 20%, #ff8844 50%, #ff3333 80%, transparent 100%);
  animation:raidScanlinePulse 2s ease-in-out infinite;
  z-index:5;
}
.raid-popup-hdr {
  padding:28px 20px 18px; text-align:center;
  border-bottom:1px solid rgba(255,50,50,0.35);
  background:
    radial-gradient(ellipse at center, rgba(255, 50, 50, 0.18) 0%, transparent 70%),
    rgba(255,50,50,0.04);
  position:relative;
}
.raid-popup-icon {
  font-size:64px; display:block; margin-bottom:10px;
  filter: drop-shadow(0 0 18px rgba(255, 50, 50, 0.7));
  animation: raidIconBounce 1.4s ease-in-out infinite;
}
.raid-popup-title {
  font-family:var(--font-display);
  font-size:20px;
  font-weight:900;
  letter-spacing:4px;
  color:#ff5555;
  text-shadow:
    0 0 12px rgba(255, 50, 50, 0.85),
    0 0 24px rgba(255, 50, 50, 0.45);
  animation:raidFlicker 1.5s ease-in-out infinite;
  text-transform:uppercase;
}
.raid-popup-sub {
  font-family:var(--font-body); font-size:var(--fs-base);
  color:var(--textmid);
  margin-top:10px; line-height:1.5;
  letter-spacing:0.5px;
}
.raid-popup-body { padding:20px 22px 8px; text-align:center; }
.raid-popup-faction {
  display:inline-block;
  font-family:var(--font-display); font-size:var(--fs-xl); font-weight:800;
  color:#ffd285; letter-spacing:3px; margin-bottom:14px;
  text-shadow:0 0 16px rgba(255,170,68,0.5);
  padding:6px 16px;
  border:1px solid rgba(255, 170, 68, 0.45);
  border-radius:var(--radius);
  background:rgba(255, 170, 68, 0.08);
}
.raid-popup-troops {
  font-family:var(--font-mono); font-size:var(--fs-base);
  color:var(--textmid);
  margin-bottom:18px; line-height:1.6;
  padding:10px 14px;
  background:rgba(0, 0, 0, 0.35);
  border-radius:var(--radius);
  
 box-shadow:inset 3px 0 0 0 rgba(255, 50, 50, 0.55); }
.raid-popup-timer {
  font-family:var(--font-display); font-size:var(--fs-4xl); font-weight:900;
  color:#ff3333; letter-spacing:3px; margin:8px 0 12px;
  text-shadow:
    0 0 18px rgba(255, 50, 50, 0.85),
    0 0 36px rgba(255, 50, 50, 0.45);
  animation:raidTimerPulse 1s ease-in-out infinite;
}
.raid-popup-footer { padding:14px 22px 22px; text-align:center; }
.raid-popup-btn {
  padding:14px 32px;
  font-family:var(--font-display); font-size:var(--fs-base);
  font-weight:800; letter-spacing:2px;
  border-radius:var(--radius-md);
  cursor:pointer;
  border:1.5px solid #ff5555;
  color:var(--textbright);
  background:linear-gradient(135deg, rgba(255, 80, 80, 0.20) 0%, rgba(192, 30, 30, 0.40) 100%);
  text-transform:uppercase;
  transition:all 0.2s;
  box-shadow:
    0 4px 16px rgba(255, 50, 50, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.10);
}
.raid-popup-btn:hover {
  background:linear-gradient(135deg, rgba(255, 80, 80, 0.40) 0%, rgba(192, 30, 30, 0.65) 100%);
  box-shadow:
    0 6px 22px rgba(255, 50, 50, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.20);
  transform:translateY(-2px) scale(1.02);
}
@keyframes raidPopIn {
  0%   { transform:scale(0.7) rotate(-2deg); opacity:0; filter:blur(6px); }
  70%  { transform:scale(1.04) rotate(0); filter:blur(0); }
  100% { transform:scale(1) rotate(0); opacity:1; filter:blur(0); }
}
@keyframes raidShake {
  0%, 100% { transform:translateX(0); }
  20%      { transform:translateX(-3px); }
  40%      { transform:translateX(3px); }
  60%      { transform:translateX(-2px); }
  80%      { transform:translateX(2px); }
}
@keyframes raidFlicker {
  0%, 100% { opacity:1; }
  47%      { opacity:1; }
  50%      { opacity:0.55; }
  53%      { opacity:1; }
}
@keyframes raidScanlinePulse {
  0%, 100% { opacity:0.6; transform:scaleX(0.7); }
  50%      { opacity:1;   transform:scaleX(1); }
}
@keyframes raidIconBounce {
  0%, 100% { transform:translateY(0) scale(1); }
  50%      { transform:translateY(-4px) scale(1.06); }
}
@keyframes raidTimerPulse {
  0%, 100% { text-shadow:0 0 18px rgba(255,50,50,0.85), 0 0 36px rgba(255,50,50,0.45); }
  50%      { text-shadow:0 0 28px rgba(255,50,50,1),    0 0 56px rgba(255,50,50,0.65); }
}
