Chart Prompts

Restyle my chart in the "API Latency Map" style described below. Keep my data, chart type, title meaning and units; change only the presentation. Use the charting library this project already uses (plain SVG if there is none). If the library can't express a detail, draw it in a custom layer instead of dropping it. Measurements assume a 960 x 600 chart; scale them proportionally.

Mood: an operations console for a global API. Graphite, precise and cool, with thin spectral lines, a region rail on the left and boxed code tags at the line ends.

Colors (use these exact values):
- Page: #121417 (graphite). Left rail: #181B1F. Rules: #262A30. Gridlines: #1F2328.
- Series, in order: #38BDF8 (sky), #4ADE80 (green), #FACC15 (yellow), #FB923C (orange), #F87171 (red). Put the worst or most important series in red.
- Budget band: #9CA3AF at 12% opacity with a dashed 4 3 edge at 55% opacity.
- Text: #E8EAED titles and values, #B4BAC2 subtitle, #7C838D labels.

Typography (Google Fonts):
- Chivo for the title (700, 27px, -0.4px letter-spacing, stating the finding), subtitle (400, 14.5px), region full names (400, 11px) and source (400, 11.5px).
- Overpass Mono for the rail wordmark (700, 13px, 2px letter-spacing), rail heads (600, 10.5px, 1.5px letter-spacing), region codes (700, 13px in the rail; 700, 11px in tags), values (500, 11 to 12.5px), axis labels (400, 11px), the red status line (500, 11.5px) and band label (600, 10.5px uppercase, 1px letter-spacing).

Layout:
- A 196px left rail with a 1px right rule: wordmark and a lowercase mono descriptor at top, then a "REGIONS" list: 10px rounded swatch, bold code, a right-aligned summary value (the alert region's value in its own color), the full region name below, 1px rules between rows.
- Content from x 236: title, subtitle, a one-line status in red mono, then the plot from x 236 to 840, y 168 to 494.
- Footer: source at left under the plot, a mono note at the far right.

Axes and grid:
- Horizontal gridlines every 50 units in #1F2328; y labels right-aligned in mono; x ticks 5px long with mono labels ("Day 8"), first left-aligned and last right-aligned.
- The budget is a translucent gray band from the budget line to the top of the scale, labeled inside its top-left corner in mono caps.

Marks:
- Line chart: 1.6px straight-segment lines with round joins, a 3px dot on each last point. At the right end, each line gets a leader to a boxed tag 84 x 20 (3px radius, graphite fill, 1.2px stroke in the series color, a 4px solid color strip on the left) holding the code in the series color and the last value in white. Push tags apart so they are at least 24px apart vertically.
- Bar chart: grouped thin bars (8 to 10px, 2px top radius) in the same five colors with the same budget band across the plot; region code tags replace the legend by sitting above each color's last bar.
- Annotate one-off events with a small bracket in the series color and a mono label placed in clear space.

Avoid: thick lines, area fills, glows, a separate legend box, light backgrounds, and colors outside the five-step spectrum.

When you're done, render the chart and check that end tags don't overlap, orange and red lines are told apart by their tags, the annotation clears every line, and the day counts in the status line match the data.