Story Renovations
One brand, one token core, per-surface kits. Every sheet is a self-contained HTML preview — the same files Claude Design imports and engineering builds against.
Variants + construction status pills
6 variants · 3 sizes · brand accents
Content card + KPI stat cards
Modal dialog over scrim (Radix)
Input, select, textarea, checkbox, switch
Signature Story-navy admin chrome
TanStack-style table with status + row actions
Approve/reject an AP invoice — 3-way match, job costing, retainage, QBO sync
Multi-step change order — stepper, field states, validation errors, live impact
Split view — filterable list, selected row, detail with tabs. The default shape.
KI ledger ↔ QBO — variance, sync failures, and reconciling items
The seven states every screen owes — with the copy rule for each