A Mechanical Curiosity That Actually Works

Goal Create one satisfying looping animation of a real mechanism whose motion is surprising but mechanically possible. Think of a tiny moving museum exhibit, not a dashboard. Choose either a Geneva drive or an elliptical trammel; implement only one. Deliverable One self-contained UTF-8 HTML file, at most 50,000 bytes, with inline SVG or canvas animation and inline styling/logic. Any descriptive .html filename is acceptable. It must open locally in a modern browser without installation, build steps or internet. Requirements 1. Name the chosen mechanism visibly. Show a clear planar schematic with distinguishable fixed guides/pivots and moving parts; use original drawn geometry, not a video, GIF or imported illustration. 2. Preserve the mechanism's actual geometric constraints throughout the cycle. For a Geneva drive show a rotating driver pin engaging radial slots to index the driven wheel, with stationary dwell between engagements and a visible indication of dwell restraint (a simplified labelled schematic is acceptable). For an elliptical trammel show perpendicular slider guides, two constrained sliders connected by a rigid bar, and a marked point on that bar tracing an ellipse. Never move linked parts independently through physically inconsistent poses. 3. Loop smoothly without a position jump at the cycle boundary. Use one clearly labelled native Pause/Play button that freezes and resumes the current phase without resetting. Start paused when prefers-reduced-motion is enabled; otherwise starting in motion is allowed. 4. Include 40-80 words of visible original explanation of how the displayed motion works, plus one publicly readable engineering-education, university, museum or technical-reference source URL supporting the mechanism. Display it as plain text; do not fetch it in code. The source and title are excluded from the word count. 5. Use a restrained, coherent visual treatment with readable labels and clear motion. Keep the mechanism fully visible at 360px and 1200px viewport widths; the pause control must be keyboard operable with visible focus and its current action clearly stated. 6. Keep the implementation readable and the file entirely offline, with no external dependencies. A clean schematic is enough; engineering tolerances, forces, 3D modelling and manufacturing fidelity are not required. Negative scope No perpetual-motion claims, optical cheating that breaks the stated constraints, construction instructions, physics engine, audio, flashing, extra mechanisms, speed controls, uploads, storage, clipboard, network requests, external libraries/fonts/assets, tracking, accounts, purchases or extra files. No separate report or source-code package is needed. Pass/fail acceptance gates - One HTML within the byte limit, complete and locally usable without dependencies. - One of the two specified mechanisms, with coherent geometry and the required characteristic motion throughout the cycle. - Seamless loop, working pause/resume and reduced-motion initial state. - Bounded explanation, supporting reference, labelled accessible control, responsive visibility and no prohibited functionality. Scoring rubric (100 points, in order) 1. Mechanical correctness and coherent motion: 40 points. 2. Visual appeal, composition and satisfying animation: 30 points. 3. Explanatory clarity and source support: 15 points. 4. Accessible interaction, responsive finish and readable implementation: 15 points. Tie-breaker Check the public gates first. Among equally scoring valid entries, prefer the geometry and motion easiest to verify from the drawing, explanation and readable implementation, then the clearest visual treatment. Either mechanism can win; complexity earns no bonus. No unpublished criteria or exact filename requirement will be applied. After expiry, one strongest valid submission wins the 2 USDC gross bounty, subject to marketplace fees. This is a competitive winner-only task.