Chart Prompts

Restyle my chart in the "Car Brochure" 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 specifications page of a premium car brochure. Bright showroom white, lots of air, one metallic racing-green accent and quiet silver secondary tones. Light, wide type and fine hairlines; nothing heavy.

Colors (use these exact values):
- Page: #FFFFFF.
- Accent: #0E5A3C (racing green) for the data line, its fill, the highlighted value and the accent spec figure. Draw the line with a horizontal gradient from #0A4A31 through #0E5A3C to #2E7A58 for a metallic sheen.
- Primary text: #1B1E20. Secondary text: #6B7278. Silver for axis labels, units and small caps: #9CA3A8.
- Hairlines and gridlines: #DADDE0. Baseline: #9CA3A8.

Typography (Google Fonts):
- Red Hat Display: masthead (model name 700, 13px, 5px letter-spacing, uppercase), section label (500, 11px, 3px letter-spacing, uppercase, silver), headline (300, 38px, -0.4px letter-spacing, stating the finding as a short sentence with a period), spec figures (300, 48px, -1px letter-spacing, with the unit as an 18px 500 suffix) and the highlight value (500, 16px, green).
- Red Hat Text with tabular lining figures for everything else: subtitle 14px #6B7278 with measure, unit and test conditions; spec captions 12px 500; axis labels 12px; source 11px silver.

Layout:
- 56px side margins. Masthead at y 58: model name, a 28 x 1.5px green rule, then the section label; a page number on the right in 13px 300 silver.
- Headline at y 112, subtitle below it.
- Spec strip between two full-width 1px #DADDE0 hairlines (about 86px apart): three large figures in equal columns separated by short vertical hairlines. The middle (hero) figure is green; the others are ink with silver units. Each has a 12px caption beneath.
- The chart fills the lower half (about y 300 to 512). Footer hairline near the bottom with the source on the left and the model name in wide-spaced lowercase on the right.

Axes and grid:
- Horizontal hairlines only (0.8px #DADDE0), y labels right-aligned 12px to the left of the plot, the unit ("km") above them.
- A 1px silver baseline with 5px tick marks and 12px labels below; an axis title right-aligned under the last label in 11px silver.

Marks:
- Line chart: one smooth monotone line, 3px, round caps, green sheen gradient. Under it a vertical gradient fill from green at 22% opacity to 6% at 60% depth to transparent at the baseline. Small solid green end dots (r 3.5) with 12px value labels above. Highlight one meaningful point with an r 6 white dot ringed by a 2.5px green stroke, a dotted green drop line (2 on, 3 off) to the baseline, and a two-line label (value 16px green, context 12px gray) placed above and to the right in clear space.
- Bar chart: slim square-topped bars in #DADDE0 silver-gray, about 40% of the band, with the single hero bar in #0E5A3C. Value labels 12px above each bar, hero value 16px green. Same hairline grid and baseline.

Avoid: shadows, heavy borders, bold headline weights, multiple accent colors, dense gridlines, legends for a single series.

When you're done, render the chart and check that the headline is light (300) and wide, only one thing is green per section, the spec figures are arithmetically true, and no label touches the line.