Chart Prompts

Restyle my chart in the "Warehouse Mekko" 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 logistics site survey printed on kraft paper. Industrial, sturdy and honest: muted safety colors, outlined blocks like pallet racking and stenciled site codes.

Colors (use these exact values):
- Page: #E2D0AF (kraft) with a very faint fiber texture: fractal noise, baseFrequency 0.9 horizontally and 0.35 vertically, 2 octaves, tinted brown at 9% opacity over the whole canvas.
- Ink and outlines: #2B2118. Secondary text: #6B5A45. Gutters and the light scale segment: #FBF6EC.
- Categories in this order: #3F6A8A (steel blue), #6E7431 (olive), #E6B31E (safety yellow), #9B432F (brick red). Labels on yellow use #2B2118; labels on the other three use #FFFFFF.

Typography (Google Fonts):
- Chivo for the headline (800, 28px, -0.4px letter-spacing, ink, stating the finding), subtitle (400, 15px, #6B5A45) and legend entries (500, 13.5px).
- Chivo Mono for all numbers and small print: block percentages (500, 13px), y ticks (12.5px), scale bar values (11.5px), site names (500, 12px) and sizes (12px), the footer (12px, and an 11.5px uppercase folio with 1.2px letter-spacing).
- Stardos Stencil 700 at 22px with 0.5px letter-spacing for the site codes along the bottom.

Layout:
- 56px side margins. Headline and subtitle at the top, then one row holding the legend on the left (14px squares with a 1px ink outline) and a floor space scale bar on the right.
- Scale bar: a 6px tall bar whose length equals 50,000 m² at the chart's scale, split in half (solid ink, then light with an ink outline), with 10px ticks and labels "0", "25", "50k m²" above it and a muted "SCALE" tag to its left.
- The plot spans about y 168 to 470. Under each column: a 2px ink ground rule, the stenciled code, then the site name and its size on two lines. A dotted footer rule, source left, folio right.

Axes and grid:
- Percentage y ticks (0% to 100% by 25) with 5px tick marks on the left. No gridlines; the block edges do that work.

Marks:
- Bar chart: a marimekko. Column width is proportional to the column total and stacked block height is the category share. Columns sit 4px apart on a light #FBF6EC backing so the gutters read as white; blocks inside a column are separated by 2px. Every block has a 1.2px ink outline and square corners. Put the percentage in the top left corner of each block (8px in, 18px down) when the block is at least 22px tall and 60px wide. Order columns from widest to narrowest.
- Line chart: lines of 2.5px in the category colors with square 8px markers outlined 1.2px in ink, on the same kraft page, with ink-outlined percentage labels at the ends and the stencil font for the category labels on the x axis.

Avoid: gradients, shadows, rounded corners, glossy colors, labels crammed into blocks too small for them, and pure white page backgrounds.

When you're done, render the chart and check that the column widths add up to the plot width minus the gutters, every column sums to 100%, the scale bar length matches 50,000 m², and no site labels collide under narrow columns.