I write process notes here as I build. First person, present tense, no past-tense polish. When something is rough I leave it rough so you see the seam.
Reading the Figma library
Ghost pulls variables and component definitions through the Figma REST API. That is the canonical side of the diff.
Reading the live DOM
A headless browser walks the production page and captures computed styles per element. That is the reality side.
Emitting the deviation set
The two sides join at the token level. Every property where the live value parted from the spec becomes one entry in the deviation set.
Closing Step 1
Step 1 closed today, June 10. What shipped: seven routes plus a status API, the meridian-001 scan report, 49 unit tests and 19 E2E tests, CI that holds Lighthouse at 0.95 on every route, and an eight-gate pre-deploy script that runs in 33 seconds. The deploy itself was not clean. Every route returned 404 at first, two causes stacked: deployment protection was on by default, and Vercel had autodetected the framework preset as Other, so a passing build had nothing serving its routes. Then deploys sat blocked over a git author email, my old university address, that did not match the account. The dashboard offered a paid upgrade · the actual fix was one line of free git config.
The demo runs on curated data today. The scan you see is the real diff format over a fixed snapshot, not a live crawl. Static-first was a choice: it let me prove the report, the reading experience, and the deviation model before paying the complexity tax of OAuth, rate limits, and headless browser fleets. I would rather show an honest fixture than a fragile live wire.
Step 2 makes the wire live: scanning real Figma libraries through the REST API, with bring-your-own OAuth · tokens scoped read-only, encrypted at rest, revocable from Figma at any time. The static demo stays up as the reference case, the output the live scanner has to match.