Chart Prompts

Restyle my chart in the "Color Block" 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 hard-edged magazine infographic. Flat, saturated blocks of color on white, a black-weight headline and an oversized swatch legend; confident and poster-like, never cute.

Colors (use these exact values, in this order):
- Page: #FFFFFF.
- Poppy red #E63B2E, emerald #0A9B63, marigold #F5A300, ultramarine #2743D1, fuchsia #D1308A, ink black #111111. Assign them to categories in this order and keep the order in stacks and legend identical.
- Text: #111111 for headline, row labels and totals; #5C5C5C for subtitle, axis numbers and source.
- Labels inside blocks are #FFFFFF, except on marigold, where they are #111111 for contrast.

Typography (Google Fonts):
- Rubik throughout. Headline 900, 34px, -0.6px letter-spacing, stating the finding.
- Subtitle 500 17px #5C5C5C. Legend names 500 15px ink. Row labels 700 18px ink, right-aligned. Segment values 500 16px. Row totals 900 18px ink with a unit ("8.0 h"). Axis numbers 500 14px #5C5C5C. Source 400 13px.

Layout:
- 56px left margin. Headline baseline y 74, subtitle y 104.
- Swatch-strip legend along the top at y 128: 30px squares, each followed 8px later by its name, about 26px between entries, all on one line.
- Plot starts at x 196; row labels right-aligned 18px left of it. Rows are 46px tall on a 68px pitch.
- Source bottom left at y 580.

Axes and grid:
- No gridlines and no frame. A thick 6px black baseline at the left edge of the bars, running 12px beyond the first and last rows.
- A plain row of axis numbers under the bars every 2 units, the last one carrying the unit ("12 hours").

Marks:
- Bar chart: horizontal stacked bars, each segment a flat saturated rectangle with square corners, no strokes, separated by a 2px white gap (keeps red and emerald from touching). Segment values centered inside when the segment is big enough (here over 0.5 units); otherwise leave it unlabeled and say so in the source line. The row total sits 12px after the end of the stack.
- Line chart: 5px lines in the same palette order with square caps and miter joins, a 12px square marker at the last point, and the series name as a colored block label (white text on the series color, 6px padding) at the line end. Same swatch legend, 6px black baseline along the bottom instead of the left.

Avoid: gradients, shadows, rounded corners, outlines around blocks, pastel tints, gridlines and a boxed legend.

When you're done, render the chart and check that every block label has enough contrast (black on marigold), the legend order matches the stack order, the totals add up, and nothing touches the right edge.