Chart Prompts

Restyle my chart in the "Ticket Backlog" 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 clean helpdesk product screen. The chart sits under an app-style tab strip like a queue view in support software: white, crisp, friendly, with one warm alarm color for the backlog and one calm color for throughput.

Colors (use these exact values):
- Background: #FFFFFF everywhere.
- Primary ink: #111827. Secondary text and axis labels: #6B7280. Gridlines and dividers: #E5E7EB; the zero baseline #9CA3AF.
- First series (the problem metric, e.g. open backlog): #DC2626 warm red. Its badge background #FEE2E2.
- Second series (the throughput metric, e.g. solved per day): #2563EB calm blue. Its badge background #DBEAFE.
- Highlighted period band (holiday, freeze, maintenance): #FEF3C7 light yellow, with its label in #92400E.
- Annotation speech bubble: #1F2937 fill, white title text, #D1D5DB second line.

Typography (Google Fonts):
- Rubik for the app name (600, 15px), tab labels (15px; 600 #111827 for the active tab, 500 #6B7280 otherwise), the title (600, 25px, #111827, sentence case, stating the finding) and the bubble title (600, 13.5px).
- Work Sans for everything else: breadcrumb 14px #6B7280, badge counts 600 13px in the series color, subtitle 15px #6B7280, legend 500 13px, tick labels 12.5px #6B7280, bubble detail 12.5px, source and footer notes 12px.

Layout:
- 40px side margins. Top row: a 22px dark rounded square app glyph (rx 6, three short white lines), the app name, then a breadcrumb like "/  Views  /  All unsolved tickets".
- Tab strip at y about 90: three tabs (e.g. Open, Pending, Solved) each followed by a rounded pill badge (height 22, fully rounded) with its count. The active tab gets a 3px #DC2626 underline sitting on a full-width 1px #E5E7EB divider.
- Title at y about 152, subtitle 26px below it naming measure, unit and period. Legend at the right end of the subtitle line.
- Plot from about y 214 to y 510, full width, y labels right-aligned 12px left of the plot. Footer at y 574: "Source: illustrative data" left, a short live status ("Now: 253 open, 55 solved today") right.

Axes and grid:
- Horizontal 1px #E5E7EB gridlines at round steps, no vertical grid, no axis lines except the #9CA3AF zero line.
- X labels by week ("Week 1" ... centered on each week) with small 6px tick marks at week boundaries.

Marks:
- Line chart: straight-segment lines, 3px #DC2626 for the problem series with a very faint area fill below it (#DC2626 at 6% opacity), 2.25px #2563EB for the throughput series. Round joins. End points get a dot (r 4 to 4.5) in the series color with a 2px white ring.
- Bar chart: slim columns with 4px top radius in #2563EB for throughput; the problem metric as #DC2626 columns or as a #DC2626 line over them. Keep bars at about 60% of the band, same tab strip, band and bubble treatment.
- Highlighted period: a full-height #FEF3C7 band behind the marks with a two-line 12px 600 label in #92400E at its top.

Labels and annotation:
- One speech-bubble callout for the key event: a #1F2937 rounded rectangle (radius 12) with a small triangular tail pointing to the marked point, which gets a 5px dot with a white ring. Two lines: event name and date (Rubik 600 13.5px white), then the consequence (Work Sans 12.5px #D1D5DB). Place it where it covers no data.

Avoid: shadows, gradients, heavy borders, more than two series colors, a boxed legend, dense gridlines, and text that could be mistaken for real product names.

When you're done, render the chart and check that the tab badges' counts match the data (Open equals the last backlog value), the bubble tail points exactly at its data point, the yellow band covers the right days, and nothing in the header collides.