Not a reskin.
Navigation, hierarchy and the composer are rebuilt for one-hand use. The sidebar becomes a
drawer, the tool rail becomes a sheet, and every region can be hidden from
Settings → Layout.
Working in dsh-claude-mobile on main
Here’s the plan. Three structural moves, then the settings surface:
1 · One column. The three-column desktop frame collapses into a single column; the sidebar becomes a left drawer and the right rail becomes a bottom sheet. Nothing is merely recoloured — regions change parents.
/* drawer replaces the sidebar column */ :root { --sidebar: min(83%, 330px); } [data-slot="sidebar"] { position: fixed; inset: 0 auto 0 0; transform: translateX(-101%); transition: transform .34s var(--ease-ios); }
2 · The composer is the anchor. It is pinned above the home indicator, becomes a soft rounded card, and swallows model + permission into one context pill.
3 · Everything is hideable. Each region registers in
Settings → Layout with a visibility switch and a drag handle.
npm run build writes to dist/ and takes ~3s.
Try it.
Open the menu for history · tap the model pill for the sheet · tap a message for its actions ·
type to enable send. On a phone this page is full-bleed and installs as a PWA.