Jelly Spider

Build **"Jelly Spider"**: a real-time, interactive 3D **giant jelly spider** made of translucent gummy candy that people **poke**, **pick up**, **dangle on its thread**, **lure**, **flip over** and **watch dance**. It is a round, chubby, plush-toy-shaped spider with huge shiny eyes and a tiny smile; it walks on eight short, stubby jelly legs with feet that really plant on the table, its whole round body jiggles as it goes, it flinches when you poke it, and on command it raises a **colourful peacock-spider fan** and dances, with **synthesised sound**, as ONE self-contained HTML file rendered with **WebGPU (WGSL)** and an automatic **WebGL2** fallback.

It should feel like the best Halloween gummy ever made came alive on the table: big, glossy, glowing with colour, a little clumsy, and so cute that nobody screams. **Cute, never creepy:** think of a plush toy spider redone in gummy candy: one round dome of a body, two enormous eyes, a little smile, short chubby legs. Never a realistic spider: no thin long legs arching up, no separate bulb abdomen on a narrow waist, no hair, no fangs, nothing spiky. Someone afraid of spiders should still want to hug it.

**It must read as real gummy jelly, never plastic.** Someone seeing one still frame must say "gummy" or "jelly" before anything else. A spider that looks like a plastic toy, a glass figurine or a rubber Halloween decoration is a failed build, however well it walks. See "Real jelly, not plastic" below.

## Priorities

Build it in this order, and finish each tier properly before starting the next. A polished tier 1 beats a broken everything.

1. **Must be excellent:** the cute plush-toy shape (round dome body, huge eyes, stubby legs) and a material that reads unmistakably as jelly; a soft body that jiggles with weight and lag; a walk where planted feet never slide and legs never pass through the body or the table; Poke and Thread; the Peacock colours and the fan; **Babies**; the demo mode.
2. **Must work:** Grab (lift, dangle, drop, fling), Lure, Flip and self-righting, Dance, idle life (it watches the pointer, taps its legs, grooms), every colour preset and size, every setting, sound, both renderers, the control card, the growing belly and the big brood.
3. **Polish:** coloured light through the jelly on the table, sugar-coated Sour preset sparkle, thin-film iridescence on the fan, eight rainbow legs in Mix mode, a candy-glass web in the back corner that it can spin and that wobbles when touched.

Never ship a feature half-working: if something from tier 3 can't be done well, leave it out cleanly.

## Deliverable

- One self-contained `.html` file with all JavaScript, WGSL, GLSL and CSS inline. Start it with `<!doctype html>`, `<meta charset="utf-8">` and a viewport meta.
- **No external requests of any kind**: no libraries, CDNs, web fonts, images, textures or audio files. Generate everything procedurally in code (sound included). Use system font stacks.
- It must run inside a sandboxed iframe (`sandbox="allow-scripts allow-pointer-lock"`). Do not use `localStorage`, cookies, `alert`, pop-ups or top-level navigation, and wrap any storage access in `try/catch`. Counters live in memory for the session.
- This must be a live simulation, not a video, a pre-baked animation, a static render or a 2D fake. The walk is procedural (IK), never keyframed loops.
- **Test hook:** if the URL has `?test=1`, expose `window.__toy` (no visible change) with: `setTool(name)`, `poke(x, y, strength)`, `drag(x0, y0, x1, y1, ms)` (a drag through the same code path as a real pointer drag with the current tool, in canvas pixels), `walkTo(x, z)` (table coordinates), `lure(x, y)` (drop a sugar fly at that canvas point), `hang()`, `dance()`, `flip()`, `baby()` (same as pressing Babies once), `reset()`, `set(name, value)` for every slider, switch and colour option, and `state()` returning `{ backend, tool, mode, position, heading, feetPlanted, maxFootSlip, legClipping, volume, kinetic, flies, belly, babies, busy, fps }` where `mode` is one of `idle walking held hanging airborne flipped righting dancing eating`, `maxFootSlip` is the largest distance (mm at Big size) a planted foot moved since it planted, `legClipping` is true if any leg segment is inside the body or the table, `volume` is soft-body volume as % of rest, `belly` is 0 to 13 (flies eaten towards the next brood), `babies` is how many baby spiders are out, and `busy` is true while anything is still moving.

## The spider

