Chart Prompts

Restyle my chart in the "Graduation Gaps" 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 equity dashboard on near-black. Highlight and mute: everything is quiet gray except the rows that cross a meaningful threshold, which light up in one warm tangerine. Every mark is measured against a single white reference line.

Colors (use these exact values):
- Background: #111418 (near black).
- Highlight: #FB923C (tangerine), only for items past the threshold: their bar caps, value labels, gap numbers and the count in the title.
- Muted items: #9CA3AF for caps, labels and values. Connecting bars: #4B5563.
- Reference line and primary text: #F9FAFB. Eyebrow, column heads, axis labels and source: #6B7280. Gridlines: #1F242B. Row separators: #191D23.

Typography (Google Fonts):
- Rubik throughout. Eyebrow 12px 500 uppercase with 2px letter-spacing. Title 29px 700 #F9FAFB with the leading count phrase in tangerine ("Six groups trail the district rate by more than 5 points"). Subtitle 14.5px 300 #9CA3AF with measure, unit and what the gap means.
- Row labels 14.5px, right-aligned (500 white when highlighted, 400 #9CA3AF when muted). Value labels 13.5px (600 tangerine or 400 gray). Gap column 15px right-aligned (700 tangerine or 400 #6B7280), with a true minus sign. Column heads 11px 500 uppercase with 1.5px letter-spacing. Axis labels 12px. Key 12.5px. Source 12px 300.

Layout:
- 48px margins. Eyebrow at y 50, title at y 90, subtitle at y 118.
- A table-like grid: row labels end at x 280, the plot runs from x 298 to 800, and a GAP column is right-aligned at x 912. Column heads sit 16px above the first row. Rows are 33px tall, sorted from highest to lowest rate, separated by 1px #191D23 rules.
- A key under the axis: small 6 x 16 caps in tangerine and gray with their meaning, and the source right-aligned on the same line.

Axes and grid:
- Vertical 1px #1F242B gridlines every 10 points with % labels below. No axis lines.
- The reference (district) value as a 2px #F9FAFB vertical line through all rows, extending above the first row, labeled "DISTRICT 87.0%" in 11.5px 700 uppercase with 1.2px letter-spacing just right of its top.

Marks:
- Bar chart: for each row a 6px-tall #4B5563 bar spanning from the row's value to the reference line (either direction), ended at the row's value by a 6 x 22 cap with 2px radius, tangerine when the row falls more than the threshold below the reference and #9CA3AF otherwise. The value label sits 12px beyond the cap on the far side from the reference line.
- Line chart: thin 1.5px #4B5563 lines for muted series and 3px #FB923C lines for highlighted ones, the reference as a 2px #F9FAFB horizontal line, end labels in the series' highlight or mute color and the same right-hand gap column computed at the last point.

Avoid: more than one highlight color, gradients, glows, rainbow categories, bold labels on muted rows, and legends that repeat what the title and colors already say.

When you're done, render the chart and check that the tangerine rows are exactly those more than the threshold below the reference, the title count matches them, every gap equals the value minus the reference and uses a true minus sign, and no value label touches the reference line.