fix(a11y): restore composer focus indicator in dark mode (A6)

[BrianGenisio]

Summary

Closes #52 ([a11y][A6]). In dark mode the composer had no visible focus indicator: --chatbox-ring-display was forced to none, and --chatbox-focus-bg matched the resting --chatbox-bg, while the textarea's own DS focus ring stayed suppressed.

Changes

Dark :root overrides in public/app.css no longer hide the conic ring or pin focus background to the resting plate. Dark mode now inherits --chatbox-ring-display: block and --chatbox-focus-bg: var(--Colors-Backgrounds-Main-Top) from light :root (Main-Top resolves to Neutral-1300 in dark). Light mode unchanged.

Ring colors (#B2CDFF and siblings) clear 3:1 against the dark chatbox / page surfaces. App CSS only; no design-system token change (A7 focus-ring contrast remains a separate DS issue).

Test plan

• npm test (CSS token guards in tests/dom/composer-focus-a6.test.js)
• axe shrink-only gate — passed; no baseline change
• Dark mode: Tab to the composer — conic ring appears; unfocused state has no ring
• Light mode: existing animated focus ring still looks correct
• prefers-reduced-motion: ring still appears (static, no spin)

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 155e51ec-5fd1-4a7d-a6bb-9f16d1eb30ef

📥 Commits

Reviewing files that changed from the base of the PR and between 4f1a2c1 and f7ba5c8.

📒 Files selected for processing (1)

• tests/dom/composer-focus-a6.test.js

---

📝 Walkthrough

Walkthrough

Dark-mode chatbox variables now preserve the base focus background and ring visibility. Only the background transition remains disabled in dark mode. A Vitest regression test reads the CSS, extracts dark-mode variables, and verifies that the focus ring remains enabled and the focus background is not overridden.

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the accessibility fix and the affected dark-mode composer focus indicator.
Description check	✅ Passed	The description explains the dark-mode accessibility issue, the CSS changes, and the validation performed.
Linked Issues check	✅ Passed	The changes restore the dark-mode focus indicator, preserve light mode, and add regression coverage for issue #52 requirements.
Out of Scope Changes check	✅ Passed	The changes are limited to app CSS and a focused regression test, with no unrelated or design-system changes.

---

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@tests/dom/composer-focus-a6.test.js`:
- Around line 29-31: Update the assertions in the composer focus test to first
extract the light/base :root block and verify that it defines
--chatbox-ring-display and --chatbox-focus-bg with their exact expected values.
Scope the existing block-related checks to this extracted :root content, while
preserving the dark-mode assertions that ensure the old overrides are absent.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 53dd897f-7cb9-4a50-8488-ba03e77307d9

📥 Commits

Reviewing files that changed from the base of the PR and between 05f272e and 4f1a2c1.

📒 Files selected for processing (2)

• public/app.css
• tests/dom/composer-focus-a6.test.js