Chart Prompts

Restyle my chart in the "Tail Spend" 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 moody boardroom Pareto analysis. Maroon-black, dusty rose for what matters, the long tail fading into the dark, and one crisp white cumulative curve.

Colors (use these exact values):
- Background: #1C0F12 (deep maroon-black). The tail zone gets a 2.5% white wash.
- Head bars: #BE7C88 (muted rose). Tail bars: #4A3A3E (faded gray-mauve).
- Accent: #FB7185 (rose) for the 120 x 2 px rule under the title, the dashed 80% line and the "80%" pill.
- Cumulative line and its marker: #FFFFFF.
- Title #F6E9EB, secondary text #A8898F, baseline, axis ticks and tail divider #5A3F45, source #7D5F65.

Typography (Google Fonts):
- Bricolage Grotesque for the title (700, 32px, -0.6px letter-spacing, stating the concentration) and the tail annotation (600, 16px).
- Hanken Grotesk for everything else: subtitle 14px #A8898F (measure, unit, total, organization, period); axis labels 11.5px; axis captions ("$K", "CUM.") 10.5px 700 with 1px letter-spacing; "THE TAIL" 11px 700 with 2px letter-spacing; pill text 12.5px 800 in the background color; line label 12.5px 700 white; legend 12px.

Layout:
- 48px margins. Title at y 64, rose rule at y 80, subtitle at y 110.
- Plot from x 88 to 864, y 164 to 510, with a left axis for spend and a right axis for cumulative percent (0 to 100% mapped to the same height).
- Footer at y 572: a two-swatch legend (head, tail) at left and the source at right.

Axes and grid:
- No horizontal gridlines: shared gridlines would make spend values and percentages look like the same thresholds. Draw only the 1px baseline and 5px outward ticks on each side; labels at left in spend units and at right in percent. Rank labels (1, 10, 20...) under the bars and a right-aligned "Supplier rank by spend" caption.

Marks:
- Bar chart: one bar per supplier in descending order, 72% of the slot, 1.5px radius; the head (first 20) in #BE7C88 and the tail in #4A3A3E. A dashed #5A3F45 divider starts the tail zone, with a "THE TAIL" label and a two-line summary (count, amount, share).
- Cumulative share: a 2.2px smooth white line through the bar centers, a 5px white dot where it first reaches 80%, a 1px dashed (4 on 4) rose horizontal line at 80% running only from the dot to the right-hand percent axis (never across the spend side), and a 60 x 22 px rose pill reading "80%" above the dot. Label the line once, in the open space above it.
- Line chart: draw the ranked values as a 2px rose line with the tail segment in gray, keep the white cumulative line, the 80% marker and the tail zone.

Avoid: bright reds, more than one accent, 3D, gradients on bars, and labeling individual bars.

When you're done, render the chart and check that the head count and share in the title are computed from the data, the white dot sits where the cumulative line crosses 80%, and the tail summary adds up with the head to the total.