:root{--void:#0e0e0e;--sup:#151515;--sup2:#1c1c1d;--linha:#262627;--linha2:#343436;--texto:#f2f2f3;--suave:#a1a1aa;--apagado:#8a8a93;--sunset:linear-gradient(90deg,#f4c587 9%,#d6d3e9 52%,#99d2ec 94%);--ciano:#6fe2ff;--ambar:#ffba6a;--lavanda:#c9bfff;--menta:#7ee8b0;--coral:#ff8f8f;--rosa:#ff9fd0;--ardosia:#9aa6c1;--sans:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"Geist Mono",ui-monospace,Consolas,monospace;--t-xs:.75rem;--t-sm:.8rem;--t-md:.875rem;--t-base:.95rem;--t-lg:1.1rem;--t-xl:1.3rem;--r-md:10px;--brilho:inset 0 1px 0 rgba(255,255,255,.045);--sombra:0 1px 2px rgba(0,0,0,.35),0 16px 32px -20px rgba(0,0,0,.85);--transicao:150ms cubic-bezier(.2,.6,.3,1);color-scheme:dark}
*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--c,var(--ciano)) 34%,var(--linha2)) transparent}
[hidden]{display:none!important}
body{margin:0;min-height:100vh;color:var(--texto);font:15px/1.5 var(--sans);-webkit-font-smoothing:antialiased;background:var(--void)}
[data-etapa=fila]{--c:var(--ardosia)}
[data-etapa=aguardando]{--c:var(--ciano)}
[data-etapa=followup]{--c:var(--ambar)}
[data-etapa=respondeu]{--c:var(--lavanda)}
[data-etapa=negociacao]{--c:var(--rosa)}
[data-etapa=ganho]{--c:var(--menta)}
[data-etapa=perdido]{--c:var(--coral)}
[data-etapa=bloqueado]{--c:var(--apagado)}
a{color:var(--ciano);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--ciano);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:transparent}
::-webkit-scrollbar-thumb{border:3px solid transparent;background:color-mix(in srgb,var(--c,var(--ciano)) 30%,var(--linha2));background-clip:padding-box;border-radius:999px}
::-webkit-scrollbar-thumb:hover{border:2px solid transparent;background:color-mix(in srgb,var(--c,var(--ciano)) 62%,var(--linha2));background-clip:padding-box}
::-webkit-scrollbar-thumb:active{background:var(--c,var(--ciano));background-clip:padding-box}
.app{display:grid;grid-template-columns:15rem minmax(0,1fr);min-height:100vh}
.lateral{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:1.5rem;padding:1.25rem .85rem;border-right:1px solid var(--linha);background:var(--sup)}
.lateral .marca{padding:.2rem .55rem;color:var(--texto)}
.lateral .marca:hover{text-decoration:none}
.lateral-topo{display:flex;align-items:center;justify-content:space-between;gap:.4rem}
.recolher{display:grid;place-items:center;min-width:2rem;min-height:2rem;padding:.4rem;border-radius:9px;background:none;border:1px solid transparent;color:var(--apagado);cursor:pointer}
.recolher:hover{color:var(--texto);background:var(--sup2);border-color:var(--linha);filter:none}
:root[data-lateral="1"] .app{grid-template-columns:4.4rem minmax(0,1fr)}
:root[data-lateral="1"] .lateral{padding:1.25rem .55rem;gap:1.1rem}
:root[data-lateral="1"] .lateral-topo{flex-direction:column;gap:.7rem}
:root[data-lateral="1"] .marca-texto,:root[data-lateral="1"] .nav-principal a span{display:none}
:root[data-lateral="1"] .marca{padding:.2rem}
:root[data-lateral="1"] .nav-principal a{justify-content:center;padding:.55rem}
:root[data-lateral="1"] .recolher .ico{transform:scaleX(-1)}
.area{min-width:0;display:flex;flex-direction:column}
.barra-pagina{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:1.25rem;padding:.65rem clamp(1rem,2.5vw,2rem);border-bottom:1px solid var(--linha);background:rgba(14,14,14,.92);backdrop-filter:blur(8px)}
.abas{display:flex;gap:.25rem;overflow-x:auto;scrollbar-width:none;min-width:0}
.abas::-webkit-scrollbar{display:none}
/* Com muitos funis a faixa rola, mas sem barra à mostra e com uma sombra na beirada avisando que há mais
   (17/09 à noite: o cadastro de funis deixou o número de abas variável). */
