feat(web): set the text size steps from the design

[hzub]

Related issue

Closes OMNI-2331

Summary

Sets the text size steps from the design:

Use	Size	Line height	Letter spacing
Body text	13px	18px	0
Chat text	13px	18px	0
Caption (sidebar subtitles like Projects / Sessions)	12px	16px	0

• Body and chat text are both 13/18, so they share the existing text-13 step — its line height was 20px and is now 18px. No separate chat token, since a second 13/18 step would be a duplicate.
• Adds the 12/16 caption step (text-caption).
• Letter spacing is 0 across all three, which is already the default, so there's no token for it.

Scope caveat: this defines the steps. text-13 has existing consumers so the 18px line lands immediately, but pointing the chat thread and sidebar subtitles at these steps is follow-up work — that part of OMNI-2331 is not done here.

Stacked on #4020 (rails + backgrounds) — review that one first.

Test Plan

• npm run test for the touched suites — index.css.test.ts, Sidebar, AppShell, WorkspacePanel, Sidebar.subagentHighlight: 201 passing.
• prettier --check clean.
• Manually checked the surfaces already on text-13 (composer footer selectors, slash-command rows) for the tighter line height.

Demo

N/A — type-scale values only.

Type of change

• Bug fix
• Feature
• UI / frontend change
• Refactor / chore
• Docs
• Test / CI
• Breaking change

Test coverage

• Unit tests added / updated
• Integration tests added / updated
• E2E tests added / updated
• Manual verification completed
• Existing tests cover this change
• Not applicable

Coverage notes

A line-height value change has no behavioral surface to unit-test; the existing suites confirm nothing regressed, and the tighter line was checked by eye on the surfaces already using text-13.

Changelog

Tightened body and chat text to the design's 13/18 type scale.

[omnigent-ci]

Polly AI Review

Review: feat(web): set the text size steps from the design

Blocking issues

None. The diff is a self-contained set of Tailwind v4 @theme inline token changes in web/src/index.css:

• --text-13--line-height 20px → 18px (with the accompanying comment updated to match).
• New --text-caption / --text-caption--line-height (12/16) step.

Both are valid @theme inline declarations that generate the expected utilities (text-13, text-caption). No logic, no contracts, no error paths, no test assertions touched (index.css.test.ts only inspects backdrop-filter glass rules, so it is unaffected).

Security vulnerabilities

None. No code, no dependencies, no lockfile changes, no extras — purely CSS custom-property values.

Non-blocking notes

• Global side effect on text-13, spot-checked only. The line-height change applies to every existing text-13 consumer (NewChatDialog.tsx, SkillPills.tsx, composer footer/slash-command rows), not just body/chat text. The PR acknowledges this and says it was verified by eye. Worth confirming the denser rows (NewChatDialog list items, the pill chrome) still look right — though SkillPills uses leading-none, so it overrides this line-height and is unaffected regardless.
• text-caption is a dead token until follow-up. No consumer references it yet (grep finds none); the PR explicitly scopes the actual chat/sidebar re-pointing as follow-up. Defining the step ahead of its consumers is a reasonable stacked-PR pattern, but the token ships unused on this branch.

Summary

Low-risk, correctly-scoped design-token change. The only real-world consequence is the 20→18px line height tightening every current text-13 surface, which the author flagged and manually checked; there is no automated coverage for line-height values (nor is one really warranted). No correctness, contract, or security concerns. Fine to merge once the stacked base (#4020) lands and the tighter line is visually confirmed on the denser text-13 rows.

---

_{Automated review by Polly · workflow run}

[github-actions]

❌ UI Snapshot doesn't match the committed baseline.

If this UI change is intentional, update the baseline — each path renders in the same pinned image, so the result matches this gate:

• Label the PR (recommended): add the update-ui-snapshot label — the bot regenerates the baseline in the pinned image, pushes it back here, and re-runs the checks.
• Locally with Docker: run tests/e2e_ui/visual/regen_baseline_docker.sh, review the PNG, then commit + push.

Diff PNGs (expected_=baseline, actual_=your render, diff_) are in the run artifact. Full guide: tests/e2e_ui/visual/README.md.

[github-actions]

UI Preview for this PR has been removed.

[github-actions]

✅ Regenerated the visual baseline(s) in the pinned Playwright image and pushed to this PR. CI will re-run on the new commit.

[github-actions]

🏷️ Doc impact: no-doc-update

Pure CSS/typography tweaks (font size and line-height for chat/sidebar text) plus updated visual snapshot baselines; no user-facing surface, integration, or documented behavior changed.

_{Auto-classified on merge. Set the label manually before merging to override. · run}