/* Site de IA e automação da WW Mídia. Visual de referência: XRAY (referencias/REFERENCIAS.md). */
@font-face{font-family:Urbanist;src:url(/assets/urbanist.woff2) format("woff2");font-weight:400 800;font-display:swap}
:root{
  --creme:#fffaf0;--creme2:#feefcf;--branco:#fffdf8;--linha:#ece4d1;
  --marinho:#0e1c2d;--texto:#545c64;--suave:#6b7279;
  --azul:#1566b9;--azul2:#0f4f91;--amarelo:#f5cf45;
  --larg:1180px;--leitura:860px;--raio:22px
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--creme);color:var(--texto);font:400 18px/1.65 Urbanist,system-ui,sans-serif}
img,svg{display:block;max-width:100%}
h1,h2,h3{color:var(--marinho);font-weight:800;letter-spacing:-.025em;line-height:1.08;margin:0 0 .45em;text-wrap:balance}
h1{font-size:clamp(38px,5.6vw,72px)}
h2{font-size:clamp(30px,3.4vw,44px)}
h3{font-size:21px;font-weight:700;letter-spacing:-.01em;line-height:1.25}
p{margin:0 0 1em;text-wrap:pretty}
a{color:var(--azul);text-underline-offset:3px}
strong{color:var(--marinho);font-weight:700}
.envolve{max-width:var(--larg);margin:0 auto;padding:0 24px}
.leitura{max-width:var(--leitura)}
.envolve.leitura{max-width:var(--larg)}
.envolve.leitura > *{max-width:var(--leitura)}
.envolve.leitura.centro > *{margin-left:auto;margin-right:auto}
.envolve.leitura > .caso,.envolve.leitura > .cartoes,.envolve.leitura > .fluxo-cartao{max-width:none}
.envolve.leitura > .fluxo-cartao{margin-left:0}
.centro{text-align:center;margin-left:auto;margin-right:auto}
.secao{padding:88px 0}
.secao + .secao{padding-top:24px}
.rotulo{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--azul);margin-bottom:14px}
.intro{font-size:20px;max-width:720px}
.centro.intro{margin-bottom:40px}
.icone{width:22px;height:22px;flex:none}

.mais{display:inline-flex;align-items:center;gap:6px;font-weight:700;text-decoration:none}
.mais svg{width:18px;height:18px}
.abre.centro h1{font-size:clamp(36px,4.6vw,62px);max-width:1100px;margin-left:auto;margin-right:auto}
.rotulo .icone{width:18px;height:18px}

/* topo e menu */
.cabeca{position:sticky;top:0;z-index:10;background:rgba(255,250,240,.94);backdrop-filter:blur(8px);border-bottom:1px solid transparent}
.cabeca .envolve{display:flex;align-items:center;gap:28px;height:76px}
.marca{display:flex;align-items:center;gap:10px;color:var(--marinho);text-decoration:none;font-weight:800;font-size:19px;letter-spacing:-.02em;white-space:nowrap}
.marca-sinal{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--marinho);color:var(--amarelo);font-size:13px;font-weight:800;letter-spacing:0}
.marca small{display:block;font-size:12px;font-weight:600;color:var(--suave);letter-spacing:0;margin-top:-3px}
.menu{display:flex;gap:22px;margin-left:auto}
.menu a{color:var(--marinho);text-decoration:none;font-weight:600;font-size:16px}
.menu a:hover,.menu a[aria-current]{color:var(--azul)}
.cabeca .botao{padding:11px 18px;font-size:16px}
.abre-menu{display:none;margin-left:auto;background:none;border:1px solid var(--linha);border-radius:10px;padding:8px;color:var(--marinho);cursor:pointer}