- **Big:** at the default size (**Big**) the dome alone is about **45% of a square frame** wide and the legs reach out to about **70%**, seen from a low three-quarter view from the front, so the big eyes look at the camera and you still see its back and all eight legs. **Huge** and **Giant** make it bigger still (Giant: the leg tips nearly reach the frame edges and the camera eases back a little to keep it all in view). Bigger spiders move and wobble slower and heavier.
- **Shape (the most important visual rule):** like a plush toy spider, not a real one. **One big round dome** of jelly, a little wider than tall and slightly longer at the back, sitting low and heavy on the table like a gumdrop or a mochi bun. No separate head and abdomen, no waist: the face is simply the front of the dome. The back half of the dome is the heavy part that wobbles and lags. On the top of the back sits a **fan flap**: a thin oval layer of jelly that lies flat against the dome at rest (it reads as a pattern, not as a fin) and unfolds upright like a peacock spider's fan when it dances. The fan is **part of the body**: its lower edge stays hinged to the back of the dome at all times, it rises from there like a little cape or a seashell opening (tilted back about 60 to 80 degrees, never past upright), and the jelly between fan and back stretches a little as it opens. It never floats free above the body, never hovers like a halo, a disc or a satellite dish; from the default front view it shows as a colourful half-circle peeking up behind the dome.
- **Face:** a slightly flatter, **lighter-coloured face patch** on the front of the dome, like a plush toy's face fabric. On it, **two enormous round eyes**, each about a quarter of the body's width, side by side and slightly tilted apart: glossy near-black candy domes with **one big soft white oval highlight** high up and a small second highlight, so they look wet and alive. Beside them, **two small round eyes** (about a quarter the size, one on each side, a little lower). Below the eyes a **tiny curved smile**. The eyes **blink** now and then (the face patch closes over them softly), and they always follow the pointer. No pedipalps sticking out, no mandibles, no fangs.
- **Legs:** eight **short, thick, chubby jelly legs**, four on each side, coming out low from the sides of the dome and going **outwards and down** to the table in a gentle curve, like a plush toy's legs, not arching up above the body. Each is a fat rounded sausage of jelly with two soft bends (a hip and a knee), slightly flattened, wide where it meets the body and only a little narrower at the round, blunt foot. The front pair is a little shorter and points forward; the back pairs splay out sideways and back. Leg length is about 0.6 to 0.7 of the body's width. Legs are soft too: they squish a little on every step and flop loosely when the spider is lifted.
- **Scene:** a pale marble tabletop in a soft studio with a seamless backdrop in a very light tint of the active colour preset; in Glow mode a dark room under black light. The spider roams a large round area of the table (about three leg spans across) and turns back softly before the edge, never walking off.

## Colours

Colour is a property of the **jelly volume**, sampled from each point's rest position on the spider, so patterns stay put inside the jelly however it squashes and stretches. Each preset sets body, face patch, fan, legs and eyes together. The eyes stay glossy dark candy in every preset (deep plum in Halloween, deep indigo in Galaxy), always with the white highlight. **Peacock** is the default.

- **Peacock** (default, inspired by the peacock spider): a teal dome with a lighter mint face patch, aqua legs fading to lime at the feet, and a **fan in bold bands**: electric blue and turquoise centre, a ring of tangerine, cherry-red stripes at the edge, with a **thin-film iridescent sheen** that shifts blue, green and violet with the viewing angle (tier 3 for the sheen, the bands are tier 1).
- **Gummy:** classic two-tone gummy candy: every part fades from one flavour to another along its length (raspberry to lemon, lime to pineapple), like a gummy worm.
- **Mix:** each of the eight legs is a different flavour (strawberry, orange, lemon, lime, blue raspberry, grape, peach, cola), the body a swirl of all of them, the fan a rainbow.
- **Halloween:** pumpkin-orange body marbled with grape purple, black-cherry legs (deep but still translucent, glowing red at the thin tips), lime-green eyes, a fan with an orange-and-purple jack-o'-lantern grin pattern.
- **Galaxy:** deep indigo jelly with nebula swirls of magenta and cyan inside and tiny suspended glitter stars at different depths that twinkle as it moves.
- **Sour:** rainbow-striped sour candy with a **sugar coating**: a frosted, sparkly crystal surface (tiny glints that catch the light), while the colour inside still glows through.
- **Clear:** water-clear jelly with a faint blue-green tint at its thickest, and a small red candy heart visible inside the body, beating slowly.
- **Glow mode** (switch, combines with any preset): black-light room, the jelly fluoresces in neon versions of the preset's colours with soft bloom, the table and backdrop dim.

