// ===== Agentes · página individual dos 6 agentes =====

const AGENT_DETAILS = {
  hunter: {
    key: "hunter", emoji: "🔍", name: "Caça-Editais", role: "Encontra o que faz sentido pra você", model: "haiku-4.5", color: "pleita-info",
    pitch: "Vasculha 9 portais públicos a cada 15 minutos. Filtra os 312 editais que entram no ar todo dia até sobrar só os 8 que combinam com seu perfil.",
    stats: [
      { k: "Editais varridos hoje",   v: "8.412",  d: "todos os portais conveniados" },
      { k: "Match médio",             v: "62%",    d: "vs perfil da sua empresa" },
      { k: "Latência por edital",     v: "0,4s",   d: "P95 · haiku 4.5 frio" },
      { k: "Custo médio · 1k editais", v: "US$ 0,84", d: "tokens de input + output" },
    ],
    como: [
      "Lista todos os editais publicados em 9 portais nos últimos 15 minutos.",
      "Aplica filtros booleanos do seu cadastro (UF, modalidade, valor, CNAE).",
      "Para cada edital filtrado, faz o primeiro pass: lê título, objeto e órgão.",
      "Atribui score 0-100 com base no perfil e empurra pro Analista os ≥60.",
    ],
    dados: ["compras.gov.br", "PNCP", "BEC-SP", "BLL-PR", "PCP-MG", "ComprasNet", "Licitações-e", "Portal Compras Públicas", "Comprasnet Bahia"],
    samples: [
      { ed: "EDT-2026-04-A1B2", obj: "Aquisição de equipamentos de TI",       org: "Pref. Campinas",      match: 89, when: "há 8min" },
      { ed: "EDT-2026-04-3C8D", obj: "Locação de impressoras outsourcing",    org: "TRF 3ª Região",       match: 92, when: "há 22min" },
      { ed: "EDT-2026-04-5E11", obj: "Manutenção preventiva de elevadores",   org: "USP",                 match: 84, when: "há 38min" },
    ],
  },
  analyst: {
    key: "analyst", emoji: "🎯", name: "Analista", role: "Cruza objeto, valor e concorrência", model: "sonnet-4.5", color: "pleita-lime",
    pitch: "Pega cada edital pré-aprovado pelo Caça-Editais e mergulha fundo: lê os 80+ páginas do anexo técnico, calcula concorrência estimada, decide se vale o esforço.",
    stats: [
      { k: "Editais analisados (mês)", v: "247",    d: "passados a fundo" },
      { k: "Score médio · go",         v: "82",     d: "veredicto PARTICIPE" },
      { k: "Score médio · stop",       v: "38",     d: "veredicto NÃO PARTICIPE" },
      { k: "Latência por análise",     v: "2,3s",   d: "P95 · sonnet 4.5 com cache de prompt" },
    ],
    como: [
      "Lê edital completo + anexos técnicos (até 84 páginas em paralelo).",
      "Identifica objeto, prazo, valor de referência e exigências de habilitação.",
      "Estima concorrência baseado em pregões similares dos últimos 12 meses.",
      "Calcula score final e emite veredicto: PARTICIPE / CUIDADO / NÃO PARTICIPE.",
    ],
    dados: ["edital + todos os anexos", "histórico de pregões públicos · 5 anos", "perfil da sua empresa", "concorrentes regionais cadastrados"],
    samples: [
      { ed: "EDT-2026-04-A1B2", obj: "match 89% · concorrência 6 empresas",      org: "PARTICIPE",     match: 89, when: "há 2h" },
      { ed: "EDT-2026-04-9F2C", obj: "exigência abusiva de atestado de R$ 5M",  org: "CUIDADO",       match: 71, when: "ontem" },
      { ed: "EDT-2026-04-77E1", obj: "valor de obra fora do seu porte",          org: "NÃO PARTICIPE", match: 42, when: "ontem" },
    ],
  },
  legal: {
    key: "legal", emoji: "⚖️", name: "Jurídico", role: "Lê 80 páginas e aponta os riscos", model: "sonnet-4.5", color: "verdict-stop",
    pitch: "Treinado em Lei 14.133, súmulas do TCU e jurisprudência. Acha cláusula abusiva, fundamenta impugnação e prepara minuta no padrão jurídico do órgão.",
    stats: [
      { k: "Peças geradas (mês)",   v: "47",   d: "impugnações, recursos, minutas" },
      { k: "Taxa de acolhimento",   v: "68%",  d: "peças que viraram decisão favorável" },
      { k: "Cláusulas abusivas",    v: "143",  d: "identificadas e marcadas no mês" },
      { k: "Latência por leitura",  v: "4,1s", d: "P95 · 80 páginas + jurisprudência" },
    ],
    como: [
      "Lê edital, anexos, contrato modelo e ata de outras licitações do órgão.",
      "Cruza cada cláusula com Lei 14.133, acórdãos TCU e súmulas do TCE.",
      "Sinaliza cláusulas potencialmente abusivas ou ilegais.",
      "Quando solicitado, gera peças (impugnação, recurso, contrarrazão) em padrão jurídico.",
    ],
    dados: ["Lei 14.133/21 e 8.666/93", "acórdãos TCU 2019-2026", "jurisprudência TCE de todos os estados", "base de minutas anteriores"],
    samples: [
      { ed: "EDT-2026-04-A1B2", obj: "cláusula 4.3 § II · exigência abusiva",   org: "minuta de impugnação pronta", match: null, when: "há 1h" },
      { ed: "EDT-2026-04-B6F0", obj: "atestado de 3 anos · súmula TCU 263",     org: "recurso preparado",           match: null, when: "ontem" },
      { ed: "EDT-2026-03-7811", obj: "decisão favorável · contrarrazões aceitas", org: "acolhido", match: null, when: "há 4 dias" },
    ],
  },
  finance: {
    key: "finance", emoji: "💰", name: "Financeiro", role: "Calcula BDI, margem, fluxo de caixa", model: "haiku-4.5", color: "verdict-go",
    pitch: "Roda a planilha de custos com o seu BDI real. Diz qual é o preço-piso que ainda dá margem e simula o impacto no fluxo de caixa nos próximos 90 dias.",
    stats: [
      { k: "BDI da sua empresa",      v: "22,4%", d: "tributos + administração + lucro" },
      { k: "Margem média ofertada",   v: "18,0%", d: "nos últimos 6 contratos" },
      { k: "Preço-piso médio",        v: "−74%",  d: "sobre o valor de referência" },
      { k: "Latência por simulação",  v: "0,7s",  d: "P95 · haiku 4.5" },
    ],
    como: [
      "Importa sua tabela de custos diretos e indiretos.",
      "Aplica BDI por categoria de item (insumos, mão-de-obra, serviços).",
      "Simula 3 estratégias: conservadora, equilibrada, agressiva.",
      "Projeta fluxo de caixa: data do contrato → 1º pagamento → ciclo do projeto.",
    ],
    dados: ["sua tabela de custos", "índices CUB/SINAPI/SBC", "histórico de margem por tipo de contrato", "saldo bancário (opcional, via OpenFinance)"],
    samples: [
      { ed: "EDT-2026-04-A1B2", obj: "piso R$ 312k · margem 18,2%",            org: "viável",         match: null, when: "há 2h" },
      { ed: "EDT-2026-04-9F2C", obj: "piso R$ 614k · margem 8,1%",             org: "no limite",      match: null, when: "ontem" },
      { ed: "EDT-2026-04-77E1", obj: "piso R$ 15,8M · margem negativa",        org: "NÃO viável",     match: null, when: "ontem" },
    ],
  },
  docs: {
    key: "docs", emoji: "📋", name: "Documentalista", role: "Cuida do cofre e dos prazos", model: "haiku-4.5", color: "pleita-stone-2",
    pitch: "Sabe a validade de cada certidão antes mesmo de você. Lembra de renovar com antecedência e emite as fáceis automaticamente.",
    stats: [
      { k: "Documentos no cofre",     v: "31",  d: "de 5 empresas do grupo" },
      { k: "Renovações automáticas",  v: "94%", d: "feitas sem intervenção" },
      { k: "Próximas no radar",       v: "3",   d: "vencem nas próximas 4 semanas" },
      { k: "Pendências críticas",     v: "1",   d: "Balanço 2025 ainda não anexado" },
    ],
    como: [
      "Indexa cada documento por tipo, validade e órgão emissor.",
      "Monitora portais de emissão e detecta antecipadamente bloqueios.",
      "Para CNDs simples (Federal, FGTS, Trabalhista), tenta emitir automaticamente.",
      "Para as que precisam de ação humana, dispara avisos com 30, 14 e 7 dias.",
    ],
    dados: ["seu cofre digital", "portais de emissão (receita, caixa, TST, prefeituras)", "histórico de renovações", "calendário fiscal"],
    samples: [
      { ed: "CND Federal",          obj: "vence em 18 dias · será emitida automaticamente em 12 mai", org: "ok",       match: null, when: "agora" },
      { ed: "CRF FGTS",             obj: "renovada agora · próxima validade 21 nov",                  org: "renovado", match: null, when: "há 4 min" },
      { ed: "Balanço Patrimonial",  obj: "ainda não anexado · solicite ao seu contador",              org: "pendente", match: null, when: "alerta" },
    ],
  },
  coach: {
    key: "coach", emoji: "🎓", name: "Coach", role: "Explica em linguagem simples", model: "sonnet-4.5", color: "pleita-lime",
    pitch: "Quando o Modo Iniciante está ligado, ele entra. Pega tudo que os outros 5 agentes decidiram e traduz no português do dia-a-dia. Sem juridiquês.",
    stats: [
      { k: "Iniciantes ativos",      v: "1.847", d: "tenants em Modo Iniciante" },
      { k: "% iniciantes vence/90d", v: "31%",   d: "vs 19% sem Coach" },
      { k: "Termos traduzidos",       v: "284",  d: "no glossário vivo" },
      { k: "Latência por explicação", v: "1,2s", d: "P95 · sonnet 4.5 streaming" },
    ],
    como: [
      "Substitui jargões do Direito Administrativo por palavras do dia-a-dia.",
      "Adiciona contexto e analogias quando uma decisão pode confundir.",
      "Quando você clica num botão crítico, mostra resumo simples antes da confirmação.",
      "Aprende com erros recorrentes: se vários iniciantes tropeçam num termo, vira tooltip permanente.",
    ],
    dados: ["seu nível de experiência", "ações que você já completou", "glossário Pleita", "histórico de tropeços de outros iniciantes"],
    samples: [
      { ed: "Tradução", obj: "“Habilitação” → “Envio dos seus documentos”",                                   org: "padrão", match: null, when: "—" },
      { ed: "Aviso",    obj: "“Atenção, esse pregão é maior que seu ticket médio. Vale conversar com sócio.”", org: "ativo",  match: null, when: "agora" },
      { ed: "Coach",    obj: "“Esse veredicto verde significa: a Pleita acha que vale a pena. Quer ver por quê?”", org: "tooltip", match: null, when: "—" },
    ],
  },
};

