Chart Prompts

Restyle my chart in the "Needs Assessment" 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 sector overview table in a humanitarian response plan. White, orderly and data-dense in a friendly way: pictograms and names down the left, need versus target in one overlaid bar per row, and a small funding meter at the right edge.

Colors (use these exact values):
- Page: #FFFFFF.
- Total or larger measure (people in need): #D5DADF (light gray).
- Subset or primary measure (people targeted): #0E7490 (deep teal), also used for the eyebrow and its small marker block.
- Funding meters: fill #E8772E (orange) inside a #FBE3D2 track with a 0.8px #E8772E outline; the "FUNDED" column head in #E8772E; percentages below 20% in #B4501A.
- Ink #1E293B, secondary text #64748B, row rules and gridlines #E2E8F0, zero line #94A3B8, pictogram strokes #334155.

Typography (Google Fonts):
- Asap Condensed for the eyebrow (600 13px uppercase, 1.6px letter-spacing, teal), the title (700 30px ink, stating the finding) and column heads (600 12.5px uppercase, 1.4px letter-spacing).
- Asap for everything else: subtitle 14.5px muted; row names 500 15px ink; value labels 12.5px (700 white inside the teal bar, 400 muted after the gray bar); percentages 700 13px right-aligned; axis labels 12px muted; source and footnote 12px muted.

Layout:
- 40px side margins. A 6 x 16 px teal block and the eyebrow at the top, title at y 90, subtitle at y 116.
- Column heads and legend on one line at y 150: "SECTOR" on the left, legend swatches (14 x 12 px) above the bar column, "FUNDED" above the meters.
- A 1.2px ink rule at y 176, then one 43px row per category with a 1px #E2E8F0 rule under each row.
- Columns: pictogram centered at x 52, name at x 76, bars from x 284 to 736, meter 84 px wide at x 786, percentage right-aligned at x 920.
- Axis labels under the last row; the source on the left and a footnote defining the meter on the right at y 576.

Axes and grid:
- Thin 1px #E2E8F0 vertical gridlines at round values (0, 400, 800, 1,200) running the full table height; the zero line in #94A3B8. No horizontal axis line.

Marks:
- Pictograms: 22px outline icons (1.6px #334155 stroke, round caps and joins, no fill), one per row, simple and consistent (bowl, droplet, cross, shield, tent, bottle, book, tool).
- Bar chart: one 20px bar per row, square corners. The gray bar shows the total; the teal bar is overlaid from the same baseline for the subset. Subset value in white bold just inside the teal end; total value 7px after the gray end.
- Line chart: the same table layout rotated into time: the total as a light gray #D5DADF area, the subset as a 2.5px #0E7490 line with a teal end label, and a row of orange funding meters beneath the x axis for each period.
- Funding meters: 6px tall pill tracks (radius 3) with the funded share filled.

Avoid: color per category, gradients, rounded bar ends, bars stacked side by side instead of overlaid, filled or colored icons, and meters that dominate the bars.

When you're done, render the chart and check that each teal bar is never longer than its gray bar, the white labels fit inside the teal bars, the percentages in the title are arithmetically right, and pictograms line up with the row text.