---

id: f4e0b79d-0312-4d4d-b014-84337f4ef3db title: 'Design foundations: raise the CSS budget (49 bytes free) + spacing/type/color scale' state: closed labels:

• ui assignees: [] milestone: null created: 2026-10-27T15:26:36.434267184Z updated: 2026-10-27T16:00:02.419622939Z

---

Parent/blocker for the cosmetic pass. static/style.css is 15311 / 15360 bytes — 49 bytes of headroom — and three tests plus gl0w.md enforce the cap:

• tests/polish.rs:127, tests/light_theme.rs:220, tests/responsive.rs:169 → len < 15360
• gl0w.md → "CSS budget: must stay under 15360 bytes (15KB)"

Owner has approved raising the budget as needed for quality. This issue is the mechanical unblock: raise the cap and lay down the scale the other seven skin issues will write against.

Scope:

1. Raise the budget test to a sane new cap (proposal: 32 KiB = 32768, still tiny, still zero-JS, still hand-written CSS) and update gl0w.md + every test assertion. Keep the border-radius: 0 rule unless the owner says otherwise.
2. Add a small, explicit spacing scale (--s1..--s6 ≈ 4/8/12/16/24/32px) and a type scale (--fs-sm..--fs-3xl) and use them on the new rules; do not rewrite everything in one go.
3. Add the theme tokens the other issues need: --surface (card/panel bg, distinct from --bg), --surface-2, --fg-dim for AA-passing muted text, --accent alias, --state-open/merged/closed colors, and --radius (0 today) so a future owner flip to rounded is one line.
4. Document the scale + token list in a comment block at the top of the file (it is already the de-facto design doc).

Acceptance:

• budget constant lives in one place (a test helper or const), not three copied literals
• gl0w.md and the three tests agree with the new cap
• new tokens defined for both :root (dark) and @media (prefers-color-scheme:light)
• cargo test green with the CSS at its new size

Note: this is the only issue in the batch that others depend on; land it first.