## Reference images

Study these alongside the description below: hierarchy, rhythm, spacing, colour. Build for the product you are asked about, using this design language.

- Component: https://kage-design-assets.t3.tigrisfiles.io/components/umbra-mail/e5ad193a-88e6-403f-9829-5608575fa4bb-1792476320-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/umbra-mail/e5ad193a-88e6-403f-9829-5608575fa4bb-1792476206048-full.webp
- Component on Kage: https://kage.design/component/umbra-mail-navigation

## Before you start
Ask what the user's product and brand are, then apply the principles below to that context rather than reproducing this reference.

Build a minimal top navigation for a calm, privacy-conscious software product. Keep it visually quiet and compact: use a transparent or very dark background, a small utility link on the right for the primary action, and an understated icon link beside it. Align the content to a centered max-width container with generous side padding. Use a small sans-serif type size around 12–13px, muted cool-gray text, and a subtle hover color transition. Avoid a full menu if the product only needs one clear action. Keep the bar around 40–56px tall and preserve enough contrast for accessibility.

Never: use logos, product names, copy, illustrations, or imagery from the reference.