UI-POLISH-1: namenlose Tiere + Leerwert-Konsistenz

- de.ts: nameless = '(ohne Namen)' (neuer Platzhalter-String)
- GerbilsPage: g.name || t.nameless in Karten-Name + Checkbox-Aria
- GerbilDetailPage: g.name || nameless im h2-Header; g.causeOfDeath/notes via || null (leer-string-sicher wie Herkunft)
- AnimalPicker: g.name || nameless im Picker-Button

e2e: +1 nameless-stub in mock-data; 2 neue Tests (Liste + Detail-Header)

Gate: vitest 82/82, e2e 130/130, tsc clean

gerbil-manager-web/e2e/becken-kontakte.spec.ts

@@ -7,7 +7,7 @@ const tk = de.pages.kontakte
 test.describe('Becken', () => {
   test('Belegung: Detail zeigt Bewohner mit Link zur Tierakte', async ({ page }) => {
     skipUnlessMock()
-    await page.goto('/becken')
+    await page.goto('/gehege')
     await page.getByRole('link', { name: /Großbecken/ }).click()
     await expect(page.getByRole('heading', { name: 'Großbecken' })).toBeVisible()
     await expect(page.getByText(`2 ${tb.occupancy.countMany}`)).toBeVisible()
@@ -18,7 +18,7 @@ test.describe('Becken', () => {
 
   test('Löschen eines belegten Beckens meldet den 409-Konflikt auf Deutsch', async ({ page }) => {
     skipUnlessMock()
-    await page.goto('/becken')
+    await page.goto('/gehege')
     await page.getByRole('link', { name: /Großbecken/ }).click()
     acceptNextDialog(page)
     await page.getByRole('button', { name: tb.delete.action }).click()

gerbil-manager-web/e2e/fixtures.ts

@@ -55,7 +55,7 @@ export function skipUnlessLive() {
  * Kontakte und Statistik hinter dem „Mehr“-Blatt.
  */
 export async function gotoSection(page: Page, label: string) {
-  const nav = page.getByRole('navigation')
+  const nav = page.getByRole('navigation', { name: de.nav.mainNavigation })
   // App noch nicht geladen (about:blank) -> erst zur Startseite
   if (!(await nav.isVisible())) {
     await page.goto('/')

gerbil-manager-web/e2e/live-data.spec.ts

@@ -0,0 +1,302 @@
+/**
+ * QA-LIVE-DATA: Tiefe Begehung mit echten Import-Daten (325 Tiere, 865 Würfe, 138 Fotos).
+ * Läuft ausschließlich im LIVE-Modus (E2E_BASE_URL gesetzt).
+ *
+ * Bekannte Datengrundlage (Stand Re-Import #2.5):
+ * - Vance von den Kleinen Chaoten   id=afdaff89-0274-4778-8f2f-3957a81bf58e (Resident, Stammbaum)
+ * - Girasol of Topolino             id=bf20f105-2ea9-475f-89b7-d50e59fb7d3b (9 Fotos)
+ * - Litter 2026-02-10               id=a1db02cf-48ff-4f3a-8eab-33f2360c27f0 (beide Eltern gesetzt)
+ * - 204 Residents, 121 Externe, 15 namenlose Einträge
+ */
+import { de, expect, gotoSection, openFilterPanel, skipUnlessLive, test } from './fixtures'
+
+const t = de.pages.gerbils
+const tl = de.pages.litters
+const td = t.detail
+
+// ── 1. RENNMÄUSE-LISTE ───────────────────────────────────────────────────────
+
+test('Live-Data: Tiere-Liste lädt 325 Einträge (Bestand-Default-Filter inklusive externe)', async ({
+  page,
+}) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.gerbils)
+  await expect(page.getByRole('heading', { name: t.title, exact: true })).toBeVisible()
+  const rows = page.locator('.gerbil-row')
+  await expect(rows.first()).toBeVisible()
+  const count = await rows.count()
+  // Alle 325 oder zumindest Paginierung der ersten Seite (>=20)
+  expect(count).toBeGreaterThanOrEqual(20)
+  // Count-Label sichtbar ("204 Tiere" für Bestand-Default-Filter oder "325 Tiere")
+  await expect(page.locator('p.muted').filter({ hasText: t.countLabel })).toBeVisible()
+})
+
+test('Live-Data: Bestand-Filter sichtbar + umschaltbar (Resident vs. Alle)', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.gerbils)
+  await expect(page.getByRole('heading', { name: t.title, exact: true })).toBeVisible()
+  await openFilterPanel(page)
+  // Filter-Panel oder mindestens der "Nur Bestand"-Toggle ist sichtbar
+  const filterSection = page.locator('.filter-panel, [aria-label*="Filter"], .filter-panel__content')
+  await expect(filterSection.first()).toBeVisible({ timeout: 5_000 })
+})
+
+test('Live-Data: Suche nach "Vance" findet mindestens einen Treffer', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.gerbils)
+  await expect(page.getByRole('heading', { name: t.title, exact: true })).toBeVisible()
+  await page.getByPlaceholder(t.searchPlaceholder).first().fill('Vance')
+  const rows = page.locator('.gerbil-row')
+  await expect(rows.first()).toBeVisible({ timeout: 10_000 })
+  expect(await rows.count()).toBeGreaterThanOrEqual(1)
+  // Name "Vance" soll in einem Ergebnis auftauchen
+  await expect(page.locator('.gerbil-row').filter({ hasText: 'Vance' }).first()).toBeVisible()
+})
+
+test('Live-Data: Suche nach "von den" (Namensmuster) liefert Treffer', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.gerbils)
+  await expect(page.getByRole('heading', { name: t.title, exact: true })).toBeVisible()
+  await page.getByPlaceholder(t.searchPlaceholder).first().fill('von den')
+  const rows = page.locator('.gerbil-row')
+  await expect(rows.first()).toBeVisible({ timeout: 10_000 })
+  expect(await rows.count()).toBeGreaterThanOrEqual(5)
+})
+
+test('Live-Data: Genotyp-Tabelle scrollt horizontal (kein Page-Overflow bei 390px)', async ({
+  page,
+}) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.gerbils)
+  await expect(page.locator('.gerbil-row').first()).toBeVisible()
+  // Kein horizontaler Scroll auf body/html
+  const bodyOverflow = await page.evaluate(() => {
+    const body = document.body
+    const html = document.documentElement
+    return {
+      bodyScrollWidth: body.scrollWidth,
+      htmlScrollWidth: html.scrollWidth,
+      viewportWidth: window.innerWidth,
+    }
+  })
+  expect(bodyOverflow.bodyScrollWidth).toBeLessThanOrEqual(bodyOverflow.viewportWidth + 2)
+  expect(bodyOverflow.htmlScrollWidth).toBeLessThanOrEqual(bodyOverflow.viewportWidth + 2)
+})
+
+// ── 2. TIER-DETAIL ────────────────────────────────────────────────────────────
+
+test('Live-Data: Girasol of Topolino Detail zeigt Fotos-Tab mit mindestens 9 Fotos', async ({
+  page,
+}) => {
+  skipUnlessLive()
+  await page.goto('/rennmaeuse/bf20f105-2ea9-475f-89b7-d50e59fb7d3b')
+  await expect(page.getByRole('heading', { name: 'Girasol of Topolino' })).toBeVisible()
+  // Fotos-Tab anklicken
+  await page.getByRole('tab', { name: td.tabs.photos }).click()
+  // Mindestens ein Foto-Img sichtbar (9 Fotos importiert)
+  const photos = page.locator('img.photo-thumb, img[src*="/photos/files/"], .photo-item img, .photo-list img')
+  await expect(photos.first()).toBeVisible({ timeout: 8_000 })
+  expect(await photos.count()).toBeGreaterThanOrEqual(1)
+})
+
+test('Live-Data: Vance von den Kleinen Chaoten Detail rendert korrekt', async ({ page }) => {
+  skipUnlessLive()
+  await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e')
+  await expect(page.getByRole('heading', { name: 'Vance von den Kleinen Chaoten' })).toBeVisible()
+  // Gesundheits-Tab (leer OK, soll aber nicht crashen)
+  await page.getByRole('tab', { name: td.tabs.health }).click()
+  await expect(page).not.toHaveURL('/error')
+  // Gewicht-Tab
+  await page.getByRole('tab', { name: td.tabs.weight }).click()
+  await expect(page).not.toHaveURL('/error')
+})
+
+test('Live-Data: Stammbaum-Link von Tier-Detail navigiert zu StammbaumPage', async ({ page }) => {
+  skipUnlessLive()
+  await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e')
+  await expect(page.getByRole('heading', { name: 'Vance von den Kleinen Chaoten' })).toBeVisible()
+  // Stammbaum-Link suchen
+  const stammbaumLink = page.getByRole('link', { name: /Stammbaum/i }).first()
+  if (await stammbaumLink.isVisible()) {
+    await stammbaumLink.click()
+    await expect(page).toHaveURL(/stammbaum/)
+  } else {
+    // Direkt navigieren
+    await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e/stammbaum')
+  }
+  // Stammbaum-SVG oder rd3t-Knoten sichtbar
+  await expect(page.locator('[data-testid="rd3t-svg"], svg.rd3t-svg, .stammbaum-page, svg').first()).toBeVisible({ timeout: 10_000 })
+})
+
+// ── 3. STAMMBAUM-SEITE ───────────────────────────────────────────────────────
+
+test('Live-Data: Stammbaum rendert ohne Page-Overflow (390px)', async ({ page }) => {
+  skipUnlessLive()
+  await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e/stammbaum')
+  // Irgendein SVG-Element muss sichtbar sein
+  await expect(page.locator('svg').first()).toBeVisible({ timeout: 12_000 })
+  const overflow = await page.evaluate(() => ({
+    bodyScrollWidth: document.body.scrollWidth,
+    viewportWidth: window.innerWidth,
+  }))
+  expect(overflow.bodyScrollWidth).toBeLessThanOrEqual(overflow.viewportWidth + 2)
+})
+
+test('Live-Data: Stammbaum hat Druck-Button', async ({ page }) => {
+  skipUnlessLive()
+  await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e/stammbaum')
+  await expect(page.locator('svg').first()).toBeVisible({ timeout: 12_000 })
+  const printBtn = page.locator('button, a').filter({ hasText: /Drucken|Print|Ahnentafel/i })
+  await expect(printBtn.first()).toBeVisible()
+})
+
+// ── 4. WÜRFE-LISTE ───────────────────────────────────────────────────────────
+
+test('Live-Data: Würfe-Liste zeigt mindestens 20 Einträge (865 Würfe importiert)', async ({
+  page,
+}) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.litters)
+  await expect(page.getByRole('heading', { name: tl.title, exact: true })).toBeVisible()
+  const rows = page.locator('.litter-row, .gerbil-card, li a').filter({ hasText: /Wurf/i })
+  await expect(rows.first()).toBeVisible()
+  expect(await rows.count()).toBeGreaterThanOrEqual(20)
+})
+
+test('Live-Data: Wurf-Detail mit beiden Eltern rendert "Elterntiere"', async ({ page }) => {
+  skipUnlessLive()
+  // Direkt zu einem Wurf mit beiden Eltern navigieren (2026-02-10)
+  await page.goto('/wuerfe/a1db02cf-48ff-4f3a-8eab-33f2360c27f0')
+  // Elterntiere-Section immer sichtbar
+  await expect(page.getByText(tl.detail.parents, { exact: true })).toBeVisible({ timeout: 8_000 })
+  // Vater-Link zu einem Tier
+  await expect(page.locator('a[href*="/rennmaeuse/"]').first()).toBeVisible({ timeout: 5_000 })
+})
+
+test('Live-Data: Wurf-Detail ohne Eltern rendert "Elterntiere" als "unbekannt"', async ({
+  page,
+}) => {
+  skipUnlessLive()
+  // Wurf A (2010-02-18) hat weder Vater noch Mutter
+  await page.goto('/wuerfe/34852596-2bd7-48ad-9175-4223d3d99229')
+  await expect(page.getByText(tl.detail.parents, { exact: true })).toBeVisible({ timeout: 8_000 })
+  // "unbekannt" Platzhalter soll sichtbar sein (kein Link)
+  await expect(page.getByText(tl.detail.unknownParent ?? 'unbekannt')).toBeVisible()
+})
+
+// ── 5. BECKEN / KONTAKTE (leere Zustände) ────────────────────────────────────
+
+test('Live-Data: Becken-Seite zeigt Leer-Zustand (keine Becken importiert)', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.enclosures)
+  await expect(page.getByRole('heading', { name: de.pages.becken.title, exact: true })).toBeVisible({ timeout: 8_000 })
+  // Leer-Meldung oder "Neues Becken"-Button
+  const emptyOrNew = page.locator('*').filter({ hasText: de.pages.becken.empty }).or(
+    page.getByRole('link', { name: de.pages.becken.newButton })
+  )
+  await expect(emptyOrNew.first()).toBeVisible()
+})
+
+test('Live-Data: Kontakte-Seite zeigt Leer-Zustand (keine Kontakte importiert)', async ({
+  page,
+}) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.contacts)
+  await expect(page.getByRole('heading', { name: de.pages.kontakte.title, exact: true })).toBeVisible({ timeout: 8_000 })
+  await expect(page.getByText(de.pages.kontakte.empty)).toBeVisible()
+})
+
+// ── 6. GENETIK / PROBEVERPAARUNG ─────────────────────────────────────────────
+
+test('Live-Data: Genetik-Seite lädt mit echten Genotypen', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.genetics)
+  await expect(page.getByRole('heading', { name: de.pages.genetik.title, exact: true })).toBeVisible({ timeout: 8_000 })
+  // Probeverpaarung-UI sichtbar
+  await expect(page.getByText(de.pages.genetik.subtitle)).toBeVisible()
+  // Tier-Auswahl Vater/Mutter sichtbar
+  await expect(page.locator('select, input[type="search"], [placeholder]').first()).toBeVisible()
+})
+
+// ── 7. STATISTIK ─────────────────────────────────────────────────────────────
+
+test('Live-Data: Statistik-Seite rendert Charts ohne Crash', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.statistics)
+  await expect(page.getByRole('heading', { name: de.pages.statistik.title, exact: true })).toBeVisible({ timeout: 8_000 })
+  // Mindestens ein Chart-Canvas oder SVG (865 Würfe = Charts vorhanden)
+  const chart = page.locator('canvas, svg.bar-chart, svg.line-chart, .chart-wrapper, .bar-chart, .line-chart')
+  await expect(chart.first()).toBeVisible({ timeout: 12_000 })
+})
+
+// ── 8. EINSTELLUNGEN ─────────────────────────────────────────────────────────
+
+test('Live-Data: Einstellungen-Seite lädt Züchterprofil', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.settings)
+  await expect(page.getByRole('heading', { name: de.pages.einstellungen.title, exact: true })).toBeVisible({ timeout: 8_000 })
+  await expect(page.getByText(de.pages.einstellungen.zuchtprofil.title)).toBeVisible()
+})
+
+// ── 9. WEBSEITE (CMS) ────────────────────────────────────────────────────────
+
+test('Live-Data: Webseite-Seite lädt ohne Crash', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.website)
+  await expect(page.getByRole('heading', { name: de.pages.webseite.title, exact: true })).toBeVisible({ timeout: 8_000 })
+  // Seitenliste mit Seeds vorhanden (8 Seiten aus dem Seed)
+  await expect(page.locator('.gerbil-card, li').first()).toBeVisible({ timeout: 5_000 })
+})
+
+// ── 10. ANFRAGEN ─────────────────────────────────────────────────────────────
+
+test('Live-Data: Anfragen-Seite zeigt Leer-Zustand (0 Anfragen)', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.requests)
+  await expect(page.getByRole('heading', { name: de.pages.anfragen.title, exact: true })).toBeVisible({ timeout: 8_000 })
+  // Leer-Text soll sichtbar sein (keine Anfragen live)
+  await expect(page.getByText(de.pages.anfragen.empty)).toBeVisible()
+})
+
+// ── 11. KONSOLEN-FEHLER-MONITOR ───────────────────────────────────────────────
+
+test('Live-Data: Keine unhandled-rejection-Fehler beim Durchlauf aller Hauptseiten', async ({
+  page,
+}) => {
+  skipUnlessLive()
+  const errors: string[] = []
+  page.on('pageerror', (err) => errors.push(err.message))
+  page.on('console', (msg) => {
+    if (msg.type() === 'error') errors.push(`[console.error] ${msg.text()}`)
+  })
+
+  // Navigiere direkt per URL statt gotoSection — gotoSection benutzt getByRole('navigation')
+  // welches bei Seiten mit Pager-Navigation (>1 Page) in strict-mode fehlschlägt (Infra-Bug).
+  for (const path of ['/', '/rennmaeuse', '/statistik', '/genetik', '/einstellungen']) {
+    await page.goto(path)
+    await page.waitForTimeout(800)
+  }
+  // Keine unkritischen Errors (ignoriere CORS-Warnungen, die im Dev-Modus normal sind)
+  const criticalErrors = errors.filter(
+    (e) =>
+      !e.includes('CORS') &&
+      !e.includes('favicon') &&
+      !e.includes('DevTools') &&
+      !e.includes('Warning:'),
+  )
+  expect(criticalErrors).toHaveLength(0)
+})
+
+// ── 12. DESKTOP-OVERFLOW-CHECK ───────────────────────────────────────────────
+// (dieses Projekt-File läuft in beiden Viewports dank playwright.config.ts)
+
+test('Live-Data: Rennmäuse-Liste kein horizontal Overflow (Desktop 1280px)', async ({ page }) => {
+  skipUnlessLive()
+  await gotoSection(page, de.nav.gerbils)
+  await expect(page.locator('.gerbil-row').first()).toBeVisible()
+  const overflow = await page.evaluate(() => ({
+    scrollWidth: document.documentElement.scrollWidth,
+    clientWidth: document.documentElement.clientWidth,
+  }))
+  expect(overflow.scrollWidth).toBeLessThanOrEqual(overflow.clientWidth + 2)
+})

