Chart Prompts

Restyle my chart in the "Cost Sheet" 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 garment costing sheet laid on pattern paper. Practical and crafted: a faint drafting grid, typewriter figures, heathered textile colors, pencilled totals and a yellow tape measure standing in for the x axis.

Colors (use these exact values):
- Page: #FBFAF5 (pattern paper) with a two-level grid: #E7ECF0 0.6px lines every 12px and #D3DCE4 0.8px lines every 60px.
- Series, in stack order: #34435F (heathered navy), #D9CCB1 (oatmeal), #B0532D (rust), #98A04A (olive), #6B6C70 (gray). Segment labels are #FFFFFF on navy, rust and gray and #23262B on oatmeal and olive.
- Ink: #23262B. Secondary text: #6C6E72. Pencil totals: #3A3F4A.
- Tape measure: #E8C547 body with a #B99A2A edge and #23262B ticks; a #8C8F95 metal end tab.

Typography (Google Fonts):
- Karla for words: title 700, 34px, -0.4px letter-spacing, stating the finding; subtitle 15.5px 400 in #6C6E72; legend 13px 500; category names 14.5px 700.
- Courier Prime for figures and codes: header line 12px uppercase with 1px letter-spacing; style codes 11.5px under each category name; in-segment values 11.5px 700; tape numbers 11px 700; totals in 700 italic 18px, #3A3F4A, with a slightly wavy 1.1px pencil underline (75% opacity) drawn as a gentle quadratic path.

Layout:
- 56px side margins. A typewriter header line, then title, subtitle and a one-row legend of 14px squares.
- Category labels in a left column (name, code beneath); bars start at about x 236 and span to x 836 for the maximum. Rows 46px apart, bars 28px tall.
- Footer: "Source: ..." left in Karla 12px and a sheet reference ("SHEET 3 OF 6 REV. B") right in Courier Prime.

Axes and grid:
- No y axis line and no chart gridlines beyond the paper grid.
- The x axis is a tape measure below the last row: a 30px tall yellow strip with a 2px radius, running 14px past the zero point on the left, ticks every half unit (4.5px), whole unit (8px) and every 5 units (13px, 1.3px wide) hanging from the top edge, with numbers under the long ticks and a small unit caption ("USD") to its left.

Marks:
- Bar chart: horizontal stacked bars, square corners, 1px paper-colored seams between segments. Values printed centered in segments at least 38px wide. The total sits 12px past the bar end in the pencil italic with its wavy underline.
- Line chart: 2px lines in the same five colors with 4px square markers, on the same paper grid, with the x axis drawn as the tape measure and each series' final value in the pencil italic at the line end.

Avoid: gradients, shadows, rounded bar ends, a boxed legend, and gridlines that compete with the bars. Keep the paper grid faint.

When you're done, render the chart and check that the segments add up to the pencilled totals, the tape ticks align exactly with the bar scale, no in-segment label overflows its segment, and the paper grid stays behind everything.