From 1715b0ac6774488f276e44474ac007b18f9795f9 Mon Sep 17 00:00:00 2001
From: 4Ventures <4ventures@MacBook-Air-de-4Ventures.local>
Date: Sat, 10 Oct 2026 01:35:08 +0200
Subject: [PATCH] Expand Zona de marca into a full brand kit with asset
 uploads.

Expert sections plus logos, fonts, color tokens and file kit so ads, calendars and B2B content share one brand system.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 src/app/api/brandbook/kit/route.ts |  300 ++++++++
 src/components/BrandZone.tsx       | 1109 ++++++++++++++++++++++++----
 src/lib/brandbook.ts               |  691 ++++++++++++++---
 3 files changed, 1862 insertions(+), 238 deletions(-)
 create mode 100644 src/app/api/brandbook/kit/route.ts

diff --git a/src/app/api/brandbook/kit/route.ts b/src/app/api/brandbook/kit/route.ts
new file mode 100644
index 0000000..091fe34
--- /dev/null
+++ b/src/app/api/brandbook/kit/route.ts
@@ -0,0 +1,300 @@
+/**
+ * POST multipart — upload logo/font/image/doc into brand kit + link in brandbook.
+ * Fields: file, kind, role?, label?
+ * DELETE ?assetId= — unlink + optional delete file
+ */
+import { NextRequest, NextResponse } from 'next/server';
+import { createClient } from '@/lib/supabase/server';
+import { resolveActiveTenant, restGet } from '@/lib/tenant-context';
+import {
+  isAgencyRole,
+  serviceHeaders,
+  supabaseUrl,
+  userRole,
+} from '@/lib/agency';
+import {
+  ASSETS_BUCKET,
+  MAX_ASSET_BYTES,
+  ensureAssetsBucket,
+  sanitizeFileName,
+  serviceSupabase,
+} from '@/lib/assets';
+import {
+  BRANDBOOK_DOC_TITLE,
+  BRANDBOOK_DOC_TYPE,
+  BRANDBOOK_FOLDER,
+  brandbookCompleteness,
+  emptyBrandbook,
+  newId,
+  parseBrandbook,
+  type BrandAsset,
+  type BrandAssetKind,
+  type Brandbook,
+} from '@/lib/brandbook';
+import { createHash, randomUUID } from 'crypto';
+
+export const dynamic = 'force-dynamic';
+export const runtime = 'nodejs';
+
+const KINDS = new Set<BrandAssetKind>([
+  'logo',
+  'font',
+  'image',
+  'icon',
+  'document',
+  'pattern',
+  'video',
+  'other',
+]);
+
+async function loadBook(tenantId: string, label: string) {
+  const r = await restGet<{ id: string; content: unknown }[]>(
+    `/rest/v1/documents?tenant_id=eq.${encodeURIComponent(
+      tenantId
+    )}&type=eq.${BRANDBOOK_DOC_TYPE}&select=id,content&order=updated_at.desc&limit=1`
+  );
+  const row = r.data?.[0];
+  return {
+    id: row?.id || null,
+    book: parseBrandbook(row?.content) || emptyBrandbook(label),
+  };
+}
+
+async function saveBook(
+  tenantId: string,
+  docId: string | null,
+  book: Brandbook
+) {
+  const headers = serviceHeaders();
+  const base = supabaseUrl();
+  if (!headers || !base) throw new Error('No service role');
+  book.updated_at = new Date().toISOString();
+  if (docId) {
+    const patch = await fetch(`${base}/rest/v1/documents?id=eq.${docId}`, {
+      method: 'PATCH',
+      headers: {
+        ...headers,
+        'Content-Type': 'application/json',
+        Prefer: 'return=minimal',
+      },
+      body: JSON.stringify({
+        content: book,
+        title: BRANDBOOK_DOC_TITLE,
+        updated_at: book.updated_at,
+      }),
+    });
+    if (!patch.ok) throw new Error(await patch.text());
+    return docId;
+  }
+  const ins = await fetch(`${base}/rest/v1/documents`, {
+    method: 'POST',
+    headers: {
+      ...headers,
+      'Content-Type': 'application/json',
+      Prefer: 'return=representation',
+    },
+    body: JSON.stringify({
+      tenant_id: tenantId,
+      type: BRANDBOOK_DOC_TYPE,
+      title: BRANDBOOK_DOC_TITLE,
+      status: 'approved',
+      content: book,
+    }),
+  });
+  if (!ins.ok) throw new Error(await ins.text());
+  const rows = (await ins.json()) as { id: string }[];
+  return rows[0]?.id || null;
+}
+
+export async function POST(req: NextRequest) {
+  const supabase = await createClient();
+  const {
+    data: { user },
+  } = await supabase.auth.getUser();
+  if (!user) {
+    return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+  }
+  if (!isAgencyRole(userRole(user))) {
+    return NextResponse.json({ error: 'Solo agencia' }, { status: 403 });
+  }
+  const ctx = await resolveActiveTenant(user);
+  if (!ctx.tenantId || ctx.portfolioWide) {
+    return NextResponse.json(
+      { error: 'Selecciona un cliente en Contexto.' },
+      { status: 400 }
+    );
+  }
+
+  const bucketOk = await ensureAssetsBucket();
+  if (!bucketOk.ok) {
+    return NextResponse.json(
+      { error: `Storage: ${bucketOk.error}` },
+      { status: 503 }
+    );
+  }
+  const svc = serviceSupabase();
+  const headers = serviceHeaders();
+  if (!svc || !headers) {
+    return NextResponse.json({ error: 'No service role' }, { status: 503 });
+  }
+
+  const form = await req.formData();
+  const file = form.get('file');
+  if (!(file instanceof File) || file.size <= 0) {
+    return NextResponse.json({ error: 'Archivo requerido' }, { status: 400 });
+  }
+  if (file.size > MAX_ASSET_BYTES) {
+    return NextResponse.json({ error: 'Archivo > 80 MB' }, { status: 400 });
+  }
+
+  const kindRaw = String(form.get('kind') || 'other') as BrandAssetKind;
+  const kind = KINDS.has(kindRaw) ? kindRaw : 'other';
+  const role = String(form.get('role') || kind).slice(0, 80);
+  const label = String(form.get('label') || file.name).slice(0, 120);
+
+  const safeName = sanitizeFileName(file.name);
+  const id = randomUUID();
+  const folder = `${BRANDBOOK_FOLDER}/${kind}`;
+  const storagePath = `${ctx.tenantId}/${folder}/${id}_${safeName}`;
+  const buf = Buffer.from(await file.arrayBuffer());
+  const sha256 = createHash('sha256').update(buf).digest('hex');
+
+  const up = await svc.storage.from(ASSETS_BUCKET).upload(storagePath, buf, {
+    contentType: file.type || 'application/octet-stream',
+    upsert: false,
+  });
+  if (up.error) {
+    return NextResponse.json({ error: up.error.message }, { status: 500 });
+  }
+
+  const row = {
+    id,
+    tenant_id: ctx.tenantId,
+    title: label || safeName,
+    folder,
+    file_name: safeName,
+    mime_type: file.type || 'application/octet-stream',
+    bytes: file.size,
+    storage_path: storagePath,
+    sha256,
+    status: 'approved',
+    created_by: user.id,
+  };
+  const ins = await fetch(`${supabaseUrl()}/rest/v1/asset_files`, {
+    method: 'POST',
+    headers: {
+      ...headers,
+      'Content-Type': 'application/json',
+      Prefer: 'return=representation',
+    },
+    body: JSON.stringify(row),
+  });
+  if (!ins.ok) {
+    await svc.storage.from(ASSETS_BUCKET).remove([storagePath]);
+    return NextResponse.json({ error: await ins.text() }, { status: 500 });
+  }
+
+  const asset: BrandAsset = {
+    id: newId('kit'),
+    asset_file_id: id,
+    kind,
+    role,
+    label,
+    file_name: safeName,
+    mime_type: file.type || undefined,
+    added_at: new Date().toISOString(),
+  };
+
+  const { id: docId, book } = await loadBook(ctx.tenantId, ctx.label);
+  book.brand_name = book.brand_name || ctx.label;
+  book.kit_assets = [asset, ...(book.kit_assets || [])];
+
+  // Auto-add font token when uploading a font file
+  if (kind === 'font') {
+    const family = label.replace(/\.(ttf|otf|woff2?|zip)$/i, '').trim() || label;
+    book.fonts_kit = [
+      {
+        id: newId('font'),
+        family,
+        role: /display|headline|titulo/i.test(role) ? 'headline' : 'body',
+        weights: '400,700',
+        source: 'file',
+        url_or_notes: `Archivo: ${safeName}`,
+        asset_file_id: id,
+      },
+      ...(book.fonts_kit || []),
+    ];
+  }
+
+  try {
+    await saveBook(ctx.tenantId, docId, book);
+  } catch (e) {
+    return NextResponse.json(
+      { error: e instanceof Error ? e.message : 'No se pudo guardar brandbook' },
+      { status: 500 }
+    );
+  }
+
+  return NextResponse.json({
+    ok: true,
+    asset,
+    brandbook: book,
+    completeness: brandbookCompleteness(book),
+  });
+}
+
+export async function DELETE(req: NextRequest) {
+  const supabase = await createClient();
+  const {
+    data: { user },
+  } = await supabase.auth.getUser();
+  if (!user) {
+    return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+  }
+  if (!isAgencyRole(userRole(user))) {
+    return NextResponse.json({ error: 'Solo agencia' }, { status: 403 });
+  }
+  const ctx = await resolveActiveTenant(user);
+  if (!ctx.tenantId || ctx.portfolioWide) {
+    return NextResponse.json(
+      { error: 'Selecciona un cliente' },
+      { status: 400 }
+    );
+  }
+
+  const kitId = req.nextUrl.searchParams.get('kitId') || '';
+  const fileId = req.nextUrl.searchParams.get('assetFileId') || '';
+  if (!kitId && !fileId) {
+    return NextResponse.json({ error: 'kitId requerido' }, { status: 400 });
+  }
+
+  const { id: docId, book } = await loadBook(ctx.tenantId, ctx.label);
+  const removed = book.kit_assets.find(
+    (a) => a.id === kitId || a.asset_file_id === fileId
+  );
+  book.kit_assets = book.kit_assets.filter(
+    (a) => a.id !== kitId && a.asset_file_id !== fileId
+  );
+  if (removed?.asset_file_id) {
+    book.fonts_kit = book.fonts_kit.map((f) =>
+      f.asset_file_id === removed.asset_file_id
+        ? { ...f, asset_file_id: undefined }
+        : f
+    );
+  }
+
+  try {
+    await saveBook(ctx.tenantId, docId, book);
+  } catch (e) {
+    return NextResponse.json(
+      { error: e instanceof Error ? e.message : 'Error' },
+      { status: 500 }
+    );
+  }
+
+  return NextResponse.json({
+    ok: true,
+    brandbook: book,
+    completeness: brandbookCompleteness(book),
+  });
+}
diff --git a/src/components/BrandZone.tsx b/src/components/BrandZone.tsx
index fc63948..fec8bb3 100644
--- a/src/components/BrandZone.tsx
+++ b/src/components/BrandZone.tsx
@@ -8,30 +8,48 @@ import {
   Sparkles,
   Upload,
   CheckCircle2,
+  Plus,
+  Trash2,
+  ImageIcon,
+  Type,
+  Palette,
 } from 'lucide-react';
 import { PageHeader, Surface, SectionTitle } from '@/components/ui';
 import {
+  ASSET_KIND_LABELS,
   BRANDBOOK_SECTIONS,
   emptyBrandbook,
   linesToList,
   listToLines,
+  newId,
+  normalizeHex,
+  primaryLogo,
+  type BrandAssetKind,
   type Brandbook,
   type BrandbookSectionId,
+  type ColorToken,
+  type FontToken,
 } from '@/lib/brandbook';
 
 function Field({
   label,
   hint,
   children,
+  className = '',
 }: {
   label: string;
   hint?: string;
   children: React.ReactNode;
+  className?: string;
 }) {
   return (
-    <label className="block space-y-1">
+    <label className={`block space-y-1 ${className}`}>
       <span className="text-xs font-semibold text-gray-800">{label}</span>
-      {hint ? <span className="block text-[11px] text-gray-500">{hint}</span> : null}
+      {hint ? (
+        <span className="block text-[11px] text-gray-500 leading-snug">
+          {hint}
+        </span>
+      ) : null}
       {children}
     </label>
   );
@@ -40,6 +58,39 @@ function Field({
 const inputCls =
   'w-full rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm text-gray-900 placeholder:text-gray-400 focus:outline-none focus:ring-2 focus:ring-brand-200';
 const areaCls = `${inputCls} min-h-[88px] resize-y`;
+const selectCls = inputCls;
+
+function KitThumb({ assetFileId, alt }: { assetFileId: string; alt: string }) {
+  const [url, setUrl] = useState<string | null>(null);
+  useEffect(() => {
+    let cancelled = false;
+    (async () => {
+      const r = await fetch(
+        `/api/assets/download?id=${encodeURIComponent(assetFileId)}`
+      );
+      const j = await r.json();
+      if (!cancelled && r.ok && j.url) setUrl(j.url);
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [assetFileId]);
+  if (!url) {
+    return (
+      <div className="w-full h-20 rounded-lg bg-gray-100 flex items-center justify-center text-[10px] text-gray-400">
+        …
+      </div>
+    );
+  }
+  return (
+    // eslint-disable-next-line @next/next/no-img-element
+    <img
+      src={url}
+      alt={alt}
+      className="w-full h-20 object-contain rounded-lg border border-gray-200 bg-white"
+    />
+  );
+}
 
 export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
   const [section, setSection] = useState<BrandbookSectionId>('identidad');
@@ -49,12 +100,15 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
   const [saving, setSaving] = useState(false);
   const [seeding, setSeeding] = useState(false);
   const [uploading, setUploading] = useState(false);
+  const [kitUploading, setKitUploading] = useState(false);
   const [err, setErr] = useState<string | null>(null);
   const [okMsg, setOkMsg] = useState<string | null>(null);
   const [score, setScore] = useState(0);
   const [missing, setMissing] = useState<string[]>([]);
   const [paste, setPaste] = useState('');
   const [exists, setExists] = useState(false);
+  const [kitKind, setKitKind] = useState<BrandAssetKind>('logo');
+  const [kitRole, setKitRole] = useState('primary');
 
   const load = useCallback(async () => {
     setLoading(true);
@@ -100,7 +154,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
       setScore(j.completeness?.score ?? 0);
       setMissing(j.completeness?.missing || []);
       setExists(true);
-      setOkMsg('Brandbook guardado');
+      setOkMsg('Brand kit guardado');
     } catch (e) {
       setErr(e instanceof Error ? e.message : 'Error al guardar');
     } finally {
@@ -123,7 +177,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
       setScore(j.completeness?.score ?? 0);
       setMissing(j.completeness?.missing || []);
       setExists(true);
-      setOkMsg('Base de marca creada — completa y guarda lo que falte');
+      setOkMsg('Base experta creada — sube logos/fuentes y completa huecos');
     } catch (e) {
       setErr(e instanceof Error ? e.message : 'Error');
     } finally {
@@ -131,7 +185,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
     }
   }
 
-  async function uploadFile(file: File | null) {
+  async function uploadSource(file: File | null) {
     if (!file && !paste.trim()) return;
     setUploading(true);
     setErr(null);
@@ -142,10 +196,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
         fd.append('text', paste);
         fd.append('filename', 'pegado.txt');
       }
-      const r = await fetch('/api/brandbook/upload', {
-        method: 'POST',
-        body: fd,
-      });
+      const r = await fetch('/api/brandbook/upload', { method: 'POST', body: fd });
       const j = await r.json();
       if (!r.ok) throw new Error(j.error || 'Upload falló');
       setBook(j.brandbook);
@@ -162,6 +213,89 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
     }
   }
 
+  async function uploadKit(file: File) {
+    setKitUploading(true);
+    setErr(null);
+    try {
+      const fd = new FormData();
+      fd.append('file', file);
+      fd.append('kind', kitKind);
+      fd.append('role', kitRole);
+      fd.append('label', file.name);
+      const r = await fetch('/api/brandbook/kit', { method: 'POST', body: fd });
+      const j = await r.json();
+      if (!r.ok) throw new Error(j.error || 'No se pudo subir al kit');
+      setBook(j.brandbook);
+      setScore(j.completeness?.score ?? 0);
+      setMissing(j.completeness?.missing || []);
+      setExists(true);
+      setOkMsg(`${ASSET_KIND_LABELS[kitKind]} añadido: ${file.name}`);
+      setSection('visual');
+    } catch (e) {
+      setErr(e instanceof Error ? e.message : 'Error kit');
+    } finally {
+      setKitUploading(false);
+    }
+  }
+
+  async function removeKit(kitId: string) {
+    setErr(null);
+    try {
+      const r = await fetch(
+        `/api/brandbook/kit?kitId=${encodeURIComponent(kitId)}`,
+        { method: 'DELETE' }
+      );
+      const j = await r.json();
+      if (!r.ok) throw new Error(j.error || 'No se pudo quitar');
+      setBook(j.brandbook);
+      setScore(j.completeness?.score ?? 0);
+      setMissing(j.completeness?.missing || []);
+      setOkMsg('Archivo quitado del kit');
+    } catch (e) {
+      setErr(e instanceof Error ? e.message : 'Error');
+    }
+  }
+
+  function addColor() {
+    const c: ColorToken = {
+      id: newId('col'),
+      name: 'Nuevo color',
+      hex: '#2071CF',
+      role: 'primary',
+      usage: '',
+    };
+    patch({ colors: [...book.colors, c] });
+  }
+
+  function updateColor(id: string, partial: Partial<ColorToken>) {
+    patch({
+      colors: book.colors.map((c) => (c.id === id ? { ...c, ...partial } : c)),
+    });
+  }
+
+  function addFont() {
+    const f: FontToken = {
+      id: newId('font'),
+      family: 'Nueva fuente',
+      role: 'body',
+      weights: '400,700',
+      source: 'google',
+      url_or_notes: '',
+    };
+    patch({ fonts_kit: [...book.fonts_kit, f] });
+  }
+
+  function updateFont(id: string, partial: Partial<FontToken>) {
+    patch({
+      fonts_kit: book.fonts_kit.map((f) =>
+        f.id === id ? { ...f, ...partial } : f
+      ),
+    });
+  }
+
+  const logo = primaryLogo(book);
+  const secMeta = BRANDBOOK_SECTIONS.find((s) => s.id === section);
+
   if (loading) {
     return (
       <div className="flex items-center gap-2 text-sm text-gray-500 py-12">
@@ -176,7 +310,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
       <PageHeader
         eyebrow="Marca"
         title="Zona de marca"
-        description={`${tenantLabel}${slug ? ` · ${slug}` : ''} · Brandbook para anuncios, calendarios RRSS, LinkedIn B2B y blog corporativo.`}
+        description={`${tenantLabel}${slug ? ` · ${slug}` : ''} · Brand kit completo para ads, calendarios, LinkedIn y blog.`}
         actions={
           <div className="flex flex-wrap gap-2">
             <button
@@ -190,7 +324,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
               ) : (
                 <Sparkles className="w-3.5 h-3.5 text-amber-500" />
               )}
-              {exists ? 'Resembrar base' : 'Crear base de marca'}
+              {exists ? 'Resembrar base experta' : 'Crear base experta'}
             </button>
             <button
               type="button"
@@ -203,45 +337,152 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
               ) : (
                 <Save className="w-3.5 h-3.5" />
               )}
-              Guardar brandbook
+              Guardar brand kit
             </button>
           </div>
         }
       />
 
-      <div className="grid gap-3 sm:grid-cols-3">
-        <Surface className="!p-3">
-          <p className="text-[10px] font-semibold uppercase tracking-wider text-gray-500">
-            Completitud
-          </p>
-          <p className="text-2xl font-semibold text-gray-900 mt-1">{score}%</p>
-          <div className="mt-2 h-1.5 rounded-full bg-gray-100 overflow-hidden">
-            <div
-              className="h-full bg-brand-500 transition-all"
-              style={{ width: `${score}%` }}
-            />
+      {/* Identity strip */}
+      <Surface className="!p-4">
+        <div className="flex flex-col sm:flex-row gap-4 items-start">
+          <div className="w-28 shrink-0">
+            {logo ? (
+              <KitThumb assetFileId={logo.asset_file_id} alt={logo.label} />
+            ) : (
+              <div className="h-20 rounded-lg border border-dashed border-gray-300 bg-gray-50 flex flex-col items-center justify-center text-[10px] text-gray-500 gap-1">
+                <ImageIcon className="w-4 h-4" />
+                Sin logo
+              </div>
+            )}
           </div>
-        </Surface>
-        <Surface className="!p-3 sm:col-span-2">
-          <p className="text-[10px] font-semibold uppercase tracking-wider text-gray-500">
-            Usos conectados
-          </p>
-          <p className="text-sm text-gray-700 mt-1 leading-relaxed">
-            Calendario editorial · Pipeline creatividades / ads · Estrategia
-            LinkedIn B2B · Blog corporativo. Cuanto más completo el brandbook,
-            mejores los temas que genera la IA.
-          </p>
-          {missing.length ? (
-            <p className="text-xs text-amber-700 mt-2">
-              Falta: {missing.join(' · ')}
+          <div className="flex-1 min-w-0 space-y-2">
+            <p className="text-lg font-semibold text-gray-900 truncate">
+              {book.brand_name || tenantLabel}
             </p>
-          ) : (
-            <p className="text-xs text-emerald-700 mt-2 inline-flex items-center gap-1">
-              <CheckCircle2 className="w-3.5 h-3.5" /> Base mínima completa
+            <p className="text-sm text-gray-600">
+              {book.tagline || book.elevator_pitch || 'Sin tagline todavía'}
             </p>
-          )}
-        </Surface>
-      </div>
+            <div className="flex flex-wrap gap-1.5">
+              {book.colors.slice(0, 8).map((c) => (
+                <span
+                  key={c.id}
+                  title={`${c.name} ${c.hex}`}
+                  className="inline-flex items-center gap-1 rounded-full border border-gray-200 px-2 py-0.5 text-[10px] text-gray-700"
+                >
+                  <span
+                    className="w-3 h-3 rounded-full border border-black/10"
+                    style={{ background: c.hex }}
+                  />
+                  {c.hex}
+                </span>
+              ))}
+              {book.fonts_kit.slice(0, 3).map((f) => (
+                <span
+                  key={f.id}
+                  className="inline-flex items-center gap-1 rounded-full border border-gray-200 px-2 py-0.5 text-[10px] text-gray-700"
+                >
+                  <Type className="w-3 h-3" />
+                  {f.family}
+                </span>
+              ))}
+            </div>
+          </div>
+          <div className="sm:w-40 shrink-0">
+            <p className="text-[10px] font-semibold uppercase tracking-wider text-gray-500">
+              Completitud
+            </p>
+            <p className="text-2xl font-semibold text-gray-900 mt-0.5">{score}%</p>
+            <div className="mt-2 h-1.5 rounded-full bg-gray-100 overflow-hidden">
+              <div
+                className="h-full bg-brand-500 transition-all"
+                style={{ width: `${score}%` }}
+              />
+            </div>
+            {missing.length ? (
+              <p className="text-[10px] text-amber-700 mt-2 leading-snug">
+                Falta: {missing.slice(0, 3).join(' · ')}
+              </p>
+            ) : (
+              <p className="text-[10px] text-emerald-700 mt-2 inline-flex items-center gap-1">
+                <CheckCircle2 className="w-3 h-3" /> Kit sólido
+              </p>
+            )}
+          </div>
+        </div>
+      </Surface>
+
+      {/* Quick upload bar */}
+      <Surface className="!p-3">
+        <div className="flex flex-col md:flex-row md:items-end gap-3">
+          <div className="flex items-center gap-2 text-xs font-semibold text-gray-800 shrink-0">
+            <Upload className="w-4 h-4 text-rose-500" />
+            Añadir al kit
+          </div>
+          <Field label="Tipo" className="md:w-36">
+            <select
+              className={selectCls}
+              value={kitKind}
+              onChange={(e) => {
+                const k = e.target.value as BrandAssetKind;
+                setKitKind(k);
+                setKitRole(
+                  k === 'logo'
+                    ? 'primary'
+                    : k === 'font'
+                      ? 'body'
+                      : k === 'image'
+                        ? 'moodboard'
+                        : 'asset'
+                );
+              }}
+            >
+              {Object.entries(ASSET_KIND_LABELS).map(([k, v]) => (
+                <option key={k} value={k}>
+                  {v}
+                </option>
+              ))}
+            </select>
+          </Field>
+          <Field label="Rol" className="md:w-40" hint="ej. primary, dark, display">
+            <input
+              className={inputCls}
+              value={kitRole}
+              onChange={(e) => setKitRole(e.target.value)}
+            />
+          </Field>
+          <label className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-gray-900 px-4 py-2.5 text-xs font-semibold text-white cursor-pointer hover:bg-gray-800 disabled:opacity-50">
+            {kitUploading ? (
+              <Loader2 className="w-3.5 h-3.5 animate-spin" />
+            ) : (
+              <Plus className="w-3.5 h-3.5" />
+            )}
+            Subir archivo
+            <input
+              type="file"
+              className="hidden"
+              accept={
+                kitKind === 'logo' || kitKind === 'image' || kitKind === 'icon'
+                  ? 'image/*,.svg,.pdf'
+                  : kitKind === 'font'
+                    ? '.ttf,.otf,.woff,.woff2,.zip'
+                    : kitKind === 'video'
+                      ? 'video/*'
+                      : '*/*'
+              }
+              disabled={kitUploading}
+              onChange={(e) => {
+                const f = e.target.files?.[0];
+                if (f) void uploadKit(f);
+                e.target.value = '';
+              }}
+            />
+          </label>
+          <p className="text-[11px] text-gray-500 md:ml-auto max-w-xs">
+            Logos, tipografías, patrones, iconos, PDFs de brandbook, moodboards…
+          </p>
+        </div>
+      </Surface>
 
       {err ? (
         <p className="text-sm text-red-600 bg-red-50 border border-red-100 rounded-lg px-3 py-2">
@@ -255,7 +496,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
       ) : null}
 
       <div className="flex flex-col lg:flex-row gap-4">
-        <nav className="lg:w-52 shrink-0 flex lg:flex-col gap-1 overflow-x-auto pb-1">
+        <nav className="lg:w-56 shrink-0 flex lg:flex-col gap-1 overflow-x-auto pb-1">
           {BRANDBOOK_SECTIONS.map((s) => (
             <button
               key={s.id}
@@ -274,10 +515,8 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
 
         <Surface className="flex-1 min-w-0 space-y-4">
           <SectionTitle
-            title={BRANDBOOK_SECTIONS.find((s) => s.id === section)?.label || ''}
-            description={
-              BRANDBOOK_SECTIONS.find((s) => s.id === section)?.hint
-            }
+            title={secMeta?.label || ''}
+            description={secMeta?.expert || secMeta?.hint}
           />
 
           {section === 'identidad' && (
@@ -296,6 +535,38 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   onChange={(e) => patch({ tagline: e.target.value })}
                 />
               </Field>
+              <Field
+                label="Elevator pitch (30s)"
+                hint="Una frase que un desconocido entiende"
+                className="sm:col-span-2"
+              >
+                <textarea
+                  className={areaCls}
+                  value={book.elevator_pitch}
+                  onChange={(e) => patch({ elevator_pitch: e.target.value })}
+                />
+              </Field>
+              <Field label="Promesa de marca">
+                <textarea
+                  className={areaCls}
+                  value={book.brand_promise}
+                  onChange={(e) => patch({ brand_promise: e.target.value })}
+                />
+              </Field>
+              <Field label="Posicionamiento">
+                <textarea
+                  className={areaCls}
+                  value={book.positioning}
+                  onChange={(e) => patch({ positioning: e.target.value })}
+                />
+              </Field>
+              <Field label="Arquetipo" hint="Jung / marca (Sabio, Héroe…)">
+                <input
+                  className={inputCls}
+                  value={book.archetype}
+                  onChange={(e) => patch({ archetype: e.target.value })}
+                />
+              </Field>
               <Field label="Vertical / sector">
                 <input
                   className={inputCls}
@@ -303,15 +574,6 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   onChange={(e) => patch({ vertical: e.target.value })}
                 />
               </Field>
-              <Field label="Valores (uno por línea)">
-                <textarea
-                  className={areaCls}
-                  value={listToLines(book.values)}
-                  onChange={(e) =>
-                    patch({ values: linesToList(e.target.value) })
-                  }
-                />
-              </Field>
               <Field label="Misión">
                 <textarea
                   className={areaCls}
@@ -326,19 +588,35 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   onChange={(e) => patch({ vision: e.target.value })}
                 />
               </Field>
+              <Field label="Valores (uno por línea)">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.values)}
+                  onChange={(e) =>
+                    patch({ values: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Historia / origen">
+                <textarea
+                  className={areaCls}
+                  value={book.origin_story}
+                  onChange={(e) => patch({ origin_story: e.target.value })}
+                />
+              </Field>
             </div>
           )}
 
           {section === 'voz' && (
             <div className="grid gap-3 sm:grid-cols-2">
-              <Field label="Tono">
+              <Field label="Tono" className="sm:col-span-2">
                 <textarea
                   className={areaCls}
                   value={book.tone}
                   onChange={(e) => patch({ tone: e.target.value })}
                 />
               </Field>
-              <Field label="Personalidad (líneas)">
+              <Field label="Personalidad">
                 <textarea
                   className={areaCls}
                   value={listToLines(book.personality)}
@@ -347,6 +625,15 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
+              <Field label="Pilares de mensaje">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.messaging_pillars)}
+                  onChange={(e) =>
+                    patch({ messaging_pillars: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
               <Field label="Sí hacer">
                 <textarea
                   className={areaCls}
@@ -383,58 +670,369 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
+              <Field label="Ejemplos de frases BUENAS">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.example_good)}
+                  onChange={(e) =>
+                    patch({ example_good: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Ejemplos de frases MALAS">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.example_bad)}
+                  onChange={(e) =>
+                    patch({ example_bad: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Variantes de slogan" className="sm:col-span-2">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.slogan_variants)}
+                  onChange={(e) =>
+                    patch({ slogan_variants: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
             </div>
           )}
 
           {section === 'visual' && (
-            <div className="grid gap-3 sm:grid-cols-2">
-              <Field label="Colores primarios (#hex o nombre)">
-                <textarea
-                  className={areaCls}
-                  value={listToLines(book.colors_primary)}
-                  onChange={(e) =>
-                    patch({ colors_primary: linesToList(e.target.value) })
-                  }
-                />
-              </Field>
-              <Field label="Colores secundarios">
-                <textarea
-                  className={areaCls}
-                  value={listToLines(book.colors_secondary)}
-                  onChange={(e) =>
-                    patch({ colors_secondary: linesToList(e.target.value) })
-                  }
-                />
-              </Field>
-              <Field label="Tipografías">
-                <textarea
-                  className={areaCls}
-                  value={listToLines(book.fonts)}
-                  onChange={(e) =>
-                    patch({ fonts: linesToList(e.target.value) })
-                  }
-                />
-              </Field>
-              <Field label="Uso de logo">
-                <textarea
-                  className={areaCls}
-                  value={book.logo_usage}
-                  onChange={(e) => patch({ logo_usage: e.target.value })}
-                />
-              </Field>
-              <Field label="Notas visuales / arte">
-                <textarea
-                  className={`${areaCls} sm:col-span-2`}
-                  value={book.visual_notes}
-                  onChange={(e) => patch({ visual_notes: e.target.value })}
-                />
-              </Field>
+            <div className="space-y-6">
+              <div>
+                <div className="flex items-center justify-between mb-2">
+                  <p className="text-sm font-semibold text-gray-900 inline-flex items-center gap-1.5">
+                    <Palette className="w-4 h-4 text-rose-500" />
+                    Colores
+                  </p>
+                  <button
+                    type="button"
+                    onClick={addColor}
+                    className="text-xs font-semibold text-brand-700 inline-flex items-center gap-1"
+                  >
+                    <Plus className="w-3.5 h-3.5" /> Añadir color
+                  </button>
+                </div>
+                <div className="space-y-2">
+                  {book.colors.length === 0 ? (
+                    <p className="text-xs text-gray-500">
+                      Añade tokens de color con picker o pega un #hex.
+                    </p>
+                  ) : null}
+                  {book.colors.map((c) => (
+                    <div
+                      key={c.id}
+                      className="grid grid-cols-[40px_1fr_1fr_100px_1fr_auto] gap-2 items-center"
+                    >
+                      <input
+                        type="color"
+                        value={normalizeHex(c.hex) || '#000000'}
+                        onChange={(e) =>
+                          updateColor(c.id, {
+                            hex: e.target.value.toUpperCase(),
+                          })
+                        }
+                        className="w-10 h-10 rounded cursor-pointer border border-gray-200 p-0"
+                      />
+                      <input
+                        className={inputCls}
+                        value={c.name}
+                        onChange={(e) =>
+                          updateColor(c.id, { name: e.target.value })
+                        }
+                        placeholder="Nombre"
+                      />
+                      <input
+                        className={inputCls}
+                        value={c.hex}
+                        onChange={(e) => {
+                          const n = normalizeHex(e.target.value);
+                          updateColor(c.id, {
+                            hex: n || e.target.value,
+                          });
+                        }}
+                        placeholder="#000000"
+                      />
+                      <select
+                        className={selectCls}
+                        value={c.role}
+                        onChange={(e) =>
+                          updateColor(c.id, {
+                            role: e.target.value as ColorToken['role'],
+                          })
+                        }
+                      >
+                        {(
+                          [
+                            'primary',
+                            'secondary',
+                            'accent',
+                            'neutral',
+                            'success',
+                            'warning',
+                            'error',
+                            'other',
+                          ] as const
+                        ).map((r) => (
+                          <option key={r} value={r}>
+                            {r}
+                          </option>
+                        ))}
+                      </select>
+                      <input
+                        className={inputCls}
+                        value={c.usage}
+                        onChange={(e) =>
+                          updateColor(c.id, { usage: e.target.value })
+                        }
+                        placeholder="Uso"
+                      />
+                      <button
+                        type="button"
+                        onClick={() =>
+                          patch({
+                            colors: book.colors.filter((x) => x.id !== c.id),
+                          })
+                        }
+                        className="p-2 text-gray-400 hover:text-red-600"
+                      >
+                        <Trash2 className="w-4 h-4" />
+                      </button>
+                    </div>
+                  ))}
+                </div>
+              </div>
+
+              <div>
+                <div className="flex items-center justify-between mb-2">
+                  <p className="text-sm font-semibold text-gray-900 inline-flex items-center gap-1.5">
+                    <Type className="w-4 h-4 text-rose-500" />
+                    Tipografías
+                  </p>
+                  <button
+                    type="button"
+                    onClick={addFont}
+                    className="text-xs font-semibold text-brand-700 inline-flex items-center gap-1"
+                  >
+                    <Plus className="w-3.5 h-3.5" /> Añadir fuente
+                  </button>
+                </div>
+                <div className="space-y-2">
+                  {book.fonts_kit.map((f) => (
+                    <div
+                      key={f.id}
+                      className="grid grid-cols-1 sm:grid-cols-[1fr_120px_100px_100px_1fr_auto] gap-2 items-center"
+                    >
+                      <input
+                        className={inputCls}
+                        value={f.family}
+                        onChange={(e) =>
+                          updateFont(f.id, { family: e.target.value })
+                        }
+                        placeholder="Familia"
+                      />
+                      <select
+                        className={selectCls}
+                        value={f.role}
+                        onChange={(e) =>
+                          updateFont(f.id, {
+                            role: e.target.value as FontToken['role'],
+                          })
+                        }
+                      >
+                        {(
+                          [
+                            'display',
+                            'headline',
+                            'body',
+                            'ui',
+                            'mono',
+                            'other',
+                          ] as const
+                        ).map((r) => (
+                          <option key={r} value={r}>
+                            {r}
+                          </option>
+                        ))}
+                      </select>
+                      <input
+                        className={inputCls}
+                        value={f.weights}
+                        onChange={(e) =>
+                          updateFont(f.id, { weights: e.target.value })
+                        }
+                        placeholder="400,700"
+                      />
+                      <select
+                        className={selectCls}
+                        value={f.source}
+                        onChange={(e) =>
+                          updateFont(f.id, {
+                            source: e.target.value as FontToken['source'],
+                          })
+                        }
+                      >
+                        {(
+                          [
+                            'google',
+                            'adobe',
+                            'file',
+                            'system',
+                            'other',
+                          ] as const
+                        ).map((r) => (
+                          <option key={r} value={r}>
+                            {r}
+                          </option>
+                        ))}
+                      </select>
+                      <input
+                        className={inputCls}
+                        value={f.url_or_notes}
+                        onChange={(e) =>
+                          updateFont(f.id, { url_or_notes: e.target.value })
+                        }
+                        placeholder="URL Google Fonts / notas"
+                      />
+                      <button
+                        type="button"
+                        onClick={() =>
+                          patch({
+                            fonts_kit: book.fonts_kit.filter(
+                              (x) => x.id !== f.id
+                            ),
+                          })
+                        }
+                        className="p-2 text-gray-400 hover:text-red-600"
+                      >
+                        <Trash2 className="w-4 h-4" />
+                      </button>
+                    </div>
+                  ))}
+                </div>
+                <p className="text-[11px] text-gray-500 mt-2">
+                  Para archivos .ttf/.otf/.woff usa la barra «Añadir al kit» con
+                  tipo Tipografía.
+                </p>
+              </div>
+
+              <div className="grid gap-3 sm:grid-cols-2">
+                <Field label="Uso de logo">
+                  <textarea
+                    className={areaCls}
+                    value={book.logo_usage}
+                    onChange={(e) => patch({ logo_usage: e.target.value })}
+                  />
+                </Field>
+                <Field label="Notas visuales / arte">
+                  <textarea
+                    className={areaCls}
+                    value={book.visual_notes}
+                    onChange={(e) => patch({ visual_notes: e.target.value })}
+                  />
+                </Field>
+                <Field label="Estilo fotografía">
+                  <textarea
+                    className={areaCls}
+                    value={book.photography_style}
+                    onChange={(e) =>
+                      patch({ photography_style: e.target.value })
+                    }
+                  />
+                </Field>
+                <Field label="Ilustración / iconos">
+                  <textarea
+                    className={areaCls}
+                    value={[book.illustration_style, book.icon_style]
+                      .filter(Boolean)
+                      .join('\n')}
+                    onChange={(e) => {
+                      const [illustration_style = '', icon_style = ''] =
+                        e.target.value.split('\n');
+                      patch({ illustration_style, icon_style });
+                    }}
+                  />
+                </Field>
+                <Field label="Imágenes: sí">
+                  <textarea
+                    className={areaCls}
+                    value={listToLines(book.imagery_do)}
+                    onChange={(e) =>
+                      patch({ imagery_do: linesToList(e.target.value) })
+                    }
+                  />
+                </Field>
+                <Field label="Imágenes: no">
+                  <textarea
+                    className={areaCls}
+                    value={listToLines(book.imagery_dont)}
+                    onChange={(e) =>
+                      patch({ imagery_dont: linesToList(e.target.value) })
+                    }
+                  />
+                </Field>
+              </div>
+
+              <div>
+                <p className="text-sm font-semibold text-gray-900 mb-2">
+                  Archivos del kit ({book.kit_assets.length})
+                </p>
+                {book.kit_assets.length === 0 ? (
+                  <p className="text-xs text-gray-500">
+                    Todavía no hay logos ni archivos. Usa «Añadir al kit»
+                    arriba.
+                  </p>
+                ) : (
+                  <ul className="grid gap-2 sm:grid-cols-2 lg:grid-cols-3">
+                    {book.kit_assets.map((a) => (
+                      <li
+                        key={a.id}
+                        className="rounded-xl border border-gray-200 p-2 space-y-2"
+                      >
+                        {a.mime_type?.startsWith('image/') ||
+                        a.kind === 'logo' ||
+                        a.kind === 'image' ||
+                        a.kind === 'icon' ? (
+                          <KitThumb
+                            assetFileId={a.asset_file_id}
+                            alt={a.label}
+                          />
+                        ) : (
+                          <div className="h-20 rounded-lg bg-gray-50 border border-gray-100 flex items-center justify-center text-xs text-gray-500">
+                            {ASSET_KIND_LABELS[a.kind]}
+                          </div>
+                        )}
+                        <div className="flex items-start justify-between gap-2">
+                          <div className="min-w-0">
+                            <p className="text-xs font-semibold text-gray-800 truncate">
+                              {a.label}
+                            </p>
+                            <p className="text-[10px] text-gray-500">
+                              {ASSET_KIND_LABELS[a.kind]} · {a.role}
+                            </p>
+                          </div>
+                          <button
+                            type="button"
+                            onClick={() => void removeKit(a.id)}
+                            className="p-1 text-gray-400 hover:text-red-600"
+                          >
+                            <Trash2 className="w-3.5 h-3.5" />
+                          </button>
+                        </div>
+                      </li>
+                    ))}
+                  </ul>
+                )}
+              </div>
             </div>
           )}
 
           {section === 'audiencia' && (
             <div className="grid gap-3 sm:grid-cols-2">
-              <Field label="ICP">
+              <Field label="ICP" className="sm:col-span-2">
                 <textarea
                   className={areaCls}
                   value={book.icp}
@@ -458,13 +1056,19 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                 />
               </Field>
               <Field
-                label="Personas (JSON o notas libres en Notas)"
-                hint="Formato: Nombre — descripción — pains (una por línea, sep. |)"
+                label="Personas"
+                hint="Nombre | descripción | pains | goals"
+                className="sm:col-span-2"
               >
                 <textarea
-                  className={areaCls}
+                  className={`${areaCls} min-h-[120px]`}
                   value={book.personas
-                    .map((p) => `${p.name} | ${p.description} | ${p.pains}`)
+                    .map(
+                      (p) =>
+                        `${p.name} | ${p.description} | ${p.pains}${
+                          p.goals ? ` | ${p.goals}` : ''
+                        }`
+                    )
                     .join('\n')}
                   onChange={(e) => {
                     const personas = e.target.value
@@ -472,24 +1076,68 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                       .map((line) => line.trim())
                       .filter(Boolean)
                       .map((line) => {
-                        const [name, description, pains] = line
+                        const [name, description, pains, goals] = line
                           .split('|')
                           .map((s) => s.trim());
                         return {
                           name: name || 'Persona',
                           description: description || '',
                           pains: pains || '',
+                          goals: goals || '',
                         };
                       });
                     patch({ personas });
                   }}
                 />
               </Field>
+              <Field label="Jobs to be done">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.jobs_to_be_done)}
+                  onChange={(e) =>
+                    patch({ jobs_to_be_done: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Triggers de compra">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.buying_triggers)}
+                  onChange={(e) =>
+                    patch({ buying_triggers: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Barreras / objeciones de audiencia">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.barriers)}
+                  onChange={(e) =>
+                    patch({ barriers: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Customer journey (notas)">
+                <textarea
+                  className={areaCls}
+                  value={book.customer_journey}
+                  onChange={(e) => patch({ customer_journey: e.target.value })}
+                />
+              </Field>
             </div>
           )}
 
           {section === 'oferta' && (
             <div className="grid gap-3 sm:grid-cols-2">
+              <Field label="Propuesta de valor" className="sm:col-span-2">
+                <textarea
+                  className={areaCls}
+                  value={book.value_proposition}
+                  onChange={(e) =>
+                    patch({ value_proposition: e.target.value })
+                  }
+                />
+              </Field>
               <Field label="Productos / servicios">
                 <textarea
                   className={areaCls}
@@ -499,6 +1147,15 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
+              <Field label="Packs / tiers">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.packages)}
+                  onChange={(e) =>
+                    patch({ packages: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
               <Field label="Diferenciadores">
                 <textarea
                   className={areaCls}
@@ -517,7 +1174,25 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
-              <Field label="Notas de pricing / packs">
+              <Field label="Alternativas competitivas">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.competitive_alternatives)}
+                  onChange={(e) =>
+                    patch({
+                      competitive_alternatives: linesToList(e.target.value),
+                    })
+                  }
+                />
+              </Field>
+              <Field label="Garantía / riesgo inverso">
+                <textarea
+                  className={areaCls}
+                  value={book.guarantee}
+                  onChange={(e) => patch({ guarantee: e.target.value })}
+                />
+              </Field>
+              <Field label="Pricing / notas comerciales" className="sm:col-span-2">
                 <textarea
                   className={areaCls}
                   value={book.pricing_notes}
@@ -556,33 +1231,107 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
+              <Field label="Hooks estacionales">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.seasonal_hooks)}
+                  onChange={(e) =>
+                    patch({ seasonal_hooks: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Temas tabú">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.taboo_topics)}
+                  onChange={(e) =>
+                    patch({ taboo_topics: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Matriz de contenido" className="sm:col-span-2">
+                <textarea
+                  className={`${areaCls} min-h-[120px]`}
+                  value={book.content_matrix}
+                  onChange={(e) => patch({ content_matrix: e.target.value })}
+                  placeholder="Pilar × formato × KPI…"
+                />
+              </Field>
             </div>
           )}
 
           {section === 'canales' && (
-            <div className="grid gap-3 sm:grid-cols-2">
-              {(
-                [
-                  ['instagram', 'Instagram'],
-                  ['facebook', 'Facebook'],
-                  ['linkedin', 'LinkedIn'],
-                  ['tiktok', 'TikTok'],
-                  ['blog', 'Blog'],
-                  ['other', 'Otros'],
-                ] as const
-              ).map(([key, label]) => (
-                <Field key={key} label={label} hint="Rol del canal para esta marca">
+            <div className="space-y-4">
+              <div className="grid gap-3 sm:grid-cols-2">
+                {(
+                  [
+                    ['instagram', 'Instagram'],
+                    ['facebook', 'Facebook'],
+                    ['linkedin', 'LinkedIn'],
+                    ['tiktok', 'TikTok'],
+                    ['youtube', 'YouTube'],
+                    ['blog', 'Blog'],
+                    ['email', 'Email'],
+                    ['other', 'Otros'],
+                  ] as const
+                ).map(([key, label]) => (
+                  <Field key={key} label={`${label} — rol`}>
+                    <textarea
+                      className={areaCls}
+                      value={book.channels[key]}
+                      onChange={(e) =>
+                        patch({
+                          channels: { ...book.channels, [key]: e.target.value },
+                        })
+                      }
+                    />
+                  </Field>
+                ))}
+              </div>
+              <div className="grid gap-3 sm:grid-cols-2">
+                {(
+                  [
+                    ['instagram', 'Handle IG'],
+                    ['facebook', 'URL Facebook'],
+                    ['linkedin', 'URL LinkedIn'],
+                    ['tiktok', 'Handle TikTok'],
+                    ['youtube', 'URL YouTube'],
+                    ['blog', 'URL Blog'],
+                  ] as const
+                ).map(([key, label]) => (
+                  <Field key={key} label={label}>
+                    <input
+                      className={inputCls}
+                      value={book.channel_handles[key]}
+                      onChange={(e) =>
+                        patch({
+                          channel_handles: {
+                            ...book.channel_handles,
+                            [key]: e.target.value,
+                          },
+                        })
+                      }
+                    />
+                  </Field>
+                ))}
+                <Field label="Cadencia global">
+                  <input
+                    className={inputCls}
+                    value={book.channel_cadence}
+                    onChange={(e) => patch({ channel_cadence: e.target.value })}
+                    placeholder="ej. 4 Reels/sem + Stories diarias"
+                  />
+                </Field>
+                <Field label="KPIs por canal">
                   <textarea
                     className={areaCls}
-                    value={book.channels[key]}
+                    value={listToLines(book.channel_kpis)}
                     onChange={(e) =>
-                      patch({
-                        channels: { ...book.channels, [key]: e.target.value },
-                      })
+                      patch({ channel_kpis: linesToList(e.target.value) })
                     }
                   />
                 </Field>
-              ))}
+              </div>
             </div>
           )}
 
@@ -633,6 +1382,40 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
+              <Field label="Embudo (TOFU/MOFU/BOFU)">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.ads_funnel)}
+                  onChange={(e) =>
+                    patch({ ads_funnel: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Formatos ads">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.ads_formats)}
+                  onChange={(e) =>
+                    patch({ ads_formats: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Remarketing">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.retargeting_angles)}
+                  onChange={(e) =>
+                    patch({ retargeting_angles: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="Notas landing" className="sm:col-span-2">
+                <textarea
+                  className={areaCls}
+                  value={book.landing_notes}
+                  onChange={(e) => patch({ landing_notes: e.target.value })}
+                />
+              </Field>
             </div>
           )}
 
@@ -674,6 +1457,31 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
+              <Field label="Ángulos casos de estudio">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.case_study_angles)}
+                  onChange={(e) =>
+                    patch({ case_study_angles: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="CTAs LinkedIn">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.linkedin_cta)}
+                  onChange={(e) =>
+                    patch({ linkedin_cta: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="ABM / cuentas objetivo" className="sm:col-span-2">
+                <textarea
+                  className={areaCls}
+                  value={book.abm_notes}
+                  onChange={(e) => patch({ abm_notes: e.target.value })}
+                />
+              </Field>
             </div>
           )}
 
@@ -697,6 +1505,24 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
+              <Field label="Clusters de contenido">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.content_clusters)}
+                  onChange={(e) =>
+                    patch({ content_clusters: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
+              <Field label="CTAs del blog">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.blog_cta)}
+                  onChange={(e) =>
+                    patch({ blog_cta: linesToList(e.target.value) })
+                  }
+                />
+              </Field>
               <Field label="Cadencia">
                 <input
                   className={inputCls}
@@ -719,6 +1545,17 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   }
                 />
               </Field>
+              <Field label="Disclaimers obligatorios">
+                <textarea
+                  className={areaCls}
+                  value={listToLines(book.required_disclaimers)}
+                  onChange={(e) =>
+                    patch({
+                      required_disclaimers: linesToList(e.target.value),
+                    })
+                  }
+                />
+              </Field>
               <Field label="Notas legales">
                 <textarea
                   className={areaCls}
@@ -733,6 +1570,13 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   onChange={(e) => patch({ sector_rules: e.target.value })}
                 />
               </Field>
+              <Field label="Derechos de imagen" className="sm:col-span-2">
+                <textarea
+                  className={areaCls}
+                  value={book.image_rights}
+                  onChange={(e) => patch({ image_rights: e.target.value })}
+                />
+              </Field>
             </div>
           )}
 
@@ -741,15 +1585,16 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
               <div className="rounded-xl border border-dashed border-gray-300 bg-gray-50 p-4 space-y-3">
                 <div className="flex items-center gap-2 text-sm font-semibold text-gray-800">
                   <Upload className="w-4 h-4" />
-                  Subir o pegar brandbook
+                  Subir o pegar brandbook / brief
                 </div>
                 <p className="text-xs text-gray-500">
-                  .txt / .md / .csv / .json — o pega el texto de un PDF/DOCX. Se
-                  guarda como fuente y alimenta notas libres.
+                  .txt / .md / .csv / .json — o pega texto de PDF/DOCX. Detecta
+                  colores #hex automáticamente. Logos y tipografías: barra
+                  «Añadir al kit».
                 </p>
                 <textarea
                   className={areaCls}
-                  placeholder="Pega aquí el brandbook o brief…"
+                  placeholder="Pega aquí el brandbook completo…"
                   value={paste}
                   onChange={(e) => setPaste(e.target.value)}
                 />
@@ -763,7 +1608,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                       className="hidden"
                       onChange={(e) => {
                         const f = e.target.files?.[0] || null;
-                        void uploadFile(f);
+                        void uploadSource(f);
                         e.target.value = '';
                       }}
                     />
@@ -771,7 +1616,7 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   <button
                     type="button"
                     disabled={uploading || !paste.trim()}
-                    onClick={() => void uploadFile(null)}
+                    onClick={() => void uploadSource(null)}
                     className="inline-flex items-center gap-1.5 rounded-lg bg-gray-900 px-3 py-2 text-xs font-semibold text-white disabled:opacity-50"
                   >
                     {uploading ? (
@@ -813,7 +1658,9 @@ export default function BrandZone({ tenantLabel }: { tenantLabel: string }) {
                   ))}
                 </ul>
               ) : (
-                <p className="text-xs text-gray-500">Aún no hay fuentes subidas.</p>
+                <p className="text-xs text-gray-500">
+                  Aún no hay fuentes de texto.
+                </p>
               )}
             </div>
           )}
diff --git a/src/lib/brandbook.ts b/src/lib/brandbook.ts
index f469cb0..200cbfe 100644
--- a/src/lib/brandbook.ts
+++ b/src/lib/brandbook.ts
@@ -1,13 +1,13 @@
 /**
- * Brandbook per tenant — source of truth for ads, RRSS calendars,
- * LinkedIn B2B and corporate blog strategy.
- * Stored in documents as type=brandbook (one active doc per tenant).
+ * Brandbook / brand kit per tenant — source of truth for ads, RRSS,
+ * LinkedIn B2B, blog and visual identity (logos, fonts, colors, files).
  */
 
 import { brandBrief } from '@/lib/calendar-generate-brand';
 
 export const BRANDBOOK_DOC_TYPE = 'brandbook';
 export const BRANDBOOK_DOC_TITLE = 'Brandbook';
+export const BRANDBOOK_FOLDER = 'brandbook';
 
 export type BrandbookSectionId =
   | 'identidad'
@@ -23,72 +23,173 @@ export type BrandbookSectionId =
   | 'compliance'
   | 'fuentes';
 
+export type BrandAssetKind =
+  | 'logo'
+  | 'font'
+  | 'image'
+  | 'icon'
+  | 'document'
+  | 'pattern'
+  | 'video'
+  | 'other';
+
+export type BrandAsset = {
+  id: string;
+  asset_file_id: string;
+  kind: BrandAssetKind;
+  role: string;
+  label: string;
+  file_name: string;
+  mime_type?: string;
+  added_at: string;
+};
+
+export type ColorToken = {
+  id: string;
+  name: string;
+  hex: string;
+  role: 'primary' | 'secondary' | 'accent' | 'neutral' | 'success' | 'warning' | 'error' | 'other';
+  usage: string;
+};
+
+export type FontToken = {
+  id: string;
+  family: string;
+  role: 'display' | 'headline' | 'body' | 'ui' | 'mono' | 'other';
+  weights: string;
+  source: 'system' | 'google' | 'file' | 'adobe' | 'other';
+  url_or_notes: string;
+  asset_file_id?: string;
+};
+
+export type BrandPersona = {
+  name: string;
+  description: string;
+  pains: string;
+  goals?: string;
+  channels?: string;
+};
+
 export type Brandbook = {
-  version: 1;
+  version: 2;
   updated_at?: string;
-  /** Identity */
+  /** Identidad */
   brand_name: string;
   tagline: string;
+  elevator_pitch: string;
+  brand_promise: string;
+  positioning: string;
+  archetype: string;
+  origin_story: string;
   mission: string;
   vision: string;
   values: string[];
   vertical: string;
-  /** Voice */
+  /** Voz */
   tone: string;
   personality: string[];
   voice_do: string[];
   voice_dont: string[];
   vocabulary_prefer: string[];
   vocabulary_avoid: string[];
-  /** Visual */
+  messaging_pillars: string[];
+  example_good: string[];
+  example_bad: string[];
+  slogan_variants: string[];
+  /** Visual kit */
+  colors: ColorToken[];
+  fonts_kit: FontToken[];
+  /** @deprecated use colors */
   colors_primary: string[];
+  /** @deprecated use colors */
   colors_secondary: string[];
+  /** @deprecated use fonts_kit */
   fonts: string[];
   visual_notes: string;
   logo_usage: string;
-  /** Audience */
+  photography_style: string;
+  illustration_style: string;
+  icon_style: string;
+  imagery_do: string[];
+  imagery_dont: string[];
+  kit_assets: BrandAsset[];
+  /** Audiencia */
   icp: string;
-  personas: Array<{ name: string; description: string; pains: string }>;
+  personas: BrandPersona[];
   geo: string;
   languages: string[];
-  /** Offer */
+  jobs_to_be_done: string[];
+  buying_triggers: string[];
+  barriers: string[];
+  customer_journey: string;
+  /** Oferta */
+  value_proposition: string;
   products_services: string[];
   differentiators: string[];
   proof_points: string[];
+  packages: string[];
+  competitive_alternatives: string[];
+  guarantee: string;
   pricing_notes: string;
-  /** Content pillars */
+  /** Pilares */
   pillars_rrss: string[];
   series_recurrentes: string[];
   formats_priority: string[];
-  /** Channels */
+  content_matrix: string;
+  taboo_topics: string[];
+  seasonal_hooks: string[];
+  /** Canales */
   channels: {
     instagram: string;
     facebook: string;
     linkedin: string;
     tiktok: string;
     blog: string;
+    youtube: string;
+    email: string;
     other: string;
   };
+  channel_handles: {
+    instagram: string;
+    facebook: string;
+    linkedin: string;
+    tiktok: string;
+    blog: string;
+    youtube: string;
+  };
+  channel_cadence: string;
+  channel_kpis: string[];
   /** Ads */
   ads_usps: string[];
   ads_objections: string[];
   ads_ctas: string[];
   ads_offers: string[];
   ads_angles: string[];
-  /** B2B / LinkedIn */
+  ads_funnel: string[];
+  ads_formats: string[];
+  landing_notes: string;
+  retargeting_angles: string[];
+  /** B2B */
   linkedin_themes: string[];
   linkedin_formats: string[];
   thought_leadership: string[];
   buyer_roles: string[];
-  /** Blog corporativo */
+  abm_notes: string;
+  case_study_angles: string[];
+  linkedin_cta: string[];
+  /** Blog */
   blog_themes: string[];
   blog_seo_keywords: string[];
   blog_cadence: string;
+  content_clusters: string[];
+  blog_cta: string[];
   /** Compliance */
   claims_forbidden: string[];
+  required_disclaimers: string[];
   legal_notes: string;
   sector_rules: string;
-  /** Uploaded / pasted source material */
+  image_rights: string;
+  /** Fuentes */
   source_excerpts: Array<{
     id: string;
     filename: string;
@@ -102,74 +203,110 @@ export const BRANDBOOK_SECTIONS: {
   id: BrandbookSectionId;
   label: string;
   hint: string;
+  expert: string;
 }[] = [
   {
     id: 'identidad',
     label: 'Identidad',
-    hint: 'Nombre, misión, visión, valores, vertical',
+    hint: 'Quién eres y por qué existes',
+    expert:
+      'Posicionamiento, promesa, arquetipo y pitch de 30s. Base de toda comunicación.',
   },
   {
     id: 'voz',
     label: 'Voz y tono',
-    hint: 'Cómo habla la marca; do/don’t y léxico',
+    hint: 'Cómo habla la marca',
+    expert:
+      'Personalidad, do/don’t, léxico y ejemplos reales de frases que sí / no.',
   },
   {
     id: 'visual',
     label: 'Visual',
-    hint: 'Colores, tipografías, logo y notas de arte',
+    hint: 'Logos, colores, tipografías y archivos',
+    expert:
+      'Kit visual accionable: sube logos, fuentes, patrones; define tokens de color y tipografía.',
   },
   {
     id: 'audiencia',
     label: 'Audiencia',
-    hint: 'ICP, personas, geo e idiomas',
+    hint: 'A quién te diriges',
+    expert: 'ICP, personas, JTBD, triggers de compra y barreras.',
   },
   {
     id: 'oferta',
     label: 'Oferta',
-    hint: 'Productos/servicios, diferenciadores, prueba',
+    hint: 'Qué vendes y por qué tú',
+    expert: 'Propuesta de valor, packs, prueba social y alternativas competitivas.',
   },
   {
     id: 'pilares',
     label: 'Pilares de contenido',
-    hint: 'Series RRSS y formatos prioritarios',
+    hint: 'Temas y series',
+    expert: 'Pilares, series recurrentes, matriz de contenido y temas tabú.',
   },
   {
     id: 'canales',
     label: 'Canales',
-    hint: 'Rol de cada red y blog',
+    hint: 'Dónde y con qué rol',
+    expert: 'Rol por canal, handles, cadencia y KPIs.',
   },
   {
     id: 'ads',
     label: 'Anuncios',
-    hint: 'USPs, objeciones, CTAs, ofertas y ángulos',
+    hint: 'Paid que convierte',
+    expert: 'USPs, objeciones, CTAs, embudo, formatos y remarketing.',
   },
   {
     id: 'b2b',
     label: 'LinkedIn B2B',
-    hint: 'Temas, formatos y thought leadership',
+    hint: 'Autoridad y pipeline',
+    expert: 'Thought leadership, buyer roles, ABM y casos de estudio.',
   },
   {
     id: 'blog',
     label: 'Blog corporativo',
-    hint: 'Temas, SEO y cadencia',
+    hint: 'SEO e inbound',
+    expert: 'Clusters, keywords, cadencia y CTAs del blog.',
   },
   {
     id: 'compliance',
     label: 'Compliance',
-    hint: 'Claims prohibidos y notas legales',
+    hint: 'Límites legales',
+    expert: 'Claims prohibidos, disclaimers obligatorios y derechos de imagen.',
   },
   {
     id: 'fuentes',
     label: 'Fuentes',
-    hint: 'Textos subidos / pegados del brandbook',
+    hint: 'Docs y brandbook original',
+    expert: 'Pega o sube el brandbook PDF/texto y cualquier brief de marca.',
   },
 ];
 
+export const ASSET_KIND_LABELS: Record<BrandAssetKind, string> = {
+  logo: 'Logo',
+  font: 'Tipografía',
+  image: 'Imagen / foto',
+  icon: 'Icono',
+  document: 'Documento',
+  pattern: 'Patrón / textura',
+  video: 'Vídeo',
+  other: 'Otro',
+};
+
+export function newId(prefix: string): string {
+  return `${prefix}_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 7)}`;
+}
+
 export function emptyBrandbook(label = ''): Brandbook {
   return {
-    version: 1,
+    version: 2,
     brand_name: label,
     tagline: '',
+    elevator_pitch: '',
+    brand_promise: '',
+    positioning: '',
+    archetype: '',
+    origin_story: '',
     mission: '',
     vision: '',
     values: [],
@@ -180,51 +317,176 @@ export function emptyBrandbook(label = ''): Brandbook {
     voice_dont: [],
     vocabulary_prefer: [],
     vocabulary_avoid: [],
+    messaging_pillars: [],
+    example_good: [],
+    example_bad: [],
+    slogan_variants: [],
+    colors: [],
+    fonts_kit: [],
     colors_primary: [],
     colors_secondary: [],
     fonts: [],
     visual_notes: '',
     logo_usage: '',
+    photography_style: '',
+    illustration_style: '',
+    icon_style: '',
+    imagery_do: [],
+    imagery_dont: [],
+    kit_assets: [],
     icp: '',
     personas: [],
     geo: 'España',
     languages: ['es'],
+    jobs_to_be_done: [],
+    buying_triggers: [],
+    barriers: [],
+    customer_journey: '',
+    value_proposition: '',
     products_services: [],
     differentiators: [],
     proof_points: [],
+    packages: [],
+    competitive_alternatives: [],
+    guarantee: '',
     pricing_notes: '',
     pillars_rrss: [],
     series_recurrentes: [],
     formats_priority: ['Reel', 'Carrusel', 'Stories', 'Post'],
+    content_matrix: '',
+    taboo_topics: [],
+    seasonal_hooks: [],
     channels: {
       instagram: '',
       facebook: '',
       linkedin: '',
       tiktok: '',
       blog: '',
+      youtube: '',
+      email: '',
       other: '',
     },
+    channel_handles: {
+      instagram: '',
+      facebook: '',
+      linkedin: '',
+      tiktok: '',
+      blog: '',
+      youtube: '',
+    },
+    channel_cadence: '',
+    channel_kpis: [],
     ads_usps: [],
     ads_objections: [],
     ads_ctas: [],
     ads_offers: [],
     ads_angles: [],
+    ads_funnel: [],
+    ads_formats: [],
+    landing_notes: '',
+    retargeting_angles: [],
     linkedin_themes: [],
     linkedin_formats: ['Carrusel', 'Documento', 'Post texto', 'Video corto'],
     thought_leadership: [],
     buyer_roles: [],
+    abm_notes: '',
+    case_study_angles: [],
+    linkedin_cta: [],
     blog_themes: [],
     blog_seo_keywords: [],
     blog_cadence: '',
+    content_clusters: [],
+    blog_cta: [],
     claims_forbidden: [],
+    required_disclaimers: [],
     legal_notes: '',
     sector_rules: '',
+    image_rights: '',
     source_excerpts: [],
     freeform_notes: '',
   };
 }
 
-/** Seed a usable brandbook from hard-coded brand DNA + sensible defaults. */
+function migrateColors(
+  o: Partial<Brandbook>,
+  empty: Brandbook
+): ColorToken[] {
+  if (Array.isArray(o.colors) && o.colors.length) {
+    return o.colors.map((c) => ({
+      id: c.id || newId('col'),
+      name: c.name || 'Color',
+      hex: normalizeHex(c.hex) || '#000000',
+      role: c.role || 'other',
+      usage: c.usage || '',
+    }));
+  }
+  const out: ColorToken[] = [];
+  for (const hex of arr(o.colors_primary)) {
+    out.push({
+      id: newId('col'),
+      name: 'Primario',
+      hex: normalizeHex(hex) || hex,
+      role: 'primary',
+      usage: 'Marca / CTAs',
+    });
+  }
+  for (const hex of arr(o.colors_secondary)) {
+    out.push({
+      id: newId('col'),
+      name: 'Secundario',
+      hex: normalizeHex(hex) || hex,
+      role: 'secondary',
+      usage: '',
+    });
+  }
+  return out.length ? out : empty.colors;
+}
+
+function migrateFonts(o: Partial<Brandbook>, empty: Brandbook): FontToken[] {
+  if (Array.isArray(o.fonts_kit) && o.fonts_kit.length) {
+    return o.fonts_kit.map((f) => ({
+      id: f.id || newId('font'),
+      family: f.family || 'Sans',
+      role: f.role || 'body',
+      weights: f.weights || '400,700',
+      source: f.source || 'other',
+      url_or_notes: f.url_or_notes || '',
+      asset_file_id: f.asset_file_id,
+    }));
+  }
+  return arr(o.fonts).map((family) => ({
+    id: newId('font'),
+    family,
+    role: 'body' as const,
+    weights: '400,700',
+    source: 'other' as const,
+    url_or_notes: '',
+  })).length
+    ? arr(o.fonts).map((family) => ({
+        id: newId('font'),
+        family,
+        role: 'body' as const,
+        weights: '400,700',
+        source: 'other' as const,
+        url_or_notes: '',
+      }))
+    : empty.fonts_kit;
+}
+
+export function normalizeHex(raw: string): string | null {
+  const s = String(raw || '').trim();
+  if (/^#[0-9a-fA-F]{3}$/.test(s)) {
+    const r = s[1],
+      g = s[2],
+      b = s[3];
+    return `#${r}${r}${g}${g}${b}${b}`.toUpperCase();
+  }
+  if (/^#[0-9a-fA-F]{6}$/.test(s)) return s.toUpperCase();
+  if (/^[0-9a-fA-F]{6}$/.test(s)) return `#${s}`.toUpperCase();
+  return null;
+}
+
+/** Seed a usable brandbook from hard-coded brand DNA + expert defaults. */
 export function seedBrandbook(slug: string, label: string): Brandbook {
   const brief = brandBrief(slug, label);
   const base = emptyBrandbook(label);
@@ -232,6 +494,11 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
     bps: {
       vertical: 'Escuela de idiomas',
       tagline: 'Inglés real, cultura pop y certificaciones',
+      elevator_pitch:
+        'Escuela de inglés práctica (Madrid/Málaga) con series virales educativas y preparación oficial Trinity/IELTS.',
+      brand_promise: 'Salir hablando con confianza, no solo aprobando teoría.',
+      positioning: 'Inglés útil + pop culture + certificación seria',
+      archetype: 'El Sabio + El Bufón (rigor + cercanía)',
       mission:
         'Ayudar a alumnos a hablar inglés con confianza para trabajo, viajes y exámenes.',
       tone: brief.tone,
@@ -246,6 +513,56 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
         'Tono académico seco',
         'Copiar títulos mes a mes',
       ],
+      messaging_pillars: [
+        'Errores que delatan',
+        'Inglés de la calle / pop',
+        'Certificaciones con método',
+      ],
+      example_good: [
+        'FALSE FRIEND · “actually” no significa “actualmente” (y te delata)',
+      ],
+      example_bad: ['POST 1 · Black Friday oferta'],
+      colors: [
+        {
+          id: newId('col'),
+          name: 'BPS Blue',
+          hex: '#1E4B8F',
+          role: 'primary',
+          usage: 'Logo / CTAs',
+        },
+        {
+          id: newId('col'),
+          name: 'Accent',
+          hex: '#F5A623',
+          role: 'accent',
+          usage: 'Highlights',
+        },
+        {
+          id: newId('col'),
+          name: 'Ink',
+          hex: '#1A1A1A',
+          role: 'neutral',
+          usage: 'Texto',
+        },
+      ],
+      fonts_kit: [
+        {
+          id: newId('font'),
+          family: 'Montserrat',
+          role: 'headline',
+          weights: '600,700',
+          source: 'google',
+          url_or_notes: 'https://fonts.google.com/specimen/Montserrat',
+        },
+        {
+          id: newId('font'),
+          family: 'Open Sans',
+          role: 'body',
+          weights: '400,600',
+          source: 'google',
+          url_or_notes: 'https://fonts.google.com/specimen/Open+Sans',
+        },
+      ],
       pillars_rrss: brief.pillars,
       series_recurrentes: [
         'FALSE FRIEND',
@@ -263,9 +580,11 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
         'Inglés oposiciones',
         'Madrid / Málaga',
       ],
+      value_proposition:
+        'Aprendes inglés usable desde la primera semana, con camino claro a certificado.',
       ads_usps: [
         'Metodología práctica',
-        'Profes nativos / preparados',
+        'Profes preparados',
         'Certificaciones oficiales',
       ],
       ads_ctas: ['Test de nivel', 'Reservar plaza', 'WhatsApp'],
@@ -274,6 +593,7 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
         'Ya probé y no aprendí',
         'Es caro',
       ],
+      ads_funnel: ['Awareness Reel', 'Consideración carrusel', 'Conversión test'],
       linkedin_themes: [
         'Inglés profesional',
         'Employability',
@@ -285,17 +605,21 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
         'Cómo elegir curso',
       ],
       channels: {
+        ...base.channels,
         instagram: 'Alcance + comunidad (Reels + Stories)',
         facebook: 'Comunidad local / padres',
         linkedin: 'B2B ligero / empleabilidad',
-        tiktok: 'Opcional micro-lecciones',
         blog: 'SEO certificaciones y objeciones',
-        other: '',
       },
     },
     'talento-y-deporte': {
       vertical: brief.vertical,
       tone: brief.tone,
+      elevator_pitch:
+        'Becas deportivas y académicas en USA con acompañamiento end-to-end.',
+      brand_promise: 'Tu talento abre puertas; nosotros abrimos el camino.',
+      positioning: 'Deporte + estudios en USA con proceso guiado',
+      archetype: 'El Héroe + El Mentor',
       pillars_rrss: brief.pillars,
       series_recurrentes: [
         'Nuevo alumno',
@@ -310,14 +634,27 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
         'Acompañamiento académico',
         'Campus visits',
       ],
-      ads_usps: ['Becas reales', 'Acompañamiento end-to-end', 'Historias de alumnos'],
+      ads_usps: [
+        'Becas reales',
+        'Acompañamiento end-to-end',
+        'Historias de alumnos',
+      ],
       ads_ctas: ['Agenda llamada', 'Evalúa tu perfil'],
       linkedin_themes: ['Educación internacional', 'Deporte + estudios'],
       blog_themes: ['Guía becas USA', 'Requisitos TOEFL/SAT', 'Vida en campus'],
+      claims_forbidden: [
+        'Garantizar beca al 100%',
+        'Promesas de universidades sin matiz',
+      ],
     },
     'halal-safety': {
       vertical: brief.vertical,
       tone: brief.tone,
+      elevator_pitch:
+        'Certificación y consultoría Halal para exportar con rigor técnico.',
+      brand_promise: 'Cumplimiento claro, mercados abiertos.',
+      positioning: 'Autoridad técnica Halal para pymes exportadoras',
+      archetype: 'El Sabio / El Gobernante',
       pillars_rrss: brief.pillars,
       products_services: [
         'Certificación Halal',
@@ -329,7 +666,7 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
       linkedin_themes: [
         'Exportación Halal',
         'Normativa',
-        'Casos sector alimentación/cosmética',
+        'Casos alimentación/cosmética',
       ],
       thought_leadership: [
         'Tendencias mercados musulmanes',
@@ -337,23 +674,44 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
       ],
       blog_themes: ['Guías de certificación', 'Mercados clave', 'FAQ técnica'],
       buyer_roles: ['Quality', 'Export manager', 'CEO pyme alimentaria'],
+      sector_rules: 'Claims técnicos verificables; sin promesas de mercado.',
     },
     'brava-dermoestetica': {
       vertical: brief.vertical,
       tone: brief.tone,
+      elevator_pitch:
+        'Clínica dermoestética con protocolos personalizados y resultados naturales.',
+      brand_promise: 'Piel cuidada con criterio médico, sin milagros.',
+      positioning: 'Dermoestética cercana y experta',
+      archetype: 'El Cuidador + El Sabio',
       pillars_rrss: brief.pillars,
       products_services: ['Peelings', 'Tratamientos facial', 'Rutinas'],
-      ads_usps: ['Resultados naturales', 'Equipo médico', 'Protocolos personalizados'],
+      ads_usps: [
+        'Resultados naturales',
+        'Equipo médico',
+        'Protocolos personalizados',
+      ],
       ads_ctas: ['Pedir cita', 'Consulta valoración'],
       claims_forbidden: [
         'Promesas milagro sin matiz',
         'Antes/después sin consentimiento',
       ],
-      sector_rules: 'Publicidad sanitaria: claims prudentes, sin garantías absolutas.',
+      required_disclaimers: [
+        'Resultados pueden variar según paciente',
+        'Consulta valoración previa',
+      ],
+      sector_rules:
+        'Publicidad sanitaria: claims prudentes, sin garantías absolutas.',
+      image_rights: 'Consentimiento escrito para antes/después.',
     },
     noberplast: {
       vertical: brief.vertical,
       tone: brief.tone,
+      elevator_pitch:
+        'Plásticos técnicos industriales con especificación y casos de uso claros.',
+      brand_promise: 'Material correcto, especificación clara, entrega fiable.',
+      positioning: 'B2B industrial LinkedIn-first',
+      archetype: 'El Creador / El Gobernante',
       pillars_rrss: brief.pillars,
       formats_priority: ['Carrusel', 'Post LinkedIn', 'Documento', 'Reel'],
       linkedin_themes: [
@@ -366,92 +724,160 @@ export function seedBrandbook(slug: string, label: string): Brandbook {
         'Especificaciones técnicas',
       ],
       buyer_roles: ['Ingeniería', 'Compras', 'Producción'],
-      blog_themes: ['Fichas técnicas', 'Aplicaciones sectoriales', 'FAQ producto'],
+      blog_themes: [
+        'Fichas técnicas',
+        'Aplicaciones sectoriales',
+        'FAQ producto',
+      ],
       channels: {
-        instagram: 'Marca / producto visual',
-        facebook: 'Bajo',
+        ...base.channels,
         linkedin: 'Canal principal B2B',
-        tiktok: 'No prioritario',
-        blog: 'SEO técnico + captación inbound',
-        other: '',
+        blog: 'SEO técnico + inbound',
+        instagram: 'Marca / producto visual (secundario)',
       },
     },
     '4ventures-hub': {
       vertical: brief.vertical,
       tone: brief.tone,
+      elevator_pitch:
+        'Agencia de growth con Centro de Mando: métricas, CRM, creatividades y contenido en un sistema.',
+      brand_promise: 'Menos caos, más decisiones con datos.',
+      positioning: 'Ops + creativo + performance para marcas en crecimiento',
+      archetype: 'El Mago / El Gobernante',
       pillars_rrss: brief.pillars,
       linkedin_themes: ['Ops de agencia', 'Growth', 'Casos clientes'],
-      thought_leadership: ['Centro de mando', 'Atribución', 'Contenido que vende'],
+      thought_leadership: [
+        'Centro de mando',
+        'Atribución',
+        'Contenido que vende',
+      ],
     },
   };
 
   const resolvedSlug = slug === 'blue-parrot-school' ? 'bps' : slug;
-
   const extra = seeds[resolvedSlug] || {
     vertical: brief.vertical,
     tone: brief.tone,
     pillars_rrss: brief.pillars,
-    products_services: [],
+    elevator_pitch: `${label}: ${brief.vertical}.`,
+    brand_promise: brief.notes,
     freeform_notes: brief.notes,
   };
 
-  return {
+  const merged = {
     ...base,
     ...extra,
     brand_name: label,
     vertical: extra.vertical || brief.vertical,
     tone: extra.tone || brief.tone,
-    pillars_rrss: extra.pillars_rrss?.length ? extra.pillars_rrss : brief.pillars,
+    pillars_rrss: extra.pillars_rrss?.length
+      ? extra.pillars_rrss
+      : brief.pillars,
+    channels: { ...base.channels, ...(extra.channels || {}) },
+    channel_handles: {
+      ...base.channel_handles,
+      ...(extra.channel_handles || {}),
+    },
+    colors: extra.colors?.length ? extra.colors : base.colors,
+    fonts_kit: extra.fonts_kit?.length ? extra.fonts_kit : base.fonts_kit,
     freeform_notes: extra.freeform_notes || brief.notes,
     updated_at: new Date().toISOString(),
-  };
+  } as Brandbook;
+
+  return merged;
 }
 
 export function parseBrandbook(raw: unknown): Brandbook | null {
   if (!raw || typeof raw !== 'object') return null;
-  const o = raw as Partial<Brandbook>;
-  if (o.version !== 1 && !o.brand_name && !o.vertical) {
-    // Allow loose objects that look like brandbooks
-    if (!('tone' in o) && !('pillars_rrss' in o) && !('mission' in o)) {
-      return null;
-    }
+  const o = raw as Record<string, unknown>;
+  const ver = Number(o.version);
+  if (
+    ver !== 1 &&
+    ver !== 2 &&
+    !o.brand_name &&
+    !o.vertical &&
+    !('tone' in o) &&
+    !('pillars_rrss' in o) &&
+    !('mission' in o) &&
+    !('kit_assets' in o)
+  ) {
+    return null;
   }
-  const empty = emptyBrandbook(String(o.brand_name || ''));
+  const partial = raw as Partial<Brandbook>;
+  const empty = emptyBrandbook(String(partial.brand_name || ''));
+  const colors = migrateColors(partial, empty);
+  const fonts_kit = migrateFonts(partial, empty);
+
   return {
     ...empty,
-    ...o,
-    version: 1,
-    values: arr(o.values),
-    personality: arr(o.personality),
-    voice_do: arr(o.voice_do),
-    voice_dont: arr(o.voice_dont),
-    vocabulary_prefer: arr(o.vocabulary_prefer),
-    vocabulary_avoid: arr(o.vocabulary_avoid),
-    colors_primary: arr(o.colors_primary),
-    colors_secondary: arr(o.colors_secondary),
-    fonts: arr(o.fonts),
-    personas: Array.isArray(o.personas) ? o.personas : [],
-    languages: arr(o.languages).length ? arr(o.languages) : ['es'],
-    products_services: arr(o.products_services),
-    differentiators: arr(o.differentiators),
-    proof_points: arr(o.proof_points),
-    pillars_rrss: arr(o.pillars_rrss),
-    series_recurrentes: arr(o.series_recurrentes),
-    formats_priority: arr(o.formats_priority),
-    channels: { ...empty.channels, ...(o.channels || {}) },
-    ads_usps: arr(o.ads_usps),
-    ads_objections: arr(o.ads_objections),
-    ads_ctas: arr(o.ads_ctas),
-    ads_offers: arr(o.ads_offers),
-    ads_angles: arr(o.ads_angles),
-    linkedin_themes: arr(o.linkedin_themes),
-    linkedin_formats: arr(o.linkedin_formats),
-    thought_leadership: arr(o.thought_leadership),
-    buyer_roles: arr(o.buyer_roles),
-    blog_themes: arr(o.blog_themes),
-    blog_seo_keywords: arr(o.blog_seo_keywords),
-    claims_forbidden: arr(o.claims_forbidden),
-    source_excerpts: Array.isArray(o.source_excerpts) ? o.source_excerpts : [],
+    ...partial,
+    version: 2,
+    values: arr(partial.values),
+    personality: arr(partial.personality),
+    voice_do: arr(partial.voice_do),
+    voice_dont: arr(partial.voice_dont),
+    vocabulary_prefer: arr(partial.vocabulary_prefer),
+    vocabulary_avoid: arr(partial.vocabulary_avoid),
+    messaging_pillars: arr(partial.messaging_pillars),
+    example_good: arr(partial.example_good),
+    example_bad: arr(partial.example_bad),
+    slogan_variants: arr(partial.slogan_variants),
+    colors,
+    fonts_kit,
+    colors_primary: colors
+      .filter((c) => c.role === 'primary')
+      .map((c) => c.hex),
+    colors_secondary: colors
+      .filter((c) => c.role === 'secondary' || c.role === 'accent')
+      .map((c) => c.hex),
+    fonts: fonts_kit.map((f) => f.family),
+    imagery_do: arr(partial.imagery_do),
+    imagery_dont: arr(partial.imagery_dont),
+    kit_assets: Array.isArray(partial.kit_assets) ? partial.kit_assets : [],
+    personas: Array.isArray(partial.personas) ? partial.personas : [],
+    languages: arr(partial.languages).length ? arr(partial.languages) : ['es'],
+    jobs_to_be_done: arr(partial.jobs_to_be_done),
+    buying_triggers: arr(partial.buying_triggers),
+    barriers: arr(partial.barriers),
+    products_services: arr(partial.products_services),
+    differentiators: arr(partial.differentiators),
+    proof_points: arr(partial.proof_points),
+    packages: arr(partial.packages),
+    competitive_alternatives: arr(partial.competitive_alternatives),
+    pillars_rrss: arr(partial.pillars_rrss),
+    series_recurrentes: arr(partial.series_recurrentes),
+    formats_priority: arr(partial.formats_priority),
+    taboo_topics: arr(partial.taboo_topics),
+    seasonal_hooks: arr(partial.seasonal_hooks),
+    channels: { ...empty.channels, ...(partial.channels || {}) },
+    channel_handles: {
+      ...empty.channel_handles,
+      ...(partial.channel_handles || {}),
+    },
+    channel_kpis: arr(partial.channel_kpis),
+    ads_usps: arr(partial.ads_usps),
+    ads_objections: arr(partial.ads_objections),
+    ads_ctas: arr(partial.ads_ctas),
+    ads_offers: arr(partial.ads_offers),
+    ads_angles: arr(partial.ads_angles),
+    ads_funnel: arr(partial.ads_funnel),
+    ads_formats: arr(partial.ads_formats),
+    retargeting_angles: arr(partial.retargeting_angles),
+    linkedin_themes: arr(partial.linkedin_themes),
+    linkedin_formats: arr(partial.linkedin_formats),
+    thought_leadership: arr(partial.thought_leadership),
+    buyer_roles: arr(partial.buyer_roles),
+    case_study_angles: arr(partial.case_study_angles),
+    linkedin_cta: arr(partial.linkedin_cta),
+    blog_themes: arr(partial.blog_themes),
+    blog_seo_keywords: arr(partial.blog_seo_keywords),
+    content_clusters: arr(partial.content_clusters),
+    blog_cta: arr(partial.blog_cta),
+    claims_forbidden: arr(partial.claims_forbidden),
+    required_disclaimers: arr(partial.required_disclaimers),
+    source_excerpts: Array.isArray(partial.source_excerpts)
+      ? partial.source_excerpts
+      : [],
   };
 }
 
@@ -460,7 +886,6 @@ function arr(v: unknown): string[] {
   return v.map((x) => String(x || '').trim()).filter(Boolean);
 }
 
-/** Lines / commas → string[] for form fields. */
 export function linesToList(text: string): string[] {
   return text
     .split(/\n|,/)
@@ -472,7 +897,6 @@ export function listToLines(list: string[]): string {
   return (list || []).join('\n');
 }
 
-/** Heuristic: fold uploaded plain text into freeform + optional lists. */
 export function ingestSourceText(
   book: Brandbook,
   filename: string,
@@ -480,7 +904,7 @@ export function ingestSourceText(
 ): Brandbook {
   const excerpt = text.slice(0, 12000).trim();
   if (!excerpt) return book;
-  const id = `src_${Date.now().toString(36)}`;
+  const id = newId('src');
   const next: Brandbook = {
     ...book,
     source_excerpts: [
@@ -492,14 +916,16 @@ export function ingestSourceText(
       },
       ...(book.source_excerpts || []),
     ].slice(0, 20),
-    freeform_notes: [book.freeform_notes, `--- ${filename} ---\n${excerpt.slice(0, 4000)}`]
+    freeform_notes: [
+      book.freeform_notes,
+      `--- ${filename} ---\n${excerpt.slice(0, 4000)}`,
+    ]
       .filter(Boolean)
       .join('\n\n')
       .slice(0, 50000),
     updated_at: new Date().toISOString(),
   };
 
-  // Light keyword pulls into empty fields
   const lower = excerpt.toLowerCase();
   if (!next.mission && /misi[oó]n/.test(lower)) {
     const m = excerpt.match(/misi[oó]n[:\s]+(.{20,200})/i);
@@ -509,42 +935,68 @@ export function ingestSourceText(
     const m = excerpt.match(/tono[:\s]+(.{10,120})/i);
     if (m) next.tone = m[1].trim();
   }
+  // Pull hex colors from pasted brandbooks
+  const hexes = excerpt.match(/#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{6})\b/g) || [];
+  for (const h of hexes.slice(0, 8)) {
+    const hex = normalizeHex(h);
+    if (!hex) continue;
+    if (next.colors.some((c) => c.hex.toUpperCase() === hex)) continue;
+    next.colors.push({
+      id: newId('col'),
+      name: 'Detectado',
+      hex,
+      role: next.colors.length ? 'secondary' : 'primary',
+      usage: 'Extraído de fuente',
+    });
+  }
   return next;
 }
 
-/** Compact prompt block for strategists / Anthropic. */
 export function brandbookToPrompt(book: Brandbook): string {
+  const colorLine = book.colors
+    .map((c) => `${c.name} ${c.hex} (${c.role})`)
+    .join(', ');
+  const fontLine = book.fonts_kit
+    .map((f) => `${f.family} [${f.role}]`)
+    .join(', ');
+  const assets = book.kit_assets
+    .slice(0, 12)
+    .map((a) => `${a.kind}:${a.role || a.label}`)
+    .join(', ');
   const lines = [
     `Marca: ${book.brand_name}`,
     book.tagline && `Tagline: ${book.tagline}`,
+    book.elevator_pitch && `Pitch: ${book.elevator_pitch}`,
+    book.brand_promise && `Promesa: ${book.brand_promise}`,
+    book.positioning && `Posicionamiento: ${book.positioning}`,
+    book.archetype && `Arquetipo: ${book.archetype}`,
     book.vertical && `Vertical: ${book.vertical}`,
     book.mission && `Misión: ${book.mission}`,
     book.tone && `Tono: ${book.tone}`,
     book.personality.length && `Personalidad: ${book.personality.join(', ')}`,
     book.voice_do.length && `Hacer: ${book.voice_do.join('; ')}`,
     book.voice_dont.length && `Evitar: ${book.voice_dont.join('; ')}`,
+    book.messaging_pillars.length &&
+      `Mensajes: ${book.messaging_pillars.join('; ')}`,
+    colorLine && `Colores: ${colorLine}`,
+    fontLine && `Tipografías: ${fontLine}`,
+    assets && `Kit archivos: ${assets}`,
     book.series_recurrentes.length &&
       `Series RRSS: ${book.series_recurrentes.join(', ')}`,
     book.pillars_rrss.length && `Pilares: ${book.pillars_rrss.join(', ')}`,
+    book.value_proposition && `VP: ${book.value_proposition}`,
     book.products_services.length &&
       `Oferta: ${book.products_services.join(', ')}`,
-    book.differentiators.length &&
-      `Diferenciadores: ${book.differentiators.join(', ')}`,
     book.icp && `ICP: ${book.icp}`,
     book.ads_usps.length && `USPs ads: ${book.ads_usps.join('; ')}`,
     book.ads_ctas.length && `CTAs: ${book.ads_ctas.join('; ')}`,
-    book.ads_objections.length &&
-      `Objeciones: ${book.ads_objections.join('; ')}`,
     book.linkedin_themes.length &&
       `LinkedIn: ${book.linkedin_themes.join(', ')}`,
-    book.thought_leadership.length &&
-      `Thought leadership: ${book.thought_leadership.join(', ')}`,
     book.blog_themes.length && `Blog: ${book.blog_themes.join(', ')}`,
-    book.blog_seo_keywords.length &&
-      `SEO: ${book.blog_seo_keywords.join(', ')}`,
     book.claims_forbidden.length &&
       `Prohibido: ${book.claims_forbidden.join('; ')}`,
-    book.legal_notes && `Legal: ${book.legal_notes}`,
+    book.required_disclaimers.length &&
+      `Disclaimers: ${book.required_disclaimers.join('; ')}`,
     book.freeform_notes && `Notas: ${book.freeform_notes.slice(0, 1500)}`,
   ].filter(Boolean);
   return lines.join('\n');
@@ -555,13 +1007,30 @@ export function brandbookCompleteness(book: Brandbook): {
   missing: string[];
 } {
   const checks: [string, boolean][] = [
-    ['Identidad (misión/vertical)', !!(book.mission || book.vertical)],
+    [
+      'Identidad (pitch/misión/posicionamiento)',
+      !!(book.elevator_pitch || book.mission || book.positioning),
+    ],
     ['Voz/tono', !!book.tone],
+    [
+      'Visual (color o logo)',
+      !!(book.colors.length || book.kit_assets.some((a) => a.kind === 'logo')),
+    ],
+    ['Tipografía', book.fonts_kit.length > 0],
     ['Audiencia/ICP', !!(book.icp || book.personas.length)],
-    ['Oferta', book.products_services.length > 0],
-    ['Pilares/series RRSS', !!(book.pillars_rrss.length || book.series_recurrentes.length)],
+    [
+      'Oferta',
+      !!(book.products_services.length || book.value_proposition),
+    ],
+    [
+      'Pilares/series RRSS',
+      !!(book.pillars_rrss.length || book.series_recurrentes.length),
+    ],
     ['Ads (USP o CTA)', !!(book.ads_usps.length || book.ads_ctas.length)],
-    ['LinkedIn B2B o blog', !!(book.linkedin_themes.length || book.blog_themes.length)],
+    [
+      'LinkedIn B2B o blog',
+      !!(book.linkedin_themes.length || book.blog_themes.length),
+    ],
   ];
   const missing = checks.filter(([, ok]) => !ok).map(([l]) => l);
   const score = Math.round(
@@ -569,3 +1038,11 @@ export function brandbookCompleteness(book: Brandbook): {
   );
   return { score, missing };
 }
+
+export function primaryLogo(book: Brandbook): BrandAsset | undefined {
+  return (
+    book.kit_assets.find(
+      (a) => a.kind === 'logo' && /primary|principal|main/i.test(a.role)
+    ) || book.kit_assets.find((a) => a.kind === 'logo')
+  );
+}