## 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/peras/2c988a48-c598-4fdf-86c9-23be8072f64d-1792821847-6.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/peras/2c988a48-c598-4fdf-86c9-23be8072f64d-1792821751917-full.webp
- Component on Kage: https://kage.design/component/peras-feature-grid-3

## Before you start
Ask what planning, budgeting, scheduling, or reporting capabilities the user's product offers. Apply this pattern to those capabilities with original content.

Build a centered section with a concise heading, then three equal explanatory cards in a row. Each card needs a short title, a one-sentence benefit, and enough copy to clarify the use case. Follow the cards with a full-width dense reference list of practical actions and their commands. Keep the section more information-rich than promotional, using a clear hierarchy and generous vertical spacing. Use #080b0a, panels #101512, borders #202722, text #edf0ea, muted #9aa39a, and lime #b7ff3c. Use 10px radii, 20–24px card padding, 1px dividers, and monospace for commands. Make rows keyboard-focusable if they link to documentation.

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