Chart Prompts

Restyle my chart in the "Timeline Ribbon" 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 museum or archive timeline printed on a wall panel. Calm mint paper, rounded ribbons for spans of time, chapter headings across the top and a little italic voice for the notes.

Colors (use these exact values):
- Page: #E9F4EE (pale mint).
- Ribbons alternate #1F4D3A (deep forest green) and #9DB8A5 (muted sage) row by row; the featured span is #C8643B (warm terracotta), which is also used for overlap ticks and the featured value label.
- Era band fill: #D5EADF; a gap or closure period uses 45 degree #9DB8A5 hatching (1.4px lines, 6px apart) on the page color. Year gridlines are 1px #D5EADF.
- Ink (title, labels on sage): #1B2B24. Secondary text: #5E7268. Labels on forest or terracotta: #FFFFFF.

Typography (Google Fonts):
- Space Grotesk for the title (25px 700, -0.4px letter-spacing, stating the finding), deck (15px 400 #5E7268), ribbon labels (12.5px 600, the featured one 700), duration labels (12px 500 #5E7268; featured 700 terracotta), era headings (11px 700 uppercase, 1.8px letter-spacing, forest), year labels (13px 500) and footer (12px).
- Fraunces italic 400 for the short era notes (15px #5E7268), the "Closed" label (13px) and the featured note ("a record", 14px terracotta).

Layout:
- 56px side margins. Title and deck at the top.
- Directly below, the era band: a 40px tall strip across the full time axis split into chapters, each with an uppercase heading followed by an italic note ("CHAPTER ONE the old mill building").
- Then one row per item, 38px apart, ribbons 26px tall, in chronological order so the chart reads as a staircase.
- The time axis sits under the last row; the footer holds a key for the overlap tick on the left and the source on the right.

Axes and grid:
- A 1.2px forest axis line with a 7px tick at every year start and the year label centered in the middle of its year, 24px below the axis.
- Faint 1px #D5EADF verticals at each year start, running from the first row to the axis.
- Key dates get dotted forest guides (1.4px, round caps, dash 0.1 on 5 off) from the era band down to the axis.

Marks:
- Bar chart: floating range bars (ribbons) from exact start to exact end, fully rounded ends (radius = half the height), the label written inside the ribbon 12px from its left end, and the duration ("19 mo") 8px past the right end (or 8px before the left end when there is no room). The single featured span is terracotta and adds the italic note after its duration.
- Line chart: draw each series as a 3px forest line with round caps; highlight one series in terracotta; shade each era of the x axis with the era band on top and draw the dotted key-date guides through the plot. Label lines inside a small rounded pill of their own color at the line's end.
- Overlap ticks: where a ribbon opens before the one above it has closed, place a small terracotta downward triangle (8px wide, 6px tall) in the gap above the ribbon at its start date.

Avoid: square ribbon ends, labels that spill out of their ribbon, legends, heavy gridlines, more than one terracotta span, and drop shadows.

When you're done, render the chart and check that every label fits inside its ribbon, the durations are computed from the dates, overlap ticks sit only where spans really overlap, and the era band lines up with the axis.