/* ───────────────────────────────────────────────────────────────────
   Phase 7 polish — V2 runtime CSS: pulse animations + modifier FX.

   Sprites are created by `flight-path-player.js` inside the
   `#qse-v2-play-host` overlay. The modifier classes below attach to
   fielder / runner / pulse sprites when the corresponding
   PlayActionModifier flag is set.
   ─────────────────────────────────────────────────────────────── */

/* Pulse ring that expands + fades. One animation per pulse window; the
   JS writes the duration inline so each pulse scales to its own length. */
@keyframes qse-pulse-ring {
    0%   { transform: scale(0.5);  opacity: 0.95; }
    60%  { transform: scale(1.6);  opacity: 0.55; }
    100% { transform: scale(2.2);  opacity: 0;    }
}

@keyframes qse-pulse-glyph {
    0%   { transform: scale(0.6);  opacity: 0;    }
    20%  { transform: scale(1.25); opacity: 1;    }
    70%  { transform: scale(1.0);  opacity: 1;    }
    100% { transform: scale(0.9);  opacity: 0;    }
}

/* ── Fielder modifier: DIVE — stretch sideways + hit the dirt ─── */
.qse-play-fielder.mod-dive {
    animation: qse-dive 420ms ease-out 180ms both;
    transform-origin: bottom center;
}
@keyframes qse-dive {
    0%   { transform: none; }
    40%  { transform: scaleX(1.55) scaleY(0.55) translateY(5px); }
    80%  { transform: scaleX(1.3)  scaleY(0.65) translateY(4px); }
    100% { transform: scaleX(1)    scaleY(1)    translateY(0); }
}

/* ── Fielder modifier: JUMP — vertical lift + slight shadow stretch ─ */
.qse-play-fielder.mod-jump {
    animation: qse-jump 520ms ease-out 140ms both;
    transform-origin: bottom center;
}
@keyframes qse-jump {
    0%   { transform: none; }
    45%  { transform: translateY(-18px) scaleY(1.06); }
    100% { transform: translateY(0)     scaleY(1); }
}

/* ── Fielder modifier: WALLCLIMB — big vertical lift + rotation ─── */
.qse-play-fielder.mod-wallclimb {
    animation: qse-wallclimb 620ms ease-out 120ms both;
    transform-origin: bottom center;
}
@keyframes qse-wallclimb {
    0%   { transform: none; }
    50%  { transform: translateY(-28px) rotate(-14deg); }
    100% { transform: translateY(0)     rotate(0); }
}

/* ── Pulse modifier: BOBBLE — jitter the pulse briefly ─────────── */
.qse-play-pulse.mod-bobble {
    animation: qse-bobble 320ms steps(5, end) infinite;
}
@keyframes qse-bobble {
    0%   { transform: translate(0, 0); }
    20%  { transform: translate(2px, -1px); }
    40%  { transform: translate(-2px, 1px); }
    60%  { transform: translate(1px, 2px); }
    80%  { transform: translate(-1px, -2px); }
    100% { transform: translate(0, 0); }
}

/* ── Pulse modifier: ERROR — red tint + drop arrow ──────────────── */
.qse-play-pulse.mod-error .pulse-ring {
    border-color: #dc2626 !important;
    animation-duration: 550ms !important;
}
.qse-play-pulse.mod-error .pulse-glyph {
    color: #dc2626 !important;
}
.qse-play-pulse.mod-error::after {
    content: "✕";
    position: absolute;
    left: 6px; top: -24px;
    color: #dc2626;
    font-weight: 700;
    font-size: 0.9rem;
    text-shadow: 0 0 3px #fff, 0 0 3px #fff;
    animation: qse-error-drop 550ms ease-in forwards;
}
@keyframes qse-error-drop {
    0%   { opacity: 0; transform: translateY(-6px); }
    30%  { opacity: 1; }
    100% { opacity: 0; transform: translateY(16px); }
}

/* ── Runner modifier: HARDSLIDE — streaky dust-cloud near end ─── */
.qse-play-runner.mod-hardslide {
    animation: qse-hardslide 420ms ease-out forwards;
    animation-delay: calc(var(--slide-lead, 0ms));
}
@keyframes qse-hardslide {
    0%   { transform: none; }
    55%  { transform: scaleX(1.35) scaleY(0.7); filter: drop-shadow(0 3px 0 rgba(200,180,140,0.55)); }
    100% { transform: none; filter: none; }
}
