## 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/uber-com/6fbdb16b-1d65-42c3-b533-0bc1468316af-1789146363-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/uber-com/6fbdb16b-1d65-42c3-b533-0bc1468316af-1789146324299-full.webp
- Component on Kage: https://kage.design/component/uber-navigation

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

Build a responsive global navigation bar spanning the viewport. Use a high-contrast dark background around `#000000`, light text, a compact horizontal layout, and generous horizontal padding that collapses cleanly on mobile. Establish a clear brand area on the left, primary navigation links beside it, and utility controls plus a prominent rounded account action on the right. Use a modern sans-serif with 14–16px body text, medium-weight links, and a clearly emphasized button. Keep the bar approximately 44–56px tall, align everything vertically to one centerline, and use 8–12px gaps between controls. Add hover/focus states with subtle opacity or underline changes; make the mobile version collapse to a menu trigger. Use accessible labels and keyboard focus styles.

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