/* DFMC battle-effect keyframes, lifted verbatim from play/markup.html by
   tools/gen_vfx_fx.py. vx* are the placeholder archetypes, vxb* the 48-sheet bank
   (vxbStep<frames>x<cols> steps a sheet, vxbLife gates a layer's delay and life).
   The !flash hit is the vxRedHit / vxHit* family: a dark, element-keyed tint of the
   target's own art, 300 ms (D 2026-09-17 - it is never white; the old vxbFlash
   brightness(3) pop is deleted), each with a *Soft member for Reduce Flashing.
   Loaded by BOTH the game client and the codex review page. Do not edit one copy. */
@keyframes vxDrop { 0% { transform:translateY(-130px); } 62% { transform:translateY(0); } 78% { transform:translateY(-14px); } 92% { transform:translateY(0); opacity:1; } 100% { transform:translateY(0); opacity:0; } }
@keyframes vxFall { 0% { transform:translateY(-44px); } 90% { opacity:1; } 100% { transform:translateY(34px); opacity:0; } }
@keyframes vxHitBlue { 0% { filter:none; } 12% { filter:sepia(1) saturate(8) hue-rotate(182deg) brightness(0.96); } 55% { filter:sepia(1) saturate(5.5) hue-rotate(182deg) brightness(0.94); } 100% { filter:none; } }
@keyframes vxHitBlueSoft { 0% { filter:none; } 12% { filter:sepia(1) saturate(2.8) hue-rotate(182deg) brightness(1); } 55% { filter:sepia(1) saturate(1.9) hue-rotate(182deg) brightness(1); } 100% { filter:none; } }
@keyframes vxHitBone { 0% { filter:none; } 12% { filter:sepia(1) saturate(0.22) brightness(0.58); } 55% { filter:sepia(1) saturate(0.3) brightness(0.66); } 100% { filter:none; } }
@keyframes vxHitBoneSoft { 0% { filter:none; } 12% { filter:sepia(1) saturate(0.3) brightness(0.82); } 55% { filter:sepia(1) saturate(0.45) brightness(0.88); } 100% { filter:none; } }
@keyframes vxHitGreen { 0% { filter:none; } 12% { filter:sepia(1) saturate(8) hue-rotate(94deg) brightness(0.98); } 55% { filter:sepia(1) saturate(5.5) hue-rotate(94deg) brightness(0.96); } 100% { filter:none; } }
@keyframes vxHitGreenSoft { 0% { filter:none; } 12% { filter:sepia(1) saturate(2.8) hue-rotate(94deg) brightness(1); } 55% { filter:sepia(1) saturate(1.9) hue-rotate(94deg) brightness(1); } 100% { filter:none; } }
@keyframes vxHitPurple { 0% { filter:none; } 12% { filter:sepia(1) saturate(8) hue-rotate(232deg) brightness(0.96); } 55% { filter:sepia(1) saturate(5.5) hue-rotate(232deg) brightness(0.94); } 100% { filter:none; } }
@keyframes vxHitPurpleSoft { 0% { filter:none; } 12% { filter:sepia(1) saturate(2.8) hue-rotate(232deg) brightness(1); } 55% { filter:sepia(1) saturate(1.9) hue-rotate(232deg) brightness(1); } 100% { filter:none; } }
@keyframes vxHitRust { 0% { filter:none; } 12% { filter:sepia(1) saturate(8) hue-rotate(-21deg) brightness(1); } 55% { filter:sepia(1) saturate(5.5) hue-rotate(-21deg) brightness(0.98); } 100% { filter:none; } }
@keyframes vxHitRustSoft { 0% { filter:none; } 12% { filter:sepia(1) saturate(2.8) hue-rotate(-21deg) brightness(1); } 55% { filter:sepia(1) saturate(1.9) hue-rotate(-21deg) brightness(1); } 100% { filter:none; } }
@keyframes vxJabL { 0% { transform:translateX(90px) scaleX(-.35); } 55% { transform:translateX(-46px) scaleX(-1); } 90% { opacity:1; } 100% { transform:translateX(-38px) scaleX(-.9); opacity:0; } }
@keyframes vxJabR { 0% { transform:translateX(-90px) scaleX(.35); } 55% { transform:translateX(46px) scaleX(1); } 90% { opacity:1; } 100% { transform:translateX(38px) scaleX(.9); opacity:0; } }
@keyframes vxOut { 0% { transform:translateX(6px); } 88% { opacity:1; } 100% { transform:translateX(92px); opacity:0; } }
@keyframes vxPulse { 0% { transform:scale(.3); } 60% { transform:scale(1.14); } 88% { transform:scale(1); opacity:1; } 100% { transform:scale(1); opacity:0; } }
@keyframes vxRedHit { 0% { filter:none; } 12% { filter:sepia(1) saturate(9) hue-rotate(-38deg) brightness(1.05); } 55% { filter:sepia(1) saturate(6) hue-rotate(-38deg) brightness(1.02); } 100% { filter:none; } }
@keyframes vxRedHitSoft { 0% { filter:none; } 12% { filter:sepia(1) saturate(3) hue-rotate(-38deg) brightness(1); } 55% { filter:sepia(1) saturate(2) hue-rotate(-38deg) brightness(1); } 100% { filter:none; } }
@keyframes vxRing { 0% { transform:scale(.12); } 88% { opacity:1; } 100% { transform:scale(1.5); opacity:0; } }
@keyframes vxRise { 0% { transform:translateY(16px); } 90% { opacity:1; } 100% { transform:translateY(-52px); opacity:0; } }
@keyframes vxRushL { 0% { transform:translateX(150px) scaleX(-1); } 60% { transform:translateX(-24px) scaleX(-1); } 90% { opacity:1; } 100% { transform:translateX(-16px) scaleX(-1); opacity:0; } }
@keyframes vxRushR { 0% { transform:translateX(-150px); } 60% { transform:translateX(24px); } 90% { opacity:1; } 100% { transform:translateX(16px); opacity:0; } }
@keyframes vxSlash { 0% { opacity:0; transform:translate(-50%,-50%) scale(.72) rotate(-6deg); } 18% { opacity:1; transform:translate(-50%,-50%) scale(1.06) rotate(0deg); } 100% { opacity:0; transform:translate(-50%,-50%) scale(1.16) rotate(3deg); } }
@keyframes vxSplitL { 0% { transform:translate(0,0) rotate(0); } 90% { opacity:1; } 100% { transform:translate(-26px,16px) rotate(-16deg); opacity:0; } }
@keyframes vxSplitR { 0% { transform:translate(0,0) rotate(0); } 90% { opacity:1; } 100% { transform:translate(26px,16px) rotate(14deg); opacity:0; } }
@keyframes vxStreamL { 0% { transform:translateX(120px) scaleX(-1); } 92% { opacity:1; } 100% { transform:translateX(-140px) scaleX(-1); opacity:0; } }
@keyframes vxStreamR { 0% { transform:translateX(-120px); } 92% { opacity:1; } 100% { transform:translateX(140px); opacity:0; } }
@keyframes vxSweep { 0% { transform:translateX(-130%); } 100% { transform:translateX(130%); } }
@keyframes vxWhip { 0% { transform:rotate(-100deg); } 70% { transform:rotate(38deg); } 90% { opacity:1; } 100% { transform:rotate(30deg); opacity:0; } }
@keyframes vxWipe { 0% { transform:translateY(0) scaleX(.3); } 90% { opacity:1; } 100% { transform:translateY(-74px) scaleX(1); opacity:0; } }
@keyframes vxbLife { 0% { opacity:0; } 0.1% { opacity:1; } 100% { opacity:0; } }
@keyframes vxbStep11x6 { 0% { transform:translate3d(0%,0%,0); } 9.091% { transform:translate3d(-16.6667%,0%,0); } 18.182% { transform:translate3d(-33.3333%,0%,0); } 27.273% { transform:translate3d(-50%,0%,0); } 36.364% { transform:translate3d(-66.6667%,0%,0); } 45.455% { transform:translate3d(-83.3333%,0%,0); } 54.545% { transform:translate3d(0%,-50%,0); } 63.636% { transform:translate3d(-16.6667%,-50%,0); } 72.727% { transform:translate3d(-33.3333%,-50%,0); } 81.818% { transform:translate3d(-50%,-50%,0); } 90.909% { transform:translate3d(-66.6667%,-50%,0); } 100% { transform:translate3d(-66.6667%,-50%,0); } }
@keyframes vxbStep24x6 { 0% { transform:translate3d(0%,0%,0); } 4.167% { transform:translate3d(-16.6667%,0%,0); } 8.333% { transform:translate3d(-33.3333%,0%,0); } 12.5% { transform:translate3d(-50%,0%,0); } 16.667% { transform:translate3d(-66.6667%,0%,0); } 20.833% { transform:translate3d(-83.3333%,0%,0); } 25% { transform:translate3d(0%,-25%,0); } 29.167% { transform:translate3d(-16.6667%,-25%,0); } 33.333% { transform:translate3d(-33.3333%,-25%,0); } 37.5% { transform:translate3d(-50%,-25%,0); } 41.667% { transform:translate3d(-66.6667%,-25%,0); } 45.833% { transform:translate3d(-83.3333%,-25%,0); } 50% { transform:translate3d(0%,-50%,0); } 54.167% { transform:translate3d(-16.6667%,-50%,0); } 58.333% { transform:translate3d(-33.3333%,-50%,0); } 62.5% { transform:translate3d(-50%,-50%,0); } 66.667% { transform:translate3d(-66.6667%,-50%,0); } 70.833% { transform:translate3d(-83.3333%,-50%,0); } 75% { transform:translate3d(0%,-75%,0); } 79.167% { transform:translate3d(-16.6667%,-75%,0); } 83.333% { transform:translate3d(-33.3333%,-75%,0); } 87.5% { transform:translate3d(-50%,-75%,0); } 91.667% { transform:translate3d(-66.6667%,-75%,0); } 95.833% { transform:translate3d(-83.3333%,-75%,0); } 100% { transform:translate3d(-83.3333%,-75%,0); } }
@keyframes vxbStep26x6 { 0% { transform:translate3d(0%,0%,0); } 3.846% { transform:translate3d(-16.6667%,0%,0); } 7.692% { transform:translate3d(-33.3333%,0%,0); } 11.538% { transform:translate3d(-50%,0%,0); } 15.385% { transform:translate3d(-66.6667%,0%,0); } 19.231% { transform:translate3d(-83.3333%,0%,0); } 23.077% { transform:translate3d(0%,-20%,0); } 26.923% { transform:translate3d(-16.6667%,-20%,0); } 30.769% { transform:translate3d(-33.3333%,-20%,0); } 34.615% { transform:translate3d(-50%,-20%,0); } 38.462% { transform:translate3d(-66.6667%,-20%,0); } 42.308% { transform:translate3d(-83.3333%,-20%,0); } 46.154% { transform:translate3d(0%,-40%,0); } 50% { transform:translate3d(-16.6667%,-40%,0); } 53.846% { transform:translate3d(-33.3333%,-40%,0); } 57.692% { transform:translate3d(-50%,-40%,0); } 61.538% { transform:translate3d(-66.6667%,-40%,0); } 65.385% { transform:translate3d(-83.3333%,-40%,0); } 69.231% { transform:translate3d(0%,-60%,0); } 73.077% { transform:translate3d(-16.6667%,-60%,0); } 76.923% { transform:translate3d(-33.3333%,-60%,0); } 80.769% { transform:translate3d(-50%,-60%,0); } 84.615% { transform:translate3d(-66.6667%,-60%,0); } 88.462% { transform:translate3d(-83.3333%,-60%,0); } 92.308% { transform:translate3d(0%,-80%,0); } 96.154% { transform:translate3d(-16.6667%,-80%,0); } 100% { transform:translate3d(-16.6667%,-80%,0); } }
@keyframes vxbStep32x6 { 0% { transform:translate3d(0%,0%,0); } 3.125% { transform:translate3d(-16.6667%,0%,0); } 6.25% { transform:translate3d(-33.3333%,0%,0); } 9.375% { transform:translate3d(-50%,0%,0); } 12.5% { transform:translate3d(-66.6667%,0%,0); } 15.625% { transform:translate3d(-83.3333%,0%,0); } 18.75% { transform:translate3d(0%,-16.6667%,0); } 21.875% { transform:translate3d(-16.6667%,-16.6667%,0); } 25% { transform:translate3d(-33.3333%,-16.6667%,0); } 28.125% { transform:translate3d(-50%,-16.6667%,0); } 31.25% { transform:translate3d(-66.6667%,-16.6667%,0); } 34.375% { transform:translate3d(-83.3333%,-16.6667%,0); } 37.5% { transform:translate3d(0%,-33.3333%,0); } 40.625% { transform:translate3d(-16.6667%,-33.3333%,0); } 43.75% { transform:translate3d(-33.3333%,-33.3333%,0); } 46.875% { transform:translate3d(-50%,-33.3333%,0); } 50% { transform:translate3d(-66.6667%,-33.3333%,0); } 53.125% { transform:translate3d(-83.3333%,-33.3333%,0); } 56.25% { transform:translate3d(0%,-50%,0); } 59.375% { transform:translate3d(-16.6667%,-50%,0); } 62.5% { transform:translate3d(-33.3333%,-50%,0); } 65.625% { transform:translate3d(-50%,-50%,0); } 68.75% { transform:translate3d(-66.6667%,-50%,0); } 71.875% { transform:translate3d(-83.3333%,-50%,0); } 75% { transform:translate3d(0%,-66.6667%,0); } 78.125% { transform:translate3d(-16.6667%,-66.6667%,0); } 81.25% { transform:translate3d(-33.3333%,-66.6667%,0); } 84.375% { transform:translate3d(-50%,-66.6667%,0); } 87.5% { transform:translate3d(-66.6667%,-66.6667%,0); } 90.625% { transform:translate3d(-83.3333%,-66.6667%,0); } 93.75% { transform:translate3d(0%,-83.3333%,0); } 96.875% { transform:translate3d(-16.6667%,-83.3333%,0); } 100% { transform:translate3d(-16.6667%,-83.3333%,0); } }
@keyframes vxbStep48x6 { 0% { transform:translate3d(0%,0%,0); } 2.083% { transform:translate3d(-16.6667%,0%,0); } 4.167% { transform:translate3d(-33.3333%,0%,0); } 6.25% { transform:translate3d(-50%,0%,0); } 8.333% { transform:translate3d(-66.6667%,0%,0); } 10.417% { transform:translate3d(-83.3333%,0%,0); } 12.5% { transform:translate3d(0%,-12.5%,0); } 14.583% { transform:translate3d(-16.6667%,-12.5%,0); } 16.667% { transform:translate3d(-33.3333%,-12.5%,0); } 18.75% { transform:translate3d(-50%,-12.5%,0); } 20.833% { transform:translate3d(-66.6667%,-12.5%,0); } 22.917% { transform:translate3d(-83.3333%,-12.5%,0); } 25% { transform:translate3d(0%,-25%,0); } 27.083% { transform:translate3d(-16.6667%,-25%,0); } 29.167% { transform:translate3d(-33.3333%,-25%,0); } 31.25% { transform:translate3d(-50%,-25%,0); } 33.333% { transform:translate3d(-66.6667%,-25%,0); } 35.417% { transform:translate3d(-83.3333%,-25%,0); } 37.5% { transform:translate3d(0%,-37.5%,0); } 39.583% { transform:translate3d(-16.6667%,-37.5%,0); } 41.667% { transform:translate3d(-33.3333%,-37.5%,0); } 43.75% { transform:translate3d(-50%,-37.5%,0); } 45.833% { transform:translate3d(-66.6667%,-37.5%,0); } 47.917% { transform:translate3d(-83.3333%,-37.5%,0); } 50% { transform:translate3d(0%,-50%,0); } 52.083% { transform:translate3d(-16.6667%,-50%,0); } 54.167% { transform:translate3d(-33.3333%,-50%,0); } 56.25% { transform:translate3d(-50%,-50%,0); } 58.333% { transform:translate3d(-66.6667%,-50%,0); } 60.417% { transform:translate3d(-83.3333%,-50%,0); } 62.5% { transform:translate3d(0%,-62.5%,0); } 64.583% { transform:translate3d(-16.6667%,-62.5%,0); } 66.667% { transform:translate3d(-33.3333%,-62.5%,0); } 68.75% { transform:translate3d(-50%,-62.5%,0); } 70.833% { transform:translate3d(-66.6667%,-62.5%,0); } 72.917% { transform:translate3d(-83.3333%,-62.5%,0); } 75% { transform:translate3d(0%,-75%,0); } 77.083% { transform:translate3d(-16.6667%,-75%,0); } 79.167% { transform:translate3d(-33.3333%,-75%,0); } 81.25% { transform:translate3d(-50%,-75%,0); } 83.333% { transform:translate3d(-66.6667%,-75%,0); } 85.417% { transform:translate3d(-83.3333%,-75%,0); } 87.5% { transform:translate3d(0%,-87.5%,0); } 89.583% { transform:translate3d(-16.6667%,-87.5%,0); } 91.667% { transform:translate3d(-33.3333%,-87.5%,0); } 93.75% { transform:translate3d(-50%,-87.5%,0); } 95.833% { transform:translate3d(-66.6667%,-87.5%,0); } 97.917% { transform:translate3d(-83.3333%,-87.5%,0); } 100% { transform:translate3d(-83.3333%,-87.5%,0); } }
@keyframes vxbStep7x6 { 0% { transform:translate3d(0%,0%,0); } 14.286% { transform:translate3d(-16.6667%,0%,0); } 28.571% { transform:translate3d(-33.3333%,0%,0); } 42.857% { transform:translate3d(-50%,0%,0); } 57.143% { transform:translate3d(-66.6667%,0%,0); } 71.429% { transform:translate3d(-83.3333%,0%,0); } 85.714% { transform:translate3d(0%,-50%,0); } 100% { transform:translate3d(0%,-50%,0); } }
