## 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/phantom-com/df84c488-d9fa-4f45-8b51-bd3e334c55b2-1789146859-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/phantom-com/df84c488-d9fa-4f45-8b51-bd3e334c55b2-1789146834018-full.webp
- Component on Kage: https://kage.design/component/phantom-navigation

## Before you start
Ask what the user's product is, who it serves, and what its brand personality and primary action should be. Apply the principles below to that product rather than reproducing the reference.

Build a responsive desktop-first navigation bar with a small brand mark area on the left, several grouped navigation links with optional chevrons, a search affordance, and one prominent rounded primary action on the right. Keep the content centered in a max-width container with generous horizontal padding. Use a very pale lavender background, a white translucent pill or soft surface for the link group, dark indigo text, and a light purple primary button (approximately #C2B6F5); use subtle shadow and a 999px radius. Typography should be clean, compact, and medium-weight, with the primary action slightly stronger than the links. On smaller screens collapse links into a menu while retaining the main action. Make search and menu controls keyboard accessible.

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