Chart Prompts

Restyle my chart in the "Where You Stand" 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 personalized "where do you fit in" news explainer on a dark screen. Everyone else is a quiet steel-gray crowd; the reader's own position is the only bright thing on the page.

Colors (use these exact values):
- Page: #15171A (charcoal). Gridlines: #262A2F.
- Crowd bars: #56606B (steel). The reader's bin, pointer, kicker and highlighted phrase: #FF8A3D (tangerine).
- Primary text, median and mean lines: #ECEDEE. Secondary text, counts and tick labels: #8E949B.

Typography (Google Fonts):
- Familjen Grotesk for the title (700, 36px, -0.5px letter-spacing), subtitle (15.5px #8E949B, stating measure, bin width and sample size), the pointer's value (700, 15px) and the closing sentence (18px, with the percentile phrase 700 tangerine).
- DM Mono for the kicker (12px 500 uppercase, 2px letter-spacing, tangerine), bin edge labels and axis values (11.5px), counts above bars (10.5px), median and mean labels (11.5px 500 uppercase), the pointer's "YOU ARE HERE" (11px 500, 1px letter-spacing) and the source (11px).

Layout:
- 56px left margin. Kicker at y 54, title at 96, subtitle at 124. Plot from x 96 to 904, y 196 to 480. The closing sentence at y 538 and the source at 574.

Axes and grid:
- Three 1px #262A2F gridlines with count labels right-aligned 10px left of the plot and a unit word ("homes") at the top. A 1px #ECEDEE baseline at 50% opacity with 5px ticks and currency labels at every second bin edge; label the open-ended last bin "$380+" (or equivalent) right-aligned.

Marks:
- Bar chart (histogram): bins touch except for a 1px gap, square corners, steel, with the reader's bin tangerine. Counts centered 7px above each bar in mono, with a 4px page-colored halo (paint-order stroke) so lines never cut through them.
- Median: a 1px solid #ECEDEE line from the baseline to 8px above the plot; mean: a 1.4px dotted line (1.5 on, 3.5 off, round caps). Label the median to the left of its line (end-anchored) and the mean to the right so the two never collide.
- Pointer: a tangerine rounded box (124 x 42, 6px radius) with "YOU ARE HERE" and the reader's value in charcoal, sitting above the nearest taller bar, with a 1.5px tangerine stem and a small triangle ending just above the reader's bin.
- Line chart: draw the distribution as a 2.5px steel step line (or smooth density) with a light steel fill at 25%, and the reader's position as a tangerine vertical line with the same pointer box.

Labels and annotation:
- One plain sentence under the chart: "Your $212 bill is higher than 86% of households in Ostvale, and $70 above the median." Compute the percentile and the difference from the data.

Avoid: any second bright color, gradients, glows, rounded bars, and a legend.

When you're done, render the chart and check that exactly one bin is tangerine, the median and mean labels don't overlap, the pointer box covers no count, and the percentile in the sentence matches the data.