/* botões */
.botao{display:inline-flex;align-items:center;gap:10px;background:var(--azul);color:#fff;text-decoration:none;font-weight:700;font-size:18px;padding:15px 26px;border-radius:12px;border:2px solid var(--azul);transition:background .15s}
.botao:hover{background:var(--azul2);border-color:var(--azul2)}
.botao.claro{background:transparent;color:var(--azul)}
.botao.claro:hover{background:#fff}
.botoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.centro .botoes,.botoes.centro{justify-content:center}

/* primeira dobra */
.abre{padding:72px 0 40px}
.abre h1{max-width:980px}
.abre h1 span{display:block;color:var(--azul)}
.direta{font-size:21px;max-width:760px;color:#3f474f}
.abre.centro .direta{margin:0 auto 22px}
.migalha{font-size:15px;color:var(--suave);margin-bottom:22px}
.migalha a{color:var(--suave)}

/* fluxo de ferramentas (logo, seta, logo) */
.fluxo-cartao{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:36px 28px 28px;margin:48px auto 0;max-width:980px}
.fluxo{display:flex;align-items:flex-start;justify-content:center;gap:10px;flex-wrap:wrap}
.etapa{display:flex;flex-direction:column;align-items:center;gap:10px;width:140px;text-align:center;font-size:15px;line-height:1.35;color:var(--marinho);font-weight:600}
.etapa .logo{width:72px;height:72px;border-radius:18px;background:#fff;border:1px solid var(--linha);display:grid;place-items:center}
.etapa .logo svg{width:38px;height:38px}
.etapa small{display:block;font-weight:500;color:var(--suave);font-size:14px}
.seta{color:var(--marinho);margin-top:24px}
.seta svg{width:30px;height:30px}
.abre:not(.centro) .fluxo-cartao{margin-left:0}
.fluxo-legenda{text-align:center;margin:22px 0 0;font-size:16px;color:var(--suave)}

/* cartões amarelos de número */
.numeros{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.numero{background:var(--amarelo);border-radius:var(--raio);padding:30px 24px;text-align:center;color:var(--marinho);font-size:17px;line-height:1.4;font-weight:500}
.numero b{display:block;font-size:clamp(40px,4.4vw,58px);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin-bottom:8px}
.numero small{display:block;margin-top:8px;font-size:14px;font-weight:600;opacity:.7}

/* cartões */
.cartoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.cartao{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:28px;display:flex;flex-direction:column}
.cartao p{font-size:17px}
.cartao .mais{margin-top:auto;font-weight:700;text-decoration:none;display:inline-flex;gap:6px;align-items:center}
.cartao .mais svg{width:18px;height:18px}
.bola{width:48px;height:48px;border-radius:50%;background:var(--creme2);display:grid;place-items:center;color:var(--marinho);margin-bottom:18px}

/* passos */
.passos{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:passo;margin-top:8px}
.passo{position:relative;padding-top:64px}
.passo::before{counter-increment:passo;content:counter(passo);position:absolute;top:0;left:0;width:46px;height:46px;border-radius:50%;border:2px solid var(--marinho);display:grid;place-items:center;font-weight:800;color:var(--marinho)}
.passo::after{content:"";position:absolute;top:23px;left:58px;right:-10px;height:2px;background:var(--linha)}
.passo:last-child::after{display:none}
.passo p{font-size:17px;margin-bottom:6px}
.prazo{font-size:15px;font-weight:700;color:var(--azul)}

/* faixa azul-marinho (preço) */
.faixa{background:var(--marinho);color:#c5ced8;padding:88px 0;margin:64px 0}
.faixa h2,.faixa h3{color:#fff}
.faixa .rotulo{color:var(--amarelo)}
.faixa .intro{color:#c5ced8}
.precos{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.precos.n2{grid-template-columns:repeat(2,minmax(0,400px));justify-content:center}
.preco{background:var(--creme);color:var(--texto);border-radius:var(--raio);padding:32px 28px;display:flex;flex-direction:column;position:relative}
.preco h3{color:var(--marinho);font-size:24px}
.preco .para{font-size:16px;min-height:52px}
.preco ul{list-style:none;padding:0;margin:0 0 22px;font-size:16px}
.preco li{display:flex;gap:10px;padding:5px 0;align-items:flex-start}
.preco li svg{width:18px;height:18px;margin-top:4px;color:var(--azul);flex:none}
.valor{background:var(--creme2);border:1px dashed #d9b85a;border-radius:14px;padding:16px;text-align:center;margin:auto 0 16px;color:var(--marinho)}
.valor b{display:block;font-size:34px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.valor span{font-size:15px;font-weight:600}
.preco .botao{justify-content:center}
.destaque{outline:4px solid var(--amarelo)}
.etiqueta{position:absolute;top:-14px;left:28px;background:var(--amarelo);color:var(--marinho);font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:5px 12px;border-radius:8px}
.faixa .nota{margin-top:26px;text-align:center;font-size:16px}
.faixa .nota a,.faixa .intro a{color:#fff}

/* tabela */
.tabela{width:100%;border-collapse:collapse;background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);overflow:hidden;font-size:17px;margin:8px 0 24px}
.tabela th,.tabela td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--linha);vertical-align:top}
.tabela th{color:var(--marinho);background:var(--creme2);font-weight:700}
.tabela tr:last-child td{border-bottom:none}
.tabela td:first-child{color:var(--marinho);font-weight:600;width:34%}
.tabela.num td:last-child{white-space:nowrap;color:var(--marinho);font-weight:700}
.rola{overflow-x:auto}

/* caso */
.caso{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:start;background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:40px}
.caso h3{font-size:28px}
.caso .numeros{grid-template-columns:1fr 1fr;margin-top:0}
.caso .numero{padding:22px 16px;font-size:15px}
.caso .numero b{font-size:40px}
.caso.n3{grid-template-columns:1fr;gap:28px}
.caso.n3 > div:first-child{max-width:760px}
.caso.n3 .numeros{grid-template-columns:repeat(3,1fr)}
.caso + .caso{margin-top:22px}
.caso + .fluxo-cartao{margin-top:22px}
.depois{margin-top:22px}
.blocos h3{display:flex;align-items:center;gap:10px;margin-top:28px}
.blocos h3 svg{color:var(--azul)}

/* ferramentas */
.ferramentas{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 34px;margin-top:10px}
.ferramenta{display:flex;align-items:center;gap:10px;color:var(--marinho);font-weight:700;font-size:17px}
.ferramenta svg{width:28px;height:28px}

/* quem faz */
.quem{display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:center}
.quem img{width:200px;height:200px;border-radius:50%;object-fit:cover;border:6px solid var(--branco);box-shadow:0 0 0 1px var(--linha)}
.quem .sinal-grande{width:200px;height:200px;border-radius:50%;background:var(--marinho);color:var(--amarelo);display:grid;place-items:center;font-size:56px;font-weight:800}

/* perguntas frequentes, abertas */
.faq{border-top:1px solid var(--linha)}
.faq h3{margin:0;padding:26px 0 8px;font-size:21px}
.faq p{padding-bottom:22px;border-bottom:1px solid var(--linha);margin:0;font-size:18px}

/* irmãs */
.irmas{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.irmas a{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--branco);border:1px solid var(--linha);border-radius:16px;padding:18px 20px;text-decoration:none;color:var(--marinho);font-weight:700}
.irmas a:hover{border-color:var(--azul)}
.irmas svg{width:18px;height:18px;color:var(--azul)}

/* chamada final */
.chamada{background:var(--amarelo);border-radius:28px;padding:64px 32px;text-align:center;margin:40px auto 0;max-width:var(--larg)}
.chamada h2{max-width:760px;margin-left:auto;margin-right:auto}
.chamada p{color:var(--marinho);font-size:19px;max-width:620px;margin:0 auto 22px}
.chamada .botao{background:var(--marinho);border-color:var(--marinho)}

/* rodapé */
.rodape{background:var(--marinho);color:#aeb8c3;margin-top:96px;padding:64px 0 28px;font-size:16px}
.rodape a{color:#dfe5eb;text-decoration:none}
.rodape a:hover{color:#fff;text-decoration:underline}
.rodape .colunas{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.rodape h3{color:#fff;font-size:17px;margin-bottom:12px}
.rodape ul{list-style:none;margin:0;padding:0}
.rodape li{padding:4px 0}
.marca-grande{font-size:clamp(46px,10.5vw,170px);font-weight:800;letter-spacing:-.05em;line-height:.95;color:var(--creme);margin:56px 0 18px}
.rodape .fim{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:14px;border-top:1px solid #23344a;padding-top:20px}

@media (min-width:1800px){
  :root{--larg:1360px;--leitura:940px}
  body{font-size:20px}
  .direta{font-size:23px;max-width:860px}
  .menu a{font-size:17px}
}
@media (max-width:980px){
  .menu{display:none;position:absolute;top:76px;left:0;right:0;background:var(--creme);flex-direction:column;gap:0;padding:8px 24px 20px;border-bottom:1px solid var(--linha)}
  .menu a{padding:12px 0;font-size:18px;border-bottom:1px solid var(--linha)}
  .cabeca.aberto .menu{display:flex;box-shadow:0 18px 30px rgba(14,28,45,.12)}
  .abre-menu{display:block}
  .cabeca .envolve > .botao{display:none}
  .passos{grid-template-columns:1fr 1fr}
  .passo::after{display:none}
  .precos,.precos.n2{grid-template-columns:1fr;max-width:520px;margin:0 auto}
  .caso{grid-template-columns:1fr;padding:28px}
}
@media (max-width:640px){
  body{font-size:17px}
  .secao{padding:64px 0}
  .abre{padding:44px 0 24px}
  .direta{font-size:19px}
  .numeros{grid-template-columns:1fr}
  .caso .numeros,.caso.n3 .numeros{grid-template-columns:1fr 1fr}
  .caso.n3 .numero:last-child{grid-column:1/-1}
  .abre.centro{text-align:left}
  .abre.centro .direta{margin-left:0}
  .abre.centro .botoes{justify-content:flex-start}
  .preco{padding:28px 20px}
  .passos{grid-template-columns:1fr}
  .seta{transform:rotate(90deg);margin:0}
  .fluxo{flex-direction:column;align-items:center}
  .quem{grid-template-columns:1fr;text-align:center}
  .quem img,.quem .sinal-grande{margin:0 auto}
  .rodape .colunas{grid-template-columns:1fr}
  .botao{width:100%;justify-content:center;padding:15px 18px}
  .cabeca .botao{width:auto}
  .tabela{font-size:15px}
  .tabela th,.tabela td{padding:10px 12px}
}

/* v2 (31/10/2026): a frase do quadro logo abaixo do H1, os cartões das três frentes e o caso de um número só */
.quadro{font-size:clamp(22px,2.2vw,27px);line-height:1.4;font-weight:600;color:var(--marinho);max-width:820px;margin:0 0 16px;text-wrap:balance}
.abre.centro .quadro{margin:0 auto 16px}
.cartoes.tres{grid-template-columns:repeat(3,1fr)}
.cartao.frente h3{font-size:25px}
.cartao.frente .rotulo{font-size:13px;margin-bottom:10px}
.cartao .links{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding-top:6px}
.cartao .links .mais{margin-top:0}
.precos.n4{grid-template-columns:repeat(2,minmax(0,420px));justify-content:center}
.caso.n1 .numeros{grid-template-columns:1fr}
@media (max-width:980px){
  .cartoes.tres{grid-template-columns:1fr}
  .precos.n4{grid-template-columns:1fr;max-width:520px;margin:0 auto}
}

/* desenhos (31/10/2026): fluxo com caminhos, cruzamento de dados, dashboard, aplicativo, conversa e gráficos; o HTML sai do desenhos.py */
:root{--verde:#1f8a5b;--verde-t:#177149;--laranja:#c8671c;--roxo:#7a4fc4;--azul-c:#e3eefb;--verde-c:#dff3e9;--laranja-c:#fbeadb;--roxo-c:#ece4f8;--sombra:0 30px 60px -28px rgba(14,28,45,.38)}
.desenho{margin:48px 0 0}
.envolve.leitura > .desenho{max-width:none}
.desenho figcaption{margin-top:18px;font-size:16px;color:var(--suave);text-align:center;text-wrap:balance}
.d-miolo{position:relative;text-align:left}
.d-aviso{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#6b5200;background:#fdf0bf;border-radius:999px;padding:3px 10px;white-space:nowrap}
.d-miolo > .d-aviso{display:table;margin:0 0 10px auto}
.c-azul{--cor:var(--azul);--cor-c:var(--azul-c)}.c-verde{--cor:var(--verde);--cor-c:var(--verde-c)}
.c-laranja{--cor:var(--laranja);--cor-c:var(--laranja-c)}.c-roxo{--cor:var(--roxo);--cor-c:var(--roxo-c)}

/* fluxo com caminhos (colunas de nós ligadas por curvas) */
.caminhos{display:grid;align-items:stretch;background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:30px 26px 24px;
  background-image:radial-gradient(#e6dcc4 1px,transparent 1px);background-size:18px 18px}
.caminhos .col,.caminhos .liga{display:flex;flex-direction:column;min-width:0}
.col-t{height:22px;margin:0 0 12px;font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--azul);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nos{flex:1;display:grid}
.no{position:relative;align-self:center;display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--linha);border-radius:16px;padding:14px;margin:7px 0;box-shadow:0 8px 20px -14px rgba(14,28,45,.35);color:var(--marinho);line-height:1.3}
.no.vazio{visibility:hidden}
.no b{display:block;font-size:16px}
.no small{display:block;font-size:14px;color:var(--suave);margin-top:2px}
.no-i{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--cor-c,var(--creme2));color:var(--cor,var(--marinho))}
.no-i .icone{width:20px;height:20px}
.no::before,.no::after,.registro::before,.registro::after{content:"";position:absolute;top:50%;width:11px;height:11px;margin-top:-5.5px;border-radius:50%;background:#fff;border:2px solid var(--marinho);z-index:1}
.no::before,.registro::before{left:-7px}
.no::after,.registro::after{right:-7px}
.sem-entrada::before,.sem-saida::after,.no.vazio::before,.no.vazio::after{display:none}
.liga svg{flex:1;width:100%;min-height:0;overflow:visible}
.liga path{fill:none;stroke:var(--marinho);stroke-width:2;stroke-dasharray:6 5;vector-effect:non-scaling-stroke;opacity:.5}
.bolha{display:block;margin-top:8px;background:#d9fdd3;border-radius:12px 12px 12px 4px;padding:6px 10px;font-size:13.5px;line-height:1.35;color:#1c2a36}
.dado{display:block;margin-top:5px;font-weight:800;font-size:15px;color:var(--marinho);font-variant-numeric:tabular-nums}

/* a venda cruzada, no meio do desenho */
.registro{position:relative;align-self:center;background:var(--marinho);color:#c5ced8;border-radius:18px;padding:18px;margin:7px 0;box-shadow:var(--sombra)}
.registro::before,.registro::after{border-color:var(--amarelo);background:var(--marinho)}
.reg-t{display:flex;justify-content:space-between;gap:8px;align-items:baseline;border-bottom:1px solid #2a3b52;padding-bottom:10px;margin-bottom:10px}
.reg-t b{font-size:17px;color:#fff}
.reg-t span{font-size:13.5px}
.registro ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.registro li{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;font-size:14px}
.registro li b{color:#fff;text-align:right}
.registro li i{width:10px;height:10px;border-radius:50%}
.registro .c-azul i{background:#6aaef2}.registro .c-verde i{background:#45c48c}.registro .c-laranja i{background:#f0a35e}.registro .c-roxo i{background:#b294ec}
.reg-fim{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:14px;background:var(--amarelo);color:var(--marinho);border-radius:12px;padding:10px 12px;font-weight:700;font-size:14px}
.reg-fim b{font-size:21px;font-weight:800;letter-spacing:-.02em}

/* moldura de computador e de celular */
.tela{background:#fff;border:1px solid var(--linha);border-radius:18px;overflow:hidden;box-shadow:var(--sombra)}
.tela-barra{display:flex;align-items:center;gap:7px;padding:10px 14px;background:#f6f1e4;border-bottom:1px solid var(--linha);font-size:13px;font-weight:600;color:var(--suave)}
.tela-barra i{width:11px;height:11px;border-radius:50%;background:#e2d9c4}
.tela-barra span:first-of-type{margin-left:10px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tela-corpo{padding:20px}
.cel{width:262px;background:var(--marinho);border-radius:40px;padding:10px;box-shadow:var(--sombra)}
.cel-tela{position:relative;background:var(--creme);border-radius:31px;padding:30px 16px 18px;min-height:480px;overflow:hidden}
.cel-tela::before{content:"";position:absolute;top:10px;left:50%;width:70px;height:6px;margin-left:-35px;border-radius:3px;background:var(--marinho);opacity:.85}
.cel-oi{margin:0;font-size:21px;font-weight:800;color:var(--marinho);letter-spacing:-.02em}
.cel-sub{margin:0 0 12px;font-size:13.5px;color:var(--suave)}
.cel-grande{background:var(--amarelo);border-radius:16px;padding:14px;color:var(--marinho);margin-bottom:8px}
.cel-grande b{display:block;font-size:31px;font-weight:800;letter-spacing:-.03em;line-height:1.1}
.cel-grande span{font-size:13px;font-weight:600}
.cel-duas{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.cel-duas div,.cel-mini{background:#fff;border-radius:12px;padding:10px;color:var(--marinho);line-height:1.2}
.cel-duas small,.cel-mini small{display:block;font-size:11.5px;color:var(--suave);font-weight:600}
.cel-duas b{font-size:15.5px;font-variant-numeric:tabular-nums}
.cel-mini{margin-bottom:8px}
.mini-barras{display:flex;align-items:flex-end;gap:5px;height:54px;margin-top:6px}
.mini-barras i{flex:1;background:var(--azul);border-radius:4px 4px 0 0;min-height:4px}
.mini-barras i:last-child{background:var(--marinho)}
.cel-alerta{display:flex;gap:8px;align-items:flex-start;background:var(--laranja-c);color:#7a3a08;border-radius:12px;padding:10px;font-size:13px;font-weight:600;line-height:1.3}
.cel-alerta .icone{width:18px;height:18px;flex:none;color:var(--laranja)}
.cel-lista{display:grid;gap:8px}
.cel-lista div{background:#fff;border-radius:12px;padding:10px 12px;line-height:1.3;color:var(--marinho)}
.cel-lista b{display:block;font-size:14.5px}
.cel-lista span{display:flex;gap:5px;align-items:center;font-size:12.5px;color:var(--suave)}
.cel-lista .icone{width:14px;height:14px;flex:none}
.cel-botao{margin-top:12px;background:var(--azul);color:#fff;text-align:center;border-radius:12px;padding:10px;font-weight:700;font-size:14px}

/* computador com o celular por cima */
.pn{display:grid;grid-template-columns:minmax(0,1fr) 262px;align-items:end;padding-bottom:18px}
.pn .cel{position:relative;margin:0 0 -18px -26px;z-index:2}
.pn-topo{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;color:var(--marinho);font-size:17px}
.filtros{display:flex;gap:3px;background:var(--creme);border-radius:10px;padding:3px}
.filtros em{font-style:normal;font-size:13px;font-weight:700;padding:4px 10px;border-radius:8px;color:var(--suave)}
.filtros em:first-child{background:#fff;color:var(--marinho);box-shadow:0 1px 3px rgba(14,28,45,.14)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:10px}
.kpi{background:var(--creme);border-radius:14px;padding:12px 14px;color:var(--marinho);line-height:1.25;min-width:0}
.kpi:nth-child(2){background:var(--amarelo)}
.kpi small{display:block;font-size:12.5px;font-weight:600;color:var(--suave)}
.kpi:nth-child(2) small,.kpi:nth-child(2) span{color:var(--marinho)}
.kpi b{display:block;font-size:22px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin:2px 0}
.kpi span{font-size:12.5px;color:var(--suave)}
.pn-grade{display:grid;grid-template-columns:1.25fr 1fr;gap:10px}
.cx{border:1px solid var(--linha);border-radius:14px;padding:12px 14px;min-width:0}
.cx > p{margin:0 0 10px;font-size:13.5px;font-weight:700;color:var(--marinho)}
.graf-linha{position:relative;height:118px;margin-right:6px}
.graf-linha svg{width:100%;height:100%;overflow:visible}
.graf-linha .area{fill:var(--azul);opacity:.1}
.graf-linha .traco{fill:none;stroke:var(--azul);stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.graf-linha .media{stroke:var(--suave);stroke-width:1;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.ponto{position:absolute;right:-5px;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--azul);box-shadow:0 0 0 2px #fff}
.rot-media{position:absolute;left:4px;transform:translateY(-120%);font-size:11.5px;color:var(--suave);background:rgba(255,255,255,.9);padding:0 5px;border-radius:4px}
.barras-h{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.barras-h li{display:grid;grid-template-columns:var(--rot,62px) 1fr var(--val,82px);gap:8px;align-items:center;font-size:13px;color:var(--marinho)}
.barras-h i{height:12px;border-radius:0 4px 4px 0;background:var(--azul)}
.barras-h b{text-align:right;font-variant-numeric:tabular-nums;display:flex;justify-content:flex-end;align-items:center;gap:3px}
.estoque li{--val:112px}
.estoque i{background:var(--verde)}
.estoque .baixo i{background:var(--laranja)}
.estoque .baixo b{color:var(--laranja)}
.estoque .icone{width:14px;height:14px}
.barras-v{position:relative;display:grid;grid-template-columns:repeat(4,1fr)}
.barra-v{display:flex;flex-direction:column;align-items:center;font-size:12px;color:var(--marinho)}
.trilho{position:relative;width:100%;height:96px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.trilho::after{content:"";position:absolute;left:0;right:0;bottom:76.9%;border-top:2px dashed var(--marinho);opacity:.35}
.trilho b{font-size:12.5px;margin-bottom:3px;font-variant-numeric:tabular-nums}
.trilho i{width:46%;max-width:34px;border-radius:4px 4px 0 0;background:var(--azul)}
.barra-v > span{height:22px;padding-top:5px;white-space:nowrap;font-size:12px;color:var(--suave)}

/* aplicativo de pedidos */
.ap{display:grid;grid-template-columns:150px 1fr;min-height:330px;margin:-20px}
.ap-menu{list-style:none;margin:0;padding:16px 10px;background:var(--marinho);display:grid;align-content:start;gap:4px}
.ap-menu li{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:9px;color:#c5ced8;font-size:14px;font-weight:600}
.ap-menu li.ativo{background:#24384f;color:#fff}
.ap-menu .icone{width:17px;height:17px}
.ap-main{padding:16px;min-width:0;background:#fbf8f1}
.ap-topo{display:flex;align-items:center;gap:10px;margin-bottom:12px;color:var(--marinho)}
.ap-topo b{font-size:18px;margin-right:auto}
.ap-busca{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--linha);border-radius:9px;padding:5px 10px;font-size:12.5px;color:var(--suave);white-space:nowrap}
.ap-busca .icone{width:14px;height:14px}
.ap-botao{background:var(--azul);color:#fff;border-radius:9px;padding:6px 12px;font-size:13px;font-weight:700;white-space:nowrap}
.kanban{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.kb-col{background:#f1ebdc;border-radius:12px;padding:8px;display:grid;gap:7px;align-content:start}
.kb-col > p{margin:0 2px 2px;font-size:12.5px;font-weight:800;color:var(--marinho);display:flex;justify-content:space-between}
.kb-col > p em{font-style:normal;color:var(--suave)}
.kb-card{background:#fff;border-radius:10px;padding:9px 10px;box-shadow:0 1px 3px rgba(14,28,45,.08);line-height:1.25;color:var(--marinho);border-left:3px solid var(--azul)}
.kb-col:nth-child(2) .kb-card{border-left-color:var(--laranja)}
.kb-col:nth-child(3) .kb-card{border-left-color:var(--roxo)}
.kb-col:nth-child(4) .kb-card{border-left-color:var(--verde)}
.kb-card b{display:block;font-size:13px}
.kb-card span{display:block;font-size:12px;color:var(--texto);margin:2px 0 6px}
.kb-card small{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:var(--suave)}
.kb-card small i{font-style:normal;width:22px;height:22px;border-radius:50%;background:var(--creme2);display:grid;place-items:center;font-size:10px;font-weight:800;color:var(--marinho)}

/* conversa no WhatsApp */
.d-conversa .d-miolo{display:flex;flex-direction:column;align-items:center}
.d-conversa .d-miolo > .d-aviso{margin:0 auto 10px}
.zap-cel{width:310px}
.zap-cel .cel-tela{padding:0;background:#efe7dc;min-height:0}
.zap-topo{display:flex;align-items:center;gap:10px;background:#0f5f4f;color:#fff;padding:28px 14px 10px}
.zap-av{width:34px;height:34px;border-radius:50%;background:var(--amarelo);color:var(--marinho);display:grid;place-items:center;font-size:12px;font-weight:800;flex:none}
.zap-topo b{display:block;font-size:14.5px;line-height:1.2}
.zap-topo small{font-size:11.5px;opacity:.8}
.zap{padding:10px 10px 16px;display:flex;flex-direction:column;gap:6px}
.dia{align-self:center;margin:0 0 2px;font-size:11px;background:#fff;border-radius:6px;padding:2px 8px;color:var(--suave)}
.msg{max-width:86%;padding:7px 9px 5px;border-radius:10px;font-size:13px;line-height:1.38;color:#1c2a36;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.msg small{display:block;text-align:right;font-size:10px;color:#5f6b73;margin-top:2px}
.msg.ent{align-self:flex-start;background:#fff;border-top-left-radius:3px}
.msg.sai{align-self:flex-end;background:#d9fdd3;border-top-right-radius:3px}
.msg.audio{display:grid;grid-template-columns:auto 1fr auto;gap:4px 8px;align-items:center;width:86%}
.msg.audio small{margin:0}
.msg.audio em{grid-column:1/-1;font-size:12px;color:var(--suave)}
.msg.audio .icone{width:18px;height:18px;color:#0f5f4f}
.onda{display:flex;align-items:center;gap:2px;height:22px}
.onda i{flex:1;background:#7aa79b;border-radius:2px}
.msg.arquivo{display:flex;gap:8px;align-items:center}
.msg.arquivo .icone{width:26px;height:26px;color:#c0392b;flex:none}
.msg.arquivo span{font-size:12px;color:var(--texto);line-height:1.3}
.msg.arquivo b{display:block;font-size:13px;color:#1c2a36}
.msg.arquivo small{align-self:flex-end;margin-left:auto}
.sistema{align-self:center;display:flex;align-items:center;gap:5px;margin:4px 0 0;font-size:11.5px;background:#fdf0bf;color:#6b5200;border-radius:8px;padding:4px 9px}
.sistema .icone{width:13px;height:13px}
.lado{display:grid;grid-template-columns:340px 1fr;gap:56px;align-items:center}
.lado .desenho{margin:0}
.lado .cartoes{grid-template-columns:1fr 1fr}

/* planilha: antes e depois */
.d-antesdepois .d-miolo{display:grid;grid-template-columns:1fr 60px 1fr;align-items:center}
.ad-lado{position:relative;background:#fff;border:1px solid var(--linha);border-radius:var(--raio);padding:46px 18px 22px;box-shadow:0 10px 26px -18px rgba(14,28,45,.35)}
.ad-t{position:absolute;top:15px;left:18px;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--suave)}
.depois .ad-t{color:var(--verde-t)}
.folha{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.folha th{background:#eef2ea;color:var(--marinho);font-weight:700;text-align:left;padding:6px 8px;border:1px solid #dfe5da}
.folha td{padding:6px 8px;border:1px solid #e8ece4;color:var(--marinho)}
.folha td.m{background:#fff3b0;outline:2px dashed #d9b85a;outline-offset:-3px}
.folha td.x{background:#fde2e0;color:#b3261e;font-weight:700}
.post-it{position:absolute;left:-10px;bottom:-30px;width:160px;margin:0;background:var(--amarelo);color:var(--marinho);font-size:13px;font-weight:700;line-height:1.3;padding:10px 12px;transform:rotate(-3deg);box-shadow:0 8px 16px -8px rgba(14,28,45,.45)}
.ad-seta{display:grid;place-items:center;color:var(--azul)}
.ad-seta svg{width:30px;height:30px}
.selo{display:inline-flex;gap:6px;align-items:center;margin:12px 0 0;font-size:13.5px;font-weight:700;color:var(--verde-t);background:var(--verde-c);border-radius:999px;padding:4px 12px}
.selo .icone{width:15px;height:15px}
.notif{position:absolute;right:14px;bottom:-34px;display:flex;gap:9px;align-items:flex-start;width:250px;background:var(--marinho);color:#dfe5eb;border-radius:14px;padding:10px 12px;font-size:12.5px;line-height:1.3;box-shadow:var(--sombra)}
.notif b{display:block;color:#fff;font-size:12px}
.notif .icone{width:17px;height:17px;color:var(--amarelo);flex:none;margin-top:2px}
.d-antesdepois figcaption{margin-top:52px}

/* mapa de horas e conta do WhatsApp */
.desenho.d-horas,.envolve.leitura > .desenho.d-conta{max-width:var(--leitura)}
.d-horas .d-miolo,.d-conta .d-miolo{background:#fff;border:1px solid var(--linha);border-radius:var(--raio);padding:28px 26px 20px}
.hr-topo{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.hr-topo div{background:var(--creme);border-radius:14px;padding:12px 16px;color:var(--marinho);line-height:1.2}
.hr-topo div:first-child{background:var(--amarelo)}
.hr-topo b{display:block;font-size:30px;font-weight:800;letter-spacing:-.02em}
.hr-topo span{font-size:14px;font-weight:600}
.horas-l{gap:11px}
.horas-l li{--rot:230px;--val:48px;font-size:15px}
.horas-l i{height:18px}
.horas-l .fica i,.legenda-d .fica i{background:#c9cdd2}
.legenda-d{display:flex;flex-wrap:wrap;gap:18px;margin:16px 0 0;font-size:14px;color:var(--suave)}
.legenda-d span{display:flex;align-items:center;gap:6px}
.legenda-d i{width:12px;height:12px;border-radius:3px;background:var(--azul)}
.ct-topo{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 12px;color:var(--marinho);margin-bottom:12px}
.ct-topo span{font-size:15px;color:var(--suave);font-weight:600}
.ct-topo b{font-size:32px;font-weight:800;letter-spacing:-.02em}
.ct-barra{display:flex;gap:2px;height:30px;border-radius:8px;overflow:hidden}
.ct-barra i,.ct-leg i{display:block;background:var(--cor)}
.ct-leg{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:7px}
.ct-leg li{display:grid;grid-template-columns:14px 1fr auto;gap:10px;align-items:center;font-size:15.5px;color:var(--marinho)}
.ct-leg i{width:12px;height:12px;border-radius:3px}
.ct-leg b{font-variant-numeric:tabular-nums}

/* desenhos pequenos no alto dos cartões da página inicial */
.mini{height:132px;margin:-28px -28px 22px;border-radius:calc(var(--raio) - 1px) calc(var(--raio) - 1px) 0 0;background:var(--creme2);padding:16px 18px;display:flex;flex-direction:column;justify-content:center;gap:6px;overflow:hidden}
.m-ent,.m-sai{max-width:82%;font-size:13px;line-height:1.3;padding:6px 10px;border-radius:10px;color:#1c2a36;box-shadow:0 1px 1px rgba(0,0,0,.06)}
.m-ent{align-self:flex-start;background:#fff}
.m-sai{align-self:flex-end;background:#d9fdd3}
.mini-graf{flex-direction:row;align-items:flex-end;gap:16px}
.mini-graf span{color:var(--marinho);line-height:1.15}
.mini-graf small{display:block;font-size:12px;font-weight:600}
.mini-graf b{font-size:23px;font-weight:800;letter-spacing:-.02em}
.mini-graf .mini-barras{flex:1;height:86px}
.mini-app{flex-direction:row;align-items:stretch;gap:8px}
.mini-app div{flex:1;background:#f6e3b4;border-radius:10px;padding:7px;display:flex;flex-direction:column;gap:5px}
.mini-app small{font-size:11px;font-weight:800;color:var(--marinho)}
.mini-app i{height:20px;background:#fff;border-radius:6px;border-left:3px solid var(--azul)}

@media (max-width:980px){
  .pn{grid-template-columns:1fr;padding:0}
  .pn .cel{margin:-90px 18px 0 auto}
  .lado{grid-template-columns:1fr;gap:36px}
}
@media (max-width:860px){
  .caminhos{display:block;padding:22px 16px}
  .caminhos .liga{position:relative;display:block;height:30px}
  .caminhos .liga svg,.caminhos .liga .col-t{display:none}
  .caminhos .liga::after{content:"";position:absolute;left:50%;top:4px;bottom:4px;border-left:2px dashed var(--marinho);opacity:.45}
  .nos{display:flex;flex-direction:column;gap:10px}
  .no,.registro{margin:0;align-self:stretch}
  .no.vazio{display:none}
  .no::before,.no::after,.registro::before,.registro::after{display:none}
  .col-t{height:auto;white-space:normal}
  .d-antesdepois .d-miolo{grid-template-columns:1fr}
  .ad-seta{transform:rotate(90deg);height:64px}
  .lado .cartoes{grid-template-columns:1fr}
}
@media (max-width:700px){
  .pn .tela{display:none}
  .pn .cel{margin:0 auto}
  .post-it,.notif{position:relative;left:auto;right:auto;bottom:auto;margin:16px 0 0}
  .post-it{width:auto;max-width:220px}
  .notif{width:auto}
  .d-antesdepois figcaption{margin-top:18px}
}

/* dashboard na TV da sala do dono (31/10/2026): foto com a tela encaixada por matrix3d; o script ajusta a escala e traz os pedidos ao vivo */
.d-tv .d-miolo{max-width:1132px;margin:0 auto}
.tv-janela{border-radius:var(--raio);overflow:hidden;box-shadow:var(--sombra)}
.tv-cena{position:relative}
.tv-cena img{display:block;width:100%;height:auto}
.tv-palco{position:absolute;left:0;top:0;transform-origin:0 0;visibility:hidden;pointer-events:none}
.tv-cena.pronta .tv-palco{visibility:visible}
.tv-cena .tv-frente{position:absolute;height:auto;pointer-events:none}
.tv-tela{position:absolute;left:0;top:0;transform-origin:0 0;background:#0b0b0c;padding:6px;border-radius:3px;box-shadow:0 0 0 1px #2a2a2c}
.tv-tela::after{content:"";position:absolute;inset:6px;background:linear-gradient(118deg,rgba(255,255,255,.09),rgba(255,255,255,0) 38%);pointer-events:none}
.tv-dash{height:100%;background:radial-gradient(120% 90% at 0 0,#1a3453 0,#0d1b2b 62%);color:#c9d5e2;padding:16px 20px 18px;display:grid;grid-template-rows:auto auto 1fr;gap:12px;line-height:1.2;overflow:hidden;text-align:left}
.tv-topo{display:flex;align-items:center;gap:12px}
.tv-topo b{font-size:20px;color:#fff;font-weight:800}
.aovivo{display:inline-flex;align-items:center;gap:6px;background:#e5484d;color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em;border-radius:6px;padding:3px 8px}
.aovivo i{width:7px;height:7px;border-radius:50%;background:#fff;animation:pisca 1.4s infinite}
@keyframes pisca{50%{opacity:.2}}
.tv-topo .d-aviso{margin-left:auto;font-size:10.5px}
.tv-hora{font-size:26px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.tv-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.tv-kpi{background:#16293f;border-radius:12px;padding:12px 14px}
.tv-kpi small{display:block;font-size:13.5px;color:#9fb0c2;font-weight:700}
.tv-kpi b{display:block;font-size:36px;font-weight:800;letter-spacing:-.02em;color:#fff;margin:4px 0 3px;font-variant-numeric:tabular-nums}
.tv-kpi span{font-size:12.5px;color:#7fd3a8;font-weight:600}
.tv-kpi.lucro{background:var(--amarelo)}
.tv-kpi.lucro small,.tv-kpi.lucro b,.tv-kpi.lucro span{color:var(--marinho)}
.prog{height:6px;border-radius:3px;background:#2a3f58;margin-top:7px;overflow:hidden}
.prog i{display:block;height:100%;background:#5aa2ef;transition:width .6s}
.tv-baixo{display:grid;grid-template-columns:1.3fr 1fr;gap:10px;min-height:0}
.tv-cx{background:#122338;border-radius:12px;padding:12px 14px;min-height:0;display:flex;flex-direction:column}
.tv-cx > p{margin:0 0 10px;font-size:14px;font-weight:800;color:#e8eef5;display:flex;justify-content:space-between;align-items:center}
.tv-cx > p em{font-style:normal;font-weight:600;color:#8ea0b4;font-size:12px;display:flex;align-items:center;gap:5px}
.tv-cx > p em i{width:10px;height:10px;border-radius:2px;background:#5aa2ef}
.tv-cx > p em i.on{height:0;border-top:2px solid #8ea0b4;border-radius:0;margin-left:6px}
.tv-horas{flex:1;display:grid;grid-template-columns:repeat(12,1fr);gap:5px;min-height:0}
.tv-horas > div{display:flex;flex-direction:column;min-height:0}
.trilho{position:relative;flex:1}
.trilho i{position:absolute;bottom:0;left:15%;right:15%;background:#5aa2ef;border-radius:4px 4px 0 0;transition:height .6s}
.tv-horas .agora i{background:#f5cf45}
.trilho u{position:absolute;left:4%;right:4%;border-top:2px solid #8ea0b4}
.tv-horas span{font-size:11px;color:#8ea0b4;text-align:center;margin-top:5px}
.tv-feed ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.tv-feed li{display:grid;grid-template-columns:8px 40px 1fr;gap:8px;align-items:center;background:#16293f;border-radius:9px;padding:7px 10px;font-size:12.5px;color:#9fb0c2}
.tv-feed li > i{width:8px;height:8px;border-radius:50%;background:#5aa2ef}
.tv-feed li.pedido > i{background:#f5cf45}.tv-feed li.pix > i{background:#45c48c}.tv-feed li.lead > i{background:#b294ec}
.tv-feed time{font-weight:800;color:#e8eef5;font-variant-numeric:tabular-nums}
.tv-feed li b{display:block;color:#fff;font-size:13.5px}
.tv-feed li.novo{animation:entra .8s ease-out}
@keyframes entra{from{background:#2f5582;transform:translateY(-8px);opacity:.2}}
@media (prefers-reduced-motion:reduce){.aovivo i,.tv-feed li.novo{animation:none}.trilho i,.prog i{transition:none}}
@media (max-width:700px){
  .tv-janela{aspect-ratio:1/.72}
  .tv-cena{width:265%;margin-left:-96.5%;margin-top:-66.4%}
}

/* conversa com a IA ligada aos sistemas da empresa, embaixo da TV (31/10/2026) */
.d-chat{margin-top:44px}
.d-chat .d-miolo{max-width:860px;margin:0 auto}
.ch-tela .tela-barra span:first-of-type{display:flex;align-items:center;gap:7px;color:var(--marinho);font-weight:700}
.ch-tela .marca-logo{width:16px;height:16px;flex:none}
.ch-tela .tela-corpo{padding:18px 22px 20px;background:#fdfbf6;display:grid;gap:14px}
.ch-ligado{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12.5px;color:var(--suave);padding-bottom:14px;border-bottom:1px solid var(--linha)}
.ch-ligado small{font-size:12.5px;font-weight:700;margin-right:2px}
.ch-ligado span{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--linha);border-radius:999px;padding:3px 10px;color:var(--marinho);font-weight:600}
.ch-ligado span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--verde)}
.ch-msg p{margin:0;font-size:15.5px;line-height:1.55;color:#2a333c}
.ch-msg b{color:var(--marinho)}
.ch-msg.eu{justify-self:end;max-width:78%;background:var(--creme2);border-radius:16px 16px 4px 16px;padding:10px 15px}
.ch-msg.eu p{color:var(--marinho)}
.ch-msg.ia{display:grid;grid-template-columns:30px 1fr;gap:12px;max-width:94%}
.ch-av{width:30px;height:30px;border-radius:9px;background:#fbeee8;display:grid;place-items:center}
.ch-av .marca-logo{width:18px;height:18px}
.ch-msg.ia > div{display:grid;gap:8px;justify-items:start}
.ch-msg p.ch-ferr{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;line-height:1.3;color:var(--suave);background:#fff;border:1px solid var(--linha);border-radius:8px;padding:4px 9px}
.ch-ferr .icone{width:14px;height:14px;color:var(--azul)}
.ch-cartao{display:flex;align-items:center;gap:10px;flex-wrap:wrap;width:100%;background:#fff;border:1px solid var(--linha);border-radius:14px;padding:12px 14px;box-shadow:0 6px 16px -12px rgba(14,28,45,.3)}
.ch-cartao div{margin-right:auto;line-height:1.35}
.ch-cartao small{display:block;font-size:12.5px;color:var(--suave);font-weight:600}
.ch-cartao b{color:var(--marinho);font-size:15px}
.ch-bt{background:var(--azul);color:#fff;font-weight:700;font-size:13.5px;border-radius:9px;padding:7px 14px;border:1.5px solid var(--azul)}
.ch-bt.claro{background:transparent;color:var(--azul)}
.ch-entrada{display:flex;align-items:center;gap:10px;margin-top:6px;background:#fff;border:1px solid var(--linha);border-radius:14px;padding:10px 10px 10px 16px;color:var(--suave);font-size:15px;box-shadow:0 4px 12px -8px rgba(14,28,45,.25)}
.ch-entrada span{flex:1}
.ch-entrada i{width:32px;height:32px;border-radius:9px;background:#d97757;color:#fff;display:grid;place-items:center;transform:rotate(-90deg)}
.ch-entrada .icone{width:16px;height:16px}
.anima .ch-msg{opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.anima .ch-msg.vis{opacity:1;transform:none}
@media (max-width:640px){
  .ch-tela .tela-corpo{padding:14px 12px 16px}
  .ch-tela .tela-barra i{display:none}
  .ch-tela .tela-barra span:first-of-type{flex:1 0 auto;margin-left:0}
  .ch-msg.eu{max-width:90%}
  .ch-msg.ia{max-width:100%;grid-template-columns:26px 1fr;gap:9px}
  .ch-av{width:26px;height:26px}
  .ch-msg p{font-size:15px}
}