Merge feature/gen-4 (GEN-4): Farbschlag-Benennung (Dilute-Praefix, REW, Fuchs spezifisch) + BreedingView

- dd → 'Dilute '-Praefix (Agouti dd→Dilute Agouti etc.); 4 Dilute-Fuchs-Eintraege gegen nackten 'Fuchs'
- REW = beide C-Allele reduziert (kein volles C) + pp (alle 3 Kombis, A-unabhaengig)
- CP-Fuchs in berechneter Verteilung unterdrueckt
- BreedingResultView: Gencode (Klammer) pro Karte + Karten-Layout-Fix (overflow/responsive)
Frontend-only (engine+catalog.ts+BreedingResultView+index.css). vitest 95, e2e 148.
OFFEN als Follow-up: 7 Kategorie-Eintraege entfernen, PEW=REW-Konsolidierung, Backend-Re-Seed.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

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

@@ -43,16 +43,29 @@ export default function BreedingResultView({ result, title }: BreedingResultView
       ) : (
         <>
           <ul className="farbschlag-cards">
-            {result.byFarbschlag.map((f) => (
-              <li key={f.farbschlag} className="farbschlag-card">
-                <FarbschlagImage name={f.farbschlag} />
-                <span className="farbschlag-card__name">{f.farbschlag}</span>
-                <span className="farbschlag-card__prob">
-                  {f.probability.percent}
-                  <small> ({f.probability.text})</small>
-                </span>
-              </li>
-            ))}
+            {result.byFarbschlag.map((f) => {
+              // Representative genotype: highest-prob offspring for this farbschlag.
+              const repGenotype = result.offspring.find(
+                (o) => o.farbschlag === f.farbschlag,
+              )?.genotype
+              return (
+                <li key={f.farbschlag} className="farbschlag-card">
+                  <div className="farbschlag-card__img">
+                    <FarbschlagImage name={f.farbschlag} />
+                  </div>
+                  <div className="farbschlag-card__body">
+                    <span className="farbschlag-card__name">{f.farbschlag}</span>
+                    {repGenotype && (
+                      <code className="farbschlag-card__geno">{repGenotype}</code>
+                    )}
+                  </div>
+                  <span className="farbschlag-card__prob">
+                    {f.probability.percent}
+                    <small> ({f.probability.text})</small>
+                  </span>
+                </li>
+              )
+            })}
           </ul>
 
           <button