/* UK trends charts (Nov 2026). Matches the page's ink/paper palette;
   series colours validated for colour-blind separation and 3:1 contrast. */
.trends-section{ padding:28px 24px 8px; }
.trends-section h2{ font-family:'Newsreader', serif; font-size:22px; margin:0 0 6px; }
.trends-section > p{ margin:0 0 16px; color:#3B4A63; font-size:14px; max-width:70ch; }
.trends-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:18px; }
.trend-card{ background:var(--paper-raised); border:1px solid var(--hairline); border-radius:6px; padding:16px 16px 12px; position:relative; min-width:0; }
.trend-card h3{ font-family:'Public Sans', sans-serif; font-size:15px; font-weight:600; margin:0 0 2px; color:var(--ink); }
.trend-card .headline{ font-family:'Newsreader', serif; font-size:17px; margin:0 0 10px; color:var(--ink); }
.trend-card .headline b{ font-weight:600; }
.trend-card svg{ display:block; width:100%; height:auto; overflow:visible; }
.trend-card .axis text{ font-family:'JetBrains Mono', monospace; font-size:10px; fill:#5A6577; }
.trend-card .axis path, .trend-card .axis line{ stroke:var(--hairline); }
.trend-card .grid line{ stroke:#E3E6EA; }
.trend-card .grid path{ display:none; }
.trend-card .note{ font-family:'JetBrains Mono', monospace; font-size:11px; color:#5A6577; margin:8px 0 0; line-height:1.5; }
.trend-legend{ display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--ink); margin:0 0 6px; }
.trend-legend .sw{ display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:5px; vertical-align:-1px; }
.trend-tip{ position:absolute; pointer-events:none; background:var(--ink); color:#fff; font-size:12px; line-height:1.4; padding:6px 9px; border-radius:4px; white-space:nowrap; z-index:5; }
.trend-tip b{ font-weight:600; }
.trend-table{ margin-top:8px; font-size:12px; }
.trend-table summary{ cursor:pointer; font-family:'JetBrains Mono', monospace; font-size:11px; color:#5A6577; }
.trend-table table{ border-collapse:collapse; margin-top:6px; width:100%; }
.trend-table th, .trend-table td{ border-bottom:1px solid #E3E6EA; padding:3px 6px; text-align:right; font-variant-numeric:tabular-nums; }
.trend-table th:first-child, .trend-table td:first-child{ text-align:left; }