Skip to content

Lead wizard brand polish

Local preview: http://127.0.0.1:3110/#qualifier

The guided form and chat now share a blue gradient surface, a thin gold border with a 2px gold top edge, and the existing CaseSolo gold primary action. The mode switch, progress indicators, field borders, checkbox states, and keyboard focus treatments use the existing brand tokens. Green remains on completion indicators. Supporting text was brightened for the new surface.

The two existing modes retain their jobs: the guided form presents one structured step at a time; chat presents the conversational intake. No modes, fields, steps, disclosures, consent wording, data contracts, persistence, or submission conditions were changed. An independent comparison against snapshots taken before this styling pass confirmed that scope.

Motion decision: decorative pulsing and progress glows were removed. Mode selection retains a short transform transition with a reduced-motion override. Checkbox and progress state changes are immediate.

Verification

Reviewed the local render before the change and in multiple subsequent desktop and 320px passes. The gold keyboard focus indicator remained visible while tabbing through both acknowledgments and continuing to the native case-type select. The select measured 46px high, with white text on #0B1B34; document and viewport widths both measured 320px with no horizontal overflow. Mobile disclosure text and labels wrapped within the panel. Chat loading and the initial conversation both displayed the shared surface.

Palette checks: navy text on gold is 8.61:1; white on Counsel Blue is 5.87:1. Existing white/50 helper text could fall to 4.03:1 over the brighter blue gradient, so it was raised to white/60. No accessibility certification is implied by these sampled checks.

| Check | Result | | --- | --- | | Long realistic content | Pass: existing disclosure and acknowledgment copy at 320px. | | Empty and one-item content | Pass: empty native case selector and initial chat message. | | Slow network | Loading surface observed; simulated network throttling not verified. | | Error during interaction | Not verified: no live lead submission or forced server error. | | Narrow width and zoom | 320px passed; 200% browser zoom not verified. | | Keyboard | Pass: mode controls, acknowledgments, Continue, and case selector. | | Screen reader | Native labels exercised by existing tests; manual screen reader pass not verified. | | Reduced motion | Source review passed for changed transitions; OS preference not exercised. | | RTL and long translation | Not verified: no RTL locale supplied; locale logic unchanged. | | Rapid repeated actions | Existing mode-switch persistence tests passed; network actions not stress tested. |

The 10 existing qualifier, mode-switch, and consumer homepage tests passed. Targeted ESLint and whitespace checks passed. No real lead was submitted, and nothing was deployed.

Source: docs/dev/wizard-brand-polish-2026-09-08.md