Chart Prompts

Restyle my chart in the "Slope Study" 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 careful chart-form study from a quality weekend newspaper. Quiet slate context with exactly two stories told in color, labels set flush against the data like a typeset table.

Colors (use these exact values):
- Page: #FCFBF8 (warm white).
- Context series: #8A94A3 (slate gray) at 85% opacity.
- Highlight one: #0F6E6E (deep teal) for the most important riser (the steepest increase).
- Highlight two: #B8471F (rust) for the contrasting story (for example the only decline).
- Ink for title, column headers and values: #1F2328. Context labels: #4A515B. Secondary text: #6B6F76. Axes and footer rule: #D8D4CB.

Typography (Google Fonts):
- Newsreader 600 at 34px for the title (sentence case, -0.3px letter-spacing, stating the finding). Newsreader italic 400 at 15px for the one annotation.
- Libre Franklin for everything else: subtitle 15px 400 #6B6F76 (measure, unit, the two periods); column headers 13px 600 with 2px letter-spacing; labels 13.5px (500 for context, 700 in the series color for highlights); values 13.5px 600 with tabular figures (700 in color for highlights); footer 12px.

Layout:
- 56px side margins. Title baseline at y 70, subtitle at y 100.
- Two vertical axes, about 230px apart and centered (x 372 and x 604), 1.2px #D8D4CB, running from just above the top value to just below the bottom value.
- Column headers ("2015" right-aligned on the left axis, "2025" left-aligned on the right axis) at y 150 with a 1px #1F2328 rule 12px beneath each, spanning that side's label column.
- A 1px #D8D4CB footer rule at y 552, "Source: ..." at the left in 12px #6B6F76 and a one-line note about the second story in rust on the right.

Axes and grid:
- No y-axis ticks, no gridlines and no numeric scale: every endpoint carries its value.

Marks:
- Line chart (slope form): straight lines from the first period to the second, 1.5px slate for context and 3px with round caps for the two highlights, drawn on top. Heavy endpoint dots: r 5 slate, r 6.5 for highlights, each with a 2px #FCFBF8 ring.
- Left end labels: value right-aligned 16px left of the axis, name right-aligned 58px left of the axis. Right end labels: value 16px right of the axis, name 58px right. Where two labels would collide, nudge them apart to a minimum 17px baseline gap (relax pairs iteratively), leaving the dots at their true positions.
- Bar chart: use paired horizontal bars per category, one row per category sorted by the later value, the earlier period as a thin 1.5px slate outline bar and the later period as a solid 12px bar in slate; color only the two highlighted categories in teal and rust. End each bar with its value in Libre Franklin 13.5px and keep the same two column headers with rules beneath.

Labels and annotation:
- One short italic Newsreader note in teal directly under the steepest riser's right label (for example "the steepest rise, up 12.2 points"), leaving 18px extra room in the label spacing for it.
- No legend: color is explained by the labels themselves.

Avoid: more than two highlight colors, gridlines, markers in the middle of lines, a legend box, gradients and shadows.

When you're done, render the chart and check that no two labels overlap after nudging, each nudged label still reads clearly as belonging to its dot, the stated counts and point changes in the title and notes match the data, and the two highlight lines sit on top of the gray ones.