.barra-pagina{position:relative}
.abas{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 1.5rem),transparent)}
.abas{mask-image:linear-gradient(90deg,#000 calc(100% - 1.5rem),transparent)}
.abas a{padding:.45rem .85rem;border-radius:8px;color:var(--suave);font-size:.88rem;white-space:nowrap;transition:background-color .15s ease,color .15s ease}
.abas a:hover{color:var(--texto);background:var(--sup);text-decoration:none}
.abas a.atual{color:var(--texto);background:var(--sup2);box-shadow:inset 0 0 0 1px var(--linha2)}
/* Índice do grupo (17/09): segundo nível, mais leve que as abas, separado por uma barra. */
.abas-dentro{display:flex;align-items:center;gap:.9rem;overflow-x:auto;padding-left:1rem;margin-left:.2rem;border-left:1px solid var(--linha2)}
.abas-dentro a{color:var(--apagado);font-size:.82rem;white-space:nowrap}
.abas-dentro a:hover{color:var(--texto);text-decoration:none}
.abas-dentro a.atual{color:var(--texto);font-weight:500;box-shadow:0 1px 0 var(--ciano)}
.ico{flex:none}
.marca{display:flex;align-items:center;gap:.75rem}
.marca-texto{display:flex;flex-direction:column;gap:.2rem}
.olho,.rotulo{font:500 .75rem/1 var(--sans);color:var(--suave)}
.marca b{font-size:1.05rem;font-weight:600;letter-spacing:-.01em;line-height:1}
.nav-principal{display:flex;flex-direction:column;gap:.2rem}
.nav-principal a{display:flex;align-items:center;gap:.7rem;min-height:2.6rem;padding:.55rem .75rem;border-radius:10px;color:var(--suave);font-size:.92rem;font-weight:500;transition:background-color .15s ease,color .15s ease}
.nav-principal a:hover{color:var(--texto);background:var(--sup2);text-decoration:none}
.nav-principal a.atual{color:var(--texto);background:var(--sup2);box-shadow:inset 2px 0 0 var(--ciano)}
.nav-principal a.atual .ico{color:var(--ciano)}
main{padding:clamp(1rem,2.5vw,2rem)}
@media (max-width:900px){
.app{grid-template-columns:1fr}
.barra-pagina{position:static}
}
main.estreito{max-width:34rem;margin:0 auto;text-align:center}
main.estreito img{background:#fff;padding:12px;border-radius:12px;margin-top:1rem;box-shadow:0 0 0 1px var(--linha),0 0 40px color-mix(in srgb,var(--ciano) 12%,transparent)}
h1{font-size:1.4rem;font-weight:600;letter-spacing:-.015em;margin:0 0 .75rem;text-wrap:balance}
p{color:var(--suave)}
.linha-status{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.75rem;margin-bottom:.75rem}
.status{--t:var(--ardosia);min-width:0;display:flex;flex-direction:column;gap:.35rem;padding:.95rem 1.05rem;border-radius:12px;
background:var(--sup);
border:1px solid color-mix(in srgb,var(--t) 24%,var(--linha))}
.status[data-tom=ok]{--t:var(--menta)}
.status[data-tom=alerta]{--t:var(--ambar)}
.status[data-tom=info]{--t:var(--ciano)}
.status strong{display:flex;align-items:center;gap:.55rem;font-size:1.15rem;font-weight:600;letter-spacing:-.01em}
.status[data-tom=ok] strong{color:var(--menta)}
.status[data-tom=alerta] strong{color:var(--ambar)}
.status .sub{color:var(--suave);font-size:.85rem;overflow-wrap:break-word}
.ponto{width:.55rem;height:.55rem;border-radius:50%;background:var(--c,var(--apagado));flex:none}
.status .ponto{background:var(--t);box-shadow:0 0 0 4px color-mix(in srgb,var(--t) 18%,transparent)}
.barra{height:5px;border-radius:999px;background:var(--linha);overflow:hidden;margin-top:.25rem}
.barra span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--ciano),var(--lavanda))}
.total{font:.8rem var(--sans);color:var(--suave);font-variant-numeric:tabular-nums}
.funil{display:flex;gap:3px;height:10px;border-radius:999px;overflow:hidden;background:var(--linha)}
.funil span{background:var(--c);min-width:8px}
.destaque{display:flex;align-items:baseline;gap:.4rem;white-space:nowrap}
.destaque b{font:500 1.2rem/1 var(--mono);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.legenda-linha{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .9rem;list-style:none;margin:0;padding:0}
.legenda-linha li{display:flex;align-items:center;gap:.35rem;min-width:0;white-space:nowrap;font-size:.78rem;color:var(--suave)}
.legenda-linha li>span{overflow:hidden;text-overflow:ellipsis}
.legenda-linha b{font:500 .85rem/1 var(--mono);color:var(--c);font-variant-numeric:tabular-nums}
.legenda-linha li[data-zero] b{color:var(--apagado)}
.legenda-linha li[data-zero] .ponto{opacity:.45}
.legenda-linha .total{font:.75rem var(--sans);color:var(--apagado)}
.funil-bloco{display:flex;flex-direction:column;gap:.55rem}
.funil-bloco .destaque b{font-size:1.3rem}
.funil-bloco .funil{height:12px}
.funil-bloco .legenda-linha{display:grid;grid-template-columns:1fr;gap:0}
.funil-bloco .legenda-linha li{padding:.3rem 0;font-size:.85rem;border-bottom:1px solid color-mix(in srgb,var(--linha) 65%,transparent)}
.funil-bloco .legenda-linha b{margin-left:auto;font-size:1.2rem}
.funil-bloco .legenda-linha .total{justify-content:flex-end;border-bottom:0;padding-top:.45rem}
.barra-ferramentas{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1rem;margin-bottom:.7rem}
.barra-ferramentas h1{margin:0;font-size:1.2rem;white-space:nowrap}
.barra-ferramentas input{flex:1 1 14rem;width:min(24rem,100%)}
input{font:inherit;padding:.6rem .8rem;border-radius:10px;border:1px solid var(--linha);background:var(--sup);color:var(--texto)}
input:focus{border-color:color-mix(in srgb,var(--ciano) 55%,var(--linha))}
input::placeholder{color:var(--apagado)}
.atualizado{font:.78rem var(--sans);color:var(--apagado)}
/* Filtros num botão só (17/09): a barra de ferramentas guarda contexto, busca e a ação principal. */
.filtros-menu{position:relative;flex:none}
.filtros-menu>summary{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .7rem;border-radius:9px;border:1px solid var(--linha2);background:var(--sup2);color:var(--suave);font-size:.82rem;white-space:nowrap;cursor:pointer;list-style:none}
.filtros-menu>summary::-webkit-details-marker{display:none}
.filtros-menu>summary:hover{color:var(--texto);border-color:color-mix(in srgb,var(--ciano) 45%,var(--linha2))}
.filtros-menu[data-ativos]>summary{color:var(--texto);border-color:color-mix(in srgb,var(--ciano) 55%,var(--linha2))}
.filtros-menu[open]>summary .ico:last-child{transform:rotate(180deg)}
.filtros-conta{display:grid;place-items:center;min-width:1.15rem;height:1.15rem;padding:0 .25rem;border-radius:999px;background:var(--ciano);color:var(--void);font:600 .75rem/1 var(--sans)}
.filtros-painel{position:absolute;z-index:30;top:calc(100% + .35rem);left:0;display:flex;flex-direction:column;gap:.7rem;width:min(17rem,calc(100vw - 2rem));padding:.85rem;border-radius:12px;border:1px solid var(--linha2);background:var(--sup);box-shadow:var(--sombra)}
.filtros-painel .campo{gap:.3rem}
.filtros-painel select{width:100%;max-width:none;padding:.45rem .55rem;cursor:pointer}
.filtros-aplicar{padding:.45rem .8rem;font-size:.82rem}
.filtros-limpar{display:inline-flex;align-items:center;gap:.3rem;font-size:.78rem;color:var(--suave)}
.filtros-limpar:hover{color:var(--texto)}
/* Uma ação por barra tem peso; as outras ficam discretas (17/09). */
button.botao-principal{background:color-mix(in srgb,var(--ciano) 16%,var(--sup2));border-color:color-mix(in srgb,var(--ciano) 45%,var(--linha2));color:var(--texto)}
button.botao-principal:hover{background:color-mix(in srgb,var(--ciano) 26%,var(--sup2))}
button.botao-discreto{display:inline-flex;align-items:center;gap:.35rem;padding:.5rem .6rem;border:0;background:none;color:var(--apagado);font-size:.8rem;white-space:nowrap;cursor:pointer}
button.botao-discreto:hover{color:var(--texto);text-decoration:underline}
.quadro-rolagem{overflow-x:auto;padding-bottom:.35rem}
main.cheio .bloqueados{margin:0}
.quadro{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(11.5rem,1fr);gap:.75rem;align-items:start}
.coluna{min-width:0;overflow:hidden;border-radius:12px;background:var(--sup);border:1px solid var(--linha)}
.coluna header{display:flex;align-items:center;gap:.55rem;padding:.75rem .85rem;
background:color-mix(in srgb,var(--c) 10%,transparent);border-bottom:1px solid color-mix(in srgb,var(--c) 24%,var(--linha))}
.coluna h2{font-size:.85rem;font-weight:600;margin:0;flex:1;line-height:1.25}
.coluna header .ponto{box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent)}
.contagem{font:500 .75rem/1 var(--sans);color:var(--c);background:color-mix(in srgb,var(--c) 15%,transparent);padding:.28rem .5rem;border-radius:999px;font-variant-numeric:tabular-nums}
.cards{display:flex;flex-direction:column;gap:.5rem;padding:.6rem;max-height:62vh;overflow-y:auto}
.card{display:flex;flex-direction:column;gap:.25rem;padding:.6rem .7rem;border-radius:10px;background:var(--sup2);border:1px solid var(--linha);color:var(--texto)}
.card:hover{text-decoration:none;border-color:color-mix(in srgb,var(--c) 50%,var(--linha));background:color-mix(in srgb,var(--c) 6%,var(--sup2))}
.avatar{flex:none;width:1.75rem;height:1.75rem;border-radius:50%;display:grid;place-items:center;font:600 .75rem/1 var(--sans);
color:var(--c);background:color-mix(in srgb,var(--c) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 32%,transparent)}
.card-nome{font-weight:500;font-size:.9rem;line-height:1.3;overflow-wrap:break-word;min-width:0}
.selo{font:500 .75rem/1 var(--sans);border-radius:6px;padding:.2rem .38rem;flex:none;border:1px solid}
.selo[data-envio=robo]{color:var(--ciano);border-color:color-mix(in srgb,var(--ciano) 20%,transparent);background:color-mix(in srgb,var(--ciano) 8%,transparent)}
.selo[data-envio=manual]{color:var(--ambar);border-color:color-mix(in srgb,var(--ambar) 20%,transparent);background:color-mix(in srgb,var(--ambar) 8%,transparent)}
.card-tel{font:.8rem var(--mono);font-variant-numeric:tabular-nums;color:var(--texto);white-space:nowrap}
.card-info{font-size:.75rem;color:var(--suave);overflow-wrap:break-word}
.coluna[data-etapa=respondeu] .card-info{color:var(--lavanda)}
.coluna[data-etapa=perdido] .card-nome,.coluna[data-etapa=perdido] .card-tel{color:var(--suave)}
.vazio{color:var(--apagado);font-size:.82rem;margin:.4rem .3rem}
.card[draggable="true"]{cursor:grab}
.card.arrastando{opacity:.45;cursor:grabbing}
.coluna.alvo{border-color:color-mix(in srgb,var(--c) 70%,var(--linha));box-shadow:0 0 0 2px color-mix(in srgb,var(--c) 35%,transparent)}
#escolher-etapa{background:var(--sup);color:var(--texto);border:1px solid var(--linha2);border-radius:14px;padding:1.1rem 1.2rem;width:min(22rem,calc(100% - 2rem))}
#escolher-etapa::backdrop{background:rgba(0,0,0,.55)}
#escolher-etapa h2{font-size:1rem;margin:0}
.opcoes-etapa{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.toast{position:fixed;bottom:1.2rem;left:50%;transform:translateX(-50%);z-index:20;max-width:calc(100% - 2rem);padding:.65rem 1rem;border-radius:10px;
background:var(--sup2);color:var(--texto);font-size:.9rem;border:1px solid color-mix(in srgb,var(--menta) 45%,var(--linha))}
.toast[data-erro="1"]{border-color:color-mix(in srgb,var(--coral) 55%,var(--linha))}
.aviso-topo{border:1px solid color-mix(in srgb,var(--ambar) 38%,transparent);background:color-mix(in srgb,var(--ambar) 7%,transparent);color:var(--ambar);border-radius:12px;padding:.75rem 1rem;margin-bottom:1.25rem}
details.bloqueados{margin-top:1.5rem;border-top:1px solid var(--linha);padding-top:1rem}
details.bloqueados summary{cursor:pointer;color:var(--suave)}
details.bloqueados ul{columns:18rem;padding-left:1rem;color:var(--suave);font-size:.85rem}
.lista{list-style:none;padding:0;margin:0 0 1.5rem;text-align:left}
.lista li{padding:.55rem .8rem;border-radius:10px;margin:.4rem 0;background:var(--sup);border:1px solid var(--linha)}
.lista li.ok{color:var(--menta);border-color:color-mix(in srgb,var(--menta) 28%,var(--linha));background:color-mix(in srgb,var(--menta) 6%,var(--sup))}
.lista li.falta{color:var(--ambar);border-color:color-mix(in srgb,var(--ambar) 28%,var(--linha));background:color-mix(in srgb,var(--ambar) 6%,var(--sup))}
.aviso{color:var(--menta)}
form{display:grid;gap:1rem;text-align:left}
label{display:grid;gap:.35rem;font-size:.9rem;color:var(--suave)}
button{font:inherit;font-weight:600;padding:.7rem 1rem;border:0;border-radius:10px;background:var(--ciano);color:#06161c;cursor:pointer;transition:filter .15s ease,background-color .15s ease,border-color .15s ease}
button:hover{filter:brightness(1.08)}
button:disabled{opacity:.45;cursor:not-allowed;filter:none}
.cabecalho-pagina{margin-bottom:1rem}
.cabecalho-pagina h1{margin-bottom:.25rem}
.cabecalho-pagina p{margin:0}
.painel-bloco{min-width:0;background:var(--sup);border:1px solid var(--linha);border-radius:12px;padding:1rem 1.1rem}
.painel-bloco h2,.form-agenda h2{font-size:.95rem;font-weight:600;margin:1rem 0 .5rem}
.painel-bloco>h2:first-child{margin-top:0}
.duas-colunas{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(16rem,1fr);gap:1rem;align-items:start}
.chat{display:flex;flex-direction:column;gap:.55rem;height:min(58vh,34rem);overflow-y:auto;padding:.25rem .25rem 1rem}
textarea,select{font:inherit;padding:.6rem .8rem;border-radius:10px;border:1px solid var(--linha);background:var(--sup2);color:var(--texto)}
textarea{min-height:3.2rem;resize:vertical}
.form-agenda{display:grid;gap:.75rem;margin-top:1rem}
[data-acao=continuar]{--c:var(--ciano)}
[data-acao=agendar]{--c:var(--menta)}
[data-acao=reuniao]{--c:var(--rosa)}
[data-acao=passar_para_joao]{--c:var(--ambar)}
[data-acao=recusou]{--c:var(--coral)}
[data-acao=retomar_depois]{--c:var(--lavanda)}
[data-acao=""]{--c:var(--coral)}
.problema{color:var(--ambar)}
.bloqueada{color:var(--suave);font-style:italic}
.horarios{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;padding:0;margin:.4rem 0 1rem}
.horarios li{font-size:.8rem;padding:.35rem .65rem;border-radius:999px;color:var(--menta);background:color-mix(in srgb,var(--menta) 12%,transparent)}
.grade-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.75rem}
.dias{display:flex;flex-wrap:wrap;gap:.4rem}
.dias label{display:flex;align-items:center;gap:.35rem;padding:.4rem .7rem;border:1px solid var(--linha);border-radius:999px;color:var(--texto);background:var(--sup)}
.acoes{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:.25rem 0 1rem}
.acoes form{margin:0}
a.botao{display:inline-block;font-weight:600;padding:.7rem 1rem;border-radius:10px;background:var(--ciano);color:#06161c;transition:filter .15s ease}
a.botao:hover{text-decoration:none}
button.botao-sec{background:var(--sup2);color:var(--texto);border:1px solid var(--linha2)}
.passos{margin:1rem 0;padding:.8rem 1rem;border:1px solid var(--linha);border-radius:12px;background:var(--sup)}
.passos summary{cursor:pointer;font-weight:500}
.passos ol{padding-left:1.2rem;color:var(--suave)}
.passos li{margin:.45rem 0}
code{font:.8rem var(--mono);background:var(--sup2);padding:.1rem .35rem;border-radius:6px;color:var(--texto);overflow-wrap:anywhere}
.dica{font-size:.8rem;margin:0}
details.teste{border:1px solid var(--linha);border-radius:10px;background:var(--sup);margin:.35rem 0}
details.teste[open]{border-color:var(--linha2)}
details.teste>summary{display:grid;grid-template-columns:6.5rem minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:.6rem .85rem;cursor:pointer;list-style:none}
details.teste>summary::-webkit-details-marker{display:none}
.pill{justify-self:start;font:500 .75rem/1 var(--sans);padding:.36rem .55rem;border-radius:999px;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
.pill[data-tom=ok]{--c:var(--menta)}
.pill[data-tom=instavel]{--c:var(--ambar)}
.pill[data-tom=falhou]{--c:var(--coral)}
.pill[data-tom=nada]{--c:var(--apagado)}
.falhas{margin:.1rem 0 .4rem;padding-left:1.1rem;color:var(--coral);font-size:.82rem;align-self:flex-end;max-width:80%}
.falhas.avisos{color:var(--ambar)}
.tabela-rolagem{overflow-x:auto;padding:0}
.tabela{width:100%;border-collapse:collapse;font-size:.88rem}
.tabela th{font:500 .75rem/1.2 var(--sans);color:var(--suave);text-align:left;padding:.9rem 1rem;border-bottom:1px solid var(--linha);white-space:nowrap}
.tabela td{padding:.8rem 1rem;border-bottom:1px solid var(--linha);vertical-align:middle}
.tabela tbody tr:last-child td{border-bottom:0}
.tabela tbody tr:hover{background:color-mix(in srgb,var(--ciano) 4%,transparent)}
.tabela .num,.tabela .tel{font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.empresa{min-width:14rem}
.empresa b{display:block;font-weight:500;color:var(--texto)}
.empresa small{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;color:var(--suave);font-size:.76rem;margin-top:.25rem}
.chip{font-size:.75rem;padding:.16rem .5rem;border-radius:6px;background:var(--sup2);border:1px solid var(--linha);color:var(--suave)}
.sem-site{color:var(--menta);white-space:nowrap}
.estrela{color:var(--ambar)}
.score{font:600 .95rem/1 var(--mono);font-variant-numeric:tabular-nums;color:var(--suave)}
.score[data-t=Quente]{color:var(--menta)}
.score[data-t=Morno]{color:var(--ambar)}
.pill[data-t=Quente]{--c:var(--ambar)}
.pill[data-t=Morno]{--c:var(--lavanda)}
.pill[data-t=Frio]{--c:var(--ardosia)}
.pill[data-tom=info]{--c:var(--ciano)}
.acoes-linha{display:flex;gap:.3rem;justify-content:flex-end}
.tabela .pill,.tabela .selo{display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap}
.tabela td.empresa{width:30%}
.tabela form{display:inline-block;margin:0}
button.botao-mini{padding:.42rem .75rem;font-size:.78rem;white-space:nowrap}
.acoes-topo{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.acoes-topo form{display:block;margin:0}
.acoes-topo button{padding:.75rem 1rem}
a.botao.sec{background:var(--sup2);color:var(--texto);border:1px solid var(--linha2)}
button.icone{background:none;padding:0;font:inherit;font-size:1.2rem;line-height:1;color:var(--suave);cursor:pointer}
.icone.excluir:hover{color:var(--coral);border-color:color-mix(in srgb,var(--coral) 40%,var(--linha))}
.acoes-linha form{display:inline-block;margin:0}
form.form-linha{display:inline-block;margin:0 0 0 .6rem}
ul.excluidos{columns:auto;list-style:none;padding-left:0}
ul.excluidos li{margin:.4rem 0}
.tabela form.form-crm{display:inline-flex;gap:.3rem}
button.botao-mini.sec{background:var(--sup2);color:var(--texto);border:1px solid var(--linha2)}
.acoes-topo form{display:flex;flex-wrap:wrap;gap:.5rem}
.dash-topo{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1rem}
.dash-topo .cabecalho-pagina{margin:0}
.dash-topo h1{margin:.2rem 0 0;font-size:1.25rem}
.dash-topo .aviso-topo{flex-basis:100%;margin:0;padding:.5rem .8rem}
.dash-topo .botao{padding:.6rem .9rem;font-size:.88rem}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.7rem;margin:0}
.kpi{--c:var(--ciano);position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.1rem .85rem;padding:.85rem 1rem;border-radius:12px;background:var(--sup);border:1px solid var(--linha);color:var(--texto);transition:border-color var(--transicao),background-color var(--transicao)}
.kpi[data-cor=ambar]{--c:var(--ambar)}
.kpi[data-cor=lavanda]{--c:var(--lavanda)}
.kpi[data-cor=rosa]{--c:var(--rosa)}
.kpi:hover{border-color:color-mix(in srgb,var(--c) 45%,var(--linha));background:var(--sup2);text-decoration:none}
.kpi b{grid-row:1/3;font:500 2.3rem/1 var(--mono);letter-spacing:-.03em;color:var(--c);font-variant-numeric:tabular-nums}
.kpi .rotulo{grid-column:2;align-self:end;color:var(--texto);font:500 .88rem/1.2 var(--sans);letter-spacing:0;text-transform:none}
.kpi .sub{grid-column:2;align-self:start;color:var(--suave);font-size:.75rem}
.kpi>.ico{grid-column:3;grid-row:1/3;color:var(--apagado)}
.kpi:hover>.ico{color:var(--c)}
/* Nada para fazer é uma boa notícia: o zero não grita. */
.kpi[data-zero]{background:none}
.kpi[data-zero] b{color:var(--apagado)}
/* Resultados (17/09 à noite): o dinheiro em primeiro plano, o funil como faixa de apoio. */
.kpi.dinheiro{grid-template-columns:1fr;gap:.2rem;align-items:start}
/* Os quatro números do dinheiro cabem numa linha no notebook do João (1265px): 4 × 12rem + espaços. */
.resultados>.kpis{grid-template-columns:repeat(auto-fit,minmax(12rem,1fr))}
.kpi.dinheiro b{grid-row:auto;font-size:1.75rem;letter-spacing:-.02em;display:flex;align-items:baseline;gap:.15rem}
.kpi.dinheiro b small{font:500 .78rem/1 var(--sans);color:var(--apagado);letter-spacing:0}
.kpi.dinheiro .rotulo{grid-column:auto;align-self:auto;color:var(--suave);font-size:.78rem}
.kpi.dinheiro .sub{grid-column:auto}
.faixa-conversao .conversao{display:grid;grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:.5rem 1.4rem}
.conversao-item{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.conversao-item .rotulo{font-size:.75rem;color:var(--suave);letter-spacing:.04em}
.conversao-item b{font:500 1.35rem/1.1 var(--mono);font-variant-numeric:tabular-nums}
.conversao-item .sub{font-size:.75rem;color:var(--apagado)}
.faixa-conversao .dica{font-size:.75rem;color:var(--apagado)}
/* Linha de estado (17/09): o que funciona fala baixo; o que precisa de você sai do tom e ganha o botão. */
.barra-estado{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem 1.4rem;padding:.55rem .9rem;border-radius:12px;border:1px solid var(--linha);background:var(--sup)}
.estado-item{--t:var(--ardosia);display:flex;align-items:center;gap:.45rem;min-width:0;font-size:.82rem;color:var(--suave);cursor:help}
.estado-item[data-tom=ok]{--t:var(--menta)}
.estado-item[data-tom=alerta]{--t:var(--ambar)}
.estado-item[data-tom=info]{--t:var(--ciano)}
.estado-item .ponto{flex:none;width:7px;height:7px;border-radius:50%;background:var(--t)}
.estado-item b{color:var(--texto);font-weight:500;white-space:nowrap}
.estado-rotulo{color:var(--apagado);white-space:nowrap}
.estado-barra{flex:none;width:3.5rem;height:4px;border-radius:999px;background:var(--linha2);overflow:hidden}
.estado-barra i{display:block;height:100%;border-radius:999px;background:var(--t)}
.estado-item[data-pede]{margin-right:auto;padding:.1rem .5rem .1rem .55rem;border-radius:999px;background:color-mix(in srgb,var(--t) 13%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--t) 30%,transparent);cursor:default}
.estado-item[data-pede] b{color:var(--t)}
.estado-acao{display:inline-flex;align-items:center;gap:.15rem;min-height:2rem;margin:-.4rem -.3rem -.4rem 0;padding:0 .3rem 0 .45rem;border-radius:999px;font-weight:500;font-size:.8rem;color:var(--t)}
@media (min-width:901px){
main{height:100vh;overflow-y:auto}
main.cheio{overflow:hidden;display:flex;flex-direction:column;gap:.7rem;padding:clamp(.8rem,1.7vw,1.3rem)}
.barra-pagina+main{height:calc(100vh - 3.05rem)}
}
main.cheio>.quadro-rolagem{flex:1;min-height:0;overflow-y:hidden}
main.cheio>.barra-ferramentas{margin:0}
main.cheio .quadro{height:100%;align-items:stretch}
main.cheio .coluna{display:flex;flex-direction:column;max-height:100%}
main.cheio .cards{flex:1;min-height:0;max-height:none}
.tela-dash{flex:1;display:grid;grid-template-rows:auto auto auto auto;align-content:start;gap:.7rem;min-height:0}
.dash-corpo .painel-bloco{align-self:start}
.tela-dash .linha-status,.tela-dash .barra-estado{margin:0}
.dash-corpo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;min-height:0}
.tela-dash .painel-bloco{display:flex;flex-direction:column;min-height:0;padding:.75rem .85rem}
.tela-dash .bloco-topo{margin-bottom:.5rem}
.tela-dash .lista-simples{min-height:0;overflow-y:auto;padding-right:.15rem}
.linha-status.compacta{grid-template-columns:1fr;gap:.45rem;margin:0}
.compacta .status{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:.1rem .6rem;padding:.5rem .7rem}
.compacta .status .rotulo{grid-column:1;grid-row:1}
.compacta .status strong{grid-column:2;grid-row:1;font-size:.92rem}
.compacta .status .sub{grid-column:1/-1;font-size:.75rem}
.compacta .barra{grid-column:1/-1;margin:.15rem 0 0}
.bloco-topo{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.75rem}
.bloco-topo h1,.bloco-topo h2{margin:0!important}
/* 24/09: os links do canto dos blocos ("Ver as 6", "Abrir quadro") tinham 19 px de altura; a área de clique cresce
   para 32 px sem mudar o desenho (a margem negativa devolve o espaço). */
.bloco-topo a{display:inline-flex;align-items:center;min-height:2rem;padding:0 .5rem;margin:-.45rem -.5rem;border-radius:8px;font-size:.85rem}
.bloco-topo a:hover{background:color-mix(in srgb,var(--acento,var(--ciano)) 10%,transparent);text-decoration:none}
.tela-dash .resumo{grid-template-columns:minmax(7rem,9.5rem) minmax(0,1fr);gap:.6rem;margin:0}
.lista-simples{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.lista-simples a{display:flex;align-items:center;gap:.7rem;padding:.55rem .45rem;border-radius:8px;color:var(--texto)}
.lista-simples a:hover{background:var(--sup2);text-decoration:none}
.lista-simples .avatar{width:2.1rem;height:2.1rem;font-size:.75rem}
.linha-dupla{display:flex;flex-direction:column;min-width:0}
.linha-dupla b{font-weight:500;font-size:.9rem}
.linha-dupla small{color:var(--suave);font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lista-simples .meta{margin-left:auto;font:.75rem var(--sans);color:var(--apagado);white-space:nowrap}
@media (max-width:900px){
.dash-corpo{grid-template-columns:1fr}
.tela-dash{height:auto}
}
.conversas-app{flex:1;display:grid;grid-template-columns:minmax(16rem,21rem) minmax(0,1fr);min-height:0;border:1px solid var(--linha);border-radius:14px;overflow:hidden;background:var(--sup)}
.conversas-lista{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--linha)}
.conversas-lista-topo{display:flex;flex-direction:column;gap:.6rem;padding:.9rem;border-bottom:1px solid var(--linha)}
.conversas-lista-topo h1{font-size:1.05rem}
.filtros{display:flex;gap:.3rem}
.filtros button{padding:.32rem .75rem;font-size:.78rem;font-weight:500;border-radius:999px;background:transparent;color:var(--suave);border:1px solid var(--linha)}
.filtros button[aria-pressed=true]{color:var(--texto);background:var(--sup2);border-color:var(--linha2)}
.conversas-itens{overflow-y:auto;flex:1}
.conversa-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.65rem;padding:.7rem .9rem;border-bottom:1px solid var(--linha);color:var(--texto);transition:background-color .15s ease}
.conversa-item:hover{background:var(--sup2);text-decoration:none}
.conversa-item.atual{background:color-mix(in srgb,var(--ciano) 7%,var(--sup2));box-shadow:inset 2px 0 0 var(--ciano)}
.conversa-item .avatar,.chat-topo .avatar{width:2.4rem;height:2.4rem;font-size:.76rem}
.conversa-texto{min-width:0}
.conversa-linha{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem}
.conversa-linha b{font-weight:500;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.conversa-linha time{font:.75rem var(--sans);color:var(--apagado);flex:none}
.conversa-previa{display:block;font-size:.8rem;color:var(--suave);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.selo-modo{font:500 .75rem/1 var(--sans);padding:.28rem .42rem;border-radius:999px;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
.selo-modo[data-modo=joao]{--c:var(--ambar)}
.chat-coluna{display:flex;flex-direction:column;min-height:0;min-width:0}
.chat-topo{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1rem;padding:.75rem 1rem;border-bottom:1px solid var(--linha)}
.chat-quem{display:flex;flex-direction:column;min-width:12rem;flex:1}
.chat-quem h2{margin:0;font-size:1rem;font-weight:600}
.chat-quem small{color:var(--suave);font-size:.8rem}
.chat-pills{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.35rem}
.etiqueta{display:inline-flex;align-items:center;gap:.35rem;font:500 .75rem/1 var(--sans);white-space:nowrap;padding:.32rem .52rem;border-radius:999px;color:var(--c,var(--suave));background:color-mix(in srgb,var(--c,var(--suave)) 13%,transparent)}
.etiqueta .ponto{width:.4rem;height:.4rem}
.etiqueta[data-crm=auto]{--c:var(--ciano)}
.etiqueta[data-crm=manual]{--c:var(--ambar)}
.etiqueta[data-crm=bot]{--c:var(--lavanda)}
.chat-acoes select{height:2.4rem;padding:0 .7rem;font-size:.82rem;cursor:pointer}
.chat-acoes{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}
.chat-acoes form{margin:0;display:block}
.botao-icone{display:inline-grid;place-items:center;width:2.4rem;height:2.4rem;padding:0;border-radius:10px;background:var(--sup2);color:var(--suave);border:1px solid var(--linha)}
.botao-icone:hover{color:var(--texto);border-color:var(--linha2);text-decoration:none;filter:none}
.botao-icone[aria-expanded=true]{color:var(--ciano);border-color:color-mix(in srgb,var(--ciano) 40%,var(--linha))}
button.botao-texto{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .8rem;font-size:.82rem;background:var(--sup2);color:var(--texto);border:1px solid var(--linha2)}
.chat-mensagens{flex:1;display:flex;flex-direction:column;gap:.35rem;overflow-y:auto;padding:1rem clamp(.75rem,2vw,1.5rem);background:var(--void)}
.dia{display:flex;justify-content:center;margin:.75rem 0 .35rem}
.dia span{font:500 .75rem/1 var(--sans);color:var(--suave);background:var(--sup);border:1px solid var(--linha);padding:.38rem .65rem;border-radius:999px}
.msg{display:flex}
.msg.saida{justify-content:flex-end}
.balao{max-width:min(36rem,78%);padding:.5rem .7rem .35rem;border-radius:12px;font-size:.9rem;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.msg.entrada .balao{background:var(--sup2);border:1px solid var(--linha);border-top-left-radius:4px}
.msg.saida .balao{background:color-mix(in srgb,var(--ciano) 15%,var(--sup2));border:1px solid color-mix(in srgb,var(--ciano) 28%,var(--linha));border-top-right-radius:4px}
.balao time{display:block;text-align:right;font:.75rem var(--sans);color:var(--suave);margin-top:.15rem}
.msg.enviando .balao{opacity:.7}
.msg.falhou .balao{border-color:color-mix(in srgb,var(--coral) 60%,var(--linha))}
.msg.falhou time{color:var(--coral)}
.chat-vazio{margin:auto;text-align:center;color:var(--suave);max-width:24rem}
.chat-vazio b{color:var(--texto)}
form.compositor{display:block;padding:.6rem .8rem .7rem;border-top:1px solid var(--linha);background:var(--sup)}
.compositor-linha{display:flex;align-items:flex-end;gap:.4rem}
.compositor textarea{flex:1;min-height:2.6rem;max-height:10rem;resize:none;padding:.6rem .8rem;line-height:1.4}
button.botao-enviar{display:inline-grid;place-items:center;width:2.6rem;height:2.6rem;padding:0;border-radius:10px}
.compositor[aria-busy=true] .botao-enviar{opacity:.6}
.compositor-extras{display:flex;flex-wrap:wrap;gap:.3rem;margin:0 0 .5rem;padding:.5rem;border:1px solid var(--linha);border-radius:10px;background:var(--sup2)}
.compositor-extras button{padding:.3rem .45rem;font-size:1.2rem;font-weight:400;line-height:1;background:transparent;color:var(--texto);border-radius:8px}
.compositor-extras button:hover{background:var(--sup);filter:none}
.compositor-extras.rapidas button{font-size:.82rem;padding:.42rem .75rem;border:1px solid var(--linha2);border-radius:999px;text-align:left}
.compositor-aviso{margin:.45rem 0 0;font-size:.75rem;color:var(--suave)}
.compositor-aviso[data-tom=alerta]{color:var(--ambar)}
@media (prefers-reduced-motion:reduce){
*{transition:none!important;animation:none!important}
}
.icone{display:grid;place-items:center;width:2rem;height:2rem;border-radius:8px;color:var(--suave);border:1px solid transparent;font-size:1.15rem}
.icone:hover{color:var(--texto);background:var(--sup2);border-color:var(--linha);text-decoration:none}
.icone.wpp{color:var(--menta)}
@media (max-width:900px){
}
@media (max-width:640px){
details.teste>summary{grid-template-columns:1fr auto}
}
@media (max-width:900px){
.duas-colunas{grid-template-columns:1fr}
}
@keyframes pulso{0%,100%{box-shadow:0 0 0 4px color-mix(in srgb,var(--t) 18%,transparent)}50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--t) 6%,transparent)}}
@media (prefers-reduced-motion:no-preference){
.card{transition:border-color .15s ease,background-color .15s ease}
.status[data-tom=ok] .ponto{animation:pulso 2.6s ease-in-out infinite}
}
/* refino de 15/09: escala de tipo, profundidade, botões e estados */
.painel-bloco,.status,.kpi,.coluna,.conversas-app,.passos,.lista li{box-shadow:var(--brilho)}
.kpi:hover{box-shadow:var(--brilho),var(--sombra)}
button,.botao{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;font:600 var(--t-md)/1.15 var(--sans);
padding:.6rem .95rem;border-radius:var(--r-md);border:1px solid transparent;
transition:background-color var(--transicao),border-color var(--transicao),color var(--transicao),transform var(--transicao)}
button:hover,.botao:hover{filter:none}
button:active,.botao:active{transform:translateY(1px)}
.botao.sec,.botao-sec,button.botao-sec,button.botao-mini.sec{background:var(--sup2);color:var(--texto);border-color:var(--linha2)}
.botao.sec:hover,.botao-sec:hover,button.botao-sec:hover,button.botao-mini.sec:hover{background:var(--sup);border-color:color-mix(in srgb,var(--ciano) 45%,var(--linha2))}
.icone,.botao-icone{transition:color var(--transicao),background-color var(--transicao),border-color var(--transicao)}
.pagina-topo{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.7rem 1.25rem;
padding-bottom:.75rem;margin-bottom:.85rem;border-bottom:1px solid var(--linha)}
.pagina-topo h1{margin:0;font-size:var(--t-xl);line-height:1.2}
.pagina-topo p{margin:.3rem 0 0;font-size:var(--t-md);max-width:74ch}
.pagina-titulo{min-width:0;display:flex;flex-direction:column;gap:.15rem}
.voltar{display:inline-flex;align-items:center;gap:.3rem;font-size:var(--t-sm);color:var(--suave)}
.voltar:hover{color:var(--ciano);text-decoration:none}
.pagina-rolagem{flex:1;min-height:0;overflow-y:auto;padding-right:.25rem}
main.cheio>.pagina-topo,main.cheio>.linha-status{flex:none}
main.cheio .tabela-rolagem{flex:1;min-height:0}
.tabela-rolagem{overflow:auto}
.tabela thead th{position:sticky;top:0;z-index:1;background:var(--sup)}
.tabela td.empresa b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tabela td.empresa small{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;margin-top:.2rem}
.estado-vazio{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;padding:2.2rem 1rem;text-align:center;color:var(--apagado)}
.estado-vazio .ico{color:var(--linha2)}
.estado-vazio b{color:var(--suave);font-weight:500;font-size:var(--t-base)}
.estado-vazio span{font-size:var(--t-sm);max-width:44ch}
.lista li{display:flex;align-items:center;gap:.6rem;font-size:var(--t-md)}
.lista li .ico{flex:none}
.sem-site{display:inline-flex;align-items:center;gap:.25rem}
.icone svg{pointer-events:none}
.duas-colunas.config,.duas-colunas.agenda{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.col-agenda{display:flex;flex-direction:column;gap:.75rem;min-width:0}
.col-agenda .linha-status{margin:0}
.passos{margin:0}
.form-agenda{margin:0}
.form-agenda h2:first-child{margin-top:0}
.rodape-busca{flex:none;display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin-top:.6rem}
.rodape-busca details{margin:0;border-top:0;padding-top:0}
main.cheio>.duas-colunas{flex:1;min-height:0}
.duas-colunas.simulador{grid-template-columns:minmax(0,1.5fr) minmax(16rem,1fr)}
.simulador>.painel-bloco{display:flex;flex-direction:column;min-height:0}
.simulador .chat{flex:1;height:auto;min-height:0}
.simulador>aside{min-height:0;overflow-y:auto}
h2{font-size:var(--t-lg);font-weight:600;letter-spacing:-.01em;margin:0 0 .5rem}
summary{cursor:pointer}
.bloqueados>summary,.rodape-busca summary{display:inline-flex;align-items:center;gap:.4rem;list-style:none;
font-size:var(--t-sm);color:var(--suave);padding:.42rem .8rem;border:1px solid var(--linha);border-radius:999px;background:var(--sup);
transition:color var(--transicao),border-color var(--transicao)}
.bloqueados>summary::-webkit-details-marker,.rodape-busca summary::-webkit-details-marker{display:none}
.bloqueados>summary::after,.rodape-busca summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;
border-bottom:1.5px solid currentColor;transform:rotate(-45deg);margin-left:.15rem;opacity:.7}
.bloqueados[open]>summary::after,.rodape-busca details[open] summary::after{transform:rotate(45deg)}
.bloqueados>summary:hover,.rodape-busca summary:hover{color:var(--texto);border-color:var(--linha2)}
.horarios{margin:0}
.col-agenda .painel-bloco h2{margin:0}
@media (max-width:1000px){
.duas-colunas.config,.duas-colunas.agenda{grid-template-columns:1fr}
}
/* revisão de 16/09: quadro mais denso no notebook (cerca de 1265×633), colunas recolhíveis, diálogos e telas baixas */
.barra-ferramentas{flex-wrap:nowrap;justify-content:flex-start;gap:.6rem}
.barra-ferramentas h1{font-size:var(--t-lg)}
.busca-quadro{display:flex;gap:.4rem;flex:1 1 18rem;min-width:12rem}
.busca-quadro input{flex:1;min-width:6rem;width:auto;padding:.5rem .75rem}
.barra-ferramentas .botao-texto{padding:.5rem .75rem;white-space:nowrap}
.barra-ferramentas .atualizado{margin-left:auto;white-space:nowrap;cursor:help}
@media (max-width:1180px){
.barra-ferramentas{flex-wrap:wrap}
.barra-ferramentas .atualizado{margin-left:0}
}
@media (max-width:1600px){
.barra-ferramentas h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.barra-ferramentas .atualizado{font-size:.75rem}
}
.quadro{display:flex;gap:.6rem;align-items:stretch}
main:not(.cheio) .quadro{align-items:flex-start}
/* 24/09: coluna com pelo menos ~210 px, para o nome da etapa não quebrar no meio da palavra ("Respond/eu") */
.coluna{flex:1 1 13.125rem;min-width:13.125rem}
.coluna header{align-items:flex-start;gap:.45rem;padding:.6rem .45rem .6rem .75rem}
.coluna header .ponto{margin-top:.38rem}
.coluna header .contagem{margin-top:.08rem}
/* alvo de 32 px sem aumentar o cabeçalho: a margem negativa come o respiro de cima e de baixo */
.coluna .recolher-coluna{display:grid;place-items:center;flex:none;width:2rem;height:2rem;margin:-.3rem -.1rem -.3rem 0;padding:0;border-radius:8px;background:none;color:var(--suave);border:0}
.coluna .recolher-coluna .ico{transform:rotate(180deg)}
.coluna .recolher-coluna:hover{background:color-mix(in srgb,var(--c) 14%,transparent);color:var(--texto)}
.coluna.recolhida{flex:0 0 2.7rem;min-width:2.7rem;cursor:default}
.coluna.recolhida header{flex-direction:column-reverse;justify-content:flex-end;align-items:center;height:100%;padding:.55rem 0;border-bottom:0}
.coluna.recolhida h2{flex:none;writing-mode:vertical-rl;white-space:nowrap;font-size:.8rem}
.coluna.recolhida .recolher-coluna .ico{transform:none}
.coluna.recolhida .cards{display:none}
.cards{gap:.4rem;padding:.5rem}
.card{gap:.2rem;padding:.55rem .6rem}
.card-nome{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.88rem;line-height:1.3}
.card-info{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.75rem;line-height:1.35}
.selo[data-temp]{font-family:var(--sans);font-variant-numeric:tabular-nums;cursor:help}
.selo[data-temp=Quente]{color:var(--ambar);border-color:color-mix(in srgb,var(--ambar) 20%,transparent);background:color-mix(in srgb,var(--ambar) 8%,transparent)}
.selo[data-temp=Morno]{color:var(--lavanda);border-color:color-mix(in srgb,var(--lavanda) 20%,transparent);background:color-mix(in srgb,var(--lavanda) 8%,transparent)}
.selo[data-temp=Frio]{color:var(--apagado);border-color:var(--linha2);background:none}
.ficha-chip[data-temp=Quente]{color:var(--ambar)}
.ficha-chip[data-temp=Morno]{color:var(--lavanda)}
body.arrastando-card{user-select:none}
button.botao-texto:hover{background:var(--sup);color:var(--texto);border-color:color-mix(in srgb,var(--ciano) 45%,var(--linha2))}
.dialogo{background:var(--sup);color:var(--texto);border:1px solid var(--linha2);border-radius:14px;padding:1.1rem 1.2rem;width:min(26rem,calc(100% - 2rem));overscroll-behavior:contain}
.dialogo::backdrop{background:rgba(0,0,0,.55)}
.dialogo h2{font-size:1rem;margin:0}
.dialogo form{gap:.8rem}
.dialogo-acoes{display:flex;align-items:center;gap:.5rem}
.dialogo-acoes .espaco{flex:1}
.dialogo-linha{display:grid;grid-template-columns:1fr 8rem;gap:.6rem}
.botao-mini.perigo{background:none;color:var(--coral);border:1px solid color-mix(in srgb,var(--coral) 35%,var(--linha))}
.botao-mini.perigo:hover{background:color-mix(in srgb,var(--coral) 12%,transparent)}
.etiqueta[data-arquivada]{--c:var(--apagado)}
.lista-bloqueados{list-style:none;margin:0;padding:0;max-height:55vh;overflow-y:auto;display:flex;flex-direction:column;gap:.35rem}
.lista-bloqueados li{display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .6rem;padding:.5rem .7rem;border-radius:10px;background:var(--sup2);border:1px solid var(--linha);font-size:var(--t-md)}
.lista-bloqueados small{flex-basis:100%;color:var(--suave);font-size:var(--t-xs)}
.dash-corpo .funil-bloco .legenda-linha{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.4rem}
.dash-corpo .funil-bloco .legenda-linha .total{grid-column:1/-1}
.kpi[data-cor=menta]{--c:var(--menta)}
.selo-modo[data-modo=espera]{--c:var(--menta)}
input[type=date]{color-scheme:dark}
/* ficha do lead (Conversas) */
.conversas-app{position:relative}
@media (min-width:1500px){
.conversas-app.com-ficha{grid-template-columns:minmax(15rem,19rem) minmax(0,1fr) minmax(17rem,21rem)}
}
.ficha{display:none;flex-direction:column;min-height:0;min-width:0;border-left:1px solid var(--linha);background:var(--sup)}
.conversas-app.com-ficha .ficha{display:flex}
@media (max-width:1499px){
.conversas-app.com-ficha .ficha{position:absolute;top:0;right:0;bottom:0;width:min(22rem,92%);z-index:4;box-shadow:-24px 0 48px -24px rgba(0,0,0,.85)}
}
.ficha-topo{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.6rem .6rem .6rem .9rem;border-bottom:1px solid var(--linha)}
.ficha-topo h2{font-size:var(--t-base);margin:0}
.ficha-rolagem{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:.8rem .9rem 1rem;display:flex;flex-direction:column;gap:1rem}
.ficha-links{display:flex;flex-wrap:wrap;gap:.35rem}
.ficha-link{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;border-radius:8px;border:1px solid var(--linha2);background:var(--sup2);color:var(--texto);font-size:var(--t-sm)}
.ficha-link:hover{text-decoration:none;border-color:color-mix(in srgb,var(--ciano) 45%,var(--linha2))}
.ficha-link svg{width:15px;height:15px;flex:none}
.ficha-dados{margin:0;display:grid;gap:.45rem}
.ficha-dados div{display:grid;grid-template-columns:6.4rem minmax(0,1fr);gap:.5rem;align-items:baseline}
.ficha-dados dt{font:500 .75rem/1.6 var(--sans);color:var(--apagado)}
.ficha-dados dd{margin:0;font-size:var(--t-md);color:var(--texto);overflow-wrap:anywhere}
.ficha-secao h3{display:flex;align-items:center;gap:.4rem;font-size:var(--t-md);font-weight:600;margin:0 0 .5rem}
.ficha-secao h3 .ico{color:var(--suave)}
.ficha-lista{list-style:none;margin:0 0 .6rem;padding:0;display:flex;flex-direction:column;gap:.35rem}
.lembretes li{display:grid;grid-template-columns:3.4rem minmax(0,1fr) auto;align-items:center;gap:.5rem;padding:.35rem .4rem .35rem .6rem;border-radius:8px;background:var(--sup2);border:1px solid var(--linha);font-size:var(--t-sm)}
.lembretes time{font:500 .75rem var(--sans);color:var(--suave)}
.lembretes [data-situacao=vencido] time,.lembretes li[data-situacao=vencido] time{color:var(--coral)}
.lembretes li[data-situacao=hoje] time{color:var(--ambar)}
.lembretes li[data-situacao=feito]{opacity:.55}
.lembretes li[data-situacao=feito] span{text-decoration:line-through}
.ficha form{margin:0}
.lembretes form,.notas form,.lista-simples form{display:block}
.lembretes .icone,.notas .icone{width:1.7rem;height:1.7rem}
.notas li{padding:.5rem .6rem .35rem;border-radius:8px;background:var(--sup2);border:1px solid var(--linha)}
.notas p{margin:0;color:var(--texto);font-size:var(--t-sm);white-space:pre-wrap;overflow-wrap:anywhere}
.ficha-form{display:flex;flex-direction:column;gap:.45rem}
.ficha-form-linha{display:grid;grid-template-columns:8.8rem minmax(0,1fr);gap:.4rem}
.ficha-form input,.ficha-form textarea{padding:.45rem .6rem;font-size:var(--t-sm);background:var(--sup2);min-width:0}
.ficha-form textarea{min-height:3.6rem;resize:vertical}
.ficha-form>button{align-self:flex-start}
.atalhos-data{display:flex;flex-wrap:wrap;gap:.3rem}
.atalhos-data button{padding:.25rem .55rem;font-size:.75rem;font-weight:500;border-radius:999px;background:transparent;color:var(--suave);border:1px solid var(--linha)}
.atalhos-data button:hover{background:var(--sup2);color:var(--texto)}
/* Pendências */
.pendencias-grade{flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}
.pendencias-bloco{display:flex;flex-direction:column;min-height:0;padding:.75rem .85rem}
.pendencias-bloco .bloco-topo{margin-bottom:.4rem}
.bloco-topo h2{display:flex;align-items:center;gap:.45rem;font-size:var(--t-base)}
.bloco-topo h2 .ico{color:var(--suave)}
.bloco-rolagem{flex:1;min-height:0;overflow-y:auto}
.contagem-bloco{font:500 .75rem/1 var(--sans);color:var(--suave);background:var(--sup2);padding:.28rem .5rem;border-radius:999px;font-variant-numeric:tabular-nums}
.lista-simples li.com-acao{display:flex;align-items:center;gap:.2rem}
.lista-simples li.com-acao>a{flex:1;min-width:0}
.lista-simples .linha-dupla{flex:1}
.lista-simples li[data-situacao=vencido] .meta{color:var(--coral)}
.lista-simples li[data-situacao=hoje] .meta{color:var(--ambar)}
@media (max-width:1100px){
.pendencias-grade{grid-template-columns:1fr}
}
/* Resultados (cores do gráfico validadas no fundo escuro: ciano #1a9cc4 e âmbar #cf7d24) */
[data-serie=envios]{--serie:#169ccb}
[data-serie=respostas]{--serie:#d07c1c}
.resultados{display:flex;flex-direction:column;gap:.7rem}
.periodos{display:flex;gap:.15rem;padding:.2rem;border:1px solid var(--linha);border-radius:10px;background:var(--sup)}
.periodos a{padding:.38rem .7rem;border-radius:7px;color:var(--suave);font-size:var(--t-sm);white-space:nowrap}
.periodos a:hover{text-decoration:none;color:var(--texto)}
.periodos a.atual{background:var(--sup2);color:var(--texto);box-shadow:inset 0 0 0 1px var(--linha2)}
.kpi.estatico b{color:var(--texto)}
.kpi.estatico:hover{border-color:var(--linha);box-shadow:var(--brilho)}
.grafico-bloco{position:relative}
.legenda-grafico{display:flex;flex-wrap:wrap;gap:.3rem 1rem;list-style:none;margin:0;padding:0;font-size:var(--t-sm);color:var(--suave)}
.legenda-grafico li{display:flex;align-items:center;gap:.4rem}
.legenda-grafico li::before{content:"";width:.65rem;height:.65rem;border-radius:3px;background:var(--serie)}
.legenda-grafico b{color:var(--texto);font:500 .8rem var(--mono);font-variant-numeric:tabular-nums}
.grafico{position:relative;display:flex;align-items:flex-end;gap:2px;height:9rem;padding-top:.2rem;border-top:1px solid color-mix(in srgb,var(--linha) 70%,transparent);border-bottom:1px solid var(--linha2)}
.grafico-max{position:absolute;top:-.55rem;right:0;font:.75rem var(--sans);color:var(--apagado);background:var(--sup);padding-left:.3rem}
.dia-grafico{flex:1;min-width:0;height:100%;display:flex;align-items:flex-end;justify-content:center;gap:2px;border-radius:4px 4px 0 0}
.dia-grafico:hover,.dia-grafico:focus-visible{background:color-mix(in srgb,var(--texto) 5%,transparent)}
.dia-grafico:focus-visible{outline:2px solid var(--acento,var(--ciano));outline-offset:1px;background:color-mix(in srgb,var(--texto) 9%,transparent)}
.barra-grafico{flex:1;max-width:14px;background:var(--serie);border-radius:4px 4px 0 0}
.grafico-eixo{display:flex;justify-content:space-between;margin-top:.35rem;font:.75rem var(--sans);color:var(--apagado)}
.dica-grafico{position:absolute;z-index:3;padding:.35rem .55rem;border-radius:8px;background:var(--sup2);border:1px solid var(--linha2);color:var(--texto);font-size:.75rem;white-space:nowrap;pointer-events:none;box-shadow:var(--sombra)}
.resultados-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;align-items:start}
@media (max-width:1300px){
.resultados-grade{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.titulo-tabela{padding:.8rem .9rem .2rem;margin:0;font-size:var(--t-base)}
.tabela.compacta{font-size:var(--t-md)}
.tabela.compacta td.empresa{min-width:0;width:auto;max-width:12rem}
.tabela.compacta td.empresa b{-webkit-line-clamp:1}
.filtros{flex-wrap:wrap}
.filtros button{white-space:nowrap}
.tabela.compacta th{padding:.55rem .7rem}
.tabela.compacta td{padding:.45rem .7rem}
.tabela .num small{color:var(--apagado);margin-left:.2rem}
.barra-tabela{display:inline-block;width:1.8rem;height:4px;border-radius:999px;background:var(--linha);vertical-align:middle;margin-right:.45rem;overflow:hidden}
.barra-tabela i{display:block;height:100%;background:#1a9cc4;border-radius:999px}
.motivos{list-style:none;margin:0 0 .6rem;padding:0;display:flex;flex-direction:column;gap:.5rem}
.motivos li{display:grid;grid-template-columns:minmax(0,1fr) 4.5rem 1.8rem;align-items:center;gap:.5rem;font-size:var(--t-md)}
.motivos .barra-tabela{width:100%;margin:0}
.motivos b{font:500 .85rem var(--mono);text-align:right;font-variant-numeric:tabular-nums}
.motivo-nome{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--suave)}
@media (max-width:1400px){
.tabela td,.tabela th{padding-left:.6rem;padding-right:.6rem}
.empresa{min-width:10.5rem}
.tabela td.empresa{width:auto}
.tabela form.form-crm{gap:.2rem}
button.botao-mini{padding:.38rem .55rem}
}
@media (max-height:760px) and (min-width:901px){
.barra-pagina{padding-top:.4rem;padding-bottom:.4rem}
.abas a{padding:.35rem .75rem}
.barra-pagina+main{height:calc(100vh - 2.55rem)}
main.cheio{gap:.5rem;padding:.7rem .9rem}
.kpi{padding:.5rem .8rem}
.kpi b{font-size:1.45rem}
.kpi .sub{font-size:.75rem}
.status{padding:.55rem .8rem;gap:.2rem}
.status strong{font-size:1rem}
.status .sub{font-size:.78rem}
.tela-dash{gap:.5rem}
.tela-dash .painel-bloco{padding:.55rem .75rem}
.funil-bloco{gap:.4rem}
.funil-bloco .legenda-linha li{padding:.2rem 0;font-size:.8rem}
.funil-bloco .legenda-linha b{font-size:1rem}
.pagina-topo{padding-bottom:.45rem;margin-bottom:.1rem}
.pagina-topo p{font-size:var(--t-sm)}
.tabela th{padding:.6rem .8rem}
.tabela td{padding:.5rem .8rem}
}
/* segunda revisão de 16/09: base local, atividades, etiquetas, valores, lista, arquivados e Ctrl+K */
[data-cor=ciano]{--c:var(--ciano)}
[data-cor=ambar]{--c:var(--ambar)}
[data-cor=lavanda]{--c:var(--lavanda)}
[data-cor=menta]{--c:var(--menta)}
[data-cor=rosa]{--c:var(--rosa)}
[data-cor=coral]{--c:var(--coral)}
.etiqueta-lead{display:inline-flex;align-items:center;max-width:100%;font:500 .75rem/1 var(--sans);padding:.22rem .42rem;border-radius:6px;color:var(--c);background:color-mix(in srgb,var(--c) 12%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 22%,transparent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-etiquetas{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.1rem}
/* Financeiro do lead, na ficha (17/09 à noite): valor de entrada e mensalidade à mostra e editáveis. */
.ficha-dinheiro{display:grid;grid-template-columns:1fr 1fr;gap:.55rem .6rem;align-items:end}
.ficha-dinheiro>label{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.ficha-dinheiro .campo-rotulo{font-size:.75rem;color:var(--suave)}
.campo-moeda{display:flex;align-items:center;gap:.3rem;padding:.4rem .55rem;border-radius:9px;border:1px solid var(--linha2);background:var(--sup2)}
.campo-moeda:focus-within{border-color:color-mix(in srgb,var(--ciano) 55%,var(--linha2))}
.campo-moeda:has(input:focus-visible){outline:2px solid var(--acento,var(--ciano));outline-offset:2px}
.campo-moeda i,.campo-moeda em{flex:none;font:500 .76rem/1 var(--sans);font-style:normal;color:var(--apagado)}
.campo-moeda input{flex:1;min-width:0;padding:0;border:0;background:none;color:var(--texto);font:500 .95rem/1.2 var(--mono);font-variant-numeric:tabular-nums}
.campo-moeda input:focus{outline:none}
.ficha-dinheiro>button{grid-column:1/-1;justify-self:start}
.card-rodape{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .45rem;margin-top:.2rem}
.card-proxima{display:inline-flex;align-items:center;gap:.25rem;font:500 .75rem/1 var(--sans);color:var(--suave);white-space:nowrap}
.card-proxima[data-situacao=vencido]{color:var(--coral)}
.card-proxima[data-situacao=hoje]{color:var(--ambar)}
.card-dias{font:500 .75rem/1 var(--sans);color:var(--apagado);white-space:nowrap;font-variant-numeric:tabular-nums}
.card-dias[data-parado]{color:var(--coral);padding:.18rem .35rem;border-radius:5px;background:color-mix(in srgb,var(--coral) 12%,transparent)}
.card-valor{margin-left:auto;font:500 .75rem/1 var(--sans);color:var(--texto);white-space:nowrap;font-variant-numeric:tabular-nums}
.soma-coluna{font:500 .75rem/1 var(--sans);color:var(--suave);white-space:nowrap;font-variant-numeric:tabular-nums}
.coluna.recolhida .soma-coluna{display:none}
.barra-ferramentas .botao-texto .ico{flex:none}
/* busca global (Ctrl+K) */
.abrir-comandos{display:flex;align-items:center;gap:.55rem;width:100%;padding:.5rem .7rem;border-radius:10px;background:var(--sup2);color:var(--suave);border:1px solid var(--linha);font:500 .85rem/1 var(--sans);cursor:pointer;justify-content:flex-start}
button.abrir-comandos:hover{background:var(--sup2);color:var(--texto);border-color:var(--linha2)}
.abrir-comandos span{flex:1;text-align:left}
kbd{font:500 .75rem/1 var(--sans);padding:.22rem .38rem;border-radius:5px;border:1px solid var(--linha2);color:var(--apagado);background:var(--sup)}
:root[data-lateral="1"] .abrir-comandos{justify-content:center;padding:.55rem}
:root[data-lateral="1"] .abrir-comandos span,:root[data-lateral="1"] .abrir-comandos kbd{display:none}
dialog.comandos{width:min(38rem,calc(100% - 2rem));max-height:min(32rem,80vh);margin:12vh auto auto;padding:0;border-radius:14px;border:1px solid var(--linha2);background:var(--sup);color:var(--texto);box-shadow:0 24px 64px -24px rgba(0,0,0,.9);overflow:hidden;overscroll-behavior:contain}
dialog.comandos[open]{display:flex;flex-direction:column}
dialog.comandos::backdrop{background:rgba(0,0,0,.5)}
.comandos-campo{display:flex;align-items:center;gap:.6rem;padding:.75rem .9rem;border-bottom:1px solid var(--linha);color:var(--suave)}
.comandos-campo input{flex:1;border:0;background:transparent;padding:.2rem 0;font-size:1rem;outline:none}
.comandos-campo input:focus-visible{outline:none}
/* 24/09: o campo não tem contorno próprio (é a faixa inteira), então o foco aparece como um traço na base da faixa */
.comandos-campo:focus-within{box-shadow:inset 0 -2px 0 var(--acento,var(--ciano));color:var(--texto)}
#comandos-lista{list-style:none;margin:0;padding:.35rem;overflow-y:auto;flex:1;min-height:0}
#comandos-lista li[role=option]{display:flex;flex-direction:column;gap:.15rem;padding:.5rem .65rem;border-radius:8px;cursor:pointer}
#comandos-lista li[role=option] b{font-weight:500;font-size:var(--t-md)}
#comandos-lista li[role=option] small{font-size:.75rem;color:var(--suave)}
#comandos-lista li[aria-selected=true]{background:color-mix(in srgb,var(--ciano) 10%,var(--sup2));box-shadow:inset 2px 0 0 var(--ciano)}
.comandos-grupo{font:500 .75rem/1 var(--sans);color:var(--apagado);padding:.6rem .65rem .3rem}
.comandos-vazio{padding:1rem .65rem;color:var(--suave);font-size:var(--t-sm)}
.comandos-dica{margin:0;padding:.5rem .9rem;border-top:1px solid var(--linha);font-size:.75rem;color:var(--apagado)}
/* diálogo de novo lead */
.dialogo.largo{width:min(34rem,calc(100% - 2rem))}
.form-novo-lead label,.ficha-form label{display:grid;gap:.25rem;font-size:.78rem;color:var(--suave)}
.form-novo-lead input,.form-novo-lead select{padding:.5rem .65rem;font-size:var(--t-md);background:var(--sup2);min-width:0}
.form-novo-lead .ficha-form-linha{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
/* ficha do lead (versão com atividades e edição) */
.ficha-titulo{min-width:0}
.ficha-titulo h2{font-size:var(--t-base);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ficha-titulo small{display:block;font-size:.75rem;color:var(--suave);margin-top:.1rem}
.ficha-resumo{display:flex;flex-wrap:wrap;gap:.3rem}
.ficha-chip{font:500 .75rem/1 var(--sans);padding:.3rem .5rem;border-radius:6px;background:var(--sup2);border:1px solid var(--linha);color:var(--suave);font-variant-numeric:tabular-nums}
.ficha-chip[data-tipo=valor]{color:var(--texto)}
.ficha-chip[data-parado]{color:var(--coral);border-color:color-mix(in srgb,var(--coral) 35%,var(--linha))}
.ficha-proxima{padding:.65rem .7rem;border-radius:10px;border:1px solid var(--linha);background:var(--sup2);display:flex;flex-direction:column;gap:.55rem}
.ficha-proxima[data-situacao=vencido]{border-color:color-mix(in srgb,var(--coral) 45%,var(--linha))}
.ficha-proxima[data-situacao=hoje]{border-color:color-mix(in srgb,var(--ambar) 45%,var(--linha))}
.ficha-proxima[data-situacao=sem]{border-style:dashed}
.ficha-proxima-topo{display:flex;align-items:flex-start;gap:.55rem}
.ficha-proxima-topo .ico{margin-top:.1rem;color:var(--suave)}
.ficha-proxima[data-situacao=vencido] .ficha-proxima-topo .ico{color:var(--coral)}
.ficha-proxima[data-situacao=hoje] .ficha-proxima-topo .ico{color:var(--ambar)}
.ficha-proxima-topo b{display:block;font-weight:500;font-size:var(--t-md)}
.ficha-proxima-topo small{display:block;font-size:.75rem;color:var(--suave)}
.ficha-proxima[data-situacao=vencido] small{color:var(--coral)}
.ficha-concluir{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:.35rem}
.ficha-concluir select{padding:.38rem .45rem;font-size:.76rem;min-width:0}
.atividades li{display:grid;grid-template-columns:auto 3.6rem minmax(0,1fr) auto;align-items:center;gap:.45rem;padding:.3rem .35rem .3rem .5rem;border-radius:8px;background:var(--sup2);border:1px solid var(--linha);font-size:var(--t-sm)}
.atividades time{font:500 .75rem var(--sans);color:var(--suave);white-space:nowrap}
.atividades li[data-situacao=vencido] time{color:var(--coral)}
.atividades li[data-situacao=hoje] time{color:var(--ambar)}
.atividades li[data-situacao=feito]{opacity:.55}
.atividades li[data-situacao=feito] span:not(.tipo-atividade){text-decoration:line-through}
.tipo-atividade{display:grid;place-items:center;color:var(--suave)}
.acoes-atividade{display:flex;gap:.1rem}
.acoes-atividade form{margin:0;display:block}
.atividades .icone{width:1.6rem;height:1.6rem}
.ficha-form select{padding:.45rem .5rem;font-size:var(--t-sm);background:var(--sup2);min-width:0}
input[type=time]{color-scheme:dark}
.ficha-editar{border:1px solid var(--linha);border-radius:10px;background:var(--sup)}
.ficha-editar>summary{display:flex;align-items:center;gap:.45rem;padding:.55rem .7rem;font-size:var(--t-sm);color:var(--suave);list-style:none}
.ficha-editar>summary::-webkit-details-marker{display:none}
.ficha-editar>summary:hover{color:var(--texto)}
.ficha-editar[open]>summary{border-bottom:1px solid var(--linha);color:var(--texto)}
.ficha-editar>form{padding:.7rem}
.ficha-editar .dica{font-size:.75rem;line-height:1.4}
.ficha-arquivar{padding:0 .7rem .7rem}
.ficha-arquivar button{gap:.35rem}
/* Pendências com grupos */
.lista-simples .grupo-lista{font:500 .75rem/1 var(--sans);color:var(--apagado);padding:.7rem .45rem .35rem}
.lista-simples .grupo-lista[data-situacao=vencido]{color:var(--coral)}
.lista-simples .grupo-lista[data-situacao=hoje]{color:var(--ambar)}
.lista-simples .grupo-lista:first-child{padding-top:.2rem}
.lista-simples .tipo-atividade{width:2.1rem;height:2.1rem;flex:none;border-radius:50%;background:var(--sup2);border:1px solid var(--linha)}
.lista-simples li[data-situacao=vencido] .tipo-atividade{color:var(--coral)}
.lista-simples li[data-situacao=hoje] .tipo-atividade{color:var(--ambar)}
.lista-simples .meta[data-parado]{color:var(--coral)}
/* visão em lista */
.filtros-lista{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:.45rem}
.filtros-lista input[type=search]{flex:1 1 16rem;min-width:10rem;padding:.5rem .75rem}
.filtros-lista>select{padding:.5rem .6rem;max-width:11rem;cursor:pointer}
.check-filtro{display:flex;align-items:center;gap:.35rem;font-size:var(--t-sm);color:var(--suave);white-space:nowrap;cursor:pointer}
.contador-lista{margin-left:auto;font:.75rem var(--sans);color:var(--apagado);white-space:nowrap}
.barra-lote{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .8rem;padding:.5rem .7rem;border-radius:10px;border:1px solid color-mix(in srgb,var(--ciano) 35%,var(--linha));background:color-mix(in srgb,var(--ciano) 6%,var(--sup))}
.barra-lote b{font-size:var(--t-sm);font-weight:600;white-space:nowrap}
.grupo-lote{display:flex;align-items:center;gap:.3rem}
.barra-lote select,.barra-lote input{padding:.36rem .5rem;font-size:.78rem;max-width:10rem;background:var(--sup2)}
.lista-leads .tabela td.sel,.lista-leads .tabela th.sel{width:2.2rem;padding-right:0}
.lista-leads input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--ciano);cursor:pointer}
.lista-leads .tabela td.empresa a{color:var(--texto)}
.lista-leads .tabela td.empresa a:hover{color:var(--ciano);text-decoration:none}
.lista-leads .tabela td.empresa small{display:block;font:.75rem var(--mono);color:var(--apagado)}
.lista-leads .tabela td{font-size:.8rem}
.lista-leads .tabela td.segmento{max-width:10rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lista-leads .tabela td.proxima{max-width:12rem}
.texto-proxima{display:block;font-size:.75rem;color:var(--apagado);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lista-leads tr.marcada td{background:color-mix(in srgb,var(--ciano) 6%,transparent)}
.lista-leads td .etiqueta-lead{margin:.1rem .2rem .1rem 0}
button.ordenar{padding:0;background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:.25rem}
button.ordenar:hover{background:none;color:var(--texto)}
th[aria-sort=ascending] button.ordenar::after{content:"↑"}
th[aria-sort=descending] button.ordenar::after{content:"↓"}
.vazio-filtro{padding:1rem;margin:0;font-size:var(--t-sm)}
button.botao-link{padding:0;background:none;border:0;color:var(--ciano);font:inherit;cursor:pointer}
button.botao-link:hover{background:none;text-decoration:underline}
.apagado{color:var(--apagado)}
main.cheio>.filtros-lista,main.cheio>.barra-lote{margin:0}
/* ajustes da barra do quadro com etiquetas e Novo lead (notebook) */
.coluna-titulo{flex:1;min-width:0;display:flex;flex-direction:column;gap:.15rem}
.coluna-titulo h2{flex:none}
/* 21/09: nome de etapa com palavra comprida ("Desenvolvimento") vazava por cima do contador. Agora hifeniza em
   portugues, quebra se o navegador nao souber hifenizar e fica em duas linhas no maximo; o nome inteiro esta no title. */
/* 24/09: sem quebrar no meio da palavra (overflow-wrap normal); hifeniza só entre sílabas, pelo dicionário pt-BR do
   navegador (a página é lang="pt-BR"); o que não couber em duas linhas termina em reticências, com o nome no title
   (lateral.js). */
.coluna-titulo h2{overflow-wrap:normal;word-break:normal;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:7 3 3;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;text-overflow:ellipsis}
.coluna.recolhida h2{display:block;-webkit-line-clamp:none;line-clamp:none}
.busca-quadro{flex:1 1 15rem;min-width:11rem}
@media (max-width:1450px){
.barra-ferramentas .atualizado{display:none}
}
.ficha-form-linha.tipo-texto{grid-template-columns:7.2rem minmax(0,1fr)}
.ficha-form-linha.data-hora{grid-template-columns:minmax(0,1fr) 6rem}
.ficha-concluir{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) auto}
.ficha-concluir select{font-size:.75rem;padding:.36rem .35rem}
.ficha-concluir button{padding:.36rem .6rem}
.data-atividade{font:500 .75rem var(--sans);color:var(--suave)}
li[data-situacao=vencido] .data-atividade{color:var(--coral)}
li[data-situacao=hoje] .data-atividade{color:var(--ambar)}
.lista-simples li.com-acao .linha-dupla b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lista-leads .tabela td.empresa{min-width:13rem;max-width:18rem}
.lista-leads .tabela td.empresa b{-webkit-line-clamp:1}
.lista-leads .tabela td.empresa small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lista-leads .tabela td.proxima{max-width:11rem}
.lista-leads .tabela th{padding-top:.55rem;padding-bottom:.55rem}
/* 16/09 noite: login, conta na lateral, Configurações, Mensagens, busca nova e modelos na conversa */
a.botao-texto{display:inline-flex;align-items:center;gap:.4rem;padding:.42rem .7rem;font:500 .8rem/1.1 var(--sans);border-radius:9px;background:var(--sup2);color:var(--texto);border:1px solid var(--linha2);transition:border-color var(--transicao),background-color var(--transicao)}
a.botao-texto:hover{text-decoration:none;border-color:color-mix(in srgb,var(--ciano) 45%,var(--linha2));background:var(--sup)}
.botao .ico,button .ico{flex:none}
.status[data-tom=neutro] strong{color:var(--texto)}
/* conta na lateral */
.lateral-conta{margin-top:auto;display:flex;align-items:center;gap:.25rem;padding:.55rem .35rem 0;border-top:1px solid var(--linha)}
.lateral-conta .conta{flex:1;min-width:0;display:flex;align-items:center;gap:.6rem;padding:.35rem .4rem;border-radius:10px;color:var(--texto)}
.lateral-conta .conta:hover{background:var(--sup2);text-decoration:none}
.lateral-conta .avatar{width:2rem;height:2rem;font-size:.75rem}
.conta-texto{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.conta-texto b{font-weight:500;font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conta-texto small{font:.75rem var(--sans);color:var(--apagado);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.form-sair{display:block;margin:0}
:root[data-lateral="1"] .lateral-conta{flex-direction:column;padding:.55rem 0 0}
:root[data-lateral="1"] .conta-texto{display:none}
:root[data-lateral="1"] .lateral-conta .conta{justify-content:center;padding:.3rem}
/* entrada no painel */
body.publica{min-height:100vh;background:var(--void)}
main.entrar{min-height:100vh;height:auto;padding:0;overflow:visible;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(22rem,1fr)}
.entrar-marca{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:2rem;padding:clamp(1.5rem,4vw,3.2rem);border-right:1px solid var(--linha);
background:radial-gradient(60rem 30rem at -10% -10%,color-mix(in srgb,var(--ciano) 14%,transparent),transparent 60%),radial-gradient(40rem 26rem at 110% 20%,color-mix(in srgb,var(--lavanda) 12%,transparent),transparent 60%),radial-gradient(40rem 30rem at 40% 120%,color-mix(in srgb,var(--ambar) 10%,transparent),transparent 60%),var(--sup)}
.entrar-marca::after{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--linha) 1px,transparent 1px),linear-gradient(90deg,var(--linha) 1px,transparent 1px);background-size:44px 44px;opacity:.18;-webkit-mask-image:radial-gradient(ellipse at 30% 40%,#000 20%,transparent 70%);mask-image:radial-gradient(ellipse at 30% 40%,#000 20%,transparent 70%);pointer-events:none}
.entrar-marca>*{position:relative;z-index:1}
.entrar-marca-topo{display:flex;align-items:center;gap:.8rem}
.entrar-marca-topo .tri i{height:26px;width:6px}
.entrar-marca-logo{width:2.3rem;height:2.25rem;border-radius:.6rem;object-fit:cover;box-shadow:var(--brilho),inset 0 0 0 1px var(--linha2)}
.entrar-marca-inicial{flex:none;width:2.3rem;height:2.25rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font:600 1.05rem var(--sans);color:var(--void)}
.entrar-frase{max-width:30rem}
.entrar-frase h2{font-size:clamp(1.6rem,2.6vw,2.3rem);line-height:1.15;letter-spacing:-.025em;font-weight:600;margin:0 0 1.4rem;text-wrap:balance}
.entrar-pontos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.7rem}
.entrar-pontos li{display:flex;align-items:center;gap:.7rem;color:var(--suave);font-size:.95rem}
.entrar-pontos .ico{flex:none;width:2rem;height:2rem;padding:.45rem;border-radius:9px;color:var(--ciano);background:color-mix(in srgb,var(--ciano) 10%,var(--sup2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ciano) 22%,transparent)}
.entrar-pontos li:nth-child(2) .ico{color:var(--ambar);background:color-mix(in srgb,var(--ambar) 10%,var(--sup2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ambar) 22%,transparent)}
.entrar-pontos li:nth-child(3) .ico{color:var(--lavanda);background:color-mix(in srgb,var(--lavanda) 10%,var(--sup2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lavanda) 22%,transparent)}
.entrar-rodape{margin:0;font:.75rem var(--sans);color:var(--apagado)}
.entrar-painel{display:grid;place-items:center;padding:2rem 1.25rem}
.entrar-caixa{width:min(24rem,100%);display:flex;flex-direction:column;gap:1.4rem}
.entrar-cabeca h1{font-size:1.45rem;margin:.9rem 0 .3rem}
.entrar-cabeca p{margin:0;font-size:.9rem}
.entrar-cadeado{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:12px;color:var(--ciano);background:var(--sup2);border:1px solid var(--linha2);box-shadow:var(--brilho)}
.entrar-form{gap:.95rem}
.entrar-form input:not([type=checkbox]){width:100%;padding:.72rem .85rem;background:var(--sup)}
.senha-campo{position:relative;display:block}
.senha-campo input{padding-right:2.8rem!important}
button.ver-senha{position:absolute;right:.35rem;top:50%;transform:translateY(-50%);width:2.1rem;height:2.1rem;padding:0;border-radius:8px;background:none;color:var(--apagado);border:0}
button.ver-senha:hover,button.ver-senha.ativo{background:var(--sup2);color:var(--texto)}
button.ver-senha:active{transform:translateY(-50%)}
.lembrar{display:flex;align-items:center;gap:.55rem;font-size:.84rem;color:var(--suave);cursor:pointer}
.lembrar input{width:1rem;height:1rem;accent-color:var(--ciano)}
button.entrar-botao{width:100%;padding:.8rem 1rem;font-size:.95rem;margin-top:.2rem}
.entrar-erro,.entrar-ok{display:flex;align-items:center;gap:.5rem;margin:0;padding:.6rem .75rem;border-radius:10px;font-size:.86rem}
.entrar-erro{color:var(--coral);background:color-mix(in srgb,var(--coral) 9%,transparent);border:1px solid color-mix(in srgb,var(--coral) 30%,transparent)}
.entrar-ok{color:var(--menta);background:color-mix(in srgb,var(--menta) 8%,transparent);border:1px solid color-mix(in srgb,var(--menta) 26%,transparent)}
.entrar-aviso{display:flex;gap:.75rem;padding:.9rem 1rem;border-radius:12px;border:1px solid color-mix(in srgb,var(--ambar) 35%,var(--linha));background:color-mix(in srgb,var(--ambar) 6%,var(--sup))}
.entrar-aviso .ico{color:var(--ambar);margin-top:.15rem}
.entrar-aviso b{display:block;margin-bottom:.3rem}
.entrar-aviso p{margin:.35rem 0;font-size:.85rem}
.entrar-aviso code{display:block;padding:.5rem .6rem;margin:.4rem 0;font-size:.75rem}
@media (max-width:860px){
main.entrar{grid-template-columns:1fr}
.entrar-marca{display:none}
}
/* telas de ajustes */
.ajustes{display:flex;flex-direction:column;gap:.75rem;max-width:74rem}
.ajuste-secao{display:grid;grid-template-columns:minmax(14rem,19rem) minmax(0,1fr);gap:1.25rem 2rem;padding:1.15rem 1.25rem;border-radius:14px;background:var(--sup);border:1px solid var(--linha);box-shadow:var(--brilho)}
.ajuste-cabeca{display:flex;align-items:flex-start;gap:.75rem;min-width:0}
.ajuste-cabeca h2{font-size:var(--t-base);margin:0 0 .3rem}
.ajuste-cabeca p{margin:0;font-size:.82rem;line-height:1.5}
.ajuste-icone{display:grid;place-items:center;flex:none;width:2.15rem;height:2.15rem;border-radius:10px;color:var(--suave);background:var(--sup2);border:1px solid var(--linha)}
.ajuste-campos{min-width:0;display:flex;flex-direction:column;gap:.95rem}
/* 17/09: bloco sem o texto lateral, para as telas em que a explicacao ao lado so ocupa espaco. */
.ajuste-secao.plena{grid-template-columns:minmax(0,1fr);gap:.9rem}
.abas-funil{margin:-.35rem 0 1rem}
.grade-campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.9rem 1rem}
.campo{display:flex;flex-direction:column;gap:.38rem;min-width:0;font-size:.85rem;color:var(--suave)}
.campo.largo{grid-column:1/-1}
.campo-rotulo{font-size:.8rem;font-weight:500;color:var(--texto)}
.campo-dica{font-size:.75rem;line-height:1.45;color:var(--apagado)}
.campo-dica code{font-size:.75rem}
.campo input:not([type=checkbox]):not([type=radio]),.campo select,.campo textarea{width:100%;padding:.55rem .7rem;background:var(--sup2);min-width:0}
/* 25/09 (achado do João, /admin › Nova empresa): sem a exceção acima, um `.check-filtro` dentro de um `.campo`
   (a lista de módulos) herdava o `width:100%` do campo de texto — a caixinha do checkbox esticava a linha toda
   e o texto ia parar na ponta direita. Cada `.check-filtro` continua uma linha própria (o `.campo` é coluna). */
.campo textarea{min-height:4.5rem;resize:vertical;line-height:1.45}
.campo select{cursor:pointer}
fieldset{border:0;margin:0;padding:0;min-width:0}
.par-campos{display:flex;align-items:center;gap:.5rem}
.par-campos input{flex:1;min-width:0}
.par-campos span{font-size:.8rem;color:var(--apagado)}
.interruptor{position:relative;display:flex;align-items:flex-start;gap:.8rem;padding:.7rem .8rem;border-radius:11px;background:var(--sup2);border:1px solid var(--linha);cursor:pointer;color:var(--texto);transition:border-color var(--transicao),background-color var(--transicao)}
.interruptor:hover{border-color:var(--linha2)}
.interruptor input{position:absolute;opacity:0;width:1px;height:1px}
.interruptor .trilho{position:relative;flex:none;width:2.4rem;height:1.4rem;margin-top:.05rem;border-radius:999px;background:var(--linha2);transition:background-color var(--transicao)}
.interruptor .trilho i{position:absolute;top:.2rem;left:.2rem;width:1rem;height:1rem;border-radius:50%;background:var(--suave);box-shadow:0 1px 2px rgba(0,0,0,.4);transition:transform var(--transicao),background-color var(--transicao)}
.interruptor input:checked+.trilho{background:color-mix(in srgb,var(--menta) 55%,var(--linha2))}
.interruptor input:checked+.trilho i{transform:translateX(1rem);background:#fff}
.interruptor input:focus-visible+.trilho{outline:2px solid var(--ciano);outline-offset:2px}
.interruptor-texto{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.interruptor-texto b{font-weight:500;font-size:.88rem}
.interruptor-texto small{font-size:.77rem;line-height:1.45;color:var(--suave)}
.interruptor[data-tom=alerta]:has(input:checked){border-color:color-mix(in srgb,var(--menta) 38%,var(--linha));background:color-mix(in srgb,var(--menta) 5%,var(--sup2))}
.barra-salvar{position:sticky;bottom:0;z-index:3;display:flex;align-items:center;justify-content:flex-end;gap:.75rem;max-width:74rem;margin-top:.75rem;padding:.65rem .75rem .65rem 1rem;border-radius:12px;background:rgba(21,22,26,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--linha)}
.barra-salvar-dica{margin-right:auto;font-size:.78rem;color:var(--apagado)}
.barra-salvar.pendente{border-color:color-mix(in srgb,var(--ambar) 45%,var(--linha))}
.barra-salvar.pendente .barra-salvar-dica{color:var(--ambar)}
.ajustes-form{display:block}
.faixas{display:flex;flex-direction:column;gap:.45rem;align-items:flex-start}
.linha-faixa{display:flex;align-items:center;gap:.5rem}
.linha-faixa input{width:7.2rem;padding:.45rem .6rem;background:var(--sup2)}
.linha-faixa span{font-size:.8rem;color:var(--apagado)}
.faixas .botao-texto,.segmentos .botao-texto{margin-top:.15rem}
.opcoes-cartao{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.6rem}
.opcoes-cartao legend{margin-bottom:.45rem}
.opcao-cartao{position:relative;display:flex;gap:.65rem;padding:.8rem .9rem;border-radius:11px;border:1px solid var(--linha);background:var(--sup2);cursor:pointer;transition:border-color var(--transicao),background-color var(--transicao)}
.opcao-cartao:hover{border-color:var(--linha2)}
.opcao-cartao input{margin:.2rem 0 0;accent-color:var(--ciano)}
.opcao-cartao:has(input:checked){border-color:color-mix(in srgb,var(--ciano) 50%,var(--linha));background:color-mix(in srgb,var(--ciano) 6%,var(--sup2))}
.opcao-corpo{display:flex;flex-direction:column;gap:.2rem}
.opcao-corpo b{font-weight:500;font-size:.88rem;color:var(--texto)}
.opcao-corpo small{font-size:.77rem;line-height:1.45;color:var(--suave)}
.segmentos{display:flex;flex-direction:column;gap:.4rem;align-items:stretch}
.linha-segmento{display:grid;grid-template-columns:minmax(10rem,.8fr) minmax(0,1.6fr) 2rem;gap:.45rem;align-items:center}
.linha-segmento input{padding:.45rem .6rem;background:var(--sup2);min-width:0;font-size:.84rem}
.linha-segmento.cabeca span{font:500 .75rem/1 var(--sans);color:var(--apagado);padding:.2rem 0}
.segmentos .botao-texto{align-self:flex-start}
.ajuste-detalhe{border:1px solid var(--linha);border-radius:11px;background:var(--sup2)}
.ajuste-detalhe>summary{display:flex;align-items:center;gap:.45rem;padding:.6rem .8rem;font-size:.84rem;color:var(--suave);list-style:none}
.ajuste-detalhe>summary::-webkit-details-marker{display:none}
.ajuste-detalhe>summary:hover{color:var(--texto)}
.ajuste-detalhe[open]>summary{border-bottom:1px solid var(--linha);color:var(--texto)}
.ajuste-detalhe>form{padding:.85rem}
.ajuste-form{display:flex;flex-direction:column;gap:.9rem}
.acoes-form{display:flex;flex-wrap:wrap;gap:.5rem}
.conta-cartao{display:flex;align-items:center;gap:.8rem;padding-bottom:.2rem}
.conta-cartao b{display:block;font-weight:600}
.conta-cartao small{font-size:.8rem;color:var(--suave)}
.avatar.grande{width:2.8rem;height:2.8rem;font-size:.9rem}
.lista-sessoes,.lista-pessoas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem}
.lista-sessoes li,.lista-pessoas li{display:flex;align-items:center;gap:.7rem;padding:.55rem .7rem;border-radius:10px;background:var(--sup2);border:1px solid var(--linha)}
.lista-sessoes li[data-atual]{border-color:color-mix(in srgb,var(--menta) 35%,var(--linha))}
.sessao-icone{display:grid;place-items:center;width:2rem;height:2rem;flex:none;border-radius:9px;color:var(--suave);background:var(--sup);border:1px solid var(--linha)}
.lista-sessoes .linha-dupla,.lista-pessoas .linha-dupla{flex:1}
.lista-pessoas form{margin:0 0 0 auto}
.lista.diagnostico{margin:0 0 .4rem}
.ajuste-campos>.botao{align-self:flex-start}
@media (max-width:1100px){
.ajuste-secao{grid-template-columns:1fr;gap:.9rem}
}
/* Mensagens: sequência automática */
.sequencia{display:flex;flex-direction:column;max-width:80rem}
.modo-atual{display:flex;align-items:center;gap:.6rem;padding:.65rem .85rem;margin-bottom:.9rem;border-radius:11px;background:var(--sup);border:1px solid var(--linha);font-size:.85rem;color:var(--suave)}
.modo-atual b{color:var(--texto);font-weight:500}
.modo-atual .ico{color:var(--ciano)}
.etapa-seq{position:relative;padding:1rem 1.1rem 1.1rem;border-radius:14px;background:var(--sup);border:1px solid var(--linha);box-shadow:var(--brilho)}
.etapa-cabeca{display:flex;align-items:center;gap:.85rem;margin-bottom:.9rem}
.etapa-cabeca h2{font-size:var(--t-base);margin:0}
.etapa-cabeca p{margin:.15rem 0 0;font-size:.8rem}
.etapa-cabeca .botao{margin-left:auto;white-space:nowrap}
.etapa-numero{display:grid;place-items:center;flex:none;width:2.1rem;height:2.1rem;border-radius:50%;font:600 .85rem/1 var(--sans);color:var(--ciano);background:color-mix(in srgb,var(--ciano) 12%,var(--sup2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ciano) 30%,transparent)}
.ligacao{position:relative;display:flex;align-items:center;min-height:3rem;padding-left:2.1rem}
.ligacao::before{content:"";position:absolute;left:2.1rem;top:0;bottom:0;border-left:2px dashed var(--linha2)}
.ligacao span{position:relative;margin-left:1.1rem;font:500 .75rem/1.3 var(--sans);color:var(--suave);padding:.35rem .6rem;border-radius:999px;background:var(--void);border:1px solid var(--linha)}
.alerta-etapa{display:flex;align-items:center;gap:.45rem;margin:0 0 .75rem;padding:.5rem .7rem;border-radius:9px;font-size:.8rem;color:var(--ambar);background:color-mix(in srgb,var(--ambar) 8%,transparent);border:1px solid color-mix(in srgb,var(--ambar) 28%,transparent)}
.modelos-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:.7rem;align-items:start}
.modelo{display:flex;flex-direction:column;min-width:0;border-radius:12px;background:var(--sup2);border:1px solid var(--linha);transition:border-color var(--transicao),opacity var(--transicao)}
.modelo:hover{border-color:var(--linha2)}
.modelo.pausado{opacity:.62}
.modelo.pausado:hover{opacity:.95}
.modelo-topo{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.6rem .75rem .45rem}
.modelo-titulo{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;min-width:0}
.modelo-titulo b{font-weight:500;font-size:.88rem}
.modelo-ordem{display:flex;gap:.1rem}
.modelo-ordem form{margin:0;display:block}
.modelo-ordem .icone{width:1.6rem;height:1.6rem}
.modelo-previa{position:relative;padding:.35rem .75rem .75rem;max-height:15rem;overflow:hidden}
.modelo-previa::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2rem;background:linear-gradient(transparent,var(--sup2));pointer-events:none}
.balao-wpp{position:relative;max-width:100%;padding:.55rem .7rem;border-radius:10px;border-top-left-radius:3px;font-size:.84rem;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--texto);background:color-mix(in srgb,var(--menta) 9%,var(--sup));border:1px solid color-mix(in srgb,var(--menta) 18%,var(--linha))}
.balao-wpp.saida{border-top-left-radius:10px;border-top-right-radius:3px;background:#144d37;border-color:#1c5e45}
.balao-wpp b{font-weight:600}
.balao-wpp code{font-size:.78rem;background:rgba(0,0,0,.25)}
.modelo-rodape{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.3rem .5rem;margin-top:auto;padding:.45rem .5rem .5rem .75rem;border-top:1px solid var(--linha)}
.modelo-acoes{margin-left:auto}
.modelo-acoes{display:flex;align-items:center;gap:.15rem}
.modelo-acoes form{margin:0;display:block}
.modelo-acoes .icone{width:1.9rem;height:1.9rem}
.modelo-acoes .botao-texto{margin-right:.2rem;padding:.34rem .55rem}
.taxa{display:inline-flex;align-items:baseline;gap:.3rem;font-size:.76rem;color:var(--suave);white-space:nowrap}
.taxa b{font:600 .95rem/1 var(--mono);color:var(--texto);font-variant-numeric:tabular-nums}
.taxa small{font:.75rem var(--sans);color:var(--apagado)}
.taxa[data-tom=boa] b{color:var(--menta)}
.taxa[data-tom=fraca] b{color:var(--coral)}
.taxa[data-vazia]{color:var(--apagado);font-style:italic}
.reserva{margin-top:1.2rem;background:transparent}
.reserva-corpo{display:flex;flex-direction:column;gap:.7rem;padding:.85rem}
.reserva .etapa-seq{background:var(--sup2)}
.reserva .modelo{background:var(--sup)}
.rodape-seq{margin:1rem 0 .5rem;max-width:70ch}
.barra-modelos{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.barra-modelos input[type=search]{flex:0 1 20rem;padding:.5rem .75rem}
.modelos-grade.soltos{grid-template-columns:repeat(auto-fill,minmax(20rem,1fr))}
/* editor de mensagem */
.editor{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(19rem,.75fr);gap:1rem;align-items:start;max-width:80rem}
.editor-form{display:flex;flex-direction:column;gap:1rem;padding:1.1rem 1.2rem;border-radius:14px;background:var(--sup);border:1px solid var(--linha);box-shadow:var(--brilho)}
.editor-form textarea{min-height:15rem;font-size:.92rem;border-top-left-radius:0;border-top-right-radius:0}
.editor-ferramentas{display:flex;align-items:center;gap:.2rem;padding:.3rem .4rem;border:1px solid var(--linha);border-bottom:0;border-radius:10px 10px 0 0;background:var(--sup2)}
.editor-ferramentas button{width:2rem;height:1.9rem;padding:0;border-radius:7px;background:none;color:var(--suave);font:600 .85rem var(--sans);border:0}
.editor-ferramentas button:hover{background:var(--sup);color:var(--texto)}
.editor-ferramentas .separador{flex:1}
.editor .campo textarea{border-top-left-radius:0;border-top-right-radius:0}
.contador{font:.75rem var(--sans);color:var(--apagado);padding-right:.3rem}
.contador[data-longa="1"]{color:var(--ambar)}
#aviso-variavel{color:var(--coral)}
.variaveis{display:flex;flex-direction:column;gap:.45rem}
.fichas-variaveis{display:flex;flex-wrap:wrap;gap:.35rem}
button.ficha-variavel{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .55rem;border-radius:8px;background:var(--sup2);color:var(--suave);border:1px solid var(--linha);font:400 .76rem/1.2 var(--sans)}
button.ficha-variavel:hover{background:var(--sup);color:var(--texto);border-color:color-mix(in srgb,var(--ciano) 40%,var(--linha))}
.ficha-variavel code{background:none;padding:0;color:var(--ciano);font-size:.75rem}
.editor-form .barra-salvar{position:static;margin:0;padding:0;border:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.editor-previa{position:sticky;top:0;display:flex;flex-direction:column;gap:.6rem}
.celular{border-radius:22px;padding:.5rem;background:#0b0b0c;border:1px solid var(--linha2);box-shadow:0 30px 60px -30px rgba(0,0,0,.9),var(--brilho)}
.celular-topo{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;border-radius:15px 15px 0 0;background:#1f2c34}
.celular-topo b{display:block;font-weight:500;font-size:.88rem;color:#e9edef}
.celular-topo small{display:block;font-size:.75rem;color:#8696a0}
.celular-conversa{display:flex;flex-direction:column;align-items:flex-end;min-height:22rem;max-height:60vh;overflow-y:auto;padding:1rem .8rem;border-radius:0 0 15px 15px;background:#0b141a radial-gradient(circle at 20% 20%,rgba(255,255,255,.03) 1px,transparent 1px) 0 0/18px 18px}
.celular-conversa .balao-wpp{max-width:88%;font-size:.86rem;color:#e9edef}
@media (max-width:1100px){
.editor{grid-template-columns:1fr}
.editor-previa{position:static}
}
/* modelos na conversa */
.compositor-extras.rapidas{display:block;padding:0;overflow:hidden}
.modelos-topo{display:flex;align-items:center;gap:.6rem;padding:.45rem .5rem;border-bottom:1px solid var(--linha)}
.modelos-topo input{flex:1;padding:.42rem .65rem;font-size:.84rem;background:var(--sup)}
.modelos-topo .botao-link{font-size:.78rem;white-space:nowrap}
.modelos-lista{max-height:16rem;overflow-y:auto;padding:.3rem;display:flex;flex-direction:column;gap:.1rem}
.grupo-modelos{font:500 .75rem/1 var(--sans);color:var(--apagado);padding:.55rem .5rem .3rem}
.compositor-extras.rapidas button.item-modelo{display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;width:100%;padding:.45rem .55rem;border:0;border-radius:8px;text-align:left;font-size:.82rem;background:none}
.compositor-extras.rapidas button.item-modelo:hover,.compositor-extras.rapidas button.item-modelo:focus-visible{background:var(--sup)}
.item-modelo b{font-weight:500;color:var(--texto)}
.item-modelo span{font-weight:400;font-size:.76rem;color:var(--suave);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
/* busca nova */
form.busca-nova{display:flex;flex-direction:column;gap:.7rem;flex:none;padding:.9rem 1rem}
.busca-campos{display:grid;grid-template-columns:minmax(12rem,.9fr) minmax(14rem,1.2fr) minmax(16rem,1.5fr) auto;gap:.8rem;align-items:start}
.busca-campos>button{margin-top:1.45rem;padding:.62rem 1.15rem;white-space:nowrap}
.cidades-campo{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;min-height:2.45rem;padding:.25rem .35rem;border-radius:10px;border:1px solid var(--linha);background:var(--sup2);cursor:text}
.cidades-campo:focus-within{border-color:color-mix(in srgb,var(--ciano) 55%,var(--linha))}
.chips-cidades{display:contents}
.campo .cidades-campo input{flex:1;width:auto;min-width:7rem;border:0;background:none;padding:.3rem .35rem;outline:none}
.ficha-cidade{display:inline-flex;align-items:center;gap:.2rem;padding:.2rem .2rem .2rem .55rem;border-radius:999px;font-size:.8rem;color:var(--texto);background:color-mix(in srgb,var(--ciano) 12%,var(--sup));border:1px solid color-mix(in srgb,var(--ciano) 28%,var(--linha))}
.ficha-cidade button{width:1.25rem;height:1.25rem;padding:0;border-radius:50%;background:none;color:var(--suave);font:400 .95rem/1 var(--sans);border:0}
.ficha-cidade button:hover{background:color-mix(in srgb,var(--coral) 20%,transparent);color:var(--texto)}
.busca-rodape{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:.5rem 1rem}
.estimativa{margin:0;font-size:.8rem;color:var(--suave);padding-top:.3rem}
.fonte-busca{display:flex;gap:.25rem;padding:.2rem;border-radius:10px;background:var(--sup2);border:1px solid var(--linha)}
.fonte-busca label{position:relative;cursor:pointer}
.fonte-busca input{position:absolute;opacity:0;width:1px;height:1px}
.fonte-busca span{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .65rem;border-radius:8px;font-size:.78rem;color:var(--suave);white-space:nowrap}
.fonte-busca input:checked+span{background:var(--sup);color:var(--texto);box-shadow:inset 0 0 0 1px var(--linha2)}
.fonte-busca input:focus-visible+span{outline:2px solid var(--ciano);outline-offset:1px}
.estimativa .conhecidos{color:var(--menta)}
.estimativa[data-tom=erro]{color:var(--coral)}
.filtros-busca{position:relative}
.filtros-busca>summary{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--suave);padding:.35rem .7rem;border:1px solid var(--linha);border-radius:999px;list-style:none;background:var(--sup2)}
.filtros-busca>summary::-webkit-details-marker{display:none}
.filtros-busca>summary:hover,.filtros-busca[open]>summary{color:var(--texto);border-color:var(--linha2)}
.filtros-busca-corpo{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.6rem 1.1rem;margin-top:.6rem;padding:.7rem .8rem;border-radius:10px;border:1px solid var(--linha);background:var(--sup2)}
.filtros-busca-corpo .campo{flex:0 0 11rem}
.filtros-busca-corpo .check-filtro{padding-bottom:.55rem}
.filtros-busca-corpo .botao-link{font-size:.78rem;padding-bottom:.6rem}
.tabela-buscas .cidades-celula{max-width:14rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tabela-buscas td small{font-size:.75rem}
.tabela b.num{font:500 .95rem var(--mono)}
.progresso-mini{display:flex;flex-direction:column;gap:.25rem;min-width:8rem}
.progresso-mini .barra{margin:0}
.progresso-mini small{font:.75rem var(--sans);color:var(--suave)}
.andamento{display:flex;flex-direction:column;gap:.8rem;max-width:52rem;padding:1.1rem 1.2rem}
.andamento-topo{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .7rem}
.andamento-topo b{font-weight:600}
.ponto-vivo{--t:var(--ciano);width:.6rem;height:.6rem;border-radius:50%;background:var(--ciano);box-shadow:0 0 0 4px color-mix(in srgb,var(--ciano) 20%,transparent)}
@media (prefers-reduced-motion:no-preference){
.ponto-vivo{animation:pulso 1.8s ease-in-out infinite}
.barra.grande span{transition:width .6s ease}
}
.barra.grande{height:8px}
.andamento-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3rem}
.andamento-lista li{display:flex;justify-content:space-between;gap:1rem;padding:.45rem .65rem;border-radius:9px;background:var(--sup2);border:1px solid var(--linha);font-size:.85rem}
.andamento-lista small{color:var(--apagado);font-size:.76rem;text-align:right}
.tabela-resultados td.sel,.tabela-resultados th.sel{width:2.2rem;padding-right:0}
.tabela-resultados input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--ciano);cursor:pointer}
.tabela-resultados tr.marcada td{background:color-mix(in srgb,var(--ciano) 6%,transparent)}
.chip[data-cache]{color:var(--lavanda);border-color:color-mix(in srgb,var(--lavanda) 30%,var(--linha))}
@media (max-width:1250px){
.busca-campos{grid-template-columns:1fr 1fr}
.busca-campos>button{margin-top:0;justify-self:start}
}
@media (max-width:700px){
.busca-campos{grid-template-columns:1fr}
}
.linha-dupla-celula{white-space:nowrap}
.linha-dupla-celula small{display:block;font-size:.75rem;color:var(--apagado)}
.tabela-buscas td.empresa{width:auto;min-width:12rem;max-width:22rem}
.tabela-buscas td.empresa b{-webkit-line-clamp:1}
.tabela-buscas td.empresa small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:22rem}
a.botao{display:inline-flex;align-items:center;justify-content:center;gap:.45rem}
.resumo-busca .status{padding:.55rem .8rem;gap:.15rem}
.resumo-busca .status strong{font-size:1rem}
.resumo-busca .status .sub{font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
main.cheio>.resumo-busca,main.cheio>.filtros-lista{flex:none;margin:0}
.botao-icone:hover,button.botao-icone:hover{background:var(--sup);color:var(--texto)}
button.icone:hover{background:var(--sup2)}
/* 17/09: quadro e lista escaláveis (busca no servidor, limite de cards e paginação) */
.mais-cards{display:flex;align-items:center;justify-content:center;gap:.35rem;margin:.2rem 0 .1rem;padding:.5rem;border-radius:9px;border:1px dashed var(--linha2);color:var(--suave);font-size:.78rem}
.mais-cards:hover{text-decoration:none;color:var(--texto);border-color:color-mix(in srgb,var(--c) 50%,var(--linha2))}
form.busca-quadro{display:flex;align-items:center;gap:.4rem;margin:0}
.limpar-filtro{display:inline-flex;align-items:center;gap:.3rem;padding:.42rem .55rem;border-radius:9px;color:var(--suave);font-size:.78rem;border:1px solid var(--linha);white-space:nowrap}
.limpar-filtro:hover{text-decoration:none;color:var(--texto);border-color:var(--linha2)}
form.filtros-lista{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;margin:0}
.paginacao{flex:none;display:flex;align-items:center;justify-content:flex-end;gap:.5rem;font:.76rem var(--sans);color:var(--suave)}
.paginacao span{margin-right:auto}
#selecionar-filtro{font-size:.8rem}
/* 17/09: vários espaços, papéis, planos, administração e primeiros passos */
.ficha-lgpd{display:flex;flex-direction:column;gap:.35rem;margin-top:.8rem;padding-top:.7rem;border-top:1px dashed var(--linha2)}
.ficha-lgpd b{font-size:.78rem;font-weight:500}
.ficha-lgpd form{margin:0}
button.botao-mini.perigo{background:color-mix(in srgb,var(--coral) 14%,var(--sup2));color:var(--coral);border:1px solid color-mix(in srgb,var(--coral) 38%,var(--linha2))}
.botao-assistido{color:#25d366}
.botao-assistido:hover{border-color:color-mix(in srgb,#25d366 45%,var(--linha))}
.compositor[data-modo=assistido] button.botao-enviar{background:#25d366;color:#04210f}
.pill[data-tom=erro]{--c:var(--coral)}
.pill[data-tom=alerta]{--c:var(--ambar)}
button.perigo{background:color-mix(in srgb,var(--coral) 16%,var(--sup2));color:var(--coral);border:1px solid color-mix(in srgb,var(--coral) 40%,var(--linha2))}
button.perigo:hover{background:color-mix(in srgb,var(--coral) 24%,var(--sup2));filter:none}
.menu-conta{position:relative;flex:1;min-width:0}
.menu-conta>summary{list-style:none;cursor:pointer}
.menu-conta>summary::-webkit-details-marker{display:none}
.menu-conta>summary>.ico{flex:none;margin-left:auto;color:var(--apagado);transition:transform var(--transicao)}
.menu-conta:not([open])>summary>.ico{transform:rotate(180deg)}
.menu-conta[open]>summary{background:var(--sup2)}
.menu-conta-painel{position:absolute;left:0;bottom:calc(100% + .5rem);z-index:40;width:16.5rem;display:flex;flex-direction:column;gap:.15rem;padding:.45rem;border-radius:12px;background:var(--sup2);border:1px solid var(--linha2);box-shadow:var(--sombra)}
.menu-conta-painel .olho{padding:.35rem .5rem .2rem}
.menu-conta-painel>a,.menu-conta-painel>form>button{display:flex;align-items:center;justify-content:flex-start;gap:.6rem;width:100%;padding:.5rem .55rem;border-radius:8px;font:500 .84rem var(--sans);color:var(--texto);background:none;border:0;text-align:left}
.menu-conta-painel>a:hover,.menu-conta-painel>form>button:hover{background:var(--sup);text-decoration:none;filter:none}
.menu-conta-painel>a .ico,.menu-conta-painel>form>button .ico{color:var(--suave)}
.menu-conta-painel form{margin:0}
.menu-espacos{display:flex;flex-direction:column;gap:.1rem;max-height:14rem;overflow-y:auto;padding-bottom:.3rem;margin-bottom:.2rem;border-bottom:1px solid var(--linha)}
button.espaco-item{display:flex;align-items:center;justify-content:flex-start;gap:.55rem;width:100%;padding:.4rem .5rem;border-radius:8px;background:none;border:0;color:var(--texto);text-align:left;font-weight:400}
button.espaco-item:hover{background:var(--sup);filter:none}
button.espaco-item[aria-current=true]{background:color-mix(in srgb,var(--ciano) 8%,transparent)}
button.espaco-item .linha-dupla{flex:1}
button.espaco-item .linha-dupla b{font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
button.espaco-item .ico{color:var(--ciano)}
.menu-conta-nota{display:flex;align-items:center;gap:.4rem;margin:.1rem .5rem .35rem;font-size:.75rem;color:var(--lavanda)}
:root[data-lateral="1"] .menu-conta>summary>.ico{display:none}
.faixa-espaco{--c:var(--ciano);flex:none;display:flex;align-items:center;gap:.55rem;padding:.42rem clamp(1rem,2.5vw,2rem);font-size:.8rem;color:var(--texto);background:color-mix(in srgb,var(--c) 9%,var(--void));border-bottom:1px solid color-mix(in srgb,var(--c) 26%,var(--linha))}
.faixa-espaco[data-tom=ambar]{--c:var(--ambar)}
.faixa-espaco[data-tom=lavanda]{--c:var(--lavanda)}
.faixa-espaco .ico{flex:none;color:var(--c)}
.faixa-espaco span{min-width:0}
.faixa-espaco a{margin-left:auto;white-space:nowrap;color:var(--c);font-weight:500}
/* 25/09 (Gartner Desk): a faixa do suporte na instalação de clientes tem dois links, juntos à direita. */
.faixa-espaco .faixa-links{margin-left:auto;display:flex;gap:1rem;white-space:nowrap}
.faixa-espaco .faixa-links a{margin-left:0}
.area:has(>.faixa-espaco){height:100vh;overflow:hidden}
.area:has(>.faixa-espaco)>main{height:auto;flex:1;min-height:0}
.faixa-plano{display:flex;gap:.75rem;padding:.85rem 1rem;border-radius:12px;border:1px solid color-mix(in srgb,var(--c) 35%,var(--linha));background:color-mix(in srgb,var(--c) 6%,var(--sup))}
.faixa-plano[data-tom=info]{--c:var(--ciano)}
.faixa-plano[data-tom=alerta]{--c:var(--ambar)}
.faixa-plano[data-tom=erro]{--c:var(--coral)}
.faixa-plano .ico{flex:none;color:var(--c);margin-top:.1rem}
.faixa-plano p{margin:.2rem 0 0;font-size:.84rem}
.plano-atual{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.5rem}
.plano-atual>div{display:flex;flex-direction:column;gap:.3rem}
.plano-atual>div>b{font-size:1.35rem;font-weight:600;letter-spacing:-.02em}
.uso-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.6rem}
.uso-linha{--c:var(--menta);display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:.35rem .6rem;padding:.7rem .8rem;border-radius:11px;background:var(--sup2);border:1px solid var(--linha)}
.uso-linha[data-tom=alerta]{--c:var(--ambar)}
.uso-linha[data-tom=erro]{--c:var(--coral)}
.uso-rotulo{font-size:.8rem;color:var(--suave)}
.uso-linha>b{font:500 .95rem var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.uso-linha>b small,.uso-linha>small{font:.75rem var(--sans);color:var(--apagado)}
.uso-barra{grid-column:1/-1;height:.35rem;border-radius:999px;background:var(--linha);overflow:hidden}
.uso-barra i{display:block;height:100%;border-radius:inherit;background:var(--c)}
.planos-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(14.5rem,1fr));gap:.7rem}
.plano-cartao{display:flex;flex-direction:column;gap:.8rem;padding:1rem 1.05rem;border-radius:13px;background:var(--sup2);border:1px solid var(--linha)}
.plano-cartao.atual{border-color:color-mix(in srgb,var(--ciano) 45%,var(--linha));box-shadow:0 0 0 3px color-mix(in srgb,var(--ciano) 10%,transparent)}
.plano-cartao header b{font-size:1rem}
.plano-cartao header p{margin:.2rem 0 0;font-size:.8rem}
.plano-preco{display:flex;align-items:baseline;gap:.2rem}
.plano-preco span,.plano-preco small{font:.8rem var(--sans);color:var(--suave)}
.plano-preco b{font:600 1.9rem/1 var(--sans);letter-spacing:-.03em}
.plano-cartao ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem;font-size:.82rem;color:var(--suave)}
.plano-cartao li{display:flex;align-items:flex-start;gap:.45rem}
.plano-cartao li .ico{flex:none;margin-top:.15rem;color:var(--menta)}
.plano-cartao footer{margin-top:auto}
.plano-cartao footer .botao{display:flex;justify-content:center}
.membro-acoes{display:flex;align-items:center;gap:.3rem;margin-left:auto}
.lista-pessoas .membro-acoes form{margin:0}
.form-papel select{padding:.35rem .55rem;font-size:.8rem;background:var(--sup)}
.link-gerado{display:flex;flex-direction:column;gap:.35rem;padding:.9rem 1rem;border-radius:12px;border:1px solid color-mix(in srgb,var(--menta) 35%,var(--linha));background:color-mix(in srgb,var(--menta) 6%,var(--sup))}
.copiar-linha{display:flex;gap:.45rem;margin-top:.2rem}
.copiar-linha input{flex:1;min-width:0;font:.8rem var(--mono);background:var(--sup2)}
.lista-papeis{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:.5rem}
.lista-papeis li{display:flex;flex-direction:column;gap:.2rem;padding:.65rem .75rem;border-radius:10px;background:var(--sup2);border:1px solid var(--linha)}
.lista-papeis li span{font-size:.8rem;color:var(--suave)}
.tabela-auditoria{max-height:20rem;border-radius:10px;border:1px solid var(--linha)}
.tabela-auditoria .tabela{font-size:.8rem}
.tabela-auditoria td{padding:.45rem .7rem;border-top:1px solid var(--linha);vertical-align:top}
.tabela-auditoria .mono{font:.75rem var(--mono);color:var(--apagado);white-space:nowrap}
.forca-senha{display:grid;grid-template-columns:repeat(4,1fr) auto;align-items:center;gap:.25rem;margin-top:.1rem}
.forca-senha i{height:.22rem;border-radius:999px;background:var(--linha2);transition:background-color var(--transicao)}
.forca-senha span{min-width:4.5rem;text-align:right;font:.75rem var(--sans);color:var(--apagado)}
.forca-senha[data-nivel="1"] i:nth-child(-n+1){background:var(--coral)}
.forca-senha[data-nivel="2"] i:nth-child(-n+2){background:var(--ambar)}
.forca-senha[data-nivel="3"] i:nth-child(-n+3){background:var(--ciano)}
.forca-senha[data-nivel="4"] i{background:var(--menta)}
.entrar-linha{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap}
.entrar-link{font-size:.82rem}
.botao-google{display:flex;align-items:center;justify-content:center;gap:.65rem;width:100%;padding:.72rem 1rem;border-radius:10px;background:#fff;color:#1f1f1f;font:500 .92rem var(--sans);border:1px solid #dadce0;transition:background-color var(--transicao)}
.botao-google:hover{background:#f2f2f2;text-decoration:none}
.entrar-divisor{display:flex;align-items:center;gap:.7rem;margin:0;font:.75rem var(--sans);color:var(--apagado)}
.entrar-divisor::before,.entrar-divisor::after{content:"";flex:1;border-top:1px solid var(--linha)}
.entrar-rodape-form{margin:0;text-align:center;font-size:.84rem;color:var(--suave)}
.entrar-form .grade-2{display:grid;grid-template-columns:1fr 1fr;gap:.95rem}
@media (max-width:480px){.entrar-form .grade-2{grid-template-columns:1fr}}
.primeiros-passos{flex:none;padding:.85rem 1rem;border-radius:14px;background:var(--sup);border:1px solid var(--linha);box-shadow:var(--brilho)}
.primeiros-passos header{display:flex;align-items:center;gap:1rem;margin-bottom:.7rem}
.primeiros-passos h2{margin:.15rem 0 0;font-size:var(--t-base)}
.primeiros-passos header form{margin:0}
.passos-barra{flex:0 1 12rem;margin-left:auto;height:.35rem;border-radius:999px;background:var(--linha);overflow:hidden}
.passos-barra i{display:block;height:100%;border-radius:inherit;background:var(--menta)}
.primeiros-passos ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:.5rem}
.primeiros-passos li a{display:flex;align-items:center;gap:.55rem;height:100%;padding:.5rem .6rem;border-radius:11px;background:var(--sup2);border:1px solid var(--linha);color:var(--texto);transition:border-color var(--transicao)}
.primeiros-passos li a:hover{text-decoration:none;border-color:color-mix(in srgb,var(--ciano) 45%,var(--linha2))}
.primeiros-passos li a>.ico{flex:none;margin-left:auto;color:var(--apagado)}
.primeiros-passos .linha-dupla b{font-size:.84rem}
.primeiros-passos .linha-dupla small{white-space:normal;font-size:.75rem;line-height:1.35}
.primeiros-passos li a>.ico{display:none}
.passo-marca{display:grid;place-items:center;flex:none;width:1.7rem;height:1.7rem;border-radius:50%;font:600 .75rem/1 var(--sans);color:var(--ciano);background:color-mix(in srgb,var(--ciano) 12%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ciano) 30%,transparent)}
.primeiros-passos li[data-feito] a{opacity:.6}
.primeiros-passos li[data-feito] .passo-marca{color:var(--menta);background:color-mix(in srgb,var(--menta) 12%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--menta) 30%,transparent)}
.primeiros-passos li[data-feito] b{text-decoration:line-through;text-decoration-color:var(--apagado)}
.kpis-admin{grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr))}
.kpis-admin .kpi b{font:600 1.35rem/1.2 var(--sans)}
.tabela-admin td:first-child{min-width:12rem}
.tabela-admin td:not(:first-child){white-space:nowrap}
.bloco-admin{display:flex;flex-direction:column;gap:.6rem;padding:.75rem .85rem}
.topo-admin{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.topo-admin input{width:min(20rem,100%);padding:.45rem .7rem;font-size:.85rem}
.bloco-admin .tabela td,.bloco-admin .tabela th{padding:.5rem .55rem}
.bloco-admin .tabela td{border-top:1px solid var(--linha);vertical-align:middle}
.bloco-admin .tabela-rolagem{overflow:visible}
.menu-acoes{position:relative}
.menu-acoes>summary{list-style:none;display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .65rem;border-radius:9px;font-size:.8rem;cursor:pointer;border:1px solid var(--linha2)}
.menu-acoes>summary::-webkit-details-marker{display:none}
.menu-acoes-painel{position:absolute;right:0;top:calc(100% + .35rem);z-index:20;width:17rem;display:flex;flex-direction:column;gap:.6rem;padding:.8rem;border-radius:12px;background:var(--sup2);border:1px solid var(--linha2);box-shadow:var(--sombra)}
.menu-acoes-painel input,.menu-acoes-painel select{background:var(--sup)}
.acoes-linha form button.botao-sec{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .65rem;font-size:.8rem}
.sem-espaco-form{max-width:26rem}
.sem-espaco-form button{align-self:flex-start}
main.legal{min-height:100vh;display:flex;justify-content:center;padding:clamp(1.5rem,5vw,4rem) 1rem}
main.legal article{width:min(44rem,100%)}
main.legal h1{font-size:clamp(1.6rem,3vw,2.1rem);letter-spacing:-.02em;margin:.4rem 0 .6rem}
main.legal h2{font-size:1rem;margin:1.6rem 0 .4rem}
main.legal p{color:var(--suave);line-height:1.65;margin:0}
main.legal .voltar{display:inline-block;margin-bottom:1.2rem;font-size:.85rem}
.legal-rascunho{display:inline-block;padding:.35rem .6rem;border-radius:8px;font-size:.8rem;color:var(--ambar)!important;background:color-mix(in srgb,var(--ambar) 8%,transparent);border:1px solid color-mix(in srgb,var(--ambar) 28%,transparent)}
.legal-rodape{margin-top:2.2rem!important;padding-top:1rem;border-top:1px solid var(--linha);font-size:.84rem}
/* 17/09: tela WhatsApp */
.whatsapp-tela{--c:var(--ciano);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.25rem 2rem;padding:1.2rem 1.35rem;border-radius:14px;background:var(--sup);border:1px solid color-mix(in srgb,var(--c) 28%,var(--linha));box-shadow:var(--brilho)}
.whatsapp-tela[data-tom=ok]{--c:var(--menta)}
.whatsapp-tela[data-tom=erro]{--c:var(--coral)}
.whatsapp-estado{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.2rem 1rem;align-items:start;flex:1 1 20rem}
.whatsapp-icone{grid-row:span 2;display:grid;place-items:center;width:3rem;height:3rem;border-radius:14px;color:var(--c);background:color-mix(in srgb,var(--c) 12%,var(--sup2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 30%,transparent)}
.whatsapp-estado h2{margin:.1rem 0 .15rem;font-size:1.05rem}
.whatsapp-estado p{margin:0;font-size:.86rem}
.whatsapp-passos{grid-column:2;margin:.7rem 0 0;padding-left:1.1rem;display:flex;flex-direction:column;gap:.4rem;font-size:.86rem;color:var(--suave)}
.whatsapp-passos b{color:var(--texto);font-weight:500}
.whatsapp-qr{flex:none;border-radius:12px;background:#fff;padding:.6rem;box-shadow:0 0 0 1px var(--linha2)}
.dicas-whatsapp li{line-height:1.5}

/* ================================================================ 22/09 — revisão Gartner
   Pedido do João: menos ícones soltos, sub-abas na lateral, a identidade da Gartner e mais cor.
   A lateral virou seções (Vendas, Site, Negócio), cada uma com a sua cor do trio pastel; as sub-abas abrem
   embaixo do item aberto; o G de três fitas e a faixa sunset do site assinam o sistema. */
::selection{background:var(--lavanda);color:var(--void)}
input,textarea,select{caret-color:var(--ciano)}
a{text-underline-offset:3px}
.lateral{position:sticky;gap:1rem;padding:1rem .75rem .85rem;background:var(--void);overflow:hidden}
.lateral::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--sunset);opacity:.85}
.lateral .marca{padding:.15rem .35rem;gap:.6rem}
.marca-g{width:1.85rem;height:1.8rem;flex:none}
/* 25/09 (Gartner Desk): a marca da lateral na instalação de clientes — o logo da clínica ou a inicial dela, no
   lugar do G, com o mesmo tamanho. */
.marca-logo{width:1.85rem;height:1.8rem;flex:none;border-radius:.5rem;object-fit:cover;box-shadow:var(--brilho),inset 0 0 0 1px var(--linha2)}
.marca-inicial{flex:none;width:1.85rem;height:1.8rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font:600 .95rem var(--sans);color:var(--void)}
.marca-texto{flex-direction:row;align-items:center;gap:.45rem}
.marca-texto b{font-size:1.08rem;font-weight:600;letter-spacing:-.02em}
.marca-sub{font:600 .75rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--void);background:var(--sunset);padding:.26rem .42rem .22rem;border-radius:999px}
.nav-principal{flex:1;min-height:0;gap:0;overflow-y:auto;overflow-x:hidden;margin:0 -.3rem;padding:0 .3rem;scrollbar-width:none}
.nav-principal::-webkit-scrollbar{display:none}
.nav-secao{--s:var(--suave);display:flex;flex-direction:column;gap:1px;padding:.2rem 0}
.nav-secao[data-cor=ciano]{--s:var(--ciano)}
.nav-secao[data-cor=lavanda]{--s:var(--lavanda)}
.nav-secao[data-cor=ambar]{--s:var(--ambar)}
.nav-secao+.nav-secao{margin-top:.55rem}
/* 24/09: o título da seção leva a cor dela (a cor é o que diz onde você está) e fica em Geist, sem caixa alta */
.nav-titulo{display:flex;align-items:center;gap:.45rem;padding:.4rem .75rem .3rem;font:600 .75rem/1 var(--sans);letter-spacing:.01em;color:color-mix(in srgb,var(--s) 72%,var(--suave))}
.nav-titulo::before{content:"";width:.38rem;height:.38rem;border-radius:2px;background:var(--s);opacity:.9}
.nav-principal a{position:relative;min-height:2.3rem;padding:.42rem .7rem;gap:.65rem;border-radius:9px;font-size:.89rem;color:var(--suave)}
.nav-principal a .ico{color:color-mix(in srgb,var(--s) 55%,var(--apagado));transition:color var(--transicao)}
.nav-principal a:hover{background:color-mix(in srgb,var(--s) 7%,var(--sup))}
.nav-principal a:hover .ico{color:var(--s)}
.nav-principal a.atual{color:var(--texto);background:color-mix(in srgb,var(--s) 13%,var(--sup));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--s) 22%,transparent)}
.nav-principal a.atual .ico{color:var(--s)}
.nav-secao:not([data-cor]){--s:var(--texto)}
.nav-secao:not([data-cor]) a .ico{color:var(--suave)}
.nav-conta{margin-left:auto;min-width:1.35rem;padding:.2rem .38rem;border-radius:999px;font:600 .75rem/1 var(--sans);font-style:normal;text-align:center;color:var(--s);background:color-mix(in srgb,var(--s) 16%,transparent);font-variant-numeric:tabular-nums}
.nav-conta[data-vivo]{display:inline-flex;align-items:center;gap:.3rem;color:var(--menta);background:color-mix(in srgb,var(--menta) 14%,transparent)}
.nav-conta[data-vivo]::before{content:"";width:.4rem;height:.4rem;border-radius:50%;background:var(--menta);animation:pulso-vivo 1.8s ease-out infinite}
.nav-sub{display:flex;flex-direction:column;gap:1px;margin:.15rem 0 .35rem 1.45rem;padding-left:.6rem;border-left:1px solid color-mix(in srgb,var(--s) 28%,var(--linha))}
.nav-principal .nav-sub a{min-height:1.95rem;padding:.3rem .6rem;font-size:.84rem;font-weight:400;color:var(--apagado);background:none;box-shadow:none}
.nav-principal .nav-sub a:hover{color:var(--texto);background:color-mix(in srgb,var(--s) 6%,transparent)}
.nav-principal .nav-sub a.atual{color:var(--texto);font-weight:500;background:none;box-shadow:none}
.nav-principal .nav-sub a.atual::before{content:"";position:absolute;left:calc(-.6rem - 3px);top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--s)}
.nav-pe{margin-top:auto;padding-top:.6rem;border-top:1px solid var(--linha)}
.nav-secao.nav-pe{--s:var(--texto)}
.nav-pe a .ico{color:var(--suave)}
.lateral-conta{margin-top:0}
/* 24/09: era um segundo @keyframes pulso, que sobrescrevia o de cima (o anel do .status e do .ponto-vivo) */
@keyframes pulso-vivo{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--menta) 60%,transparent)}100%{box-shadow:0 0 0 7px transparent}}
@media (prefers-reduced-motion:reduce){.nav-conta[data-vivo]::before,.pulso,.aviso-visita{animation:none!important}}
/* recolhida: só ícones; seções viram um fio, sub-abas e títulos somem (as abas do alto assumem) */
:root[data-lateral="1"] .marca-texto,:root[data-lateral="1"] .nav-titulo,:root[data-lateral="1"] .nav-sub{display:none}
:root[data-lateral="1"] .nav-secao+.nav-secao{margin-top:.35rem;padding-top:.45rem;border-top:1px solid var(--linha)}
:root[data-lateral="1"] .nav-conta{position:absolute;top:.2rem;right:.2rem;min-width:0;padding:.12rem .25rem;font-size:.75rem}
:root[data-lateral="1"] .nav-conta[data-vivo]{width:.55rem;height:.55rem;padding:0;font-size:0;background:none}
:root[data-lateral="1"] .nav-conta[data-vivo]::before{width:.5rem;height:.5rem}
/* barra do alto: com a lateral aberta, as sub-abas já estão nela — aqui fica só o índice de Configurações */
.barra-pagina>.olho{display:none}
@media (min-width:901px){
:root:not([data-lateral="1"]) .barra-pagina:not(.com-dentro){display:none}
:root:not([data-lateral="1"]) .barra-pagina .abas{display:none}
:root:not([data-lateral="1"]) .barra-pagina .abas-dentro{padding-left:0;margin-left:0;border-left:0;gap:.3rem}
:root:not([data-lateral="1"]) .abas-dentro a{padding:.4rem .75rem;border-radius:999px;font-size:.84rem}
:root:not([data-lateral="1"]) .abas-dentro a.atual{background:var(--sup2);box-shadow:inset 0 0 0 1px var(--linha2)}
}
/* títulos de página sem sobretítulo: o título fala por si */
.pagina-topo .olho,.dash-topo .cabecalho-pagina>.olho{display:none}
.pagina-topo h1{font-size:1.45rem;letter-spacing:-.02em}
.painel-bloco{border-radius:14px}
/* 24/09 (kit genérico → identidade): cartão liso; a cor da seção vira uma borda fina em cima, no lugar do degradê */
.kpi{border-radius:14px;background:var(--sup);border-color:var(--linha)}
.kpi::before,.kpi-heroi::before{content:"";position:absolute;top:-1px;left:.9rem;right:.9rem;height:2px;border-radius:0 0 2px 2px;background:var(--acento,var(--ciano));opacity:.85;pointer-events:none}
.app[data-secao=inicio] .kpi::before,.app[data-secao=inicio] .kpi-heroi::before{background:var(--sunset)}
.kpi:hover{background:var(--sup2)}
.kpi[data-cor=menta]{--c:var(--menta)}
.kpi[data-cor=coral]{--c:var(--coral)}
.kpi[data-cor=ciano]{--c:var(--ciano)}

/* ---------------------------------------------------------------- tela Site (visitas) */
.tela-site{display:flex;flex-direction:column;gap:.75rem}
.site-topo{display:grid;grid-template-columns:minmax(17rem,24rem) minmax(0,1fr);gap:.75rem;align-items:stretch}
.kpis-site{grid-template-columns:repeat(2,minmax(0,1fr))}
.kpis-site .kpi{grid-template-columns:minmax(0,1fr);align-content:start;gap:.3rem}
.kpis-site .kpi b{grid-row:auto;font-size:1.85rem}
.kpis-site .kpi .rotulo,.kpis-site .kpi .sub{grid-column:1}
.kpi .sub em{margin-left:.4rem;font:600 .75rem var(--sans);font-style:normal;color:var(--menta)}
.kpi .sub em[data-sinal=menos]{color:var(--coral)}
.ao-vivo{--c:var(--menta);background:var(--sup);border-color:color-mix(in srgb,var(--menta) 24%,var(--linha));display:flex;flex-direction:column}
.ao-vivo h2{display:flex;align-items:center;gap:.55rem;margin:0}
.ao-vivo-numero{font:500 2.4rem/1 var(--mono);color:var(--menta);letter-spacing:-.03em}
.ao-vivo[data-vivos="0"] .ao-vivo-numero{color:var(--apagado)}
.ao-vivo[data-vivos="0"] h2 .pulso{background:var(--apagado);animation:none}
.pulso{display:inline-block;width:.55rem;height:.55rem;border-radius:50%;background:var(--menta);flex:none;animation:pulso-vivo 1.8s ease-out infinite}
.ao-vivo-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem;overflow-y:auto;max-height:13rem}
.ao-vivo-lista li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.2rem .65rem;padding:.5rem .6rem;border-radius:10px;background:color-mix(in srgb,var(--void) 55%,transparent)}
.ao-vivo-lista li[data-lead]{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--menta) 35%,transparent)}
.ao-vivo-quem{display:flex;flex-direction:column;min-width:0}
.ao-vivo-quem b{font-size:.86rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ao-vivo-quem small,.visita-quem small{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;color:var(--apagado)}
.ao-vivo-lista code{grid-column:2;font:.75rem var(--mono);color:var(--lavanda);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ao-vivo-tempo{grid-row:1/3;grid-column:3;font:.75rem var(--sans);color:var(--suave)}
.site-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.barras-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.barras-lista li{--b:var(--ciano);display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"rotulo n" "trilho sub";gap:.25rem .7rem;align-items:center}
.barras-lista li[data-cor=lavanda]{--b:var(--lavanda)}
.barras-lista li[data-cor=ambar]{--b:var(--ambar)}
.barras-lista li[data-cor=menta]{--b:var(--menta)}
.barras-lista li[data-cor=rosa]{--b:var(--rosa)}
.barras-lista li[data-cor=ardosia]{--b:var(--ardosia)}
.barra-rotulo{grid-area:rotulo;display:flex;align-items:baseline;gap:.45rem;min-width:0;font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barra-rotulo code{font:.75rem var(--mono);color:var(--apagado);overflow:hidden;text-overflow:ellipsis}
.barra-trilho{grid-area:trilho;height:6px;border-radius:999px;background:var(--linha);overflow:hidden}
.barra-trilho i{display:block;height:100%;border-radius:999px;background:var(--b)}
.barras-lista b{grid-area:n;font:500 .9rem var(--mono);font-variant-numeric:tabular-nums;text-align:right}
.barras-lista small{grid-area:sub;font:.75rem var(--sans);color:var(--apagado);text-align:right}
/* séries do gráfico: tons validados pela skill de dataviz para o fundo escuro (a lavanda e a menta pastéis ficam claras demais como marca) */
[data-serie=visitas]{--serie:#8f7dff}
[data-serie=contatos]{--serie:#23a86f}
.visitas-bloco{display:flex;flex-direction:column;gap:.4rem}
.visita{border:1px solid var(--linha);border-radius:12px;background:color-mix(in srgb,var(--void) 40%,transparent);transition:border-color var(--transicao)}
.visita[open]{border-color:var(--linha2)}
.visita[data-lead]{border-color:color-mix(in srgb,var(--menta) 30%,var(--linha))}
.visita>summary{display:grid;grid-template-columns:6.5rem minmax(0,1fr) auto auto auto 1rem;align-items:center;gap:.8rem;padding:.6rem .8rem;cursor:pointer;list-style:none}
.visita>summary::-webkit-details-marker{display:none}
.visita>summary>.ico{color:var(--apagado);transition:transform var(--transicao)}
.visita[open]>summary>.ico{transform:rotate(180deg)}
.visita-quando{font:.75rem var(--sans);color:var(--suave);white-space:nowrap}
.visita-quem{display:flex;flex-direction:column;min-width:0}
.visita-anonimo{font-size:.86rem;color:var(--suave)}
.visita-lead{display:inline-flex;align-items:center;gap:.35rem;font-size:.88rem;font-weight:500;color:var(--menta)}
.visita-numeros{font:.76rem var(--sans);color:var(--suave);white-space:nowrap}
.visita-numeros b{color:var(--texto);font-weight:500}
.selo-origem,.selo-visita{--o:var(--lavanda);display:inline-flex;align-items:center;gap:.3rem;padding:.24rem .5rem;border-radius:999px;font:500 .75rem/1 var(--sans);color:var(--o);background:color-mix(in srgb,var(--o) 13%,transparent);white-space:nowrap}
.selo-origem[data-cor=ciano]{--o:var(--ciano)}
.selo-origem[data-cor=menta],.selo-visita[data-cor=menta]{--o:var(--menta)}
.selo-origem[data-cor=rosa]{--o:var(--rosa)}
.selo-origem[data-cor=ambar]{--o:var(--ambar)}
.selo-origem[data-cor=ardosia]{--o:var(--ardosia)}
.visita-caminho{list-style:none;margin:0;padding:.2rem .9rem .8rem 7.9rem;display:flex;flex-direction:column;gap:.1rem}
.visita-caminho li{position:relative;display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .6rem;padding:.3rem 0 .3rem 1.1rem;font-size:.84rem}
.visita-caminho li::before{content:"";position:absolute;left:0;top:.72rem;width:.45rem;height:.45rem;border-radius:50%;background:var(--lavanda)}
.visita-caminho li::after{content:"";position:absolute;left:calc(.225rem - .5px);top:1.2rem;bottom:-.55rem;width:1px;background:var(--linha2)}
.visita-caminho li:last-child::after{display:none}
.visita-caminho li[data-tipo=whatsapp]::before,.visita-caminho li[data-tipo=formulario]::before,.visita-caminho li[data-tipo=telefone]::before,.visita-caminho li[data-tipo=email]::before{background:var(--menta)}
.visita-caminho li[data-tipo=whatsapp] span,.visita-caminho li[data-tipo=formulario] span{color:var(--menta);font-weight:500}
.visita-caminho li[data-tipo=saida]::before{background:var(--apagado)}
.visita-caminho code{font:.75rem var(--mono);color:var(--apagado)}
.visita-caminho small{font:.75rem var(--sans);color:var(--suave)}
.visita-campanha{margin:0;padding:0 .9rem .8rem 7.9rem;font-size:.78rem}
.visitas-do-lead{display:flex;flex-direction:column;gap:.4rem}
.visitas-do-lead .visita>summary{grid-template-columns:minmax(0,1fr) auto 1rem;gap:.5rem}
.visitas-do-lead .visita-quem,.visitas-do-lead .visita-numeros,.visitas-do-lead .selo-visita{display:none}
.visitas-do-lead .visita-caminho,.visitas-do-lead .visita-campanha{padding-left:.9rem}
.filtro-site select{padding:.5rem .7rem;border-radius:9px}
/* configurações › site */
.site-cartao{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:1rem 1.5rem;padding:1rem;border:1px solid var(--linha);border-radius:14px;background:color-mix(in srgb,var(--void) 40%,transparent)}
.site-cartao+.site-cartao{margin-top:.75rem}
.site-cartao[data-inativo]{opacity:.65}
.site-form{display:flex;flex-direction:column;gap:.7rem}
.site-ativo{display:flex;align-items:center;gap:.5rem;font-size:.86rem;color:var(--suave)}
.site-codigo{display:flex;flex-direction:column;gap:.45rem;min-width:0}
.codigo-copiar{display:flex;align-items:flex-start;gap:.5rem;padding:.6rem .7rem;border-radius:10px;background:var(--void);border:1px solid var(--linha2)}
.codigo-copiar code{flex:1;min-width:0;font:.75rem/1.5 var(--mono);color:var(--lavanda);overflow-wrap:anywhere}
.site-excluir{grid-column:1/-1;justify-self:end}
.site-novo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;align-items:end;gap:.7rem}
/* aviso de visita nova, no canto de qualquer tela */
.aviso-visita{position:fixed;right:1.25rem;bottom:1.25rem;z-index:60;display:flex;align-items:center;gap:.7rem;max-width:22rem;padding:.75rem .95rem;border-radius:14px;
background:linear-gradient(160deg,color-mix(in srgb,var(--menta) 14%,transparent),transparent 60%),var(--sup2);border:1px solid color-mix(in srgb,var(--menta) 35%,var(--linha2));
box-shadow:0 12px 32px -12px rgba(0,0,0,.8);color:var(--texto);font-size:.86rem;animation:entra-aviso .4s cubic-bezier(.16,1,.3,1)}
.aviso-visita b{color:var(--menta);font-weight:500}
.aviso-visita:hover{text-decoration:none;border-color:var(--menta)}
@keyframes entra-aviso{from{opacity:0;transform:translateY(12px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
@media (max-width:1100px){.site-topo{grid-template-columns:1fr}.site-grade{grid-template-columns:1fr 1fr}}
@media (max-width:700px){
.site-grade,.site-cartao,.site-novo{grid-template-columns:1fr}
.kpis-site .kpi b{font-size:1.45rem}
.visita>summary{grid-template-columns:minmax(0,1fr) auto 1rem}
.visita-quando,.visita-numeros,.selo-visita{display:none}
.visita-caminho,.visita-campanha{padding-left:.9rem}
}
/* telas baixas (o notebook do João a 150% tem ~633px úteis): a lateral inteira cabe sem rolar */
@media (min-width:901px) and (max-height:760px){
.lateral{gap:.6rem;padding-top:.8rem}
.nav-secao{padding:.1rem 0}
.nav-secao+.nav-secao{margin-top:.3rem}
.nav-titulo{padding:.25rem .7rem .2rem}
.nav-principal a{min-height:2rem;padding:.3rem .65rem}
.nav-principal .nav-sub a{min-height:1.7rem;padding:.2rem .55rem}
.nav-pe{padding-top:.35rem}
.abrir-comandos{padding:.4rem .65rem}
.lateral-conta{padding-top:.4rem}
}
/* Configurações: os grupos ficam no alto (a lateral só marca o item), com as telas do grupo ao lado */
@media (min-width:901px){
:root:not([data-lateral="1"]) .barra-pagina.config{display:flex}
:root:not([data-lateral="1"]) .barra-pagina.config .abas{display:flex}
:root:not([data-lateral="1"]) .barra-pagina.config .abas-dentro{padding-left:1rem;margin-left:.2rem;border-left:1px solid var(--linha2)}
}
.kpi[data-cor=lavanda]{--c:var(--lavanda)}
.estado-item[data-tom=ok] .ponto{background:var(--menta)}
.card-site{display:inline-flex;align-items:center;gap:.25rem;padding:.14rem .38rem;border-radius:6px;font:500 .75rem/1 var(--sans);color:var(--menta);background:color-mix(in srgb,var(--menta) 12%,transparent)}
/* só as seções rolam; o pé (Configurações) fica sempre à vista */
.nav-principal{display:flex;flex-direction:column;overflow:hidden}
.nav-rolagem{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;margin:0 -.3rem;padding:0 .3rem .9rem;
-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 1rem),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 1rem),transparent)}
.nav-rolagem::-webkit-scrollbar{display:none}
.nav-pe{flex:none}
.ao-vivo-lista code,.visita-caminho code,.barra-rotulo code{background:none;padding:0;border:0}
.entrar-marca::after{display:none}
.entrar-marca{background:radial-gradient(50rem 30rem at -10% -10%,color-mix(in srgb,#f4c587 9%,transparent),transparent 60%),radial-gradient(40rem 30rem at 110% 110%,color-mix(in srgb,#99d2ec 10%,transparent),transparent 60%),var(--void)}
.entrar-marca::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--sunset);z-index:2}
.entrar-marca-topo .marca-g{width:2.3rem;height:2.25rem}
.entrar-marca-topo .marca-texto{display:flex}
.entrar-marca>.entrar-g{position:absolute;z-index:0;right:-14%;bottom:-18%;width:min(34rem,62%);height:auto;opacity:.13;pointer-events:none}
.barra.grande span{transition:transform .6s cubic-bezier(.16,1,.3,1)}
/* ---------------------------------------------------------------- 22/09, noite: revisão dos dashboards (crítica A + B) */
:root{--serie-volume:#169ccb;--serie-resposta:#d07c1c;--serie-site:#8f7dff;--serie-contato:#23a86f}
[data-serie=envios]{--serie:var(--serie-volume)}
[data-serie=respostas],[data-serie=mrr]{--serie:var(--serie-resposta)}
[data-serie=visitas]{--serie:var(--serie-site)}
[data-serie=contatos]{--serie:var(--serie-contato)}
/* meia altura marcada no gráfico: uma referência de escala além do máximo */
.grafico{background:linear-gradient(to top,transparent calc(50% - .5px),color-mix(in srgb,var(--linha2) 70%,transparent) calc(50% - .5px),color-mix(in srgb,var(--linha2) 70%,transparent) calc(50% + .5px),transparent calc(50% + .5px))}
.h2-nota{display:block;margin-top:.15rem;font:400 .75rem var(--sans);color:var(--apagado)}
.kpi b,.kpis-site .kpi b{white-space:nowrap}
.kpi .sub em span{font-weight:400;color:var(--apagado)}
/* Início: a data sob a saudação, e a coluna "Agora" ao lado dos funis */
.dash-data{margin:.15rem 0 0;font-size:.82rem;color:var(--suave)}
.dash-data::first-letter{text-transform:uppercase}
.dash-corpo{display:grid;grid-template-columns:minmax(18rem,26rem) minmax(0,1fr);gap:.7rem;align-items:start;min-height:0}
.dash-funis{display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));gap:.7rem;align-content:start}
.agora{display:flex;flex-direction:column;gap:.1rem}
.agora-segundo{margin-top:.8rem;padding-top:.7rem;border-top:1px solid var(--linha)}
.agora-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1px}
.agora-lista a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.65rem;padding:.45rem .5rem;border-radius:10px;color:var(--texto)}
.agora-lista a:hover{background:var(--sup2);text-decoration:none}
.agora-lista .avatar{width:1.9rem;height:1.9rem;font-size:.75rem}
.agora-texto{display:flex;flex-direction:column;min-width:0}
.agora-texto b{font-size:.86rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.agora-texto small{font-size:.75rem;color:var(--suave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.agora-lista time{font:.75rem var(--sans);color:var(--suave);white-space:nowrap}
.agora-icone{display:grid;place-items:center;width:1.9rem;height:1.9rem;border-radius:9px;color:var(--ambar);background:color-mix(in srgb,var(--ambar) 12%,transparent)}
.agora-lista li[data-situacao=atrasada] time{color:var(--coral)}
.agora-lista li[data-situacao=atrasada] .agora-icone{color:var(--coral);background:color-mix(in srgb,var(--coral) 12%,transparent)}
.funil-fechados{margin:.35rem 0 0;font-size:.78rem;color:var(--suave)}
.funil-fechados [data-etapa]{color:var(--c)}
.funil-vazio .vazio{margin:0}
@media (max-width:1000px){.dash-corpo{grid-template-columns:1fr}}
/* Site: o "agora" encolhe quando não há ninguém */
.site-topo:has(.ao-vivo[data-vivos="0"]){grid-template-columns:minmax(14rem,18rem) minmax(0,1fr)}
.ao-vivo[data-vivos="0"] .ao-vivo-numero{font-size:1.6rem}
/* celular: Resultados em uma coluna (a lateral virou gaveta em 24/09, ver "celular" mais abaixo) */
@media (max-width:700px){.resultados-grade{grid-template-columns:1fr}}
/* tela muito baixa (o notebook do João, ~633 px): até 22/09 os títulos das seções sumiam aqui, e a cor por seção perdia
   a função. Desde 24/09 eles ficam, compactos, e quem cede altura são os itens: no Início a lateral inteira, até o
   Instagram, cabe sem rolar; com as sub-abas de um item abertas, ela rola até o item (lateral.js). */
@media (min-width:901px) and (max-height:680px){
.lateral{gap:.45rem;padding:.7rem .65rem .6rem}
.lateral .marca-g,.lateral .marca-logo,.lateral .marca-inicial{width:1.6rem;height:1.55rem}
.abrir-comandos{padding:.32rem .6rem}
.nav-secao{padding:0}
.nav-secao+.nav-secao{margin-top:.3rem}
.nav-titulo{padding:.3rem .7rem .2rem}
.nav-principal a{min-height:1.72rem;padding:.2rem .65rem}
.nav-principal .nav-sub a{min-height:1.6rem;padding:.14rem .55rem}
.nav-sub{margin-top:.05rem;margin-bottom:.2rem}
.nav-rolagem{padding-bottom:.35rem;-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - .5rem),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - .5rem),transparent)}
.nav-pe{padding-top:.3rem}
.lateral-conta{padding-top:.3rem}
.lateral-conta .conta{padding:.15rem .35rem}
.lateral-conta .avatar{width:1.8rem;height:1.8rem}
:root[data-lateral="1"] .lateral{gap:.45rem}
:root[data-lateral="1"] .lateral-topo{gap:.3rem}
:root[data-lateral="1"] .nav-principal a,:root[data-lateral="1"] .abrir-comandos{padding:.3rem}
:root[data-lateral="1"] .nav-secao+.nav-secao{margin-top:.2rem;padding-top:.25rem}
:root[data-lateral="1"] .lateral-conta{gap:0}
}
/* ---------------------------------------------------------------- 22/09, noite: Configurações mais simples
   Título e uma linha de explicação em cima, campos em grade embaixo (antes: explicação numa coluna de 19rem ao lado). */
.ajustes{max-width:68rem}
.ajuste-secao{grid-template-columns:minmax(0,1fr);gap:.85rem;padding:1rem 1.15rem}
.ajuste-cabeca{align-items:center}
.ajuste-cabeca h2{margin:0}
.ajuste-cabeca p{font-size:.8rem;color:var(--suave)}
.ajuste-campos{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:.9rem 1.1rem;align-items:start}
.ajuste-campos>:not(.campo),.ajuste-campos>.campo.largo{grid-column:1/-1}
.ajustes-recolhidos{border:1px dashed var(--linha2);border-radius:14px;background:color-mix(in srgb,var(--sup) 50%,transparent)}
.ajustes-recolhidos>summary{display:flex;align-items:center;gap:.6rem;padding:.85rem 1.1rem;cursor:pointer;list-style:none;font-weight:500;font-size:.9rem;color:var(--suave)}
.ajustes-recolhidos>summary::-webkit-details-marker{display:none}
.ajustes-recolhidos>summary small{font-weight:400;font-size:.78rem;color:var(--apagado)}
.ajustes-recolhidos>summary .ico{margin-left:auto;transition:transform var(--transicao)}
.ajustes-recolhidos[open]>summary .ico{transform:rotate(180deg)}
.ajustes-recolhidos[open]{display:flex;flex-direction:column;gap:.75rem;padding-bottom:.75rem}
.ajustes-recolhidos>.ajuste-secao{margin:0 .75rem}
.ficha-nunca{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:.82rem;color:var(--suave);margin:.3rem 0 .5rem}
.ficha-nunca small{flex-basis:100%;padding-left:1.5rem;font-size:.75rem;color:var(--apagado)}
.ficha-excluir{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;margin:.4rem 0 .7rem}
/* ---------------------------------------------------------------- 22/09, noite: paleta, tema claro e diálogo do painel
   Pedido do João: "vamos tirar o monocromático [...] usar uma paleta de cores, também uma versão clara".
   - Escuro: o Deep Void da Gartner com superfícies num tom frio (antes, cinza puro), e cada seção pinta a tela
     com a sua cor (Vendas ciano, Site lavanda, Negócio âmbar, Configurações ardósia, Início com o sunset).
   - Claro: papel quente, textos quase pretos e o trio pastel em tons profundos (todos com 4,5:1 ou mais).
   - O tema segue o do sistema até o João escolher; a escolha fica no navegador. */
:root{--sup:#14151a;--sup2:#1b1c23;--linha:#262833;--linha2:#343747;--texto:#f2f3f5;--suave:#a3a6b4;--apagado:#8b8e9c;
--sobre-acento:#06161c;--acento:var(--ciano);--vidro:color-mix(in srgb,var(--void) 90%,transparent)}
:root[data-tema=claro]{color-scheme:light;--void:#f6f6f3;--sup:#ffffff;--sup2:#f1f1ee;--linha:#e4e4df;--linha2:#d3d3cd;
--texto:#16171c;--suave:#50525c;--apagado:#686a74;--ciano:#08739a;--ambar:#a8590a;--lavanda:#6250d6;--menta:#0f7652;
--coral:#c43d3d;--rosa:#b3357a;--ardosia:#57627c;--sobre-acento:#ffffff;--brilho:none;
--sombra:0 1px 2px rgba(20,20,30,.06),0 14px 30px -18px rgba(20,20,30,.28);
--serie-volume:#0f86b3;--serie-resposta:#c86f14;--serie-site:#7462e6;--serie-contato:#16925f}
:root[data-tema=claro] .lateral{background:var(--sup)}
:root[data-tema=claro] ::selection{background:color-mix(in srgb,var(--lavanda) 30%,transparent);color:var(--texto)}
:root[data-tema=claro] .marca-sub{color:#16171c}
:root[data-tema=claro] .kpi,:root[data-tema=claro] .painel-bloco,:root[data-tema=claro] .ajuste-secao,:root[data-tema=claro] .coluna{box-shadow:var(--sombra)}
:root[data-tema=claro] .aviso-visita{box-shadow:0 12px 32px -12px rgba(20,20,30,.3)}
:root[data-tema=claro] .entrar-marca{background:radial-gradient(50rem 30rem at -10% -10%,color-mix(in srgb,#f4c587 22%,transparent),transparent 60%),radial-gradient(40rem 30rem at 110% 110%,color-mix(in srgb,#99d2ec 26%,transparent),transparent 60%),var(--sup2)}
:root[data-tema=claro] .entrar-marca>.entrar-g{opacity:.22}
/* fundos que eram cinza-escuro fixo */
.barra-pagina{background:var(--vidro)}
.barra-salvar{background:color-mix(in srgb,var(--sup) 94%,transparent)}
button,a.botao{color:var(--sobre-acento)}
/* 24/09: o hover do botão principal não pode vencer o fundo de um botão secundário (os filtros de Conversas e de
   Modelos ficavam com texto cinza sobre ciano, 1,7:1). Com :where ele pesa só o :hover, e quem tem fundo próprio o mantém. */
:where(button):hover,a.botao:not(.sec):hover{background:color-mix(in srgb,var(--ciano) 86%,var(--texto))}
.filtros button:hover{background:var(--sup2);color:var(--texto);border-color:var(--linha2)}
button.botao-sec,a.botao.sec,button.botao-mini.sec{color:var(--texto)}
button.botao-sec:hover,a.botao.sec:hover,button.botao-mini.sec:hover{background:color-mix(in srgb,var(--sup2) 80%,var(--texto))}
button.icone,button.botao-discreto,button.recolher,button.abrir-comandos,.botao-icone{color:var(--suave)}
button.icone:hover,button.botao-discreto:hover,button.recolher:hover,button.abrir-comandos:hover{background:var(--sup2)}

/* cor da seção: a tela ganha um brilho da cor dela no alto e o título ganha a marca */
.app[data-secao=vendas]{--acento:var(--ciano)}
.app[data-secao=site]{--acento:var(--lavanda)}
.app[data-secao=negocio]{--acento:var(--ambar)}
.app[data-secao=config]{--acento:var(--ardosia)}
.app[data-secao=inicio]{--acento:var(--lavanda)}
.area{background:radial-gradient(70rem 18rem at 18% -7rem,color-mix(in srgb,var(--acento) 16%,transparent),transparent 72%),var(--void)}
:root[data-tema=claro] .area{background:radial-gradient(70rem 18rem at 18% -7rem,color-mix(in srgb,var(--acento) 9%,transparent),transparent 72%),var(--void)}
.app[data-secao=inicio] .area{background:radial-gradient(50rem 15rem at 8% -7rem,color-mix(in srgb,#f4c587 10%,transparent),transparent 70%),
radial-gradient(50rem 15rem at 60% -8rem,color-mix(in srgb,#99d2ec 10%,transparent),transparent 70%),var(--void)}
.pagina-topo h1,.dash-topo h1{display:flex;align-items:center;gap:.55rem}
.pagina-topo h1::before,.dash-topo h1::before{content:"";flex:none;width:.3rem;height:1.05em;border-radius:99px;background:var(--acento)}
.app[data-secao=inicio] .dash-topo h1::before{background:linear-gradient(180deg,#f4c587,#d6d3e9 50%,#99d2ec)}
.ajuste-icone{color:var(--acento);background:color-mix(in srgb,var(--acento) 13%,var(--sup2));border-color:color-mix(in srgb,var(--acento) 26%,var(--linha))}
.abas a.atual,.abas-dentro a.atual{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acento) 40%,var(--linha2));background:color-mix(in srgb,var(--acento) 12%,var(--sup2))}
.tabela thead th{color:color-mix(in srgb,var(--acento) 55%,var(--suave))}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:var(--acento)}
input:focus,select:focus,textarea:focus{border-color:color-mix(in srgb,var(--acento) 60%,var(--linha))}

/* botão de tema, no pé da lateral */
.botao-tema{display:grid;place-items:center;min-width:2rem;min-height:2rem;padding:.4rem;border-radius:9px;background:none;border:1px solid transparent;color:var(--suave);cursor:pointer}
.botao-tema:hover{color:var(--texto);background:var(--sup2);border-color:var(--linha)}
.botao-tema>span{display:none}
:root[data-tema-escolha=claro] .botao-tema>.ico-claro,:root[data-tema-escolha=escuro] .botao-tema>.ico-escuro,
:root:not([data-tema-escolha=claro]):not([data-tema-escolha=escuro]) .botao-tema>.ico-sistema{display:grid}
:root[data-lateral="1"] .lateral-conta .botao-tema{order:3}

/* diálogo de confirmação do painel (no lugar do confirm() do navegador) */
dialog.confirmacao{width:min(26rem,calc(100vw - 2rem));padding:1.4rem 1.4rem 1.1rem;border-radius:18px;border:1px solid var(--linha2);
background:var(--sup);color:var(--texto);box-shadow:0 24px 60px -20px rgba(0,0,0,.7)}
dialog.confirmacao::backdrop{background:color-mix(in srgb,var(--void) 55%,transparent);backdrop-filter:blur(3px)}
dialog.confirmacao[open]{animation:entra-confirmacao .22s cubic-bezier(.16,1,.3,1)}
@keyframes entra-confirmacao{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.confirmacao-marca{display:block;width:2.4rem;height:.3rem;border-radius:99px;margin-bottom:1rem;background:var(--sunset)}
dialog.confirmacao[data-perigo="1"] .confirmacao-marca{background:var(--coral)}
dialog.confirmacao h2{margin:0 0 .45rem;font-size:1.08rem;font-weight:600;letter-spacing:-.01em;line-height:1.35;text-wrap:balance}
dialog.confirmacao p{margin:0;font-size:.9rem;line-height:1.5;color:var(--suave)}
.confirmacao-acoes{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1.3rem}
.confirmacao-acoes button{padding:.6rem 1.05rem;border-radius:999px;font-size:.88rem}
dialog.confirmacao[data-perigo="1"] .confirmacao-sim{background:var(--coral);color:var(--sobre-acento)}
dialog.confirmacao[data-perigo="1"] .confirmacao-sim:hover{background:color-mix(in srgb,var(--coral) 86%,var(--texto))}
@media (prefers-reduced-motion:reduce){dialog.confirmacao[open]{animation:none}}
/* ---------------------------------------------------------------- 22/09, noite: Monitor dos sites e da VM */
.nav-conta[data-alerta]{color:var(--coral);background:color-mix(in srgb,var(--coral) 16%,transparent)}
.tela-monitor{display:flex;flex-direction:column;gap:.75rem}
.monitor-geral{--t:var(--menta);display:flex;align-items:center;gap:.7rem;padding:.85rem 1.1rem;border-radius:14px;
background:linear-gradient(100deg,color-mix(in srgb,var(--t) 14%,transparent),transparent 65%),var(--sup);border:1px solid color-mix(in srgb,var(--t) 30%,var(--linha))}
.monitor-geral[data-tom=coral]{--t:var(--coral)}
.monitor-geral[data-tom=ambar]{--t:var(--ambar)}
.monitor-geral .ico{color:var(--t)}
.monitor-geral b{font-size:1rem}
.monitor-geral span{font-size:.84rem;color:var(--suave)}
.monitor-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:.7rem}
.monitor-site{--m:var(--menta);display:flex;flex-direction:column;gap:.6rem;padding:.9rem 1rem;border-radius:14px;background:var(--sup);border:1px solid var(--linha)}
.monitor-site[data-situacao=fora]{--m:var(--coral);border-color:color-mix(in srgb,var(--coral) 45%,var(--linha));background:linear-gradient(180deg,color-mix(in srgb,var(--coral) 8%,transparent),transparent 60%),var(--sup)}
.monitor-site[data-situacao=lento],.monitor-site[data-situacao=instavel]{--m:var(--ambar)}
.monitor-site[data-situacao=sem]{--m:var(--ardosia)}
.monitor-site header{display:flex;align-items:center;gap:.6rem;min-width:0}
.monitor-ponto{flex:none;width:.6rem;height:.6rem;border-radius:50%;background:var(--m);box-shadow:0 0 0 4px color-mix(in srgb,var(--m) 18%,transparent)}
.monitor-site[data-situacao=fora] .monitor-ponto{animation:pulso-coral 1.6s ease-out infinite}
@keyframes pulso-coral{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--coral) 60%,transparent)}100%{box-shadow:0 0 0 8px transparent}}
.monitor-nome{display:flex;flex-direction:column;min-width:0;flex:1}
.monitor-nome b{font-size:.92rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.monitor-nome a{font:.75rem var(--sans);color:var(--suave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.monitor-host{--h:var(--ardosia);flex:none;padding:.2rem .5rem;border-radius:999px;font:600 .75rem/1 var(--sans);color:var(--h);background:color-mix(in srgb,var(--h) 14%,transparent)}
.monitor-host[data-h=vm]{--h:var(--ciano)}
.monitor-host[data-h=pages]{--h:var(--ambar)}
.monitor-numeros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
.monitor-numeros b{display:block;font:500 1.15rem/1.1 var(--mono);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.monitor-numeros small{font-size:.75rem;color:var(--suave)}
.monitor-faixa{display:grid;grid-template-columns:repeat(48,minmax(0,1fr));gap:2px;height:1.4rem}
.monitor-faixa i{border-radius:2px;background:var(--linha2)}
.monitor-faixa i[data-s=ok]{background:color-mix(in srgb,var(--menta) 75%,var(--sup))}
.monitor-faixa i[data-s=parcial]{background:var(--ambar)}
.monitor-faixa i[data-s=falha]{background:var(--coral)}
.monitor-faixa-eixo{display:flex;justify-content:space-between;margin-top:-.35rem;font:.75rem var(--sans);color:var(--apagado)}
.monitor-motivo{display:flex;align-items:center;gap:.35rem;margin:0;font-size:.8rem;color:var(--coral)}
.monitor-motivo[data-tom=ambar]{color:var(--ambar)}
.monitor-site footer{display:flex;flex-wrap:wrap;gap:.3rem .8rem}
.monitor-dado{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;color:var(--suave)}
.monitor-dado[data-cor]{color:var(--m)}
.monitor-dado[data-tom=ambar]{color:var(--ambar)}
.monitor-dado[data-tom=coral]{color:var(--coral)}
.monitor-cloudflare{display:flex;align-items:center;gap:.5rem;margin:0;padding:.7rem 1rem;border-radius:12px;border:1px dashed var(--linha2);font-size:.84rem;color:var(--suave)}
.vm-medidores{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}
.vm-medidor{--t:var(--ardosia);display:flex;flex-direction:column;gap:.3rem;padding:.75rem .85rem;border-radius:12px;background:var(--sup2);border:1px solid var(--linha)}
.vm-medidor[data-tom=menta]{--t:var(--menta)}
.vm-medidor[data-tom=ambar]{--t:var(--ambar)}
.vm-medidor[data-tom=coral]{--t:var(--coral)}
.vm-medidor b{font:500 1.5rem/1 var(--mono);letter-spacing:-.02em}
.vm-medidor small{font-size:.75rem;color:var(--suave)}
.vm-barra{height:6px;border-radius:999px;background:var(--linha);overflow:hidden}
.vm-barra i{display:block;height:100%;border-radius:999px;background:var(--t)}
.vm-servicos{list-style:none;margin:.8rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:.4rem .9rem}
.vm-servicos li{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.05rem .5rem;padding:.45rem .1rem}
.vm-servicos li .ico{grid-row:1/3;color:var(--menta)}
.vm-servicos li[data-ok="0"] .ico{color:var(--coral)}
.vm-servicos b{font-size:.85rem;font-weight:500}
.vm-servicos small{font-size:.75rem;color:var(--suave)}
.monitor-aberto{color:var(--coral);font-weight:500}
.site-monitor{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:.6rem .9rem;margin:.2rem 0 0;padding:.75rem .85rem;border-radius:12px;border:1px solid var(--linha)}
.site-monitor legend{padding:0 .3rem}
.site-monitor .site-ativo{grid-column:1/-1}
.monitor-config{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:.8rem 1.1rem;align-items:start}
.monitor-config>:not(.campo){grid-column:1/-1}
.aviso-monitor[data-ruim]{background:linear-gradient(160deg,color-mix(in srgb,var(--coral) 16%,transparent),transparent 60%),var(--sup2);border-color:color-mix(in srgb,var(--coral) 45%,var(--linha2))}
.aviso-monitor[data-ruim] b{color:var(--coral)}
@media (max-width:900px){.vm-medidores{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:reduce){.monitor-site[data-situacao=fora] .monitor-ponto{animation:none}}
/* Monitor em lista (22/09, pedido do João) */
.monitor-lista{border:1px solid var(--linha);border-radius:14px;background:var(--sup);overflow-x:auto}
.monitor-linha{display:grid;grid-template-columns:minmax(13rem,1.6fr) 4.2rem minmax(8rem,1fr) 4.6rem 4.6rem 4.8rem minmax(9rem,1.1fr) 5.6rem minmax(7rem,.9fr);
align-items:center;gap:.8rem;min-width:62rem;padding:.6rem 1rem;border-top:1px solid var(--linha)}
.monitor-linha:hover{background:color-mix(in srgb,var(--acento) 5%,transparent)}
.monitor-cabeca{border-top:0;padding-top:.7rem;padding-bottom:.55rem;font:500 .75rem/1 var(--sans);color:color-mix(in srgb,var(--acento) 55%,var(--suave))}
.monitor-cabeca:hover{background:none}
.monitor-linha[data-situacao=fora]{--m:var(--coral);background:color-mix(in srgb,var(--coral) 7%,transparent)}
.monitor-quem{display:flex;align-items:center;gap:.6rem;min-width:0}
.monitor-linha .monitor-ponto{--m:var(--menta)}
.monitor-linha .monitor-ponto[data-cor=coral]{--m:var(--coral);background:var(--coral)}
.monitor-linha .monitor-ponto[data-cor=ambar]{background:var(--ambar);box-shadow:0 0 0 4px color-mix(in srgb,var(--ambar) 18%,transparent)}
.monitor-linha .monitor-ponto[data-cor=ardosia]{background:var(--ardosia);box-shadow:0 0 0 4px color-mix(in srgb,var(--ardosia) 18%,transparent)}
.monitor-linha[data-situacao=fora] .monitor-ponto{animation:pulso-coral 1.6s ease-out infinite}
.monitor-estado{display:flex;flex-direction:column;min-width:0}
.monitor-estado b{font-size:.84rem;font-weight:500;color:var(--menta)}
.monitor-estado[data-cor=coral] b{color:var(--coral)}
.monitor-estado[data-cor=ambar] b{color:var(--ambar)}
.monitor-estado[data-cor=ardosia] b{color:var(--suave)}
.monitor-estado small{font-size:.75rem;color:var(--suave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.monitor-num{font:500 .86rem var(--mono);font-variant-numeric:tabular-nums;text-align:right}
.monitor-cabeca .monitor-num{font:500 .75rem/1 var(--sans)}
.monitor-linha .monitor-faixa{height:1.1rem;gap:1px}
.monitor-ssl [data-tom=ambar],.monitor-deploy [data-tom=ambar]{color:var(--ambar)}
.monitor-ssl [data-tom=coral],.monitor-deploy [data-tom=coral]{color:var(--coral)}
.monitor-deploy{font-size:.76rem;color:var(--suave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tela-monitor>*{flex:none}
/* sem o token do Cloudflare não há deploy para mostrar: a coluna sai e a lista cabe no notebook */
.monitor-lista[data-sem-deploy] .monitor-linha{grid-template-columns:minmax(13rem,1.6fr) 4.2rem minmax(8rem,1fr) 4.4rem 4.6rem 4.8rem minmax(9rem,1.2fr) 5.4rem;min-width:52rem}
.monitor-lista[data-sem-deploy] .monitor-linha>:last-child{display:none}
/* 24/09: agente da primeira resposta (Vendas › Agente e Configurações › Agente) */
.tela-agente .painel-bloco+.painel-bloco{margin-top:.75rem}
.agente-lista{display:grid;gap:.7rem}
.agente-cartao{--c:var(--suave);border:1px solid var(--linha);border-left:3px solid var(--c);border-radius:12px;background:var(--sup2);padding:.8rem .9rem;display:grid;gap:.7rem;box-shadow:var(--brilho)}
.agente-cartao[data-caso=pessoa],.agente-caso[data-caso=pessoa]{--c:var(--menta)}
.agente-cartao[data-caso=negativa],.agente-caso[data-caso=negativa]{--c:var(--coral)}
.agente-cartao[data-caso=saida],.agente-caso[data-caso=saida]{--c:var(--rosa)}
.agente-cartao[data-caso=automatica],.agente-caso[data-caso=automatica]{--c:var(--ardosia)}
.agente-cartao[data-caso=joao],.agente-caso[data-caso=joao]{--c:var(--ambar)}
.agente-cartao>header{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;min-width:0}
.agente-cartao>header a{color:var(--texto);text-decoration:none;font-size:var(--t-base)}
.agente-cartao>header a:hover{text-decoration:underline}
.agente-cartao>header small{color:var(--apagado);font:400 var(--t-xs)/1.3 var(--sans);font-variant-numeric:tabular-nums}
.agente-caso{--c:var(--suave);margin-left:auto;display:inline-flex;align-items:center;gap:.35rem;font:500 .75rem/1 var(--sans);color:var(--c);padding:.3rem .5rem;border-radius:999px;background:color-mix(in srgb,var(--c) 13%,transparent);white-space:nowrap}
.tabela .agente-caso{margin-left:0}
.agente-corpo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:.9rem}
.agente-disse,.agente-sugere{display:grid;gap:.4rem;align-content:start;min-width:0}
.agente-msg{margin:0;justify-self:start;max-width:100%;padding:.45rem .7rem;border-radius:4px 12px 12px 12px;background:var(--sup);border:1px solid var(--linha);font-size:var(--t-md);line-height:1.4;overflow-wrap:anywhere}
.agente-porque{margin:0;display:grid;gap:.35rem;font-size:var(--t-md);color:var(--suave);line-height:1.45}
.agente-trava,.agente-conf{display:flex;gap:.35rem;align-items:flex-start;font-size:var(--t-sm);color:var(--apagado)}
.agente-trava{color:var(--ambar)}
.agente-trava .ico{flex:none;margin-top:.15rem}
.agente-previa summary{cursor:pointer;font-size:var(--t-sm);color:var(--ciano);list-style:none}
.agente-previa summary::-webkit-details-marker{display:none}
.agente-previa pre{margin:.5rem 0 0;white-space:pre-wrap;font:400 var(--t-sm)/1.5 var(--sans);background:color-mix(in srgb,var(--menta) 7%,var(--sup));border:1px solid var(--linha);border-radius:12px 4px 12px 12px;padding:.6rem .75rem;max-height:14rem;overflow:auto}
.agente-acoes{display:flex;align-items:flex-end;gap:.5rem;flex-wrap:wrap;border-top:1px solid var(--linha);padding-top:.7rem}
.agente-acoes .campo{flex:1 1 18rem;margin:0}
.agente-acoes button{flex:none}
.agente-testar{display:grid;grid-template-columns:minmax(0,1fr) 11rem auto;gap:.6rem;align-items:end}
.agente-testar .campo{margin:0}
.agente-teste-resultado{--c:var(--suave);margin-top:.75rem;padding:.7rem .85rem;border-radius:10px;border:1px solid color-mix(in srgb,var(--c) 40%,var(--linha));background:color-mix(in srgb,var(--c) 7%,var(--sup));display:grid;gap:.35rem}
.agente-teste-resultado[data-caso=pessoa]{--c:var(--menta)}
.agente-teste-resultado[data-caso=negativa]{--c:var(--coral)}
.agente-teste-resultado[data-caso=saida]{--c:var(--rosa)}
.agente-teste-resultado[data-caso=automatica]{--c:var(--ardosia)}
.agente-teste-resultado[data-caso=joao]{--c:var(--ambar)}
.agente-teste-resultado>b{color:var(--c)}
.agente-teste-resultado p{margin:0}
.agente-teste-resultado small{color:var(--apagado);font-family:var(--sans);font-size:var(--t-xs)}
.agente-td-msg{max-width:26rem;color:var(--suave)}
.tabela td small{display:block;color:var(--apagado);font-size:var(--t-xs);margin-top:.15rem}
.selo[data-tom=ok]{color:var(--menta);border-color:color-mix(in srgb,var(--menta) 20%,transparent);background:color-mix(in srgb,var(--menta) 8%,transparent)}
.selo[data-tom=alerta]{color:var(--ambar);border-color:color-mix(in srgb,var(--ambar) 20%,transparent);background:color-mix(in srgb,var(--ambar) 8%,transparent)}
.selo[data-tom=erro]{color:var(--coral);border-color:color-mix(in srgb,var(--coral) 20%,transparent);background:color-mix(in srgb,var(--coral) 8%,transparent)}
.selo[data-tom=neutro]{color:var(--apagado);border-color:var(--linha2);background:none}
textarea.mono{font:400 var(--t-sm)/1.55 var(--mono);min-height:18rem}
.form-restaurar{margin:.75rem 0 1rem}
.interruptor-dica{display:flex;gap:.45rem;align-items:center;font-size:var(--t-sm);color:var(--suave);margin-top:.5rem}
@media (max-width:860px){.agente-corpo,.agente-testar{grid-template-columns:1fr}.agente-caso{margin-left:0}}
.form-restaurar button{width:auto}
/* ================================================================ 24/09, noite — revisão de design: interface e navegação
   Da revisão completa de 24/09 (Estudos/2026-09-24 — Revisão completa do produto.md, seções 3 e 6). */
.nav-secao[data-cor=rosa]{--s:var(--rosa)}
.conversa-item.atual .conversa-linha time{color:var(--suave)}
/* fundos com tom: o --apagado ficava abaixo de 4,5:1 (4,29 no "Cobranças" da linha de estado do Início) */
.estado-item[data-pede] .estado-rotulo{color:var(--suave)}
/* tema claro: texto colorido sobre o fundo da mesma cor (contadores, avatares, etiquetas) ficava entre 3,4 e 4,46:1.
   O texto desses selos escurece um pouco na direção do --texto e passa de 4,5:1, sem perder a cor. */
:root[data-tema=claro] .nav-conta{color:color-mix(in srgb,var(--s) 74%,var(--texto))}
:root[data-tema=claro] .nav-conta[data-vivo]{color:color-mix(in srgb,var(--menta) 74%,var(--texto))}
:root[data-tema=claro] .nav-conta[data-alerta]{color:color-mix(in srgb,var(--coral) 74%,var(--texto))}
:root[data-tema=claro] .avatar,:root[data-tema=claro] .etiqueta{color:color-mix(in srgb,var(--c,var(--suave)) 74%,var(--texto))}
:root[data-tema=claro] .selo-origem,:root[data-tema=claro] .selo-visita{color:color-mix(in srgb,var(--o) 74%,var(--texto))}
:root[data-tema=claro] .monitor-host{color:color-mix(in srgb,var(--h) 74%,var(--texto))}
:root[data-tema=claro] .estado-item[data-pede] b,:root[data-tema=claro] .estado-acao{color:color-mix(in srgb,var(--t) 74%,var(--texto))}
:root[data-tema=claro] :is(.contagem,.etiqueta-lead,.agente-caso,.pill,.ig-selo,.selo-modo){color:color-mix(in srgb,var(--c) 74%,var(--texto))}
:root[data-tema=claro] .card-dias[data-parado]{color:color-mix(in srgb,var(--coral) 74%,var(--texto))}
:root[data-tema=claro] .card-site,:root[data-tema=claro] .selo[data-tom=ok]{color:color-mix(in srgb,var(--menta) 74%,var(--texto))}
:root[data-tema=claro] :is(.selo[data-temp=Quente],.selo[data-envio=manual],.selo[data-tom=alerta]){color:color-mix(in srgb,var(--ambar) 74%,var(--texto))}
:root[data-tema=claro] .selo[data-temp=Morno]{color:color-mix(in srgb,var(--lavanda) 74%,var(--texto))}
:root[data-tema=claro] .selo[data-envio=robo]{color:color-mix(in srgb,var(--ciano) 74%,var(--texto))}
:root[data-tema=claro] .selo[data-tom=erro]{color:color-mix(in srgb,var(--coral) 74%,var(--texto))}
/* letra mínima de 12 px: o <small> sem tamanho próprio herdava o "smaller" do navegador (10,7 px em Metas) */
:where(small){font-size:max(.75rem,.85em)}
/* rótulos .sr (posição absoluta) dentro de uma área que rola ficavam presos à página e davam rolagem ao documento
   inteiro (Etapas rolava 420 px além da tela); com um ancestral posicionado eles ficam dentro da área */
main,.pagina-rolagem,.tabela-rolagem{position:relative}
/* a barra de abas do alto tem altura variável (Configurações com o índice de dentro: 46 px, e não os 41 da conta fixa):
   a área vira coluna da altura da janela e o main ocupa o que sobra */
@media (min-width:901px){
.area{height:100vh}
.barra-pagina+main{height:auto;flex:1;min-height:0}
}

/* ---- hierarquia de números (interface.kpi_heroi, faixa_kpis e painel_kpis)
   Um número principal por tela, grande, e os outros numa faixa menor ao lado. Cartões lisos, com a cor da seção só na
   borda de cima; o número é neutro e só ganha cor com estado (data-tom: ok, alerta, erro, info). Zero fala baixo. */
.kpis-hierarquia{display:grid;grid-template-columns:minmax(13rem,.75fr) minmax(0,2.25fr);gap:.7rem;align-items:stretch;min-width:0}
.kpi-heroi{--t:var(--texto);position:relative;display:flex;flex-direction:column;justify-content:center;gap:.45rem;min-width:0;padding:1rem 1.15rem;border-radius:14px;background:var(--sup);border:1px solid var(--linha);box-shadow:var(--brilho);color:var(--texto)}
a.kpi-heroi:hover{text-decoration:none;background:var(--sup2)}
.kpi-rotulo{font:500 .8rem/1.25 var(--sans);color:var(--suave)}
.kpi-valor{display:block;font:500 1.45rem/1.05 var(--mono);letter-spacing:-.02em;color:var(--t);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi-sub{font-size:.78rem;line-height:1.4;color:var(--suave);min-width:0}
.kpi-heroi .kpi-rotulo{font-size:.9rem;font-weight:500;color:var(--texto)}
.kpi-heroi .kpi-valor{font-size:clamp(2.4rem,3.3vw,3.1rem);letter-spacing:-.035em}
.kpi-heroi .kpi-sub{font-size:.82rem}
.faixa-kpis{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;min-width:0;overflow:hidden;border-radius:14px;background:var(--sup);border:1px solid var(--linha);box-shadow:var(--brilho)}
/* as linhas entre os itens são sombras de 1 px à esquerda e em cima; o overflow do cartão esconde as da borda */
.kpi-item{--t:var(--texto);position:relative;flex:1 1 8rem;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:.3rem;padding:.8rem .95rem;box-shadow:-1px 0 0 var(--linha),0 -1px 0 var(--linha)}
.kpi-item>a{display:flex;flex-direction:column;gap:.3rem;color:inherit}
.kpi-item>a::after{content:"";position:absolute;inset:0}
.kpi-item>a:hover{text-decoration:none}
.kpi-item:has(>a):hover{background:var(--sup2)}
.kpi-heroi[data-tom=ok],.kpi-item[data-tom=ok]{--t:var(--menta)}
.kpi-heroi[data-tom=alerta],.kpi-item[data-tom=alerta]{--t:var(--ambar)}
.kpi-heroi[data-tom=erro],.kpi-item[data-tom=erro]{--t:var(--coral)}
.kpi-heroi[data-tom=info],.kpi-item[data-tom=info]{--t:var(--ciano)}
.kpi-heroi[data-zero] .kpi-valor,.kpi-item[data-zero] .kpi-valor{color:var(--apagado)}
.kpi-sub .ig-barra{display:block;width:100%;max-width:7rem;margin:.1rem 0 .35rem}
.kpi-sub em{margin-left:.4rem;font-weight:600;font-style:normal;color:var(--menta)}
.kpi-sub em[data-sinal=menos]{color:var(--coral)}
.kpi-sub em span{font-weight:400;color:var(--suave)}
@media (max-width:1100px){.kpis-hierarquia{grid-template-columns:1fr}}
/* Site: ao lado do "Agora no site", o número principal em cima e a faixa embaixo */
.site-topo .kpis-hierarquia{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}

/* ---- barra de salvar de tabela editável (interface.barra_salvar(..., tabela=True) → .barra-salvar.tabela-salvar)
   O mesmo "Salvar alterações" de Configurações, no pé de uma tabela em que cada linha é editável (Etapas, por exemplo),
   no lugar de um botão Salvar por linha. Vai logo depois do </table>, dentro do mesmo <form data-ajustes>. */
.barra-salvar.tabela-salvar{position:sticky;bottom:0;max-width:none;margin:.6rem 0 0;padding:.55rem .6rem .55rem .9rem;border-radius:12px}
.tabela-rolagem>.tabela-salvar,.painel-bloco>.tabela-salvar{margin-top:.5rem}
.tabela input:not([type=checkbox]):not([type=radio]),.tabela select{padding:.4rem .55rem;font-size:.85rem;background:var(--sup2);min-width:0}

/* ---- Monitor: o aviso "fora do ar" leva à linha (lateral.js), e a linha fora do ar tem um fio vermelho à esquerda */
.monitor-linha{scroll-margin-block:5rem}
.monitor-linha[data-situacao=fora]{box-shadow:inset 3px 0 0 var(--coral)}
.monitor-linha[data-situacao=fora]:target,.monitor-linha.realce{animation:realce-linha 1.8s ease-out}
@keyframes realce-linha{0%,30%{background:color-mix(in srgb,var(--coral) 26%,transparent)}100%{background:color-mix(in srgb,var(--coral) 7%,transparent)}}
.monitor-geral{flex-wrap:wrap}
.monitor-ir{margin-left:auto;display:inline-flex;align-items:center;gap:.3rem;min-height:2rem;padding:0 .85rem;border-radius:999px;font-size:.84rem;font-weight:500;color:var(--coral);border:1px solid color-mix(in srgb,var(--coral) 40%,var(--linha))}
.monitor-ir::after{content:"";width:.4rem;height:.4rem;margin-top:-.2rem;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.monitor-ir:hover{text-decoration:none;background:color-mix(in srgb,var(--coral) 12%,transparent)}
@media (prefers-reduced-motion:reduce){.monitor-linha.realce,.monitor-linha:target{animation:none}}

/* ---- Início no monitor (~1920×950): o corpo ocupa a altura que sobra, sem 40% de tela vazia embaixo.
   "Esperando você" e "Para hoje" ficam numa coluna inteira; os funis se empilham ao lado e dividem a altura. */
@media (min-width:1500px) and (min-height:820px){
main.cheio>.tela-dash{grid-template-rows:auto auto auto minmax(0,1fr)}
.tela-dash>.dash-corpo{grid-template-columns:minmax(26rem,1fr) minmax(0,1.35fr);align-items:stretch;height:100%}
.tela-dash .dash-corpo>.painel-bloco{align-self:stretch;overflow-y:auto}
.tela-dash .dash-funis{grid-auto-rows:minmax(0,1fr);align-content:stretch;min-height:0}
.tela-dash .dash-corpo:is([data-funis="1"],[data-funis="2"]) .dash-funis{grid-template-columns:1fr}
.tela-dash .dash-funis>.painel-bloco{align-self:stretch;overflow-y:auto}
.tela-dash .dash-funis .funil-bloco{flex:1;justify-content:center}
}
/* Lateral no monitor: com altura sobrando, itens e seções respiram (antes ficava um vão entre o Instagram e o pé) */
@media (min-width:901px) and (min-height:860px){
.lateral{gap:1rem;padding-top:1.15rem}
.nav-secao+.nav-secao{margin-top:.8rem}
.nav-titulo{padding:.45rem .75rem .35rem}
.nav-principal a{min-height:2.4rem}
}

/* ---- celular e tablet em pé (até 900 px): barra de baixo com Início, Conversas, Agente, Atividades e "Mais", que abre
   a lateral inteira como gaveta. Antes a lateral virava uma faixa de 16 ícones sem nome, 9 fora da tela. */
.nav-celular,.gaveta-fundo,.chat-voltar{display:none}
@media (max-width:900px){
:root{--barra-celular:calc(3.7rem + env(safe-area-inset-bottom,0px))}
.lateral{position:fixed;top:0;bottom:0;left:0;z-index:80;width:min(19rem,86vw);height:100%;height:100dvh;flex-direction:column;align-items:stretch;gap:.8rem;
padding:1rem .8rem calc(1rem + env(safe-area-inset-bottom,0px));border-right:1px solid var(--linha2);border-bottom:0;overflow:hidden;
transform:translateX(-105%);visibility:hidden;transition:transform .28s cubic-bezier(.16,1,.3,1),visibility 0s linear .28s}
:root[data-gaveta="1"] .lateral{transform:none;visibility:visible;transition:transform .28s cubic-bezier(.16,1,.3,1);box-shadow:24px 0 60px -24px rgba(0,0,0,.75)}
.gaveta-fundo{position:fixed;inset:0;z-index:79;display:block;background:color-mix(in srgb,var(--void) 62%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.nav-principal a{min-height:2.75rem}
.nav-principal .nav-sub a{min-height:2.4rem}
.area{padding-bottom:var(--barra-celular)}
.nav-celular{position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:.15rem;
padding:.3rem .4rem calc(.3rem + env(safe-area-inset-bottom,0px));background:color-mix(in srgb,var(--sup) 92%,transparent);
-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--linha)}
.nav-celular>a,.nav-celular>button{--s:var(--acento,var(--ciano));position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.22rem;
min-width:0;min-height:3.05rem;padding:.3rem .1rem;border:0;border-radius:12px;background:none;color:var(--suave);font:500 .75rem/1.1 var(--sans);text-decoration:none}
.nav-celular>a:hover,.nav-celular>button:hover{background:var(--sup2);color:var(--texto);text-decoration:none}
.nav-celular>a.atual{color:var(--texto)}
.nav-celular>a.atual .ico{color:var(--acento,var(--ciano))}
.nav-celular>a.atual::before{content:"";position:absolute;top:-.3rem;left:32%;right:32%;height:2px;border-radius:0 0 2px 2px;background:var(--acento,var(--ciano))}
:root[data-gaveta="1"] .nav-mais{color:var(--texto);background:var(--sup2)}
.nav-celular .nav-conta{position:absolute;top:.15rem;left:calc(50% + .35rem);margin:0;min-width:1.15rem;padding:.12rem .3rem}
.toast{bottom:calc(var(--barra-celular) + .8rem);z-index:90}
.aviso-visita{left:.75rem;right:.75rem;bottom:calc(var(--barra-celular) + .75rem);max-width:none}
.barra-salvar{bottom:var(--barra-celular)}
/* Conversas em duas telas (lateral.js põe data-conversa na raiz): a lista, e o chat em tela cheia */
.conversas-app{grid-template-columns:1fr;height:auto}
.conversas-lista{border-right:0}
:root[data-conversa=lista] .conversas-app>.chat-coluna,:root[data-conversa=lista] .conversas-app>.ficha{display:none}
:root[data-conversa=lista] .conversas-itens{flex:none}
:root[data-conversa=chat] .conversas-lista{display:none}
:root[data-conversa=chat] .conversas-app{position:fixed;inset:0;z-index:65;height:100%;height:100dvh;border:0;border-radius:0}
:root[data-conversa=chat] .nav-celular{display:none}
:root[data-conversa=chat] .area{padding-bottom:0}
.chat-coluna{height:100%}
.chat-voltar{display:grid;place-items:center;flex:none;width:2.5rem;height:2.5rem;margin-left:-.3rem;border-radius:10px;color:var(--texto)}
.chat-voltar:hover{background:var(--sup2);text-decoration:none}
.chat-topo{flex-wrap:nowrap;gap:.45rem;padding:.45rem .6rem}
.chat-topo>.avatar,.chat-pills{display:none}
.chat-quem{min-width:0}
.chat-quem h2,.chat-quem small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-acoes{flex:none;flex-wrap:nowrap}
.chat-acoes select{max-width:8.5rem}
.chat-mensagens{min-height:0;padding:.75rem .7rem}
.balao{max-width:86%}
form.compositor{padding-bottom:calc(.6rem + env(safe-area-inset-bottom,0px))}
.compositor-aviso:not([data-tom]){display:none}
/* o teclado do celular já tem emojis: o botão sai e o campo de digitar ganha a largura */
.compositor-linha>[data-alternar=painel-emojis]{display:none}
.compositor textarea{min-width:0}
}
@media (max-width:900px) and (prefers-reduced-motion:reduce){.lateral{transition:none}}
/* 24/09: Instagram (seção Marketing, rosa). Fila em cartões com prévia, publicados em tabela, visão geral com metas. */
.app[data-secao=marketing]{--acento:var(--rosa)}
.tela-ig{display:flex;flex-direction:column;gap:1rem}
.ig-kpi b{font-size:1.9rem}
.ig-barra{display:inline-block;width:4.5rem;height:4px;border-radius:999px;background:var(--linha2);vertical-align:middle;margin-right:.4rem;overflow:hidden}
.ig-barra i{display:block;height:100%;background:var(--rosa);border-radius:inherit}
.ig-alertas{display:flex;flex-direction:column;gap:.4rem}
.ig-alerta{--c:var(--ambar);display:flex;align-items:center;gap:.55rem;padding:.6rem .85rem;border-radius:10px;color:var(--texto);font-size:var(--t-md);
  border:1px solid color-mix(in srgb,var(--c) 35%,var(--linha));background:color-mix(in srgb,var(--c) 7%,var(--sup))}
.ig-alerta .ico{color:var(--c);flex:none}
.ig-alerta:hover{text-decoration:none;background:color-mix(in srgb,var(--c) 12%,var(--sup))}
.ig-selo{--c:var(--ardosia);display:inline-flex;align-items:center;padding:.1rem .5rem;border-radius:999px;font:500 var(--t-xs)/1.5 var(--sans);
  color:var(--c);border:1px solid color-mix(in srgb,var(--c) 22%,transparent);background:color-mix(in srgb,var(--c) 8%,transparent);white-space:nowrap}
/* 24/09: o --c do .ig-selo vinha depois do [data-cor=...] geral e deixava todo selo cinza */
.ig-selo[data-cor=ciano]{--c:var(--ciano)}.ig-selo[data-cor=ambar]{--c:var(--ambar)}.ig-selo[data-cor=lavanda]{--c:var(--lavanda)}
.ig-selo[data-cor=menta]{--c:var(--menta)}.ig-selo[data-cor=rosa]{--c:var(--rosa)}.ig-selo[data-cor=coral]{--c:var(--coral)}
.ig-proximos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ig-proximos li{display:grid;grid-template-columns:8.5rem auto minmax(0,1fr);align-items:center;gap:.75rem;padding:.55rem 0;border-top:1px solid var(--linha)}
.ig-proximos li:first-child{border-top:0}
.ig-quando{font:500 var(--t-sm)/1.3 var(--sans);color:var(--suave);font-variant-numeric:tabular-nums}
.ig-linha{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ig-serie{display:block;width:100%;height:6rem}
.ig-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(36rem,1fr));gap:1rem;align-items:start}
.ig-cartao{display:grid;grid-template-columns:minmax(8rem,11.5rem) minmax(0,1fr);gap:1.1rem;padding:.9rem;background:var(--sup);border:1px solid var(--linha);border-radius:14px}
.ig-midia{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.ig-cartao[data-estado=aprovado]{border-color:color-mix(in srgb,var(--ciano) 35%,var(--linha))}
.ig-cartao[data-estado=erro]{border-color:color-mix(in srgb,var(--coral) 45%,var(--linha))}
.ig-previa{position:relative;aspect-ratio:4/5;border-radius:10px;overflow:hidden;background:var(--sup2);border:1px solid var(--linha)}
.ig-previa img,.ig-previa video{width:100%;height:100%;object-fit:cover;display:block}
.ig-previa.mini{width:3.2rem;aspect-ratio:4/5;border-radius:6px}
.ig-previa.story{aspect-ratio:9/16}.ig-previa.mini.story{aspect-ratio:9/16;width:2.4rem}
.ig-previa.mini .ig-tipo{display:none}
.ig-tipo{position:absolute;left:.5rem;top:.5rem;padding:.12rem .5rem;border-radius:999px;font:500 var(--t-xs)/1.5 var(--sans);color:#fff;background:rgba(14,14,14,.72)}
.ig-slides{display:flex;gap:.35rem;overflow-x:auto;scrollbar-width:none}
.ig-slides img{width:2.6rem;aspect-ratio:4/5;object-fit:cover;border-radius:6px;border:1px solid var(--linha);flex:none}
.ig-video summary{cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;font-size:var(--t-sm);color:var(--suave)}
.ig-video video{width:100%;max-height:28rem;border-radius:10px;margin-top:.5rem;background:#000}
.ig-form{display:flex;flex-direction:column;gap:.6rem}
.ig-form textarea{min-height:9rem;font:400 var(--t-sm)/1.55 var(--sans);resize:vertical}
.ig-topo{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.ig-topo .ig-quando{margin-left:auto}
.ig-erro{display:flex;gap:.4rem;align-items:flex-start;margin:0;color:var(--coral);font-size:var(--t-sm)}
.ig-tabela td{vertical-align:middle}
.ig-tabela td.ig-mini{width:3.6rem}
.ig-tabela form{display:inline}
.ig-metas{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.9rem 1rem}
.ig-metas .acoes-form{grid-column:1/-1}
.ig-metas .campo:has(textarea){grid-column:1/-1}
/* 24/09: metas do ciclo, marcos e relatórios do Claude */
.ig-metas-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ig-metas-lista li{display:grid;grid-template-columns:minmax(0,15rem) minmax(6rem,1fr) minmax(0,15rem) 6.5rem;align-items:center;gap:.9rem;padding:.6rem 0;border-top:1px solid var(--linha)}
.ig-metas-lista li:first-child{border-top:0}
.ig-meta-nome{font-size:var(--t-md)}
.ig-meta-num{font-variant-numeric:tabular-nums;color:var(--suave);font-size:var(--t-sm)}
.ig-meta-num b{color:var(--texto);font-size:var(--t-md)}
.ig-metas-lista .ig-selo{justify-self:start}
.ig-barra.larga{width:100%;height:6px;margin:0}
.ig-marcos{margin-top:1rem}
.ig-marcos td{vertical-align:middle}
.ig-editar summary{cursor:pointer;font-weight:500;color:var(--suave)}
.ig-editar[open] summary{margin-bottom:1rem}
.ig-rel-abas{display:flex;gap:.4rem;flex-wrap:wrap}
.ig-rel-aba{padding:.3rem .75rem;border-radius:999px;border:1px solid var(--linha);color:var(--suave);font:500 var(--t-sm)/1.4 var(--sans)}
.ig-rel-aba:hover{text-decoration:none;color:var(--texto);border-color:var(--linha2)}
.ig-rel-aba.ativo{color:var(--rosa);border-color:color-mix(in srgb,var(--rosa) 45%,var(--linha));background:color-mix(in srgb,var(--rosa) 9%,transparent)}
.ig-relatorio{max-width:60rem;line-height:1.65}
.ig-relatorio h2{font-size:1.35rem;margin:0 0 .6rem}
.ig-relatorio h3{font-size:1.05rem;margin:1.6rem 0 .5rem;color:var(--rosa)}
.ig-relatorio h4{font-size:var(--t-md);margin:1.1rem 0 .4rem}
.ig-relatorio p,.ig-relatorio ul{margin:.4rem 0 .8rem}
.ig-relatorio ul{padding-left:1.2rem}
.ig-relatorio li{margin:.2rem 0}
.ig-relatorio .tabela{margin:.6rem 0 1rem}
@media (max-width:640px){.ig-grade{grid-template-columns:1fr}.ig-cartao{grid-template-columns:1fr}.ig-proximos li{grid-template-columns:1fr;gap:.25rem}
  .ig-metas-lista li{grid-template-columns:1fr auto;gap:.35rem .75rem}.ig-metas-lista .ig-barra{grid-column:1/-1}}
.tela-ig .kpis{grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))}
.tela-ig .kpi .sub{font-size:.75rem}
.ig-pedidos li{grid-template-columns:8.5rem auto minmax(0,1fr)}
.ig-falhou{color:var(--coral);font-weight:500}
/* 24/09: editar valor e vencimento da cobrança (abre na própria linha, sem ficar preso na rolagem da tabela) e o dia padrão */
.acoes-cobranca{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.35rem}
.editar-cobranca-form{display:grid;gap:.75rem}
.editar-cobranca-form h2{margin:0;font-size:1.05rem}
.editar-cobranca-form .dica{margin:-.4rem 0 0;font-size:var(--t-sm);color:var(--apagado)}
.editar-cobranca-form .dialogo-acoes{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.25rem}
.dia-vencimento{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-top:.75rem;font-size:var(--t-sm);color:var(--suave)}
.dia-vencimento label{display:inline-flex;align-items:center;gap:.45rem;font-size:var(--t-sm)}
.dia-vencimento input{width:4.5rem;padding:.35rem .5rem}
.dia-vencimento small{color:var(--apagado)}
/* 24/09: gráfico do MRR mês a mês (Financeiro › Visão do mês): começa no primeiro mês com cliente, com valor e mês */
.meses-grafico{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:.75rem;height:11rem;padding-top:.25rem;border-bottom:1px solid var(--linha2)}
.mes-col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:.3rem;min-width:0;height:100%;cursor:default}
.mes-barra{width:min(56px,72%);min-height:0;background:var(--serie-volume);border-radius:6px 6px 0 0;opacity:.85;transition:opacity var(--transicao)}
.mes-col:hover .mes-barra,.mes-col[data-atual] .mes-barra{opacity:1}
.mes-valor{font:500 .75rem/1 var(--sans);color:var(--suave);white-space:nowrap}
.mes-nome{font:.75rem/1 var(--sans);color:var(--apagado);padding-bottom:.35rem}
.mes-col[data-atual] .mes-nome{color:var(--texto)}
/* frente B — Financeiro, Clientes e Resultados (revisão de 24/09) */
/* Visão do mês: um número principal (a sobra) e o resto numa faixa menor; cor só quando há estado */
.fin-destaque{display:grid;grid-template-columns:minmax(15rem,20rem) minmax(0,1fr);gap:.75rem;align-items:stretch}
.fin-principal{display:flex;flex-direction:column;justify-content:center;gap:.35rem;padding:1.1rem 1.25rem;border-radius:14px;background:var(--sup);border:1px solid var(--linha2)}
.fin-principal b{font:500 2.6rem/1 var(--mono);letter-spacing:-.03em;color:var(--texto);font-variant-numeric:tabular-nums}
.fin-principal[data-tom=alerta] b{color:var(--coral)}
.fin-faixas{display:grid;gap:.6rem;align-content:start;min-width:0}
.fin-faixa{display:flex;flex-wrap:wrap;gap:1px;border:1px solid var(--linha);border-radius:14px;overflow:hidden;background:var(--linha)}
.fin-item{flex:1 1 9.5rem;display:flex;flex-direction:column;gap:.2rem;padding:.7rem .85rem;background:var(--sup);color:var(--texto);min-width:0}
a.fin-item:hover{background:var(--sup2);text-decoration:none}
.fin-item b{font:500 1.15rem/1.15 var(--mono);font-variant-numeric:tabular-nums;color:var(--texto)}
.fin-item b small{font:500 .75rem/1 var(--mono);color:var(--apagado)}
.fin-item[data-tom=alerta] b,.fin-item[data-tom=alerta] .fin-sub{color:var(--coral)}
.fin-rotulo{font-size:.78rem;color:var(--suave)}
.fin-sub{font-size:.75rem;color:var(--apagado);overflow-wrap:anywhere}
.fin-aviso{margin:0}
.fin-aviso a{margin-left:.35rem}
@media (max-width:760px){.fin-destaque{grid-template-columns:1fr}.fin-principal b{font-size:2.1rem}}
/* Cobranças: filtros do mês e, depois do separador, os de todos os meses */
.fin-abas{flex-wrap:wrap;align-self:flex-start}
.periodos-sep{width:1px;margin:.3rem .35rem;background:var(--linha2)}
.fin-abas a[data-tom=alerta]{color:var(--coral)}
/* formulários do financeiro e da ficha do cliente: grade que ocupa a largura do bloco */
.form-financeiro{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.75rem 1rem;align-items:end}
.form-financeiro .largo,.form-financeiro .interruptor{grid-column:1/-1}
.form-financeiro>button{justify-self:start}
.form-financeiro .campo-dica{font-size:.75rem;color:var(--apagado)}
.fin-previa{padding:.75rem .9rem;border-radius:10px;border:1px dashed var(--linha2);background:var(--sup2)}
.fin-previa p{margin:.35rem 0 0;white-space:pre-line;font-size:var(--t-md);color:var(--texto)}
.fin-regua-historico{grid-column:1/-1;list-style:none;margin:.5rem 0 0;padding:0;display:grid;gap:.25rem;font-size:.8rem;color:var(--suave)}
.fin-regua-historico li{display:grid;grid-template-columns:8.5rem minmax(0,1fr) auto;gap:.6rem}
.fin-regua-historico b{font-weight:500;color:var(--texto)}
/* Clientes: onboarding, site e domínios vencendo */
.cli-progresso{display:inline-block;vertical-align:middle;width:4.5rem;height:6px;border-radius:99px;background:var(--linha2);overflow:hidden;margin-right:.4rem}
.cli-progresso i{display:block;height:100%;border-radius:inherit;background:var(--menta)}
.cli-onboarding small,.cli-onboarding-rodape small{font:500 .75rem/1 var(--mono);color:var(--suave)}
.cli-apagado{font-size:.8rem;color:var(--apagado)}
.cli-avisos h2{margin:0 0 .5rem;font-size:var(--t-base)}
.cli-avisos ul{margin:0;padding:0;list-style:none;display:grid;gap:.35rem;font-size:var(--t-sm);color:var(--suave)}
.cli-avisos li{padding-left:.75rem;border-left:3px solid var(--ambar)}
.cli-avisos li[data-tom=alerta]{border-left-color:var(--coral)}
.cli-numeros{grid-column:1/-1;margin-bottom:.9rem}
.cli-onboarding-form{grid-column:1/-1;display:grid;gap:.6rem}
.cli-passos{margin:0;padding:0;list-style:none;display:grid;gap:.35rem}
.cli-passo{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.45rem .6rem;border-radius:10px;border:1px solid var(--linha)}
.cli-passo[data-feito]{border-color:color-mix(in srgb,var(--menta) 35%,var(--linha))}
.cli-passo .check-filtro{color:var(--texto);font-size:var(--t-md)}
.cli-passo input[type=date]{padding:.35rem .5rem;font-size:.8rem}
.cli-onboarding-rodape{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.cli-novo{grid-column:1/-1;margin-top:.5rem;border-top:1px solid var(--linha);padding-top:.6rem}
.cli-novo>summary{cursor:pointer;color:var(--suave);font-size:var(--t-sm);margin-bottom:.6rem}
.cli-novo>summary:hover{color:var(--texto)}
.cli-dialogo{width:min(40rem,calc(100% - 2rem))}
.cli-dialogo .form-financeiro h2{margin:0}
.cli-dialogo .dialogo-acoes{display:flex;justify-content:flex-end;gap:.5rem}
@media (max-width:640px){.cli-passo{flex-wrap:wrap}.fin-regua-historico li{grid-template-columns:1fr}}
/* a tabela dentro da rolagem da página não encolhe até sumir (main.cheio .tabela-rolagem tem flex:1 e min-height:0) */
main.cheio .pagina-rolagem>.fin-bloco{flex:none}

/* frente A — vendas e agente (24/09, revisão): só acrescentado, nenhuma regra acima mudou */
.agora-lista li[data-situacao=vencido] time{color:var(--coral)}
.agora-lista li[data-situacao=vencido] .agora-icone{color:var(--coral);background:color-mix(in srgb,var(--coral) 12%,transparent)}
.selo-vendedor{--c:var(--lavanda);color:var(--c);border-color:color-mix(in srgb,var(--c) 35%,transparent);background:color-mix(in srgb,var(--c) 10%,transparent)}
.selo-vendedor[data-ponto=ola]{--c:var(--ardosia)}
.selo-vendedor[data-ponto=apresentacao]{--c:var(--ciano)}
.selo-vendedor[data-ponto=oferta]{--c:var(--ambar)}
.selo-vendedor[data-ponto=followup]{--c:var(--rosa)}
.selo-vendedor[data-ponto=interesse]{--c:var(--coral)}
.selo-modo.selo-vendedor{text-transform:none;letter-spacing:0;font-family:var(--sans)}
.msg-autor{display:block;margin-bottom:.2rem;font:600 .72rem/1.2 var(--sans);color:var(--suave)}
.msg[data-autor=robo] .msg-autor{color:var(--ardosia)}
.msg[data-autor=agente] .msg-autor{color:var(--lavanda)}
.msg[data-autor=joao] .msg-autor{color:var(--ciano)}
.contagem-filtro{margin-left:.25rem;font-variant-numeric:tabular-nums;color:var(--apagado)}
.filtros{flex-wrap:wrap}
.busca-conversas{margin:0}
.busca-conversas input{width:100%}
.form-devolver{margin:0}
.agente-conversa{display:grid;gap:.35rem;border:1px dashed var(--linha);border-radius:10px;padding:.5rem .65rem;background:var(--sup)}
.agente-conversa summary{cursor:pointer;font-size:var(--t-sm);color:var(--suave)}
.agente-conversa .agente-msg{font-size:var(--t-sm);margin-top:.3rem}
.agente-conversa .agente-msg[data-autor=robo],.agente-conversa .agente-msg[data-autor=agente],.agente-conversa .agente-msg[data-autor=joao]{justify-self:end;border-radius:12px 4px 12px 12px;background:color-mix(in srgb,var(--ciano) 10%,var(--sup2))}
.agente-conversa .agente-msg b{font-weight:600;color:var(--suave)}
.barra-agente{margin-top:.6rem}
.barra-agente>a.estado-rotulo{display:inline-flex;align-items:center;gap:.35rem;text-decoration:none;color:var(--suave);font-weight:600}
.barra-agente>a.estado-rotulo:hover{color:var(--texto)}

/* frente D */
/* 24/09: faixa de chip desconectado (alertas.faixa_chip), no mesmo molde da faixa de suporte, e a lista de backups. */
.faixa-espaco[data-tom=coral]{--c:var(--coral)}
.faixa-chip b{font-weight:600}
.tabela-backups td:last-child{text-align:right;white-space:nowrap}
.monitor-lacos .vm-servicos{margin-top:.4rem}