function AgentHero({ a }) {
  return (
    <header className="rounded-3xl bg-pleita-ink text-pleita-paper p-8 md:p-12 relative overflow-hidden">
      <div className="absolute inset-0 opacity-30" style={{ backgroundImage: "radial-gradient(rgb(159 232 112 / .12) 1.5px, transparent 1.5px)", backgroundSize: "12px 12px" }} />
      <div className="relative flex items-start gap-8">
        <div className={`size-32 md:size-40 rounded-3xl bg-pleita-paper/10 backdrop-blur grid place-items-center text-7xl md:text-8xl shrink-0 border border-pleita-paper/15`}>
          {a.emoji}
        </div>
        <div className="flex-1 min-w-0">
          <div className="pl-num text-[10px] uppercase tracking-[0.22em] text-pleita-paper/60">Agente · {a.model}</div>
          <h1 className="font-display text-5xl md:text-6xl mt-2 leading-none tracking-tight">{a.name}<span className="text-pleita-lime">.</span></h1>
          <p className="text-sm md:text-base text-pleita-paper/70 mt-2 max-w-xl">{a.role}</p>
          <p className="text-sm md:text-base text-pleita-paper mt-5 max-w-2xl leading-relaxed">{a.pitch}</p>
        </div>
      </div>
    </header>
  );
}

