Stats heatmap: empty hours same height; cname_chain only for long chains

The "Busiest times" grid's hours without data used the class "empty",
which picked up the padding of empty messages. One CNAME to another no
longer warns; three or more get an info note showing the chain.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

internal/web/static/assets/charts.js

@@ -283,7 +283,7 @@ export function heatmap(hm, unit) {
       const n = hm.samples[d][hr];
       const text = v < 0 ? day + " " + pad(hr) + ":00 – no data" :
         day + " " + pad(hr) + ":00 – " + Math.round(v).toLocaleString() + " " + unit + " per hour (average of " + n + (n === 1 ? " hour)" : " hours)");
-      const cell = h("div", { class: "hm-cell " + (v < 0 ? "empty" : "heat-" + level(v)), tabindex: "-1", "aria-label": text });
+      const cell = h("div", { class: "hm-cell " + (v < 0 ? "hm-empty" : "heat-" + level(v)), tabindex: "-1", "aria-label": text });
       const showTip = () => {
         tip.textContent = text;
         tip.hidden = false;
@@ -313,7 +313,7 @@ export function heatmap(hm, unit) {
     h("span", { class: "muted small" }, "0"),
     Array.from({ length: steps }, (_, i) => h("span", { class: "hm-swatch heat-" + i })),
     h("span", { class: "muted small" }, compact(peak) + " " + unit + "/hour"),
-    h("span", { class: "hm-swatch empty" }), h("span", { class: "muted small" }, "no data"));
+    h("span", { class: "hm-swatch hm-empty" }), h("span", { class: "muted small" }, "no data"));
   return h("div", { class: "heatmap-wrap" }, grid, tip, scale);
 }
 

internal/web/static/assets/style.css

@@ -398,7 +398,7 @@ td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
 .hm-row { display: flex; align-items: center; }
 .hm-cell { height: 22px; border-radius: 3px; }
 .hm-cell:hover, .hm-cell:focus { outline: 2px solid var(--text); outline-offset: -1px; }
-.hm-cell.empty, .hm-swatch.empty { background: transparent; box-shadow: inset 0 0 0 1px var(--chart-grid); }
+.hm-empty { background: transparent; box-shadow: inset 0 0 0 1px var(--chart-grid); }
 .heat-0 { background: var(--heat-0); } .heat-1 { background: var(--heat-1); } .heat-2 { background: var(--heat-2); }
 .heat-3 { background: var(--heat-3); } .heat-4 { background: var(--heat-4); } .heat-5 { background: var(--heat-5); }
 .heat-6 { background: var(--heat-6); }