Chart Prompts

Restyle my chart in the "Ratings Spread" 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: an app-store review summary, warm and trustworthy. A white review card with one heavy score on the left, and tidy side-by-side panels of star bars on the right.

Colors (use these exact values):
- Page background: #FFFBEB (pale butter). Cards #FFFFFF with a warm two-layer shadow (0 1px 1px and 0 10px 14px of #78350F at 6% and 7%); an older or secondary panel is #FFFFFF at 60% with a 1px #EDE8DA border and no shadow.
- Current bars and stars: #F59E0B (amber). Previous or comparison bars and stars: #FCD68A (pale amber).
- Tracks, empty stars and dividers: #EDE8DA. Emphasis text #B45309.
- Ink #292524 for titles and counts; secondary #78716C; captions #A8A29E.

Typography (Google Fonts):
- Lexend for the title (600, 24px, -0.3px letter-spacing, stating the finding), panel headers (600, 17px) and the hero score (800, 96px, -4px letter-spacing).
- Mulish for everything else, tabular figures: eyebrow 11px 800 uppercase with 1.6px letter-spacing in #B45309; subtitle 14.5px; star-level numerals 15px 800; counts 14px 800; percentages 11.5px 600 #A8A29E; notes 12.5 to 13px; source 12px.

Layout:
- 40px margins. Title at y 62, subtitle at y 90.
- Left review card (236 x 408, 20px radius): eyebrow, hero average score, "out of 5", a row of five 22px vector stars filled to the exact average, the rating count, a hairline, a delta pill (amber 16% fill, #B45309 text) with the comparison, and one supporting stat.
- To the right, one panel per group (296px wide, 16px apart, same height), each with its header, a date-range and average line, the bars, a divider and a total.
- Mark the current panel with a small #292524 "CURRENT" pill.

Axes and grid:
- No axes or gridlines. Each bar sits on a full-width track that represents 100%.

Marks:
- Bar chart: horizontal bars 18px tall, fully rounded (9px radius), on #EDE8DA tracks of the same shape, one row per category (5 down to 1 stars), 60px row pitch. Bars have a minimum length equal to their height so tiny values still read. Left of each track: the level number and a small star in the panel's color. Right-aligned after the track: the count in 14px 800 ink with its percentage beneath.
- Line chart: a 3px amber line with 6px white-ringed amber dots over faint #EDE8DA gridlines, the comparison series in pale amber, placed inside the same white card layout with the hero number on the left.

Avoid: emoji stars, gradients on bars, square bar ends, vertical axes, and more than the two ambers.

When you're done, render the chart and check that averages and shares are computed from the counts, the hero star row matches the score, and both panels use the same bar scale.