Chart Prompts

Restyle my chart in the "Run Quality" 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 quality control screen of a sequencing instrument. Dark, precise and operational: monospaced type, traffic-light bands behind the data and two bright lines that are easy to read across a lab.

Colors (use these exact values):
- Page: #15181B (instrument gray). Plot panel and chip: #1B1F23 with a 1px #2F363D chip border.
- Series: #5BD17A (read one green) and #4EC3E0 (read two cyan).
- Status bands behind the plot: #1D2E24 (good), #2E2B1C (fair), #321E1E (poor), with tags in #5BD17A, #E3C04D and #E0675C.
- Text: #E4E8EB. Secondary text: #8C959E. Gridlines: #2C3238, with the two band boundaries slightly brighter at #3A4148.

Typography (Google Fonts):
- Spline Sans Mono for everything. A status line at the top in 500 11.5px uppercase with 1.4px letter-spacing, preceded by a 4px green dot. Title 600, 26px, -0.6px letter-spacing, stating the finding. Subtitle 13.5px #8C959E.
- Tick labels 11.5px #8C959E ("Q30" style on y); section labels ("READ 1") 600 12px, 1.2px letter-spacing, in the series color; end values 600 12px in the series color; band tags 500 11px.

Layout:
- 56px margins. Status line, title, subtitle, then the plot panel from x 88 to x 842, leaving a narrow right gutter for band tags (a 3 x 18 colored bar plus the word GOOD, FAIR or POOR).
- A summary chip (248 x 88, 6px radius) inside an empty region of the plot: a small uppercase label, the headline percent in 600 34px, per-series percents right-aligned in the series colors, and a 4px progress bar (track #2C3238, fill #5BD17A) along its bottom.
- "Source: ..." at the bottom left in 11px.

Axes and grid:
- Full-width bands behind the data at the domain thresholds (above 30 good, 20 to 30 fair, below 20 poor). Gridlines 1px every 10 units. X ticks 5px long in #8C959E with labels 20px below the axis and an axis title 42px below.
- A 1px #E4E8EB vertical rule at 70% opacity, dashed 3 on 3 off, marking a phase boundary (the read boundary), with section labels on either side at the top.

Marks:
- Line chart: 2.4px smooth lines, one per series, each with a shaded interquartile ribbon in the same color at 16% opacity. The last value of each series labeled just below its end.
- Bar chart: square-cornered columns with 2px gaps, each filled with the series color at 85% opacity, the same status bands behind them, value labels above in 600 12px in the series color, and the boundary rule between groups.

Avoid: glow effects, gradients on marks, a legend box (label sections directly), light backgrounds, and saturated band fills that compete with the lines.

When you're done, render the chart and check that the chip percentages are computed from the data, band edges fall exactly on the thresholds, the lines stay readable over every band, and the chip covers no data.