Chart Prompts

Restyle my chart in the "Watch Time" 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 audience retention panel of a video platform, drawn like a player. Deep charcoal, one hot red-orange series with a soft glow, and a scrubber with chapter ticks under the chart.

Colors (use these exact values):
- Page: #121214 (charcoal).
- Series: #F97316 (red-orange) line, glow and played portion of the scrubber; area fill a vertical gradient of the same orange from 28% opacity to 0.
- Primary text, playhead and chapter ticks: #F4F4F5. Secondary text and leader lines: #8E8E96. Gridlines: #26262B. Unplayed scrubber track: #3A3A40.

Typography (Google Fonts):
- Urbanist throughout. Eyebrow 12px 700 uppercase, 2.4px letter-spacing, orange. Title 32px 700 white, stating the finding. Subtitle 15px 400 gray with measure and unit.
- A headline stat at top right: 30px 700 white (for example average view duration "24:04") with a 12.5px gray caption.
- Axis labels 12.5px 500 gray. Callouts 13px 700 white with a 12.5px gray second line. Chapter names 12px 600 (the current chapter white, others gray). Timecode 13px 600 white.

Layout:
- 48px side margins for the header, plot from x 88 to 912 and y 168 to 448.
- Scrubber at y 492 spanning exactly the plot's x range, chapter names 24px below it, then a transport row at y 544 (play triangle, "24:36 / 42:00" timecode, and "1x · CC" plus a small screen icon on the right). Source and a note at y 584.

Axes and grid:
- Percentage gridlines at 0, 25, 50, 75, 100% in 1px #26262B with labels at the left. No axis lines; the scrubber is the time axis.

Marks:
- Line chart: a smooth 3.6px orange line with round joins, a copy underneath at 6px, 45% opacity and a 5px Gaussian blur for glow, and the gradient area below. The final point as a 5px orange dot with "39% at the end" in orange 13px 700 below it.
- Callouts for spikes: a 4.5px ring (charcoal fill, 2px white stroke) on the peak, a 1px gray leader going straight up then 40px sideways, and a two-line label (what happened, then the chapter content).
- Scrubber: a 4px fully rounded track, orange up to the playhead and #3A3A40 after, a 7px white playhead knob, and chapter boundaries as 1.5 x 14px white ticks with a 3px charcoal knockout behind each.
- Bar chart: slim 3px-radius orange bars per time bucket with 2px gaps, the same glow on the tallest bars only, callouts on the spikes, and the same scrubber and transport row underneath.

Avoid: light backgrounds, a second data hue, heavy gridlines, legends, and labels sitting on the line.

When you're done, render the chart and check that the scrubber ticks align with the chart's time axis, the glow is not clipped, callouts do not overlap each other or the line, and the headline stat is computed from the data.