fix(web): wrap long record values in diff and zone view (no horizontal overflow)

RecordRow now splits into a top line (badge/name/read-only, unaffected
by value length) and a plain block-level values line below it, so a
~400-char unbreakable DKIM key wraps via break-all instead of stretching
the flex row and forcing page-wide horizontal scroll. Zone records table
gets break-all on the values cell too.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BwxdSt4reTm7Dj1oxRvpP3

web/src/components/DiffView.test.tsx

@@ -27,6 +27,30 @@ test("marks read-only records", () => {
   expect(screen.getByText(/NS/)).toBeInTheDocument()
 })
 
+test("renders a very long unbreakable value (DKIM key) without crashing", () => {
+  // Real DKIM records ship a ~400-char unbroken p= blob. This must not
+  // throw and the value must land in the DOM (wrapping itself is a CSS
+  // concern verified manually, not via jsdom layout).
+  const longValue = "v=DKIM1; k=rsa; p=" + "A".repeat(400)
+  const csWithDkim: ChangesetResponse = {
+    updates: [
+      {
+        kind: "update",
+        type: "TXT",
+        name: "default._domainkey.example.com.",
+        desired: [longValue],
+        actual: [],
+        readOnly: false,
+      },
+    ],
+    prunes: [],
+    readOnly: [],
+    inSyncCount: 0,
+  }
+  render(<DiffView changeset={csWithDkim} />)
+  expect(screen.getByText(new RegExp(longValue))).toBeInTheDocument()
+})
+
 test("does not crash when changeset fields are null", () => {
   // An empty changeset from an older/edge backend can arrive with null slices
   // instead of []. DiffView must normalise them, not blow up on .length/.map.