fix(design): wire fonts via Mintlify schema, "Install" CTA, drop dead CSS

[indykish]

Summary

Follow-up to #43. Live audit of docs.usezombie.com after #43 merged showed that the custom.css and tokens.css files 404 on the cloud-built site — Mintlify's docs.json schema has no key for arbitrary custom stylesheets, and the "custom.css at project root" claim from their SKILL.md doesn't apply to this cloud build. Net effect: the typography never landed (body still rendered Inter), and ~250 lines of CSS were dead code.

This PR routes everything Mintlify can express through docs.json directly, keeps style.css scoped to the one rule Mintlify can't express, and drops the rest.

What changed

• docs.json
  • fonts.heading + fonts.body restored, pointing at the deployed woff2 files. Mintlify build-time injects @font-face from this config.
  • styling.codeblocks: "dark" → { "theme": "vesper" }. Mintlify's schema accepts the Vesper Shiki theme by name, matching the spec's "calm Vesper-style" syntax without needing custom CSS.
  • navbar.primary.label: "Mission Control" → "Install".
• style.css (renamed from custom.css; Mintlify's documented filename for cloud-build CSS pickup)
  • One rule: dark text on the pulse-cyan primary button. Mintlify auto-picks white for contrast; the design system's --on-pulse token is theme-fixed dark (#0A0D0E) per tokens.css line 49, so we force it.
  • Everything else (typography family rules, code-block chrome, focus ring, ~68ch measure, dot-grid, reduced-motion guard) deleted — those weren't loading anyway in the cloud build.
• Removed
  • custom.css (dead — never loaded by Mintlify)
  • tokens.css (dead — imported only by the dead custom.css)
  • fonts/CommitMono-Regular.woff2 (orphaned once only the Medium weight is wired through Mintlify's heading font config)

What still works from #43

• Brand-mark wake-pulse animation (embedded in the SVG <style> block — the one piece of theming that survives Mintlify's render path; verified live: mintcdn proxies the SVG as image/svg+xml, not rasterized)
• Pulse-cyan primary chrome via colors.primary in docs.json
• Dark code-block surface (now Vesper)
• New changelog <Update> entry
• AGENTS.md "Design system colors" token documentation refresh

Branch hygiene

chore/m64-007-design-w4 pruned from origin after merge.

Verification

• Mintlify deploy preview renders without build errors
• Body text renders in Instrument Sans, headings in Commit Mono (DevTools → Computed → font-family)
• DevTools Network tab shows /fonts/CommitMono-Medium.woff2 and /fonts/InstrumentSans-Variable.woff2 fetched, no fonts.googleapis.com requests
• Top-nav button reads "Install" with dark text on pulse-cyan
• Code blocks use the Vesper palette (no purple keyword/green string default)
• Brand-mark still pulses

🤖 Generated with Claude Code

Greptile Summary

This PR fixes the typography regression from #43 by routing font configuration through docs.json (which Mintlify's cloud build actually reads) and renaming custom.css → style.css (Mintlify's documented pickup filename), dropping ~250 lines of CSS that were 404-ing and never applied.

• docs.json: Adds fonts.heading (Commit Mono Medium) and fonts.body (Instrument Sans), switches styling.codeblocks from the \"dark\" shorthand to { \"theme\": \"vesper\" }, and renames the nav CTA to "Install".
• style.css: Slim replacement for custom.css — re-registers Instrument Sans with a full font-weight: 400 700 range to cover bold body text that docs.json's single-weight entry can't express, and forces the design-system's theme-fixed dark foreground on the pulse-cyan CTA button.
• Deleted: custom.css, tokens.css, and fonts/CommitMono-Regular.woff2 — all orphaned once the Medium weight is the only heading variant wired through docs.json.

Confidence Score: 5/5

Safe to merge — the change is purely additive config and CSS with no logic, no data paths, and no breaking changes to existing functionality.

All changes are declarative: docs.json schema fields and a 52-line CSS file. The previous review concerns about the broad nav button selector and the variable-font weight range are both addressed — the broad selector is gone, and the full 400 700 range is re-registered in style.css with an explanatory comment. The deleted files were confirmed dead (404 in the cloud build). No regressions are expected.

No files require special attention. The Mintlify deploy preview verification checklist in the PR description is the appropriate final gate.

Important Files Changed

Filename	Overview
docs.json	Adds fonts config (Commit Mono heading, Instrument Sans body), switches codeblocks from the "dark" shorthand to an object with "theme: vesper", and renames the nav CTA from "Mission Control" to "Install".
style.css	New file replacing custom.css; re-registers the Instrument Sans variable font with the full weight range (400–700) to supplement docs.json's single-weight entry, and forces dark text on the pulse-cyan CTA button using href-targeted selectors.
custom.css	Deleted — was dead code (404 on the cloud build); all functionality now handled via docs.json schema fields and style.css.
tokens.css	Deleted — was only imported by the now-deleted custom.css; hex literals that are still needed are mirrored directly in style.css.
fonts/CommitMono-Regular.woff2	Deleted — orphaned once docs.json wires only the Medium weight (500) for Commit Mono headings; the Regular weight is no longer referenced anywhere.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[Mintlify Cloud Build] --> B[docs.json]
    B --> C["fonts.heading: Commit Mono Medium, weight 500"]
    B --> D["fonts.body: Instrument Sans Variable, weight 400"]
    B --> E["styling.codeblocks: vesper"]
    B --> F["navbar.primary: Install"]

    A --> G["style.css - cloud CSS pickup"]
    G --> H["font-face: Instrument Sans, weight 400-700"]
    G --> I["CTA selectors: color #0a0d0e"]

    C --> J["/fonts/CommitMono-Medium.woff2"]
    D --> K["/fonts/InstrumentSans-Variable.woff2"]
    H --> K

Loading

_{Reviews (3): Last reviewed commit: "fix: lint — revert body weight to number..." | Re-trigger Greptile}

[indykish]

Both addressed in b9892c0.

• P1 (style.css nav button[type="button"]) — dropped. You're right: it would have forced #0a0d0e on every icon button inside <nav> (theme toggle, search trigger, mobile hamburger), making them invisible against the dark-mode chrome. The first three selectors already cover the "Install" CTA precisely (href match + Mintlify data attribute); no catch-all needed.

• P2 (docs.json body weight) — switched 400 → "400 700". Good catch on the variable-font registration: a single numeric weight registers only that one face, so <strong> would have fallen back to system. Range string mirrors the CSS font-weight axis spec. One residual risk — the Mintlify schema declares weight: number, so the string form may fail validation at build time. If the deploy preview rejects it, fallback options are (a) drop the weight field entirely on body, or (b) set 400 and accept system-bold as a known limitation. Will know in a few minutes from the preview.

[indykish]

Lint failure was the schema enforcement we worried about: `Mintlify validate` rejects `weight: "400 700"` ("Expected 'number'"). Fixed in 8ad246b:

• docs.json — body weight reverted to `400` so `mintlify validate` passes (verified locally: "build validation passed").
• style.css — to keep the bold-text fix from greptile's P2, added a parallel `@font-face` for "Instrument Sans" with `font-weight: 400 700` covering the full wght axis. Browsers match font-faces by weight, so `` (700) lands on this declaration while regular body keeps using whichever face Mintlify generates from `docs.json`.
• Caveat: this only kicks in once `style.css` actually loads on the cloud-built site. If Mintlify's auto-pickup of root CSS isn't real for this build either, we degrade to weight-400-only — same outcome as without this file. The deploy preview will tell us.