[MaplumeX]

Summary

The narrow-screen settings skeleton was still iOS inset-grouped: a gray page with white rounded cards, hairline dividers between rows, and current values trailing at the end of the row. This replaces that skeleton with the segmented list style of Android 16 system settings (Material 3 Expressive). Navigation stack, back behavior, and the desktop settings dialog are unchanged.

Spec: .scratch/mobile-settings-m3-expressive/spec.md

Changes

Element	Before	After
Group	One rounded card with dividers between rows	Each row is its own rounded tile with a 2px gap; first row gets 24px top corners, last row 24px bottom corners, middle rows 4px; no dividers
Current value (SettingsRow.value)	Trailing gray text at the end of the row	Second gray line under the title (Material summary)
Switch (narrow screens)	Primary/gray track, 24px white thumb with shadow	Off: outlined track + 16px gray thumb. On: primary track + 24px thumb. No shadow
Home account row	48px avatar, 18px name	40px avatar, 16px name

Implementation notes

• The segmented styling lives on SettingsGroup's row container via [&>*], so it applies to direct children — either the row itself or a wrapper (e.g. the notification-reliability data-testid wrapper). Individual settings pages needed no changes.
• SettingsGroup gained a role prop; SettingsOptionGroup and the time zone picker now put radiogroup on the row container, making each option button a direct child and therefore its own tile.
• All Material 3 switch sizing/colors are scoped under max-md:; desktop keeps the original 36×20 switch.
• Group headers, footer captions, radio dots, top bar, and page background are unchanged from the previous Material pass.

Testing

• Existing settings tests (roles/aria, nav stack, Escape) pass unchanged.
• 390px screenshot acceptance across Home, General, Appearance, and About; light and dark; switches on and off.

Out of scope

• Press ripples and thumb growth on switch press.
• Folding footer captions into in-row subtitles.
• Primary color (still close to iOS system blue) — that is a global token.