Draft

Settings form

A narrow column of setting cards.

A narrow column of setting cards: a header, optional tabs, then cards of rows. Switches and choices apply at once; typed text has its own Save.

Use it for

From the Bridge OS app page .

Real package components on the sample network. Try the widths.

Your plan, accounts, notifications and appearance.

2 accounts

Weekly digest

A summary of your network every Monday.

Intro requests

When someone asks you for an intro.

Theme

Light or dark. Bridge follows your choice on every device.

Header. Title and a subtitle that can follow the tab.
Tabs. Settings / API / AI apps: the shared underline tabs on a divider line.
Setting card. A big card with a header strip, then flat rows with lines between: 14px label and 12px help on the left, the control on the right.

What	Value	From
Width	`LAYOUT_FORM` (720px)	Bridge OS `widths.ts`
Page padding (from the shell)	16px phone · 24px from 640px · 32px from 1024px; 32px top	Bridge OS `(shell)/layout.tsx`
Page title	22px Bold, 4px to a 14px `--text-body` subtitle, 24px below the header	Bridge OS (6 pages); pick 2026-11-02
Cards	Big cards: 16px corners, 24px inside, 16px apart. A card whose content runs edge to edge has a header strip instead (28px icon square, 14px title)	Picks 2026-11-02 (corners, space, headers)
Row	24px sides, 16px top and bottom	Bridge OS Network settings; pick 2026-11-02

Width	What happens
Any width	One column; the 720px column narrows with the screen.

Region	Loading	Empty	Error
Each card	Rows as skeletons	—	Couldn't load + Try again; failed saves put the control back

Do	Don't
Apply switches at once and confirm.	Add a Save button for switches.

Where Bridge OS differs from this template today. Follow the template, not the gap.

/network/settings is 1152px wide and 12px corners; it moves to 720px and 16px.
Settings' tabs are hand-made (they look the same as the shared Tabs); notifications are boxed tiles, not flat rows; cards are 20px apart.