## 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/jackalope/0b3edf93-8385-4e4a-8f92-3c01052ad81d-1789193037-5.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/jackalope/0b3edf93-8385-4e4a-8f92-3c01052ad81d-1789192903236-full.webp
- Component on Kage: https://kage.design/component/jackalope-gallery

## Before you start
Ask what core product screen best demonstrates the user's product and what visual tone the brand should have. Build a new preview around that answer.

Create a full-width product showcase band with a soft lilac gradient or textured background. Use a centered max-width layout, a large heading at the top, and a white rounded presentation frame containing a compact side navigation and a detailed application screenshot/mock interface. Include a small dark floating demo button centered near the bottom edge of the preview. Use #e8e7f5 for the section, #ffffff for the frame, #1b1b25 for type, and indigo #5144ed for selected navigation and actions. Use 44–56px heading typography, 14px interface labels, 12–16px radii, 1px cool-gray borders, and a restrained shadow. Let the preview scale fluidly, preserve its internal hierarchy, and provide a click-to-play or modal interaction for the demo button.

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