diff --git a/decnet_web/src/components/PersonaGeneration.tsx b/decnet_web/src/components/PersonaGeneration.tsx
index 1bcf3d1c..62194f81 100644
--- a/decnet_web/src/components/PersonaGeneration.tsx
+++ b/decnet_web/src/components/PersonaGeneration.tsx
@@ -1,498 +1,20 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import React, { useMemo, useRef, useState } from 'react';
 import { useParams } from 'react-router-dom';
 import {
-  Mail, Plus, Pencil, Trash2, Check, AlertTriangle, Upload, Download, Sparkles,
+  Mail, Plus, AlertTriangle, Upload, Download, Sparkles,
 } from '../icons';
-import api, { type ApiError } from '../utils/api';
 import { useToast } from './Toasts/useToast';
-import Modal from './Modal/Modal';
+import PersonaCard from './PersonaGeneration/PersonaCard';
+import PersonaEditor from './PersonaGeneration/PersonaEditor';
+import { usePersonaGeneration } from './PersonaGeneration/usePersonaGeneration';
+import {
+  BLANK, TEMPLATE, coercePersona, mergePersonas, validate,
+} from './PersonaGeneration/helpers';
+import type { EmailPersona, FilterKey } from './PersonaGeneration/types';
 import './DeckyFleet.css';
 import './PersonaGeneration.css';
 
