Chart Prompts

Restyle my chart in the "Time Allocation" 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 allocation report a telescope's time committee publishes each semester. Measured, orderly and data dense: a restrained five-color palette, numbers printed inside every segment and a side column for the one extra metric.

Colors (use these exact values):
- Page: #FFFFFF. Primary text: #16213A. Secondary text: #667085. Rules and gridlines: #E3E7ED.
- Categories in this fixed order: #1B2F5B (navy), #3D8FD6 (cerulean), #137A6C (teal), #E4A33A (amber), #A2A9B4 (gray, for "other").
- Segment labels: #FFFFFF on navy, cerulean and teal; #1B2F5B on amber and gray (white fails contrast there).

Typography (Google Fonts):
- Geist for words: eyebrow 600 11.5px uppercase with 1.8px letter-spacing in #667085; title 700 30px with -0.6px letter-spacing, stating the finding with numbers computed from the data; subtitle 15px #667085; legend 500 13px; row labels 700 16px.
- Geist Mono for numbers: segment values 500 12px, percent scale 11px, row totals 11.5px #667085.
- The side metric value in Geist 700 19px (for example "4.6×").

Layout:
- 56px margins. Eyebrow at y 50, title at y 88, subtitle at y 116, a one-line legend of 12px rounded (2px) squares at y 140.
- Row labels in a left column from x 56 (name, with the row total in mono underneath); bars from x 160 to 772; the side metric column from x 806.
- Bars 40px tall with 16px gaps. A thin footer rule 22px under the last bar, the source at the bottom left and a context tag at the bottom right in 12px #667085.

Axes and grid:
- A percent scale above the bars (0%, 25%, 50%, 75%, 100%) in mono 11px, each with a 1px #E3E7ED vertical line running behind all bars.
- No other axes; the side column has an uppercase header ("OVERSUB.") in 600 10.5px with 1.2px letter-spacing.

Marks:
- Bar chart: 100% stacked horizontal bars, square corners, with a 2px white gap between segments. Each segment carries its raw value 8px from its left edge. Trace the first category's boundary from bar to bar with a 1.2px #1B2F5B connector dashed 3 on 3, so its growth reads at a glance. The side column shows the metric value with a 4px rounded track underneath whose length is proportional to it (22px per unit), navy at 35% opacity and full navy for the latest row.
- Line chart: one 2.5px line per category in the same five colors, with r 3.5 dots, values labeled at the last point in the category color and a direct label at the right end; the lead category drawn at 3px. Same percent gridlines, horizontal.

Avoid: more than five colors, gradients, shadows, rounded bar ends, 3D, percent labels crowding small segments (print the raw value only), and white text on the amber or gray segments.

When you're done, render the chart and check that every segment label fits inside its segment, each row sums to its printed total, the connector meets the first boundary of each bar, and the title's percentages match the data.