/* ═══════════════════════════════════════════════════
   WORD TRAIL - Praise
   ═══════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────
   BASE FOUND FLASH
   ───────────────────────────────────────────── */
.found-flash {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Cinzel', serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--zen-jade);
  pointer-events: none;
  z-index: 50;
  text-shadow: 0 0 18px rgba(95, 168, 130, 0.6);
  animation: foundF 0.9s ease forwards;
  white-space: nowrap;
  will-change: transform, opacity;
}

@keyframes foundF {
  0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.7); }
  30%  { opacity: 1; transform: translate(-50%, -80%) scale(1.1); }
  100% { opacity: 0; transform: translate(-50%, -130%) scale(1); }
}

/* ─────────────────────────────────────────────
   BONUS FLASH
   ───────────────────────────────────────────── */
.found-flash.bonus-flash {
  color: #fff;
  font-size: 26px;
  letter-spacing: 1px;
  z-index: 55;
  will-change: transform, opacity;
  animation: bonusRise 1.1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  text-shadow:
    0 0  6px #fff,
    0 0 14px #ffe066,
    0 0 28px #ffb800,
    0 0 50px #ff6a00;
}

@keyframes bonusRise {
  0%   { opacity: 0; transform: translate(-50%, -50%) scale(0.6); }
  14%  { opacity: 1; transform: translate(-50%, -72%) scale(1.16); }
  35%  { opacity: 1; transform: translate(-50%, -92%) scale(1.06); }
  70%  { opacity: 1; transform: translate(-50%, -118%) scale(1.02); }
  100% { opacity: 0; transform: translate(-50%, -155%) scale(1); }
}

/* ─────────────────────────────────────────────
   LIGHTNING BOLT SPARKS
   ───────────────────────────────────────────── */
.lightning-spark {
  position: absolute;
  pointer-events: none;
  z-index: 54;
  width: 2px;
  border-radius: 1px;
  transform-origin: top center;
  will-change: transform, opacity;
  animation: sparkFly 0.5s ease-out forwards;
  background: linear-gradient(180deg, #fff 0%, #ffe066 40%, #ff6a00 100%);
  box-shadow: 0 0 4px #fff, 0 0 8px #ffb800;
  opacity: 0;
}

@keyframes sparkFly {
  0%   { opacity: 1; transform: translateY(0) scaleY(1); }
  45%  { opacity: 0.8; transform: translateY(var(--spark-dy, -26px)) scaleY(0.75); }
  100% { opacity: 0; transform: translateY(var(--spark-dy2, -48px)) scaleY(0.15); }
}

.lightning-arc {
  position: absolute;
  pointer-events: none;
  z-index: 54;
  height: 2px;
  border-radius: 1px;
  transform-origin: left center;
  will-change: transform, opacity;
  animation: arcFly 0.42s ease-out forwards;
  background: linear-gradient(90deg, transparent 0%, #ffe066 30%, #fff 50%, #ff6a00 70%, transparent 100%);
  box-shadow: 0 0 5px #ffb800;
  opacity: 0;
}

@keyframes arcFly {
  0%   { opacity: 0.85; transform: scaleX(1) translateX(0); }
  55%  { opacity: 0.5;  transform: scaleX(1.35) translateX(var(--arc-dx, 8px)); }
  100% { opacity: 0;    transform: scaleX(0.25) translateX(var(--arc-dx2, 16px)); }
}

/* ─────────────────────────────────────────────
   SCREEN FLASH
   ───────────────────────────────────────────── */
.electric-screen-flash {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 53;
  border-radius: inherit;
  will-change: transform, opacity;
  animation: screenFlash 0.32s ease-out forwards;
  background: radial-gradient(ellipse at center,
    rgba(255, 224, 102, 0.22) 0%,
    rgba(255, 106,   0, 0.08) 45%,
    transparent 70%);
}

@keyframes screenFlash {
  0%   { opacity: 1; transform: scale(0.88); }
  35%  { opacity: 0.7; transform: scale(1.04); }
  100% { opacity: 0;   transform: scale(1.12); }
}

/* ─────────────────────────────────────────────
   COMBO BADGE
   ───────────────────────────────────────────── */
.combo-badge {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -20%);
  pointer-events: none;
  z-index: 56;
  font-family: 'Nunito', sans-serif;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #ffb800;
  text-shadow: 0 0 8px #ff6a00, 0 0 16px rgba(255, 184, 0, 0.4);
  opacity: 0;
  white-space: nowrap;
  will-change: transform, opacity;
  animation: comboBadgeAnim 1.0s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  animation-delay: 0.06s;
}

@keyframes comboBadgeAnim {
  0%   { opacity: 0; transform: translate(-50%, 0%) scale(0.7); }
  20%  { opacity: 1; transform: translate(-50%, -30%) scale(1.1); }
  60%  { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -80%) scale(0.9); }
}