-type Tone = 'formal' | 'direct' | 'casual' | 'technical' | 'custom';
-type ReplyLatency = 'fast' | 'normal' | 'slow';
-
-interface EmailPersona {
-  name: string;
-  email: string;
-  role: string;
-  tone: Tone;
-  tone_custom: string | null;
-  mannerisms: string[];
-  language: string | null;
-  signature: string | null;
-  active_hours: string;
-  reply_latency: ReplyLatency;
-  uses_llms_heavily: boolean;
-}
-
-interface PersonasResponse {
-  path?: string;
-  topology_name?: string;
-  language_default?: string;
-  personas: EmailPersona[];
-}
-
-const BLANK: EmailPersona = {
-  name: '',
-  email: '',
-  role: '',
-  tone: 'formal',
-  tone_custom: null,
-  mannerisms: [],
-  language: 'en',
-  signature: null,
-  active_hours: '09:00-18:00',
-  reply_latency: 'normal',
-  uses_llms_heavily: false,
-};
-
-const TONES: Tone[] = ['formal', 'direct', 'casual', 'technical', 'custom'];
-const LATENCIES: ReplyLatency[] = ['fast', 'normal', 'slow'];
-
-type FilterKey = 'all' | Tone;
-
-function extractErrorDetail(err: unknown, fallback: string): string {
-  const e = err as ApiError;
-  if (e?.response?.data?.detail) return e.response.data.detail;
-  if (e?.response?.status === 403) return 'Insufficient permissions (admin only)';
-  if (e?.response?.status === 401) return 'Session expired — please log in again';
-  if (e?.message) return e.message;
-  return fallback;
-}
-
-/** Light client-side validation — server re-validates with the same
- *  Pydantic schema the worker uses, this is just the early-warn UX. */
-function validate(p: EmailPersona): string | null {
-  if (!p.name.trim()) return 'name is required';
-  if (!p.email.trim()) return 'email is required';
-  if (!p.email.includes('@') || !p.email.split('@')[1]?.includes('.')) {
-    return 'email must look like user@domain.tld';
-  }
-  if (!p.role.trim()) return 'role is required';
-  if (p.tone === 'custom' && !(p.tone_custom ?? '').trim()) {
-    return 'custom tone requires a description';
-  }
-  if (p.mannerisms.length > 12) return 'at most 12 mannerisms per persona';
-  return null;
-}
-
-// ─── Bulk upload helpers ──────────────────────────────────────────────────
-
-const TEMPLATE: { personas: EmailPersona[] } = {
-  personas: [
-    {
-      name: 'Jane Operator',
-      email: 'jane@example.com',
-      role: 'Network Admin',
-      tone: 'formal',
-      tone_custom: null,
-      mannerisms: ["uses bullet points", "signs off with 'Best regards'"],
-      language: 'en',
-      signature: 'Jane Operator\nNetwork Admin',
-      active_hours: '09:00-18:00',
-      reply_latency: 'normal',
-      uses_llms_heavily: false,
-    },
-  ],
-};
-
-/** Soft client-side normalizer for an uploaded persona entry.
- *  Mirrors the Pydantic rules in decnet/realism/personas.py.
- *  Server re-validates on save, so this is just early-warn UX. */
-function coercePersona(raw: unknown): { ok: EmailPersona } | { error: string } {
-  if (!raw || typeof raw !== 'object') return { error: 'entry is not an object' };
-  const r = raw as Record<string, unknown>;
-  const name = typeof r.name === 'string' ? r.name.trim() : '';
-  const email = typeof r.email === 'string' ? r.email.trim() : '';
-  const role = typeof r.role === 'string' ? r.role.trim() : '';
-  if (!name) return { error: 'missing name' };
-  if (!email) return { error: 'missing email' };
-  if (!email.includes('@') || !email.split('@')[1]?.includes('.')) {
-    return { error: `invalid email "${email}"` };
-  }
-  if (!role) return { error: 'missing role' };
-  const tone = TONES.includes(r.tone as Tone) ? (r.tone as Tone) : 'formal';
-  const tone_custom = typeof r.tone_custom === 'string' && r.tone_custom.trim()
-    ? r.tone_custom.slice(0, 128) : null;
-  if (tone === 'custom' && !tone_custom) {
-    return { error: 'tone="custom" requires a non-empty tone_custom' };
-  }
-  const reply_latency = LATENCIES.includes(r.reply_latency as ReplyLatency)
-    ? (r.reply_latency as ReplyLatency) : 'normal';
-  const mannerisms = Array.isArray(r.mannerisms)
-    ? r.mannerisms.filter((m): m is string => typeof m === 'string').slice(0, 12)
-    : [];
-  const language = typeof r.language === 'string' && r.language
-    ? r.language.slice(0, 8) : null;
-  const signature = typeof r.signature === 'string' && r.signature
-    ? r.signature : null;
-  const active_hours = typeof r.active_hours === 'string' && r.active_hours
-    ? r.active_hours : '09:00-18:00';
-  return {
-    ok: {
-      name, email, role, tone, tone_custom, mannerisms, language, signature,
-      active_hours, reply_latency,
-      uses_llms_heavily: r.uses_llms_heavily === true,
-    },
-  };
-}
-
-interface MergeResult {
-  merged: EmailPersona[];
-  added: number;
-  replaced: number;
-}
-
-/** Dedupe by lowercased email; uploaded entries replace existing matches. */
-function mergePersonas(current: EmailPersona[], incoming: EmailPersona[]): MergeResult {
-  const byEmail = new Map<string, EmailPersona>();
-  for (const p of current) byEmail.set(p.email.toLowerCase(), p);
-  let added = 0;
-  let replaced = 0;
-  for (const p of incoming) {
-    const key = p.email.toLowerCase();
-    if (byEmail.has(key)) replaced += 1;
-    else added += 1;
-    byEmail.set(key, p);
-  }
-  return { merged: Array.from(byEmail.values()), added, replaced };
-}
-
-// ─── Persona card ─────────────────────────────────────────────────────────
-
-interface PersonaCardProps {
-  persona: EmailPersona;
-  onEdit: () => void;
-  onRemove: () => void;
-}
-
-const PersonaCard: React.FC<PersonaCardProps> = ({ persona: p, onEdit, onRemove }) => (
-  <div className="decky-card persona-card">
-    <div className="decky-head">
-      <div className="decky-name">
-        <span className={`status-dot ${p.uses_llms_heavily ? 'mutating' : 'active'}`} />
-        {p.name}
-      </div>
-      <span className="decky-ip">{p.email}</span>
-    </div>
-
-    <div className="decky-meta">
-      <div className="row">
-        <span className="label">ROLE</span>
-        <span>{p.role}</span>
-      </div>
-      <div className="row">
-        <span className="label">TONE</span>
-        <span
-          className={`tone-chip tone-${p.tone}`}
-          title={p.tone === 'custom' ? (p.tone_custom ?? '') : undefined}
-        >
-          {p.tone === 'custom' && p.tone_custom
-            ? (p.tone_custom.length > 24 ? `${p.tone_custom.slice(0, 22)}…` : p.tone_custom)
-            : p.tone}
-        </span>
-      </div>
-      <div className="row">
-        <span className="label">LANG</span>
-        <span className="dim">{(p.language ?? 'en').toUpperCase()}</span>
-      </div>
-      <div className="row">
-        <span className="label">HOURS</span>
-        <span className="mono">{p.active_hours}</span>
-      </div>
-      <div className="row">
-        <span className="label">REPLY</span>
-        <span className="violet-accent">{p.reply_latency}</span>
-      </div>
-    </div>
-
-    <div>
-      <div className="type-label" style={{ marginBottom: 6, opacity: 0.5, fontSize: '0.62rem', letterSpacing: 1 }}>
-        MANNERISMS
-      </div>
-      <div className="decky-services">
-        {p.mannerisms.length === 0 ? (
-          <span className="dim" style={{ fontSize: '0.7rem' }}>—</span>
-        ) : (
-          p.mannerisms.map((m, i) => (
-            <span key={i} className="service-tag" title={m}>
-              {m.length > 24 ? `${m.slice(0, 22)}…` : m}
-            </span>
-          ))
-        )}
-      </div>
-    </div>
-
-    <div className="decky-footer">
-      <span className="decky-hits">
-        {p.uses_llms_heavily ? (
-          <span className="alert-text" style={{ fontWeight: 700 }} title="Em-dash suppression lifted">
-            LLM-HEAVY
-          </span>
-        ) : (
-          <span className="dim">SUPPRESSED EM-DASH</span>
-        )}
-      </span>
-      <div style={{ display: 'flex', gap: 6 }}>
-        <button className="btn small" onClick={onEdit} title={`Edit ${p.name}`}>
-          <Pencil size={10} /> EDIT
-        </button>
-        <button className="btn alert small" onClick={onRemove} title={`Remove ${p.name}`}>
-          <Trash2 size={10} /> REMOVE
-        </button>
-      </div>
-    </div>
-  </div>
-);
-
-// ─── Editor modal ─────────────────────────────────────────────────────────
-
-interface PersonaEditorProps {
-  open: boolean;
-  editing: boolean;
-  draft: EmailPersona;
-  setDraft: (p: EmailPersona) => void;
-  draftError: string | null;
-  mannerismDraft: string;
-  setMannerismDraft: (s: string) => void;
-  onClose: () => void;
-  onSave: () => void;
-}
-
-const PersonaEditor: React.FC<PersonaEditorProps> = ({
-  open, editing, draft, setDraft, draftError,
-  mannerismDraft, setMannerismDraft, onClose, onSave,
-}) => {
-  const addMannerism = () => {
-    const t = mannerismDraft.trim();
-    if (!t) return;
-    if (draft.mannerisms.includes(t)) {
-      setMannerismDraft('');
-      return;
-    }
-    setDraft({ ...draft, mannerisms: [...draft.mannerisms, t] });
-    setMannerismDraft('');
-  };
-
-  const removeMannerism = (idx: number) => {
-    setDraft({
-      ...draft,
-      mannerisms: draft.mannerisms.filter((_, i) => i !== idx),
-    });
-  };
-
-  return (
-    <Modal
-      open={open}
-      onClose={onClose}
-      title={editing ? 'EDIT PERSONA' : 'ADD PERSONA'}
-      icon={Mail}
-      accent="violet"
-      width="wide"
-      footer={
-        <>
-          <button className="btn ghost" onClick={onClose}>CANCEL</button>
-          <button className="btn violet" onClick={onSave}>
-            <Check size={12} /> {editing ? 'UPDATE' : 'ADD'}
-          </button>
-        </>
-      }
-    >
-      <div className="modal-body">
-        <div className="grid-2">
-          <div className="tweak-group">
-            <label>NAME *</label>
-            <input
-              className="input"
-              type="text"
-              value={draft.name}
-              onChange={(e) => setDraft({ ...draft, name: e.target.value })}
-              placeholder="John Smith"
-            />
-          </div>
-          <div className="tweak-group">
-            <label>EMAIL *</label>
-            <input
-              className="input"
-              type="email"
-              value={draft.email}
-              onChange={(e) => setDraft({ ...draft, email: e.target.value })}
-              placeholder="john.smith@corp.com"
-            />
-          </div>
-        </div>
-
-        <div className="tweak-group">
-          <label>ROLE *</label>
-          <input
-            className="input"
-            type="text"
-            value={draft.role}
-            onChange={(e) => setDraft({ ...draft, role: e.target.value })}
-            placeholder="Chief Operating Officer"
-          />
-        </div>
-
-        <div className="grid-2">
-          <div className="tweak-group">
-            <label>TONE</label>
-            <select
-              className="input"
-              value={draft.tone}
-              onChange={(e) => setDraft({ ...draft, tone: e.target.value as Tone })}
-            >
-              {TONES.map((t) => <option key={t} value={t}>{t}</option>)}
-            </select>
-            {draft.tone === 'custom' && (
-              <input
-                className="input"
-                type="text"
-                maxLength={128}
-                style={{ marginTop: 6 }}
-                value={draft.tone_custom ?? ''}
-                onChange={(e) =>
-                  setDraft({ ...draft, tone_custom: e.target.value || null })
-                }
-                placeholder="e.g. terse, deadpan, sarcastic-but-polite"
-              />
-            )}
-          </div>
-          <div className="tweak-group">
-            <label>LANGUAGE</label>
-            <input
-              className="input"
-              type="text"
-              maxLength={8}
-              value={draft.language ?? ''}
-              onChange={(e) => setDraft({ ...draft, language: e.target.value || null })}
-              placeholder="en"
-            />
-          </div>
-          <div className="tweak-group">
-            <label>REPLY LATENCY</label>
-            <select
-              className="input"
-              value={draft.reply_latency}
-              onChange={(e) =>
-                setDraft({ ...draft, reply_latency: e.target.value as ReplyLatency })
-              }
-            >
-              {LATENCIES.map((l) => <option key={l} value={l}>{l}</option>)}
-            </select>
-          </div>
-          <div className="tweak-group">
-            <label>ACTIVE HOURS</label>
-            <input
-              className="input"
-              type="text"
-              value={draft.active_hours}
-              onChange={(e) => setDraft({ ...draft, active_hours: e.target.value })}
-              placeholder="09:00-18:00 (wraps OK)"
-            />
-          </div>
-        </div>
-
-        <div className="tweak-group">
-          <label>MANNERISMS ({draft.mannerisms.length}/12)</label>
-          <div style={{ display: 'flex', gap: 8 }}>
-            <input
-              className="input"
-              type="text"
-              style={{ flex: 1 }}
-              value={mannerismDraft}
-              onChange={(e) => setMannerismDraft(e.target.value)}
-              onKeyDown={(e) => {
-                if (e.key === 'Enter') {
-                  e.preventDefault();
-                  addMannerism();
-                }
-              }}
-              placeholder="opens with 'Hey' not 'Dear'"
-            />
-            <button
-              type="button"
-              className="btn ghost"
-              onClick={addMannerism}
-              disabled={!mannerismDraft.trim() || draft.mannerisms.length >= 12}
-            >
-              <Plus size={12} /> ADD
-            </button>
-          </div>
-          {draft.mannerisms.length > 0 && (
-            <div className="decky-services" style={{ marginTop: 8 }}>
-              {draft.mannerisms.map((m, i) => (
-                <span
-                  key={i}
-                  className="service-tag"
-                  style={{ cursor: 'pointer' }}
-                  onClick={() => removeMannerism(i)}
-                  title="click to remove"
-                >
-                  {m} ✕
-                </span>
-              ))}
-            </div>
-          )}
-        </div>
-
-        <div className="tweak-group">
-          <label>SIGNATURE (optional)</label>
-          <textarea
-            className="input"
-            rows={3}
-            style={{ resize: 'vertical', fontFamily: 'var(--font-mono)' }}
-            value={draft.signature ?? ''}
-            onChange={(e) => setDraft({ ...draft, signature: e.target.value || null })}
-            placeholder="-- John&#10;COO, ACME Corp"
-          />
-        </div>
-
-        <div
-          style={{
-            display: 'flex', gap: 10, alignItems: 'center',
-            padding: 14, border: '1px solid var(--border)',
-          }}
-        >
-          <input
-            id="llm-heavy"
-            type="checkbox"
-            checked={draft.uses_llms_heavily}
-            onChange={(e) => setDraft({ ...draft, uses_llms_heavily: e.target.checked })}
-            style={{ accentColor: 'var(--violet)' }}
-          />
-          <label htmlFor="llm-heavy" style={{ fontSize: '0.78rem', letterSpacing: 1 }}>
-            <strong>USES LLMS HEAVILY</strong>
-            <span className="dim" style={{ marginLeft: 8, letterSpacing: 0 }}>
-              em-dash suppression lifted; output may contain natural em-dashes
-            </span>
-          </label>
-        </div>
-
-        {draftError && (
-          <div
-            style={{
-              border: '1px solid var(--alert)',
-              color: 'var(--alert)',
-              padding: '8px 12px',
-              fontSize: '0.75rem',
-              letterSpacing: 1,
-              display: 'inline-flex',
-              gap: 8,
-              alignItems: 'center',
-            }}
-          >
-            <AlertTriangle size={12} /> {draftError}
-          </div>
-        )}
-      </div>
-    </Modal>
-  );
-};
-
-// ─── Page ─────────────────────────────────────────────────────────────────
-
-interface PersonaGenerationProps {
+interface Props {
   /** When set, the editor manages the personas attached to the given
    *  topology row (Topology.email_personas) instead of the global
    *  fleet/SWARM pool.  The component negotiates this with two
@@ -500,23 +22,17 @@ interface PersonaGenerationProps {
   topologyId?: string;
 }
 
-const PersonaGeneration: React.FC<PersonaGenerationProps> = ({ topologyId }) => {
+const PersonaGeneration: React.FC<Props> = ({ topologyId }) => {
   const { push } = useToast();
   const isTopology = Boolean(topologyId);
-  const endpoint = isTopology
-    ? `/topologies/${topologyId}/personas`
-    : '/realism/personas';
+  const data = usePersonaGeneration(topologyId);
+  const {
+    personas, path, topoName, languageDefault, loading, error, setError,
+    persistPersonas,
+  } = data;
 
-  const [path, setPath] = useState<string>('');
-  const [topoName, setTopoName] = useState<string>('');
-  const [languageDefault, setLanguageDefault] = useState<string>('en');
-  const [personas, setPersonas] = useState<EmailPersona[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
   const [filter, setFilter] = useState<FilterKey>('all');
-
   const fileRef = useRef<HTMLInputElement>(null);
-
   const [modalOpen, setModalOpen] = useState(false);
   const [editingIdx, setEditingIdx] = useState<number | null>(null);
   const [draft, setDraft] = useState<EmailPersona>(BLANK);
@@ -537,25 +53,6 @@ const PersonaGeneration: React.FC<PersonaGenerationProps> = ({ topologyId }) =>
     [personas, filter],
   );
 
-  const fetchPersonas = async () => {
-    setLoading(true);
-    setError(null);
-    try {
-      const res = await api.get<PersonasResponse>(endpoint);
-      const list = res.data.personas ?? [];
-      setPersonas(list);
-      setPath(res.data.path ?? '');
-      setTopoName(res.data.topology_name ?? '');
-      setLanguageDefault(res.data.language_default ?? 'en');
-    } catch (err) {
-      setError(extractErrorDetail(err, 'Failed to load personas'));
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  useEffect(() => { fetchPersonas(); /* eslint-disable-next-line */ }, [endpoint]);
-
   const openAdd = () => {
     setEditingIdx(null);
     setDraft({ ...BLANK });
@@ -580,31 +77,16 @@ const PersonaGeneration: React.FC<PersonaGenerationProps> = ({ topologyId }) =>
     setDraftError(null);
   };
 
