## Source

`TODO`: "Light and dark mode transition is inconsistent. Not everything transitions nicely together. See if we can fix it systematically as opposed to on each element."

## Acceptance

- [ ] Audit the light/dark switch across pages, dialogs, portals, the code editor, charts and images, and record what changes abruptly or lags.
- [x] Decision: use one systematic **root cross-fade**, with reduced-motion opting out.
- [ ] Implement the root cross-fade instead of per-element rules.
- [ ] Respect `prefers-reduced-motion`.
- [ ] Keep all colours on the semantic tokens in `apps/web/src/app.css`; no hard-coded colour values.
- [ ] Add a visual or e2e regression check for both directions if the suite supports it.
- [ ] Document the rule so new components inherit it automatically.


<sub>Generated on _MrBeast_ using _opencode/deepseek-v4.1-flash_ in _ses_e8326e581ffeJviTmSkomwnKES_</sub>