Let the queue page pin the frame animation

Waiting for the shuffle bag to land on the animation you are working on makes
testing one of them tedious. The queue page now carries an Animation row next
to Background: Auto keeps the per-track cycle, any other button pins the player
to that animation until the mode changes again.

The animation names live in config.js alongside their labels, so the server can
validate them and the queue page can label its buttons; motion.js keys its
registry by the same names.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Tg15tLAuT6NrCE1ZxKVgDB

README.md

@@ -7,7 +7,8 @@ A YouTube playlist player for parties. Two browser windows run side by side:
   [Animations](#animations)). Consecutive videos overlap in a 5 second
   audio/video crossfade, so there is never silence between tracks.
 - **Queue** (`http://localhost:3000/queue`) — add videos by URL, drag to
-  reorder, delete, and see how much playtime is left.
+  reorder, delete, see how much playtime is left, and pick the background and
+  animation.
 
 ## Run
 
@@ -32,9 +33,9 @@ autoplay, so the first click is what unlocks audio. One click per session.
   whenever a length is still unknown.
 - The queue is saved to `queue.json` on every change and restored at startup.
 - Settings live in `config.js`: overlap length, frame size, drift speed, corner
-  screenshot interval and margin, port, and the selectable backgrounds. Anything
-  the browser needs must also be mirrored in the `/config.js` route in
-  `server/index.js`.
+  screenshot interval and margin, port, and the selectable backgrounds and
+  animations. Anything the browser needs must also be mirrored in the
+  `/config.js` route in `server/index.js`.
 
 ## Animations
 
@@ -45,6 +46,11 @@ The video frame's movement changes with every track. Two animations ship today:
   screenshot of it appears in the next of the three other corners, going
   clockwise. The frame never moves, so a screenshot can never cover it.
 
+The queue page's **Animation** buttons pin the player to one of them, which is
+how you look at a single animation without waiting for the cycle to reach it.
+**Auto** (the default) hands selection back to the shuffle bag. Switching takes
+effect immediately; while pinned, track changes leave the animation running.
+
 **The corners animation asks to share your screen.** The decks are cross-origin
 YouTube iframes, so nothing on the page can read their pixels — capturing the
 tab and cropping out the frame is the only way to photograph what is playing.
@@ -64,8 +70,9 @@ An animation is `start(context) => stop()`, where `context` is
 `{ element, capture }` — `capture` may be null, and is read late, so an
 animation must cope with it being absent. `stop()` has to undo everything:
 timers, listeners, and any DOM it added, because the next animation takes over
-the same element immediately. Add it to the `ANIMATIONS` array and it joins the
-rotation.
+the same element immediately. Register it under a new name in the `ANIMATIONS`
+map in `motion.js` **and** in the one in `config.js` (which supplies the label
+for the queue page's button), and it joins the rotation.
 
 Selection uses a shuffle bag (`createPicker`): every animation comes up exactly
 once per pass, so they stay evenly used, and the same one never runs twice in a