[Improve] Keep rendered content legible across IDE themes

[zoomote]

​Created by Roomote. Follow up by mentioning @roomote, in the web UI, or in Discord.

What changed

• Repaired code-block fallback and toolbar colors so rendered code remains on a valid theme-derived background.
• Moved code highlighting to WCAG-compliant high-contrast syntax palettes and made mounted code blocks refresh when the IDE theme changes.
• Kept initial code blocks positioned at line 1 while preserving bottom-following for later streaming updates.
• Added VS Code's native contrast boundary to primary buttons and guarded shared buttons against flex compression and right-edge clipping.
• Replaced saturated unchanged-diff fills with the semantic unchanged-code background and added numeric checks for context text, gutters, and syntax tokens.
• Replaced fixed red, green, blue, gradient, and compounded-opacity treatments in command permissions, MCP tools, Marketplace states, context menus, and checkpoints with semantic VS Code theme colors.
• Added numeric WCAG checks and four-theme visual coverage for the real code block and toolbar, syntax tokens, diffs, terminal output, command status controls, disabled MCP text, the full Welcome landing, and empty History.
• Strengthened geometry assertions so shared controls and action rows retain complete padding and stay within their component bounds.
• Kept synthetic accessibility-gallery baselines scoped to the mounted component while retaining four-theme resting and focus coverage.
• Corrected visual fixture sizing so code controls fit the panel width, Welcome uses the intended full-height viewport, and Azure settings render through the final controls without hidden overflow.
• Extracted the Welcome landing presentation from provider setup so the real first-run screen can be exercised by the component-test harness.

Why this change was made

The shared-control contrast audit left high-frequency rendered content and composed screens uncovered. Several of those surfaces still used invalid CSS fallbacks or styling that assumed a dark theme, existing code blocks did not refresh syntax colors after a live theme switch, and some high-contrast controls or unchanged diff rows blended into their backgrounds.

Impact

Code output begins with its first lines visible, buttons retain complete geometry and clear boundaries, and unchanged diff rows use readable neutral backgrounds. Status controls, secondary text, and first-run/history surfaces remain identifiable in light, dark, high-contrast, and high-contrast-light IDE themes. Broader Electron production-parity snapshots, stable Playwright component migration, and reusable layout-drift process work are tracked separately in #1358 so this PR remains focused on the concrete contrast and visibility regressions.

Related PRs

• Zoo Code Docs theme examples

[codecov]

Codecov Report

❌ Patch coverage is 93.10345% with 2 lines in your changes missing coverage. Please review.

Files with missing lines	Patch %	Lines
...rc/components/chat/checkpoints/CheckpointSaved.tsx	0.00%	0 Missing and 1 partial ⚠️
webview-ui/src/components/common/CodeBlock.tsx	95.23%	0 Missing and 1 partial ⚠️

📢 Thoughts on this report? Let us know!

[zoomote]

Fixed the reported visibility issues through 248b076: initial code stays at line 1, high-contrast buttons use native boundaries, controls and action rows retain complete geometry inside their component bounds, unchanged diff rows use the readable semantic background, and affected component-scoped baselines are current across all four themes. The Welcome-only layout-process experiment was removed to keep this PR focused; Electron production-parity snapshots, stable Playwright component migration, and reusable sizing/text-spacing contracts are tracked in #1358. The full test suite passes (including 1,754 webview tests), the complete PR matrix is green, and the pinned visual run passed all 42 visual/theme checks: https://github.com/Zoo-Code-Org/Zoo-Code/actions/runs/33132748287