Chart Prompts

Restyle my chart in the "Grey Scale" 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: a rigorous, colorless statistical bulletin. A five-step grey ramp does all the work; bold numerals and white seams keep it crisp. No accent color anywhere.

Colors (use these exact values):
- Page: #F3F3F3. Text and rules: #1A1A1A. Secondary text: #5C5C5C. Seams: #FFFFFF.
- Data ramp, darkest first, used in category order: #1A1A1A, #4D4D4D, #7A7A7A, #A6A6A6, #D0D0D0. With fewer categories, keep the darkest end and step evenly. Never add a hue.

Typography (Google Fonts): Archivo as a variable font (request wdth 62..125 and wght 100..900).
- Title: 700, 30px, -0.6px letter-spacing, #1A1A1A, stating the finding.
- A 1.5px #1A1A1A rule spanning the full content width 18px under the title.
- Subtitle and small text in the semi-condensed width (font-stretch 87.5%): subtitle 15px 400 #5C5C5C; legend labels and small caps 11px 600 uppercase with 1.2px letter-spacing; axis ticks 12px; source 12px.
- Category labels: normal width, 15px 500, right-aligned 14px left of the bars.
- Segment and value labels: 700, 14px, tabular figures.

Layout:
- 56px side margins. Title, rule, subtitle, then the legend, then the chart.
- Legend: a single continuous swatch strip, 10px tall, spanning the plot width and split into one step per category (2px gap between steps), with each category name in tracked caps 20px under its step. A small "FUEL" (or the dimension name) label sits at the left margin level with the strip.
- A 0.75px rule above the source line at the bottom.

Axes and grid:
- No gridlines. Bar chart: a row of 5px ticks at 0, 25, 50, 75 and 100% under the last bar with 12px percentage labels. Line chart: y ticks as 12px semi-condensed labels with 5px tick marks on a 1px #1A1A1A baseline, no horizontal gridlines.

Marks:
- Bar chart: horizontal 100% stacked bars filling the full plot width, 28px tall on a 38px row pitch, square corners. Each segment boundary is a 2px #FFFFFF seam. Print the segment value inside, 8px from its left edge, in 700 14px: #FFFFFF on the three darker steps and #1A1A1A on the two lighter steps. Skip labels on segments narrower than about 34px (and say so in the source note). Add "%" only to the first label in the first row. Sort rows by the first category.
- Line chart: lines in the ramp greys at 2.5px (the darkest for the most important series), square caps, with the series name at the right end in 13px 600 in the same grey (use #1A1A1A text for the two lightest steps). Separate adjacent lines with a 2px #FFFFFF halo under each line.

Avoid: any hue at all, gradients, rounded corners, drop shadows, borders around bars, and a separate boxed legend.

When you're done, render the chart and check that the ramp reads as five clearly different steps, every in-segment number has the right text color for its tone, the seams are crisp, and the legend strip lines up with the plot.