Chart Prompts

Restyle my chart in the "Funding Gap" 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 appeals tracker on deep maroon. Urgent without being loud: one enormous pale pink headline number, then a disciplined list of bullet bars where the unfunded part of every requirement is impossible to miss.

Colors (use these exact values):
- Background: #1E0F14 (deep maroon).
- Received or achieved amount: #FBCFE8 (pale rose), also for the hero figure and its caption.
- Requirement or target track: #3D2029 with a 1px #5A3340 outline; the same #5A3340 for the divider beside the hero.
- Gap values and the tick at the end of each requirement: #FFFFFF.
- Row names #F5E1E8, secondary text #B8959F, tertiary text #7E5E68.

Typography (Google Fonts):
- Libre Franklin for the hero figure (800, 118px, -5px letter-spacing, with a raised 64px percent sign) and the title (700 27px white, two lines, stating the total gap and the largest one).
- Source Sans 3 for everything else: hero caption 600 13px uppercase with 2px letter-spacing in rose; eyebrow 600 12px uppercase with 2px letter-spacing; subtitle 15px; row names 600 15px; row sub-labels ("38% funded") 12px; received labels 700 12px in the background color inside the rose bar; gap values 700 17px white; requirement column 12px; source 12px.

Layout:
- The hero figure in the upper left at x 36, baseline y 132, its two-line caption below. A 1px vertical divider 22px left of the title block, which starts at x 272 with the eyebrow, title and subtitle (measure, units, totals and sort order) and a small legend.
- Rows start at y 212, 41px apart, sorted by gap from largest to smallest: name and sub-label from x 40, bars from x 272 to 780, gap value 10px after each bar end, a right-aligned "REQUIRED" column at x 920.
- Column heads "GAP" and "REQUIRED" in 700 12px uppercase with 2px letter-spacing above the first row. Source at y 572.

Axes and grid:
- No axes or gridlines: every bar is labeled. All bars share one zero at x 272.

Marks:
- Bar chart (bullet style): a 24px-tall requirement track in #3D2029 with a 1px #5A3340 outline, a 14px #FBCFE8 received bar centered inside it from the same zero, a 2px white vertical tick at the requirement end, and the gap value in white right after it. The received value sits right-aligned 5px inside the rose bar's end.
- Line chart: requirement as a 2px #5A3340 line over a #3D2029 area, received as a 3px #FBCFE8 line, and the space between them lightly hatched in white at 12% opacity, with the final gap labeled in white 700 17px at the right end.

Avoid: gradients, glows, rounded bars, a fourth accent color, sorting by anything but gap size, and axis tick labels.

When you're done, render the chart and check that the rows are sorted by gap, every gap equals requirement minus received, the hero percentage equals total received over total required, and every received label fits inside its rose bar.