graph TD
    %% --- CAPA INTERFAZ (FLOTANTE ARRIBA) ---
    subgraph Frontend [APLICACIÓN ESCRITORIO]
        UI[Cuadrito Flotante & Panel Lateral<br>Electron + Tailwind]
    end

    %% --- MOTOR CENTRAL EN ORDEN ---
    subgraph Backend [MOTOR CENTRAL EN PYTHON - FastAPI + LangGraph]
        
        %% NIVEL 1: ENTRADA
        subgraph D1 [📥 Dept 1: Recepción y Filtro]
            A1[Agente 1: Email]
            A2[Agente 2: WhatsApp]
            A3[Agente 3: Voz]
            A4[Agente 4: Traductor/Archivos]
            A5{Agente 5: ENRUTADOR JEFE<br>Claude 3.5}
            
            A1 & A2 & A3 & A4 --> A5
        end

        %% NIVEL 2: PROCESAMIENTO PARALELO
        subgraph D2 [🏢 Dept 2: Operaciones Web & CRM]
            A6[Agente 6: Extractor]
            A7[Agente 7: Buscador]
            A8[Agente 8: Login]
            A9[Agente 9: INYECTOR WEB]
            A10[Agente 10: Calendario]
            A11[Agente 11: Agendas]
            A12[Agente 12: Errores]
            
            A6 --> A7 --> A8 --> A9
            A10 --> A11 --> A12
        end

        subgraph D3 [🧾 Dept 3: Finanzas y Documentos]
            A13[Agente 13: OCR]
            A14[Agente 14: Validar]
            A15[Agente 15: Cuentas]
            A16[Agente 16: Contable]
            A17[Agente 17: Facturas]
            A18[Agente 18: Bancos]
            A19[Agente 19: Impagos]
            
            A13 --> A14 --> A15 --> A16
            A17 --> A18 --> A19
        end

        %% NIVEL 3: GENERACIÓN
        subgraph D4 [✍️ Dept 4: Redacción y Tono]
            A20[Agente 20: Clon Tono]
            A21[Agente 21: Mails]
            A22[Agente 22: Chats]
            A23[Agente 23: Guión Voz]
            A24[Agente 24: Traductor]
            
            A20 --> A21 & A22 & A23 & A24
        end

        %% NIVEL 4: CONTROL Y SEGURIDAD
        subgraph D5 [🛡️ Dept 5: Control, Seguridad y Freno]
            A25[Agente 25: Antialucinación]
            A26[Agente 26: Sup Visual]
            A27[Agente 27: Historiador]
            A28[Agente 28: Empaquetador UI]
            A29{Agente 29: GATEKEEPER<br>Freno Humano}
            A30[Agente 30: DISPARADOR FINAL]
            
            A25 --> A26 --> A27 --> A28 --> A29
            A29 -- Aprobado --> A30
        end

    end

    %% --- CAPA MUNDO REAL (ABAJO DEL TODO) ---
    subgraph MundoReal [LAS HERRAMIENTAS DEL MUNDO REAL]
        Chrome[🌐 Chrome Local<br>Puerto 9222]
        VozAPI[📞 Vapi / Retell<br>Llamadas de Voz]
        WhaAPI[💬 WhatsApp Business API<br>Mensajes Chat]
    end

    %% --- CONEXIONES JERÁRQUICAS ESTRICTAS ---
    
    %% Inputs del mundo real hacia la recepción
    WhaAPI -.-> A2
    VozAPI -.-> A3

    %% Del Filtro a los Departamentos de Operación
    A5 --> D2
    A5 --> D3
    
    %% De la Operación a la Redacción
    D2 --> D4
    D3 --> D4
    
    %% De la Redacción al Control Final
    D4 --> A25
    
    %% Comunicación con la Interfaz flotante desde el Gatekeeper
    A28 <==>|WebSockets| UI
    A29 <==>|Aprobación Humana| UI
    
    %% Del Disparador Final a las APIs del mundo real
    A30 ==> Chrome
    A30 ==> VozAPI
    A30 ==> WhaAPI

    %% --- ESTILOS VISUALES ---
    classDef frontend fill:#2d3748,stroke:#4a5568,stroke-width:2px,color:#fff;
    classDef router fill:#ed8936,stroke:#c05621,stroke-width:2px,color:#fff;
    classDef gatekeeper fill:#e53e3e,stroke:#9b2c2c,stroke-width:3px,color:#fff;
    classDef tools fill:#2b6cb0,stroke:#2b6cb0,stroke-width:2px,color:#fff;
    classDef dept fill:#edf2f7,stroke:#cbd5e0,stroke-width:1px,color:#2d3748;

    class UI frontend;
    class A5 router;
    class A29 gatekeeper;
    class Chrome,VozAPI,WhaAPI tools;
    class D1,D2,D3,D4,D5 dept;