# iPad and PC Layouts

## Desktop layout

- Left sidebar: 240-280 px.
- Sticky header: page title, demo badge, environment.
- Main grid: Home sections stacked vertically with card grid for modules.
- Optional right column: help/status only.

## iPad layout

- Bottom navigation.
- One-column Home flow.
- Module cards in 2x2 grid when space allows, otherwise stacked.
- Touch targets >= 44 px.
- No horizontal scrolling.
- No hover-only interactions.

## Breakpoints

- Compact: one column, bottom nav.
- Tablet: 2-column module grid, bottom nav.
- Desktop: sidebar and wider content.

## Anti-patterns

- More than 4 module cards.
- More than 5 attention items.
- Tables on Home.
- Tiny click targets.
- Sci-fi animation noise.
