Captures every decision made during the studio.html sandbox iteration
so the same visual language can be applied to the rest of the app
(and to new components later) without re-deriving it.
Sections:
- Vision + reference instruments
- Lighting model (single rule: light from above)
- Color tokens with semantic naming
- The 3-layer "metal" language as shared CSS custom properties
- Surface hierarchy (3 depth layers with progressively brighter bases)
- Component anatomies: rack, bars, screen, sub-panels, knobs, faders,
step LEDs, buttons, screws, engraved labels, numeric displays
- Typography, spacing scale, interaction conventions
- "What is intentionally NOT here" — rejected ideas to keep the
language disciplined
- A "how to add a new component" checklist
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
8f61a8324c