# Navbar

A navbar exposes the highest-value destinations and global actions. It should
remain predictable across pages and should not absorb local page controls that
belong in content or a sidebar.

## Content model

Include the product or workspace identity, primary destinations, current
location, and only truly global actions. Keep labels stable. If space is tight,
preserve the most important destinations and move secondary items into an
explicit overflow menu rather than replacing every label with an icon.

Use the HTML `nav` landmark with an accessible label when more than one
navigation region exists. Mark the current destination with
`aria-current="page"`.

## Responsive behavior

Define layouts for wide, compact, and narrow viewports. A collapsed menu needs a
named button, announced expanded state, predictable focus, Escape dismissal,
and focus return. Respect safe-area insets on edge-to-edge mobile layouts. Do
not disable zoom or depend on hover.

## Global actions

Search, notifications, workspace switching, account, and help may appear when
they are genuinely global. Show status counts as accessible text, not color
alone. Separate destructive account actions from routine navigation.

## Verification

- Current location is visible and announced.
- Every destination is reachable at supported viewport widths and zoom.
- Collapse/expand behavior works with keyboard and screen reader.
- Focus does not disappear when the layout changes.
- Long localized labels do not overlap global actions.
- The navbar does not duplicate a second, competing primary navigation model.