## 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-1792821846-2.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-code-block

## Before you start
Ask what the user's product monitors or automates and what output would prove its value. Apply the same information-design principles to that product.

Build a wide terminal demonstration panel with a dark inset window, thin border, small top chrome, and monospace output. Show several concise status rows, progress indicators, timestamps, warnings, and one or two accent colours to distinguish healthy, near-limit, and urgent states. Keep the output legible and intentionally cropped to a representative snapshot rather than making it a full application. Place a muted explanatory caption beneath. Use panel #090d0b, border #202722, text #cbd1c8, dim text #687169, lime #b7ff3c, amber #d5b65c, and red #d97070. Use 12–13px monospace text, 14–18px padding, and a 10px radius. If interactive, let tabs or a copy affordance change the displayed output.

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