-  /** PUT *next* and adopt the server's parsed result on success.
-   *  Returns true if the write committed.  Persona changes are saved
-   *  eagerly (no SAVE/DISCARD staging) so each CRUD action is one round-
-   *  trip; on failure we leave the local list untouched so the UI never
-   *  shows phantom rows. */
-  const persistPersonas = async (
-    next: EmailPersona[],
-    successText: string,
-  ): Promise<boolean> => {
-    setError(null);
-    try {
-      const res = await api.put<PersonasResponse>(endpoint, { personas: next });
-      const list = res.data.personas ?? [];
-      setPersonas(list);
-      setPath(res.data.path ?? path);
-      setTopoName(res.data.topology_name ?? topoName);
-      setLanguageDefault(res.data.language_default ?? languageDefault);
+  /** Thin wrapper over the data-hook persist: handles toast/announce
+   *  policy here since the hook itself stays UI-free. */
+  const persist = async (next: EmailPersona[], successText: string): Promise<boolean> => {
+    const r = await persistPersonas(next);
+    if (r.ok) {
       push({ text: successText, tone: 'matrix', icon: 'check' });
       return true;
-    } catch (err) {
-      const msg = extractErrorDetail(err, 'Failed to save personas');
-      setError(msg);
-      push({ text: msg.toUpperCase(), tone: 'alert', icon: 'alert-triangle' });
-      return false;
     }
+    push({ text: (r.reason ?? 'Failed').toUpperCase(), tone: 'alert', icon: 'alert-triangle' });
+    return false;
   };
 
   const saveDraft = async () => {
@@ -626,7 +108,7 @@ const PersonaGeneration: React.FC<PersonaGenerationProps> = ({ topologyId }) =>
       next = personas.slice();
       next[editingIdx] = draft;
     }
-    const ok = await persistPersonas(
+    const ok = await persist(
       next,
       editingIdx === null
         ? `ADDED ${draft.name.toUpperCase()}`
@@ -638,7 +120,7 @@ const PersonaGeneration: React.FC<PersonaGenerationProps> = ({ topologyId }) =>
   const removePersona = async (idx: number) => {
     const target = personas[idx];
     if (!confirm(`Remove ${target.name}?`)) return;
-    await persistPersonas(
+    await persist(
       personas.filter((_, i) => i !== idx),
       `REMOVED ${target.name.toUpperCase()}`,
     );
@@ -706,7 +188,7 @@ const PersonaGeneration: React.FC<PersonaGenerationProps> = ({ topologyId }) =>
       if (replaced) parts.push(`${replaced} replaced`);
       if (skipped) parts.push(`${skipped} skipped`);
       const summary = `IMPORTED ${accepted.length} PERSONA${accepted.length === 1 ? '' : 'S'} (${parts.join(', ')})`;
-      void persistPersonas(merged, summary).then((ok) => {
+      void persist(merged, summary).then((ok) => {
         if (ok && skipped) {
           // Persisted, but show *why* some were dropped so the operator
           // can fix the source file.
diff --git a/decnet_web/vite.config.ts b/decnet_web/vite.config.ts
index 7b8eeafd..cfdc6bfb 100644
--- a/decnet_web/vite.config.ts
+++ b/decnet_web/vite.config.ts
@@ -15,16 +15,16 @@ export default defineConfig({
       include: ['src/**/*.{ts,tsx}'],
       exclude: ['src/**/*.d.ts', 'src/test/**', 'src/main.tsx'],
       // Baseline floors. Each refactor PR raises these; never lower.
-      // Phase 5 (MazeNET trim): page shell down from 980 to 715 LOC
-      // (already partially modular; lifted fullscreen, topology data
-      // plane, and context-menu builder into focused hooks).
-      // 16 new tests. Suite: 37 files, 172 tests,
-      // 19.49% lines / 14.67% branches.
+      // Phase 6 (PersonaGeneration trim): page shell down from 875 to
+      // 357 LOC. Lifted helpers, PersonaCard, PersonaEditor, and a
+      // usePersonaGeneration data hook (GET/PUT, global + topology
+      // endpoints). 18 new tests. Suite: 40 files, 190 tests,
+      // 20.83% lines / 16.3% branches.
       thresholds: {
-        lines: 19,
+        lines: 20,
         functions: 17,
-        branches: 14,
-        statements: 18,
+        branches: 16,
+        statements: 19,
       },
     },
   },