chore: distinguish docs favicon from web and pad the spiral

[adelrodriguez]

The web and docs favicons were identical — a white spiral on a black rounded square — so the two sites were indistinguishable in browser tabs. The spiral also ran close to the square's corners.

Docs is now inverted to a black spiral on a white background, while web keeps the white-on-black look. Both spirals are scaled down from 0.78 to 0.68 so there's more breathing room between the spiral and the rounded-square edges.

Changes made by Claude Fable 5 via Claude Code.

🤖 Generated with Claude Code

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
init	Ready	Preview	Aug 15, 2026 2:25pm
init-docs	Ready	Preview	Aug 15, 2026 2:25pm

[pullfrog]

Your anthropic account is out of credit.

Pullfrog detected a billing-exhausted response from your provider — the agent stopped before completing this run.

Top up anthropic →

Credit balance is too low

  ^{｜ Rerun failed job ➔ ｜ View workflow run ｜ via Pullfrog ｜ Using Claude Opus ｜ 𝕏}

[adelrodriguez]

@pullfrog review

[pullfrog]

ℹ️ No blocking issues — two observations about how these render at actual tab size.

Reviewed changes — two static SVG favicons, no code paths touched. I rasterized both files before and after with headless Chromium to check the claims.

• Docs favicon inverted — apps/docs/public/favicon.svg swaps the plate to #f1f3f5 and the spiral stroke to #080a0d, so docs and web are no longer identical in the tab strip.
• Spiral scaled down in both files — scale(.78) → scale(.68) on the mark's transform, in apps/docs/public/favicon.svg and apps/web/public/favicon.svg.

Both stated goals hold up. The mark's extreme tips move from 12.7 to 19.3 user units off the plate edge (~10% → ~15% padding), and the two icons are now clearly distinguishable.

True 16×16 raster, magnified 8× nearest-neighbour — this is what a tab actually shows:

ℹ️ The docs inversion is not carried through the rest of the docs brand assets

apps/docs/public/social-preview.svg is still a dark composition (#080a0d plate, #f1f3f5 mark), and the docs theme-color pair in apps/docs/astro.config.ts:36-45 is unchanged. After this PR the favicon is the only light-plate asset docs ships, so the tab icon and the link-preview card now read as different brands. Nothing breaks — it is a scope question about whether the inversion is the docs identity or just a tab-strip disambiguator.

Technical details

# Decide the scope of the docs inversion

## Affected sites
- `apps/docs/public/favicon.svg:2-3` — now a light plate with a dark mark.
- `apps/docs/public/social-preview.svg:12,17` — still `#080a0d` plate with `#f1f3f5` mark and text.
- `apps/docs/astro.config.ts:36-45` — `theme-color` still `#fafafa` light / `#080a0d` dark, matching the old dark-first favicon.

## Required outcome
- The docs brand set is internally consistent: either the favicon inversion is a deliberate tab-strip-only disambiguator (fine to leave as-is, but worth stating so the next person does not "fix" it), or docs is going light and `social-preview.svg` should follow.

## Open questions for the human
- Is inverting the only differentiator on the table? A distinct accent (docs already uses `#38bdf8` and `#7dd3fc` in `social-preview.svg`) would separate the two tabs while keeping both brand sets dark-first.

  ^{｜ Fix all ➔ ｜ Fix 👍s ➔ ｜ View workflow run ｜ Using Claude Opus ｜ 𝕏}

[pullfrog]

scale() shrinks stroke-width and the inter-arm gaps along with the mark, so this is a size and a weight change: the rendered stroke drops from 10.14 to 8.84 user units, and the gap between adjacent spiral arms drops from 7×.78 to 7×.68 — about 0.68px to 0.60px at a 16px tab. Both were already sub-pixel, but the true-16px raster in the review body shows the interior arms mushing together noticeably more than before. Same change on line 3 of apps/docs/public/favicon.svg.

Technical details

# Padding gain trades against interior resolution at tab size

## Affected sites
- `apps/web/public/favicon.svg:3` — `scale(.78)` → `scale(.68)`.
- `apps/docs/public/favicon.svg:3` — same change.

## Geometry
The spiral's arms sit at x = 24, 44, 64, 84, 104 (20 units apart) with `stroke-width="13"`, leaving a 7-unit gap. Uniform scaling preserves the 13:7 ratio but shrinks both terms, so at a 16px render the gap goes 7 × s × (16/128): 0.68px at `.78`, 0.60px at `.68`.

## Required outcome
- Confirm the spiral still reads as a spiral at 16 and 32px, not as a filled diamond — this is where a favicon spends nearly all its time.

## Suggested approach (optional)
- If the interior needs to hold up, the lever is the stroke-to-gap ratio, not the scale: dropping `stroke-width` from 13 to ~10 makes the gaps as wide as the strokes and roughly doubles interior separation at 16px, independent of the padding change.

[pullfrog]

#f1f3f5 against light browser chrome (the active tab is ~#ffffff in Chrome, Firefox and Safari) leaves the rounded-square plate all but invisible, so the docs icon loses the hard silhouette that makes the web icon scannable and reads as a small floating diamond — visibly smaller apparent footprint than web's at 16px. See the light-chrome rows in the review body. Differentiation still lands, but it is much stronger on dark chrome than on light, which is the more common default.