**Readability is a hard rule:** in every preset the eyes, the eight legs and the fan bands read at a glance, and the spider never turns into a muddy blob of mixed colour.

## Real jelly, not plastic

Get this right before any feature beyond walking, Poke and Thread.

**How it looks**
- **Light passes through it.** Translucent all the way through: you see the table and backdrop through it, bent by refraction (index of refraction about 1.35, like water, not glass). Thin parts (the feet, the fan, the edge of the face patch) are pale and bright; the thick middle of the dome is deep and saturated. Colour comes from **absorption through the volume** (Beer-Lambert), never from a flat surface colour.
- **It glows from inside.** The side away from the key light glows softly in the jelly's colour and a coloured caustic lands on the table in its shadow. Shadows are soft and coloured, never solid grey. Eight leg shadows dance under it as it walks.
- **The surface is wet, not lacquered.** Small, sharp, bright highlights with a strong Fresnel sheen at grazing angles, but **no broad plastic clearcoat**, no uniform specular over the body, no white rim along every edge. The Sour coating is the one frosted exception and the colour still glows through it.
- **It is not perfect.** A faint wobble in the surface normals, tiny suspended air bubbles at different depths, a little internal grain, soft rounded forms everywhere. A moulded gummy, not a CAD model.
- **It has weight.** At rest the dome sags slightly under its own weight and bulges a little at the sides; the body bobs on its legs.

**How it moves**
- **Heavy, lagging jiggle.** The dome wobbles at a low frequency (about 2 to 4 Hz at Big size, lower when bigger or softer) and its back half always lags behind the face: when the spider starts walking the back sways back, when it stops it surges forward and wobbles out. Never a fast rubbery boing.
- **It keeps its volume.** Squashed, it bulges sideways; stretched, it thins.
- **Soft everywhere.** Every footstep sends a tiny jiggle up the leg into the body; every landing makes the whole spider splat and ripple.
- **Dead, squashy bounces.** Dropped, it splats, spreads its legs, rebounds a little and wobbles. Never a high rubber-ball bounce.

