Chart Prompts

Restyle my chart in the "Win Probability" 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 live game tracker in a sports app at night. Dark navy, a single glowing line that changes color as the game swings, and a play-by-play rail that explains every jump.

Colors (use these exact values):
- Background #0A1628 navy. Primary text #EAF1FB; secondary text #7F90AD; strong labels #B8C4D8; gridlines #1A2A45; the 50% midline #3A4E70.
- Cyan #22D3EE whenever the value is above the midline (the home side favored); orange #FB923C below it. Every marker, value and label takes the color of the side it is on.

Typography (Google Fonts):
- Chakra Petch for all numbers and technical labels: eyebrow 13px 600 uppercase with 2px letter-spacing in cyan; title 30px 700 stating the finding with a number; axis labels 12px 500; period labels 13px 600; zone labels 11px 600 uppercase with 1.6px letter-spacing; marker numbers 12px 700; rail times 13px 600; rail percentages 18px 700 in the side's color.
- Inter Tight 400 for the subtitle (15px, #7F90AD, naming the measure and the final result), play descriptions (13px #EAF1FB) and the footer (12px).

Layout:
- 48px margins. Eyebrow y 56, title y 96, subtitle y 124.
- Plot from x 88 to 600 and y 180 to 508. A play-by-play rail from x 640 to 912, separated by a 1px #1A2A45 vertical rule: "KEY PLAYS" header, then entries 54px apart, each a small diamond with its number, the game clock, the value after the play right-aligned, and a one-line description below.
- Footer at y 574: source left, a note explaining the percentages right.

Axes and grid:
- Dotted 1px #1A2A45 horizontal gridlines at 0, 25, 75 and 100 and a solid 1.5px #3A4E70 midline at 50. Label the y axis symmetrically (100%, 75%, 50%, 75%, 100%) so each half reads as that side's chance. "TIDEHAWKS FAVORED" style zone labels just inside the top and bottom of the plot in cyan and orange.
- Solid 1px #1A2A45 verticals at period boundaries, with period names (Q1 to Q4) centered under each period.

Marks:
- Line chart: one 2.5px line with straight segments and round joins, drawn twice and clipped at the midline so it is cyan above and orange below. A matching fill between the line and the midline at 16% opacity in the same two colors. A soft glow on the line (Gaussian blur 3.5 merged under the stroke, filter region covering the full canvas). Key moments get 22 x 22 diamonds (fill #0A1628, 1.8px stroke in the side color, white number) set 22px off the line on its outer side on a 1px leader; a marker that would leave the plot shifts 24px to the left instead. A r 4.5 dot and "FINAL" label at the end.
- Bar chart: one bar per period diverging from the 50% midline, cyan up and orange down, 60% of the band wide with 3px rounded outer ends and the 16% fill replaced by solid color; the same diamonds and rail explain the biggest swings.

Avoid: two separate lines for the two sides, smoothing that hides jumps (scoring plays must be vertical steps), rainbow gradients, gridlines brighter than #1A2A45 and any third accent color.

When you're done, render the chart and check that the color switches exactly at the midline, the numbered diamonds match the rail entries and never cover the line's final point, the title's number is the actual minimum or maximum in the data, and the glow is not clipped.