0.45.1 — give the context number its own card, not badge nineteen

[VickyXAI]

0.45.0 published the context figure and then buried it: a shields badge sitting second in a row of nineteen, between MIT License and TypeScript 5. Those are table stakes. This is the one number nothing else in the ecosystem publishes. No amount of colour rescues something in a badge wall — the problem was placement, not design.

What changed

The figure now sits directly under the install command as a card, which is the highest-attention spot in any README:

• the number large enough to be the thing you see
• a reference unit so it means something — 6% of a 200K context window. Install-size badges work because everyone knows what 100MB is; tokens have no such intuition yet, and supplying one is the actual brand work
• the --profile trading alternative at −57%
• the line that does the work: every turn, whether or not you call a tool

The shields badge is retired. The wall is down to eighteen.

Generated, never hand-drawn

npm run brand:card renders both variants from the live measurement, so the card cannot outlive the number it states. test/schema-tokens.test.ts checks the headline figure, the reference percentage, the trading figure and the saving against a fresh in-process measurement — in both variants, since a dark-mode reader sees a different file. Verified by doctoring a card and confirming the build fails.

Light and dark are separate SVGs behind <picture>: an SVG cannot restyle itself from the host page's colour scheme, so a single file would show a white card on a dark README.

One thing I checked rather than assumed

Relative paths are safe here. raw.githubusercontent.com now serves SVG as image/svg+xml (it historically served text/plain, which would have rendered as broken markup), so npm's rewriting of relative image URLs displays the card correctly on npmjs.com too. No PNG fallback needed.

Verification

• 430/430 tests pass.
• Typecheck, build, sync-brand-numbers --check clean.
• Both variants rendered to PNG and inspected visually, not just diffed — which is how the accent bar overshooting the corner radius got caught and clipped.

🤖 Generated with Claude Code

https://claude.ai/code/session_01WUL3ExR4Nz7uebxKaKwjDi