/* GroundPound — animated scenes v2: bigger, busier, more theatrical
   ─────────────────────────────────────────────────────────────────
   Critical: do NOT use animation-delay on SVG <g> elements (Chromium
   quirk causes transform: none on delayed wrappers). Instead, bake
   delay into keyframe percentages.
*/

/* One-shot mode — when the React Scene wrapper applies .scene-once,
   every nested animation that would otherwise loop (`infinite`) plays
   exactly once and pins to its final keyframe via animation-fill-mode.
   The replay button on the wrapper bumps a token that re-mounts the
   SVG to restart everything. The override is a sibling rule (not
   layered over each individual animation declaration) so the existing
   71+ `infinite` rules in this file don't have to be touched. */
.scene-once,
.scene-once *,
.scene-once *::before,
.scene-once *::after {
  animation-iteration-count: 1 !important;
  animation-fill-mode: forwards !important;
}

/* ─────── ROBOT BASE ─────── */
.robot { transform-box: fill-box; transform-origin: center bottom; }
.robot .helmet { fill: var(--ink); }
.robot .visor  { fill: var(--coral-500); }
.robot .eye    { fill: var(--paper); }
.robot .mouth  { stroke: var(--paper); fill: none; stroke-width: 1.2; stroke-linecap: round; }
.robot .jersey { fill: var(--brg-700); }
.robot .jersey-stripe { fill: var(--brg-100); opacity: 0.7; }
.robot .arm, .robot .leg { stroke: var(--brg-700); stroke-width: 4; stroke-linecap: round; fill: none; }
.robot .number { fill: var(--paper); font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 5px; }

/* on-dark ink robots */
.robot.dark .helmet { fill: var(--paper); }
.robot.dark .jersey { fill: var(--brg-500); }
.robot.dark .arm, .robot.dark .leg { stroke: var(--paper); }

/* QB gets a coral helmet */
.robot.is-qb .helmet { fill: var(--coral-500); }
.robot.is-qb .visor  { fill: var(--ink); }

/* defense */
.robot.foe .helmet { fill: var(--silver-700); }
.robot.foe .visor  { fill: var(--silver-300); }
.robot.foe .jersey { fill: var(--silver-500); }
.robot.foe .arm, .robot.foe .leg { stroke: var(--silver-700); }
.robot.foe .eye { fill: var(--coral-500); }
.robot.foe .number { fill: var(--ink); }

