Tree search + click-rebuild; searchable relationship picker; gender dropdown

- Tree page: add a "Find a person" search box that jumps the chart to a
  match and rebuilds the hourglass (parents/grandparents/partner/children)
  around them. Clicking any card recenters via family-chart's default
  behavior (setAncestryDepth 3 / setProgenyDepth 2), syncing focus through
  setAfterUpdate for the "Open profile" link.
- Person detail: replace the relationship "add" <select> with a
  type-to-filter PersonCombobox so long people lists are searchable.
- Person detail: gender is now a Male/Female dropdown, not free text.

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

frontend/app/trees/[id]/persons/[personId]/page.tsx

@@ -9,6 +9,7 @@ import type { components } from "@/lib/api/schema";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
+import { PersonCombobox } from "@/components/person-combobox";
 
 type Person = components["schemas"]["PersonRead"];
 type Event = components["schemas"]["EventRead"];
@@ -431,7 +432,11 @@ export default function PersonDetailPage() {
           <div className="flex flex-wrap gap-2">
             <Input className="w-40" placeholder="Given name" value={pGiven} onChange={(e) => setPGiven(e.target.value)} />
             <Input className="w-40" placeholder="Surname" value={pSurname} onChange={(e) => setPSurname(e.target.value)} />
-            <Input className="w-32" placeholder="Gender" value={pGender} onChange={(e) => setPGender(e.target.value)} />
+            <select className={fieldCls} value={pGender} onChange={(e) => setPGender(e.target.value)}>
+              <option value="">Gender: —</option>
+              <option value="male">Male</option>
+              <option value="female">Female</option>
+            </select>
             <select className={fieldCls} value={pLiving} onChange={(e) => setPLiving(e.target.value)}>
               <option value="unknown">Status: unknown</option>
               <option value="living">Living</option>
@@ -672,14 +677,12 @@ export default function PersonDetailPage() {
                 <option value="partner">partner</option>
                 <option value="sibling">sibling</option>
               </select>
-              <select className={fieldCls} value={relOther} onChange={(e) => setRelOther(e.target.value)}>
-                <option value="">— person —</option>
-                {others.map((p) => (
-                  <option key={p.id} value={p.id}>
-                    {p.primary_name ?? "Unnamed"}
-                  </option>
-                ))}
-              </select>
+              <PersonCombobox
+                people={others}
+                value={relOther}
+                onChange={setRelOther}
+                placeholder="Search for a person…"
+              />
               {(relKind === "parent" || relKind === "child") && (
                 <select className={fieldCls} value={relQual} onChange={(e) => setRelQual(e.target.value as Qualifier)}>
                   {QUALIFIERS.map((q) => (