arkaos 3.70.5 → 3.70.7

package/VERSION

@@ -1 +1 @@
-3.70.5
+3.70.7

package/dashboard/app/pages/terminal.vue

@@ -101,10 +101,17 @@ watch(searchResults, () => {
   searchSelectedIdx.value = 0
 })
 
+const searchInputEl = ref<HTMLInputElement | null>(null)
+
 function openSearch() {
   searchOpen.value = true
   searchQuery.value = ''
   searchSelectedIdx.value = 0
+  // autofocus on the bare input only fires on initial mount; the modal
+  // is mounted persistently, so we focus explicitly each time it opens.
+  nextTick(() => {
+    requestAnimationFrame(() => searchInputEl.value?.focus())
+  })
 }
 
 function pickFromSearch(cmd: string) {
@@ -392,22 +399,18 @@ const showHistory = ref(false)
             No matches for
             <span class="font-mono text-default">{{ sidebarFilter }}</span>.
           </div>
-          <ul v-else class="divide-y divide-default">
+          <ul v-else class="py-1">
             <li
               v-for="entry in visibleHistory"
               :key="entry.ts"
-              class="group px-3 py-1.5 hover:bg-elevated/40 cursor-pointer flex items-center gap-2"
+              class="group mx-1 px-2.5 py-1 rounded-md cursor-pointer flex items-center gap-2 hover:bg-elevated/40 transition-colors"
               :title="`${entry.cmd} — ${relativeTime(entry.ts)}`"
               @click="sendToActive(entry.cmd)"
             >
-              <UIcon
-                name="i-lucide-chevron-right"
-                class="size-3 shrink-0 text-muted group-hover:text-primary"
-              />
               <span class="flex-1 min-w-0 font-mono text-xs truncate">
                 {{ entry.cmd }}
               </span>
-              <span class="text-[10px] text-muted shrink-0 tabular-nums opacity-0 group-hover:opacity-100 transition-opacity">
+              <span class="text-[10px] text-muted/70 shrink-0 tabular-nums opacity-0 group-hover:opacity-100 transition-opacity">
                 {{ relativeTime(entry.ts) }}
               </span>
               <UIcon
@@ -431,112 +434,125 @@ const showHistory = ref(false)
 
     <UModal
       v-model:open="searchOpen"
-      :ui="{ content: 'max-w-2xl' }"
+      :ui="{ content: 'max-w-2xl ring-0 shadow-2xl' }"
     >
       <template #content>
-        <UCard :ui="{ body: 'p-0', header: 'px-4 py-3', footer: 'px-4 py-2.5' }">
-          <template #header>
-            <div class="flex items-center gap-3">
-              <UIcon name="i-lucide-history" class="size-5 text-muted shrink-0" />
-              <UInput
-                v-model="searchQuery"
-                placeholder="Filter command history…"
-                size="lg"
-                autofocus
-                :ui="{ root: 'flex-1', base: 'border-0 shadow-none ring-0 focus:ring-0 px-0' }"
-                @keydown="searchKeydown"
-              />
-              <span class="text-xs text-muted shrink-0 tabular-nums">
-                {{ searchResults.length }} / {{ history.length }}
-              </span>
-              <kbd class="px-1.5 py-0.5 rounded bg-elevated/50 text-xs font-mono text-muted shrink-0">
-                esc
-              </kbd>
-            </div>
-          </template>
+        <div class="rounded-xl bg-default overflow-hidden">
+          <div class="flex items-center gap-3 px-4 py-3 border-b border-default/60">
+            <UIcon name="i-lucide-history" class="size-4 text-muted shrink-0" />
+            <input
+              ref="searchInputEl"
+              v-model="searchQuery"
+              type="text"
+              autofocus
+              placeholder="Filter command history…"
+              class="palette-input flex-1 bg-transparent text-default placeholder:text-muted/70 focus:outline-none border-0 ring-0 text-sm"
+              @keydown="searchKeydown"
+            >
+            <span class="text-[11px] text-muted/70 shrink-0 tabular-nums">
+              {{ searchResults.length }} of {{ history.length }}
+            </span>
+          </div>
 
           <div class="max-h-[60vh] overflow-y-auto">
             <div
               v-if="history.length === 0"
-              class="p-10 text-center text-sm text-muted"
+              class="px-6 py-12 text-center text-sm text-muted"
             >
-              <UIcon name="i-lucide-terminal" class="size-8 mx-auto mb-3 opacity-50" />
+              <UIcon name="i-lucide-terminal" class="size-7 mx-auto mb-3 opacity-30" />
               <p>No commands yet.</p>
-              <p class="text-xs mt-1">
+              <p class="text-xs mt-1 opacity-70">
                 Run something in the terminal — it'll show up here.
               </p>
             </div>
             <div
               v-else-if="searchResults.length === 0"
-              class="p-10 text-center text-sm text-muted"
+              class="px-6 py-12 text-center text-sm text-muted"
             >
               No match for
               <span class="font-mono text-default">{{ searchQuery }}</span>.
             </div>
-            <ul v-else class="divide-y divide-default">
+            <ul v-else class="py-1">
               <li
                 v-for="(entry, i) in searchResults"
                 :key="entry.ts"
-                class="px-4 py-2 cursor-pointer transition-colors flex items-center gap-3"
+                class="mx-1 px-3 py-1.5 rounded-md cursor-pointer flex items-center gap-3 transition-colors"
                 :class="i === searchSelectedIdx
-                  ? 'bg-primary/10 border-l-2 border-primary pl-[14px]'
-                  : 'hover:bg-elevated/40 border-l-2 border-transparent'"
+                  ? 'bg-elevated/70'
+                  : 'hover:bg-elevated/30'"
                 @click="pickFromSearch(entry.cmd)"
                 @mouseenter="searchSelectedIdx = i"
               >
-                <UIcon
-                  name="i-lucide-chevron-right"
-                  class="size-3.5 shrink-0"
-                  :class="i === searchSelectedIdx ? 'text-primary' : 'text-muted'"
-                />
                 <span class="flex-1 min-w-0 font-mono text-sm truncate">
                   {{ entry.cmd }}
                 </span>
-                <span class="text-xs text-muted shrink-0 tabular-nums">
+                <span class="text-[11px] text-muted/70 shrink-0 tabular-nums">
                   {{ relativeTime(entry.ts) }}
                 </span>
-                <kbd
-                  v-if="i === searchSelectedIdx"
-                  class="px-1.5 py-0.5 rounded bg-primary/20 text-[10px] font-mono text-primary shrink-0"
-                >
-                  ↵ send
-                </kbd>
+                <UIcon
+                  name="i-lucide-corner-down-left"
+                  class="size-3.5 shrink-0 transition-opacity"
+                  :class="i === searchSelectedIdx ? 'text-default opacity-100' : 'text-muted opacity-0'"
+                />
               </li>
             </ul>
           </div>
 
-          <template #footer>
-            <div class="text-xs text-muted flex items-center gap-4">
-              <span class="flex items-center gap-1">
-                <kbd class="px-1.5 py-0.5 rounded bg-elevated/50 font-mono">↑</kbd>
-                <kbd class="px-1.5 py-0.5 rounded bg-elevated/50 font-mono">↓</kbd>
-                navigate
-              </span>
-              <span class="flex items-center gap-1">
-                <kbd class="px-1.5 py-0.5 rounded bg-elevated/50 font-mono">↵</kbd>
-                send to active session
-              </span>
-              <span class="flex items-center gap-1">
-                <kbd class="px-1.5 py-0.5 rounded bg-elevated/50 font-mono">esc</kbd>
-                close
-              </span>
-              <UButton
-                v-if="history.length > 0"
-                size="xs"
-                variant="ghost"
-                color="error"
-                icon="i-lucide-trash-2"
-                class="ml-auto"
-                @click="clearHistory"
-              >
-                Clear all
-              </UButton>
-            </div>
-          </template>
-        </UCard>
+          <div class="px-4 py-2.5 border-t border-default/60 flex items-center gap-4 text-[11px] text-muted/80">
+            <span class="flex items-center gap-1.5">
+              <kbd class="palette-kbd">↑</kbd><kbd class="palette-kbd">↓</kbd>
+              navigate
+            </span>
+            <span class="flex items-center gap-1.5">
+              <kbd class="palette-kbd">↵</kbd>
+              send
+            </span>
+            <span class="flex items-center gap-1.5">
+              <kbd class="palette-kbd">esc</kbd>
+              close
+            </span>
+            <button
+              v-if="history.length > 0"
+              class="ml-auto text-muted/80 hover:text-red-400 transition-colors flex items-center gap-1"
+              @click="clearHistory"
+            >
+              <UIcon name="i-lucide-trash-2" class="size-3" />
+              Clear
+            </button>
+          </div>
+        </div>
       </template>
     </UModal>
       </div>
     </template>
   </UDashboardPanel>
 </template>
+
+<style scoped>
+.palette-input {
+  /* Defensive: kill any inherited ring/border from Tailwind base */
+  box-shadow: none !important;
+  outline: none !important;
+}
+.palette-input:focus,
+.palette-input:focus-visible {
+  outline: none !important;
+  box-shadow: none !important;
+  border-color: transparent !important;
+}
+.palette-kbd {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 1.1rem;
+  padding: 0 0.3rem;
+  height: 1.1rem;
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 10px;
+  line-height: 1;
+  border-radius: 4px;
+  background-color: rgb(var(--ui-bg-elevated) / 0.5);
+  color: rgb(var(--ui-text-muted));
+  border: 1px solid rgb(var(--ui-border) / 0.4);
+}
+</style>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "arkaos",
-  "version": "3.70.5",
+  "version": "3.70.7",
   "description": "The Operating System for AI Agent Teams",
   "type": "module",
   "bin": {

package/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "arkaos-core"
-version = "3.70.5"
+version = "3.70.7"
 description = "Core engine for ArkaOS — The Operating System for AI Agent Teams"
 readme = "README.md"
 license = {text = "MIT"}

package/dashboard/app/pages/personas.vue

@@ -1,719 +0,0 @@
-<script setup lang="ts">
-import type { Persona } from '~/types'
-
-const { fetchApi, apiBase } = useApi()
-const toast = useToast()
-
-// --- Fetch personas (no await — non-blocking) ---
-const { data, status, error, refresh } = fetchApi<{ personas: Persona[]; total: number }>('/api/personas')
-
-const personas = computed(() => data.value?.personas ?? [])
-
-// PR74 v2.92.0 — detail/edit drawer state
-const detailOpen = ref(false)
-const detailPersonaId = ref<string | null>(null)
-
-// PR77 v2.95.0 — reverse-usage (which agents link to each persona).
-const { data: usageData } = fetchApi<{
-  by_persona: Record<string, { agent_count: number, agent_ids: string[] }>
-}>('/api/personas/usage')
-
-function personaAgentCount(personaId: string): number {
-  return usageData.value?.by_persona?.[personaId]?.agent_count ?? 0
-}
-
-function mbtiGradient(mbti: string | undefined): string {
-  if (!mbti) return 'bg-gradient-to-br from-muted/20 to-muted/5'
-  const code = mbti.toUpperCase()
-  if (['INTJ', 'INTP', 'ENTJ', 'ENTP'].includes(code))
-    return 'bg-gradient-to-br from-blue-500/25 to-indigo-600/10'
-  if (['INFJ', 'INFP', 'ENFJ', 'ENFP'].includes(code))
-    return 'bg-gradient-to-br from-emerald-500/25 to-teal-600/10'
-  if (['ISTJ', 'ISFJ', 'ESTJ', 'ESFJ'].includes(code))
-    return 'bg-gradient-to-br from-amber-500/25 to-orange-600/10'
-  if (['ISTP', 'ISFP', 'ESTP', 'ESFP'].includes(code))
-    return 'bg-gradient-to-br from-rose-500/25 to-pink-600/10'
-  return 'bg-gradient-to-br from-primary/20 to-primary/5'
-}
-
-function personaInitials(name: string): string {
-  if (!name) return '·'
-  const parts = name.trim().split(/\s+/)
-  if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase()
-  return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase()
-}
-
-function openDetail(persona: Persona) {
-  detailPersonaId.value = persona.id
-  detailOpen.value = true
-}
-
-async function onDetailSaved() {
-  await refresh()
-}
-
-async function onDetailDeleted(_id: string) {
-  await refresh()
-}
-
-// --- Creation mode ---
-// PR62 v2.79.0 — three modes: list (default), wizard (AI builder), manual.
-// The wizard is the new primary path; manual stays as fallback for
-// operators who want to type every DNA field by hand.
-type CreateMode = 'list' | 'wizard' | 'manual'
-const createMode = ref<CreateMode>('list')
-const showForm = computed(() => createMode.value === 'manual')
-
-function startWizard() {
-  createMode.value = 'wizard'
-}
-
-function startManual() {
-  createMode.value = 'manual'
-}
-
-function cancelCreation() {
-  createMode.value = 'list'
-}
-
-async function onWizardComplete() {
-  createMode.value = 'list'
-  await refresh()
-}
-
-// --- Form state ---
-function defaultForm() {
-  return {
-    name: '',
-    title: '',
-    source: '',
-    tagline: '',
-    mbti: '',
-    disc_primary: '',
-    disc_secondary: '',
-    enneagram_type: '',
-    enneagram_wing: '',
-    big_five_o: 50,
-    big_five_c: 50,
-    big_five_e: 50,
-    big_five_a: 50,
-    big_five_n: 50,
-    mental_models: '',
-    expertise_domains: '',
-    frameworks: '',
-    communication_tone: '',
-  }
-}
-
-const form = ref(defaultForm())
-const creating = ref(false)
-
-// --- Options ---
-const mbtiTypes = [
-  'INTJ', 'INTP', 'ENTJ', 'ENTP',
-  'INFJ', 'INFP', 'ENFJ', 'ENFP',
-  'ISTJ', 'ISFJ', 'ESTJ', 'ESFJ',
-  'ISTP', 'ISFP', 'ESTP', 'ESFP',
-].map(t => ({ label: t, value: t }))
-
-const discTypes = [
-  { label: 'D — Dominance', value: 'D' },
-  { label: 'I — Influence', value: 'I' },
-  { label: 'S — Steadiness', value: 'S' },
-  { label: 'C — Conscientiousness', value: 'C' },
-]
-
-const enneagramTypes = Array.from({ length: 9 }, (_, i) => ({
-  label: `Type ${i + 1}`,
-  value: String(i + 1),
-}))
-
-const departmentOptions = [
-  'dev', 'marketing', 'brand', 'finance', 'strategy',
-  'ecom', 'kb', 'ops', 'pm', 'saas',
-  'landing', 'content', 'community', 'sales', 'leadership', 'org',
-].map(d => ({ label: d, value: d }))
-
-const tierOptions = [
-  { label: 'Tier 1 — Squad Leads', value: '1' },
-  { label: 'Tier 2 — Specialists', value: '2' },
-  { label: 'Tier 3 — Support', value: '3' },
-]
-
-// --- Create persona ---
-async function createPersona() {
-  if (!form.value.name.trim()) return
-
-  creating.value = true
-  try {
-    await $fetch(`${apiBase}/api/personas`, {
-      method: 'POST',
-      body: {
-        name: form.value.name,
-        title: form.value.title,
-        source: form.value.source,
-        tagline: form.value.tagline,
-        mbti: form.value.mbti,
-        disc: {
-          primary: form.value.disc_primary,
-          secondary: form.value.disc_secondary,
-        },
-        enneagram: {
-          type: form.value.enneagram_type ? Number(form.value.enneagram_type) : null,
-          wing: form.value.enneagram_wing ? Number(form.value.enneagram_wing) : null,
-        },
-        big_five: {
-          openness: form.value.big_five_o,
-          conscientiousness: form.value.big_five_c,
-          extraversion: form.value.big_five_e,
-          agreeableness: form.value.big_five_a,
-          neuroticism: form.value.big_five_n,
-        },
-        mental_models: form.value.mental_models
-          ? form.value.mental_models.split(',').map(s => s.trim()).filter(Boolean)
-          : [],
-        expertise_domains: form.value.expertise_domains
-          ? form.value.expertise_domains.split(',').map(s => s.trim()).filter(Boolean)
-          : [],
-        frameworks: form.value.frameworks
-          ? form.value.frameworks.split(',').map(s => s.trim()).filter(Boolean)
-          : [],
-        communication: {
-          tone: form.value.communication_tone,
-        },
-      },
-    })
-
-    toast.add({ title: 'Persona created', description: `${form.value.name} has been added.`, color: 'success' })
-    form.value = defaultForm()
-    showForm.value = false
-    await refresh()
-  } catch {
-    toast.add({ title: 'Error', description: 'Failed to create persona.', color: 'error' })
-  } finally {
-    creating.value = false
-  }
-}
-
-// --- Delete persona ---
-const deleting = ref<string | null>(null)
-
-async function deletePersona(persona: Persona) {
-  deleting.value = persona.id
-  try {
-    await $fetch(`${apiBase}/api/personas/${persona.id}`, { method: 'DELETE' })
-    toast.add({ title: 'Persona deleted', description: `${persona.name} has been removed.`, color: 'success' })
-    await refresh()
-  } catch {
-    toast.add({ title: 'Error', description: 'Failed to delete persona.', color: 'error' })
-  } finally {
-    deleting.value = null
-  }
-}
-
-// --- Clone to agent (inline expansion, no modal) ---
-const cloneExpandedId = ref<string | null>(null)
-const cloneDepartment = ref('')
-const cloneTier = ref('')
-const cloning = ref(false)
-
-function toggleClone(persona: Persona) {
-  if (cloneExpandedId.value === persona.id) {
-    cloneExpandedId.value = null
-  } else {
-    cloneExpandedId.value = persona.id
-    cloneDepartment.value = ''
-    cloneTier.value = ''
-  }
-}
-
-async function cloneToAgent(persona: Persona) {
-  if (!cloneDepartment.value || !cloneTier.value) return
-
-  cloning.value = true
-  try {
-    await $fetch(`${apiBase}/api/personas/${persona.id}/clone`, {
-      method: 'POST',
-      body: {
-        department: cloneDepartment.value,
-        tier: Number(cloneTier.value),
-      },
-    })
-    toast.add({
-      title: 'Agent created',
-      description: `${persona.name} cloned to ${cloneDepartment.value} department.`,
-      color: 'success',
-    })
-    cloneExpandedId.value = null
-    await refresh()
-  } catch {
-    toast.add({ title: 'Error', description: 'Failed to clone persona to agent.', color: 'error' })
-  } finally {
-    cloning.value = false
-  }
-}
-
-// --- DNA badge colors ---
-function mbtiColor(mbti: string): string {
-  if (!mbti) return 'neutral'
-  const analysts = ['INTJ', 'INTP', 'ENTJ', 'ENTP']
-  const diplomats = ['INFJ', 'INFP', 'ENFJ', 'ENFP']
-  const sentinels = ['ISTJ', 'ISFJ', 'ESTJ', 'ESFJ']
-  if (analysts.includes(mbti)) return 'primary'
-  if (diplomats.includes(mbti)) return 'success'
-  if (sentinels.includes(mbti)) return 'warning'
-  return 'error'
-}
-
-function discColor(disc: string): string {
-  const colors: Record<string, string> = { D: 'error', I: 'warning', S: 'success', C: 'primary' }
-  return colors[disc] ?? 'neutral'
-}
-</script>
-
-<template>
-  <UDashboardPanel id="personas">
-    <template #header>
-      <UDashboardNavbar title="Personas">
-        <template #leading>
-          <UDashboardSidebarCollapse />
-        </template>
-
-        <template #trailing>
-          <UBadge v-if="data?.total" :label="data.total" variant="subtle" />
-        </template>
-
-        <template #right>
-          <UButton
-            v-if="createMode === 'list'"
-            label="AI Builder"
-            icon="i-lucide-sparkles"
-            color="primary"
-            size="sm"
-            @click="startWizard"
-          />
-          <UButton
-            v-if="createMode === 'list'"
-            label="Manual"
-            icon="i-lucide-plus"
-            variant="outline"
-            size="sm"
-            class="ml-2"
-            @click="startManual"
-          />
-          <UButton
-            v-else
-            label="Back to list"
-            icon="i-lucide-arrow-left"
-            variant="ghost"
-            size="sm"
-            @click="cancelCreation"
-          />
-        </template>
-      </UDashboardNavbar>
-    </template>
-
-    <template #body>
-      <div class="overflow-y-auto h-[calc(100vh-4rem)]">
-      <!-- Loading -->
-      <div v-if="status === 'pending'" class="flex items-center justify-center py-12" aria-label="Loading personas">
-        <UIcon name="i-lucide-loader-2" class="size-8 animate-spin text-muted" />
-      </div>
-
-      <!-- Error -->
-      <div v-else-if="error" class="flex flex-col items-center justify-center gap-4 py-12" role="alert">
-        <UIcon name="i-lucide-alert-triangle" class="size-12 text-red-500" />
-        <p class="text-sm text-muted">Failed to load personas.</p>
-        <UButton label="Retry" variant="outline" color="primary" icon="i-lucide-refresh-cw" @click="refresh()" />
-      </div>
-
-      <!-- Content -->
-      <template v-else>
-        <!-- PR62: AI Persona Wizard -->
-        <PersonaWizard
-          v-if="createMode === 'wizard'"
-          class="mb-8"
-          @completed="onWizardComplete"
-          @cancelled="cancelCreation"
-        />
-
-        <!-- Manual create form (legacy / fallback) -->
-        <UCard v-if="showForm" class="mb-8">
-          <form @submit.prevent="createPersona" class="space-y-8 p-2">
-            <!-- Identity -->
-            <fieldset>
-              <legend class="text-xs font-bold uppercase tracking-widest text-muted mb-4">Identity</legend>
-              <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                <UFormField label="Name" required>
-                  <UInput
-                    v-model="form.name"
-                    placeholder="e.g. Alex Hormozi"
-                    aria-label="Persona name"
-                    class="w-full"
-                    required
-                  />
-                </UFormField>
-                <UFormField label="Title">
-                  <UInput
-                    v-model="form.title"
-                    placeholder="e.g. Business Strategy"
-                    aria-label="Persona title"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Source">
-                  <UInput
-                    v-model="form.source"
-                    placeholder="e.g. Alex Hormozi"
-                    aria-label="Persona source"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Tagline">
-                  <UInput
-                    v-model="form.tagline"
-                    placeholder="e.g. The Natural Commander"
-                    aria-label="Persona tagline"
-                    class="w-full"
-                  />
-                </UFormField>
-              </div>
-            </fieldset>
-
-            <!-- Behavioral DNA -->
-            <fieldset>
-              <legend class="text-xs font-bold uppercase tracking-widest text-muted mb-4">Behavioral DNA</legend>
-              <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
-                <UFormField label="MBTI">
-                  <USelect
-                    v-model="form.mbti"
-                    :items="mbtiTypes"
-                    placeholder="Select MBTI"
-                    aria-label="MBTI type"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="DISC Primary">
-                  <USelect
-                    v-model="form.disc_primary"
-                    :items="discTypes"
-                    placeholder="Primary"
-                    aria-label="DISC primary type"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="DISC Secondary">
-                  <USelect
-                    v-model="form.disc_secondary"
-                    :items="discTypes"
-                    placeholder="Secondary"
-                    aria-label="DISC secondary type"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Enneagram Type">
-                  <USelect
-                    v-model="form.enneagram_type"
-                    :items="enneagramTypes"
-                    placeholder="Type"
-                    aria-label="Enneagram type"
-                    class="w-full"
-                  />
-                </UFormField>
-              </div>
-              <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-4">
-                <UFormField label="Enneagram Wing (1-9)">
-                  <UInput
-                    v-model="form.enneagram_wing"
-                    type="number"
-                    :min="1"
-                    :max="9"
-                    placeholder="e.g. 4"
-                    aria-label="Enneagram wing"
-                    class="w-full"
-                  />
-                </UFormField>
-              </div>
-            </fieldset>
-
-            <!-- Big Five -->
-            <fieldset>
-              <legend class="text-xs font-bold uppercase tracking-widest text-muted mb-4">Big Five / OCEAN (0-100)</legend>
-              <div class="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-5 gap-4">
-                <UFormField label="Openness">
-                  <UInput
-                    v-model.number="form.big_five_o"
-                    type="number"
-                    :min="0"
-                    :max="100"
-                    aria-label="Openness score"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Conscientiousness">
-                  <UInput
-                    v-model.number="form.big_five_c"
-                    type="number"
-                    :min="0"
-                    :max="100"
-                    aria-label="Conscientiousness score"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Extraversion">
-                  <UInput
-                    v-model.number="form.big_five_e"
-                    type="number"
-                    :min="0"
-                    :max="100"
-                    aria-label="Extraversion score"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Agreeableness">
-                  <UInput
-                    v-model.number="form.big_five_a"
-                    type="number"
-                    :min="0"
-                    :max="100"
-                    aria-label="Agreeableness score"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Neuroticism">
-                  <UInput
-                    v-model.number="form.big_five_n"
-                    type="number"
-                    :min="0"
-                    :max="100"
-                    aria-label="Neuroticism score"
-                    class="w-full"
-                  />
-                </UFormField>
-              </div>
-            </fieldset>
-
-            <!-- Knowledge & Communication -->
-            <fieldset>
-              <legend class="text-xs font-bold uppercase tracking-widest text-muted mb-4">Knowledge & Communication</legend>
-              <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                <UFormField label="Mental Models" hint="Comma-separated">
-                  <UInput
-                    v-model="form.mental_models"
-                    placeholder="e.g. Grand Slam Offer, Value Equation"
-                    aria-label="Mental models, comma-separated"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Expertise Domains" hint="Comma-separated">
-                  <UInput
-                    v-model="form.expertise_domains"
-                    placeholder="e.g. business strategy, offer creation"
-                    aria-label="Expertise domains, comma-separated"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Frameworks" hint="Comma-separated">
-                  <UInput
-                    v-model="form.frameworks"
-                    placeholder="e.g. $100M Offers, Value Equation"
-                    aria-label="Frameworks, comma-separated"
-                    class="w-full"
-                  />
-                </UFormField>
-                <UFormField label="Communication Tone">
-                  <UInput
-                    v-model="form.communication_tone"
-                    placeholder="e.g. direct, high-energy"
-                    aria-label="Communication tone"
-                    class="w-full"
-                  />
-                </UFormField>
-              </div>
-            </fieldset>
-
-            <!-- Submit -->
-            <UButton
-              type="submit"
-              label="Create Persona"
-              icon="i-lucide-sparkles"
-              size="lg"
-              block
-              :loading="creating"
-              :disabled="!form.name.trim()"
-            />
-          </form>
-        </UCard>
-
-        <!-- Empty state -->
-        <div v-if="!personas.length && !showForm" class="flex flex-col items-center justify-center gap-6 py-20">
-          <div class="rounded-full bg-muted/10 p-6">
-            <UIcon name="i-lucide-users" class="size-12 text-muted" />
-          </div>
-          <div class="text-center space-y-2">
-            <h3 class="text-base font-semibold">No personas yet</h3>
-            <p class="text-sm text-muted max-w-sm">
-              Personas define the behavioral DNA for your AI agents. Create one to get started.
-            </p>
-          </div>
-          <UButton
-            label="Create your first persona"
-            icon="i-lucide-plus"
-            size="lg"
-            @click="showForm = true"
-          />
-        </div>
-
-        <!-- PR74 v2.92.0 — detail/edit drawer -->
-        <PersonaDetailDrawer
-          v-model="detailOpen"
-          :persona-id="detailPersonaId"
-          @saved="onDetailSaved"
-          @deleted="onDetailDeleted"
-        />
-
-        <!-- Personas Grid -->
-        <div v-if="personas.length" class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
-          <div
-            v-for="persona in personas"
-            :key="persona.id"
-            class="group flex flex-col rounded-2xl border border-default overflow-hidden cursor-pointer hover:border-primary/40 hover:shadow-lg transition-all"
-            role="button"
-            tabindex="0"
-            @click="openDetail(persona)"
-            @keydown.enter="openDetail(persona)"
-          >
-            <!-- Gradient header with avatar -->
-            <div
-              class="p-4 flex items-center gap-3"
-              :class="mbtiGradient(persona.mbti)"
-            >
-              <div class="shrink-0 size-12 rounded-xl bg-default/80 border border-default flex items-center justify-center shadow-sm backdrop-blur-sm">
-                <span class="text-sm font-bold tracking-tight text-highlighted">
-                  {{ personaInitials(persona.name) }}
-                </span>
-              </div>
-              <div class="flex-1 min-w-0">
-                <h3 class="text-base font-bold truncate text-highlighted">{{ persona.name }}</h3>
-                <p v-if="persona.title" class="text-xs text-muted truncate mt-0.5">{{ persona.title }}</p>
-              </div>
-              <UBadge
-                v-if="personaAgentCount(persona.id) > 0"
-                :label="`${personaAgentCount(persona.id)} agents`"
-                variant="subtle"
-                color="primary"
-                size="xs"
-                class="shrink-0"
-              />
-            </div>
-
-            <!-- Body -->
-            <div class="flex flex-col gap-3 flex-1 p-4">
-              <p v-if="persona.tagline" class="text-sm text-muted italic leading-relaxed line-clamp-2">
-                "{{ persona.tagline }}"
-              </p>
-
-              <!-- DNA Badges -->
-              <div class="flex flex-wrap gap-1.5">
-                <UBadge
-                  v-if="persona.mbti"
-                  :label="persona.mbti"
-                  :color="mbtiColor(persona.mbti) as any"
-                  variant="subtle"
-                  size="xs"
-                />
-                <UBadge
-                  v-if="persona.disc?.primary"
-                  :label="`DISC: ${persona.disc.primary}${persona.disc.secondary ? '/' + persona.disc.secondary : ''}`"
-                  :color="discColor(persona.disc.primary) as any"
-                  variant="subtle"
-                  size="xs"
-                />
-                <UBadge
-                  v-if="persona.enneagram?.type"
-                  :label="`E${persona.enneagram.type}${persona.enneagram.wing ? 'w' + persona.enneagram.wing : ''}`"
-                  variant="outline"
-                  size="xs"
-                />
-              </div>
-
-              <!-- Expertise domains -->
-              <div v-if="persona.expertise_domains?.length" class="flex flex-wrap gap-1">
-                <UBadge
-                  v-for="domain in persona.expertise_domains.slice(0, 3)"
-                  :key="domain"
-                  :label="domain"
-                  variant="outline"
-                  size="xs"
-                  color="neutral"
-                />
-                <UBadge
-                  v-if="persona.expertise_domains.length > 3"
-                  :label="`+${persona.expertise_domains.length - 3}`"
-                  variant="outline"
-                  size="xs"
-                  color="neutral"
-                />
-              </div>
-
-              <!-- Actions -->
-              <div class="pt-3 mt-auto border-t border-default space-y-3" @click.stop>
-                <div class="flex gap-2">
-                  <UButton
-                    label="Clone to Agent"
-                    icon="i-lucide-copy"
-                    size="sm"
-                    variant="solid"
-                    class="flex-1"
-                    @click.stop="toggleClone(persona)"
-                  />
-                  <UButton
-                    icon="i-lucide-trash-2"
-                    size="sm"
-                    variant="ghost"
-                    color="error"
-                    :loading="deleting === persona.id"
-                    aria-label="Delete persona"
-                    @click.stop="deletePersona(persona)"
-                  />
-                </div>
-
-                <!-- Inline clone expansion -->
-                <div v-if="cloneExpandedId === persona.id" class="space-y-3 pt-2">
-                  <UFormField label="Department" required>
-                    <USelect
-                      v-model="cloneDepartment"
-                      :items="departmentOptions"
-                      placeholder="Select department"
-                      aria-label="Target department"
-                      class="w-full"
-                    />
-                  </UFormField>
-                  <UFormField label="Tier" required>
-                    <USelect
-                      v-model="cloneTier"
-                      :items="tierOptions"
-                      placeholder="Select tier"
-                      aria-label="Agent tier"
-                      class="w-full"
-                    />
-                  </UFormField>
-                  <UButton
-                    label="Confirm Clone"
-                    icon="i-lucide-check"
-                    size="sm"
-                    block
-                    :loading="cloning"
-                    :disabled="!cloneDepartment || !cloneTier"
-                    @click="cloneToAgent(persona)"
-                  />
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </template>
-      </div>
-    </template>
-  </UDashboardPanel>
-</template>