# Compact application design

The UI package now uses a quiet neutral canvas, compact application headings,
consistent controls, and layered charcoal surfaces in dark mode. Marketing
display typography remains available through Hero and MarketingSectionHeader.

## Shared defaults

- Control heights: 32px small, 40px default, 44px large; larger targets on coarse pointers.
- Corners: 6px controls, 10px panels, 12px dialogs.
- Flat cards and metric panels, with elevation reserved for overlays and explicit variants.
- No global entry animation or automatic hover lift on every button and linked article.
- PageHeader and SectionHeader use application-scale headings.
- DatePicker aligns days to weekdays, respects month length and date bounds, and supports arrow keys and Escape.

Configure `radius-sm`, `radius-md`, `radius-lg`, `control-height-sm`,
`control-height`, `control-height-lg`, `space-panel`, and the existing semantic
color/shadow tokens through `theme.themes`. Geometry and elevation are no longer
overwritten by a second global token declaration in the generated stylesheet.
Existing names, slots, and events remain available. MetricCard's default hover
is now `none`; use `hover="lift"` to retain the explicit elevated treatment.

## Review pages

Run the component showcase and open:

- `/design-system`: composed workspace overview and invitation dialog.
- `/design-system/profile`: profile form and preferences.
- `/design-system/login`: quiet split sign-in layout.
- `/components/date-picker`: calendar variants and controls.

The preview uses sample data and never sends invitations or sign-in requests.
Light and dark buttons use the native theme stylesheet switcher. The showcase
generator preserves the navigation link; these three authored pages are not
generated or overwritten by it.

## Adopting the refresh

Consumers receive the shared component styles and theme defaults when they adopt
the updated packages. Review application overrides for large headings, nested
cards, generous gaps, and hard-coded colors. The example showcase, CRM, and basic
application styles have been adjusted here. The deployed Account application's
page source is outside this repository and still needs its own layout migration.

Validate light/dark, narrow viewports, keyboard interaction, long text, and custom
theme overrides before refreshing the visual-contract baseline. That contract
is a file-hash check, not screenshot comparison.