/* Ectometer stat boost ghost-flame effect */
.ecto-boost .stat-value {
  position: relative;
  font-weight: 700;
}

.ecto-flame {
  position: relative;
  display: inline-block;
  color: #e6faff;
  text-shadow:
    0 0 4px #7dfdff,
    0 0 8px #5af5ff,
    0 0 14px #32e6ff,
    0 0 24px #16b9ff;
  animation: ectoFlamePulse 2.2s ease-in-out infinite,
  ectoHue 6s linear infinite;
}

.ecto-flame::before,
.ecto-flame::after {
  content: attr(data-value);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.85;
}

.ecto-flame::before {
  filter: blur(4px) brightness(1.4) drop-shadow(0 0 6px #72ffff);
  animation: ectoFlameFlicker 0.18s infinite steps(2, end);
}

.ecto-flame::after {
  filter: blur(10px) brightness(1.8);
  animation: ectoFlameRoil 3s ease-in-out infinite;
  opacity: 0.55;
}

@keyframes ectoFlamePulse {
  0%,100% { transform: scale(1); }
  40% { transform: scale(1.08); }
  55% { transform: scale(0.97); }
  75% { transform: scale(1.05); }
}

@keyframes ectoHue {
  0% { filter: hue-rotate(0deg); }
  50% { filter: hue-rotate(60deg); }
  100% { filter: hue-rotate(0deg); }
}

@keyframes ectoFlameFlicker {
  0% { opacity: 0.55; }
  50% { opacity: 0.9; }
  100% { opacity: 0.4; }
}

@keyframes ectoFlameRoil {
  0%,100% { transform: translateY(0) scale(1); }
  25% { transform: translateY(-2px) scale(1.05); }
  50% { transform: translateY(-4px) scale(0.98); }
  75% { transform: translateY(-1px) scale(1.04); }
}

@media (prefers-reduced-motion: reduce) {
  .ecto-flame,
  .ecto-flame::before,
  .ecto-flame::after {
    animation: none;
  }
  .ecto-flame {
    text-shadow:
      0 0 4px #7dfdff,
      0 0 10px #32e6ff;
  }
}
@keyframes ghostPulse {
  0% {
    text-shadow: 0 0 10px #9370db, 0 0 20px #9370db;
    box-shadow: 0 0 30px rgba(147, 112, 219, 0.5);
  }
  100% {
    text-shadow: 0 0 15px #9370db, 0 0 30px #9370db, 0 0 40px #9370db;
    box-shadow: 0 0 60px rgba(147, 112, 219, 0.8);
  }
}

@keyframes float {
  0% {
    transform: translateY(100vh) translateX(-10px);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    transform: translateY(-50px) translateX(10px);
    opacity: 0;
  }
}

/* Mage vaporized. */
@keyframes etherealGlow {
  0%,100% {
    text-shadow:0 0 20px rgba(186,85,211,0.8), 0 0 40px rgba(138,43,226,0.4);
    filter:brightness(1);
  }
  50% {
    text-shadow:0 0 40px rgba(186,85,211,1), 0 0 80px rgba(138,43,226,0.8);
    filter:brightness(1.3);
  }
}

@keyframes drift {
  0%,100% { transform:translateY(0px) rotate(0deg); }
  25% { transform:translateY(-8px) rotate(1deg); }
  50% { transform:translateY(0px) rotate(0deg); }
  75% { transform:translateY(-5px) rotate(-0.5deg); }
}

@keyframes dissolve {
  0%,20% { opacity:1; }
  40%,60% { opacity:0.4; }
  80%,100% { opacity:1; }
}

@keyframes etherealGlow2 {
  0%,100% {
    text-shadow:0 0 15px rgba(230,230,250,0.6);
    filter:blur(0px);
  }
  50% {
    text-shadow:0 0 30px rgba(230,230,250,0.9);
    filter:blur(0.5px);
  }
}

@keyframes mysticalFlow {
  0%,100% {
    transform:rotate(0deg) scale(1);
    opacity:0.8;
  }
  33% {
    transform:rotate(120deg) scale(1.1);
    opacity:0.6;
  }
  66% {
    transform:rotate(240deg) scale(0.9);
    opacity:0.9;
  }
}

@keyframes float {
  0%,100% { transform:translateY(0px) translateX(0px); }
  25% { transform:translateY(-15px) translateX(5px); }
  50% { transform:translateY(-8px) translateX(-3px); }
  75% { transform:translateY(-12px) translateX(8px); }
}

@keyframes fade {
  0%,100% { opacity:0.3; }
  50% { opacity:0.8; }
}

@keyframes runeGlow {
  0%,100% {
    opacity:0.2;
    transform:scale(1) rotate(0deg);
  }
  50% {
    opacity:0.6;
    transform:scale(1.2) rotate(180deg);
  }
}

@keyframes whisper {
  0%,100% {
    opacity:0.6;
    transform:translateY(0px);
  }
  50% {
    opacity:0.9;
    transform:translateY(-3px);
  }
}
