Chart Prompts

Restyle my chart in the "Food Cost" 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 restaurant back-office report printed for the Monday numbers meeting. Pale linen paper, slab-serif headlines, clear status colors against a target. Businesslike and warm.

Colors (use these exact values):
- Page: #F5F1EA (pale linen).
- Under or at target: #4F7D3A (herb green). Over target: #C8412D (tomato red).
- Primary ink, the target line and menu-change markers: #1B1A17. Secondary text: #6F685C. Hairline rules and gridlines: #DDD5C7.

Typography (Google Fonts):
- Arvo 700 for the title (25px, #1B1A17, stating the finding) and the two big header numbers (42px).
- Karla for everything else: eyebrow 11px 700 uppercase with 2px letter-spacing in #6F685C after a 28 x 4 px tomato bar; subtitle 15px; header labels 11px 700 uppercase with 1.8px letter-spacing; legend 13px 500; axis labels 12px; over-target value labels 11.5px 700 in tomato; source 12px; a 12px italic method note on the right of the footer.

Layout:
- 56px side margins. Eyebrow, title and subtitle at top, then a full-width 1px #DDD5C7 rule.
- A two-number header row: "THEORETICAL" with its value in #1B1A17 and, after a 1px vertical rule, "ACTUAL" with its value in tomato plus a small "variance" label and a signed "+1.1 pts" in 16px 700 tomato. A stacked legend (12px squares and a triangle) sits at the right of this row. Another rule closes the row.
- The chart fills the lower half; a footer rule sits near the bottom with the source on the left.

Axes and grid:
- Two or three light 1px #DDD5C7 gridlines labeled on the left in #6F685C; the target value label is 700 in #1B1A17.
- A 1.2px #1B1A17 baseline. Period labels 12px 500 every second period, about 42px below the baseline, with a small uppercase "WEEK" axis label at the left of that row.
- The target is a thin 1.2px solid #1B1A17 line across the full plot with "TARGET 30%" (11px 700, 1.6px letter-spacing) right-aligned just above it.

Marks:
- Bar chart: square-cornered bars about 60% of the band (20px wide at 26 bars), herb green when at or under target and tomato red when over. Only over-target bars carry a value label, 7px above the bar. Periods with a menu change get a small solid #1B1A17 triangle (12px wide, 10px tall) just under the baseline.
- Line chart: a 2.5px #1B1A17 line with square-ish joins; each point is a 5px dot colored green or tomato by status, over-target points labeled in tomato; the green area below the target line is tinted #4F7D3A at 10% and the area above in #C8412D at 10%. Menu-change triangles sit under the axis the same way.

Avoid: gradients, rounded bar corners, shadows, 3D, a boxed legend, and labeling every bar.

When you're done, render the chart and check that bar colors switch exactly at the target, the average and variance in the header are arithmetically right, every menu-change week has a triangle, and no value label touches the target line.