What it decides for you

• Lead with a bold, unambiguous verdict on a dark premium hero panel ("All systems operational"), pairing the headline with a status glyph wrapped in a live "operational pulse" and the headline 90-day uptime figure — the answer must land before anything else.
• Let semantic colour do the work: green (#20c15e) = operational, amber (#f5a524) = degraded/partial, red (#ef4444) = outage; keep every other surface quiet ink or white so status reads as pure signal.
• Render history as compact 90-day tick-strips — one slim coloured bar per day — echoed from the hero down to every service row so trends and incident days are visible without a chart library.
• Show live performance, not just up/down: a real SVG latency mini-chart plus vital-sign tiles (incidents, mean-time-to-recover) prove the platform is healthy, not merely reachable.
• Pair every status with both a colour and a word (Operational / Degraded / Outage) and include a colour-blind-safe legend, so the page stays legible in grayscale and for every reader.
• Always close with a dated incident-history timeline — each event stepped from Investigating to Resolved with a duration and an ongoing indicator — and a subscribe-to-updates footer; transparency about the past plus a way to be notified are what build trust.
• Motion is a signature, not decoration: the operational pulse, a wiping tick-strip and a drawn latency trace all sit behind prefers-reduced-motion.

Ships with

Design tokens