svg-mascot-animatorlisted

# SVG Mascot Animator Static SVG in, animation out, with the timing coming from equations and solvers rather than from nudged keyframes. Anime.js v4 is the default engine. Where JavaScript cannot run, the same Anime.js solvers are sampled ahead of time and baked into CSS keyframes, so both versions of an asset share one motion identity. What separates convincing motion from generic motion is not more keyframes. It is that the timing comes from somewhere real: a parabola carried by a motion path, a pendulum whose period follows from its length, a spring whose settling duration is computed by a solver rather than picked by feel. ## Setup Install the engine first, before writing any animation code: ```bash bash scripts/setup.sh # npm install animejs, verifies the version and exports ``` In a browser without a build step, import pinned so a future release cannot change the motion under the user: ```js import { animate, createTimeline, spring, svg, utils } from 'https://esm.sh/animejs@4.5.0'; ``` The API moved substantially at v4 and keeps growing, so confirm the installed surface rather than trusting a remembered snippet. `setup.sh` prints it, and `node scripts/bake.mjs list` prints the easing names. ## Pick the track first **Runtime track — Anime.js drives the page.** Docs sites, landing pages, product UI, artifacts, demos, anything reacting to scroll, hover, pointer, or state. Timelines, springs, motion paths, drawables, morphs, stagger, draggables. Start fro