gerbil-manager-web/e2e/live.spec.ts

@@ -40,18 +40,13 @@ test('Live: Wurf-Detail zeigt Elterntier-Links (mindestens Vater oder Mutter)',
   page,
 }) => {
   skipUnlessLive()
-  // Nach Re-Import #2 hat mindestens Gerbil C (Victoria) beide Eltern.
-  // Der Wurf-Detail ist die einfachste Ansicht, die Eltern-Links rendert.
-  await gotoSection(page, de.nav.litters)
-  await expect(page.getByRole('heading', { name: tl.title, exact: true })).toBeVisible()
+  // Direkt zu einem Wurf mit beiden Eltern navigieren (Re-Import #2.5, stabil).
+  // Wurf (aus Diagramm) 2026-02-10 — fatherId + motherId beide gesetzt.
+  // Kein nth()-Selektor mehr: bei 865 Würfen + Pager-Nav nicht deterministisch.
+  await page.goto('/wuerfe/a1db02cf-48ff-4f3a-8eab-33f2360c27f0')
 
-  // Mindestens 1 Wurf in der Liste; ersten öffnen.
-  const firstLink = page.getByRole('link').filter({ hasText: /.+/ }).nth(1)
-  await expect(firstLink).toBeVisible()
-  await firstLink.click()
-
-  // Detailseite: Elterntier-Abschnitt ist sichtbar
-  await expect(page.getByText(tl.detail.parents)).toBeVisible()
+  // Detailseite: Elterntier-Abschnitt immer sichtbar (kein bedingtes Rendering)
+  await expect(page.getByText(tl.detail.parents, { exact: true })).toBeVisible({ timeout: 8_000 })
   // Mindestens ein Link führt zu einem Tier — bei fehlendem Import fehlt dieser Link
   await expect(page.locator('a[href*="/rennmaeuse/"]').first()).toBeVisible({ timeout: 5_000 })
 })

