2c:["$","div",null,{"className":"flex items-center justify-center w-8 h-8 bg-lime-500 text-black rounded-full font-semibold","children":1}] 2d:["$","div",null,{"className":"text-gray-300","children":["$","div",null,{"dangerouslySetInnerHTML":{"__html":"Passo 1: Instale o Next.js com npx create-next-app@latest stats-ai e selecione TypeScript,\n Tailwind, App Router, e Source Directory."}}]}] 2e:["$","div","1",{"className":"flex items-center gap-4","children":[["$","div",null,{"className":"flex items-center justify-center w-8 h-8 bg-lime-500 text-black rounded-full font-semibold","children":2}],["$","div",null,{"className":"text-gray-300","children":["$","div",null,{"dangerouslySetInnerHTML":{"__html":"Passo 2: Configure o MCP Server do ShadCN via Cursor. Gere um\n token GitHub em Settings > Developer Settings > Personal Access Tokens, dê\n permissões públicas e cole no painel do Cursor."}}]}]]}] 2f:["$","div","2",{"className":"flex items-center gap-4","children":[["$","div",null,{"className":"flex items-center justify-center w-8 h-8 bg-lime-500 text-black rounded-full font-semibold","children":3}],["$","div",null,{"className":"text-gray-300","children":["$","div",null,{"dangerouslySetInnerHTML":{"__html":"Passo 3: Adicione o snippet de integração do MCP Server no\n array de ferramentas do Cursor."}}]}]]}] 30:["$","div","3",{"className":"flex items-center gap-4","children":[["$","div",null,{"className":"flex items-center justify-center w-8 h-8 bg-lime-500 text-black rounded-full font-semibold","children":4}],["$","div",null,{"className":"text-gray-300","children":["$","div",null,{"dangerouslySetInnerHTML":{"__html":"Passo 4: Confirme na interface que o MCP do ShadCN foi\n adicionado às ferramentas disponíveis."}}]}]]}] 31:["$","section","3",{"className":"mb-16","children":[["$","h2",null,{"className":"text-2xl md:text-3xl font-bold text-white mb-6","children":"Instalando ShadCN e Estruturando o Projeto"}],[["$","p","0",{"className":"text-gray-300 leading-relaxed mb-6","children":"Ambiente pronto? Roda npx shadcn@latest init no terminal. Escolhe sua cor base. Espera criar os arquivos de estilo. Pronto, você tem uma base sólida pra começar a personalizar."}],["$","div","1",{"className":"border rounded-xl p-6 mb-8 bg-blue-500/10 border-blue-500/20 text-blue-400","children":[["$","h3",null,{"className":"font-semibold mb-3 flex items-center gap-2 text-blue-400","children":[["$","span",null,{"children":"ℹ️"}],"Atenção"]}],["$","div",null,{"className":"text-gray-300 leading-relaxed","children":[["$","p","0",{"className":"text-gray-300 leading-relaxed mb-6","children":"Ao modificar o globals.css , salve sempre e reinicie o servidor dev\n para aplicar temas e estilos corretamente."}]]}]]}]]]}] 32:["$","section","4",{"className":"mb-16","children":[["$","h2",null,{"className":"text-2xl md:text-3xl font-bold text-white mb-6","children":"Customização Visual: Temas com TweakCN"}],[["$","p","0",{"className":"text-gray-300 leading-relaxed mb-6","children":"Entra no TweakCN e escolhe seu tema. Ajusta cores, fontes, o visual todo. Copia os seletores :root , :dark e inline . Cola no globals.css . Boom. Identidade visual completamente nova em minutos."}],["$","div","1",{"className":"border rounded-xl p-6 mb-8 bg-yellow-500/10 border-yellow-500/20 text-yellow-400","children":[["$","h3",null,{"className":"font-semibold mb-3 flex items-center gap-2 text-yellow-400","children":[["$","span",null,{"children":"⚠️"}],"Atenção"]}],["$","div",null,{"className":"text-gray-300 leading-relaxed","children":[["$","p","0",{"className":"text-gray-300 leading-relaxed mb-6","children":"Temas avançados exigem atenção a seletores aplicados para evitar conflitos entre dark\n e light mode. Garanta que o tema inline está sendo utiliz