feat: realistic skinned human figure + self-collision resolution

Replace the on-screen figure with a fully rigged, textured human
character (articulated fingers, sneakers, face) driven by the existing
solver skeleton, and stop limbs from passing through the body.

- posecode-render/character.ts: load a Mixamo-rigged GLB, calibrate its
  T-pose onto the driver rig's rest pose (arms down, palms forward,
  limbs aimed exactly along driver rest directions), then retarget
  world-space rotation deltas bone-for-bone every frame, fingers
  included. The driver skeleton is rebuilt to the character's exact
  proportions so floor contact, prop pins, and reach-IK land exactly on
  the visible mesh.
- posecode-render/depenetrate.ts: capsule-based self-collision pass
  (torso, head, thighs, shins vs forearms/hands and crossing shins),
  ROM-clamped and deterministic, run before contact solving in both the
  viewer and the eval probe.
- Viewer: createViewer({ characterUrl }), characterActive getter,
  procedural figure as automatic fallback; hidden procedural meshes keep
  feeding bounding-box grounding. Playground + landing pass the local
  GLB (?figure=classic opts out); embeds default to the hosted model
  with a character attribute (URL or "off").
- Assets: playground/public/models/character.glb - Mixamo "Michelle"
  from the three.js examples, resized textures + WebP + quantization +
  animations stripped (3.3MB -> 2.2MB).
- Movement fixes visible with the new model: deadlift arms now hang to
  the bar (was shoulder extension), crunch keeps feet planted with bent
  knees, touch-toes folds without collapsing.
- scripts/capture-gifs.mjs (npm run gifs): headless regeneration of the
  README GIFs from the live renderer; all four regenerated with the new
  figure.
- Tests: skeleton-congruence retarget tests (synthetic T-pose rig) and
  de-penetration tests; suite at 194 passing.

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

Author: claude

CHANGELOG.md

@@ -5,6 +5,21 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [Unreleased]
+
+### Added
+
+- **Realistic human figure**: the playground, landing hero, and `<posecode-player>` embeds now render a fully rigged, textured human character (hands with articulated fingers, sneakers, face) instead of the procedural capsule mannequin. All solving (FK, ground-lock, pins, reach-IK) still runs on the driver skeleton, rebuilt to the character's exact proportions and retargeted bone-for-bone every frame; the procedural figure remains as an automatic fallback (and via `?figure=classic` / `character="off"`).
+- **Self-collision resolution**: a capsule-based de-penetration pass keeps forearms/hands out of the torso, head, and legs (and shins out of each other), clamped to healthy ROM, so limbs no longer pass through the body mid-movement.
+- `viewer.characterActive`, `createViewer({ characterUrl })`, and the embed `character` attribute.
+- `scripts/capture-gifs.mjs` (`npm run gifs`): reproducible headless regeneration of the README movement GIFs from the live renderer.
+
+### Fixed
+
+- Deadlift arms now hang toward the bar during the hinge (were authored as shoulder extension, flying up behind the back).
+- Crunch keeps the feet planted with bent knees (shins previously folded through the floor and jacked the body up).
+- Touch-toes folds like a human (hinge depth and knee bend were over-authored, collapsing the figure).
+
 ## [0.1.0] - 2026-07-08
 
 ### Added

README.md

@@ -124,6 +124,8 @@ Two safety layers ship with the language:
 The protocol and both libraries are **MIT-licensed**: the open core. See [`spec/SPEC.md`](spec/SPEC.md) for the full language and [`spec/llm-authoring.md`](spec/llm-authoring.md) for the authoring prompt.
 For where Posecode spreads fastest and the per-domain go-to-market plan, see [`docs/market-research.md`](docs/market-research.md); for the engine roadmap, [`ROADMAP.md`](ROADMAP.md).
 
+The realistic 3D character ("Michelle") is an [Adobe Mixamo](https://www.mixamo.com) asset, distributed with the [three.js examples](https://github.com/mrdoob/three.js/tree/dev/examples/models/gltf) and used here under the Mixamo license (royalty-free in projects). The renderer also ships a zero-asset procedural figure, used automatically wherever the character can't load.
+
 ---
 
 ## Scope (v0.1)

docs/media/deadlift.gif

@@ -16,10 +16,13 @@
     "dev": "npm run dev -w playground",
     "build": "npm run build -w playground",
     "eval": "tsx packages/posecode-eval/src/cli.ts",
-    "typecheck": "for p in packages/*/tsconfig.json playground/tsconfig.json editors/*/tsconfig.json; do tsc --noEmit -p \"$p\" || exit 1; done"
+    "typecheck": "for p in packages/*/tsconfig.json playground/tsconfig.json editors/*/tsconfig.json; do tsc --noEmit -p \"$p\" || exit 1; done",
+    "gifs": "node scripts/capture-gifs.mjs"
   },
   "devDependencies": {
     "@vitest/coverage-v8": "^2.1.8",
+    "gifenc": "^1.0.3",
+    "playwright-core": "^1.61.1",
     "tsx": "^4.19.2",
     "typescript": "^5.7.2",
     "vitest": "^2.1.8"

docs/media/jumping-jacks.gif

@@ -64,6 +64,7 @@ definePosecodePlayer(); // idempotent
 | `controls` | `true` | Show the play/pause bar. |
 | `autorotate` | `true` | Slowly orbit the camera when idle. |
 | `speed` | `1` | Playback multiplier (`0.1`–`4`). |
+| `character` | *(hosted default)* | Realistic figure: a GLB URL (Mixamo rig), or `off` for the procedural mannequin. Load failures fall back to the mannequin. |
 | `playground` | `https://posecode.org/play` | Base URL for the "Edit ↗" link. |
 
 Boolean attributes accept `false` / `0` / `no` / `off` to turn them off, so

docs/media/lateral-raise.gif

@@ -105,6 +105,7 @@ export class PosecodePlayerElement extends HTMLElement {
       controls: this.getAttribute("controls"),
       autorotate: this.getAttribute("autorotate"),
       speed: this.getAttribute("speed"),
+      character: this.getAttribute("character"),
     });
   }
 
@@ -178,6 +179,7 @@ export class PosecodePlayerElement extends HTMLElement {
     const { createViewer } = await import("posecode-render");
     const viewer = createViewer(this.#canvas, {
       autoRotate: opts.autoRotate && !reduceMotion,
+      ...(opts.characterUrl ? { characterUrl: opts.characterUrl } : {}),
     });
     this.#viewer = viewer;
     viewer.onPhase(({ phaseName }) => {