Chart Prompts

Restyle my chart in the "Grantmaking by Area" 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: the grants section of a foundation's annual review. Calm, generous and humane: soft ivory paper, a literary serif title, a thin gold rule, muted earthy colors and quiet small-caps detail.

Colors (use these exact values):
- Page: #FBF9F3 (soft ivory) for the whole canvas. No cards or panels.
- Gold accent: #B8860B for the eyebrow, the 1px rule under the title and the folio.
- Category colors, one per group (pillar), in this order: dusk blue #5B7DB1, sage #7C9A7E, clay #C07A5A, heather #9A7AA0. Every mark in a group shares its group color.
- Ink #2B2A26 for titles, labels and value labels; secondary text #77726A; hairline guides and group dividers #E4DED0.

Typography (Google Fonts):
- Cormorant Garamond with lining figures (font-variant-numeric: lining-nums): title 600 38px ink in sentence case stating the finding; value labels 600 20px ink; group names 500 italic 21px in the group color.
- Nunito Sans for everything else: eyebrow 700 11px uppercase with 2.6px letter-spacing in gold; subtitle 400 15px #77726A with measure, unit, period and a total; category labels 700 15px ink; the count beneath each label 600 10px uppercase with 1.6px letter-spacing in #77726A (reads as small caps, e.g. "42 GRANTEES"); axis labels 11px; source 11px.

Layout:
- 64px side margins. Eyebrow at y 52, title baseline about 48px below, then a full-width 1px #B8860B rule 18px under the title, subtitle 28px below the rule.
- Three columns: group label column at x 64 to about 210 (a 3px vertical bar in the group color spanning the group's rows, italic group name 14px to its right, group total in 12px 700 Nunito Sans beneath); category label column from x 228 (label with its count line 16px below); bars from x 392 to 836.
- Rows 35px tall, groups separated by a 12px gap with a full-width 1px #E4DED0 divider in the middle of the gap.
- Footer: "Source: ..." at the bottom left in 11px #77726A; a folio "PAGE 7" at the bottom right in 10px 700 gold with 2px letter-spacing, with a 72px gold rule 18px above it.

Axes and grid:
- A 1px ink baseline at the bars' left edge. Vertical 1px #E4DED0 guides at a few round values, labeled beneath in 11px (0, $2M, $4M, $6M). No boxes, no tick marks.

Marks:
- Bar chart: horizontal square-cornered bars 15px tall, filled with the group color, sorted by group total and then by value within each group. Value label in Cormorant Garamond 20px 600, 10px past the bar end ("$6.8M"). Under every category label, its count in letter-spaced small caps.
- Line chart: 2.5px lines in the group colors with straight segments and 3px dots at each point, label each line directly at its end in the italic serif in its own color, and keep the ivory page, gold rule, hairline guides and small-caps counts under the direct labels. Horizontal gridlines replace the vertical guides.

Labels and annotation:
- Groups are labeled directly in their color, so no legend is needed. Put a second, quantitative fact under each label in small caps (counts of grantees, projects or sites).

Avoid: saturated or bright colors, gradients, shadows, rounded bar ends, heavy gridlines, a boxed legend, and more than four group colors.

When you're done, render the chart and check that the title's percentage matches the data, the group totals equal the sum of their rows, the italic group names don't touch the category labels, and the gold rule is the only gold line in the chart area.