function AgentStats({ stats }) {
  return (
    <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-3">
      {stats.map((s) => (
        <div key={s.k} className="rounded-2xl bg-surface-card border border-pleita-line p-5">
          <div className="pl-num text-[10px] uppercase tracking-wider text-pleita-stone-2">{s.k}</div>
          <div className="font-display text-3xl text-pleita-ink mt-1 pl-num">{s.v}</div>
          <div className="pl-num text-[11px] text-pleita-stone-2 mt-1">{s.d}</div>
        </div>
      ))}
    </div>
  );
}

function AgentScreen({ aKey }) {
  const a = AGENT_DETAILS[aKey];
  const ids = Object.keys(AGENT_DETAILS);
  const idx = ids.indexOf(aKey);
  const prev = ids[(idx - 1 + ids.length) % ids.length];
  const next = ids[(idx + 1) % ids.length];
  const [active, setActive] = React.useState(aKey);
  React.useEffect(() => { setActive(aKey); }, [aKey]);
  const showAgent = AGENT_DETAILS[active];

  return (
    <div className="max-w-7xl mx-auto px-4 md:px-8 py-10">
      {/* Agent picker */}
      <nav className="flex items-center gap-2 mb-8 overflow-x-auto scrollbar-pl pb-2">
        {ids.map((k) => {
          const ag = AGENT_DETAILS[k];
          const isOn = k === active;
          return (
            <button
              key={k}
              onClick={() => setActive(k)}
              className={`inline-flex items-center gap-2 px-4 py-2 rounded-full text-sm whitespace-nowrap transition-colors ${isOn ? "bg-pleita-ink text-pleita-paper" : "bg-surface-2 text-pleita-stone hover:text-pleita-ink"}`}
            >
              <span>{ag.emoji}</span>{ag.name}
            </button>
          );
        })}
      </nav>

      <AgentHero a={showAgent} />

      <section className="mt-10">
        <h2 className="font-display text-2xl text-pleita-ink mb-4">Em números</h2>
        <AgentStats stats={showAgent.stats} />
      </section>

      <section className="grid lg:grid-cols-2 gap-6 mt-10">
        <div>
          <h2 className="font-display text-2xl text-pleita-ink mb-4">Como funciona</h2>
          <ol className="space-y-4">
            {showAgent.como.map((c, i) => (
              <li key={i} className="flex gap-4">
                <span className="size-9 rounded-full bg-pleita-lime text-pleita-ink pl-num font-semibold grid place-items-center shrink-0">{i + 1}</span>
                <p className="text-sm text-pleita-ink leading-relaxed pt-1">{c}</p>
              </li>
            ))}
          </ol>
        </div>
        <div>
          <h2 className="font-display text-2xl text-pleita-ink mb-4">Dados que acessa</h2>
          <div className="rounded-2xl bg-surface-card border border-pleita-line p-6 space-y-3">
            {showAgent.dados.map((d) => (
              <div key={d} className="flex items-center gap-3 text-sm">
                <span className="size-7 rounded-md bg-surface-2 grid place-items-center"><Icons.Building2 className="size-3.5 text-pleita-stone-2" /></span>
                <span className="text-pleita-ink">{d}</span>
              </div>
            ))}
            <div className="mt-4 pt-4 border-t border-pleita-line">
              <p className="pl-num text-[11px] text-pleita-stone-2 leading-relaxed">
                Todos os dados ficam isolados por tenant (RLS). O agente nunca lê dados de outras empresas.
              </p>
            </div>
          </div>
        </div>
      </section>

      <section className="mt-10">
        <h2 className="font-display text-2xl text-pleita-ink mb-4">Atividade recente</h2>
        <div className="rounded-2xl bg-surface-card border border-pleita-line overflow-hidden">
          {showAgent.samples.map((s, i) => (
            <div key={i} className={`flex items-start gap-4 px-5 py-4 ${i > 0 ? "border-t border-pleita-line" : ""}`}>
              <div className="size-10 rounded-md bg-pleita-paper-2 grid place-items-center text-base shrink-0">{showAgent.emoji}</div>
              <div className="flex-1 min-w-0">
                <div className="text-sm text-pleita-ink truncate">{s.ed}</div>
                <div className="pl-num text-[11px] text-pleita-stone-2 mt-1">{s.obj}</div>
              </div>
              <div className="text-right">
                {s.match != null && <div className="pl-num text-sm text-pleita-ink">score {s.match}</div>}
                <div className={`pl-num text-[10px] uppercase tracking-wider mt-1 ${s.org === "ok" || s.org === "renovado" || s.org === "acolhido" || s.org === "PARTICIPE" || s.org === "viável" ? "text-verdict-go" : s.org === "no limite" || s.org === "CUIDADO" ? "text-verdict-caution" : s.org === "NÃO viável" || s.org === "NÃO PARTICIPE" || s.org === "pendente" ? "text-verdict-stop" : "text-pleita-stone-2"}`}>{s.org}</div>
                <div className="pl-num text-[10px] text-pleita-stone-2 mt-1">{s.when}</div>
              </div>
            </div>
          ))}
        </div>
      </section>

      <nav className="mt-12 flex items-center justify-between border-t border-pleita-line pt-6">
        <button onClick={() => setActive(prev)} className="pl-num text-xs text-pleita-stone-2 hover:text-pleita-ink inline-flex items-center gap-2">
          <Icons.ChevronRight className="size-4 rotate-180" /> {AGENT_DETAILS[prev].name}
        </button>
        <div className="pl-num text-[11px] uppercase tracking-wider text-pleita-stone-2">{idx + 1} de 6</div>
        <button onClick={() => setActive(next)} className="pl-num text-xs text-pleita-stone-2 hover:text-pleita-ink inline-flex items-center gap-2">
          {AGENT_DETAILS[next].name} <Icons.ChevronRight className="size-4" />
        </button>
      </nav>
    </div>
  );
}

function ScreenAgentes() {
  return (
    <div className="h-full overflow-y-auto scrollbar-pl bg-surface-1">
      <AgentScreen aKey="hunter" />
    </div>
  );
}

Object.assign(window, { ScreenAgentes });