Chart Prompts

Restyle my chart in the "Tatami" 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 guest-house floor plan laid in rush mats. Calm, modular and exact: every bar is built from 2:1 mats with dark cloth borders, on a finely woven straw ground.

Colors (use these exact values):
- Ground: #E7DCBF (woven straw) with a 6 x 4 px pattern: a 1px #D9CCA8 horizontal line at 70% opacity and two short 1 x 2 px #D9CCA8 ticks at 45% opacity, offset like a weave.
- Mat fill, default category: #CDBB86 with a 4 x 3 px rush pattern (1px #B9A66F rows at 55%, 1 x 2 px #DCCB98 ticks at 50%).
- Mat fill, highlighted category: #9AA566 (aged green) with the same pattern in #848F52 and #AEB87C.
- Cloth borders, rules and main text: #28324A (dark indigo). Secondary text: #6B6450.

Typography (Google Fonts):
- Noto Serif JP 600 for the title (29px, three short lines 38px apart, #28324A) and value labels (17px).
- Noto Sans JP for the eyebrow (12px 500 uppercase, 3px letter-spacing, #6B6450), subtitle (14px), key (13px 500), category labels (14px; 700 in indigo for highlighted categories), notes and source (12px).

Layout:
- A left column (x 64 to about 300): a 2px indigo vertical rule at x 64 from y 52 to 280, with the eyebrow, the title, the subtitle and a one-line comparison (12px 500 indigo) set 20px to its right.
- Below it, a unit key headed "KEY" (11px 700, 2.5px letter-spacing): a mat at 80% size labelled "1 mat = 10 <units>", a green mat labelled with its category, and a part mat labelled "Part mat, share of 10".
- The chart fills x 340 to 904 with its baseline at y 498. Source bottom left and a short note bottom right at y 580.

Axes and grid:
- No y axis and no gridlines: the mats are the scale. A 1.2px indigo baseline. Category labels centered 26px below it.
- Bracket the highlighted categories with a 1px indigo bracket 36 to 41px below the baseline and a 10px 700 uppercase label (2px letter-spacing) under it.

Marks:
- Bar chart: a unit bar chart. Each bar is a stack of mats exactly 56 x 28 px (2:1), 4px apart, one mat per ten units. Each mat has 4px indigo cloth borders along its two long edges only (the short ends stay plain), plus a 0.6px indigo stitch line at 25% opacity 0.8px inside each border. For the remainder, draw one part mat: a 1px dashed (3 on, 3 off) indigo outline at 70% opacity of the full mat, filled from the left to the fraction used, borders included. Value label 10px above the stack.
- Line chart: draw the line as a 4px indigo cloth band with a 1.5px #CDBB86 center stripe, and mark each point with a small 16 x 8 px mat (2:1, indigo long-edge borders). Grid the plot with faint 1px #D9CCA8 lines on a 2:1 module so the floor-plan feel survives.

Avoid: rounded corners, gradients, shadows, any proportion other than 2:1 for the mats, and borders on the short ends.

When you're done, render the chart and check that every mat is exactly twice as wide as it is tall, the part mats are proportional to the remainder, and the key explains the unit.