**Never**
- Opaque or near-opaque jelly in any preset (Halloween's dark legs still glow at the tips).
- A broad plastic sheen or blobby Phong highlights.
- Grey or black shadows, or a body lit like a diffuse solid.
- Stiff, rigid legs that move like robot arms.

## Physics and the walk

- **Soft body:** the dome is one volumetric soft body (a lattice of about 400 to 1,500 cells) solved with **XPBD** or shape matching with volume preservation, stiffer at the front around the face so the eyes keep their shape, softer at the back. The legs are attached to the lattice so the body squishes around the hips. Render a smooth high-resolution surface skinned to the lattice, never the lattice itself, except in X-ray mode.
- **Legs:** each leg is solved with **IK** (analytic two-bone plus a tip segment, or FABRIK) from its hip on the side of the dome to its foot target, with the knee bending outward and only slightly up, so the legs stay low and chubby and never stick up above the body. On top of the IK pose add **soft secondary motion**: a short spring chain per leg so segments flex and jiggle, clamped so the leg stays readable.
- **Feet plant.** A planted foot stays fixed on the table in world space until it steps; `maxFootSlip` must stay below 2 mm. A foot steps when it is too far from its rest position under the body, lifting in a smooth arc, landing slightly ahead, with a tiny squash of the tip on contact.
- **Gait:** spiders use an **alternating tetrapod gait**: legs L1, R2, L3, R4 step together, then R1, L2, R3, L4. Never more than four feet in the air at once, never two neighbouring legs on the same side lifting together. Turning on the spot works the same way.
- **Body follows the feet:** the body height and tilt come from the planted feet, so it rocks gently with each step. The spider walks forward, turns smoothly, can walk sideways a little (for the dance), and never moonwalks.
- **No clipping:** legs never pass through the body, each other or the table (`legClipping` stays false), the body never sinks into the table.
- **Fixed simulation timestep** (about 1/120 s) with bounded substeps, decoupled from frame rate. On a slow frame, drop simulation time rather than exploding. No jitter at rest, no slow creep, no explosions, ever.

## Behaviour

- **Idle life:** it breathes (the dome swells and shrinks slightly), it **blinks**, its eyes and the whole front of the body turn to **follow the pointer**, it taps a front leg, now and then it rubs its face with a front leg or shuffles a few steps to a new spot. It never stands perfectly frozen.
- **Wander:** with the Wander switch on, it strolls around the table on its own between idle moments.
- **Mood:** poked a lot it gets a little grumpy (squints, takes a step back); fed a fly it is happy (bounces, its eyes curve into happy arcs, the smile widens).

## Tools

A tool picker with **Poke**, **Grab**, **Thread** and **Lure**. The default tool is Poke. A press that ends within 6 px and 450 ms counts as a tap. Right-drag or two fingers orbit the camera with any tool. Use pointer events with **pointer capture** so drags never drop, and support mouse, pen and touch.

### 1 Poke
- A tap on the body presses a deep rounded dent that rebounds with a wobble rippling over the whole spider; it **flinches**: legs pull in, the body ducks, its eyes squeeze shut for a moment, then it shakes itself out. A tap on a leg makes that leg jerk up and shake. A tap on the fan makes it flick open for a second. Holding presses deeper and the jelly bulges around the finger.
- A tap on the table near it makes it turn to look; tapping the table repeatedly makes it scuttle over to that spot.

### 2 Grab
- Press on the spider and drag: it lifts off the table by the point you grabbed. The jelly stretches at the grab point, the back of the dome sags and swings below, and **all eight legs dangle and paddle** in the air. Release to drop it: it splats, spreads its legs, wobbles and gets back up. Release during a fast drag to toss it a little way (it lands, splats and walks back). Grabbed by a leg, that leg stretches like taffy and the spider swings from it.

### 3 Thread
- Press on the spider and drag **up**: it hangs from a thin glistening **silk thread** coming out of the back of its body, anchored above the frame. The thread stretches like a bungee; the spider spins slowly, swings like a pendulum and its legs hang and twitch. Pull it down and let go and it **boings** up and down on the thread, wobbling at every turn. Drag it sideways to swing it. Release near the table and it climbs down the thread and lets go. `H` drops it from above on its thread from anywhere.

### 4 Lure
- Tap the table to drop a little **sugar fly** (a candy fly with buzzing wings) that hops around. The spider notices it, turns, **stalks** closer with small careful steps, lifts its front legs and **pounces**, then gobbles it up with its little smile; a small sparkle of the fly's colour glows briefly inside its body. Up to 3 flies at once; it goes for the closest. Dragging moves a fly around like a toy on a string and the spider follows it.

### Buttons
- **Dance:** the peacock courtship dance. It raises the **fan** upright behind it, lifts its third pair of legs high and waves them, and **side-steps left and right to a synthesised beat**, with little hops and fan flicks on the off-beats, for about 6 seconds, then folds the fan down and wobbles happily. Feet still plant on every step.
- **Babies** (big button next to Dance, key `B`): each press makes **one baby spider**. The spider squeezes its eyes shut and wiggles, a little jelly bubble swells up on its back (it bulges out of the dome over about half a second, glowing), and with a soft *pop* it pinches off as a **baby**: a tiny copy of the spider (a round dome about a fifth of its size, the same huge eyes and smile, eight stubby legs) in a random candy colour from the Mix flavours, so a brood is a little rainbow. The baby drops onto the table, wobbles, blinks at the camera and starts walking. Up to **8 babies**; at 8 the button shows "Full" and the spider shakes its head when pressed.
  - **They follow it** in a wobbly line, each a little behind the one in front, using their own tiny tetrapod gait (the same planted-feet rules, simplified), and catch up with a scurry if left behind.
  - **They ride on its back:** when the spider stops for a couple of seconds, the babies climb up its legs and settle on top of the dome in a pile, jiggling with it; they hop down when it walks again. Real wolf spiders carry their babies like this.
  - **They copy it:** when it dances they dance too, a beat late; when it is poked they all flinch; when it is flipped they tumble off and run around in a panic, then gather again; on its thread they hang below it in a little chain.
  - **Each baby is pokeable:** a tap makes it squeak, flinch and hop; Grab picks it up and drops it; flies lure them too (they nibble, but the big one usually wins).
  - **Reset** calls them home: they run back and melt into the spider's back one by one.
- **Flip:** tosses it onto its back: legs kick and paddle in the air, the round dome rocks on the table like an upturned bowl, and after a couple of seconds of struggling it rolls over and rights itself with a squishy flop. Landing on its back after Grab or a toss does the same.
- **Reset:** it walks (or jumps if it is hanging or flipped) back to the centre of the table, faces the camera and settles, with a little bounce.
- **Spin web** (tier 3): it climbs to the back corner and spins a candy-glass orb web there over a few seconds; the strands glint, sag slightly and wobble when poked, and the spider can hang out in it. A second press takes it down.

## Settings

- **Size:** Big / Huge / Giant segmented control. Switching makes it puff up or shrink with a jelly wobble, keeping its pose.
- **Softness:** from firm gummy bear to barely-set jelly. Softer means bigger, slower jiggle, a saggier dome and floppier legs; it must stay stable at both extremes.
- **Wobble:** how long it keeps jiggling, from a quick settle to a long, lazy wobble.
- **Walk speed:** from a slow careful creep to a fast scuttle.
- **Colour:** the presets as round swatches, and a **Glow mode** switch.
- Switches: **Wander** (on), **Slow motion** (1/4 speed), **X-ray** (lattices, IK chains, planted feet as dots and the gait pattern), **Cinema**.

## Growing belly and the big brood

- **Every fly it eats makes it visibly rounder** (about 2% bigger per fly, the dome stretching and the eyes spreading a little apart), and from the 5th fly on you can see **tiny dark baby shapes moving inside it**, swimming slowly through the translucent jelly like seeds in a gummy, more with every fly. A small belly meter in the readouts fills up (`belly 7/13`).
- At **13 flies** (Halloween's number) it is very round and wobbly: it gives a happy shudder, its body glows from inside, and with a big soft *pop* it bursts out **a whole brood** at once (babies as from the Babies button, in every Mix colour, topping up to 8), then shrinks back to its normal size with a satisfied wobble. A small badge appears: "Thirteen flies. You're a parent now." The belly meter resets.
- The meter is visible, but never say in the UI what happens at 13.

## Sound

Every action has a **synthesised sound**, generated live with the **Web Audio API** (oscillators, filtered noise, envelopes). **No audio files, no samples.**

- **Footsteps:** a soft, tiny squelchy tap per foot plant, slightly varied in pitch, so a walk becomes a quiet wet patter; bigger sizes are deeper.
- **Poke:** a squish and a little surprised squeak. **Grab:** a wet stretch creak as it lifts, a splat and smaller bloops when dropped.
- **Thread:** a rising zip as the thread pays out, a springy "boing" with pitch wobble at each bungee turn.
- **Lure:** a soft buzz for each fly, a quick scuttle on the pounce, a little gulp and a happy chirp.
- **Flip:** a flop, a frantic leg patter while it struggles, a squishy roll back.
- **Dance:** a playful synthesised beat (bouncy bass, a soft clap, a little marimba hook) with the spider's steps landing on the beat.
- **Babies:** a rising bubble stretch, a soft pop and a tiny squeak per baby; babies have their own tiny high-pitched footsteps (quieter, capped so a brood never gets noisy) and squeak when poked. **Belly:** a deeper, wobblier gulp per fly as it grows; the big brood is a gloopy pop and a tiny chorus of squeaks.

Rules: create the `AudioContext` only on the first user gesture and never before; resume a `suspended` context on interaction; master gain into a compressor, no clipping; cap at about 16 voices so eight footsteps never turn into noise; wrap every audio call in `try/catch` so a failure can never break the toy. Sound is on by default; a **speaker button** and `M` mute it.

## Camera and keys

- **Camera:** right-drag or two fingers orbit within limits (never below the table), the wheel or a pinch zooms within limits (from the default view to close enough to see the bubbles inside the body), double-click the background or `0` resets the view. With **Follow cam** (on by default while Wander is on) the camera gently keeps the spider in frame as it walks.
- **Keyboard:** `1` Poke, `2` Grab, `3` Thread, `4` Lure, `D` Dance, `B` Babies, `F` Flip, `H` hang it from its thread, `W` Wander, `G` Glow mode, `P` next colour preset, `X` X-ray, `C` Cinema, `M` mute, Space pauses or resumes, `R` resets. Arrow keys walk it around by hand (it turns and walks with the real gait).

## Rendering (WebGPU with a WebGL2 fallback)

**WebGPU (WGSL) when available, with an automatic WebGL2 fallback that looks the same.** Detect at start; if WebGPU is missing or adapter or device creation fails, use WebGL2. No libraries: write both paths yourself, sharing the scene data and the simulation. Show which one runs in the status pill.

Aim for a close-up macro photo of a gummy candy that came alive. Everything in "Real jelly, not plastic" is a rendering requirement; this is how to get there.

- **Jelly:** render with **real thickness**: back faces into a depth or thickness buffer first, then front faces, with absorption from the distance light travels through the jelly (Beer-Lambert). **Screen-space refraction** of the table and backdrop (IOR about 1.35), a soft wrap-around subsurface term for the back-lit glow, wet specular with Schlick Fresnel and a tight highlight, faint internal grain and tiny suspended bubbles. Opaque shading with an alpha value is not acceptable.
- **Fan:** banded colour from the volume function, and (tier 3) a thin-film interference term for the iridescent sheen.
- **Eyes:** glossy dark candy domes with the big white highlight painted in (always present, whatever the lighting) plus a real sharp specular glint, so they always read as big cute eyes, never as holes.
- **Caustics and shadows:** soft coloured shadows for body and legs and a coloured patch of light through the body on the table (a cheap projected approximation is fine).
- **Light:** a large soft key light from upper left, a rim light that makes the leg outlines glow, filmic tone mapping that never blows out the highlights, bloom on the glints (stronger in Glow mode).
- Preallocate all buffers and build every pipeline at start for the Giant size, the roundest belly and 8 babies; never create shaders, pipelines or geometry during interaction. DPR capped at 2. An automatic **quality scaler** lowers resolution, refraction and bloom before it ever touches the jelly feel or the walk. It must stay smooth on a mid-range phone.
- Only if neither WebGPU nor WebGL2 exists, show a clear, well-designed message explaining why.

## Interface

A light interface that stays out of the way; the spider is the hero and UI never covers it.

**Top left:** small caps `POKEABLE · SPECIMEN 016`, a large italic serif heading on two lines: *Jelly* / *Spider.*, and caption lines "Poke it." / "It wobbles." / "It dances."

**Top right:** a live status dot with `WEBGPU · LIVE` or `WEBGL2 · LIVE`, a **speaker icon button** (`ON` / `MUTED`), and `PAUSED` when paused.

**Right panel: control card "Spider"**, a floating card about 240px wide with 20px corners, soft off-white (dark charcoal in Glow mode), a soft shadow, no hairlines, plain system sans, bold sentence-case title and section labels, and an accent colour taken from the active preset's fan. Tools as rounded tiles with small drawn icons and key numbers (the active one tinted and ringed in the accent), chunky sliders (6px rounded track filled with the accent, round white thumb) with live values in small monospace chips, colour presets as round swatches showing each preset's fan, secondary buttons as light-grey chips, on/off switches with the label on the left, and **Pause / Resume** as a solid dark full-width pill. Collapsible to a small button; a bottom sheet with rounded top corners on narrow screens.

- Tools: **Poke**, **Grab**, **Thread**, **Lure**.
- Buttons: **Dance** and **Babies** (big, side by side, in the accent colour; Babies shows the count, e.g. "Babies 3/8"), **Flip**, **Spin web**, **Reset**.
- **Size:** Big / Huge / Giant segmented control.
- Sliders: **Softness**, **Wobble**, **Walk speed**, **Sound**.
- **Colour:** the seven presets as swatches, a **Glow mode** switch.
- Switches: **Wander**, **Follow cam**, **Slow motion**, **X-ray**, **Cinema**.
- **Pause / Resume.**

**Bottom left:** a one-line hint per tool:
- Poke: "Tap to poke. It flinches. Tap the table to call it."
- Grab: "Pick it up. Let go to drop it."
- Thread: "Drag it up to hang it on its thread. Pull and let go to bounce."
- Lure: "Tap the table to drop a sugar fly."

Under it, live readouts: **mode** (walking, hanging, dancing...), **steps** taken, **flies** eaten, **belly** (x/13 as a small filling bar), **babies** (x/8), **wobble** (kinetic energy as a small meter). Values update smoothly, not every frame.

**Bottom right:** a collapsible **"How it walks"** panel, 4 to 6 plain-English lines: the soft jelly lattice inside the body, how IK bends each leg, how feet stay planted and when they step, the alternating four-and-four gait, how the colour lives inside the jelly, how the sound is made.

**Toasts** top centre for firsts: "First poke!", "Hanging around", "First fly!", "Dance floor open", "Back on its feet", "It's a baby!", "Full house" (8 babies). **Cinema** (`C`) hides all UI and the cursor; a tap without drag, `C` or Esc brings it back. Respect `prefers-reduced-motion` (soften UI transitions and camera moves); the spider still responds fully.

## Demo mode (required)

If the URL has `?demo=1`, auto-play a 4-second loop with no user input: the object drops in, wobbles, gets poked or sliced once, then settles.

For this toy that means:
- **Hide all UI** and the cursor. One fixed quality preset (no quality scaler), Big size, default softness, the **Peacock** preset, Glow mode off, Wander off, the fixed default camera.
- **Never create an `AudioContext`**, play nothing.
- Deterministic, no randomness; restart every 4.0 s of real time from the identical state; drive the simulation from real elapsed time with the fixed timestep so the loop lasts 4 s at any frame rate.
- Timeline:
  - **0.0 to 0.8 s:** the spider drops into frame from above on its silk thread, boings once on the thread, and lands on the table with a splat; legs splay, the dome squashes and wobbles.
  - **0.9 to 1.9 s:** it scuttles a short way towards the camera with the alternating gait (feet clearly planting), the back of the dome swaying behind.
  - **2.0 s:** a poke dents the top of the dome: it flinches, legs pull in, eyes squeeze shut, the whole body ripples.
  - **2.5 to 3.4 s:** it shakes itself out and **flashes its fan**: the iridescent bands pop up, it does two quick side-steps and a fan flick, the most colourful moment.
  - **3.4 to 4.0 s:** the fan folds down and the spider walks back up its thread out of frame (or settles into the exact pose of 0.0 s), so the loop joins invisibly.
- Start moving within 1 s. It is recorded in a slow software renderer: **the landing splat, the planted steps, the flinch and the fan must read clearly at 15 fps**.
- Support `?demo=1&t=<seconds>` to freeze the demo at that time (for screenshots).

## Before you finish

Self-check against this list and fix anything that fails:
- **The jelly test:** still frames at rest, mid-walk, mid-flinch, with the fan up and with babies on its back, in every preset and in Glow mode. Each must read instantly as translucent gummy jelly with the table bent through it, deep colour in the middle of the dome and bright edges and feet, a coloured glow and coloured shadows, small wet highlights, no plastic sheen. If any frame could pass for plastic, glass or rubber, fix the material first.
- **The cute test:** from the default view it reads as a plush toy spider made of gummy: one round dome, two huge glossy eyes with white highlights, a tiny smile, eight short chubby legs that stay low. If it looks like a real spider (long thin legs arching up, a separate abdomen, anything spiky), fix the shape before anything else.
- **The walk test:** walk it in circles, figure eights and sharp turns with the arrow keys at both walk speeds and all sizes, and with Wander for 2 minutes: `maxFootSlip` under 2 mm, `legClipping` never true, the gait always alternates L1 R2 L3 R4 / R1 L2 R3 L4, the back of the dome always lags and wobbles.
- Poke every part 50 times fast, grab it by the body and by each leg, hang it and bounce it hard, toss it, flip it 10 times, dance during a walk, Lure 3 flies at once, switch size and preset mid-dance: never an exploded or inverted body, a stuck leg, a spider through the table, jitter at rest or a crash.
- Every setting at both extremes, every tool, button, switch and key, pause and resume, Slow motion, X-ray, Cinema, resizing to phone width with touch.
- Babies: press it 8 times, walk around, stop so they climb on its back, dance, poke, flip, hang it, reset: every baby follows, rides, copies and comes home; never a baby stuck in the body or the table, falling through the floor or left behind for good. Feed 13 flies by hand: it grows step by step, babies show inside, then the brood pops out.
- Sound: every action has its effect, nothing before the first gesture, mute and volume work, a fast scuttle never clips, a failing audio call never breaks the toy.
- `?demo=1` matches the timeline, loops cleanly, shows no UI and plays no sound; `?demo=1&t=2.9` freezes with the fan up.
- No console errors or WebGPU validation errors on WebGPU AND on the WebGL2 path, and it stays smooth on a mid-range phone.

Put the jelly look and the walk first. It should be the spider people keep poking just to watch it flinch, and keep feeding just to see it dance.