Chart Prompts

Restyle my chart in the "Suburb Ladder" 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 rankings page of a glossy property magazine. Oxblood black, champagne bars, ivory names and small jewel-like change chips.

Colors (use these exact values):
- Background: #1C1012 (oxblood black). Bars: a left-to-right gradient from #E9D7B4 to #C9A96E. Names, headline and reference line: #F3EBDD (ivory). Secondary text: #A8978E. Axis and footer rules: #3A2A2C. The eyebrow uses #C9A96E.
- Change chips: #7BC47F for gains and #E0605E for losses, each with background-colored text and an up or down triangle so direction never relies on color alone.

Typography (Google Fonts):
- Playfair Display 700, 32px, ivory for the headline stating the finding; Playfair Display italic 14px ivory for the reference line label ("Citywide median $1,020k").
- Outfit for everything else: eyebrow 12px 500 uppercase with 2.6px letter-spacing; subtitle 15px 300 #A8978E; rank numbers 12px #A8978E as "01"; names 15px 500 ivory; in-bar values 13px 600 in the background color; chips 12px 600; axis labels 12px; source 12px 300.

Layout:
- 56px margins. Rank numbers at x 56 and names left-aligned at x 84; bars start at x 228 and the value axis runs to x 820, leaving room for chips. Rows every 36px from y 168, bars 22px tall.
- A footer rule with the source at left and a chip explanation at right.

Axes and grid:
- No gridlines. A 1px #3A2A2C axis under the last row with value labels ("$1.5m"). One thin 1px ivory vertical reference line at the overall median, drawn behind the bars (a faint 1px background-colored cut where it passes through a bar), labeled in italic at its top.

Marks:
- Bar chart: ranked horizontal bars sorted descending, square at the base and 3px rounded at the tip, champagne gradient, value right-aligned 8px inside the tip. A 62 x 20 px fully rounded chip starts 8px after each bar, with a 3px background-colored halo so the reference line never runs through it.
- Line chart: one 2px champagne (#C9A96E) line per ranked item as a slope or small-multiple row, ranked labels at left, the latest value ending in the same green or red chip, and the median as a thin ivory dashed line.

Avoid: multicolored bars, gridlines, drop shadows, and green/red chips without a sign and triangle.

When you're done, render the chart and check that the ranking is strictly descending, the headline ratio to the median is arithmetically right, and no chip or value label is crossed by the reference line.