docs(stammbaum): document gutter + persons.generation column (#689)

db-orm.puml: persons gains a generation : SMALLINT attribute mirroring
the V70 column. No FK change, so db-relationships.puml is unaffected.

stammbaum-tree-spec.html:
- impl-ref table: replace "Gen label" with "Gutter label" + new
  "Gutter stripe underlay" rows describing the role="text" wrapper,
  un-shifted source-truth value, and below-md hidden state.
- light + dark colour-table rows updated to "Gutter label" /
  "Gutter stripe" with the new var(--c-ink-2) / var(--c-gutter-stripe)
  swatches.
- "Generationen ▾" filter chip mocks removed from desktop and tablet
  layout sections (the filter UI was de-scoped from this PR).

Inline visual mockup SVGs that still show pre-gutter labelling are
out of scope per the issue body — the impl-ref table is the
authoritative source for this PR.

Refs #689

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

docs/specs/stammbaum-tree-spec.html

@@ -244,8 +244,12 @@ body{font-family:'Montserrat',system-ui,sans-serif;background:#ECEAE4;color:#1A1
         <td><span class="swatch" style="background:rgba(255,255,255,.6);border:1px solid #ccc"></span>rgba(255,255,255,.6) — decorative, aria-hidden years</td>
       </tr>
       <tr>
-        <td>Gen label</td>
-        <td><span class="swatch" style="background:#6b7280"></span>#6b7280 — 8 px, tracking 2 px, aria-hidden</td>
+        <td>Gutter label</td>
+        <td><span class="swatch" style="background:#4b5563"></span>#4b5563 (var(--c-ink-2)) — 12 px, tracking 0.08 em, font-weight 700, screen-reader-labelled</td>
+      </tr>
+      <tr>
+        <td>Gutter stripe</td>
+        <td><span class="swatch" style="background:rgba(161,220,216,.08);border:1px solid #ccc"></span>rgba(161,220,216,.08) — decorative full-row underlay alternating with transparent</td>
       </tr>
       <tr>
         <td>Panel surface</td>
@@ -302,8 +306,12 @@ body{font-family:'Montserrat',system-ui,sans-serif;background:#ECEAE4;color:#1A1
         <td><span class="swatch" style="background:#8b97a5;border:1px solid #444"></span>#8b97a5<span class="pass" style="background:rgba(209,250,229,.15);color:#6EE7B7">7.1:1 AAA ✓</span></td>
       </tr>
       <tr>
-        <td>Gen label</td>
-        <td><span class="swatch" style="background:#4e6070;border:1px solid #333"></span>#4e6070 — aria-hidden</td>
+        <td>Gutter label</td>
+        <td><span class="swatch" style="background:#9ca3af;border:1px solid #333"></span>#9ca3af (var(--c-ink-2)) — 12 px, tracking 0.08 em, font-weight 700, screen-reader-labelled</td>
+      </tr>
+      <tr>
+        <td>Gutter stripe</td>
+        <td><span class="swatch" style="background:rgba(161,220,216,.14);border:1px solid #333"></span>rgba(161,220,216,.14) — decorative full-row underlay alternating with transparent</td>
       </tr>
       <tr>
         <td>Panel surface</td>
@@ -355,7 +363,6 @@ body{font-family:'Montserrat',system-ui,sans-serif;background:#ECEAE4;color:#1A1
           <div class="stb-page-head">
             <div class="stb-page-title">Stammbaum</div>
             <div class="stb-controls">
-              <div class="stb-btn outline" style="font-size:8px">Generationen ▾</div>
               <div class="stb-zoom">
                 <div class="stb-zoom-btn">−</div>
                 <div class="stb-zoom-btn">+</div>
@@ -507,7 +514,6 @@ body{font-family:'Montserrat',system-ui,sans-serif;background:#ECEAE4;color:#1A1
           <div class="stb-page-head">
             <div class="stb-page-title">Stammbaum</div>
             <div class="stb-controls">
-              <div class="stb-btn outline-dark" style="font-size:8px">Generationen ▾</div>
               <div class="stb-zoom">
                 <div class="stb-zoom-btn">−</div>
                 <div class="stb-zoom-btn">+</div>
@@ -751,7 +757,6 @@ body{font-family:'Montserrat',system-ui,sans-serif;background:#ECEAE4;color:#1A1
         <div class="stb-page-head">
           <div class="stb-page-title">Stammbaum</div>
           <div class="stb-controls">
-            <div class="stb-btn outline" style="font-size:8px">Generationen ▾</div>
             <div class="stb-zoom">
               <div class="stb-zoom-btn">−</div>
               <div class="stb-zoom-btn">+</div>
@@ -998,10 +1003,16 @@ body{font-family:'Montserrat',system-ui,sans-serif;background:#ECEAE4;color:#1A1
         <td>Filled circle at connector midpoints; same color as connectors</td>
       </tr>
       <tr>
-        <td>Gen label</td>
-        <td><code>text-[8px] tracking-[2px] uppercase</code></td>
-        <td>8 px</td>
-        <td><code>aria-hidden="true"</code>; #6b7280 light · #4e6070 dark</td>
+        <td>Gutter label</td>
+        <td><code>font-sans text-[12px] font-bold tracking-[0.08em] uppercase</code></td>
+        <td>12 px</td>
+        <td>Wrapped in <code>&lt;g role="text" aria-label="Generation N"&gt;</code> so screen readers announce the full word. Fill <code>var(--c-ink-2)</code>. Renders the un-shifted <code>node.generation</code> value, never the post-normalise rank.</td>
+      </tr>
+      <tr>
+        <td>Gutter stripe underlay</td>
+        <td>SVG <code>&lt;rect&gt;</code> aria-hidden, alternating <code>transparent</code> / <code>var(--c-gutter-stripe)</code></td>
+        <td>NODE_H + ROW_GAP tall, full viewBox width</td>
+        <td>Decorative band per occupied generation row. Hidden entirely below <code>md</code> (GUTTER_WIDTH = 0).</td>
       </tr>
       <tr>
         <td>Node name text</td>