Four attempts, and this is what was wrong with the last one: full-width
panels stacked down the page, each carrying its own title INSIDE it. Every
group had two frames — the title bar and the border — so the page read as
a column of long boxes with nothing saying where one topic ended and the
next began, and a phone number got a field a thousand pixels wide.
The shape now:
- **A section list on the left**, sticky, so the sections stay reachable
however far a form runs. Below `lg` it becomes a scrolling strip of
chips, because a vertical list on a telephone is four rows of nothing.
Under it, who is signed in — on a shared office machine that is a real
question, and a settings page is where it gets asked.
- **A content column of 820px**, not the whole 1240 shell.
- **The heading OUTSIDE the card it belongs to.** A section is a heading, a
sentence, and then a card of rows. That single move is what stops them
reading as boxes: the border now frames the fields, not the topic.
- **What cannot be undone is last, in a card whose border says so** — the
deletion deadlines and the close button together, at the foot of the
contract section, in danger colours.
The rows are unchanged (label left, control right) and so is every binding;
what changed is the frame around them.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
5883989552