SEO: fix season-record wrapping + trim range strip on mobile (#109)

Two mobile polish issues on the climate pages:

- The season records table's "(Dec–Feb)" span overflowed its narrow first
  column (nowrap) and slid under the tinted value cell. Stack the span under the
  season name on phones, top-align the record cells, and let the first column
  wrap — so the period label sits cleanly in its own column.
- The monthly temperature-range strip stretched edge-to-edge with the values
  floating far to the right. Cap the strip width so bars + values pack into a
  tight group, shrink the value labels to fit (compact "41°–66°", no reserved
  92px column). The overrides now sit after the base range rules so they win.

static/style.css

@@ -1492,10 +1492,18 @@ table.normals-table tbody tr:hover { background: var(--surface-2); }
 /* On phones, tighten the climate tables so wide values (3-digit °F with the °C in
    parens) never collide — the records tables are already 3 columns (date folded
    under each value), and this keeps the city's 4-column normals table roomy too. */
+/* Month/season records tables: value+date (and season name+span) stack within a
+   cell, so top-align keeps the two lines tidy instead of vertically centred. */
+table.records-table td { vertical-align: top; }
+table.records-table td:first-child { white-space: normal; }
+
 @media (max-width: 560px) {
   table.normals-table { font-size: 13px; }
   table.normals-table th, table.normals-table td { padding: 7px 8px; }
   .rec-on { font-size: 10.5px; }
+  /* Stack the "(Dec–Feb)" span under the season name so it can't overflow the
+     narrow first column and slide under the tinted value cell. */
+  .season-span { display: block; }
 }
 
 .climate-records ul { margin: 8px 0; padding-left: 20px; }
@@ -1538,6 +1546,15 @@ td.rec-date { color: var(--muted); font-size: 13px; }
 }
 .range-vals { font-size: 13px; color: var(--text); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
 .range-note { font-size: 13px; margin-top: 6px; }
+/* Phone: cap the strip so bars + values pack into a tight group on the left
+   instead of stretching edge-to-edge, and shrink the values to fit (no reserved
+   92px column). Placed after the base rules above so it actually wins. */
+@media (max-width: 560px) {
+  .range-strip { max-width: 300px; }
+  .range-row { grid-template-columns: 26px 1fr auto; gap: 8px; }
+  .range-month { font-size: 12px; }
+  .range-vals { font-size: 12px; }
+}
 .climate-foot { font-size: 14px; margin-top: 28px; border-top: 1px solid var(--border); padding-top: 16px; }
 .city-blurb { font-size: 15px; margin: 4px 0 14px; }
 .blurb-src { color: var(--muted); text-decoration: none; font-size: 13px; white-space: nowrap; }