<style> * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: var(--font-sans); } .wrap { padding: 1.5rem 0; } .grid-header { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 8px; } .col-head { padding: 10px 14px; border-radius: var(--border-radius-md); font-size: 13px; font-weight: 500; text-align: center; } .col-ai { background: #EEEDFE; color: #3C3489; } .col-ecom { background: #E1F5EE; color: #085041; } .col-cor { background: #FAEEDA; color: #633806; } @media (prefers-color-scheme: dark) { .col-ai { background: #3C3489; color: #CECBF6; } .col-ecom { background: #085041; color: #9FE1CB; } .col-cor { background: #633806; color: #FAC775; } } .row-wrap { margin-bottom: 10px; border: 1px solid var(--color-border-tertiary); border-radius: var(--border-radius-lg); overflow: hidden; cursor: pointer; transition: border-color 0.15s; } .row-wrap:hover { border-color: var(--color-border-primary); } .row-wrap.open { border-color: var(--color-border-secondary); } .row-top { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; padding: 12px 14px; background: var(--color-background-secondary); align-items: start; } .row-wrap.open .row-top { background: var(--color-background-primary); } .cell { font-size: 13px; line-height: 1.5; } .cell-title { font-size: 14px; font-weight: 500; color: var(--color-text-primary); margin-bottom: 2px; } .cell-sub { font-size: 12px; color: var(--color-text-secondary); } .cell-ai .cell-title { color: #534AB7; } .cell-ecom .cell-title { color: #0F6E56; } .cell-cor .cell-title { color: #854F0B; } @media (prefers-color-scheme: dark) { .cell-ai .cell-title { color: #AFA9EC; } .cell-ecom .cell-title { color: #5DCAA5; } .cell-cor .cell-title { color: #EF9F27; } } .row-detail { display: none; padding: 12px 14px; background: var(--color-background-primary); border-top: 1px solid var(--color-border-tertiary); font-size: 13px; color: var(--color-text-secondary); line-height: 1.6; } .row-wrap.open .row-detail { display: block; } .detail-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; } .detail-col { font-size: 12px; line-height: 1.6; color: var(--color-text-secondary); } .detail-col strong { font-weight: 500; color: var(--color-text-primary); font-size: 12px; display: block; margin-bottom: 3px; } .arrow-hint { font-size: 11px; color: var(--color-text-tertiary); text-align: right; padding-bottom: 4px; } .connector { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; padding: 0 14px 6px; pointer-events: none; } .conn-line { height: 12px; position: relative; display: flex; align-items: center; justify-content: center; } .conn-line::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 1px; height: 12px; border-left: 1px dashed var(--color-border-secondary); } .legend { display: flex; gap: 20px; justify-content: center; margin-top: 16px; flex-wrap: wrap; } .leg-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--color-text-secondary); } .leg-dot { width: 10px; height: 10px; border-radius: 50%; } .leg-ai { background: #534AB7; } .leg-ec { background: #0F6E56; } .leg-co { background: #854F0B; } @media (prefers-color-scheme: dark) { .leg-ai { background: #AFA9EC; } .leg-ec { background: #5DCAA5; } .leg-co { background: #EF9F27; } } </style> <div class="wrap"> <div class="arrow-hint">clique em cada linha para expandir ↓</div> <div class="grid-header"> <div class="col-head col-ai">🤖 Camada de IA</div> <div class="col-head col-ecom">🛒 E-commerce</div> <div class="col-head col-cor">📦 Correios / Logística</div> </div> <!-- Row 1: MCP --> <div class="row-wrap" onclick="toggle(this)"> <div class="row-top"> <div class="cell cell-ai"><div class="cell-title">MCP</div><div class="cell-sub">Model Context Protocol</div></div> <div class="cell cell-ecom"><div class="cell-title">APIs REST / EDI</div><div class="cell-sub">Conectores de marketplace e ERP</div></div> <div class="cell cell-cor"><div class="cell-title">SIGEP Web / Webservices</div><div class="cell-sub">Integração padrão de frete</div></div> </div> <div class="row-detail"> <div class="detail-grid"> <div class="detail-col"><strong>Como funciona na IA</strong>O MCP é um protocolo aberto que padroniza como modelos de IA se conectam a ferramentas externas — bancos de dados, APIs, arquivos. É a “tomada universal” do ecossistema de agentes.</div> <div class="detail-col"><strong>No e-commerce</strong>APIs REST e EDI cumprem o mesmo papel: padronizam como lojas, marketplaces, ERPs e meios de pagamento se comunicam. Um Shopify falar com um Totvs exige esse contrato comum.</div> <div class="detail-col"><strong>Nos Correios</strong>O SIGEP Web e os webservices dos Correios são o “MCP da logística”: definem contratos fixos de requisição para cálculo de frete, emissão de etiqueta e rastreamento, que qualquer sistema pode consumir.</div> </div> </div> </div> <!-- Row 2: Agentic --> <div class="row-wrap" onclick="toggle(this)"> <div class="row-top"> <div class="cell cell-ai"><div class="cell-title">IA Agêntica</div><div class="cell-sub">Planejamento e execução autônoma</div></div> <div class="cell cell-ecom"><div class="cell-title">Automação de pedidos</div><div class="cell-sub">Pricing dinâmico, reposição automática</div></div> <div class="cell cell-cor"><div class="cell-title">Roteamento inteligente</div><div class="cell-sub">Otimização de rotas e última milha</div></div> </div> <div class="row-detail"> <div class="detail-grid"> <div class="detail-col"><strong>Como funciona na IA</strong>Um agente recebe um objetivo, decompõe em subtarefas, escolhe ferramentas e executa — sem precisar de aprovação humana a cada passo. É a diferença entre um chatbot e um executor.</div> <div class="detail-col"><strong>No e-commerce</strong>Sistemas de repricing automático, reposição de estoque por previsão de demanda e gestão de devoluções sem intervenção humana são a face agêntica do varejo digital.</div> <div class="detail-col"><strong>Nos Correios</strong>Algoritmos de roteirização (como os usados no CTCE e CDD) definem automaticamente qual carteiro leva qual pacote e por qual rota — decisão agêntica aplicada à logística física.</div> </div> </div> </div> <!-- Row 3: Tool Use --> <div class="row-wrap" onclick="toggle(this)"> <div class="row-top"> <div class="cell cell-ai"><div class="cell-title">Tool Use / Function Calling</div><div class="cell-sub">IA chamando funções externas</div></div> <div class="cell cell-ecom"><div class="cell-title">Checkout & pagamentos</div><div class="cell-sub">Consulta de estoque em tempo real</div></div> <div class="cell cell-cor"><div class="cell-title">Consulta CEP / cálculo de frete</div><div class="cell-sub">Emissão de etiquetas via API</div></div> </div> <div class="row-detail"> <div class="detail-grid"> <div class="detail-col"><strong>Como funciona na IA</strong>O modelo “chama” uma função externa (buscar preço, converter moeda, executar código) e usa o resultado para continuar o raciocínio. A IA não sabe tudo — ela sabe a quem perguntar.</div> <div class="detail-col"><strong>No e-commerce</strong>Durante o checkout, a plataforma chama: gateway de pagamento, API de estoque, motor de frete, motor de imposto (ICMS/ISS). Cada chamada retorna um dado que compõe a transação final.</div> <div class="detail-col"><strong>Nos Correios</strong>Consultar CEP (DNE), calcular prazo + preço e gerar o objeto de postagem são function calls clássicos: inputs estruturados, resposta JSON/XML, integração em pipeline.</div> </div> </div> </div> <!-- Row 4: Context Window --> <div class="row-wrap" onclick="toggle(this)"> <div class="row-top"> <div class="cell cell-ai"><div class="cell-title">Context Window</div><div class="cell-sub">Memória da sessão atual</div></div> <div class="cell cell-ecom"><div class="cell-title">Sessão / Carrinho</div><div class="cell-sub">Histórico de navegação e pedidos</div></div> <div class="cell cell-cor"><div class="cell-title">Rastreamento de objeto</div><div class="cell-sub">Estado acumulado da encomenda</div></div> </div> <div class="row-detail"> <div class="detail-grid"> <div class="detail-col"><strong>Como funciona na IA</strong>O context window é tudo o que o modelo “lembra” durante uma conversa — mensagens anteriores, resultados de ferramentas, instruções. Sem ele, cada turno começa do zero.</div> <div class="detail-col"><strong>No e-commerce</strong>O carrinho é o context window da jornada de compra: itens adicionados, cupons aplicados, endereço preenchido. A sessão mantém o estado até o checkout ou expiração.</div> <div class="detail-col"><strong>Nos Correios</strong>Cada evento de rastreamento (postado, em trânsito, saiu para entrega) é um token adicionado ao contexto do objeto. O histórico completo permite decisões sobre reentrega e prazos.</div> </div> </div> </div> <!-- Row 5: Orchestration --> <div class="row-wrap" onclick="toggle(this)"> <div class="row-top"> <div class="cell cell-ai"><div class="cell-title">Orquestração multi-agente</div><div class="cell-sub">Agentes coordenados por um maestro</div></div> <div class="cell cell-ecom"><div class="cell-title">OMS + WMS + ERP</div><div class="cell-sub">Sistemas que trocam eventos</div></div> <div class="cell cell-cor"><div class="cell-title">Hub → CTE → CDD → Carteiro</div><div class="cell-sub">Cadeia de custódia logística</div></div> </div> <div class="row-detail"> <div class="detail-grid"> <div class="detail-col"><strong>Como funciona na IA</strong>Um agente orquestrador delega subtarefas a agentes especialistas (busca, raciocínio, escrita) e consolida os resultados. Nenhum agente vê o quadro completo — só o orquestrador.</div> <div class="detail-col"><strong>No e-commerce</strong>O OMS recebe o pedido, aciona o WMS para reservar estoque, o ERP para emitir nota e o TMS para contratar frete. Cada sistema é um agente especialista acionado em sequência.</div> <div class="detail-col"><strong>Nos Correios</strong>Um pacote passa por CTCE (triagem), CTE (transferência), CDD (distribuição) até o carteiro — cada nó é um agente com contexto parcial, orquestrado pelo fluxo logístico nacional.</div> </div> </div> </div> <!-- Row 6: RAG --> <div class="row-wrap" onclick="toggle(this)"> <div class="row-top"> <div class="cell cell-ai"><div class="cell-title">RAG</div><div class="cell-sub">Geração aumentada por recuperação</div></div> <div class="cell cell-ecom"><div class="cell-title">Busca + catálogo</div><div class="cell-sub">Recomendação baseada em contexto</div></div> <div class="cell cell-cor"><div class="cell-title">DNE — Base de endereços</div><div class="cell-sub">Diretório Nacional de Endereços</div></div> </div> <div class="row-detail"> <div class="detail-grid"> <div class="detail-col"><strong>Como funciona na IA</strong>RAG busca documentos relevantes numa base de conhecimento e os injeta no contexto antes de gerar a resposta — o modelo não “sabe” tudo, ele recupera o que precisa na hora.</div> <div class="detail-col"><strong>No e-commerce</strong>Motores de busca como Elasticsearch recuperam produtos relevantes a cada query e os injetam na página de resultados. A recomendação personalizada funciona igual: recupera + ranqueia + exibe.</div> <div class="detail-col"><strong>Nos Correios</strong>O DNE é a base vetorial da logística postal: dado um CEP ou logradouro, recupera o endereço estruturado (bairro, município, UF) que alimenta cálculo de frete e roteirização.</div> </div> </div> </div> <!-- Row 7: Feedback Loop --> <div class="row-wrap" onclick="toggle(this)"> <div class="row-top"> <div class="cell cell-ai"><div class="cell-title">RLHF / Feedback Loop</div><div class="cell-sub">Melhoria contínua por sinal humano</div></div> <div class="cell cell-ecom"><div class="cell-title">Avaliação pós-compra</div><div class="cell-sub">Retargeting e testes A/B</div></div> <div class="cell cell-cor"><div class="cell-title">SLA de entrega + NPS</div><div class="cell-sub">Indicadores que reajustam rotas</div></div> </div> <div class="row-detail"> <div class="detail-grid"> <div class="detail-col"><strong>Como funciona na IA</strong>RLHF usa preferências humanas (thumbs up/down) para ajustar o modelo via reforço. O sinal de feedback é o dado mais valioso do ciclo de treinamento.</div> <div class="detail-col"><strong>No e-commerce</strong>Estrelas, devoluções e cliques em produtos são RLHF aplicado ao varejo: o algoritmo aprende o que agrada e redireciona verba, estoque e exposição para maximizar conversão.</div> <div class="detail-col"><strong>Nos Correios</strong>Taxa de reentrega, reclamações e NPS pós-entrega retroalimentam o planejamento de rotas e o dimensionamento de equipes — o mesmo loop de reforço, numa cadeia física.</div> </div> </div> </div> <div class="legend"> <div class="leg-item"><div class="leg-dot leg-ai"></div><span>Conceito de IA/LLM</span></div> <div class="leg-item"><div class="leg-dot leg-ec"></div><span>Paralelo no e-commerce</span></div> <div class="leg-item"><div class="leg-dot leg-co"></div><span>Paralelo nos Correios</span></div> </div> </div> <script> function toggle(el) { el.classList.toggle('open'); } </script> <p></p> <p><!--ScriptorStartFragment--></p> <div class="scriptor-paragraph">O futuro do e-commerce é liderado pelo Agentic (Comércio Agêntico), mas ele só existe por causa das Skills.</div> <div class="scriptor-paragraph">Eles não são concorrentes, são engrenagens da mesma máquina.</div> <div class="scriptor-paragraph">Mapa completo do mercado:</div> <h3> </h3> <h3> </h3> <h3>1. Agentic Commerce (O Futuro Dominante e a Mudança de Paradigma)</h3> <div class="scriptor-paragraph">Historicamente, o e-commerce exigiu um esforço ativo do consumidor:</div> <ol> <li class="scriptor-paragraph">Entra no site da Amazon,</li> <li class="scriptor-paragraph">compara produtos,</li> <li class="scriptor-paragraph">digita o CEP,</li> <li class="scriptor-paragraph">opta por uma opção de entrega,</li> <li class="scriptor-paragraph">realiza o pagamento.</li> </ol> <div class="scriptor-paragraph">O Agentic Commerce muda o eixo da ação. O comprador passa a ser o Agente de IA (como o Google Gemini, a Siri evoluída ou o Claude). O consumidor diz apenas: “Compre o tênis de corrida modelo X mais bem avaliado, tamanho 41, que chegue até sexta-feira com o menor frete possível”.</div> <ul class=""> <li class="scriptor-listItemlist!list-c7071397-328f-46af-b25c-b5acd01491370">É o Agente (robô) quem vai varrer as lojas.</li> <li class="scriptor-listItemlist!list-c7071397-328f-46af-b25c-b5acd01491370">É o Agente quem vai fechar a transação via UCP.</li> <li class="scriptor-listItemlist!list-c7071397-328f-46af-b25c-b5acd01491370">É o Agente quem vai comparar o frete dos Correios usando o MCP.</li> </ul> <p> </p> <blockquote> <div> </div> <div class="scriptor-paragraph">A grande revolução aqui é o fim das dezenas de abas abertas no navegador. A jornada de compra se torna autônoma e delegada.</div> <div> </div> </blockquote> <h3> </h3> <h3>2. Skills (Os “Músculos” do Agente)</h3> <div class="scriptor-paragraph">Se o Agentic Commerce é o cérebro que toma a decisão de compra, as Skills são as mãos e os pés do Agente. Uma inteligência artificial nasce genérica (ela sabe texto e lógica). Ela precisa receber “Skills” (habilidades conectadas a integrações governadas por regras) para agir no mundo real.</div> <ul class=""> <li class="scriptor-listItemlist!list-c7071397-328f-46af-b25c-b5acd01491371">Quando criamos a Skill de preencher o Canvas de MCP, ensinamos o Agente a ser um consultor de negócios.</li> <li class="scriptor-listItemlist!list-c7071397-328f-46af-b25c-b5acd01491371">Quando os Correios desenvolvem o Servidor MCP, eles estão, na prática, criando uma “Skill Logística Universal” para que qualquer Agente possa calcular frete com perfeição em milissegundos.</li> </ul> <blockquote> <div class="scriptor-paragraph"><strong>O veredito:</strong> O direcionamento principal de consumo é o Agentic. Mas as empresas que vão dominar esse mercado são aquelas que fornecerem as Skills essenciais (como a Skill logística dos Correios) para esses agentes consumirem.</div> </blockquote> <h3> </h3> <h3>3. Outros Direcionamentos ( “Fundações Invisíveis”)</h3> <div class="scriptor-paragraph">Existem duas outras grandes vertentes acontecendo nos bastidores que possibilitam esse futuro:</div> <ul class=""> <li class="scriptor-listItemlist!list-c7071397-328f-46af-b25c-b5acd01491372"><strong>Composable & Headless Commerce:</strong> A ideia de que o “Front-end” (a tela da loja) e o “Back-end” (o banco de dados) foram separados. É isso que permite que o Agente de IA compre direto do banco de dados da loja (via API/UCP), sem precisar carregar a interface visual do site. O site passa a ser apenas um dos canais, enquanto a IA vira o maior canal de vendas oculto.</li> <li class="scriptor-listItemlist!list-c7071397-328f-46af-b25c-b5acd01491372"><strong>Predictive Replenishment (Reposição Preditiva):</strong> É o Agentic Commerce levado ao limite do faturamento recorrente.</li> <li class="scriptor-listItemlist!list-c7071397-328f-46af-b25c-b5acd01491372"><strong>A casa inteligente</strong> ou a IA corporativa nota que o estoque está acabando e dispara a compra com leilão de frete sem nenhuma intervenção humana. A encomenda simplesmente “aparece” na porta porque a geladeira, a impressora ou o almoxarifado pediu.</li> </ul> <p> </p> <hr /> <h2> </h2> <h2 class="scriptor-paragraph">Resumo executivo:</h2> <div class="scriptor-paragraph">O mercado caminha rápido para um cenário onde máquinas compram de máquinas em nome de humanos.</div> <div class="scriptor-paragraph">Se a estrutura de Preços e Prazos dos Correios estiver engessada em interfaces lentas (focadas em humanos abrindo páginas da web), ela perderá mercado.</div> <div class="scriptor-paragraph">O posicionamento de adotar o MCP (a Skill de Leitura) pavimenta o caminho exato para dominar a logística desse emergente Comércio Agêntico.</div> <div> </div> <div><hr /></div> <h1> </h1> <h1><span style="color: #ff9900;">Qual o impacto da má reputação no comércio Agéntico</span></h1> <div class="scriptor-paragraph">A consequência para a má reputação no Comércio Agêntico é muito mais severa (e cruel) do que no e-commerce tradicional.</div> <div class="scriptor-paragraph">O nome técnico do que acontece com essas empresas é a Invisibilidade Algorítmica (ou “Morte Silenciosa”).</div> <div> </div> <div> <img class="alignnone size-medium wp-image-650 aligncenter" src="https://labdx.org/wp-content/uploads/2026/03/mortesilenciosa-300x200.png" alt="" width="300" height="200" /></div> <div> </div> <div class="scriptor-paragraph">O impacto brutal de ter uma métrica ruim — seja de SLA logístico (atrasos), de dados incorretos ou má qualificação nos reviews é quando é uma Inteligência Artificial quem faz as compras:</div> <h3>1. Invisibilidade Algorítmica (O Filtro Cego)</h3> <div class="scriptor-paragraph">No e-commerce clássico de tela, um humano pode decidir comprar de uma loja com nota 3.5 no Reclame Aqui só porque o banner piscante era bonito, a foto do produto era ótima ou o preço estava com “80% de desconto imperdível” que apelou à emoção dele na hora.</div> <div> </div> <blockquote> <div> </div> <div class="scriptor-paragraph">Agentes de IA não têm emoções, impulsos ou achismos.</div> </blockquote> <div> </div> <div class="scriptor-paragraph">Se o prompt/instrução do usuário do agente for: “Compre uma TV confiável que chegue nesta semana”, o Agente vai aplicar um limite matemático interno (ex: “Ignorar fornecedores com Score de SLA menor que 95% ou nota de cliente menor que 4.5”).</div> <div> </div> <div class="scriptor-paragraph">A empresa com má reputação não fica “na segunda página da pesquisa”. Ela simplesmente não existe para o Agente. </div> <div> </div> <blockquote> <div class="scriptor-paragraph">O usuário jamais saberá que sobre vende a TV naquela loja.</div> <div> </div> </blockquote> <h3> </h3> <h3>2. O Fim do “Marketing Emocional”</h3> <div class="scriptor-paragraph">Hoje, empresas compensam falhas operacionais socando dinheiro em anúncios (Google Ads, Facebook Ads) ou e-mail marketing agressivo para forçar o consumidor a entrar no funil de vendas novamente.</div> <div class="scriptor-paragraph">No Comércio Agêntico, o marketing tradicional perde o impacto na ponta.</div> <div class="scriptor-paragraph">O Agente de IA navega via UCP/MCP por matrizes de dados (JSON, XML). Ele lê planilhas de atributos, métricas de devolução e dados consolidados.</div> <div class="scriptor-paragraph">Não há “copywriting persuasivo” que convença o Claude ou o ChatGPT a comprar de uma marca reprovada em seus dados de reputação estruturados.</div> <h3> </h3> <h3>3. Punição Logística Direta e Racional (O Impacto nos Correios)</h3> <div class="scriptor-paragraph">Imagine o motor de frete de um parceiro consultando o servidor MCP. Se o histórico de dados começar a apontar que os Correios prometem entrega em 4 dias, mas os dados analíticos cruzados que alimentam a IA (telemetria do mercado) mostram que a média real está sendo 7 dias para aquela praça, o Agente passa a aplicar um penalty (punição algorítmica oculta).</div> <div class="scriptor-paragraph">O algoritmo passará a escolher a transportadora privada concorrente — mesmo que seja 5% mais cara — porque o algoritmo conclui racionalmente que a métrica de risco do contrato logístico quebrado custa mais caro ao lojista do que a economia imediata de centavos no frete.</div> <h3> </h3> <h3>4. A Bola de Neve do “Zero-Click”</h3> <div class="scriptor-paragraph">Sem a empatia humana para dar a famosa “segunda chance”, a empresa com má reputação não vende. Como não vende, não gera novos dados e novos reviews positivos.</div> <div class="scriptor-paragraph">Com a ausência de relevância de fluxo recente, os painéis que treinam essas LLMs simplesmente rebaixam o ranqueamento existencial da marca. Ela cai numa espiral onde não traciona receita no canal digital que mais cresce no mundo.</div> <div> </div> <div> </div> <h2 class="scriptor-paragraph"><span style="color: #0000ff;">Conclusão: </span></h2> <div> </div> <div class="scriptor-paragraph">No comércio entre máquinas, a reputação deixa de ser uma “métrica de marketing de relacionamento corporativo” e passa a ser o Portão de Autorização (Gateway) puro e simples. Ou seus dados atestam competência, ou seus sistemas nunca receberão sequer um Ping de requisição de compra dos Agentes.</div> <p><br class="scriptor-paragraph" /><br class="scriptor-paragraph" /></p> <blockquote> <div class="scriptor-paragraph">O futuro do e-commerce está no Agentic  ou nos skills<!--ScriptorEndFragment--></div> </blockquote> <p></p> <div id="erd" style="padding: 1rem 0"></div> <script type="module"> import mermaid from 'https://esm.sh/mermaid@11/dist/mermaid.esm.min.mjs'; const dark = matchMedia('(prefers-color-scheme: dark)').matches; await document.fonts.ready; mermaid.initialize({ startOnLoad: false, theme: 'base', fontFamily: 'system-ui, sans-serif', themeVariables: { darkMode: dark, fontSize: '13px', fontFamily: 'system-ui, sans-serif', lineColor: dark ? '#9c9a92' : '#73726c', textColor: dark ? '#c2c0b6' : '#3d3d3a', primaryColor: dark ? '#3C3489' : '#EEEDFE', primaryTextColor: dark ? '#CECBF6' : '#3C3489', primaryBorderColor: dark ? '#534AB7' : '#534AB7', secondaryColor: dark ? '#085041' : '#E1F5EE', secondaryTextColor: dark ? '#9FE1CB' : '#085041', tertiaryColor: dark ? '#633806' : '#FAEEDA', tertiaryTextColor: dark ? '#FAC775' : '#633806', }, }); const diagram = ` flowchart LR subgraph IA["🤖 Camada de IA"] direction TB MCP["MCP\nModel Context Protocol"] AGT["IA Agêntica\nExecução autônoma"] TUC["Tool Use\nFunction Calling"] CTX["Context Window\nMemória de sessão"] ORC["Orquestração\nMulti-agente"] RAG["RAG\nRecuperação aumentada"] RLH["RLHF\nFeedback Loop"] end subgraph EC["🛒 E-commerce"] direction TB API["APIs REST / EDI\nConectores marketplace"] AUT["Automação de pedidos\nPricing dinâmico"] CHK["Checkout & pagamentos\nEstoque em tempo real"] CAR["Sessão / Carrinho\nHistórico de navegação"] OMS["OMS + WMS + ERP\nEventos entre sistemas"] BUS["Busca + catálogo\nRecomendação"] AVC["Avaliação pós-compra\nRetargeting e A/B"] end subgraph COR["📦 Correios / Logística"] direction TB SIG["SIGEP Web\nIntegração de frete"] ROT["Roteamento inteligente\nÚltima milha"] CEP["Consulta CEP\nEmissão de etiquetas"] RAT["Rastreamento\nEstado da encomenda"] HUB["Hub→CTE→CDD→Carteiro\nCadeia de custódia"] DNE["DNE\nBase de endereços"] NPS["SLA + NPS\nReajuste de rotas"] end MCP <--> API API <--> SIG AGT <--> AUT AUT <--> ROT TUC <--> CHK CHK <--> CEP CTX <--> CAR CAR <--> RAT ORC <--> OMS OMS <--> HUB RAG <--> BUS BUS <--> DNE RLH <--> AVC AVC <--> NPS `; const { svg } = await mermaid.render('mermaid-svg', diagram); document.getElementById('erd').innerHTML = svg; </script>