Compare views rebuilt: from the zone's view, in sections, one line per record

The Compare views tab and jarl zone diff compare a zone with the same zone in other views from the view you're on: a summary per view, what is answered differently (Use this everywhere), the names only some views have (Add to VIEW), and how many are the same. One name can be compared (jarl zone diff ZONE NAME [TYPE], a Compare button per record). The CLI prints one line per record, cut to the terminal (--wide shows it whole); the web UI cuts long values with the whole one on hover. GET /zones/{zone}/compare returns these sections, with ?with, ?name and ?type.

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

internal/web/static/assets/style.css

@@ -564,8 +564,20 @@ ul.probes > li { padding: 6px 0; border-bottom: 1px solid var(--border); }
 ul.probes > li .msg { margin: 6px 0 0; }
 
 /* Comparing a zone across views. */
-table.compare td.compare-cell { vertical-align: top; }
+table.compare td { vertical-align: top; }
+/* The same name and type columns in every section, so they line up. */
+table.compare { table-layout: auto; width: 100%; }
+table.compare tr > :nth-child(1) { width: 18ch; }
+table.compare tr > :nth-child(2) { width: 8ch; }
 table.compare td.compare-cell button { margin-top: 4px; }
+/* One line per record: a long TXT record is cut, with the whole of it on hover. */
+table.compare .oneline { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 46ch; }
+.compare-actions { margin-top: 4px; }
+.compare-controls { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 12px; }
+.compare-controls label { color: var(--muted); }
+ul.compare-summary { margin: 0 0 12px; padding-left: 18px; }
+details.compare-only { margin: 12px 0; }
+details.compare-only summary { cursor: pointer; padding: 4px 0; }
 table.compare tr.muted td { color: var(--muted); }
 
 /* Text that wraps anywhere, e.g. long statements in the Added by Jarl table. */