Chart Prompts

Restyle my chart in the "Engine Eval" 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 analysis page of a chess study or game annotation tool. Crisp, monochrome and exact: light versus dark carries the story, with only two small warm colors for errors.

Colors (use these exact values):
- Page: #FFFFFF. Plot panel: #EFEDEA, a flat rectangle behind the plot area only.
- Ink (titles, the data line, zero line): #1A1A1A.
- Dark fill for values below the baseline: #2B2B2B (charcoal). Light fill above the baseline: #FFFFFF.
- Error markers: #D7262B (red, the worst events) and #E8861A (orange, lesser events).
- Secondary text: #6F6B66. Gridlines: #D8D4CE. Mini-board squares: #F4F2EE light and #BDB7AE dark.

Typography (Google Fonts):
- Libre Caslon Text 700 for the title (30px, #1A1A1A, sentence case, stating the finding) and for large before/after numbers (22px).
- Karla for everything else: eyebrow 11px 700 uppercase with 2.2px letter-spacing in #6F6B66 (separate parts with " · "); subtitle 14px #6F6B66 with measure, unit and sign convention; axis labels 12px #6F6B66; annotation labels 12px 700 in the marker's color; legend 12px #1A1A1A; notes 13px; source 11px.

Layout:
- 56px left margin. Eyebrow at y 58, title at y 100, subtitle at y 128, a one-row legend at y 156, plot from y 176 to 516.
- The plot takes the left ~65% of the width (x 70 to 676); a narrow right column (x 736 to 900) holds a detail inset for the key event: a small caption in 12px 700, the inset graphic, two lines of 13px explanation, then a before-and-after pair of numbers with a thin red arrow between them (the after value in red).
- Source line at y 572 in 11px #6F6B66.

Axes and grid:
- No axis lines except a 1px #1A1A1A baseline at zero across the panel.
- Horizontal gridlines at even steps, 0.8px #D8D4CE, drawn on the panel. Symmetric y labels right-aligned 10px left of the panel, with explicit signs ("+4", "0", "−4" using a true minus sign).
- X ticks: 5px #6F6B66 marks below the panel with 12px labels; first label reads "Move 1" (or the first category) and the last category is labeled.

Marks:
- Line chart: straight segments. Fill the area between the line and zero: above zero in #FFFFFF with the line drawn on top in 1.2px #1A1A1A; below zero in solid #2B2B2B (clip the two fills at the baseline so each sign gets its own color). The panel color shows between the fill and the panel edge, so advantage reads as light versus dark.
- Bar chart: diverging bars from a zero baseline, 60% of the band, square corners; positive bars #FFFFFF with a 0.8px #1A1A1A outline, negative bars solid #2B2B2B, all on the #EFEDEA panel.
- Event markers: circles on the line (r 5.5 red for the worst events, r 4.5 orange for lesser ones) with a 1.5px #FFFFFF ring, each labeled in 12px Karla 700 in its own color (placed so it never sits on a same-colored fill).
- Largest swing: a 1px red bracket beside the jump with a label such as "4.9-pawn swing" in 12px 700 red; compute the value from the data.

Detail inset:
- A small 8 x 8 board (20px squares, 1.2px #1A1A1A frame) using the two square colors, with the moved-from and moved-to squares tinted #D7262B at 28% opacity. Pieces use solid chess glyphs from Noto Sans Symbols 2 at 17px: the light side filled #FFFFFF with a 0.9px #1A1A1A outline (paint-order stroke), the dark side filled #2B2B2B. File and rank labels in 10px Karla #6F6B66. For non-chess data, use the same inset frame for a small table or diagram of the key moment.

Legend: a single row: a 14 x 10 white swatch with a 0.8px ink outline, a 14 x 10 charcoal swatch, a red dot and an orange dot, each followed by a 12px label.

Avoid: color fills other than white and charcoal, gradients, shadows, rounded corners, smoothing the line, and any third accent color.

When you're done, render the chart and check that the fills switch exactly at zero, every marker label is readable against what it sits on, the swing value matches the data, and the inset does not crowd the plot.