Part of #674. The screen that decides whether MUI delivers the look.
Direction: ledger desktop (A), field-first phone (B), one attention line.
Supersedes the shallow pass
A light conversion was spiked on 2026-09-13 — wrapping the four panels in MUI Paper, headings in
Typography, the "no entry" badge in Chip. All 39 Dashboard tests passed, typecheck passed, the
bundle grew 12.1 KiB gzip, and the screen looked essentially identical.
The reason is the lesson for every screen slice: .panel already sets background, border, radius
and shadow, so wrapping that markup in Paper layers a second opinion under one that already won.
MUI cannot improve a screen while styles.css is still driving it. Converting means removing
the screen's own CSS and letting MUI own layout and typography.
That shallow diff is not to be committed; this slice replaces it.
Requirements
- Before/after screenshots at 1280 and 390, captured 1:1 from a stack rebuilt at the head under
review. Downscaling destroys the 1px hairlines and 4-5% alpha shadows a styling change is about.
- Attach with
gh pr comment --attach, never by committing images to a branch.
- The Dashboard tests pass on roles and text, not classNames — keep it that way.
Part of #674. The screen that decides whether MUI delivers the look.
Direction: ledger desktop (A), field-first phone (B), one attention line.
Supersedes the shallow pass
A light conversion was spiked on 2026-09-13 — wrapping the four panels in MUI
Paper, headings inTypography, the "no entry" badge inChip. All 39 Dashboard tests passed, typecheck passed, thebundle grew 12.1 KiB gzip, and the screen looked essentially identical.
The reason is the lesson for every screen slice:
.panelalready sets background, border, radiusand shadow, so wrapping that markup in
Paperlayers a second opinion under one that already won.MUI cannot improve a screen while
styles.cssis still driving it. Converting means removingthe screen's own CSS and letting MUI own layout and typography.
That shallow diff is not to be committed; this slice replaces it.
Requirements
review. Downscaling destroys the 1px hairlines and 4-5% alpha shadows a styling change is about.
gh pr comment --attach, never by committing images to a branch.