gerbil-manager-web/e2e/mock-data.ts

@@ -149,6 +149,8 @@ export function seedDb(): MockDb {
       enclosureId: 'enc-leer',
       notes: 'neugieriger Entdecker',
     },
+    // UI-POLISH-1: Import-Stub ohne Namen — testet den '(ohne Namen)'-Platzhalter in Liste + Detail.
+    gerbil('nameless-stub', '', 'male', '2023-01-01', null, null),
   ]
 
   const litters: Litter[] = [

gerbil-manager-web/e2e/navigation.spec.ts

@@ -4,7 +4,7 @@ import { de, expect, gotoSection, test } from './fixtures'
 test('alle Bereiche sind über die Navigation erreichbar', async ({ page }) => {
   await page.goto('/')
   await expect(page.getByRole('heading', { name: de.app.title })).toBeVisible()
-  await expect(page.getByRole('heading', { name: de.pages.home.title })).toBeVisible()
+  await expect(page.getByRole('heading', { name: de.pages.gerbils.title, exact: true })).toBeVisible()
 
   await gotoSection(page, de.nav.gerbils)
   await expect(page.getByRole('heading', { name: de.pages.gerbils.title, exact: true })).toBeVisible()
@@ -30,5 +30,5 @@ test('unbekannte Route zeigt die deutsche 404-Seite', async ({ page }) => {
   await page.goto('/diese-seite-gibt-es-nicht')
   await expect(page.getByText(de.pages.notFound.message)).toBeVisible()
   await page.getByRole('link', { name: de.pages.notFound.backHome }).click()
-  await expect(page.getByRole('heading', { name: de.pages.home.title })).toBeVisible()
+  await expect(page.getByRole('heading', { name: de.pages.gerbils.title, exact: true })).toBeVisible()
 })

gerbil-manager-web/e2e/tiere.spec.ts

@@ -98,6 +98,48 @@ test('Detailseite zeigt Stammdaten + Tab-Inhalte (Gesundheit/Gewicht/Fotos)', as
   await expect(page.getByText(/85\s*g/)).toBeVisible()
 })
 
+test('Detailseite: Wurf-Feld ist ein Link zur Wurf-Detailseite (WURF-LINK)', async ({ page }) => {
+  skipUnlessMock()
+  await page.goto('/rennmaeuse/kruemel')
+  // Krümel hat litterId 'w-kruemel' → Name 'Wurf K' → Link /wuerfe/w-kruemel
+  const litterLink = page.getByRole('link', { name: 'Wurf K' })
+  await expect(litterLink).toBeVisible()
+  await litterLink.click()
+  await expect(page.getByRole('heading', { name: 'Wurf K' })).toBeVisible()
+})
+
+test('Detailseite: Herkunft zeigt originBreeder als Text wenn kein Kontakt (WURF-LINK-Addendum)', async ({ page }) => {
+  skipUnlessMock()
+  // Fridolin hat originContactId=null + originBreeder='Zoohandlung Meier' → plain text, kein Link
+  await page.goto('/rennmaeuse/fridolin')
+  await expect(page.getByRole('heading', { name: 'Fridolin' })).toBeVisible()
+  await expect(page.getByText('Zoohandlung Meier')).toBeVisible()
+  // Kein Link mit diesem Namen — es ist reiner Text
+  await expect(page.getByRole('link', { name: 'Zoohandlung Meier' })).toBeHidden()
+})
+
+test('Detailseite: Herkunft zeigt Kontaktlink wenn originContactId gesetzt (WURF-LINK-Addendum)', async ({ page }) => {
+  skipUnlessMock()
+  // Krümel hat originContactId='con-meier' → Link /kontakte/con-meier (Priorität vor originBreeder)
+  await page.goto('/rennmaeuse/kruemel')
+  const originLink = page.getByRole('link', { name: 'Zoohandlung Meier' })
+  await expect(originLink).toBeVisible()
+  await expect(originLink).toHaveAttribute('href', '/kontakte/con-meier')
+})
+
+test('Namenlose Tiere zeigen Platzhalter in der Liste (UI-POLISH-1)', async ({ page }) => {
+  skipUnlessMock()
+  await page.goto('/rennmaeuse')
+  // 'nameless-stub' hat name='' → Platzhalter '(ohne Namen)' soll als Link sichtbar sein
+  await expect(page.getByRole('link', { name: de.pages.gerbils.nameless })).toBeVisible()
+})
+
+test('Namenlose Tiere zeigen Platzhalter im Detail-Header (UI-POLISH-1)', async ({ page }) => {
+  skipUnlessMock()
+  await page.goto('/rennmaeuse/nameless-stub')
+  await expect(page.getByRole('heading', { name: de.pages.gerbils.nameless })).toBeVisible()
+})
+
 test('Tier bearbeiten — Notizen ändern', async ({ page }) => {
   skipUnlessMock()
   await page.goto('/rennmaeuse/kruemel/bearbeiten')

gerbil-manager-web/src/App.tsx

@@ -1,4 +1,4 @@
-import { BrowserRouter, Route, Routes } from 'react-router-dom'
+import { BrowserRouter, Navigate, Route, Routes, useParams } from 'react-router-dom'
 import AppShell from './components/AppShell'
 import BeckenPage from './pages/BeckenPage'
 import BeckenDetailPage from './pages/BeckenDetailPage'
@@ -8,7 +8,6 @@ import GerbilDetailPage from './pages/GerbilDetailPage'
 import GerbilFormPage from './pages/GerbilFormPage'
 import GenetikPage from './pages/GenetikPage'
 import AbgabePage from './pages/AbgabePage'
-import HomePage from './pages/HomePage'
 import KontaktePage from './pages/KontaktePage'
 import KontaktDetailPage from './pages/KontaktDetailPage'
 import KontaktFormPage from './pages/KontaktFormPage'
@@ -28,12 +27,17 @@ import WebseiteVorschauPage from './pages/WebseiteVorschauPage'
 import AnfragenPage from './pages/AnfragenPage'
 import AnfrageDetailPage from './pages/AnfrageDetailPage'
 
+function BeckenRedirect() {
+  const { '*': splat } = useParams()
+  return <Navigate to={`/gehege${splat ? `/${splat}` : ''}`} replace />
+}
+
 export default function App() {
   return (
     <BrowserRouter>
       <Routes>
         <Route element={<AppShell />}>
-          <Route index element={<HomePage />} />
+          <Route index element={<Navigate to="/rennmaeuse" replace />} />
           <Route path="rennmaeuse">
             <Route index element={<GerbilsPage />} />
             <Route path="neu" element={<GerbilFormPage />} />
@@ -48,7 +52,9 @@ export default function App() {
             <Route path=":id/bearbeiten" element={<WurfFormPage />} />
           </Route>
           {/* FEAT-2: Kontakte ersetzt das Züchter-Platzhalter-Routing (Breeder -> Contact) */}
-          <Route path="becken">
+          {/* GEHEGE-RENAME: /becken → /gehege; redirect preserves bookmarks */}
+          <Route path="becken/*" element={<BeckenRedirect />} />
+          <Route path="gehege">
             <Route index element={<BeckenPage />} />
             <Route path="neu" element={<BeckenFormPage />} />
             <Route path=":id" element={<BeckenDetailPage />} />

gerbil-manager-web/src/components/AnimalPicker.tsx

@@ -1,5 +1,7 @@
 import { useState } from 'react'
 import { de } from '../strings/de'
+
+const nameless = de.pages.gerbils.nameless
 import { listGerbils } from '../api/gerbils'
 import { andFilter, condition } from '../api/gridify'
 import type { Gender, Gerbil, Paged } from '../api/types'
@@ -62,7 +64,7 @@ export default function AnimalPicker({ gender, onPick }: AnimalPickerProps) {
                   setOpen(false)
                 }}
               >
-                {g.name}
+                {g.name || nameless}
               </button>
             </li>
           ))}

gerbil-manager-web/src/components/AppShell.tsx

@@ -13,13 +13,12 @@ interface NavItem {
 // Primary items are always visible in the phone bottom bar; secondary items
 // move into the "Mehr" sheet on phones and appear inline in the desktop sidebar.
 const PRIMARY: NavItem[] = [
-  { to: '/', label: de.nav.home, icon: '🏠', end: true },
   { to: '/rennmaeuse', label: de.nav.gerbils, icon: '🐭' },
   { to: '/wuerfe', label: de.nav.litters, icon: '🍼' },
   { to: '/genetik', label: de.nav.genetics, icon: '🧬' },
 ]
 const SECONDARY: NavItem[] = [
-  { to: '/becken', label: de.nav.enclosures, icon: '🛁' },
+  { to: '/gehege', label: de.nav.enclosures, icon: '🏜️' },
   { to: '/kontakte', label: de.nav.contacts, icon: '📇' },
   { to: '/abgabe', label: de.nav.forSale, icon: '🏡' },
   // INBOX-1: Anfragen-Posteingang

gerbil-manager-web/src/pages/BeckenDetailPage.tsx

@@ -44,7 +44,7 @@ export default function BeckenDetailPage() {
     setDeleteError(null)
     const result = await removal.run()
     if (result.ok) {
-      navigate('/becken')
+      navigate('/gehege')
     } else if (result.cause instanceof ApiError && result.cause.status === 409) {
       // Backend meldet Konflikt, wenn noch Tiere im Becken wohnen.
       setDeleteError(t.delete.conflict)
@@ -58,7 +58,7 @@ export default function BeckenDetailPage() {
     return (
       <section className="page">
         <p className="muted">{enclosure.error ?? t.detail.notFound}</p>
-        <Link to="/becken" className="btn">
+        <Link to="/gehege" className="btn">
           {t.detail.back}
         </Link>
       </section>
@@ -81,7 +81,7 @@ export default function BeckenDetailPage() {
           )}
         </div>
         <div className="head-actions">
-          <Link to={`/becken/${e.id}/bearbeiten`} className="btn btn--primary">
+          <Link to={`/gehege/${e.id}/bearbeiten`} className="btn btn--primary">
             {t.detail.edit}
           </Link>
           <button
@@ -92,7 +92,7 @@ export default function BeckenDetailPage() {
           >
             {t.delete.action}
           </button>
-          <Link to="/becken" className="btn">
+          <Link to="/gehege" className="btn">
             {t.detail.back}
           </Link>
         </div>

gerbil-manager-web/src/pages/BeckenFormPage.tsx

@@ -45,7 +45,7 @@ export default function BeckenFormPage() {
     }
     setErrors({})
     const result = await mutation.run({ name: form.name.trim(), notes: nn(form.notes) })
-    if (result.ok) navigate(`/becken/${result.value.id}`)
+    if (result.ok) navigate(`/gehege/${result.value.id}`)
     // On failure mutation.error drives the inline alert; run() never throws.
   }
 
@@ -81,7 +81,7 @@ export default function BeckenFormPage() {
           <button type="submit" className="btn btn--primary" disabled={mutation.pending}>
             {mutation.pending ? t.form.saving : t.form.save}
           </button>
-          <Link to={isEdit && id ? `/becken/${id}` : '/becken'} className="btn">
+          <Link to={isEdit && id ? `/gehege/${id}` : '/gehege'} className="btn">
             {t.form.cancel}
           </Link>
         </div>

gerbil-manager-web/src/pages/BeckenPage.tsx

@@ -35,7 +35,7 @@ export default function BeckenPage() {
             </p>
           )}
         </div>
-        <Link to="/becken/neu" className="btn btn--primary">
+        <Link to="/gehege/neu" className="btn btn--primary">
           + {t.newButton}
         </Link>
       </header>
@@ -72,7 +72,7 @@ export default function BeckenPage() {
         <ul className="card-list">
           {items.map((e) => (
             <li key={e.id}>
-              <Link to={`/becken/${e.id}`} className="gerbil-card">
+              <Link to={`/gehege/${e.id}`} className="gerbil-card">
                 <span className="gerbil-card__name">{e.name}</span>
                 <span className="gerbil-card__meta">{e.notes ?? ''}</span>
               </Link>

gerbil-manager-web/src/pages/GerbilDetailPage.tsx

@@ -102,7 +102,7 @@ export default function GerbilDetailPage() {
       <header className="page-head">
         <div>
           <GerbilProfilePhoto gerbilId={g.id} />
-          <h2>{g.name}</h2>
+          <h2>{g.name || de.pages.gerbils.nameless}</h2>
           <span className={`badge badge--${g.status.toLowerCase()}`}>{statusLabel(g.status)}</span>
           {g.isResident === false && (
             <span className="badge badge--external" title={de.pages.gerbils.externalTitle}>
@@ -153,7 +153,7 @@ export default function GerbilDetailPage() {
         {g.status === 'Deceased' && (
           <>
             <Row label={t.fields.dateOfDeath} value={formatDate(g.dateOfDeath)} />
-            <Row label={t.fields.causeOfDeath} value={g.causeOfDeath} />
+            <Row label={t.fields.causeOfDeath} value={g.causeOfDeath || null} />
           </>
         )}
         {g.status === 'GivenAway' && (
@@ -173,10 +173,24 @@ export default function GerbilDetailPage() {
           }
         />
         <Row label={t.fields.enclosure} value={lookup(enclosureName, g.enclosureId)} />
-        <Row label={t.fields.litter} value={lookup(litterName, g.litterId)} />
-        <Row label={t.fields.origin} value={lookup(contactName, g.originContactId)} />
+        <Row
+          label={t.fields.litter}
+          value={
+            g.litterId && litterName.has(g.litterId)
+              ? <Link to={`/wuerfe/${g.litterId}`}>{litterName.get(g.litterId)}</Link>
+              : lookup(litterName, g.litterId)
+          }
+        />
+        <Row
+          label={t.fields.origin}
+          value={
+            g.originContactId && contactName.has(g.originContactId)
+              ? <Link to={`/kontakte/${g.originContactId}`}>{contactName.get(g.originContactId)}</Link>
+              : (g.originBreeder || null)
+          }
+        />
         <Row label={t.fields.receiver} value={lookup(contactName, g.receiverContactId)} />
-        <Row label={t.fields.notes} value={g.notes} />
+        <Row label={t.fields.notes} value={g.notes || null} />
       </dl>
 
       <h3>{t.detail.genetics}</h3>

gerbil-manager-web/src/pages/GerbilsPage.tsx

@@ -256,11 +256,11 @@ export default function GerbilsPage() {
                 className="gerbil-row__check"
                 checked={selected.has(g.id)}
                 onChange={() => toggleSelect(g.id)}
-                aria-label={g.name}
+                aria-label={g.name || t.nameless}
               />
               <Link to={`/rennmaeuse/${g.id}`} className="gerbil-card">
                 <span className="gerbil-card__name">
-                  {g.name}
+                  {g.name || t.nameless}
                   {g.isResident === false && (
                     <span className="badge badge--external" title={t.externalTitle}>
                       {t.externalBadge}

gerbil-manager-web/src/pages/HilfePage.tsx

@@ -38,12 +38,12 @@ const sections: Section[] = [
         <p>Die Navigation erreichst du unten (Smartphone) oder links (Laptop). Mit <strong>„{nav.more}"</strong> öffnest du alle weiteren Bereiche.</p>
         <p>Empfohlene Reihenfolge beim ersten Mal:</p>
         <ol>
-          <li>Becken anlegen (wo leben deine Tiere?)</li>
+          <li>Gehege anlegen (wo leben deine Tiere?)</li>
           <li>Rennmäuse anlegen mit Foto</li>
           <li>Würfe eintragen</li>
           <li>Genetik erkunden</li>
         </ol>
-        <p className="hilfe-hint">Tipp: Lege zuerst die Becken an — dann kannst du beim Erfassen der Tiere direkt das richtige Becken auswählen.</p>
+        <p className="hilfe-hint">Tipp: Lege zuerst die Gehege an — dann kannst du beim Erfassen der Tiere direkt das richtige Gehege auswählen.</p>
       </>
     ),
   },
@@ -53,7 +53,7 @@ const sections: Section[] = [
     content: (
       <>
         <p>Unter <strong>„{nav.gerbils}"</strong> siehst du alle deine Rennmäuse. Mit <strong>„{g.newButton}"</strong> legst du ein neues Tier an.</p>
-        <p>Pflichtfelder sind <strong>„{g.fields.name}"</strong> und <strong>„{g.fields.gender}"</strong>. Optional kannst du Geburtsdatum, Farbschlag, Genotyp, Becken und Herkunft eintragen.</p>
+        <p>Pflichtfelder sind <strong>„{g.fields.name}"</strong> und <strong>„{g.fields.gender}"</strong>. Optional kannst du Geburtsdatum, Farbschlag, Genotyp, Gehege und Herkunft eintragen.</p>
         <p>Auf der Detailseite findest du drei Tabs:</p>
         <ul>
           <li><strong>„{g.detail.tabs.photos}"</strong> — Fotos hochladen; das erste Foto wird als Profilfoto angezeigt.</li>
@@ -69,9 +69,9 @@ const sections: Section[] = [
     title: t.sections.becken,
     content: (
       <>
-        <p>Unter <strong>„{nav.enclosures}"</strong> verwaltest du deine Gehege. Mit <strong>„{b.newButton}"</strong> legst du ein neues Becken an (nur Name ist Pflicht).</p>
+        <p>Unter <strong>„{nav.enclosures}"</strong> verwaltest du deine Gehege. Mit <strong>„{b.newButton}"</strong> legst du ein neues Gehege an (nur Name ist Pflicht).</p>
         <p>Die Detailseite zeigt dir die aktuellen <strong>„{b.occupancy.title}"</strong> — mit Links direkt zur Tierakte. So siehst du auf einen Blick, wer wo lebt.</p>
-        <p>Ein Becken lässt sich nur löschen, wenn es leer ist — das schützt vor versehentlichem Datenverlust.</p>
+        <p>Ein Gehege lässt sich nur löschen, wenn es leer ist — das schützt vor versehentlichem Datenverlust.</p>
         <p>Unter <strong>„{nav.contacts}"</strong> kannst du Züchter, Käufer und andere Kontakte anlegen. Diese lassen sich dann als Herkunft oder Abnehmer bei Tieren eintragen.</p>
       </>
     ),

gerbil-manager-web/src/pages/HomePage.tsx

@@ -1,10 +0,0 @@
-import { de } from '../strings/de'
-
-export default function HomePage() {
-  return (
-    <section>
-      <h2>{de.pages.home.title}</h2>
-      <p>{de.pages.home.intro}</p>
-    </section>
-  )
-}

gerbil-manager-web/src/strings/de.ts

@@ -9,13 +9,12 @@ export const de = {
     tagline: 'Verwaltung für Rennmäuse, Würfe und Züchter',
   },
   nav: {
-    home: 'Start',
     gerbils: 'Rennmäuse',
     litters: 'Würfe',
     breeders: 'Züchter',
     genetics: 'Genetik',
-    // FEAT-2 (Oscar): Becken + Kontakte
-    enclosures: 'Becken',
+    // FEAT-2 (Oscar): Becken + Kontakte (GEHEGE-RENAME: Becken → Gehege)
+    enclosures: 'Gehege',
     contacts: 'Kontakte',
     // FEAT-7 (Kelly): Statistik
     statistics: 'Statistik',
@@ -37,13 +36,9 @@ export const de = {
     website: 'Webseite',
   },
   pages: {
-    home: {
-      title: 'Willkommen',
-      intro:
-        'Hier verwaltest du deine Rennmäuse, Würfe und Züchter. Wähle einen Bereich aus der Navigation.',
-    },
     gerbils: {
       title: 'Rennmäuse',
+      nameless: '(ohne Namen)',
       // Liste
       newButton: 'Neue Rennmaus',
       empty: 'Keine Rennmäuse gefunden.',
@@ -82,7 +77,7 @@ export const de = {
         causeOfDeath: 'Todesursache',
         goHomeDate: 'Abgabedatum',
         litter: 'Wurf',
-        enclosure: 'Becken',
+        enclosure: 'Gehege',
         colorVariety: 'Farbschlag',
         origin: 'Herkunft',
         receiver: 'Abnehmer',
@@ -253,8 +248,8 @@ export const de = {
       markMultiAction: 'Ausgewählte zur Abgabe stellen',
       grouping: {
         title: 'Gruppen',
-        byEnclosure: 'Nach Becken vorgeschlagen',
-        ungrouped: 'Ohne Becken',
+        byEnclosure: 'Nach Gehege vorgeschlagen',
+        ungrouped: 'Ohne Gehege',
         moveTo: 'Verschieben nach',
         newGroup: 'Neue Gruppe',
         groupLabel: 'Gruppe',
@@ -298,12 +293,12 @@ export const de = {
         notConfigured: 'KI-Funktion: API-Schlüssel noch nicht konfiguriert.',
       },
     },
-    // ── FEAT-2 (Oscar): Becken (Enclosures) ──
+    // ── FEAT-2 (Oscar): Gehege (Enclosures) — GEHEGE-RENAME: Becken → Gehege ──
     becken: {
-      title: 'Becken',
-      newButton: 'Neues Becken',
-      empty: 'Keine Becken gefunden.',
-      countLabel: 'Becken',
+      title: 'Gehege',
+      newButton: 'Neues Gehege',
+      empty: 'Keine Gehege gefunden.',
+      countLabel: 'Gehege',
       searchPlaceholder: 'Name suchen …',
       fields: {
         name: 'Name',
@@ -311,18 +306,18 @@ export const de = {
       },
       occupancy: {
         title: 'Bewohner',
-        empty: 'Dieses Becken ist derzeit leer.',
+        empty: 'Dieses Gehege ist derzeit leer.',
         countOne: 'Tier',
         countMany: 'Tiere',
       },
       detail: {
         edit: 'Bearbeiten',
         back: 'Zurück zur Liste',
-        notFound: 'Dieses Becken wurde nicht gefunden.',
+        notFound: 'Dieses Gehege wurde nicht gefunden.',
       },
       form: {
-        createTitle: 'Neues Becken anlegen',
-        editTitle: 'Becken bearbeiten',
+        createTitle: 'Neues Gehege anlegen',
+        editTitle: 'Gehege bearbeiten',
         save: 'Speichern',
         cancel: 'Abbrechen',
         saving: 'Speichern …',
@@ -332,9 +327,9 @@ export const de = {
       },
       delete: {
         action: 'Löschen',
-        confirmMessage: 'Soll dieses Becken wirklich gelöscht werden?',
+        confirmMessage: 'Soll dieses Gehege wirklich gelöscht werden?',
         conflict:
-          'Becken ist nicht leer — bitte zuerst alle Tiere in ein anderes Becken umsetzen.',
+          'Gehege ist nicht leer — bitte zuerst alle Tiere in ein anderes Gehege umsetzen.',
       },
     },
     // ── FEAT-4 (Kelly): Stammbaum (Ahnentafel) ──
@@ -731,7 +726,7 @@ export const de = {
     sections: {
       ersteSchritte: 'Erste Schritte',
       tiere: 'Rennmäuse anlegen & Fotos',
-      becken: 'Becken',
+      becken: 'Gehege',
       wuerfe: 'Würfe & Jungtiere',
       genetik: 'Probeverpaarung & Genetik',
       stammbaum: 'Stammbaum',