/* ─────── SCENE WRAPPER ─────── */
.scene { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; }
.scene svg { display: block; width: 100%; height: 100%; }
.scene.light { background: linear-gradient(180deg, #F4EFE8 0%, #E8E0D2 60%, #DDD2C0 100%); }
.scene.field-bg { background: radial-gradient(ellipse at 50% 30%, var(--brg-500) 0%, var(--field) 60%, var(--field-2) 100%); }
.scene .yardline { stroke: rgba(255,255,255,0.18); stroke-width: 0.6; stroke-dasharray: 1.2 2.5; }
.scene.light .yardline { stroke: rgba(7,46,31,0.18); }
.scene .turf-stripe { fill: rgba(0,0,0,0.04); }
.scene.field-bg .turf-stripe { fill: rgba(255,255,255,0.04); }
.scene-huddle.light .turf-stripe { fill: rgba(0,0,0,0.06); }
.scene-huddle.light .yardline { stroke: rgba(7,46,31,0.22); }

/* ─────── STADIUM CHROME ─────── */
@keyframes light-flicker {
  0%, 88%   { opacity: 1; }
  90%, 92%  { opacity: 0.4; }
  94%, 100% { opacity: 1; }
}
.stadium-lights .light { animation: light-flicker 6s ease-in-out infinite; transform-origin: center; }
.stadium-lights .light-r { animation-duration: 7.5s; }

@keyframes crowd-fleck-rise {
  0%, 70%   { transform: translateY(0); opacity: 0.4; }
  85%       { transform: translateY(-8px); opacity: 1; }
  100%      { transform: translateY(-16px); opacity: 0; }
}
.crowd-flecks .fleck { animation: crowd-fleck-rise 4s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.crowd-flecks .f0 { animation-duration: 3.2s; }
.crowd-flecks .f1 { animation-duration: 4.6s; }
.crowd-flecks .f2 { animation-duration: 3.8s; }
.crowd-flecks .f3 { animation-duration: 5.1s; }
.crowd-flecks .f4 { animation-duration: 3.5s; }
.crowd-flecks .f5 { animation-duration: 4.2s; }
.crowd-flecks .f6 { animation-duration: 3.9s; }
.crowd-flecks .f7 { animation-duration: 4.8s; }
.crowd-flecks .f8 { animation-duration: 3.4s; }
.crowd-flecks .f9 { animation-duration: 4.4s; }
.crowd-flecks .f10 { animation-duration: 3.7s; }
.crowd-flecks .f11 { animation-duration: 5.0s; }

@keyframes score-flash {
  0%, 80%   { fill: #FAF6F2; }
  85%, 90%  { fill: #E85D3C; transform: scale(1.15); }
  95%, 100% { fill: #FAF6F2; transform: scale(1); }
}

/* ─────── SCENE 1 — HUDDLE → BREAK → FORMATION → SNAP ─────── */
/* 12s loop:
   0–25%  : tight huddle (everyone in)
   25–32% : bubble pulse, clap up
   32–58% : break out to offensive formation (line + QB + RB)
   58–70% : pre-snap shift / breath
   70–85% : ball snapped to QB, line clashes
   85–100%: hold formation, reset
*/

@keyframes huddle-r1 {  /* TE — far left of formation */
  0%, 25%   { transform: translate(-30px, 4px); }
  30%       { transform: translate(-30px, -8px); }
  32%, 58%  { transform: translate(-260px, -50px); }
  62%, 70%  { transform: translate(-260px, -50px); }
  72%, 85%  { transform: translate(-250px, -50px) rotate(-3deg); }
  100%      { transform: translate(-260px, -50px); }
}
@keyframes huddle-r2 {  /* LT */
  0%, 25%   { transform: translate(-18px, 0px); }
  30%       { transform: translate(-18px, -10px); }
  32%, 58%  { transform: translate(-160px, -50px); }
  62%, 70%  { transform: translate(-160px, -50px); }
  72%, 85%  { transform: translate(-140px, -52px) rotate(-4deg); }
  100%      { transform: translate(-160px, -50px); }
}
@keyframes huddle-r3 {  /* LG */
  0%, 25%   { transform: translate(-8px, -4px); }
  30%       { transform: translate(-8px, -14px); }
  32%, 58%  { transform: translate(-80px, -50px); }
  62%, 70%  { transform: translate(-80px, -50px); }
  72%, 85%  { transform: translate(-66px, -52px) rotate(-2deg); }
  100%      { transform: translate(-80px, -50px); }
}
@keyframes huddle-r4 {  /* C — center, snaps the ball */
  0%, 25%   { transform: translate(0px, -8px); }
  30%       { transform: translate(0px, -18px); }
  32%, 58%  { transform: translate(0px, -50px); }
  62%, 70%  { transform: translate(0px, -50px); }
  72%, 75%  { transform: translate(0px, -52px); }
  78%, 85%  { transform: translate(0px, -45px) rotate(2deg); }
  100%      { transform: translate(0px, -50px); }
}
@keyframes huddle-r5 {  /* RG */
  0%, 25%   { transform: translate(8px, -4px); }
  30%       { transform: translate(8px, -14px); }
  32%, 58%  { transform: translate(80px, -50px); }
  62%, 70%  { transform: translate(80px, -50px); }
  72%, 85%  { transform: translate(66px, -52px) rotate(2deg); }
  100%      { transform: translate(80px, -50px); }
}
@keyframes huddle-r6 {  /* RT */
  0%, 25%   { transform: translate(18px, 0px); }
  30%       { transform: translate(18px, -10px); }
  32%, 58%  { transform: translate(160px, -50px); }
  62%, 70%  { transform: translate(160px, -50px); }
  72%, 85%  { transform: translate(140px, -52px) rotate(4deg); }
  100%      { transform: translate(160px, -50px); }
}
@keyframes huddle-r7 {  /* QB — drops back from huddle into shotgun */
  0%, 25%   { transform: translate(0px, 12px); }
  30%       { transform: translate(0px, 0px); }
  32%, 58%  { transform: translate(0px, 80px); }
  62%, 70%  { transform: translate(0px, 80px); }
  72%, 78%  { transform: translate(0px, 60px); }    /* receives snap */
  82%, 85%  { transform: translate(0px, 50px); }
  100%      { transform: translate(0px, 80px); }
}
@keyframes huddle-r8 {  /* HB — far right of QB in formation */
  0%, 25%   { transform: translate(30px, 8px); }
  30%       { transform: translate(30px, -2px); }
  32%, 58%  { transform: translate(220px, 30px); }
  62%, 70%  { transform: translate(220px, 30px); }
  72%, 85%  { transform: translate(220px, 30px); }
  100%      { transform: translate(220px, 30px); }
}

.scene-huddle .r-wrap { transform-origin: center; }

/* Camera dolly — slow push-in over the loop */
@keyframes huddle-dolly {
  0%        { transform: scale(1) translate(0, 0); }
  20%       { transform: scale(1.05) translate(0, -8px); }
  60%       { transform: scale(1.08) translate(-10px, -10px); }
  90%       { transform: scale(1.12) translate(0, -14px); }
  100%      { transform: scale(1) translate(0, 0); }
}
.scene-huddle .huddle-dolly { animation: huddle-dolly 12s ease-in-out infinite; transform-origin: 600px 460px; }

/* Stadium lamps sweep + flicker */
@keyframes lamp-sweep-1 {
  0%, 100% { transform: translate(-30px, 0); opacity: 0.7; }
  35%      { transform: translate(60px, 0); opacity: 0.9; }
  70%      { transform: translate(20px, 0); opacity: 0.5; }
}
@keyframes lamp-sweep-2 {
  0%, 100% { transform: translate(20px, 0); opacity: 0.6; }
  40%      { transform: translate(-40px, 0); opacity: 0.95; }
  75%      { transform: translate(30px, 0); opacity: 0.7; }
}
@keyframes lamp-sweep-3 {
  0%, 100% { transform: translate(0, 0); opacity: 0.65; }
  30%      { transform: translate(-50px, 0); opacity: 0.85; }
  80%      { transform: translate(40px, 0); opacity: 0.5; }
}
.scene-huddle .lamp-1 { animation: lamp-sweep-1 9s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-huddle .lamp-2 { animation: lamp-sweep-2 11s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-huddle .lamp-3 { animation: lamp-sweep-3 10s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }

/* Play-call arrows draw on after break */
@keyframes play-arrow-draw {
  0%, 35%   { opacity: 0; stroke-dashoffset: 500; }
  42%       { opacity: 1; stroke-dashoffset: 0; }
  78%       { opacity: 1; stroke-dashoffset: 0; }
  88%, 100% { opacity: 0; stroke-dashoffset: -100; }
}
.scene-huddle .play-arrows { opacity: 1; }
.scene-huddle .parrow { animation: play-arrow-draw 12s ease-in-out infinite; }
.scene-huddle .pa2 { animation-delay: 0.15s; }

@keyframes arrow-head-pop {
  0%, 40%   { opacity: 0; transform: translate(1080px, 320px) scale(0.4); }
  46%       { opacity: 1; transform: translate(1080px, 320px) scale(1.4); }
  78%       { opacity: 1; transform: translate(1080px, 320px) scale(1); }
  88%, 100% { opacity: 0; transform: translate(1080px, 320px) scale(0.6); }
}
.scene-huddle .ph1 { animation: arrow-head-pop 12s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }

/* Chant motes drifting up */
@keyframes mote-rise {
  0%        { opacity: 0; transform: translate(0, 0) scale(1); }
  15%       { opacity: 0.9; transform: translate(0, -20px) scale(1.1); }
  60%       { opacity: 0.5; transform: translate(8px, -90px) scale(0.8); }
  100%      { opacity: 0; transform: translate(-4px, -160px) scale(0.4); }
}
.scene-huddle .mote { animation: mote-rise 4s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-huddle .m0 { animation-delay: 0s; }
.scene-huddle .m1 { animation-delay: 0.4s; }
.scene-huddle .m2 { animation-delay: 0.8s; }
.scene-huddle .m3 { animation-delay: 1.2s; }
.scene-huddle .m4 { animation-delay: 1.6s; }
.scene-huddle .m5 { animation-delay: 2.0s; }
.scene-huddle .m6 { animation-delay: 2.4s; }
.scene-huddle .m7 { animation-delay: 2.8s; }
.scene-huddle .m8 { animation-delay: 3.2s; }
.scene-huddle .m9 { animation-delay: 3.6s; }

/* QB pulse halo on snap */
@keyframes qb-halo {
  0%, 70%   { opacity: 0; transform: scale(0.4); }
  78%       { opacity: 0.9; transform: scale(1); }
  86%       { opacity: 0.5; transform: scale(1.6); }
  92%, 100% { opacity: 0; transform: scale(2); }
}
.scene-huddle .qb-halo { animation: qb-halo 12s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-huddle .r1 { animation: huddle-r1 12s cubic-bezier(0.34, 1.2, 0.64, 1) infinite; }
.scene-huddle .r2 { animation: huddle-r2 12s cubic-bezier(0.34, 1.2, 0.64, 1) infinite; }
.scene-huddle .r3 { animation: huddle-r3 12s cubic-bezier(0.34, 1.2, 0.64, 1) infinite; }
.scene-huddle .r4 { animation: huddle-r4 12s cubic-bezier(0.34, 1.2, 0.64, 1) infinite; }
.scene-huddle .r5 { animation: huddle-r5 12s cubic-bezier(0.34, 1.2, 0.64, 1) infinite; }
.scene-huddle .r6 { animation: huddle-r6 12s cubic-bezier(0.34, 1.2, 0.64, 1) infinite; }
.scene-huddle .r7 { animation: huddle-r7 12s cubic-bezier(0.34, 1.2, 0.64, 1) infinite; }
.scene-huddle .r8 { animation: huddle-r8 12s cubic-bezier(0.34, 1.2, 0.64, 1) infinite; }

/* Speech bubble — visible only during the huddle phase */
@keyframes huddle-bubble {
  0%, 4%    { opacity: 0; transform: translate(600px, 235px) scale(0.85); }
  10%, 22%  { opacity: 1; transform: translate(600px, 235px) scale(1); }
  28%, 100% { opacity: 0; transform: translate(600px, 235px) scale(0.9); }
}
.scene-huddle .bubble { animation: huddle-bubble 12s ease-out infinite; opacity: 0; transform-origin: center; }

/* Football flies in pre-snap, lands at QB */
@keyframes football-snap {
  0%, 70%   { opacity: 0; transform: translate(600px, 460px); }
  72%       { opacity: 1; transform: translate(600px, 410px) rotate(180deg); }
  76%       { opacity: 1; transform: translate(600px, 510px) rotate(540deg); }
  78%, 84%  { opacity: 1; transform: translate(600px, 540px) rotate(720deg); }
  88%, 100% { opacity: 0; transform: translate(600px, 540px) rotate(720deg); }
}
.scene-huddle .football { animation: football-snap 12s ease-in-out infinite; opacity: 0; transform-origin: center; }

/* Dust puffs at break */
@keyframes dust-rise {
  0%, 30%   { opacity: 0; transform: translateY(0) scale(0.5); }
  35%       { opacity: 0.6; transform: translateY(-8px) scale(1); }
  50%       { opacity: 0; transform: translateY(-20px) scale(1.5); }
  100%      { opacity: 0; transform: translateY(-20px) scale(1.5); }
}
.scene-huddle .puff { animation: dust-rise 12s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-huddle .p0 { animation-duration: 12s; }
.scene-huddle .p1 { animation-duration: 11.5s; }
.scene-huddle .p2 { animation-duration: 12.5s; }
.scene-huddle .p3 { animation-duration: 11s; }
.scene-huddle .p4 { animation-duration: 12.2s; }
.scene-huddle .p5 { animation-duration: 11.8s; }

/* Sparks — rise from break point */
@keyframes spark-pop {
  0%, 28%   { opacity: 0; transform: translateY(0) scale(0); }
  32%       { opacity: 1; transform: translateY(-12px) scale(1); }
  44%       { opacity: 0; transform: translateY(-30px) scale(0.5); }
  100%      { opacity: 0; transform: translateY(-30px) scale(0.5); }
}
.scene-huddle .sp { animation: spark-pop 12s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-huddle .s0 { animation-duration: 12s; }
.scene-huddle .s1 { animation-duration: 11.6s; }
.scene-huddle .s2 { animation-duration: 12.4s; }
.scene-huddle .s3 { animation-duration: 11.2s; }
.scene-huddle .s4 { animation-duration: 12.8s; }
.scene-huddle .s5 { animation-duration: 11.8s; }
.scene-huddle .s6 { animation-duration: 12.2s; }
.scene-huddle .s7 { animation-duration: 11.4s; }

/* Energy ring blasts out at the break, then again at the snap */
@keyframes energy-ring {
  0%, 26%   { opacity: 0; transform: scale(0.4); }
  29%       { opacity: 0.9; transform: scale(0.6); }
  36%       { opacity: 0.4; transform: scale(2.2); }
  42%       { opacity: 0; transform: scale(3.2); }
  72%       { opacity: 0; transform: scale(0.4); }
  76%       { opacity: 0.8; transform: scale(0.6); }
  82%       { opacity: 0; transform: scale(2.6); }
  100%      { opacity: 0; transform: scale(0.4); }
}
.scene-huddle .ring { animation: energy-ring 12s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-huddle .r-1 { animation-duration: 12s; }
.scene-huddle .r-2 { animation-duration: 12s; animation-delay: -0.15s; }
.scene-huddle .r-3 { animation-duration: 12s; animation-delay: -0.3s; }
.scene-huddle .s6 { animation-duration: 12.2s; }
.scene-huddle .s7 { animation-duration: 11.4s; }

/* ─────── SCENE 2 — RUN: HANDOFF → BLOCK → IMPACT → ENDZONE ─────── */
/* 10s loop:
   0–8%   : set / pre-snap stillness
   8–18%  : QB receives snap, starts moving back
   18–32% : handoff to RB; RB takes ball, QB clears out
   32–55% : RB sprints right, blockers push, foes get rocked back
   55–72% : juke at second level, impact stars
   72–90% : sprint to endzone, cross goal line
   90–100%: confetti burst, hold, reset
*/

/* Camera shake — fires on big impacts */
@keyframes field-shake {
  0%, 30%   { transform: translate(0,0); }
  32%       { transform: translate(-3px, 1px); }   /* line collision */
  34%       { transform: translate(2px, -1px); }
  36%       { transform: translate(0, 0); }
  60%       { transform: translate(2px, -2px); }   /* juke impact */
  62%       { transform: translate(-2px, 1px); }
  64%       { transform: translate(0, 0); }
  88%       { transform: translate(-4px, 2px); }   /* touchdown */
  90%       { transform: translate(4px, -2px); }
  92%       { transform: translate(-2px, 1px); }
  94%, 100% { transform: translate(0, 0); }
}
.scene-run .field-shake { animation: field-shake 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }

/* Pre-snap play diagram — draws in then fades when ball moves */
@keyframes route-draw {
  0%       { stroke-dashoffset: 1400; opacity: 0; }
  6%       { opacity: 0.7; }
  16%      { stroke-dashoffset: 0; opacity: 0.7; }
  24%      { opacity: 0.5; }
  30%, 100%{ opacity: 0; stroke-dashoffset: 0; }
}
.scene-run .play-diagram .route { stroke-dasharray: 1400; animation: route-draw 10s ease-out infinite; }
@keyframes route-dot-pop {
  0%, 8%   { opacity: 0; transform: scale(0); }
  12%      { opacity: 1; transform: scale(1.6); }
  16%      { opacity: 1; transform: scale(1); }
  28%      { opacity: 0.5; transform: scale(1); }
  32%, 100%{ opacity: 0; transform: scale(1); }
}
.scene-run .route-dot { animation: route-dot-pop 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .rd0 { animation-delay: -10s; }  /* fires immediately on first cycle */
.scene-run .rd1 { animation-duration: 10.4s; }
.scene-run .rd2 { animation-duration: 10.8s; }
.scene-run .rd3 { animation-duration: 11.2s; }

/* Spotlight follows the RB */
@keyframes spotlight-follow {
  0%, 8%   { transform: translate(240px, 320px); opacity: 0; }
  12%      { opacity: 0.9; }
  18%      { transform: translate(280px, 350px); }
  28%      { transform: translate(320px, 350px); }
  40%      { transform: translate(440px, 320px); }
  55%      { transform: translate(640px, 290px); }
  62%      { transform: translate(720px, 320px); }
  78%      { transform: translate(960px, 290px); opacity: 0.9; }
  90%      { transform: translate(1200px, 280px); opacity: 1; }
  100%     { transform: translate(1200px, 280px); opacity: 0; }
}
.scene-run .spotlight { animation: spotlight-follow 10s cubic-bezier(0.45, 0.05, 0.5, 0.95) infinite; }

@keyframes qb-run {
  0%, 8%    { transform: translate(0, 0) scale(1); }
  18%       { transform: translate(40px, -10px) scale(1); }
  28%       { transform: translate(-20px, -20px) scale(1); }
  44%       { transform: translate(-20px, 40px) scale(1); }
  72%       { transform: translate(60px, 80px) scale(1); }
  100%      { transform: translate(60px, 80px) scale(1); opacity: 0.6; }
}
.scene-run .qb { animation: qb-run 10s cubic-bezier(0.45, 0.05, 0.5, 0.95) infinite; }

/* RB carries the ball: starts at handoff, sprints diagonally right with bounce */
@keyframes rb-run {
  0%, 6%    { transform: translate(0, 0) scale(1); }
  14%       { transform: translate(20px, 20px) scale(1.02); }
  22%       { transform: translate(40px, 40px) scale(1.06); }
  30%       { transform: translate(120px, 22px) scale(1.06); }
  40%       { transform: translate(220px, 0) scale(1.08); }
  50%       { transform: translate(340px, -10px) scale(1.1); }
  56%       { transform: translate(420px, -28px) scale(1.1); }     /* juke right */
  62%       { transform: translate(500px, 6px) scale(1.1); }       /* juke back */
  72%       { transform: translate(680px, -20px) scale(1.14); }
  82%       { transform: translate(880px, -28px) scale(1.18); }
  90%       { transform: translate(1000px, -34px) scale(1.22); }   /* in endzone */
  100%      { transform: translate(1000px, -34px) scale(1.22); }
}
.scene-run .rb { animation: rb-run 10s cubic-bezier(0.42, 0, 0.4, 1) infinite; }

/* Blockers push, drive defenders, then disengage */
@keyframes blocker-push {
  0%, 8%    { transform: translate(0,0) rotate(0deg); }
  18%       { transform: translate(10px, -2px) rotate(-3deg); }
  32%       { transform: translate(34px, -4px) rotate(-7deg); }
  48%       { transform: translate(54px, 0) rotate(2deg); }
  72%       { transform: translate(60px, 4px) rotate(-2deg); }
  100%      { transform: translate(0,0) rotate(0deg); }
}
@keyframes blocker-push-2 {
  0%, 8%    { transform: translate(0,0) rotate(0deg); }
  20%       { transform: translate(12px, 2px) rotate(3deg); }
  38%       { transform: translate(38px, 0) rotate(6deg); }
  56%       { transform: translate(58px, -4px) rotate(-3deg); }
  72%       { transform: translate(60px, -2px) rotate(2deg); }
  100%      { transform: translate(0,0) rotate(0deg); }
}
.scene-run .b1 { animation: blocker-push 10s ease-out infinite; }
.scene-run .b2 { animation: blocker-push-2 10s ease-out infinite; }
.scene-run .b3 { animation: blocker-push 10s ease-out infinite; }
.scene-run .b4 { animation: blocker-push-2 10s ease-out infinite; }
.scene-run .b5 { animation: blocker-push 10s ease-out infinite; }

/* Defenders blasted back hard, with overshoot */
@keyframes foe-knockback-up {
  0%, 12%   { transform: translate(0,0) rotate(0); }
  22%       { transform: translate(-10px, 4px) rotate(-8deg); }
  36%       { transform: translate(-40px, 10px) rotate(-32deg); }
  55%       { transform: translate(-65px, 16px) rotate(-55deg); }
  100%      { transform: translate(-65px, 16px) rotate(-55deg); }
}
@keyframes foe-knockback-down {
  0%, 12%   { transform: translate(0,0) rotate(0); }
  22%       { transform: translate(-10px, -4px) rotate(8deg); }
  36%       { transform: translate(-40px, -10px) rotate(32deg); }
  55%       { transform: translate(-65px, -16px) rotate(55deg); }
  100%      { transform: translate(-65px, -16px) rotate(55deg); }
}
@keyframes foe-knockback-mid {
  0%, 12%   { transform: translate(0,0) rotate(0); }
  22%       { transform: translate(-12px, 0) rotate(0); }
  36%       { transform: translate(-50px, 6px) rotate(20deg); }
  55%       { transform: translate(-78px, 10px) rotate(45deg); }
  100%      { transform: translate(-78px, 10px) rotate(45deg); }
}
.scene-run .f1 { animation: foe-knockback-up   10s cubic-bezier(0.4, 1.6, 0.6, 1) infinite; }
.scene-run .f2 { animation: foe-knockback-mid  10s cubic-bezier(0.4, 1.6, 0.6, 1) infinite; }
.scene-run .f3 { animation: foe-knockback-down 10s cubic-bezier(0.4, 1.6, 0.6, 1) infinite; }
.scene-run .f4 { animation: foe-knockback-up   10s cubic-bezier(0.4, 1.6, 0.6, 1) infinite; }
.scene-run .f5 { animation: foe-knockback-down 10s cubic-bezier(0.4, 1.6, 0.6, 1) infinite; }

/* Safety arrives at second level, gets juked into oblivion */
@keyframes foe-juked {
  0%, 50%   { transform: translate(0,0) rotate(0); }
  58%       { transform: translate(20px, -12px) rotate(-15deg); }
  66%       { transform: translate(56px, 32px) rotate(60deg); }
  72%       { transform: translate(72px, 48px) rotate(90deg); }
  100%      { transform: translate(72px, 48px) rotate(90deg); }
}
.scene-run .f6 { animation: foe-juked 10s cubic-bezier(0.4, 1.4, 0.6, 1) infinite; }

/* Phone glow ramps up dramatically near the endzone */
@keyframes phone-glow {
  0%, 55%   { filter: drop-shadow(0 0 0 transparent); }
  72%       { filter: drop-shadow(0 0 8px var(--coral-500)); }
  82%, 92%  { filter: drop-shadow(0 0 14px var(--coral-500)) drop-shadow(0 0 28px rgba(232,93,60,0.7)); }
  100%      { filter: drop-shadow(0 0 0 transparent); }
}
.scene-run .phone-grp { animation: phone-glow 10s ease-in-out infinite; }

/* End-zone flash + text pulse */
@keyframes endzone-flash {
  0%, 78%   { opacity: 0; }
  84%       { opacity: 0.85; }
  92%       { opacity: 0.4; }
  100%      { opacity: 0; }
}
.scene-run .endzone-flash { animation: endzone-flash 10s ease-out infinite; }

/* Spark trail — staggered durations */
@keyframes trail-fire {
  0%, 30%   { opacity: 0; }
  38%       { opacity: 0.9; }
  60%       { opacity: 0.4; }
  85%, 100% { opacity: 0; }
}
.scene-run .trail { animation: trail-fire 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .t0 { animation-duration: 10s; }
.scene-run .t1 { animation-duration: 9.7s; }
.scene-run .t2 { animation-duration: 10.3s; }
.scene-run .t3 { animation-duration: 9.5s; }
.scene-run .t4 { animation-duration: 10.5s; }
.scene-run .t5 { animation-duration: 9.8s; }
.scene-run .t6 { animation-duration: 10.2s; }
.scene-run .t7 { animation-duration: 9.6s; }
.scene-run .t8 { animation-duration: 10.4s; }
.scene-run .t9 { animation-duration: 9.9s; }
.scene-run .t10 { animation-duration: 10.1s; }
.scene-run .t11 { animation-duration: 9.4s; }
.scene-run .t12 { animation-duration: 10.6s; }
.scene-run .t13 { animation-duration: 9.7s; }
.scene-run .t14 { animation-duration: 10.2s; }
.scene-run .t15 { animation-duration: 9.5s; }
.scene-run .t16 { animation-duration: 10.5s; }
.scene-run .t17 { animation-duration: 9.8s; }

/* Speed lines — streak past during sprint */
@keyframes speed-streak {
  0%, 35%   { opacity: 0; transform: translateX(0); }
  45%       { opacity: 0.8; transform: translateX(-20px); }
  55%       { opacity: 0.5; transform: translateX(-60px); }
  65%       { opacity: 0; transform: translateX(-100px); }
  100%      { opacity: 0; transform: translateX(0); }
}
.scene-run .sl { animation: speed-streak 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .sl0 { animation-duration: 9.6s; }
.scene-run .sl1 { animation-duration: 10.0s; }
.scene-run .sl2 { animation-duration: 9.4s; }
.scene-run .sl3 { animation-duration: 10.2s; }
.scene-run .sl4 { animation-duration: 9.8s; }
.scene-run .sl5 { animation-duration: 10.4s; }
.scene-run .sl6 { animation-duration: 9.5s; }
.scene-run .sl7 { animation-duration: 10.1s; }

/* Confetti bursts on touchdown — bigger fan-out */
@keyframes conf-burst {
  0%, 86%   { opacity: 0; transform: translate(0, 0) rotate(0); }
  90%       { opacity: 1; transform: translate(0, 0) rotate(45deg) scale(1.2); }
  100%      { opacity: 0; transform: translate(0, 80px) rotate(220deg) scale(1); }
}
.scene-run .conf { animation: conf-burst 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .c0 { animation-duration: 10s; }
.scene-run .c1 { animation-duration: 9.5s; }
.scene-run .c2 { animation-duration: 10.5s; }
.scene-run .c3 { animation-duration: 9.7s; }
.scene-run .c4 { animation-duration: 10.3s; }
.scene-run .c5 { animation-duration: 9.4s; }
.scene-run .c6 { animation-duration: 10.6s; }
.scene-run .c7 { animation-duration: 9.8s; }
.scene-run .c8 { animation-duration: 10.2s; }
.scene-run .c9 { animation-duration: 9.6s; }
.scene-run .c10 { animation-duration: 10.4s; }
.scene-run .c11 { animation-duration: 9.9s; }
.scene-run .c12 { animation-duration: 10.1s; }
.scene-run .c13 { animation-duration: 9.3s; }
.scene-run .c14 { animation-duration: 10.7s; }
.scene-run .c15 { animation-duration: 9.5s; }
.scene-run .c16 { animation-duration: 10.5s; }
.scene-run .c17 { animation-duration: 9.7s; }
.scene-run .c18 { animation-duration: 10.0s; }
.scene-run .c19 { animation-duration: 9.6s; }
.scene-run .c20 { animation-duration: 10.4s; }
.scene-run .c21 { animation-duration: 9.8s; }
.scene-run .c22 { animation-duration: 10.2s; }
.scene-run .c23 { animation-duration: 9.5s; }

/* Impact stars — line collision (early) and juke (mid) */
@keyframes impact-line-pop {
  0%, 28%   { opacity: 0; transform: scale(0) rotate(0); }
  32%       { opacity: 1; transform: scale(1.4) rotate(15deg); }
  38%       { opacity: 1; transform: scale(1) rotate(-8deg); }
  44%, 100% { opacity: 0; transform: scale(0.6) rotate(0); }
}
.scene-run .impact-line path { animation: impact-line-pop 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .impact-text-line { animation: impact-line-pop 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }

@keyframes impact-pop {
  0%, 56%   { opacity: 0; transform: scale(0) rotate(0); }
  62%       { opacity: 1; transform: scale(1.7) rotate(20deg); }
  68%       { opacity: 1; transform: scale(1) rotate(-10deg); }
  74%, 100% { opacity: 0; transform: scale(0.6) rotate(0); }
}
.scene-run .impact path { animation: impact-pop 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .impact-text { animation: impact-pop 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }

/* TOUCHDOWN stamp punches in */
@keyframes td-stamp-punch {
  0%, 88%   { opacity: 0; transform: translate(700px, 200px) scale(0.3) rotate(-8deg); }
  91%       { opacity: 1; transform: translate(700px, 200px) scale(1.15) rotate(2deg); }
  94%       { opacity: 1; transform: translate(700px, 180px) scale(0.95) rotate(-1deg); }
  98%       { opacity: 1; transform: translate(700px, 180px) scale(1) rotate(0); }
  100%      { opacity: 0; transform: translate(700px, 200px) scale(1) rotate(0); }
}
.scene-run .td-stamp { animation: td-stamp-punch 10s cubic-bezier(0.34, 1.8, 0.5, 1) infinite; transform-box: fill-box; transform-origin: center; }

/* Trophy spin / wobble */
@keyframes trophy-wobble {
  0%, 88%   { transform: rotate(0deg) scale(1); }
  91%       { transform: rotate(-4deg) scale(1.05); }
  94%       { transform: rotate(4deg) scale(1.02); }
  97%       { transform: rotate(-2deg) scale(1.04); }
  100%      { transform: rotate(0deg) scale(1); }
}
.scene-run .trophy { animation: trophy-wobble 10s ease-in-out infinite; transform-box: fill-box; transform-origin: center 20px; }

/* Trophy star pulses */
@keyframes star-pulse {
  0%, 88%   { transform: scale(1); filter: drop-shadow(0 0 0 transparent); }
  92%       { transform: scale(1.25); filter: drop-shadow(0 0 8px #FFD166); }
  100%      { transform: scale(1); filter: drop-shadow(0 0 0 transparent); }
}
.scene-run .trophy-star { animation: star-pulse 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }

/* Streamers shoot outward */
@keyframes streamer-shoot {
  0%, 88%   { opacity: 0; transform: scale(0.2); stroke-dashoffset: 200; }
  92%       { opacity: 1; transform: scale(1); stroke-dashoffset: 0; }
  100%      { opacity: 0.6; transform: scale(1.15); stroke-dashoffset: -40; }
}
.scene-run .streamer { animation: streamer-shoot 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .streamer.s0 { animation-delay: 0s; }
.scene-run .streamer.s1 { animation-delay: 0.04s; }
.scene-run .streamer.s2 { animation-delay: 0.08s; }
.scene-run .streamer.s3 { animation-delay: 0.12s; }
.scene-run .streamer.s4 { animation-delay: 0.16s; }
.scene-run .streamer.s5 { animation-delay: 0.20s; }
.scene-run .streamer.s6 { animation-delay: 0.24s; }
.scene-run .streamer.s7 { animation-delay: 0.28s; }
.scene-run .streamer.s8 { animation-delay: 0.32s; }
.scene-run .streamer.s9 { animation-delay: 0.36s; }
.scene-run .streamer.s10 { animation-delay: 0.40s; }
.scene-run .streamer.s11 { animation-delay: 0.44s; }
.scene-run .streamer.s12 { animation-delay: 0.48s; }
.scene-run .streamer.s13 { animation-delay: 0.52s; }

/* Sparkles twinkle */
@keyframes spk-twinkle {
  0%, 88%   { opacity: 0; transform: scale(0); }
  92%       { opacity: 1; transform: scale(1.4); }
  96%       { opacity: 0.8; transform: scale(0.9); }
  100%      { opacity: 0; transform: scale(0.4); }
}
.scene-run .spk { animation: spk-twinkle 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .spk.spk0 { animation-delay: 0.05s; }
.scene-run .spk.spk1 { animation-delay: 0.15s; }
.scene-run .spk.spk2 { animation-delay: 0.10s; }
.scene-run .spk.spk3 { animation-delay: 0.25s; }
.scene-run .spk.spk4 { animation-delay: 0.08s; }
.scene-run .spk.spk5 { animation-delay: 0.20s; }
.scene-run .spk.spk6 { animation-delay: 0.18s; }
.scene-run .spk.spk7 { animation-delay: 0.12s; }

/* Crowd cheer pulse — subtle radial wash near endzone at the end */
@keyframes crowd-cheer {
  0%, 80%   { opacity: 0; transform: scale(0.6); }
  88%       { opacity: 0.45; transform: scale(1); }
  100%      { opacity: 0; transform: scale(1.4); }
}
.scene-run .crowd-pulse { animation: crowd-cheer 10s ease-out infinite; transform-box: fill-box; transform-origin: 1340px 320px; }

/* Dust puffs at carrier feet during sprint */
@keyframes dust-kick {
  0%, 28%   { opacity: 0; transform: translate(0, 0) scale(0.3); }
  35%       { opacity: 0.7; transform: translate(-8px, -4px) scale(0.9); }
  55%       { opacity: 0.3; transform: translate(-22px, -10px) scale(1.4); }
  70%, 100% { opacity: 0; transform: translate(-40px, -16px) scale(1.7); }
}
.scene-run .dust { animation: dust-kick 10s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.scene-run .dust.d0 { animation-delay: 0s; }
.scene-run .dust.d1 { animation-delay: 0.4s; }
.scene-run .dust.d2 { animation-delay: 0.8s; }
.scene-run .dust.d3 { animation-delay: 1.2s; }
.scene-run .dust.d4 { animation-delay: 1.6s; }
.scene-run .dust.d5 { animation-delay: 2.0s; }

/* Ball-trail blur */
@keyframes ball-trail-fade {
  0%, 25%   { opacity: 0; }
  40%       { opacity: 0.5; }
  85%       { opacity: 0.3; }
  92%, 100% { opacity: 0; }
}
.scene-run .ball-trail { animation: ball-trail-fade 10s ease-in-out infinite; }

/* Yard numbers light up as the play passes */
@keyframes yard-num-pulse {
  0%, 30%   { fill-opacity: 0.18; }
  50%       { fill-opacity: 0.45; }
  100%      { fill-opacity: 0.18; }
}
.scene-run .yard-numbers text:nth-child(5) { animation: yard-num-pulse 10s ease-in-out infinite; }
.scene-run .yard-numbers text:nth-child(6) { animation: yard-num-pulse 10s ease-in-out infinite; }
.scene-run .yard-numbers text:nth-child(7) { animation: yard-num-pulse 10s ease-in-out infinite; }

/* Faster, snappier leg pump */
@keyframes leg-pump {
  0%, 100% { transform: rotate(-12deg); }
  50%      { transform: rotate(20deg); }
}
.scene-run .rb .leg-l { animation: leg-pump 0.22s ease-in-out infinite; transform-origin: top center; transform-box: fill-box; }
.scene-run .rb .leg-r { animation: leg-pump 0.22s ease-in-out infinite reverse; transform-origin: top center; transform-box: fill-box; }
.scene-run .qb .leg-l { animation: leg-pump 0.32s ease-in-out infinite; transform-origin: top center; transform-box: fill-box; }
.scene-run .qb .leg-r { animation: leg-pump 0.32s ease-in-out infinite reverse; transform-origin: top center; transform-box: fill-box; }

/* ─────── CELEBRATION SCENE ─────── */
@keyframes celeb-jump {
  0%, 100%  { transform: translateY(0); }
  20%       { transform: translateY(-30px); }
  40%       { transform: translateY(0); }
  50%       { transform: translateY(-15px); }
  60%       { transform: translateY(0); }
  80%       { transform: translateY(-40px) rotate(8deg); }
}
@keyframes celeb-jump-alt {
  0%, 100%  { transform: translateY(0); }
  15%       { transform: translateY(-20px); }
  30%       { transform: translateY(0); }
  55%       { transform: translateY(-35px) rotate(-6deg); }
  70%       { transform: translateY(0); }
  85%       { transform: translateY(-22px); }
}
.scene-celeb .c1 { animation: celeb-jump 2s ease-in-out infinite; }
.scene-celeb .c2 { animation: celeb-jump-alt 2.2s ease-in-out infinite; }
.scene-celeb .c3 { animation: celeb-jump 1.8s ease-in-out infinite; }
.scene-celeb .c4 { animation: celeb-jump-alt 2.1s ease-in-out infinite; }
.scene-celeb .c5 { animation: celeb-jump 2.3s ease-in-out infinite; }

@keyframes celeb-confetti-fall {
  0%        { transform: translateY(0) rotate(0); opacity: 0; }
  10%       { opacity: 1; }
  100%      { transform: translateY(550px) rotate(720deg); opacity: 0.8; }
}
.scene-celeb .cc { animation: celeb-confetti-fall 4s linear infinite; transform-box: fill-box; transform-origin: center; }
.scene-celeb .cc0 { animation-duration: 4.0s; }
.scene-celeb .cc1 { animation-duration: 3.6s; }
.scene-celeb .cc2 { animation-duration: 4.4s; }
.scene-celeb .cc3 { animation-duration: 3.8s; }
.scene-celeb .cc4 { animation-duration: 4.2s; }
.scene-celeb .cc5 { animation-duration: 3.5s; }
.scene-celeb .cc6 { animation-duration: 4.6s; }
.scene-celeb .cc7 { animation-duration: 4.0s; }
.scene-celeb .cc8 { animation-duration: 3.7s; }
.scene-celeb .cc9 { animation-duration: 4.3s; }
.scene-celeb .cc10 { animation-duration: 3.9s; }
.scene-celeb .cc11 { animation-duration: 4.5s; }
.scene-celeb .cc12 { animation-duration: 3.6s; }
.scene-celeb .cc13 { animation-duration: 4.1s; }
.scene-celeb .cc14 { animation-duration: 3.8s; }
.scene-celeb .cc15 { animation-duration: 4.4s; }
.scene-celeb .cc16 { animation-duration: 3.5s; }
.scene-celeb .cc17 { animation-duration: 4.6s; }
.scene-celeb .cc18 { animation-duration: 3.9s; }
.scene-celeb .cc19 { animation-duration: 4.2s; }
.scene-celeb .cc20 { animation-duration: 3.7s; }
.scene-celeb .cc21 { animation-duration: 4.3s; }
.scene-celeb .cc22 { animation-duration: 4.0s; }
.scene-celeb .cc23 { animation-duration: 3.6s; }
.scene-celeb .cc24 { animation-duration: 4.5s; }
.scene-celeb .cc25 { animation-duration: 3.8s; }
.scene-celeb .cc26 { animation-duration: 4.1s; }
.scene-celeb .cc27 { animation-duration: 3.5s; }
.scene-celeb .cc28 { animation-duration: 4.4s; }
.scene-celeb .cc29 { animation-duration: 3.9s; }
.scene-celeb .cc30 { animation-duration: 4.2s; }
.scene-celeb .cc31 { animation-duration: 3.7s; }
.scene-celeb .cc32 { animation-duration: 4.3s; }
.scene-celeb .cc33 { animation-duration: 4.0s; }
.scene-celeb .cc34 { animation-duration: 3.6s; }
.scene-celeb .cc35 { animation-duration: 4.5s; }
.scene-celeb .cc36 { animation-duration: 3.8s; }
.scene-celeb .cc37 { animation-duration: 4.1s; }
.scene-celeb .cc38 { animation-duration: 3.5s; }
.scene-celeb .cc39 { animation-duration: 4.4s; }

@keyframes td-pulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.08); }
}
.scene-celeb .td-text { animation: td-pulse 1.5s ease-in-out infinite; transform-origin: 500px 130px; }

/* ─────── ACCESSIBILITY ─────── */
@media (prefers-reduced-motion: reduce) {
  .scene * {
    animation: none !important;
  }
}

/* tweak: pause */
.scene.is-paused * { animation-play-state: paused !important; }