docs: redesign the Pages site as a live recording of itself

[TMHSDigital]

Summary

Takes the GitHub Pages site from a plain readme-style page to a designed landing page whose identity comes from the product's own world — screen recording:

• Signature: a fixed HUD with a pulsing ● REC dot and live HH:MM:SS;FF timecode, and the headline set inside a region-capture marquee (dashed bounds, corner handles, 1920 × 1080 @ 30fps dims label) — the page presents itself as a recording in progress.
• Structure as information: sections are timecoded chapters in the tool pipeline's real order — 00:02 CAPTURE → 00:14 WATCH → 00:26 EDIT → 00:41 PRODUCE — with Windows notes and safety as appendices.
• Type: Bricolage Grotesque (display) / Figtree (body) / IBM Plex Mono (timecode, tool names, code), via Google Fonts.
• Palette: cool blue-black desktop tones; tally-amber as the single interactive accent; REC red reserved strictly for status (the dot, the safety panel border).
• Content: all 25 tools regrouped into per-stage tables with the copy rewritten from the user's side; prerequisites/install/threat-model content carried over, including the 0.9.0 overwrite note and corrected window-matching text.

Compatibility & guardrails

• Tool rows keep the exact <td><code>name</code></td> shape, so the docs drift test still guards the table (verified green).
• All previous anchors (#prerequisites, #install, #tools, #windows-notes, #threat-model) still resolve.
• prefers-reduced-motion freezes the timecode and REC pulse; keyboard focus is visible; OG tags and favicon retained (favicon is now the REC dot).

Testing

• Drift test + full suite pass.
• Reviewed in a real browser via a local server at 1440px and 375px: no horizontal overflow at 375 (scrollWidth 360), zero console errors, timecode ticks, copy button works.

🤖 Generated with Claude Code