Chart Prompts

Restyle my chart in the "Sleep Latency" 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 friendly clinical report. Soft periwinkle paper, calm indigo bars, and one muted rose that flags the values past a clinical threshold. Rounded, approachable, but precise.

Colors (use these exact values):
- Background: #EEF0FA (pale periwinkle) for the whole canvas.
- Normal-range bars and rug ticks: #5A63B8 (soft indigo).
- Past-threshold bars, rug ticks, threshold line and callout: #C0607E (muted rose).
- Primary ink, the median line and baseline: #262A4D. Secondary text: #6A6F92. Gridlines: #D6DAEE.
- Callout card: #FFFFFF at 80% opacity.

Typography (Google Fonts):
- Mitr throughout. Title 500, 27px, #262A4D, stating the finding with computed numbers. Subtitle 300, 15px, #6A6F92, with measure, bin width and sample size. Axis labels 300, 12px, #6A6F92. Bar value labels 400, 11px, centered 7px above each bar (ink for normal bars, rose for flagged bars). Threshold label 500, 11px uppercase with 1.6px letter-spacing in rose. Median label 500, 12px ink. Callout headline 500, 16px rose; callout body 300, 12.5px ink.

Layout:
- 56px left margin. Title at y 76, subtitle at y 106. Plot from x 88 to 900, y 176 to 462.
- A callout card (262 x 78, radius 8, with a 4px rose accent bar on its left edge) floats in the empty upper right of the plot.
- Below the baseline: the rug (y 468 to 482), x tick labels at y 502, then a row with "Each tick below the axis is one night" on the left and the x-axis title right-aligned. "Source: illustrative data" at the bottom left.

Axes and grid:
- Horizontal gridlines 1px #D6DAEE every 20 units; y labels right-aligned, with the unit word ("Nights") above the top label. No y-axis line.
- A 1.2px #262A4D baseline. X labels every 10 minutes.
- The threshold (30 minutes) is a 1px rose vertical line at 55% opacity rising above the plot, with its uppercase label to its right.
- The median is a 1.5px #262A4D dashed vertical line (5 on, 4 off) with "Median 14.3 min" right-aligned to its left at the top.

Marks:
- Bar chart: a histogram with 3px gaps between bins and 4px rounded top corners (square at the baseline). Bins at or past the threshold are rose, all others indigo. Every non-empty bin carries its count. Under the axis, a rug of one 0.8px vertical tick per observation, 14px tall, at 45% opacity, colored by the same rule.
- Line chart: a 2.5px indigo line with a light indigo area fill (#5A63B8 at 14%); the segment past the threshold switches to rose with a rose fill; the same dashed median/threshold verticals and rug apply.

Avoid: harsh saturated colors, square-topped bars, 3D, thick outlines, a legend (the threshold label and colors explain themselves), and numbers in the title that are not computed from the data.

When you're done, render the chart and check that the title's median and share match the data, the rug ticks line up with the bins above them, and the callout card does not cover any bar or label.