Chart Prompts

Restyle my chart in the "Cobalt Tile" 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 hand-painted glazed tile panel from a coastal ceramics workshop. Crisp white glaze, cobalt and cerulean painting, one warm ochre tile as the only accent, and a patterned tile border around the whole piece.

Colors (use these exact values):
- Glazed ground: #F7F8F5 with a soft white radial sheen (white at 90% near the top left fading to 0 at 60% of the radius).
- Tile ground: #1E4D9E (cobalt). Tile painting: #5C9BD6 (cerulean). Grout: #FFFFFF.
- Accent: #D49A2A (ochre), used only for the crowning tile of the top value and its label; its painted pattern uses #F2D08A.
- Title and value ink: #152C57. Secondary text: #5E6F8C.

Typography (Google Fonts):
- Marcellus 400 for the title: 38px #152C57, sentence case, stating the finding.
- Mulish for everything else: eyebrow 12px 700 uppercase, 2.8px letter-spacing, #5C9BD6; subtitle 16px #5E6F8C with measure, unit, period and total; value labels 15px 700 #152C57 (the top value 18px 800 in #D49A2A); category labels 14px 500 #5E6F8C (the top category 700 #152C57); scale note 16px 700 plus 13px; source 12px.

Layout:
- A border of small square tiles runs around the entire canvas: 18px tiles on a 20px pitch with 2px white grout, alternating cobalt and cerulean grounds, each with a white diamond (32% of the tile) and a 12% radius dot in the opposite blue. A 1.2px cobalt rule sits just inside the border.
- Header inside the border at 64px from the left: eyebrow at y 76, title at y 118, subtitle at y 148.
- Scale note at the top right: one sample tile (30px) followed by "= 10 kilns" (or the equivalent unit) and a smaller line "partial tiles cut to scale".
- Footer at y 552: source on the left, a note explaining the ochre tile on the right.

Axes and grid:
- No gridlines and no y-axis: the tiles are the scale, and every column carries its value on top.
- A 2px cobalt baseline 3px below the bottom tiles. Category labels centered 26px below the baseline.

Marks:
- Bar chart: each bar is a column of 34px square tiles (radius 1.5px) with 3px white grout between them; one tile equals a round unit (for example 10). Each tile is painted: cobalt ground, cerulean quarter circles (radius 30% of the tile) in all four corners, a 0.9px cerulean cross through the center at 80% opacity, a white center diamond (20% of the tile) with a 6% cobalt dot. The fractional remainder is shown by a final tile clipped cleanly from the top so only its lower part remains, with a 1.2px dark edge (#0F2F66) on the cut. The top value's crowning tile is ochre instead of cobalt. A subtle white gloss (32% to 0 diagonal gradient) runs over each column. Value label 10px above each column.
- Line chart: draw the line as a row of tiles: a 3px cobalt line with each data point marked by a 22px painted tile (same motif) centered on the point, the highest point's tile in ochre with its value in 18px 800 ochre. A light cerulean area fill (12% opacity) under the line, and 1px dashed cerulean gridlines at the tile unit.

Avoid: gradients on the tiles themselves beyond the gloss, drop shadows, more than one ochre element in the data, rounded pill bars, and thin gray gridlines.

When you're done, render the chart and check that partial tiles are cut at the correct fraction, grout lines are clean white, only one tile is ochre, the border tiles meet evenly at the corners and no label touches the border.