:root{
  --teal:#57BEB6; --azul:#3A5BA9; --azul-esc:#2B4595; --titulo:#2E4A9E;
  /* teal-texto: versão escura do teal p/ TEXTO em fundo claro (o #57BEB6 puro dá 2.2:1
     de contraste — abaixo do WCAG AA; o claro fica pra bordas, focos e superfícies) */
  --teal-texto:#1F7A72;
  --brand:var(--azul); /* era usado no CSS sem estar definido — caía no inherit */
  --grad:linear-gradient(120deg,#1F7A72,#3A5BA9); /* início escurecido: texto branco legível (AA) na extensão toda */
  --papel:#F6F8FB; --branco:#fff; --borda:#e4e8f0; --corpo:#3c4250; --muted:#667085; /* 4.9:1 no branco (era #7a8190 = 3.9:1) */
  --quente:#e8552d; --morno:#d8920f; --frio:#3A5BA9;
  /* âmbar tem 2,6:1 sobre branco — reprova até no critério de texto grande (3,0).
     Como FUNDO de badge ele está certo (o texto em cima é branco); como TEXTO,
     não. Medido no navegador, não estimado. Este token é só para texto. */
  --morno-txt:#8a5c00; --cinza-txt:#525a6c; --erro-txt:#b02a37; --verde-txt:#166159; /* cinza 6,9:1 · vermelho 5,6:1 · verde 7,0:1 no branco (e 5,86:1 no fundo do .tai-badge, onde --teal-texto dá 4,25 e REPROVA) — tokens de TEXTO criados pelo cético (31/07): estes dois valores já viviam cravados em .tai-bad, .esp-erro, .esp-dif.is-grave e numa tabela de cores dentro do admin.js. O mesmo julgamento em quatro lugares é exatamente como as quatro réguas de "não sei" da Onda 10 passaram a discordar entre si. */
  --side-bg:linear-gradient(185deg,#2f4795 0%,#243a78 55%,#1d2f63 100%);
  --display:'Poppins',sans-serif; --corpo-f:'Inter',sans-serif;
  --side-w:248px;
  /* escala de espaçamento (4/8) */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px;
  /* escala de raio */
  --r-sm:8px; --r-md:10px; --r:12px; --r-lg:16px; --r-pill:999px;
  /* escala de elevação (sombra) */
  --sh-1:0 1px 2px rgba(28,42,80,.06); --sh-2:0 6px 24px rgba(28,42,80,.08); --sh-3:0 18px 44px rgba(20,34,68,.16);
  --sombra:var(--sh-2);
  /* ── APELIDOS DE VARIÁVEL (Onda 3) ─────────────────────────────────────
     As telas das Ondas 1 e 2 foram escritas com nomes que NUNCA existiram
     aqui: --border, --primary, --card, --card-bg, --linha, --texto e
     --fundo-suave somam 51 usos em admin.js e TODOS caem no literal de
     fallback. Fallback não dá erro — é pior: o trecho fica bonito hoje e
     para de acompanhar o tema no dia em que o tema mudar, calado. Corrigir
     51 lugares não impede o 52º de nascer errado; virar apelido, sim.
     NÃO invente variável nova por aqui: em código novo use os nomes reais
     (--borda, --papel, --branco, --corpo, --muted, --titulo, --azul). */
  --border:var(--borda); --linha:var(--borda);
  --card:var(--branco);  --card-bg:var(--branco);
  --primary:var(--azul); --texto:var(--corpo);
  --fundo-suave:var(--papel);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%}
body{font-family:var(--corpo-f);background:var(--papel);color:var(--corpo);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
/* ── Barra de rolagem na cor da marca (gradiente teal→azul), não o cinza do sistema ── */
*{scrollbar-width:thin;scrollbar-color:rgba(87,190,182,.75) transparent} /* Firefox */
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--teal),var(--azul));border-radius:10px;border:3px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(#49aaa2,var(--azul-esc));background-clip:padding-box}
::-webkit-scrollbar-corner{background:transparent}
/* menu (fundo azul-escuro): thumb em teal claro pra contrastar */
.side-nav{scrollbar-color:rgba(127,212,205,.6) transparent}
.side-nav::-webkit-scrollbar{width:9px}
.side-nav::-webkit-scrollbar-thumb{background:rgba(127,212,205,.55);border:2px solid transparent;border-radius:10px;background-clip:padding-box}
.side-nav::-webkit-scrollbar-thumb:hover{background:rgba(127,212,205,.9);background-clip:padding-box}
.brand{font-family:var(--display);font-weight:700;letter-spacing:.3px}
.muted{color:var(--muted)}
.err{color:#d33;font-size:13px;margin:6px 0 0}
.hide-sm{display:inline}

/* ── Acessibilidade: anel de foco por teclado (não aparece no clique de mouse) ── */
button:focus-visible,a:focus-visible,.nav-item:focus-visible,summary:focus-visible,[role="button"]:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--azul);outline-offset:2px;border-radius:8px}
select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--teal);outline-offset:1px}

/* ── Botões ── */
.btn{font-family:var(--corpo-f);font-weight:600;font-size:14px;border:0;border-radius:10px;padding:9px 14px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:transform .08s,filter .15s,background .15s,border-color .15s;color:var(--corpo)}
.btn-grad{background:var(--grad);color:#fff}
.btn-grad:hover{filter:brightness(1.05)}
.btn-ghost{background:#fff;border:1px solid var(--borda)}
.btn-ghost:hover{border-color:#cfd6e2;background:#fbfcfe}
.btn:active{transform:scale(.975)}
.btn:disabled,.btn[disabled]{opacity:.5;cursor:default;pointer-events:none}

/* ── Login ── */
.login{min-height:100dvh;display:grid;place-items:center;padding:24px;background:var(--side-bg)}
.login-card{background:#fff;border-radius:16px;padding:34px 30px;width:100%;max-width:360px;box-shadow:0 20px 60px rgba(20,30,60,.25);text-align:center}
.login-card .brand{font-size:26px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.login-card h1{font-family:var(--display);font-size:20px;margin:6px 0 2px;color:var(--titulo)}
.login-card p{margin:0 0 18px}
.login-card input{width:100%;padding:13px 14px;border:1px solid var(--borda);border-radius:10px;font-size:15px;font-family:var(--corpo-f)}
.login-card input:focus{outline:2px solid var(--teal);border-color:var(--teal)}
.pw-wrap{position:relative;margin-bottom:12px}
.pw-wrap input{padding-right:54px;margin-bottom:0}
.pw-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:transparent;border:0;color:var(--azul);font-family:var(--corpo-f);font-weight:600;font-size:13px;cursor:pointer;padding:6px 10px;border-radius:8px}
.pw-toggle:hover{background:#eef2fb}
.login-card .btn{width:100%;justify-content:center;padding:13px}

/* ── SHELL (sidebar + main) ── */
.shell{display:flex;min-height:100dvh}

.sidebar{width:var(--side-w);flex:none;background:var(--side-bg);color:#fff;display:flex;flex-direction:column;position:sticky;top:0;height:100dvh;z-index:40}
.side-top{display:flex;align-items:center;justify-content:space-between;padding:22px 20px 16px}
.side-brand{display:flex;flex-direction:column;line-height:1.1}
.side-brand .brand{font-size:22px;color:#fff}
.side-tag{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);font-weight:700;margin-top:2px}
.side-close{display:none;background:transparent;border:0;color:#fff;font-size:26px;cursor:pointer;line-height:1}

.side-nav{display:flex;flex-direction:column;gap:2px;padding:8px 12px;flex:1;overflow-y:auto;overflow-x:hidden;min-height:0}
.nav-item{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:transparent;border:0;color:rgba(255,255,255,.78);font-family:var(--corpo-f);font-size:14px;font-weight:500;padding:8px 14px;border-radius:9px;cursor:pointer;position:relative;transition:.15s}
.nav-item svg{width:19px;height:19px;flex:none;opacity:.9}
.nav-item .nav-label{flex:1}
.nav-item:not([disabled]):hover{background:rgba(255,255,255,.10);color:#fff}
.nav-item.active{background:rgba(255,255,255,.14);color:#fff;font-weight:600}
.nav-item.active::before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--teal)}
.nav-item[disabled]{cursor:default;opacity:.62}
.soon{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:rgba(255,255,255,.16);color:rgba(255,255,255,.9);padding:2px 7px;border-radius:999px}

.side-foot{padding:14px 12px}
.side-logout{display:flex;align-items:center;gap:10px;width:100%;background:transparent;border:0;color:rgba(255,255,255,.8);font-family:var(--corpo-f);font-size:14px;font-weight:500;padding:10px 14px;border-radius:10px;cursor:pointer}
.side-logout svg{width:18px;height:18px}
.side-logout:hover{background:rgba(255,255,255,.10);color:#fff}

.side-overlay{position:fixed;inset:0;background:rgba(18,26,52,.5);z-index:35}

/* ── Main ── */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{background:#fff;border-bottom:1px solid var(--borda);display:flex;align-items:center;gap:14px;padding:14px 28px;position:sticky;top:0;z-index:20}
.hamb{display:none;background:transparent;border:0;color:var(--corpo);cursor:pointer;padding:10px;min-width:44px;min-height:44px;align-items:center;justify-content:center} /* alvo de toque ≥44px */
.hamb svg{width:24px;height:24px}
.topbar-title{flex:1;min-width:0}
.topbar-title h1{font-family:var(--display);font-size:20px;color:var(--titulo);margin:0;line-height:1.15}
.topbar-sub{margin:1px 0 0;font-size:13px;color:var(--muted)}
.topbar-actions{display:flex;gap:8px;align-items:center}

/* busca global */
.gsearch{position:relative;display:flex;align-items:center}
.gsearch-ic{position:absolute;left:11px;color:var(--muted);pointer-events:none}
.gsearch-input{width:280px;max-width:38vw;font-family:var(--corpo-f);font-size:13.5px;color:var(--corpo);background:#f5f7fb;border:1px solid var(--borda);border-radius:10px;padding:9px 12px 9px 34px}
.gsearch-input::placeholder{color:var(--muted)}
.gsearch-input:focus{outline:2px solid var(--teal);border-color:var(--teal);background:#fff}
.gsearch-results{position:absolute;top:calc(100% + 6px);left:0;width:420px;max-width:min(92vw,480px);max-height:min(64vh,520px);overflow:auto;background:#fff;border:1px solid var(--borda);border-radius:12px;box-shadow:0 18px 44px rgba(20,34,68,.18);z-index:60;padding:6px}
.gs-group{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-texto);font-weight:700;padding:9px 10px 4px}
.gs-item{display:flex;flex-direction:column;gap:1px;padding:8px 10px;border-radius:8px;cursor:pointer}
.gs-item:hover,.gs-item.sel{background:#eef3fb}
.gs-item b{font-size:13.5px;color:var(--corpo);font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-item span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-empty{padding:16px 12px;text-align:center;color:var(--muted);font-size:13px}

/* menu criar (+) */
.tb-create{position:relative}
.criar-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:230px;background:#fff;border:1px solid var(--borda);border-radius:12px;box-shadow:0 18px 44px rgba(20,34,68,.18);z-index:60;padding:6px}
.criar-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:transparent;border:0;border-radius:8px;padding:9px 10px;cursor:pointer;font-family:var(--corpo-f);font-size:13.5px;color:var(--corpo)}
.criar-item:hover{background:#eef3fb}
.criar-item svg{width:16px;height:16px;color:var(--azul);flex:none}
.criar-empty{padding:14px 12px;color:var(--muted);font-size:12.5px;text-align:center}
@media(max-width:720px){.gsearch-input{width:150px}.gsearch-input:focus{width:220px}}
@media(max-width:520px){.gsearch{display:none}}

.content{padding:24px 28px 60px;flex:1}
.view{animation:fade .2s ease}
@keyframes fade{from{opacity:.4}to{opacity:1}}

/* ── Stats ── */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-4)}
.stat{background:#fff;border:1px solid var(--borda);border-radius:var(--r);padding:16px 18px;box-shadow:var(--sombra)}
.stat .n{font-family:var(--display);font-size:30px;font-weight:700;color:var(--titulo);line-height:1}
.stat .l{font-size:13px;color:var(--muted);margin-top:4px}
.stat.is-quente .n{color:var(--quente)} .stat.is-morno .n{color:var(--morno-txt)} .stat.is-frio .n{color:var(--frio)}

/* ── Filtros ── */
.filters{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.chk-inline{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--corpo);cursor:pointer;white-space:nowrap}
.chk-inline input{cursor:pointer}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pill{border:1px solid var(--borda);background:#fff;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:600;cursor:pointer;color:var(--corpo);transition:.15s}
.pill:hover{border-color:#c8d0de}
.pill.active{background:var(--azul);border-color:var(--azul);color:#fff}
.pill.pill-quente.active{background:var(--quente);border-color:var(--quente)}
.pill.pill-morno.active{background:var(--morno);border-color:var(--morno)}
.select,.search{border:1px solid var(--borda);background:#fff;border-radius:10px;padding:10px 12px;font-size:14px;font-family:var(--corpo-f);color:var(--corpo)}
.search{flex:1;min-width:200px}
.select:focus,.search:focus{outline:2px solid var(--teal);border-color:var(--teal)}

/* ── Tabela ── */
/* .table-wrap era uma regra VAZIA: existia como gancho e não fazia nada — no
   celular a tabela larga empurrava a página inteira para o lado. O scroll
   horizontal fica só na faixa estreita, porque overflow-x cria contexto de
   rolagem e cortaria menu/popover em telão. */
.table-wrap,.tbl-wrap{}
@media (max-width:820px){
  .table-wrap,.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .table-wrap>table,.tbl-wrap>table{min-width:560px}
}
/* .tbl era classe FANTASMA: 11 tabelas em admin.js (Não contatar, Saúde de
   envio, Convites, CNPJ, Lançamento) pediam `class="tbl"` e o arquivo não
   tinha uma regra sequer — saíam como tabela crua do navegador, sem padding,
   sem cabeçalho, sem borda. Em vez de renomear 11 lugares, .tbl entra na
   MESMA família de .leads, com uma diferença de propósito: .leads tem linha
   CLICÁVEL (cursor de mão, abre o registro) e .tbl não. Escolha pelo que a
   tabela faz, não pelo nome que estava mais perto. */
.leads,.tbl{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--borda);border-radius:var(--r);overflow:hidden;box-shadow:var(--sombra)}
.leads th,.tbl th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;padding:14px 16px;border-bottom:1px solid var(--borda);background:#fafbfd}
.leads td,.tbl td{padding:13px 16px;border-bottom:1px solid #eef1f6;vertical-align:middle}
.leads tr:last-child td,.tbl tr:last-child td{border-bottom:0}
.leads tbody tr{cursor:pointer;transition:background .12s}
.leads tbody tr:hover{background:#f7f9fc}
.tbl tbody tr{transition:background .12s}
.tbl tbody tr:hover{background:#f7f9fc}
.cell-emp{font-weight:600;color:var(--titulo)}
.cell-sub{font-size:12.5px;color:var(--muted)}
.cell-emp-logo{display:flex;align-items:center;gap:10px}
.mini-logo{width:38px;height:22px;border-radius:8px;flex:none;background-size:contain;background-repeat:no-repeat;background-position:center;background-color:#f1f4f9}
.mini-logo-letra{display:grid;place-items:center;background:var(--grad);color:#fff;font-weight:700;font-size:12px;font-family:var(--display)}
.when{font-size:13px;color:var(--muted);white-space:nowrap}

.badge{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;color:#fff;white-space:nowrap}
.badge.Quente{background:var(--quente)} .badge.Morno{background:var(--morno)} .badge.Frio{background:var(--frio)} .badge.none{background:#9aa3b2}
.badge.t-cliente{background:#2b8a3e} .badge.t-contato{background:var(--azul)} .badge.t-parceiro{background:var(--teal)} .badge.t-fornecedor{background:var(--morno)} .badge.t-inativo{background:#9aa3b2} .badge.t-interno{background:#6b7280}
.score{font-family:var(--display);font-weight:700;color:var(--titulo)}
.idx{font-weight:600}

.status-sel{border:1px solid var(--borda);border-radius:8px;padding:6px 8px;font-size:13px;font-family:var(--corpo-f);background:#fff;color:var(--corpo);cursor:pointer}
.chev{color:var(--muted);font-size:18px}
.empty{padding:48px 20px;text-align:center;color:var(--muted);background:#fff;border:1px solid var(--borda);border-radius:var(--r);margin-top:14px}
.pager{display:flex;justify-content:center;padding:18px}

/* ── NEGOCIAÇÕES (kanban / funil) ── */
.board-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.board-totals{display:flex;gap:10px;flex-wrap:wrap}
.btot{background:#fff;border:1px solid var(--borda);border-radius:10px;padding:8px 14px;box-shadow:var(--sombra)}
.btot b{font-family:var(--display);color:var(--titulo);font-size:16px}
.btot.ganho b{color:#2b8a3e}
.btot span{color:var(--muted);font-size:12px;display:block}
.board-actions{display:flex;gap:8px;align-items:center}

.kanban{display:flex;gap:14px;overflow-x:auto;padding-bottom:14px;align-items:flex-start}
.kan-col{flex:0 0 264px;width:264px;background:#eef1f7;border-radius:var(--r);display:flex;flex-direction:column;max-height:calc(100dvh - 220px)}
.kan-col.drop-target{outline:2px dashed var(--teal);outline-offset:-2px;background:#e7f5f3}
.kan-head{padding:12px 14px 10px;border-top:3px solid var(--azul);border-radius:var(--r) var(--r) 0 0}
.kan-col.et-contato .kan-head{border-top-color:var(--teal)}
.kan-col.et-proposta .kan-head{border-top-color:var(--morno)}
.kan-col.et-negociacao .kan-head{border-top-color:#8257d8}
.kan-col.et-ganha .kan-head{border-top-color:#2b8a3e}
.kan-col.et-perdida .kan-head{border-top-color:#b02a37}
.kan-head .kh-top{display:flex;align-items:center;justify-content:space-between}
.kan-head h3{font-family:var(--display);font-size:13.5px;color:var(--titulo);margin:0;text-transform:uppercase;letter-spacing:.03em}
.kan-head .kh-count{background:#fff;color:var(--muted);font-size:12px;font-weight:700;border-radius:999px;padding:1px 9px}
.kan-head .kh-val{font-size:12.5px;color:var(--muted);margin-top:3px}
.kan-list{padding:8px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;min-height:60px;flex:1}
.kan-empty{font-size:12.5px;color:var(--muted);text-align:center;padding:14px 8px;border:1px dashed #cdd5e3;border-radius:10px}

.kan-card{background:#fff;border:1px solid var(--borda);border-radius:10px;padding:11px 12px;cursor:grab;box-shadow:0 1px 3px rgba(28,42,80,.06);transition:box-shadow .12s,transform .12s}
.kan-card:hover{box-shadow:0 4px 14px rgba(28,42,80,.12)}
.kan-card.dragging{opacity:.45;cursor:grabbing}
.kan-card .kc-emp{font-weight:600;color:var(--titulo);font-size:14px;line-height:1.25}
.kan-card .kc-sub{font-size:12px;color:var(--muted);margin-top:1px}
.kan-card .kc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:9px}
.kan-card .kc-val{font-family:var(--display);font-weight:700;color:var(--titulo);font-size:14px}
.kan-card .kc-val.zero{color:#b6bdca;font-weight:600}
.badge.mini{font-size:10.5px;padding:2px 8px}

@media(max-width:680px){ .kan-col{flex-basis:232px;width:232px} }

.side-sep{height:1px;background:rgba(255,255,255,.12);margin:10px 14px}
.side-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.45);padding:11px 14px 5px}
.nav-item.nav-sub{width:auto;padding-left:24px;margin-left:16px;border-left:2px solid rgba(87,190,182,.4);border-radius:0 10px 10px 0}
.nav-item.nav-sub svg{width:17px;height:17px;opacity:.8}
.nav-item.nav-sub:not([disabled]):hover{border-left-color:rgba(87,190,182,.7)}
.nav-item.nav-sub.active{border-left-color:var(--teal)}
/* espaçamento entre grupos: cada item "mãe"/avulso ganha respiro do grupo anterior */
.side-nav .nav-item:not(.nav-sub){margin-top:8px}
.side-nav .nav-item:first-child{margin-top:0}
.side-nav .side-label + .nav-item{margin-top:0}

/* ── DASHBOARD ── */
.dash-hero{margin-bottom:var(--sp-4)}
.dash-hero h2{font-family:var(--display);color:var(--titulo);font-size:22px;margin:0}
.dash-hero p{color:var(--muted);margin:4px 0 0}
.dash-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:18px 0 22px}
.kpi{background:#fff;border:1px solid var(--borda);border-radius:var(--r);padding:17px 18px;box-shadow:var(--sombra);border-top:3px solid var(--azul)}
.kpi.k-teal{border-top-color:var(--teal)} .kpi.k-quente{border-top-color:var(--quente)} .kpi.k-verde{border-top-color:#2b8a3e} .kpi.k-morno{border-top-color:var(--morno)}
.kpi .kpi-n{font-family:var(--display);font-size:27px;font-weight:700;color:var(--titulo);line-height:1}
.kpi .kpi-l{font-size:13px;color:var(--muted);margin-top:5px}
.kpi .kpi-sub{font-size:12px;margin-top:6px;color:var(--muted)}
.kpi .kpi-sub b{color:var(--corpo)}
/* resumo dos módulos (Gestão de Tarefas: Serviços/Atividades/TimeSheet/Publicações/Clientes/Projetos) */
.mod-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:12px;margin:18px 0 22px}
.mod-card{position:relative;background:#fff;border:1px solid var(--borda);border-radius:var(--r);padding:15px 16px;box-shadow:var(--sombra);text-align:left;cursor:pointer;font-family:inherit;display:flex;flex-direction:column;gap:3px;transition:box-shadow .12s,border-color .12s,transform .12s}
.mod-card:hover{border-color:#c7d2e5;box-shadow:0 8px 20px rgba(28,42,80,.10);transform:translateY(-1px)}
.mod-card .mod-n{font-family:var(--display);font-size:22px;font-weight:700;color:var(--azul);line-height:1}
.mod-card .mod-l{font-size:13px;font-weight:600;color:var(--titulo)}
.mod-card .mod-sub{font-size:11.5px;color:var(--muted)}
.dash-subhead{font-family:var(--display);font-size:13px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:4px 0 10px}
.dash-cols{display:grid;grid-template-columns:1.25fr 1fr;gap:16px}
.dash-card{background:#fff;border:1px solid var(--borda);border-radius:var(--r);padding:20px;box-shadow:var(--sombra)}
.dash-card h3{font-family:var(--display);font-size:15px;color:var(--titulo);margin:0 0 16px;display:flex;justify-content:space-between;align-items:center}
.dash-card h3 a{font-size:12px;color:var(--azul);font-weight:600;text-decoration:none;cursor:pointer}
.funil{display:flex;flex-direction:column;gap:12px}
.funil-step{display:grid;grid-template-columns:130px 1fr auto;align-items:center;gap:12px}
.funil-step .fl{font-size:13px;color:var(--corpo);font-weight:500}
.funil-bar{height:32px;border-radius:8px;background:var(--grad);display:flex;align-items:center;padding:0 12px;color:#fff;font-weight:700;font-size:13px;min-width:46px}
.funil-step .fv{font-weight:700;color:var(--titulo);font-size:14px;white-space:nowrap}
.funil-conv{font-size:12px;color:var(--muted);margin-top:10px;text-align:center}
.dash-lead{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #eef1f6;cursor:pointer}
.dash-lead:last-child{border-bottom:0}
.dash-lead:hover .dl-emp{color:var(--azul)}
.dash-lead .dl-emp{font-weight:600;color:var(--titulo);font-size:14px}
.dash-lead .dl-sub{font-size:12px;color:var(--muted)}
.dash-lead .dl-right{margin-left:auto;text-align:right}
.dash-empty{color:var(--muted);font-size:13.5px;padding:14px 0;text-align:center}
.dash-period{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.dash-period-lbl{font-size:13px;color:var(--muted);font-weight:600}
.dash-period .pill{padding:6px 14px;font-size:13px}
.dchart{width:100%;height:auto;display:block}
.donut-wrap{display:flex;align-items:center;gap:20px;flex-wrap:wrap;justify-content:center}
.donut{width:140px;height:140px;flex:none}
.donut-leg{display:flex;flex-direction:column;gap:9px}
.leg{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--corpo)}
.leg span{width:12px;height:12px;border-radius:3px;display:inline-block;flex:none}
.leg b{color:var(--titulo);margin-left:2px}
.pipe{display:flex;flex-direction:column;gap:13px}
.pipe-row{display:grid;grid-template-columns:118px 1fr auto;align-items:center;gap:10px}
.pipe-lbl{font-size:13px;color:var(--corpo);font-weight:500}.pipe-lbl small{color:var(--muted);font-weight:400}
.pipe-track{height:14px;background:#eef1f6;border-radius:999px;overflow:hidden}
.pipe-bar{height:100%;background:var(--grad);border-radius:999px}
.pipe-val{font-weight:700;color:var(--titulo);font-size:13px;white-space:nowrap}
/* grade uniforme p/ gráficos (linhas e colunas com o mesmo respiro) */
.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.gr-charts .dash-card{display:flex;flex-direction:column}
.gr-charts .donut-wrap{padding:6px 0 2px}
/* resumo em linhas limpas (sem barra cinza vazia) */
.gr-stats{display:flex;flex-direction:column}
.gr-stat{display:flex;justify-content:space-between;align-items:center;padding:12px 2px;border-bottom:1px dashed #eef1f6;font-size:14px;color:var(--corpo)}
.gr-stat:last-child{border-bottom:0}
.gr-stat b{font-family:var(--display);font-size:19px;font-weight:700;color:var(--titulo);line-height:1}
.gr-stat b.gr-atras{color:#e8552d}.gr-stat b.gr-ok{color:#2b8a3e}
@media(max-width:820px){.dash-cols,.dash-grid{grid-template-columns:1fr}}

/* ── ATIVIDADES / TAREFAS ── */
.ativ-group{margin-bottom:22px}
.ativ-group h3{font-family:var(--display);font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:0 0 10px;display:flex;align-items:center;gap:8px}
.ativ-group h3 .cnt{background:#fff;border:1px solid var(--borda);border-radius:999px;padding:1px 9px;font-size:12px}
.ativ-group.atrasada h3{color:var(--quente)}
.ativ-list{display:flex;flex-direction:column;gap:8px}
.ativ{display:flex;align-items:flex-start;gap:12px;background:#fff;border:1px solid var(--borda);border-radius:12px;padding:12px 14px;box-shadow:0 1px 3px rgba(28,42,80,.05)}
.ativ.done{opacity:.62}
.ativ.atrasada{border-left:3px solid var(--quente)}
.ativ-check{width:20px;height:20px;border:2px solid #c8d0de;border-radius:8px;flex:none;margin-top:1px;cursor:pointer;display:grid;place-items:center;background:#fff}
.ativ-check.on{background:#2b8a3e;border-color:#2b8a3e}
.ativ-check svg{width:13px;height:13px;color:#fff;display:none}
.ativ-check.on svg{display:block}
.ativ-main{flex:1;min-width:0}
.ativ-tit{font-weight:600;color:var(--titulo);cursor:pointer}
.ativ.done .ativ-tit{text-decoration:line-through;color:var(--muted)}
.ativ-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px;font-size:12.5px;color:var(--muted);align-items:center}
.chip{display:inline-flex;align-items:center;gap:5px;background:#f1f4f9;border-radius:999px;padding:2px 9px;font-size:12px;color:var(--corpo)}
.chip.serv{background:#e7f5f3;color:#2b6f68}
.chip.rec{background:#eaf7f5;color:#1f8a80;font-weight:700;padding-left:7px;padding-right:7px}
.chip.proj{background:#eef1fb;color:#3A5BA9;font-weight:600}
.chip.proj.chip-link{cursor:pointer}.chip.proj.chip-link:hover{background:#e1e7f9}
.pz{font-weight:600}
.pz.atras{color:var(--quente)} .pz.hoje{color:var(--morno-txt)}
.prio{width:8px;height:8px;border-radius:50%;display:inline-block}
.prio.alta{background:var(--quente)} .prio.media{background:var(--morno)} .prio.baixa{background:#9aa3b2}

/* ── SERVIÇOS (catálogo) ── */
.serv-pilar{margin-bottom:24px}
.serv-pilar h3{font-family:var(--display);color:var(--titulo);font-size:15px;margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--borda)}
.serv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.serv-card{background:#fff;border:1px solid var(--borda);border-radius:12px;padding:14px 16px;cursor:pointer;box-shadow:var(--sombra);transition:.12s}
.serv-card:hover{border-color:var(--teal);transform:translateY(-2px)}
.serv-card .sc-nome{font-weight:600;color:var(--titulo)}
.serv-card .sc-meta{font-size:12.5px;color:var(--muted);margin-top:8px;display:flex;justify-content:space-between;align-items:center}
.serv-tipo{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:2px 8px;border-radius:999px}
.serv-tipo.projeto{background:#eef2fb;color:var(--azul)} .serv-tipo.recorrente{background:#e7f5f3;color:#2b6f68}

/* flag de tarefa no card do funil */
.kc-flag{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:2px 7px;border-radius:999px;margin-top:8px}
.kc-flag.atras{background:#fdece7;color:var(--quente)}
.kc-flag.sem{background:#f1f4f9;color:#8a93a3}
.kc-flag.ok{background:#e7f5ee;color:#2b8a3e}

/* ── PROPOSTAS ── */
.badge.s-rascunho{background:#9aa3b2} .badge.s-enviada{background:var(--azul)} .badge.s-aceita{background:#2b8a3e} .badge.s-recusada{background:#b02a37}
.badge.p-rascunho{background:#9aa3b2} .badge.p-enviada{background:var(--azul)} .badge.p-respondida{background:#2b8a3e}
/* ── HISTÓRICO DE NEGOCIAÇÕES ── */
.badge.s-aberta{background:var(--azul)} .badge.s-ganha{background:#2b8a3e} .badge.s-perdida{background:#b02a37}
.btn-del{background:#fff;border:1px solid #f0c4c9;color:#b02a37}
.btn-del:hover{background:#fdeef0}
.badge.u-owner{background:#b8860b} .badge.u-admin{background:var(--azul)} .badge.u-membro{background:#6b7280}
.side-user{display:flex;align-items:center;gap:10px;padding:8px 6px 12px}
.side-user .su-av{width:32px;height:32px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-weight:700;font-size:14px;flex:none}
.side-user .su-meta{min-width:0}
.side-user .su-nome{font-size:13px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-user .su-papel{font-size:11px;color:rgba(255,255,255,.6)}

/* ── Editor de playbooks (drawer de serviço) — sanfona ── */
.pb-card{background:#fbfcfe;border:1px solid var(--borda);border-radius:12px;margin-bottom:10px;overflow:hidden}
.pb-summary{display:flex;align-items:center;gap:9px;width:100%;background:transparent;border:0;cursor:pointer;padding:11px 14px;text-align:left;font:inherit}
.pb-summary:hover{background:#f4f7fc}
.pb-chev{display:inline-block;font-size:14px;color:#9aa4b5;transition:transform .15s}
.pb-card.open .pb-chev{transform:rotate(90deg)}
.pb-summary-nome{font-weight:600;color:var(--titulo);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pb-summary-meta{font-size:12px;color:#8b93a3;white-space:nowrap}
.pb-body{padding:0 14px 14px}
.pb-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.pb-head .pb-nome{flex:1;font-weight:600;color:var(--titulo);padding:8px 10px}
.pb-steps{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.pb-step{background:#fff;border:1px solid var(--borda);border-radius:10px;padding:8px}
.pb-step .pb-tit{width:100%;padding:7px 9px;font-size:13.5px;margin-bottom:6px}
.pb-step-meta{display:grid;grid-template-columns:1fr 64px 1fr 22px;gap:6px;align-items:center}
.pb-step-meta .select,.pb-step-meta .in{padding:6px 7px;font-size:12.5px;width:100%}
.pb-rm{background:transparent;border:0;color:#b6bdca;cursor:pointer;font-size:17px;line-height:1}
.pb-rm:hover{color:var(--quente)}
.pb-foot{display:flex;align-items:center;gap:10px;margin-top:8px}
.dash-ativ{border-radius:10px;cursor:pointer;transition:background .12s}
.dash-ativ:hover{background:#f4f7fc}

/* ── Atividades estilo Planner ── */
.prio.urgente{background:#b02a37}
.ativ-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.ativ-tabs{display:inline-flex;background:#eef1f6;border-radius:10px;padding:3px}
.ativ-tab{border:0;background:transparent;padding:7px 16px;border-radius:8px;font-family:var(--corpo-f);font-size:14px;font-weight:600;color:var(--muted);cursor:pointer}
.ativ-tab.active{background:#fff;color:var(--titulo);box-shadow:var(--sombra)}
.ativ-tab .tab-cnt{display:inline-block;min-width:18px;padding:0 5px;margin-left:4px;border-radius:9px;background:rgba(0,0,0,.08);font-size:11px;font-weight:700;line-height:17px;text-align:center;vertical-align:middle}
.ativ-tab.active .tab-cnt{background:var(--teal,#0ea5a3);color:#fff}
#pesqTabs{margin-bottom:var(--sp-4)}
/* Suporte · página-mãe (novidades) */
.nov-row{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid var(--borda);cursor:pointer;font-size:13.5px}
.nov-row:last-child{border-bottom:0}
.nov-row:hover{background:#fafbfe}
.nov-row .nov-dot{width:8px;height:8px;border-radius:50%;margin-top:5px;flex:none}
.nov-row .nov-main{flex:1;min-width:0}
.nov-row .nov-t{color:var(--titulo);font-weight:600;display:block}
.nov-row .nov-sub{color:var(--muted);font-size:12px}
.ativ-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ativ-grp{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.ativ-grp .select{width:auto}
/* board */
.aboard{display:flex;gap:14px;overflow-x:auto;padding-bottom:8px;align-items:flex-start}
.acol{flex:0 0 270px;background:#f6f8fb;border:1px solid var(--borda);border-radius:12px;padding:10px;display:flex;flex-direction:column}
.acol-head{display:flex;align-items:center;justify-content:space-between;font-family:var(--display);font-size:13.5px;color:var(--titulo);font-weight:600;padding:2px 4px 10px}
.acol-cnt{background:#e6eaf2;color:var(--muted);border-radius:999px;padding:1px 8px;font-size:12px;font-weight:700}
.acol-body{display:flex;flex-direction:column;gap:9px;min-height:30px;border-radius:10px;transition:background .12s}
.acol-body.over{background:#e6eefb;outline:2px dashed #b6c6ea}
.acol-vazio{color:#c2c9d6;text-align:center;font-size:13px;padding:10px}
.acol-add{margin-top:8px;border:0;background:transparent;color:var(--muted);font-size:13px;text-align:left;padding:6px 4px;cursor:pointer;border-radius:8px}
.acol-add:hover{background:#eef1f6;color:var(--azul)}
.acard{background:#fff;border:1px solid var(--borda);border-radius:10px;padding:11px 12px;box-shadow:0 1px 3px rgba(28,42,80,.05);cursor:grab}
.acard.dragging{opacity:.5}
.acard.atras{border-left:3px solid var(--quente)}
.acard.done{opacity:.7}
.acard-top{display:flex;align-items:flex-start;gap:9px}
.ach-check{width:19px;height:19px;border:2px solid #c8d0de;border-radius:8px;flex:none;margin-top:1px;cursor:pointer;display:grid;place-items:center;background:#fff}
.ach-check.on{background:#2b8a3e;border-color:#2b8a3e}
.ach-check svg{width:12px;height:12px;color:#fff;display:none}
.ach-check.on svg{display:block}
.acard-tit{font-weight:600;color:var(--titulo);font-size:13.5px;line-height:1.35;cursor:pointer}
.acard.done .acard-tit{text-decoration:line-through;color:var(--muted)}
.acard-tags{display:flex;flex-wrap:wrap;gap:5px;margin:7px 0 0 28px}
.atag{background:#fff3df;color:#b9790a;border-radius:8px;padding:1px 8px;font-size:11px;font-weight:600}
.acard-meta{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:8px 0 0 28px;font-size:12px}
.chip.ck{background:#eef5ee;color:#2b6f43}
.acard-resp{display:flex;align-items:center;gap:7px;margin:8px 0 0 28px;font-size:12px;color:var(--muted)}
.aav{width:20px;height:20px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:700;flex:none}
/* lista */
.badge.sttag{font-size:11px}
.leads tr.lrow-done .cell-emp{text-decoration:line-through;color:var(--muted)}
/* calendário */
.cal-bar{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.cal-titulo{font-size:17px;margin-left:6px;text-transform:capitalize}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--borda);border:1px solid var(--borda);border-radius:12px;overflow:hidden}
.cal-dow{background:#f6f8fb;text-align:center;padding:7px 0;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600}
.cal-cell{background:#fff;min-height:96px;padding:6px;cursor:pointer;transition:background .1s}
.cal-cell:hover{background:#fafbfe}
.cal-cell.fora{background:#fbfcfd}.cal-cell.fora .cal-num{color:#c2c9d6}
.cal-cell.hoje .cal-num{background:var(--azul);color:#fff}
.cal-num{font-size:12px;color:var(--corpo);width:22px;height:22px;display:grid;place-items:center;border-radius:50%;font-weight:600;margin-bottom:2px}
.cal-task{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--corpo);background:#eef2fb;border-radius:8px;padding:2px 6px;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-task .cal-dot{width:6px;height:6px;border-radius:50%;flex:none}
.cal-task.done{text-decoration:line-through;color:var(--muted);background:#f1f4f9}
.cal-task.atras{background:#fdeee9;color:#b02a37}
.cal-mais{font-size:11px;color:var(--muted);padding:0 6px}
/* checklist no editor */
.ck-item{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.ck-check{width:18px;height:18px;border:2px solid #c8d0de;border-radius:5px;flex:none;cursor:pointer;display:grid;place-items:center;background:#fff}
.ck-check.on{background:#2b8a3e;border-color:#2b8a3e}
.ck-check svg{width:11px;height:11px;color:#fff;display:none}.ck-check.on svg{display:block}
.ck-txt{flex:1;padding:7px 9px;font-size:13px}
.ck-rm{background:transparent;border:0;color:#b6bdca;cursor:pointer;font-size:16px;line-height:1}.ck-rm:hover{color:var(--quente)}
@media(max-width:680px){.cal-cell{min-height:64px}.cal-task{font-size:10px}}
/* multi-responsáveis + avatares */
.resp-multi{display:flex;flex-wrap:wrap;gap:6px 14px;border:1px solid var(--borda);border-radius:10px;padding:10px;max-height:130px;overflow:auto;background:#fff}
.resp-chk{display:flex;align-items:center;gap:7px;font-size:13.5px;color:var(--corpo);cursor:pointer}
.resp-chk input{width:16px;height:16px;accent-color:var(--azul)}
.aavs{display:inline-flex}
.aavs .aav{margin-left:-6px;border:2px solid #fff;box-shadow:0 0 0 1px var(--borda)}
.aavs .aav:first-child{margin-left:0}
.aav.more{background:#cdd5e2;color:var(--titulo)}
/* etapa do playbook: 2ª linha (responsável + subtarefas) */
.pb-step-meta2{display:grid;grid-template-columns:140px 1fr;gap:6px;margin-top:6px}
.pb-step-meta2 .select,.pb-step-meta2 .in{padding:6px 7px;font-size:12.5px;width:100%}
/* apontamentos (timesheet dentro da tarefa) */
.apont{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed #eef1f6;font-size:13px}
.apont-info b{color:var(--titulo)}
.apont-rm{background:transparent;border:0;color:#b6bdca;cursor:pointer;font-size:16px;line-height:1}.apont-rm:hover{color:var(--quente)}
/* +Data no formulário: a coluna extra entrou aqui (era 64px 64px 1fr auto) */
.apont-add{display:grid;grid-template-columns:118px 64px 64px 1fr auto;gap:6px;margin-top:10px;align-items:end}
.apont-add .in{padding:7px 8px;font-size:13px}
.apont-hm{display:flex;flex-direction:column;gap:3px;font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.apont-acoes{display:inline-flex;gap:4px;flex:none}
.apont-ed{background:transparent;border:0;color:#b6bdca;cursor:pointer;font-size:13px;line-height:1}.apont-ed:hover{color:var(--teal,#1a8f9e)}
.apont-fat{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--corpo);cursor:pointer}
.apont-fat input{margin:0}
/* editor inline de um lançamento (mesmo bloco nas duas telas) */
.apont-edit{display:grid;grid-template-columns:118px 64px 64px 1fr auto auto auto;gap:6px;align-items:end;padding:8px;background:#f7f9fc;border:1px solid #e6ebf3;border-radius:10px}
.apont-edit .in{padding:7px 8px;font-size:13px}
.apont-edit .apont-fat{align-self:center;white-space:nowrap}
@media (max-width:820px){.apont-add,.apont-edit{grid-template-columns:1fr 1fr;}}
/* cronômetro */
.crono{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 0 12px;border-bottom:1px dashed #eef1f6;margin-bottom:8px}
.crono-on{background:#f2fbf4;border:1px solid #cfe9d6;border-radius:10px;padding:9px 12px;border-bottom:1px solid #cfe9d6}
.crono-num{font-variant-numeric:tabular-nums;font-weight:700;font-size:16px;color:var(--titulo);letter-spacing:.02em}
.crono-dot{width:9px;height:9px;border-radius:50%;background:#2b8a3e;flex:none;animation:cronoPulse 1.6s ease-in-out infinite}
@keyframes cronoPulse{0%,100%{opacity:1}50%{opacity:.25}}
.crono-hint,.crono-outro{font-size:11.5px;color:var(--muted)}
.ts-crono{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#f2fbf4;border:1px solid #cfe9d6;border-radius:12px;padding:11px 14px;margin:0 0 14px;font-size:13px}
.ts-crono .crono-num{margin-left:auto}
/* faturável vs interno */
.tag-int{display:inline-block;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:#6b7280;background:#eef1f6;border-radius:20px;padding:2px 8px;margin-left:6px}
.tag-fat{display:inline-block;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:#2b8a3e;background:#e8f6ec;border-radius:20px;padding:2px 8px}
/* faixa faturável pintada por dentro da barra do projeto — o position:relative fica
   ESCOPADO em .ts-proj p/ não mexer nas barras das outras telas que usam .pipe */
.ts-proj .pipe-bar{position:relative;overflow:hidden}
.pipe-fat{position:absolute;inset:0 auto 0 0;background:rgba(255,255,255,.45);border-right:1px solid rgba(255,255,255,.75)}
.pipe-row.ts-proj{cursor:pointer;border-radius:8px;padding:2px 4px;margin:0 -4px;transition:background .12s}
.pipe-row.ts-proj:hover{background:#f3f6fb}
.pipe-row.ts-proj:hover .pipe-lbl{color:var(--azul)}
.ts-acoes{white-space:nowrap}
.ts-ed{background:transparent;border:0;color:#b6bdca;cursor:pointer;font-size:13px;line-height:1}.ts-ed:hover{color:var(--teal,#1a8f9e)}
.ts-edcell{padding:8px !important}
.badge-etapa{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--corpo);background:#f1f4f9;border-radius:20px;padding:2px 9px 2px 7px;margin-left:2px;white-space:nowrap}
.badge-etapa::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--c,#9aa3b2);flex:none}
.dot-etapa{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}
.alerta-retrabalho{background:#fdf3e7;border:1px solid #f3d9ab;color:#8a5a12;border-radius:10px;padding:8px 12px;font-size:12.5px;margin:0 0 14px}
.ts-del{background:transparent;border:0;color:#b6bdca;cursor:pointer;font-size:16px;line-height:1}.ts-del:hover{color:var(--quente)}
/* timesheet: barra de cliente clicável + tabela de lançamentos rolável */
.pipe-row.ts-cli{cursor:pointer;border-radius:8px;padding:2px 4px;margin:0 -4px;transition:background .12s}
.pipe-row.ts-cli:hover{background:#f3f6fb}
.pipe-row.ts-cli:hover .pipe-lbl{color:var(--azul)}
.ts-scroll{max-height:340px;overflow:auto;margin:-4px -6px -6px}
table.leads.compact{font-size:12.5px}
table.leads.compact th,table.leads.compact td{padding:7px 9px}
table.leads.compact thead th{position:sticky;top:0;background:#fff;z-index:1}
/* publicações / calendário editorial */
.pub-legendas{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0 0 16px;font-size:12.5px;color:var(--corpo)}
.pub-legenda{display:inline-flex;align-items:center;gap:5px}.pub-legenda b{color:var(--titulo)}
.pub-canal{display:inline-block;color:#fff;font-size:10.5px;font-weight:700;border-radius:8px;padding:2px 8px;white-space:nowrap}
.pub-task .cal-dot{width:8px;height:8px}
tr[data-edit]{cursor:pointer}
/* mini-lista de publicações no drawer do cliente */
.pub-mini{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px dashed #eef1f6;cursor:pointer}
.pub-mini:hover{background:#f8fafc}
.pub-mini-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.pub-mini-info b{font-size:13px;color:var(--titulo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pub-mini-info .cell-sub{font-size:11.5px}
/* projetos (cards no drawer do cliente) */
.proj-card{border:1px solid var(--borda);border-radius:10px;padding:11px 12px;margin-bottom:9px;cursor:pointer;transition:box-shadow .12s,border-color .12s}
.proj-card:hover{border-color:#c7d2e5;box-shadow:var(--sombra)}
.proj-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.proj-top b{font-size:13.5px;color:var(--titulo)}
.proj-bar{height:7px;border-radius:999px;background:#eef1f6;overflow:hidden;margin:8px 0 5px}
.proj-bar>span{display:block;height:100%;border-radius:999px;background:var(--grad)}
.proj-sub{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--muted)}
.proj-servs{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.chip-sm{background:#eef2f8;color:var(--corpo);font-size:11px;border-radius:8px;padding:2px 8px}
/* plano de marketing no painel (drawer do lead) */
.plano-head{display:flex;align-items:center;gap:14px;margin-bottom:4px}
.plano-idx{font-family:var(--display);font-size:34px;font-weight:700;color:var(--azul);line-height:1}
.plano-idx i,.pdim-top b i{font-style:normal;color:var(--muted)}
.plano-idx i{font-size:15px}
.plano-head b{font-size:15px;color:var(--titulo)}
.plano-radar{display:block;width:230px;max-width:100%;height:auto;margin:4px auto 12px}
.pdims{display:flex;flex-direction:column;gap:11px}
.pdim-top{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--corpo)}
.pdim-top b{color:var(--titulo);font-size:13px}.pdim-top b i{font-size:11px}
.pdim-bar{height:7px;border-radius:999px;background:#eef1f6;overflow:hidden;margin-top:4px}
.pdim-bar>span{display:block;height:100%;border-radius:999px;background:var(--grad)}
.pdim-desc{font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.4}
.plano-verba{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;padding:11px 13px;background:#f3f6fb;border-radius:10px}
.plano-verba .pv-l{font-size:12.5px;color:var(--muted)}.plano-verba .pv-v{font-weight:700;color:var(--titulo)}
.plano-recs{margin-top:14px}.plano-recs h4{font-size:13px;color:var(--titulo);margin:0 0 8px}
/* status customizados (etiquetas + config) */
.stchip{display:inline-block;color:#fff;font-size:11px;font-weight:700;border-radius:8px;padding:2px 9px;white-space:nowrap}
.stdot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:6px;vertical-align:middle}
.acol-lbl{display:inline-flex;align-items:center}
.st-row{display:grid;grid-template-columns:34px 1fr 130px 26px 26px 26px;gap:6px;align-items:center;margin-bottom:8px}
.st-cor{width:34px;height:34px;border:1px solid var(--borda);border-radius:8px;padding:2px;background:#fff;cursor:pointer}
.st-row .in,.st-row .select{padding:7px 8px;font-size:13px}
.st-mv,.st-del{background:#f1f4f9;border:1px solid var(--borda);border-radius:8px;cursor:pointer;height:30px;color:var(--corpo);font-size:14px}
.st-mv:disabled{opacity:.4;cursor:default}
.st-del{color:#b02a37;border-color:#f0c4c9;background:#fff}.st-del:hover{background:#fdeef0}
.st-novo{display:grid;grid-template-columns:1fr 130px auto;gap:6px;margin-top:14px;padding-top:12px;border-top:1px solid var(--borda)}
/* subserviços (dentro do editor de serviço) — cada um é uma sanfona: resumo (nome + descrição +
   nº de playbooks) que expande pra edição + playbooks daquele subserviço, mesmo padrão do pb-card */
.sub-search{width:100%;margin-bottom:12px}
.sub-count{font-size:12px;color:var(--muted);font-weight:400}
.sub-item{border:1px solid var(--borda);border-radius:10px;margin-bottom:8px;overflow:hidden}
.sub-summary{display:flex;align-items:center;gap:10px;width:100%;background:transparent;border:0;cursor:pointer;padding:11px 14px;text-align:left;font:inherit}
.sub-summary:hover{background:#f4f7fc}
.sub-item.open .sub-summary{background:#f8fafc;border-bottom:1px solid var(--borda)}
.sub-item.open .pb-chev{transform:rotate(90deg)}
.sub-summary-nome{font-weight:600;color:var(--titulo);flex:none;max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sub-summary-desc{font-size:12.5px;color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sub-summary-meta{font-size:12px;color:#8b93a3;white-space:nowrap;flex:none}
.sub-body{padding:12px 14px 14px}
.sub-edit{display:grid;grid-template-columns:1fr 1.4fr auto 26px;gap:6px;align-items:center;margin-bottom:16px}
.sub-edit .in{padding:7px 8px;font-size:13px}
.sub-del{background:#f1f4f9;border:1px solid var(--borda);border-radius:8px;cursor:pointer;height:30px;width:30px;color:#b02a37;font-size:14px}
.sub-del:hover{background:#fdeef0;border-color:#f0c4c9}
.sub-pb-head{font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.sub-pb-list .pb-card{margin-bottom:8px}
.sub-pb-novo{margin-top:4px}
.sub-novo{display:grid;grid-template-columns:1fr 1.4fr auto;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid var(--borda)}
.sub-empty{font-size:12.5px}

/* ── Tempo dedicado por função (drawer do cliente) ── */
.badge.u-func{background:#e8edf6;color:#3A5BA9}
.tf-list{display:flex;flex-direction:column;gap:12px}
.tf-row{}
.tf-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.tf-nome{font-weight:600;font-size:13.5px;color:var(--corpo)}
.tf-min{font-weight:700;font-size:13px;color:var(--azul);white-space:nowrap}
.tf-bar{height:8px;border-radius:999px;background:#eef1f6;overflow:hidden;margin:5px 0 4px}
.tf-bar>span{display:block;height:100%;border-radius:999px;background:var(--grad)}
.tf-usu{font-size:12px;color:var(--corpo)}

/* ── Pesquisas / briefings ── */
.pesq-form{margin-bottom:16px}
.pesq-checklist{display:grid;grid-template-columns:1fr 1fr;gap:14px 22px}
.pesq-grupo-t{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;margin-bottom:6px}
.pesq-check{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:13.5px;color:var(--corpo);cursor:pointer}
.pesq-check input{width:16px;height:16px;flex:none;accent-color:var(--azul)}
.erro-msg{color:#b02a37;font-size:13px;margin:10px 0 0}
.tags{display:flex;flex-wrap:wrap;gap:7px}
.tag{background:#eef2fb;color:var(--titulo);border-radius:8px;padding:4px 10px;font-size:12.5px;font-weight:600}
.resp-sec{margin-bottom:16px}
.resp-sec h4{font-family:var(--display);font-size:13.5px;color:var(--azul);margin:0 0 8px}
.resp-item{padding:8px 0;border-bottom:1px dashed #eef1f6}
.resp-q{font-size:12.5px;color:var(--muted);margin-bottom:2px}
.resp-a{font-size:14px;color:var(--corpo);white-space:pre-wrap}
@media(max-width:680px){.pesq-checklist{grid-template-columns:1fr}}
.linkbox{display:flex;gap:8px;align-items:center;background:#f4f7fc;border:1px solid var(--borda);border-radius:10px;padding:8px 10px;margin-bottom:8px}
.linkbox input{flex:1;border:0;background:transparent;font-size:12.5px;color:var(--corpo);font-family:var(--corpo-f);min-width:0;outline:none}
.pitem{display:grid;grid-template-columns:60px 1fr 84px 74px 78px 20px;gap:8px;align-items:center;padding:8px 0}
.pi-grip{cursor:grab;color:#c0c6d2;font-size:15px;line-height:1;user-select:none;text-align:center}
.pi-grip:active{cursor:grabbing}
/* ONDA 21 · mover de fase pelo TECLADO. Arrastar-e-soltar HTML5 não tem
   história de teclado nenhuma; sem estes dois botões quem não usa mouse ficava
   sem nenhuma forma de organizar as fases. 24px de alvo mínimo e foco visível. */
.pi-mover{display:inline-flex;align-items:center;gap:1px;justify-content:center}
.pi-fase-nav{background:transparent;border:0;color:#8b93a3;cursor:pointer;font-size:11px;line-height:1;padding:5px 3px;border-radius:6px;min-width:18px}
.pi-fase-nav:hover:not(:disabled){color:var(--azul);background:#eef2fb}
.pi-fase-nav:focus-visible{outline:2px solid var(--teal);outline-offset:1px;color:var(--azul)}
.pi-fase-nav:disabled{opacity:.25;cursor:default}
/* o draggable saiu do cartão e veio para o grip (era por isso que o arrasto
   nunca começava): o alvo do gesto tem de ser confortável. */
.pi-grip[draggable=true]{padding:3px 2px;border-radius:6px}
.pi-grip[draggable=true]:hover{background:#eef2fb;color:var(--azul)}
/* nome da fase — agora é editável, porque a fase virou entidade (v214) */
.pfase-info-in{font-family:var(--corpo-f);font-size:12.5px;font-weight:600;color:var(--titulo);border:1px solid transparent;border-radius:8px;padding:3px 7px;background:transparent;max-width:280px;flex:1 1 140px;min-width:90px}
.pfase-info-in:hover{border-color:var(--borda);background:#fff}
.pfase-info-in:focus{outline:2px solid var(--teal);border-color:var(--teal);background:#fff}
/* 2º CONSERTO DE CONTRASTE (04/08) — o outro cético trocou o #aab2c0 do
   `.pfase-vazia`; este SOBROU com o mesmo valor, 2,13:1. Não é decoração: com a
   fase vazia (o caso normal agora que as fases aparecem sempre) o placeholder
   "Nome da fase (ex.: Fundação · meses 1-3)" é o ÚNICO texto que diz para que
   serve o campo. O `aria-label` salva o leitor de tela e não salva quem enxerga
   pouco. Mesmo token, mesma medida: --muted = #667085 = 4,97:1 no branco. */
.pfase-info-in::placeholder{font-weight:400;color:var(--muted)}
/* fases (buckets) no editor da proposta */
.pfase{border:1px solid var(--borda);border-radius:12px;padding:10px 12px;margin-bottom:10px;background:#fbfcfe}
.pfase.drop-over{border-color:var(--teal);background:#f0faf8;box-shadow:0 0 0 2px rgba(87,190,182,.25)}
.pfase-h{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:4px}
/* CONSERTO DE CONTRASTE (05/08, achado do navegador da Onda 22 e PRE-EXISTENTE):
   branco 10,5px bold sobre a ponta teal #57BEB6 dava 2,22:1 — e o texto COMECA
   na ponta ruim. Varri o gradiente inteiro em 101 passos: minimo 2,22 em t=0%.
   Escurecendo so a ponta teal para #2C7A73 o minimo do gradiente inteiro vai a
   5,07:1 (medido nos mesmos 101 passos), e a identidade teal->azul continua.
   A regra era byte-identica a de base-pre-onda21 — nao e regressao desta onda. */
.pfase-tag{background:linear-gradient(135deg,#2C7A73,#3A5BA9);color:#fff;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:4px 11px;border-radius:20px;white-space:nowrap}
.pfase-tag.none{background:#eef2fb;color:var(--azul)}
.pfase-info{font-size:12.5px;font-weight:600;color:var(--titulo)}
.pfase-mes{font-size:11.5px;color:var(--muted);margin-left:auto;display:inline-flex;align-items:center;gap:5px}
.pfase-mes-sel{font-family:var(--corpo-f);font-size:12px;font-weight:600;color:var(--azul);border:1px solid var(--borda);border-radius:8px;padding:3px 6px;background:#fff;cursor:pointer}
.pfase-mes-sel:focus{outline:2px solid var(--teal);border-color:var(--teal)}
.pfase-rm{background:transparent;border:0;color:var(--muted);cursor:pointer;font-size:12px;font-weight:600;padding:2px 6px;border-radius:8px}
.pfase-rm:hover{color:var(--quente);background:#fbe9ec}
.pfase-drop{min-height:20px}
/* CONSERTO DO CÉTICO (04/08) — #aab2c0 no branco dá 2,13:1, menos da metade do
   mínimo de 4,5:1, e o TEXTO desta regra é "Vazia — arraste um serviço pelo ⠿":
   é a única instrução de como usar o arrasta-e-solta na tela, e ela estava
   praticamente invisível. O dono desta onda abriu o pedido dizendo que "o
   sistema arrasta e solta não está funcionando" — quem não enxerga a instrução
   conclui exatamente isso. Trocado pelo token --muted (#667085 = 4,97:1), o
   mesmo que a frente dos blocos usou nos rótulos dela. Medido, não estimado. */
.pfase-vazia{font-size:12px;color:var(--muted);text-align:center;padding:12px 0;margin:0;border:1.5px dashed #dfe4ee;border-radius:8px}
.pitem-card[draggable=true]{cursor:default}
.pitem-card.dragging{opacity:.45}
.pfase-add{width:100%;justify-content:center}
.pitem.pitem-head{font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding-bottom:6px;border-bottom:1px solid #eef1f6}
.pitem.pitem-head span{font-weight:600}
.pitem .pi-parc:disabled{opacity:.45}
.pitem-card{border-bottom:1px solid #eef1f6;padding-bottom:10px;margin-bottom:4px}
.pitem-card .pitem{padding-bottom:4px}
.pi-desc{font-size:13px;line-height:1.45;padding:7px 9px;margin-top:2px;background:#fbfcfe}
.ed-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.ed-head h3{margin:0}
.btn-sm{padding:6px 11px;font-size:12.5px}

/* ── Editor de proposta (página inteira) ── */
.prop-edit{max-width:1080px}
.prop-edit-bar{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.prop-edit-actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.prop-cols{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:start;margin-top:14px}
.ed-card{background:#fff;border:1px solid var(--borda);border-radius:var(--r);padding:20px;box-shadow:var(--sombra);margin-bottom:16px}
.ed-card h3{font-family:var(--display);font-size:15px;color:var(--titulo);margin:0 0 14px}
.ed-card .in{border:1px solid var(--borda);border-radius:10px;padding:9px 11px;font-family:var(--corpo-f);font-size:14px;color:var(--corpo);background:#fff;width:100%}
.ed-card textarea.in{resize:vertical;line-height:1.5}
.lbl{display:block;font-size:12px;color:var(--muted);margin-top:14px}
.lbl .in{margin-top:5px}
/* modal: campos "soltos" (.lbl) e selects do grid herdam o mesmo visual do input do grid,
   pra rótulo ficar sempre acima do campo (campo em bloco, largura total) */
.cat-modal .lbl>.in,.cat-modal .lbl>.select,.cat-modal .lbl>textarea,.cat-modal .dform .select{display:block;width:100%;margin-top:5px;border:1px solid var(--borda);border-radius:10px;padding:9px 11px;font-family:var(--corpo-f);font-size:14px;color:var(--corpo);background:#fff}
.cat-modal .dform .select{margin-top:0}
.cat-modal .lbl>.in:focus,.cat-modal .lbl>.select:focus,.cat-modal .lbl>textarea:focus,.cat-modal .dform .select:focus{outline:2px solid var(--teal);border-color:var(--teal)}
.desc-wrap{display:flex;gap:6px;margin-top:5px}
.desc-wrap .in{flex:1}
.desc-wrap .select{width:62px;padding:7px 6px}
.desc-list{display:flex;flex-direction:column;gap:12px}
.desc-edit{display:block;font-size:12.5px;color:var(--muted)}
.desc-edit span{font-weight:600;color:var(--titulo);display:block;margin-bottom:4px;font-size:13px}
.desc-edit textarea{font-size:13px}
.ch-form-row{display:flex;gap:16px;flex-wrap:wrap}
.ch-form-row .lbl{flex:1;min-width:150px}
/* conversa (chat) do chamado */
.chat-thread{display:flex;flex-direction:column;gap:12px;max-height:460px;overflow:auto;padding:4px 2px}
.chat-b{display:flex;gap:9px;align-items:flex-start;max-width:88%}
.chat-b.mine{flex-direction:row-reverse;align-self:flex-end}
.chat-av{width:30px;height:30px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:#e7ebf3;color:var(--titulo);font-size:12px;font-weight:700}
.chat-b.mine .chat-av{background:var(--teal,#0ea5a3);color:#fff}
.chat-bubble{background:#f1f4f9;border-radius:12px;padding:9px 12px}
.chat-b.mine .chat-bubble{background:#e6f6f5}
.chat-meta{font-size:12px;color:var(--muted);margin-bottom:3px}
.chat-meta b{color:var(--titulo)}
.chat-tag{margin-left:6px;font-size:10.5px;font-weight:700;color:#0e7490;background:#cffafe;border-radius:6px;padding:1px 6px}
.chat-txt{font-size:13.5px;color:var(--corpo);line-height:1.5}
.chat-anexos{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.chat-anexo-img{display:block;line-height:0}
.chat-anexo-img img{max-width:200px;max-height:200px;border-radius:8px;border:1px solid var(--borda);object-fit:cover}
.chat-anexo-file{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid var(--borda);border-radius:8px;background:#fff;font-size:13px;color:var(--titulo);text-decoration:none;max-width:100%}
.chat-anexo-file:hover{border-color:var(--teal)}
.chat-anexo-file .ca-nome{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.chat-reply-actions{display:flex;align-items:center;gap:10px;margin-top:8px}
.chat-anexar{cursor:pointer}
.faq-item{border:1px solid var(--borda);border-radius:10px;padding:12px 14px;margin-bottom:8px;background:#fff}
.faq-item:last-child{margin-bottom:0}
.faq-item summary{cursor:pointer;font-weight:600;color:var(--titulo);font-size:14px;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::before{content:'▸';display:inline-block;margin-right:8px;color:var(--muted);transition:transform .15s}
.faq-item[open] summary::before{transform:rotate(90deg)}
.faq-resposta{margin-top:10px;font-size:13.5px;color:var(--corpo);line-height:1.6}
.prop-edit-foot{display:flex;align-items:center;gap:12px;margin-top:4px;position:sticky;bottom:0;background:var(--papel);padding:14px 0;border-top:1px solid var(--borda)}
.saved-msg{color:#2b8a3e;font-weight:600;font-size:14px}
@media(max-width:900px){.prop-cols{grid-template-columns:1fr}}
.pitem .pi-nome{font-weight:600;color:var(--titulo);font-size:13px;min-width:0}
.pitem .in,.pitem .select{padding:7px 8px;font-size:13px;border:1px solid var(--borda);border-radius:8px;font-family:var(--corpo-f);width:100%}
.pitem .pi-rm{background:transparent;border:0;color:#b6bdca;cursor:pointer;font-size:18px;line-height:1}
.pitem .pi-rm:hover{color:var(--quente)}
.ptot{display:flex;justify-content:space-between;padding:6px 0;font-size:14px}
.ptot.total{border-top:2px solid var(--borda);margin-top:6px;padding-top:10px;font-weight:700}
.ptot.total b{font-family:var(--display);color:var(--titulo);font-size:18px}
.pcrono-h{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);margin:14px 0 8px}
.pcrono-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.pcrono-card{border:1px solid var(--borda);border-radius:8px;padding:7px 4px;text-align:center;display:flex;flex-direction:column;gap:1px}
.pcrono-card span{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:var(--muted)}
.pcrono-card b{font-family:var(--display);font-size:12px;color:var(--titulo);line-height:1.1}
.pcrono-card.step{border-color:var(--teal);background:#f0faf8}
.pcrono-card.step b{color:var(--azul)}
.toggle-row{display:flex;align-items:center;gap:8px;margin:6px 0;font-size:14px;cursor:pointer}
.dpanel-body .in{border:1px solid var(--borda);border-radius:10px;padding:9px 11px;font-family:var(--corpo-f);font-size:14px;color:var(--corpo);background:#fff}
.dpanel-body textarea.in{resize:vertical;line-height:1.5}

/* ── Placeholder "em breve" ── */
.soon-box{background:#fff;border:1px dashed #cdd5e3;border-radius:var(--r);padding:60px 24px;text-align:center;color:var(--muted)}
.soon-box .soon-ico{font-size:40px}
.soon-box h2{font-family:var(--display);color:var(--titulo);margin:10px 0 6px}

/* ── Detalhe em PÁGINA INTEIRA (ex-drawer) ──
   Cobre a área de conteúdo (à direita da barra lateral, que continua visível e clicável).
   No mobile a lateral é off-canvas, então ocupa a tela toda. */
.drawer{position:fixed;top:0;left:var(--side-w);right:0;bottom:0;z-index:30;display:flex;flex-direction:column;background:var(--papel)}
.drawer-bg{display:none}
.drawer-topbar{flex:none;display:flex;align-items:center;gap:10px;padding:12px 20px;background:#fff;border-bottom:1px solid var(--borda);position:sticky;top:0;z-index:2}
/* largura de detalhe/formulário: focada e legível (o conteúdo foi desenhado p/ ~560px;
   720 dá respiro sem esticar campos que viram "barras gigantes") */
.drawer-panel{position:relative;width:100%;max-width:720px;margin:0 auto;flex:1;min-height:0;overflow-y:auto;background:transparent;box-shadow:none;padding:24px 24px 56px;animation:drawerIn .2s ease}
@keyframes drawerIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.dclose{display:none}
@media(max-width:900px){ .drawer{left:0} .drawer-panel{padding:16px 16px 48px} }
/* cabeçalho do detalhe = "hero card" arredondado sobre o fundo da página */
.dpanel-head{background:var(--grad);color:#fff;padding:24px 28px;border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.dpanel-head .eyebrow{font-size:12.5px;opacity:.85}
.dpanel-head h2{font-family:var(--display);margin:4px 0 10px;font-size:23px;line-height:1.2}
.dpanel-head .meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.dpanel-body{padding:22px 2px 0}
/* página completa do cliente */
.cli-page-top{margin-bottom:12px}
.cli-page-head{display:flex;align-items:center;gap:16px;margin:2px 0 20px}
.cli-page-av{width:58px;height:58px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:25px;flex:none;background-size:cover;background-position:center}
.cli-page-av.has-logo{width:250px;height:85px;border-radius:12px;background:#fff center/contain no-repeat;border:1px solid var(--borda)}
@media(max-width:560px){ .cli-page-av.has-logo{width:200px;height:68px} }
.cli-page-av-wrap{position:relative;flex:none}
/* editor de crop da foto do cliente */
.crop-ov{position:fixed;inset:0;background:rgba(20,28,48,.5);display:flex;align-items:center;justify-content:center;z-index:1100;padding:20px}
.crop-modal{background:#fff;border-radius:16px;padding:22px;box-shadow:0 20px 60px rgba(0,0,0,.28);max-width:100%}
.crop-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.crop-head h3{margin:0}
.crop-x{border:0;background:none;font-size:18px;cursor:pointer;color:#888}
.crop-stage{max-width:100%;border:1px solid var(--borda);border-radius:10px;overflow:hidden;background:#f1f4f9;touch-action:none}
.crop-stage canvas{display:block;cursor:grab}
.crop-stage canvas:active{cursor:grabbing}
.crop-zoom{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--corpo);margin:14px 0 4px}
.crop-zoom .crop-range{flex:1}
.crop-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}
.cli-page-av-edit{position:absolute;bottom:-2px;right:-2px;width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid var(--borda);cursor:pointer;font-size:11px;display:grid;place-items:center;box-shadow:var(--sombra);color:var(--corpo)}
.cli-page-av-edit:hover{background:#f4f7fc;border-color:#c7d2e5}
.cli-page-hinfo{min-width:0}
.cli-page-hinfo .eyebrow{font-size:12px;color:var(--muted)}
.cli-page-hinfo h2{font-family:var(--display);font-size:24px;color:var(--titulo);margin:2px 0 9px}
.cli-page-hinfo .meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cli-cols{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;align-items:start}
.cli-main,.cli-side{display:flex;flex-direction:column;gap:16px;min-width:0}
.cli-main .dform{margin:0}
.cli-side{position:sticky;top:20px}
@media(max-width:900px){.cli-cols{grid-template-columns:1fr}.cli-side{position:static}}
/* Clientes (grade de cards) */
.cli-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.cli-card{display:flex;align-items:center;gap:12px;text-align:left;background:#fff;border:1px solid var(--borda);border-radius:12px;padding:14px 15px;cursor:pointer;font-family:inherit;transition:box-shadow .12s,border-color .12s}
.cli-card:hover{border-color:#c7d2e5;box-shadow:var(--sombra)}
.cli-av{width:42px;height:42px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-weight:700;font-size:18px;flex:none;font-family:var(--display)}
.cli-av-logo{border-radius:8px;background-size:contain;background-repeat:no-repeat;background-position:center;background-color:#f1f4f9}
.cli-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cli-info b{font-size:14px;color:var(--titulo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cli-sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cli-card .chev{color:#c2cad8;font-size:20px;flex:none}
.dclose{position:absolute;top:16px;right:18px;background:rgba(255,255,255,.2);border:0;color:#fff;width:32px;height:32px;border-radius:50%;font-size:18px;cursor:pointer;line-height:1}
.dgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;margin:6px 0 18px}
.dgrid .k{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.dgrid .v{font-weight:600;color:var(--corpo)}
.dsec{margin-top:22px}
.dsec h3{font-family:var(--display);font-size:15px;color:var(--titulo);margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid var(--borda)}
.reclist{display:flex;flex-direction:column;gap:7px}
.recitem{display:flex;gap:9px;align-items:flex-start;font-size:14px}
.recitem b{background:var(--teal);color:#fff;min-width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:12px;flex:none;margin-top:1px}
.contact-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.qa{font-size:13.5px}
.qa div{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px dashed #eef1f6}
.qa .qk{color:var(--muted)} .qa .qv{font-weight:600;text-align:right}
.timeline{list-style:none;margin:0;padding:0}
.timeline li{padding:8px 0 8px 16px;border-left:2px solid var(--borda);position:relative;font-size:13.5px}
.timeline li::before{content:'';position:absolute;left:-5px;top:12px;width:8px;height:8px;border-radius:50%;background:var(--teal)}
.timeline .tdate{color:var(--muted);font-size:12px}
.notebox{display:flex;gap:8px;margin-top:10px}
.notebox input{flex:1;border:1px solid var(--borda);border-radius:10px;padding:10px 12px;font-family:var(--corpo-f);font-size:14px}
.status-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.dform{display:grid;grid-template-columns:1fr 1fr;gap:11px 12px;align-items:end;margin-bottom:8px}
.dform label{display:flex;flex-direction:column;font-size:12px;color:var(--muted);gap:5px;font-weight:500}
.dform label.full{grid-column:1/-1}
.busca-wrap{position:relative}
.busca-results{position:absolute;top:100%;left:0;right:0;z-index:20;background:#fff;border:1px solid var(--borda);border-radius:10px;box-shadow:var(--sombra);margin-top:4px;max-height:260px;overflow-y:auto}
.busca-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;cursor:pointer;border-bottom:1px solid #f1f4f9;font-size:13px}
.busca-item:last-child{border-bottom:0}
.busca-item:hover{background:#f4f7fc}
.busca-vazio{padding:10px 12px;font-size:12.5px;color:var(--muted)}
.dform .in{border:1px solid var(--borda);border-radius:10px;padding:9px 11px;font-family:var(--corpo-f);font-size:14px;color:var(--corpo)}
.dform .in:focus,.dform .select:focus{outline:2px solid var(--teal);border-color:var(--teal)}
.dform .btn.full{grid-column:1/-1;justify-content:center;margin-top:2px}
.minlist{list-style:none;margin:0;padding:0}
.minlist li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed #eef1f6;font-size:13.5px}
.minlist li:last-child{border-bottom:0}
.minlist .ml-meta{color:var(--muted);white-space:nowrap}
.ml-link{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border-bottom:1px dashed #eef1f6;font-size:13.5px;cursor:pointer;transition:color .12s}
.ml-link:last-child{border-bottom:0}
.ml-link>span:first-child{font-weight:600;color:var(--titulo)}
.ml-link:hover>span:first-child{color:var(--azul)}
.ml-link .ml-meta{color:var(--muted);white-space:nowrap}
.chip-link{cursor:pointer;background:#eef2fb !important;color:var(--azul) !important;font-weight:600}
.chip-link:hover{background:#e0e8fa !important}
.pessoa-list{display:flex;flex-direction:column;gap:8px}
.pessoa{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#f7f9fc;border:1px solid var(--borda);border-radius:10px;padding:9px 12px}
.pessoa-nome{font-weight:600;color:var(--titulo);font-size:14px}
.pessoa-cargo{font-weight:500;color:var(--azul);font-size:11.5px;background:#eef2fb;padding:1px 8px;border-radius:999px;margin-left:6px}
.pessoa-sub{font-size:12px;color:var(--muted);margin-top:1px}
.pessoa-rm{background:transparent;border:0;color:#b6bdca;font-size:18px;cursor:pointer;line-height:1;flex:none}
.pessoa-rm:hover{color:var(--quente)}
/* links úteis (site, redes sociais etc.) */
.link-list{display:flex;flex-direction:column;gap:8px}
.link-row{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#f7f9fc;border:1px solid var(--borda);border-radius:10px;padding:9px 12px}
.link-row a{font-weight:600;color:var(--azul);font-size:13.5px;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.link-row a:hover{text-decoration:underline}
/* conversas do WhatsApp — sanfona reaproveitando .pb-card/.pb-summary/.pb-body */
.wa-textarea{width:100%;resize:vertical;min-height:110px;padding:9px 11px;border:1px solid var(--borda);border-radius:10px;font-family:var(--corpo-f);font-size:13.5px;color:var(--corpo)}
.wa-card .pb-summary-nome{flex:none;min-width:auto}
.wa-resumo-teaser{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wa-secao{margin-bottom:10px}
.wa-secao b{display:block;font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:4px}
.wa-secao ul{margin:0;padding-left:18px;font-size:13px;color:var(--corpo)}
.wa-secao li{margin-bottom:3px}
.wa-bruto{margin-top:10px;font-size:12.5px;color:var(--muted)}
.wa-bruto summary{cursor:pointer;font-weight:600;color:var(--azul)}
.wa-bruto pre{white-space:pre-wrap;word-break:break-word;background:#f7f9fc;border:1px solid var(--borda);border-radius:10px;padding:10px;margin-top:8px;font-family:var(--corpo-f);font-size:12.5px;max-height:280px;overflow-y:auto}
/* mídia anexada do .zip do WhatsApp */
.wa-imgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:6px}
.wa-imgs img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;border:1px solid var(--borda);background:#f1f4f9}
.wa-arquivo{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.wa-arquivo audio{height:32px;max-width:220px}
.wa-file-list{list-style:none !important;padding-left:0 !important}
.wa-file-list li{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px dashed #eef1f6}
.wa-file-list li:last-child{border-bottom:0}
.wa-file-list a{color:var(--azul);font-weight:600;text-decoration:none}
.wa-file-list a:hover{text-decoration:underline}

/* ── Responsivo: sidebar vira off-canvas ── */
@media(max-width:900px){
  .sidebar{position:fixed;left:0;top:0;transform:translateX(-100%);transition:transform .22s ease;box-shadow:8px 0 40px rgba(15,23,50,.3)}
  .shell.nav-open .sidebar{transform:none}
  .side-close{display:block}
  .hamb{display:inline-flex}
  .side-overlay[hidden]{display:none}
}
@media(min-width:901px){ .side-overlay{display:none} }

@media(max-width:680px){
  .topbar,.content{padding-left:16px;padding-right:16px}
  .topbar-actions .hide-sm{display:none}
  .stats{grid-template-columns:repeat(2,1fr)}
  .leads thead{display:none}
  .leads,.leads tbody,.leads tr,.leads td{display:block;width:100%}
  .leads tr{border-bottom:1px solid var(--borda);padding:8px 4px}
  .leads td{border:0;padding:5px 14px}
  .leads td.when{padding-top:12px}
}

/* ── CRM unificado: etapas, categorias e modal ── */
.etapa-badge{display:inline-block;font-size:11px;font-weight:700;border-radius:999px;padding:3px 10px;white-space:nowrap}
.etapa-badge.etapa-lead-novo{background:#eaf0fb;color:#2e4a9e}
.etapa-badge.etapa-lead-andamento{background:#fdf3e0;color:#9a6c00}
.etapa-badge.etapa-contato{background:#e5f6f4;color:#1f7a70}
.etapa-badge.etapa-cliente{background:#e7f5ec;color:#2b7d4c}
.etapa-badge.etapa-perdido{background:#f0f0f2;color:#8a8a92}
#cadPills .pill[data-etapa]::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle;background:#c9cfdb}
#cadPills .pill.etapa-lead-novo::before{background:#3A5BA9}
#cadPills .pill.etapa-lead-andamento::before{background:#c99400}
#cadPills .pill.etapa-contato::before{background:#2a9d92}
#cadPills .pill.etapa-cliente::before{background:#2e8b57}
.etapa-sel{border:1px solid #e2e6ee;border-radius:8px;padding:4px 8px;font-size:12px;font-weight:700;cursor:pointer;background:#fff;max-width:150px}
.etapa-sel.etapa-lead-novo{color:#2e4a9e;border-color:#c5d3f0;background:#f5f8ff}
.etapa-sel.etapa-lead-andamento{color:#9a6c00;border-color:#f0deb0;background:#fffaf0}
.etapa-sel.etapa-contato{color:#1f7a70;border-color:#bfe6e1;background:#f4fbfa}
.etapa-sel.etapa-cliente{color:#2b7d4c;border-color:#bfe6cd;background:#f5fbf7}
.etapa-sel.etapa-parceiro{color:#6b4fa8;border-color:#dccff0;background:#f8f4fd}
.etapa-sel.etapa-fornecedor{color:#4f6b8c;border-color:#cfdcf0;background:#f4f7fd}
.etapa-sel.etapa-inativo,.etapa-sel.etapa-interno{color:#8a8a92;border-color:#e0e0e6;background:#f7f7f9}
.etapa-sel.etapa-perdido{color:#8a8a92;border-color:#e0e0e6;background:#f7f7f9}
/* DONO DO LEAD (v=431). Mesma caixa do seletor de etapa, para a linha ter um
   ritmo só. O estado "da casa" (--morno-txt, 5,79:1 no branco — token, NUNCA
   âmbar cravado) marca o que ainda espera uma decisão de gente: com dono, a
   caixa é neutra e some visualmente; sem dono, ela pede o olho. */
.dono-sel{border:1px solid #e2e6ee;border-radius:8px;padding:4px 8px;font-size:12px;font-weight:600;cursor:pointer;background:#fff;max-width:170px;color:var(--corpo)}
.dono-sel.dono-casa{color:var(--morno-txt);border-color:#f0deb0;background:#fffaf0;font-weight:700}
#cadPills .pill.etapa-parceiro::before{background:#6b4fa8}
#cadPills .pill.etapa-fornecedor::before{background:#4f6b8c}
#cadPills .pill.etapa-perdido::before{background:#9aa0ac}
.cat-cell{display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.cat-chip{display:inline-block;font-size:10.5px;font-weight:600;color:#fff;background:var(--cat,#3A5BA9);border-radius:999px;padding:2px 9px}
.cat-add{width:20px;height:20px;line-height:18px;text-align:center;border:1px dashed #c2c8d6;background:#fff;color:#8a90a0;border-radius:50%;cursor:pointer;font-size:13px;padding:0;flex:none}
.cat-add:hover{border-color:#3A5BA9;color:#3A5BA9}
.cat-modal-ov{position:fixed;inset:0;background:rgba(20,28,48,.45);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}
.cat-modal{background:#fff;border-radius:16px;width:min(460px,100%);max-height:85vh;overflow:auto;padding:22px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.cat-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.cat-modal-head h3{margin:0}
.cat-modal-x{border:0;background:none;font-size:18px;cursor:pointer;color:#888}
.cat-manage-list{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.cat-manage-row{display:flex;align-items:center;gap:8px}
.cat-manage-row .cat-nome{flex:1;padding:7px 10px;border:1px solid #dfe3ec;border-radius:8px}
.cat-cor{width:34px;height:34px;padding:0;border:1px solid #dfe3ec;border-radius:8px;background:none;cursor:pointer;flex:none}
.cat-del{border:0;background:none;color:#c93a52;cursor:pointer;font-size:15px}
.cat-manage-new{display:flex;gap:8px;align-items:center;border-top:1px solid #eee;padding-top:14px}
.cat-manage-new input[type=text]{flex:1;padding:8px 10px;border:1px solid #dfe3ec;border-radius:8px}
.cat-toggle-list{display:flex;flex-wrap:wrap;gap:8px}
.cat-toggle{border:1.5px solid var(--cat,#3A5BA9);color:var(--cat,#3A5BA9);background:#fff;border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:pointer}
.cat-toggle.on{background:var(--cat,#3A5BA9);color:#fff}
.cat-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
/* convites */
.conv-list{display:flex;flex-direction:column;gap:8px;margin-top:16px;max-height:320px;overflow:auto}
.conv-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--borda);border-radius:12px;padding:10px 12px}
.conv-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.conv-info b{font-size:13.5px;color:var(--titulo)}
.conv-status{font-size:10.5px;font-weight:700;border-radius:999px;padding:2px 8px;white-space:nowrap}
.conv-status.conv-enviado{background:#eef1f7;color:#5a6b8c}
.conv-status.conv-aberto{background:#fdf3e0;color:#9a6c00}
.conv-status.conv-respondido{background:#e7f5ec;color:#2b7d4c}
.conv-acoes{display:flex;align-items:center;gap:8px;flex:none}
.conv-del{border:0;background:none;color:#c93a52;cursor:pointer;font-size:14px}
/* duplicados */
.dup-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:#fdf3e0;border:1px solid #f0deb0;color:#9a6c00;border-radius:12px;padding:10px 14px;margin-bottom:12px;font-size:13px;font-weight:600}
.dup-list{display:flex;flex-direction:column;gap:14px}
.dup-grupo{border:1px solid var(--borda);border-radius:12px;padding:14px}
.dup-grupo-t{font-size:12px;font-weight:700;color:var(--corpo);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.dup-membros{display:flex;flex-direction:column;gap:8px}
.dup-membro{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--borda);border-radius:10px;padding:10px 12px;cursor:pointer}
.dup-membro input{margin-top:3px}
.dup-membro b{font-size:13.5px;color:var(--titulo)}
.dup-tag{font-size:10px;font-weight:700;border-radius:999px;padding:1px 7px;background:#eef1f7;color:#5a6b8c}
.dup-tag.dup-plano{background:#e7f5ec;color:#2b7d4c}
.dup-merge{margin-top:12px;width:100%}
/* lista de planos no perfil */
.plano-list{display:flex;flex-direction:column;gap:8px}
.plano-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--borda);border-radius:10px;padding:9px 12px}
.plano-row b{font-size:13px;color:var(--titulo)}
/* painel pessoal do usuário no dashboard */
.mp-cols{margin-top:var(--sp-4)}
.mp-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--borda);cursor:pointer}
.mp-row:last-child{border-bottom:0}
.mp-row:hover .mp-main b{color:var(--azul)}
.mp-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.mp-main b{font-size:13.5px;color:var(--titulo);line-height:1.3}
.prio-dot{vertical-align:middle;margin-right:3px}
.mp-sub{font-size:11.5px;color:var(--corpo)}
.mp-link{color:var(--teal,#0ea5a3);font-weight:600}
.mp-chip{font-size:11px;font-weight:700;border-radius:999px;padding:2px 9px;background:#eef1f7;color:#5a6b8c;white-space:nowrap;flex:none}
.mp-chip.mp-perto{background:#fdf3e0;color:#9a6c00}
.mp-chip.mp-atraso{background:#fdeaee;color:#c93a52}
.mp-clientes{display:flex;flex-wrap:wrap;gap:8px}
.mp-cli{display:flex;align-items:center;gap:8px;border:1px solid var(--borda);border-radius:999px;padding:4px 12px 4px 4px;background:#fff;cursor:pointer;font-size:12.5px;font-weight:600;color:var(--titulo);max-width:100%}
.mp-cli:hover{border-color:#c7d2e5;background:#f7f9fd}
.mp-cli span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-cli-av{width:26px;height:26px;border-radius:50%;flex:none;background:#f1f4f9 center/contain no-repeat}
.mp-cli-letra{display:grid;place-items:center;background:var(--grad);color:#fff;font-weight:700;font-size:12px}
.mp-fer{display:flex;flex-direction:column;gap:9px}
.mp-fer-row{display:flex;align-items:center;gap:12px}
.mp-fer-data{display:flex;flex-direction:column;align-items:center;justify-content:center;width:44px;height:44px;flex:none;border-radius:10px;background:var(--papel);border:1px solid var(--borda)}
.mp-fer-data b{font-family:var(--display);font-size:17px;color:var(--azul);line-height:1}
.mp-fer-data span{font-size:10px;text-transform:uppercase;color:var(--corpo)}
.mp-fer-row .mp-sub{text-transform:capitalize}

/* ── Modelos de pesquisa (lista + construtor) ── */
.pm-tema{margin-bottom:18px}
.pm-tema-h{font-family:var(--display);font-size:15px;color:var(--titulo);margin:0 0 10px;display:flex;align-items:center;gap:8px}
.pm-tema-h span{background:#eef2fb;color:var(--azul);font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px}
.pm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.pm-card{background:#fff;border:1px solid var(--borda);border-radius:12px;box-shadow:var(--sombra);transition:.15s;display:flex;flex-direction:column}
.pm-card:hover{border-color:var(--teal);box-shadow:0 6px 18px rgba(87,190,182,.18)}
.pm-card-main{text-align:left;background:transparent;border:0;padding:14px 16px 8px;cursor:pointer;font-family:var(--corpo-f);width:100%}
.pm-send{margin:0 12px 12px auto;background:#f0faf8;border:1px solid #cdece6;color:#1f8a80;font-family:var(--corpo-f);font-size:12px;font-weight:700;padding:6px 13px;border-radius:8px;cursor:pointer}
.pm-send:hover:not(:disabled){background:#e1f5ef;border-color:var(--teal)}
.pm-send:disabled{opacity:.45;cursor:default}
/* construtor em página cheia */
.pm-build{max-width:940px}
.pm-build-top{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.pm-build-top h2{font-size:20px;color:var(--titulo);font-family:var(--display)}
.pm-build-foot-top{margin-left:auto;display:flex;gap:8px}
.pm-build-body{display:flex;flex-direction:column;gap:16px}
.mm-tema-row{display:flex;gap:8px;align-items:center}
.mm-tema-row .select{flex:1;min-width:0}
/* modal de categorias */
.cat-add-row{display:flex;gap:8px}.cat-add-row .in{flex:1}
.gc-item{display:flex;align-items:center;justify-content:space-between;padding:9px 2px;border-bottom:1px solid var(--borda);font-size:14px;color:var(--corpo)}
.gc-rm{background:transparent;border:0;color:#b6bdca;cursor:pointer;font-size:18px;line-height:1;padding:0 4px}
.gc-rm:hover{color:var(--quente)}
.pm-card-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pm-card-h b{font-size:14px;color:var(--titulo)}
.pm-off{font-size:10px;font-weight:700;text-transform:uppercase;color:var(--muted);background:#f1f3f7;padding:2px 7px;border-radius:20px}
.pm-card-sub{font-size:12px;color:var(--muted);margin-top:5px}
.mm-pilares{display:flex;flex-wrap:wrap;gap:8px 14px;margin:4px 0 2px}
.mm-chk{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--corpo);cursor:pointer}
.mm-add{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0 4px}
.mm-add-btn{background:#f0faf8;border:1px solid #cdece6;color:#1f8a80;font-family:var(--corpo-f);font-size:12.5px;font-weight:600;padding:7px 11px;border-radius:10px;cursor:pointer}
.mm-add-btn:hover{background:#e1f5ef;border-color:var(--teal)}
.mm-q{border:1px solid var(--borda);border-radius:10px;padding:10px 12px;margin-bottom:10px;background:#fbfcfe;display:flex;flex-direction:column;gap:8px}
.mm-q .in{width:100%}
.mm-q-head{display:flex;align-items:center;justify-content:space-between}
.mm-q-tag{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--azul);background:#eef2fb;padding:3px 9px;border-radius:20px}
.mm-q-tag.mm-q-texto,.mm-q-tag.mm-q-bloco{color:#1f8a80;background:#e7f5f3}
.mm-q-move{display:flex;gap:2px}
.mm-q-move button{background:transparent;border:1px solid var(--borda);color:var(--muted);width:24px;height:24px;border-radius:8px;cursor:pointer;font-size:13px;line-height:1}
.mm-q-move button:hover:not(:disabled){border-color:var(--teal);color:var(--azul)}
.mm-q-move button:disabled{opacity:.35;cursor:default}
.mm-q-move .mm-q-rm:hover{border-color:var(--quente);color:var(--quente)}
.mm-row{display:flex;gap:10px}
.mm-inline{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--corpo)}
.mm-num{width:70px}
.dpanel-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;padding-top:14px;border-top:1px solid var(--borda)}

/* ── Pesquisas recorrentes (séries + evolução) ── */
.ser-due{color:var(--quente);font-weight:700}
.ser-tag-due{display:inline-block;margin-left:8px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--quente);background:#fdece6;padding:2px 8px;border-radius:20px;vertical-align:middle}
.ser-freq{display:inline-block;font-size:11px;font-weight:600;color:var(--azul);background:#eef2fb;padding:1px 8px;border-radius:20px;margin-left:6px}
.evo-head{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.evo-kpi{flex:1;min-width:130px;background:#fff;border:1px solid var(--borda);border-top:3px solid var(--teal);border-radius:var(--r);padding:14px 16px;box-shadow:var(--sombra)}
.evo-kpi .n{font-family:var(--display);font-size:20px;font-weight:700;color:var(--titulo);line-height:1.15;word-break:break-word}
.evo-kpi .l{font-size:12px;color:var(--muted);margin-top:4px;text-transform:uppercase;letter-spacing:.04em}
.evo-card{border:1px solid var(--borda);border-radius:var(--r);padding:14px 16px;margin-bottom:14px;background:#fbfcfe}
.evo-card:last-child{margin-bottom:0}
.evo-card-h{display:flex;align-items:center;justify-content:space-between;gap:10px}
.evo-card-h b{font-size:14px;color:var(--titulo)}
.evo-tag{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--azul);background:#eef2fb;padding:3px 9px;border-radius:20px;white-space:nowrap}
.evo-metrics{display:flex;flex-wrap:wrap;gap:6px 18px;margin:8px 0 6px;font-size:12.5px;color:var(--muted)}
.evo-metrics b{color:var(--corpo);font-size:14px}
.evo-delta{font-weight:700;padding:1px 8px;border-radius:20px;font-size:12px}
.evo-delta.up{color:#1f8a4d;background:#e6f6ec}
.evo-delta.down{color:#b02a37;background:#fdecee}
.evo-delta.flat{color:var(--muted);background:#f1f3f7}
.evo-chart{width:100%;height:auto;max-width:560px;display:block;margin-top:4px}
.evo-coment{border-left:3px solid var(--teal);padding:2px 0 2px 12px;margin-bottom:14px}
.evo-coment:last-child{margin-bottom:0}
.evo-coment-h{font-size:13.5px;color:var(--titulo);margin-bottom:6px;display:flex;align-items:center;gap:8px}
.evo-coment-list{display:flex;flex-direction:column;gap:6px}
.evo-coment-item{display:flex;gap:10px;font-size:13px;color:var(--corpo);line-height:1.5}
.evo-coment-data{flex:none;color:var(--muted);font-size:12px;min-width:70px;padding-top:1px}
.evo-envios{display:flex;flex-direction:column;gap:2px}
.evo-envio{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px dashed #eef1f6;cursor:pointer;transition:background .12s}
.evo-envio:last-child{border-bottom:0}
.evo-envio:hover{background:#f6f8fb}
.evo-envio-data{flex:none;font-size:12.5px;color:var(--muted);min-width:74px}
.evo-envio-tit{flex:1;min-width:0;font-size:13.5px;color:var(--corpo);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.evo-envio .btn-sm{flex:none}

/* ── Pesquisas › Satisfação da carteira (painel do dono) ── */
.sat-aviso{background:#fdecee;border:1px solid #f5c2c7;color:#842029;border-radius:var(--r);padding:12px 16px;font-size:13.5px;line-height:1.55;margin-bottom:16px}
.sat-bar{display:flex;height:26px;border-radius:8px;overflow:hidden;background:#eef1f6}
.sat-bar-vazia{align-items:center;justify-content:center;color:var(--muted);font-size:12.5px;height:auto;padding:12px}
.sat-seg{display:block;height:100%;transition:width .25s}
.sat-bar-leg{display:flex;flex-wrap:wrap;gap:16px;margin-top:10px;font-size:12.5px;color:var(--muted)}
.sat-bar-leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.sat-det{border:1px solid var(--borda);border-left:3px solid #b02a37;border-radius:10px;padding:12px 14px;margin-bottom:10px;cursor:pointer;transition:background .12s}
.sat-det:hover{background:#fffafa}
.sat-det-h{display:flex;align-items:center;gap:12px}
.sat-det-nota{flex:none;color:#fff;font-weight:700;font-size:14px;padding:6px 11px;border-radius:8px;min-width:52px;text-align:center}
.sat-det-cli{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sat-det-cli b{font-size:14.5px;color:var(--titulo)}
.sat-det-coment{margin-top:10px;padding-top:10px;border-top:1px dashed #eef1f6;display:flex;flex-direction:column;gap:8px}
.sat-det-coment q{display:block;font-style:italic;color:var(--corpo);font-size:13.5px;line-height:1.5;margin-top:2px}
.sat-det-coment q::before{content:'“'}.sat-det-coment q::after{content:'”'}

/* tabulação de múltipla escolha (série e carteira) */
.tab-bloco{margin-bottom:20px}
.tab-bloco:last-child{margin-bottom:0}
.tab-h{display:flex;align-items:baseline;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.tab-h b{font-size:14.5px;color:var(--titulo)}
.tab-linha{display:flex;align-items:center;gap:12px;padding:5px 0}
.tab-op{flex:0 0 40%;font-size:13.5px;color:var(--corpo);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tab-op em{font-style:normal;font-size:11px;color:var(--muted);margin-left:6px;border:1px solid var(--borda);border-radius:4px;padding:1px 5px}
.tab-linha.fora .tab-op{color:var(--muted)}
.tab-barra{flex:1;height:16px;background:#eef1f6;border-radius:5px;overflow:hidden}
.tab-barra i{display:block;height:100%;background:linear-gradient(90deg,#57BEB6,#3A5BA9);border-radius:5px;transition:width .25s}
.tab-num{flex:none;min-width:64px;text-align:right;display:flex;flex-direction:column;line-height:1.2}
.tab-num b{font-size:13.5px;color:var(--titulo)}
@media (max-width:640px){.tab-op{flex-basis:50%}.sat-det-h{flex-wrap:wrap}}

/* ── RH › Contratos (ClickSign) ── */
.cfg-aviso{background:#fff7e6;border:1px solid #ffe0a3;color:#8a5a00;border-radius:var(--r);padding:12px 16px;font-size:13.5px;line-height:1.5;margin-bottom:16px}
.cfg-ok{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#eaf7ef;border:1px solid #bde5cb;color:#1f7a44;border-radius:var(--r);padding:10px 14px;font-size:13.5px;margin-bottom:16px}
.cfg-ok .btn-sm{margin-left:auto}
.cfg-ok-badge{color:#1f7a44;font-weight:700}
.cfg-err-badge{color:#b02a37;font-weight:600}
.badge.ctr-recusado{background:var(--quente)} .badge.ctr-cancelado{background:#9aa3b2}
.ctr-tipo{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:#1f8a80;background:#e7f5f3;padding:2px 8px;border-radius:20px}
.ctr-vars-box{background:#f6f8fb;border:1px solid var(--borda);border-radius:10px;padding:10px 12px;font-size:13px;color:var(--corpo);line-height:2}
.ctr-var-chip{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--azul);background:#eef2fb;border:1px solid #dce4f5;padding:2px 7px;border-radius:6px;margin:0 4px 4px 0}
.ctr-textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.55;resize:vertical}
.ctr-sig{display:grid;grid-template-columns:1.2fr 1.4fr .9fr 28px;gap:8px;align-items:center;margin-bottom:8px}
.ctr-sig .in{width:100%}
.sig-rm{background:transparent;border:1px solid var(--borda);color:#b6bdca;width:28px;height:32px;border-radius:8px;cursor:pointer;font-size:16px;line-height:1}
.sig-rm:hover{border-color:var(--quente);color:var(--quente)}
.ctr-dethead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.ctr-doc-actions{display:flex;gap:8px;flex-wrap:wrap}
.ctr-sig-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 0;border-bottom:1px dashed #eef1f6}
.ctr-sig-row:last-child{border-bottom:0}
.ctr-sig-nome{font-weight:600;color:var(--titulo);font-size:14px}
.ctr-sig-mail{color:var(--muted);font-size:12.5px;flex:1;min-width:0}
.ctr-valores{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px 16px}
.ctr-val{display:flex;flex-direction:column;gap:1px;padding:6px 0;border-bottom:1px dashed #eef1f6}
.ctr-val-k{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.ctr-val-v{font-size:14px;color:var(--corpo)}
.ctr-evt{font-size:13px;color:var(--corpo);padding:6px 0;border-bottom:1px dashed #eef1f6;line-height:1.5}
.ctr-evt:last-child{border-bottom:0}
.ctr-evt-data{color:var(--muted);font-size:12px;margin-right:8px}

/* ── RH › Compliance (documentos + aceite/assinatura) ── */
.compl-pend{background:#fff7e6;border:1px solid #ffe0a3;border-radius:var(--r);padding:14px 16px;margin-bottom:16px}
.compl-pend h3{margin:0 0 8px;font-size:14.5px;color:#8a5a00;font-family:var(--display)}
.compl-pend-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 0;border-top:1px solid #ffe9c2}
.compl-pend-row:first-of-type{border-top:0}
.compl-pend-t{font-size:14px;color:#6a4a10;font-weight:600}
.compl-doc-box{border:1px solid var(--borda);border-radius:12px;background:#fbfcfe;padding:16px 18px;max-height:40vh;overflow:auto;white-space:pre-wrap;font-size:13.5px;line-height:1.6;color:#3c4250}
.compl-doc-frame{width:100%;height:38vh;border:1px solid var(--borda);border-radius:10px;margin-top:4px}
.compl-sign{position:relative;border:1px dashed #c7cede;border-radius:12px;background:#fff;margin-top:4px}
.compl-sign canvas{display:block;width:100%;height:150px;border-radius:12px;touch-action:none;cursor:crosshair}
.compl-sign-hint{position:absolute;left:12px;top:12px;color:#b6bdca;font-size:13px;pointer-events:none}
.compl-sign-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.link-btn2{background:none;border:0;color:var(--azul);font-weight:600;font-size:13px;cursor:pointer;padding:4px}
.link-btn2:hover{text-decoration:underline}

/* ── Meu perfil (área do usuário) ── */
.side-user.su-click{cursor:pointer;border-radius:10px;transition:background .12s}
.side-user.su-click:hover{background:rgba(255,255,255,.08)}
.perf-head{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.perf-av{width:60px;height:60px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--grad);color:#fff;font-family:var(--display);font-weight:700;font-size:24px}
.perf-id h2{margin:0;font-family:var(--display);color:var(--titulo);font-size:22px}
.perf-id p{margin:2px 0 0;font-size:13.5px}
.perf-doc{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px dashed #eef1f6}
.perf-doc:last-child{border-bottom:0}
.perf-doc-main b{font-size:14px;color:var(--titulo)}
.perf-doc-sub{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.perf-doc-acts{display:flex;gap:8px;flex:none}
.perf-desatual{color:#8a5a00;background:#fff3d6;border-radius:20px;padding:1px 8px;font-weight:600;font-size:11.5px;white-space:nowrap}

/* ── RH › Férias (CLT) ── */
.fer-alert{display:inline-block;font-size:11px;font-weight:700;padding:1px 8px;border-radius:20px;white-space:nowrap;vertical-align:middle}
.fer-alert.venc{color:#b02a37;background:#fdecee}
.fer-alert.perto{color:#8a5a00;background:#fff3d6}
.fer-kpis{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:4px}
.fer-kpi .l{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.fer-kpi .v{font-size:17px;font-weight:700;color:var(--titulo);margin-top:1px}
.fer-kpi .v.venc{color:#b02a37}.fer-kpi .v.perto{color:#8a5a00}
.fer-hist{margin-top:10px;font-size:12.5px;color:var(--muted);border-top:1px dashed #eef1f6;padding-top:8px;line-height:1.5}
.fer-head{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.fer-kpi-big{flex:1;min-width:130px;background:#fff;border:1px solid var(--borda);border-top:3px solid var(--teal);border-radius:var(--r);padding:14px 16px;box-shadow:var(--sombra)}
.fer-kpi-big .n{font-family:var(--display);font-size:20px;font-weight:700;color:var(--titulo);line-height:1.15;word-break:break-word}
.fer-kpi-big .n.venc{color:#b02a37}.fer-kpi-big .n.perto{color:#8a5a00}
.fer-kpi-big .l{font-size:11.5px;color:var(--muted);margin-top:4px;text-transform:uppercase;letter-spacing:.03em}
.fer-pers{display:flex;flex-direction:column}
.fer-per{display:grid;grid-template-columns:1.4fr .7fr 1.6fr 28px;gap:10px;align-items:center;padding:9px 0;border-bottom:1px dashed #eef1f6}
.fer-per:last-child{border-bottom:0}
.fer-per-datas{font-weight:600;color:var(--titulo);font-size:13.5px}
.fer-per-dias{font-size:13px;color:var(--corpo)}
.fer-per-obs{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:560px){.fer-per{grid-template-columns:1fr 1fr 28px}.fer-per-obs{grid-column:1/-1}}
/* lembrete de férias em 1 linha no Início (acima dos feriados) */
.mp-fer-linha{font-size:12.5px;color:var(--corpo);background:#f4f7fc;border:1px solid #e6ecf7;border-radius:9px;padding:7px 11px;margin-bottom:12px;line-height:1.45}
.mp-fer-linha b{color:var(--titulo)}
.mp-fer-linha .fer-alert{margin-left:2px}
.mp-fer-linha.venc{background:#fdecee;border-color:#f6ccd2;color:#8a2b33}
.mp-fer-linha.perto{background:#fff7e6;border-color:#ffe0a3;color:#7a5300}
.mp-fer-linha .mp-link{color:var(--azul);font-weight:600}

/* ── Financeiro ── */
.fin-val.pos{color:#1f8a4d;font-weight:700}
.fin-val.neg{color:#d0442f;font-weight:700}
.fin-val{font-weight:600;white-space:nowrap}
.fin-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:#fff;border:1px solid var(--borda);border-radius:var(--r);box-shadow:var(--sombra);padding:16px 20px;margin-bottom:16px}
.fin-top-kpis{display:flex;gap:28px;flex-wrap:wrap}
.fin-kpi .l{display:block;font-size:12.5px;color:var(--muted)}
.fin-kpi .v{font-family:var(--display);font-size:22px;font-weight:700}
.fin-kpi .v.pos{color:#1f8a4d}.fin-kpi .v.neg{color:#d0442f}
.fin-actions{display:flex;gap:10px}
.fin-ac{border:0;border-radius:12px;padding:11px 18px;font-family:var(--corpo-f);font-weight:700;font-size:14px;cursor:pointer;color:#fff}
.fin-ac.rec{background:#1f8a4d}.fin-ac.rec:hover{background:#1a7643}
.fin-ac.desp{background:#d0442f}.fin-ac.desp:hover{background:#ba3a28}
.fin-saldo{display:flex;align-items:baseline;justify-content:space-between;font-size:14px;color:var(--muted);font-weight:600}
.fin-saldo b{font-family:var(--display);font-size:24px}
.fin-saldo b.pos{color:#1f8a4d}.fin-saldo b.neg{color:#d0442f}
.fin-conta-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed #eef1f6}
.fin-conta-row:last-child{border-bottom:0}
.fin-conta-nome{font-weight:600;color:var(--titulo);font-size:14px}
.fin-conta-tipo{display:inline-block;font-size:10.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);background:#f1f4f9;border-radius:20px;padding:1px 8px;margin-left:8px;font-weight:600}
.fin-lin{display:flex;align-items:center;gap:12px;justify-content:space-between;padding:9px 0;border-bottom:1px dashed #eef1f6;cursor:pointer}
.fin-lin:last-of-type{border-bottom:0}
.fin-lin:hover{background:#f6f8fb}
.fin-lin-main{display:flex;flex-direction:column;min-width:0}
.fin-lin-main b{font-size:14px;color:var(--titulo)}
.fin-lin-sub{font-size:12px;color:var(--muted)}
.fin-atr-lbl{color:#d0442f;font-weight:600}
.fin-badge-atr{font-size:11px;font-weight:700;color:#d0442f;background:#fdecee;border-radius:20px;padding:2px 8px}
.fin-vertodos{display:inline-block;margin-top:10px;color:var(--azul);font-weight:600;font-size:13px;cursor:pointer}
.fin-mini{display:flex;justify-content:space-between;font-size:14px;color:var(--corpo);padding:5px 0}
.fin-mini b.pos{color:#1f8a4d}.fin-mini b.neg{color:#d0442f}
.fin-gastos-wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.fin-gastos-lista{flex:1;min-width:180px}
.fin-gasto{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:13.5px}
.fin-dot{width:10px;height:10px;border-radius:3px;flex:none}
.fin-gasto-nome{flex:1;color:var(--corpo)}
.fin-gasto-pct{font-weight:700;color:var(--titulo)}
.fin-donut{width:130px;height:130px;flex:none}
/* barra de filtros (recebimentos / contas a pagar) */
.fin-filtros{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:flex-end;background:#fff;border:1px solid var(--borda);border-radius:14px;padding:14px 16px;margin-bottom:14px;box-shadow:var(--sombra)}
.ff-field{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:var(--muted);font-weight:600}
.ff-field>span{padding-left:2px}
.ff-field .select,.ff-field .in{border:1px solid var(--borda);border-radius:9px;padding:8px 10px;font-family:var(--corpo-f);font-size:13px;color:var(--corpo);background:#fff;min-width:150px;font-weight:500}
.ff-field .select:focus,.ff-field .in:focus{outline:2px solid var(--teal);border-color:var(--teal)}
.ff-data .in{min-width:138px}
.ff-busca{flex:1 1 180px}
.ff-busca .in{width:100%;min-width:0}
.ff-limpar{align-self:flex-end;padding:9px 14px;font-size:12.5px;white-space:nowrap}
/* Notas & Boletos (documentos financeiros) */
.fd-badge{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:2px 8px;border-radius:20px;margin-right:6px}
.fd-nota{background:#e7f0ff;color:#2f52a0}
.fd-boleto{background:#fdeede;color:#a9611a}
.fd-recibo{background:#e6f6ef;color:#1f7a52}
.fd-st{font-size:12.5px;font-weight:600}
.fd-st.enviado{color:#1f9d57}
.fd-st.pend{color:var(--muted)}
.fd-acts{text-align:right;white-space:nowrap}
.fd-a{display:inline-block;margin-left:12px;font-size:13px;font-weight:600;color:var(--azul);background:none;border:0;cursor:pointer;text-decoration:none}
.fd-a:hover{color:var(--teal-texto)}
.fd-a.fd-send{color:var(--teal-texto)}
/* separador "Financeiro (cobrança)" dentro do card de dados do cliente */
.cli-fin-sep{grid-column:1/-1;margin-top:8px;padding-top:12px;border-top:1px dashed var(--borda);font-size:12px;font-weight:700;color:var(--titulo)}
/* campos customizados */
.lnk-mini{background:none;border:0;color:var(--azul);font-size:12px;font-weight:600;cursor:pointer;text-decoration:underline;margin-left:6px;font-family:inherit}
.lnk-mini:hover{color:var(--teal-texto)}
.cc-list{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;max-height:280px;overflow:auto}
.cc-row{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--borda);border-radius:10px;padding:8px 12px;font-size:13.5px}
.cc-del{border:0;background:none;color:#c93a52;cursor:pointer;font-size:14px;flex:none;line-height:1}
.cc-add{border-top:1px solid var(--borda);padding-top:14px}
.emp-busca{min-width:260px;border:1px solid var(--borda);border-radius:10px;padding:9px 11px;font-family:var(--corpo-f);font-size:14px}
.lc-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.lc-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border:1px solid var(--borda);border-radius:10px;cursor:pointer}
.lc-row:hover{border-color:var(--teal);background:#f7fbfb}
/* Agenda / Calendário */
.ag-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.ag-nav{display:flex;align-items:center;gap:10px;font-family:var(--display);font-size:16px;color:var(--titulo)}
.ag-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.ag-head{margin-bottom:6px}
.ag-dow{text-align:center;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding:4px}
.ag-cell{min-height:96px;background:#fff;border:1px solid var(--borda);border-radius:10px;padding:6px;cursor:pointer;overflow:hidden;display:flex;flex-direction:column;gap:3px}
.ag-cell:hover{border-color:var(--teal)}
.ag-out{background:transparent;border:0;cursor:default}
.ag-hoje{border-color:var(--teal);box-shadow:inset 0 0 0 1px var(--teal)}
.ag-dnum{font-size:12.5px;font-weight:700;color:var(--titulo)}
.ag-hoje .ag-dnum{color:var(--teal)}
.ag-ev{font-size:11px;line-height:1.25;background:#f3f6fb;border-left:3px solid #3A5BA9;border-radius:4px;padding:2px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.ag-ev:hover{background:#e7edf7}
.ag-mais{font-size:10.5px;color:var(--muted);font-weight:600}
.ag-cores{display:inline-flex;gap:6px;vertical-align:middle;margin-left:6px}
.ag-cor{width:20px;height:20px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}
.ag-cor.on{border-color:var(--titulo)}
/* Automações */
.au-list{display:flex;flex-direction:column;gap:8px}
.au-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1px solid var(--borda);border-radius:12px;padding:12px 14px}
.au-info{display:flex;align-items:center;gap:12px;min-width:0}
.au-toggle{position:relative;display:inline-block;width:38px;height:22px;flex:none}
.au-toggle input{opacity:0;width:0;height:0}
.au-toggle span{position:absolute;inset:0;background:#cbd4e3;border-radius:22px;cursor:pointer;transition:.2s}
.au-toggle span::before{content:'';position:absolute;height:16px;width:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.au-toggle input:checked+span{background:var(--teal)}
.au-toggle input:checked+span::before{transform:translateX(16px)}
.fin-td-check{width:44px;text-align:center}
.fin-check{width:22px;height:22px;border-radius:50%;border:2px solid #cdd4e0;background:#fff;cursor:pointer;position:relative}
.fin-check:hover{border-color:#1f8a4d}
.fin-check.on{background:#1f8a4d;border-color:#1f8a4d}
.fin-check.on::after{content:'';position:absolute;left:6px;top:2.5px;width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.fin-parc{font-size:11px;color:var(--muted);background:#f1f4f9;border-radius:20px;padding:1px 7px;font-weight:600;margin-left:4px}
.fin-desc .cell-sub{display:block;margin-top:2px;font-weight:400}
.fx-chart{display:flex;align-items:flex-end;gap:8px;height:150px;padding:8px 4px 0;border-bottom:1px solid var(--borda);margin:8px 0}
.fx-bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%}
.fx-bar-col.atual .fx-mes{color:var(--azul);font-weight:700}
.fx-bars{flex:1;display:flex;align-items:flex-end;gap:3px;width:100%;justify-content:center}
.fx-bar{width:42%;min-height:2px;border-radius:3px 3px 0 0;position:relative;overflow:hidden}
.fx-bar.ent{background:#5ec98a}.fx-bar.sai{background:#eb7a68}
.fx-prev-seg{position:absolute;top:0;left:0;right:0;background:rgba(255,255,255,.6)}
.fx-mes{font-size:11px;color:var(--muted)}
.fx-leg{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin-top:6px}
.fx-i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:4px;vertical-align:0}
.fx-i.ent{background:#5ec98a}.fx-i.sai{background:#eb7a68}.fx-i.prev{background:#dfe6f1;border:1px solid #cbd4e3}
.fx-sub{display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:1px}
.fin-pago-em{color:#1f9d57;font-weight:600}
.fx-atual td{background:#f4f8ff}
.fin-prev{font-size:10.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--azul);background:#eef2fb;border-radius:20px;padding:1px 7px;font-weight:700}

/* ── Assistente de publicação (passo a passo) ── */
.wiz-stepper{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:var(--sp-4);font-size:13px}
.wiz-step{cursor:pointer;color:var(--muted);padding:4px 8px;border-radius:var(--r-sm)}
.wiz-step:hover{background:#eef2fb}
.wiz-step.atual{color:var(--titulo);font-weight:700;background:#eef2fb}
.wiz-step.feito{color:var(--teal)}
.wiz-sep{color:var(--borda)}
.wiz-corpo h3{margin:0 0 14px;font-family:var(--display);font-size:16px;color:var(--titulo)}
.wiz-nav{display:flex;justify-content:space-between;margin-top:var(--sp-4)}
.wiz-pills{display:flex;flex-wrap:wrap;gap:8px}
.wiz-pill{border:1px solid var(--borda);background:#fff;color:var(--corpo);padding:10px 18px;border-radius:var(--r-pill);font-family:var(--corpo-f);font-size:14px;font-weight:600;cursor:pointer}
.wiz-pill:hover{border-color:var(--teal)}
.wiz-pill.ativo{background:var(--grad);color:#fff;border-color:transparent}
.wiz-emojis{display:flex;flex-wrap:wrap;gap:4px;margin-top:10px;padding:10px;border:1px solid var(--borda);border-radius:var(--r-sm);max-width:420px}
.wiz-emoji{background:transparent;border:0;font-size:19px;padding:4px;border-radius:6px;cursor:pointer;line-height:1}
.wiz-emoji:hover{background:#eef2fb}
.wiz-hash-preview{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}
.wiz-preview-card{border:1px solid var(--borda);border-radius:var(--r);padding:16px;max-width:420px;background:#fbfcfe}
.wiz-preview-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:14px}

/* ── IA & Atendimento ── */
.ia-alert{background:#fff7ed;border:1px solid #fdba74;color:#9a3412;border-radius:var(--r);padding:10px 14px;font-size:13px;margin-bottom:14px;line-height:1.45}
.ia-card{cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}
.ia-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(2,32,71,.10)}
.ia-card h3{margin:0 0 6px}
.ia-card .lnk-mini{color:var(--brand);font-weight:600;font-size:13px}
.ia-resp{background:#f6f9ff;border:1px solid var(--borda);border-left:3px solid var(--brand);border-radius:var(--r);padding:12px 14px;font-size:14px;line-height:1.55;white-space:normal}
/* chat / inbox */
.ch-wrap{display:grid;grid-template-columns:300px 1fr;gap:14px;align-items:start}
.ch-side{min-width:0}
.ch-list{display:flex;flex-direction:column;gap:6px;max-height:70vh;overflow:auto}
.ch-item{border:1px solid var(--borda);border-radius:10px;padding:9px 11px;cursor:pointer;background:#fff;transition:border-color .12s,background .12s}
.ch-item:hover{border-color:var(--brand)}
.ch-item.on{border-color:var(--brand);background:#f2f7ff}
.ch-item-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:2px}
.ch-item-top b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ch-badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:2px 7px;border-radius:999px;flex:none}
.ch-badge.aberta{background:#dcfce7;color:#166534}
.ch-badge.fechada{background:#e5e7eb;color:#4b5563}
.ch-main{border:1px solid var(--borda);border-radius:var(--r);background:#fff;display:flex;flex-direction:column;min-height:60vh;max-height:78vh}
.ch-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid var(--borda)}
.ch-thread{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.ch-msg{display:flex;flex-direction:column;max-width:80%}
.ch-msg.cli{align-self:flex-start}
.ch-msg.ag{align-self:flex-end;align-items:flex-end}
.ch-bubble{padding:9px 12px;border-radius:12px;font-size:14px;line-height:1.5}
.ch-msg.cli .ch-bubble{background:#f1f5f9;border-bottom-left-radius:3px}
.ch-msg.ag .ch-bubble{background:var(--brand);color:#fff;border-bottom-right-radius:3px}
.ch-meta{font-size:10px;color:var(--muted);margin-top:3px;text-transform:capitalize}
.ch-compose{border-top:1px solid var(--borda);padding:10px 12px}
.ch-compose textarea{width:100%;resize:vertical}
.ch-compose-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}
.btn.full{width:100%}
@media(max-width:760px){.ch-wrap{grid-template-columns:1fr}}

/* ── E-mail / Caixa de entrada ── */
.em-empty{max-width:520px;text-align:center;margin:24px auto;padding:28px}
.em-empty h3{margin:0 0 8px}
.em-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.em-accts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.em-acct{border:1px solid var(--borda);background:#fff;border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer;color:var(--texto)}
.em-acct.on{border-color:var(--brand);background:#f2f7ff;color:var(--brand);font-weight:600}
.em-actions{display:flex;gap:6px}
.em-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.em-folders{display:flex;gap:4px}
.em-folder{border:none;background:transparent;border-bottom:2px solid transparent;padding:6px 10px;font-size:13px;cursor:pointer;color:var(--muted)}
.em-folder.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.em-search{flex:1;max-width:320px}
.em-search .in{width:100%}
.em-body{display:grid;grid-template-columns:340px 1fr;gap:12px;align-items:start}
.em-list{border:1px solid var(--borda);border-radius:var(--r);background:#fff;max-height:72vh;overflow:auto}
.em-item{padding:10px 12px;border-bottom:1px solid var(--borda);cursor:pointer;transition:background .12s}
.em-item:last-child{border-bottom:none}
.em-item:hover{background:#f6f9ff}
.em-item.nao-lido{background:#f0f6ff}
.em-item.nao-lido .em-from,.em-item.nao-lido .em-subj{font-weight:700}
.em-item-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.em-from{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:70%}
.em-date{font-size:11px;color:var(--muted);flex:none}
.em-subj{font-size:13px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.em-prev{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.em-read{border:1px solid var(--borda);border-radius:var(--r);background:#fff;min-height:60vh;max-height:78vh;overflow:auto;display:flex;flex-direction:column}
.em-read-head{padding:14px 16px;border-bottom:1px solid var(--borda)}
.em-read-head h3{margin:0 0 6px}
.em-frame{flex:1;width:100%;border:none;min-height:50vh}
.em-texto{flex:1;white-space:pre-wrap;word-break:break-word;padding:16px;margin:0;font-family:inherit;font-size:14px;line-height:1.55}
/* qual caixa está aberta (multi-conta: precisa ficar explícito de quem é o que se lê) */
.em-caixa-atual{margin:-4px 0 8px}
/* anexos: antes só existia o ícone 📎, sem baixar nem enviar */
.em-anexos{padding:10px 16px;border-bottom:1px solid var(--borda);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.em-anexo{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--borda);border-radius:999px;padding:5px 12px;font-size:12.5px;text-decoration:none;color:var(--texto);background:#fff;transition:border-color .12s,background .12s}
.em-anexo:hover{border-color:var(--brand);background:#f2f7ff}
.em-read-acoes{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
/* paginação: a lista travava nas 25 primeiras mensagens */
.em-mais{padding:10px;text-align:center;border-top:1px solid var(--borda)}
/* etiqueta de cliente do CRM na lista e no cabeçalho da mensagem */
.em-item-tags{margin-top:4px}
.em-tag-cli{display:inline-block;font-size:11px;padding:2px 8px;border-radius:999px;background:#eef4ff;color:var(--brand);text-decoration:none;border:1px solid #dbe6ff}
.em-tag-cli:hover{background:#dbe6ff}
@media(max-width:820px){.em-body{grid-template-columns:1fr}.em-list{max-height:none}}

/* ── Organizar menu (arrastar; #99) ── */
.side-organizar{display:flex;align-items:center;gap:8px;width:100%;background:transparent;border:1px dashed var(--borda);color:var(--muted);border-radius:8px;padding:7px 10px;font-size:12.5px;cursor:pointer;margin-bottom:8px;transition:all .12s}
.side-organizar:hover{border-color:var(--brand);color:var(--brand)}
.side-organizar.on{border-style:solid;border-color:var(--brand);background:#f2f7ff;color:var(--brand);font-weight:600}
.side-nav.organizando .nav-item,.side-nav.organizando .side-label{cursor:grab;border-radius:8px;outline:1px dashed var(--borda);outline-offset:-1px}
.side-nav.organizando .nav-item:hover{outline-color:var(--brand);background:#f6f9ff}
.side-nav .nav-item.arrastando,.side-nav .side-label.arrastando{opacity:.4;cursor:grabbing}

/* ── Integrações ── */
.intg-tabs{display:flex;gap:6px;border-bottom:1px solid var(--borda);margin-bottom:16px}
.intg-tab{background:transparent;border:none;border-bottom:2px solid transparent;padding:8px 14px;font-size:14px;cursor:pointer;color:var(--muted)}
.intg-tab.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.intg-alert-info{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}
.intg-alert-ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
.intg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.intg-card{border:1px solid var(--borda);border-radius:var(--r);background:#fff;padding:16px}
.intg-card-head{display:flex;gap:10px;align-items:flex-start;margin-bottom:8px}
.intg-ic{font-size:26px;line-height:1}
.intg-card-tit{display:flex;flex-direction:column;gap:3px;min-width:0}
.intg-badge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;width:fit-content}
.intg-badge.on{background:#dcfce7;color:#166534}
.intg-badge.off{background:#fee2e2;color:#991b1b}
.intg-desc{font-size:13px;color:var(--muted);margin:0 0 8px;line-height:1.45}
.intg-meta{font-size:12px;color:var(--muted);margin:4px 0}
.intg-contas{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.intg-conta{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;border:1px solid var(--borda);border-radius:8px;padding:6px 10px}
.intg-faq-tit{margin:22px 0 10px;font-size:16px}
.intg-faq{display:flex;flex-direction:column;gap:6px;max-width:820px}
.intg-faq-item{border:1px solid var(--borda);border-radius:10px;overflow:hidden;background:#fff}
.intg-faq-q{width:100%;text-align:left;background:transparent;border:none;padding:12px 14px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--texto)}
.intg-faq-q.on{color:var(--brand)}
.intg-faq-ch{font-size:18px;flex:none}
.intg-faq-a{padding:0 14px 14px;font-size:13.5px;color:var(--muted);line-height:1.6;white-space:pre-line}

/* ── Fluxo de caixa: drill-in do mês ── */
.fx-bar-col[data-ym]{cursor:pointer}
.fx-linha{cursor:pointer}
.fx-linha:hover{background:#f6f9ff}
.fx-abrir{font-size:11px;color:var(--brand);opacity:0;font-weight:600}
.fx-linha:hover .fx-abrir{opacity:1}
.fx-mm-tot{display:flex;gap:16px;flex-wrap:wrap;font-size:14px;margin:6px 0 12px;padding-bottom:10px;border-bottom:1px solid var(--borda)}
.fx-mm-sec{margin-bottom:14px}
.fx-mm-sec h4{margin:0 0 2px;font-size:14px}
.fx-atraso{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:#fee2e2;color:#991b1b}

/* ── Command palette (Ctrl/Cmd-K) ── */
.cmdk-ov{position:fixed;inset:0;z-index:2000;background:rgba(2,32,71,.28);display:flex;align-items:flex-start;justify-content:center;padding-top:12vh}
.cmdk-box{width:min(620px,92vw);background:#fff;border:1px solid var(--borda);border-radius:14px;box-shadow:0 24px 60px rgba(2,32,71,.28);overflow:hidden;display:flex;flex-direction:column;max-height:70vh}
.cmdk-in{border:none;outline:none;padding:16px 18px;font-size:16px;border-bottom:1px solid var(--borda);color:var(--texto)}
.cmdk-list{overflow:auto;padding:6px}
.cmdk-grp{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:8px 10px 4px}
.cmdk-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border-radius:8px;cursor:pointer}
.cmdk-item.sel,.cmdk-item:hover{background:#f2f7ff}
.cmdk-lb{font-size:14px}
.cmdk-sub{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:45%}
.cmdk-empty{padding:20px;text-align:center;color:var(--muted);font-size:14px}
.cmdk-foot{border-top:1px solid var(--borda);padding:8px 14px;font-size:11.5px;color:var(--muted)}
.gs-kbd{border:1px solid var(--borda);background:#f6f9ff;color:var(--muted);border-radius:6px;font-size:11px;padding:2px 6px;cursor:pointer;margin-left:6px;flex:none;align-self:center}
.gs-kbd:hover{border-color:var(--brand);color:var(--brand)}

/* ── Captação: Landing Pages + Formulários ── */
.lp-list{display:flex;flex-direction:column;gap:10px}
.lp-card{border:1px solid var(--borda);border-radius:var(--r);background:#fff;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.lp-card-main{display:flex;align-items:center;gap:20px;flex-wrap:wrap;min-width:0}
.lp-badge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px}
.lp-badge.on{background:#dcfce7;color:#166534}
.lp-badge.off{background:#e5e7eb;color:#4b5563}
.lp-metrics{display:flex;gap:16px;font-size:13px;color:var(--muted)}
.lp-metrics b{color:var(--texto)}
.lp-acts{display:flex;gap:6px;flex:none}
.lp-url{margin-top:10px;font-size:12.5px;background:#f6f9ff;border:1px solid var(--borda);border-radius:8px;padding:8px 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lp-url a{color:var(--brand);word-break:break-all}
.fm-campos{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.fm-campo{display:flex;gap:6px;align-items:center}
.fm-campo .fm-c-label{flex:1;min-width:0}
.fm-campo .fm-c-tipo{width:132px;flex:none}
.fm-c-req{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:3px;flex:none;white-space:nowrap}
.fm-c-del{border:none;background:transparent;color:#c0392b;cursor:pointer;font-size:14px;flex:none}
.camp-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:14px 0}
.camp-stat{border:1px solid var(--borda);border-radius:12px;background:#fff;padding:14px;text-align:center}
.camp-stat-n{font-size:26px;font-weight:800;color:var(--brand)}
.camp-stat-l{font-size:12px;color:var(--muted);margin-top:2px}
.camp-stat-s{font-size:12px;font-weight:700;color:#166534;margin-top:2px}

/* ── Painéis de marketing ── */
.mk-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
@media(max-width:820px){.mk-grid{grid-template-columns:1fr}}
.mk-funil-row{display:flex;align-items:center;gap:10px;margin:8px 0}
.mk-funil-lb{width:80px;font-size:13px;color:var(--muted);flex:none}
.mk-funil-bar{flex:1;background:#eef2f7;border-radius:8px;overflow:hidden;height:28px}
.mk-funil-bar div{height:100%;display:flex;align-items:center;justify-content:flex-end;padding:0 10px;color:#fff;font-weight:700;font-size:13px;border-radius:8px;min-width:32px;box-sizing:border-box;transition:width .3s}
.mk-bar-row{display:flex;align-items:center;gap:8px;margin:6px 0;font-size:13px}
.mk-bar-lb{width:120px;flex:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.mk-bar{flex:1;background:#eef2f7;border-radius:6px;height:14px;overflow:hidden}
.mk-bar div{height:100%;background:linear-gradient(90deg,#57BEB6,#1E5AA8);border-radius:6px}
.mk-bar-n{flex:none;font-weight:700;font-size:12.5px;min-width:36px;text-align:right}
.mk-evo{display:flex;align-items:flex-end;gap:8px;height:120px;padding-top:8px}
.mk-evo-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;height:100%}
.mk-evo-bar{width:70%;background:linear-gradient(180deg,#57BEB6,#1E5AA8);border-radius:6px 6px 0 0;min-height:4px}
.mk-evo-col span{font-size:11px;color:var(--muted)}

/* ══════════════════════════════════════════════════════════════════════════
   Traffic AI — Meta Ads geridos por agentes de IA + aprovação humana.
   Página-mãe (dashboard) + sub-páginas: Campanhas · Agentes · Aprovações ·
   Histórico · Contas & Config. Reaproveita .dash-card, .mk-grid, .au-* (toggles),
   .camp-stat, .table-wrap/.leads, .pills, .dform e .cat-modal — só o que é próprio
   do módulo mora aqui. JS: admin.js (carregarTraffic*). Backend: src/trafficai.js.
   ══════════════════════════════════════════════════════════════════════════ */
/* badge de contagem (fila de aprovações) grudado no item de menu */
.nav-badge{margin-left:auto;background:var(--quente);color:#fff;font-size:10.5px;font-weight:700;line-height:1;padding:3px 6px;border-radius:var(--r-pill);min-width:18px;text-align:center;flex:none}

/* faixa de status da conexão com a Meta (demo/simulado vs. real) */
.tai-meta-banner{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--borda);border-radius:var(--r);padding:12px 14px;margin-bottom:14px;background:#fff}
.tai-meta-banner.is-sim{background:#fffaf0;border-color:#f0dcae}
.tai-meta-banner.is-live{background:#f0f9f2;border-color:#c3e6cd}
.tai-meta-dot{width:9px;height:9px;border-radius:50%;flex:none;margin-top:5px;background:var(--morno)}
.tai-meta-banner.is-live .tai-meta-dot{background:#2b8a3e}
.tai-meta-banner.is-sim .tai-meta-dot{animation:taiPulse 1.8s ease-in-out infinite}
@keyframes taiPulse{0%,100%{opacity:1}50%{opacity:.35}}

/* barra de ações: filtros à esquerda, botões à direita */
.tai-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.tai-cliente-sel{min-width:170px;max-width:260px}

/* KPIs do dashboard (ROAS, CPA, CTR, gasto, receita…) */
.tai-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:14px}
.tai-stat{background:#fff;border:1px solid var(--borda);border-radius:var(--r);padding:14px 16px;box-shadow:var(--sh-1)}
.tai-stat-n{font-family:var(--display);font-size:24px;font-weight:700;color:var(--titulo);line-height:1.1}
.tai-stat-l{font-size:12.5px;color:var(--corpo);font-weight:600;margin-top:3px}
.tai-stat-s{font-size:11.5px;color:var(--muted);margin-top:1px}

/* cartões de atalho para as sub-páginas */
.tai-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:14px}
.tai-card{position:relative;cursor:pointer;transition:transform .1s,box-shadow .15s,border-color .15s}
.tai-card:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:var(--teal)}
.tai-card h3{font-size:14px;margin:0}
.tai-pill-badge{position:absolute;top:12px;right:12px;background:var(--quente);color:#fff;font-size:11px;font-weight:700;padding:2px 8px;border-radius:var(--r-pill)}

/* badge colorido genérico (status de campanha / prioridade) — cor via --c inline */
.tai-badge{display:inline-block;font-size:11.5px;font-weight:700;line-height:1;padding:4px 9px;border-radius:var(--r-pill);color:var(--c,#667);background:color-mix(in srgb,var(--c,#667) 14%,#fff);white-space:nowrap}
.tai-good{color:#2b8a3e}
.tai-bad{color:#b02a37}

/* lista compacta de recomendações (dashboard) */
.tai-declist{display:flex;flex-direction:column;gap:8px}
.tai-dec-mini{border:1px solid var(--borda);border-radius:12px;padding:11px 12px;background:#fff}
.tai-dec-head{display:flex;align-items:flex-start;gap:9px}
.tai-dec-ico{font-size:18px;line-height:1;flex:none}
.tai-dec-desc{font-size:12.5px;color:var(--corpo);margin:6px 0 0;line-height:1.4}
.tai-dec-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}
.tai-conf{font-size:11.5px;color:var(--muted);font-weight:600}

/* fila de aprovações — cards maiores em grade */
.tai-dec-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.tai-dec-card{display:flex;flex-direction:column}
.tai-dec-card .tai-dec-actions{margin-top:auto;padding-top:10px}
.tai-dec-meta{margin:8px 0 0}
.tai-dec-tag{display:inline-block;font-size:11.5px;color:var(--muted);background:#f2f5fa;border-radius:8px;padding:4px 8px}
.tai-dec-impacto{font-size:12.5px;color:#166534;background:#f0f9f2;border:1px solid #cdebd6;border-radius:8px;padding:8px 10px;margin:8px 0 0;line-height:1.4}

/* caixinha informativa (aba de agentes) */
.tai-info-box{font-size:12.5px;color:var(--corpo);background:#eef4fb;border:1px solid #d4e2f2;border-radius:10px;padding:10px 12px;margin-bottom:12px;line-height:1.45}

/* Contas & Config — linhas de status da conexão */
.tai-conn-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--borda)}
.tai-conn-row:last-of-type{border-bottom:0}
.tai-conn-lb{font-size:13px;color:var(--corpo)}
.tai-apps{margin:6px 0 0;padding-left:18px;font-size:12.5px;color:var(--muted)}

/* toast de feedback (aprovar/rejeitar/sincronizar) */
.tai-toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,16px);background:#1d2f63;color:#fff;font-size:13.5px;font-weight:600;padding:11px 18px;border-radius:10px;box-shadow:var(--sh-3);z-index:200;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:90vw}
.tai-toast.show{opacity:1;transform:translate(-50%,0)}
.tai-toast.is-erro{background:#b02a37}
@media(max-width:820px){.tai-dec-grid{grid-template-columns:1fr}}

/* ── Editor de conteúdo (rich text) — e-mail marketing e afins ── */
.rte{border:1px solid var(--borda);border-radius:var(--r-md);overflow:hidden;background:#fff;margin-top:6px}
.rte-bar{display:flex;flex-wrap:wrap;align-items:center;gap:2px;padding:6px;background:var(--papel);border-bottom:1px solid var(--borda)}
.rte-bar button{min-width:30px;height:30px;padding:0 8px;border:1px solid transparent;border-radius:7px;background:transparent;cursor:pointer;font-size:13px;color:var(--corpo);display:inline-flex;align-items:center;justify-content:center;line-height:1;font-family:var(--corpo-f)}
.rte-bar button:hover{background:#e8eef6;border-color:#dbe4ee}
.rte-bar button:active{transform:translateY(1px)}
.rte-sep{width:1px;height:20px;background:var(--borda);margin:0 3px}
.rte-spacer{flex:1}
.rte-color{display:inline-flex;align-items:center;gap:3px;cursor:pointer;font-size:14px;font-weight:700;color:var(--corpo);padding:0 5px;height:30px;border-radius:7px}
.rte-color:hover{background:#e8eef6}
.rte-color input{width:20px;height:20px;border:none;background:none;padding:0;cursor:pointer}
.rte-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px!important;color:var(--azul)!important}
.rte-edit{min-height:220px;max-height:440px;overflow:auto;padding:16px 18px;font-size:14px;line-height:1.6;color:#1e293b;outline:none;font-family:var(--corpo-f)}
.rte-edit:focus{box-shadow:inset 0 0 0 2px rgba(58,91,169,.14)}
.rte-edit img{max-width:100%;height:auto}
.rte-edit h2{font-size:20px;margin:.4em 0}
.rte-edit h3{font-size:17px;margin:.4em 0}
.rte-edit a{color:var(--azul)}
.rte-edit:empty::before{content:'Escreva o conteúdo do e-mail aqui…';color:var(--muted)}
.rte-src{width:100%;min-height:280px;border:none;padding:14px 16px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;line-height:1.55;color:#1e293b;resize:vertical;outline:none;background:#fbfcfe}

/* grade de cards das páginas-mãe (Administração, Captação, Portal…)
   ── ONDA 24 · DENSIDADE E ALINHAMENTO ────────────────────────────────────────
   O que estava errado não era o grid, era o CARD: ele é uma coluna flex e o
   "Abrir →" vinha logo depois do texto, então em card de frase curta ele subia e
   em card de frase longa ele descia. Numa fileira de cinco, cinco alturas de
   chamada diferentes — a fileira parecia desalinhada mesmo com os cards do mesmo
   tamanho (o grid já os estica por igual, `align-items:stretch` é o padrão).
   `margin-top:auto` no `.lnk-mini` come a sobra ANTES da chamada e encosta todas
   na mesma linha de base. As abas ficam logo abaixo do texto, como estavam.

   `auto-fill` fica (e não `auto-fit`) de propósito: com a permissão fina desta
   onda, uma mãe pode aparecer com UM card para um membro. Com `auto-fit` esse
   card único esticaria a largura inteira da tela e ficaria uma faixa gigante;
   com `auto-fill` ele mantém a largura de sempre, e a página continua parecendo
   a mesma página para todo mundo. `align-content:start` evita que poucas fileiras
   se espalhem verticalmente quando a seção é alta. */
.mod-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:14px;align-content:start}
.mod-cards .mod-card{cursor:pointer}
.mod-card > .lnk-mini{margin-top:auto;padding-top:10px}
.mod-card-abas{margin-top:8px}
@media (max-width:560px){ .mod-cards{grid-template-columns:1fr} }

/* ── ONDA 24 · o seletor de permissões (48 módulos em 12 grupos) ─────────────
   ⚠ A 1ª VERSÃO ERRAVA NA LARGURA, NÃO NO AGRUPAMENTO. Ela agrupava certo e
   desenhava cada grupo numa grade de duas colunas ocupando o container inteiro:
   num monitor de 1900px, dois módulos do MESMO grupo ficavam a ~1000px um do
   outro. O espaço em branco passava a SEPARAR o que deveria juntar, que é o
   oposto do trabalho dele, e o "marcar todos" fugia para a borda direita porque
   o cabeçalho era `space-between` na largura toda.
   O conserto é de layout, não de estilo: cada grupo virou um CARD ESTREITO numa
   grade de cards. A leitura passa a ser vertical dentro de uma coluna curta —
   o olho percorre centímetros, não a tela inteira — e o cabeçalho, os itens e o
   botão do grupo ficam todos dentro da mesma caixa, que é o que diz "isto aqui
   é um conjunto". `align-items:start` porque os grupos têm alturas diferentes
   (Ferramentas tem 9 módulos, Estúdio tem 1) e esticar todos ao mais alto
   encheria os menores de vazio. */
.perm-grupos{display:grid;grid-template-columns:repeat(auto-fill,minmax(296px,1fr));
  gap:12px;align-items:start}
.perm-grupo{border:1px solid var(--borda);border-radius:12px;background:#fff;
  padding:10px 12px 8px;margin:0;min-width:0}
.perm-grupo-cab{display:flex;align-items:baseline;gap:8px;width:100%;padding:0 0 7px;
  margin-bottom:4px;border-bottom:1px solid #eef1f6}
.perm-grupo-nome{font-size:11px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);font-weight:700;flex:1;min-width:0}
/* o contador usa algarismo tabular: sem isso "10/11" e "3/9" dançam a cada clique */
.perm-conta{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:600}
.perm-conta-on{color:var(--azul)}
.perm-todos{background:none;border:0;padding:0;font:inherit;font-size:11.5px;color:var(--azul);
  cursor:pointer;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.perm-todos:disabled{color:var(--muted);cursor:default;text-decoration:none}
.perm-todos:focus-visible{outline:2px solid var(--azul);outline-offset:2px;border-radius:4px}
/* a linha inteira é clicável (é um <label>), então ela precisa de área de toque
   e de resposta visual — caixa de 16px sozinha é alvo pequeno demais. */
.perm-item{display:flex;gap:9px;align-items:flex-start;padding:7px 6px;border-radius:8px;
  cursor:pointer;transition:background .12s}
.perm-item:hover{background:#f5f8fd}
.perm-item input{margin:2px 0 0;width:16px;height:16px;flex:none;accent-color:var(--azul)}
.perm-item input:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
.perm-item-txt{display:flex;flex-direction:column;gap:1px;min-width:0}
.perm-item-nome{font-size:13.5px;font-weight:500;color:var(--corpo);line-height:1.3}
/* ── ONDA 25 · O SELETOR VIROU O MENU ────────────────────────────────────────
   Uma linha = uma página, então some a segunda linha ("as telas que este módulo
   abre") e cada item fica bem mais baixo — o que permite as 100 caixas caberem
   nos 12 cards sem virar rolagem infinita. O respiro maior da Onda 24 existia
   para acomodar a sublinha que não existe mais.
   ⚠ A FAIXA DA ETAPA ocupa a fileira INTEIRA da grade (grid-column:1/-1). Sem
   isso ela entra como se fosse mais um card, e a divisão AGÊNCIA/GESTÃO/
   MARKETING — que é justamente o que faz esta tela ser LIDA como o menu —
   viraria ruído no meio dos cards em vez de separar. */
.perm-item{padding:5px 6px}
.perm-etapa{grid-column:1/-1;font-size:11.5px;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);padding:2px 2px 6px;
  border-bottom:1px solid var(--linha);margin:16px 0 2px}
.perm-etapa:first-child{margin-top:2px}
/* subtítulo DENTRO da gaveta (Acesso & pessoas, Conexões, Operação…): existe no
   menu, então existe aqui. Sem ele a Administração vira 14 caixas soltas e a
   comparação com a barra lateral deixa de ser visual, que é o pedido. */
.perm-sub{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--muted);padding:9px 6px 3px}
.perm-lista > .perm-sub:first-child{padding-top:2px}
/* as telas que o módulo abre: subordinadas de propósito (menor, mais claras).
   Elas informam a decisão; competir com o rótulo faria o olho ler duas vezes. */
/* 12px e não 11.5: é o piso de legibilidade da casa, e esta linha é justamente
   a que a pessoa lê para DECIDIR — texto de decisão não pode ser o menor da tela. */
.perm-item-telas{font-size:12px;color:var(--muted);line-height:1.4;word-break:break-word}
.perm-item-telas em{font-style:italic;opacity:.85}
/* ── ONDA 24 · O CARD NÃO ESCONDE MAIS TELA NENHUMA ──────────────────────────
   Achado do dono: "Gestão Comercial tem 2 para marcar, quando na verdade tem 5
   páginas". Faltavam três coisas, por três motivos diferentes — e sumir é o pior
   deles, porque quem lê conclui que a tela não existe.
   · linha TRAVADA: o módulo existe e é exclusivo do Proprietário (Propostas,
     Negociações). Aparece com selo, sem cursor de clique e sem hover — o
     `disabled` já a mantém fora do que é salvo.
   · rodapé: telas da gaveta cujo dono é módulo de OUTRO card, dizendo qual, e
     telas abertas a todos. Não são caixas porque a caixa delas mora em outro
     lugar; duas caixas para a mesma chave seria mentira pior que a omissão. */
.perm-item-travado{cursor:default;opacity:.72}
.perm-item-travado:hover{background:transparent}
.perm-selo{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;
  background:#eef2fb;color:var(--azul);font-size:10.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.03em;vertical-align:1px}
.perm-extra{list-style:none;margin:6px 0 0;padding:8px 6px 2px;border-top:1px dashed #e8ecf3}
.perm-extra li{font-size:12px;color:var(--muted);line-height:1.45;margin-bottom:4px}
.perm-extra b{color:var(--corpo);font-weight:600}
@media (max-width:640px){ .perm-grupos{grid-template-columns:1fr} }

/* ── Portal do cliente (admin) ── */
.pt-list{display:flex;flex-direction:column;gap:8px}
.pt-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid var(--borda);border-radius:12px;padding:12px 14px}
.pt-cli{display:flex;align-items:center;gap:10px;min-width:200px;flex:1}
.pt-avatar{width:38px;height:38px;border-radius:10px;background:var(--grad);color:#fff;display:grid;place-items:center;font-weight:700;flex:none}
.pt-cli-info{min-width:0}.pt-cli-info b{display:block;font-size:14.5px;overflow:hidden;text-overflow:ellipsis}
.pt-status{flex:none}
.pt-badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;white-space:nowrap}
.pt-badge.on{background:#e6f6ec;color:#1f8a4d}.pt-badge.off{background:#fdf2df;color:#a8720d}.pt-badge.none{background:#eef1f7;color:var(--muted)}
/* v212 · selo de PEÇA DE DEMONSTRAÇÃO. Mesmo âmbar da marca na página pública
   (#fdf2df/#8a5d0a) para que quem vê o portal e quem vê a lista reconheçam a
   mesma coisa. Contorno mais forte que os outros selos de propósito: aqui o
   erro caro é NÃO notar. */
.pt-badge.modelo{background:#fdf2df;color:#8a5d0a;border:1px solid #e6c78a}
.pt-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.pt-unread{background:#e8552d;color:#fff;font-size:11px;font-weight:700;padding:0 6px;border-radius:20px;margin-left:2px}
.pt-chat{max-height:44vh;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:10px;background:var(--papel);border-radius:12px;border:1px solid var(--borda);margin-top:6px}
.pt-msg{max-width:82%;padding:8px 12px;border-radius:12px;font-size:14px}
.pt-msg p{margin:0;white-space:pre-wrap;word-wrap:break-word}
.pt-msg time{display:block;font-size:10.5px;opacity:.75;margin-top:3px}
.pt-msg.cli{align-self:flex-start;background:#eef2fb;color:var(--corpo)}
.pt-msg.ag{align-self:flex-end;background:var(--grad);color:#fff}
.pt-reply{display:flex;gap:8px;margin-top:10px;align-items:flex-end}
.pt-reply textarea{flex:1}
/* .pt-secs/.pt-sec saíram na Onda 19 junto com portalConfigModal (ver o motivo
   escrito em admin.js). Eram só daquele modal morto; a LISTA de clientes usa
   .pt-row/.pt-badge/.pt-list, que continuam. */
/* Escopo contratado + serviços extras (dentro do modal do portal) */
.esc-sec{margin-top:16px}
.esc-sec h4{font-size:14px;margin:0 0 8px;display:flex;gap:6px;align-items:baseline}
.esc-sec h4 .muted{font-weight:400;font-size:12px}
.esc-list{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.esc-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid var(--borda);border-radius:9px;background:#fff}
.esc-item-txt{flex:1;min-width:0}.esc-item-txt b{display:block;font-size:14px}
.esc-val{font-weight:700;font-size:14px;color:var(--corpo);white-space:nowrap}

/* ── Pós-venda / entrega (tickets) ── */
.in-sm{padding:8px 10px;font-size:13px;max-width:190px}
.pv-pill{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px;white-space:nowrap;border:1px solid transparent;line-height:1.7}
.pv-list{display:flex;flex-direction:column;gap:8px}
.pv-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#fff;border:1px solid var(--borda);border-radius:12px;padding:12px 14px;cursor:pointer;transition:border-color .12s,box-shadow .12s}
.pv-row:hover{border-color:var(--azul);box-shadow:0 2px 10px rgba(20,40,80,.06)}
.pv-main{display:flex;align-items:center;gap:12px;min-width:230px;flex:1}
.pv-proto{font-size:12px;font-weight:800;color:var(--muted);letter-spacing:.3px;flex:none;font-variant-numeric:tabular-nums}
.pv-tit{min-width:0}.pv-tit b{display:block;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-tags{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.pv-prazo{flex:none;font-size:13px;color:var(--corpo);min-width:120px;text-align:right}
.pv-atraso{color:#e03131;font-weight:700;font-size:12px}
.pv-arqchk{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);white-space:nowrap;cursor:pointer}
.pv-arqchk input{width:16px;height:16px;accent-color:var(--azul);cursor:pointer}
.pv-form{display:flex;flex-direction:column;gap:12px}
.pv-fld{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600;color:var(--corpo)}
.pv-fld .in{font-weight:400}
.pv-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pv-det h3{margin:0 0 8px}
.pv-det-meta{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.pv-det-info{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--corpo);padding:10px 0;border-top:1px solid var(--borda);border-bottom:1px solid var(--borda)}
.pv-desc{font-size:14px;color:var(--corpo);margin:12px 0;white-space:pre-wrap;word-wrap:break-word}
.pv-stbar{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}
.pv-stbtn.ativo{font-weight:700;background:var(--papel)}
.pv-timeline{display:flex;flex-direction:column;gap:8px;max-height:38vh;overflow:auto;padding:4px 2px;margin:8px 0}
.pv-msg{border:1px solid var(--borda);border-radius:10px;padding:9px 12px;background:#fff}
.pv-msg.int{background:#fffbeb;border-color:#f5e2a8}
.pv-msg.cli{background:#eef6ff;border-color:#cfe1f7}
.pv-msg p{margin:4px 0 0;font-size:14px;color:var(--corpo);word-wrap:break-word}
.pv-msg-h{display:flex;align-items:center;gap:8px;font-size:12px}
.pv-msg-h time{margin-left:auto;color:var(--muted);font-size:11px}
.pv-int-tag{background:#f5c518;color:#5b4600;font-size:10px;font-weight:700;padding:1px 7px;border-radius:20px}
.pv-cli-tag{background:#d5e6fb;color:#1c4f8a;font-size:10px;font-weight:700;padding:1px 7px;border-radius:20px}
.pv-reply{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.pv-intchk{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--muted);cursor:pointer}
.pv-intchk input{width:16px;height:16px;accent-color:#d8920f;cursor:pointer}
/* SLA: a barra de prazos do ticket (1ª resposta + solução) */
.pv-sla{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}
.pv-sla-box{flex:1;min-width:180px;border:1px solid var(--borda);border-radius:10px;padding:9px 12px;background:#fff}
.pv-sla-box b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.pv-sla-box span{font-size:13.5px;font-weight:600;color:var(--corpo)}
.pv-sla-box.ok{background:#f2fbf5;border-color:#bfe4cc}.pv-sla-box.ok span{color:#1f8a4d}
.pv-sla-box.risco{background:#fff8ec;border-color:#f0d9a8}.pv-sla-box.risco span{color:#a8720d}
.pv-sla-box.estourado{background:#fdf1f2;border-color:#f2c6ca}.pv-sla-box.estourado span{color:#c02b3a}
.pv-orig{background:#eef2fb;color:#3A5BA9;font-size:10px;font-weight:700;padding:1px 7px;border-radius:20px}
.pv-orig.cliente{background:#e6f6ec;color:#1f8a4d}
.pv-csat{background:#fdf8ec;border:1px solid #f0dcae;border-radius:10px;padding:10px 13px;font-size:13.5px;margin:10px 0}
.pv-csat b{font-size:16px;color:#a8720d}
.pv-anexos{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.pv-anexo{display:inline-flex;align-items:center;gap:6px;background:var(--papel);border:1px solid var(--borda);border-radius:8px;padding:4px 9px;font-size:12px;font-weight:600;text-decoration:none;color:var(--azul)}
.pv-anexo img{max-width:130px;max-height:100px;border-radius:6px;display:block}
.pv-anexar{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.pv-reply-acoes{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pv-sla-tab{width:100%;border-collapse:collapse;font-size:13.5px}
.pv-sla-tab th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:6px 8px}
.pv-sla-tab td{padding:6px 8px;border-top:1px solid var(--borda)}
.pv-sla-tab input{width:78px;padding:6px 8px;font-size:13px}
@media(max-width:560px){.pv-grid2{grid-template-columns:1fr}.pv-prazo{text-align:left;min-width:0}}

/* ── Forecast de receita (funil ponderado) ── */
.fc-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0}
.fc-probs{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end}
.fc-prob{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600;color:var(--corpo)}
.fc-prob-in{display:inline-flex;align-items:center;gap:4px}
.fc-prob-in input{width:64px;padding:7px 8px;border:1px solid var(--borda);border-radius:8px;font-size:14px;text-align:right}
.fc-prob-in i{color:var(--muted);font-style:normal;font-size:13px}
.fc-tblwrap{overflow-x:auto}
.fc-tbl{width:100%;border-collapse:collapse;font-size:14px}
.fc-tbl th{text-align:left;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;padding:6px 10px;border-bottom:1px solid var(--borda);white-space:nowrap}
.fc-tbl td{padding:9px 10px;border-bottom:1px solid var(--papel);vertical-align:middle}
.fc-tbl tbody tr:last-child td,.fc-tbl tbody tr:last-child td{border-bottom:none}
.fc-tbl .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.fc-tbl .cell-sub{display:block}
.fc-tbl tr.fc-sem td{color:var(--muted)}
.fc-tbl input[type=month]{max-width:150px}
@media(max-width:760px){.fc-grid{grid-template-columns:1fr}}

/* ── Rentabilidade por cliente (v275) — glue mínima; reusa .dash-card/.camp-stat/.fc-tbl ── */
.rent-load{padding:28px;text-align:center;color:var(--muted)}
.rent-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.rent-periodo{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.rent-periodo label{display:flex;flex-direction:column;font-size:11px;font-weight:700;color:var(--muted);gap:3px;text-transform:uppercase;letter-spacing:.3px}
.rent-legenda{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.rent-legenda span{display:inline-flex;align-items:center;gap:5px}
.rent-legenda i{width:11px;height:11px;border-radius:3px;display:inline-block}
.rent-aviso{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.rent-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:middle}
.rent-tag{display:inline-block;padding:1px 8px;border-radius:999px;border:1px solid;font-size:11.5px;font-weight:700;white-space:nowrap}
.rent-warn{cursor:help}
.rent-vazio{padding:22px;border:1px dashed var(--borda);border-radius:12px;background:var(--papel);color:var(--muted)}
.rent-vazio b{color:var(--titulo);display:block;margin-bottom:6px}
.rent-vazio p{margin:0;font-size:13px;line-height:1.5}
.rent-semcli{border-color:#fdba74;background:#fff7ed}
.rent-semcli-body{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.rent-semcli-num{text-align:center}
.rent-big{font-size:24px;font-weight:800;color:var(--titulo)}
.rent-semcli-txt{margin:0;flex:1;min-width:220px;font-size:13px;line-height:1.5;color:#9a3412}
.rent-editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:14px}
.rent-sub{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;margin-bottom:8px}
.rent-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap;border-top:1px solid var(--borda);padding-top:14px}
.rent-valor{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--muted)}
.rent-valor input{width:120px}
.rent-vig-lbl{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.rent-semdef{background:#fef2f2}
@media(max-width:760px){.rent-editor-grid{grid-template-columns:1fr}.rent-toolbar{align-items:flex-start}}

/* ── WhatsApp em massa (broadcast) ── */
.bc-prog{display:flex;align-items:center;gap:8px;min-width:140px}
.bc-prog-bar{flex:1;height:8px;background:var(--papel);border-radius:20px;overflow:hidden;min-width:80px}
.bc-prog-bar.big{height:12px}
.bc-prog-bar i{display:block;height:100%;background:#25d366;border-radius:20px;transition:width .2s}
.bc-prog span{font-size:12px;font-weight:700;color:var(--muted);white-space:nowrap}
.bc-vars{font-size:12.5px;color:var(--muted)}.bc-vars code,.ia-alert code{background:var(--papel);padding:1px 6px;border-radius:5px;font-size:12px}
.bc-preview{font-size:13.5px;padding:10px 12px;background:var(--papel);border-radius:10px}
.bc-alvos{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.bc-alvo{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--borda);border-radius:10px;padding:10px 14px}
.bc-alvo.ok{background:#f2fbf5;border-color:#c7ecd3}
.bc-alvo-info{min-width:0}.bc-alvo-info b{display:block;font-size:14px}
.bc-alvo-acts{display:flex;align-items:center;gap:8px;flex:none}

/* ── Financeiro: lançamentos recorrentes (F1) ── */
.fr-list{display:flex;flex-direction:column;gap:6px;margin:6px 0 10px}
.fr-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid var(--borda);border-radius:10px;padding:10px 14px}
.fr-row.inativa{opacity:.62}
.fr-main{flex:1;min-width:180px}.fr-main b{display:block;font-size:14px}
.fr-val{font-weight:700;font-size:15px;white-space:nowrap;font-variant-numeric:tabular-nums}
.fr-val.receita{color:#1f8a4d}.fr-val.despesa{color:#c0392b}
.fr-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}

/* ── Financeiro: cartões de crédito (F2) ── */
.cc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.cc-card{background:#fff;border:1px solid var(--borda);border-radius:14px;padding:16px;box-shadow:var(--sombra)}
.cc-card.inativo{opacity:.62}
.cc-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.cc-top b{font-size:16px}
.cc-bar{height:8px;background:var(--papel);border-radius:20px;overflow:hidden;margin-bottom:5px}
.cc-bar i{display:block;height:100%;border-radius:20px;transition:width .2s}
.cc-limite-l{display:flex;justify-content:space-between;font-size:13px;color:var(--corpo)}
.cc-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:12px}
.cc-faturas{display:flex;flex-direction:column;gap:6px;max-height:52vh;overflow:auto}
.cc-fatura{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#fff;border:1px solid var(--borda);border-radius:10px;padding:10px 12px}
.cc-fat-main{flex:1;min-width:150px}.cc-fat-main b{display:block;font-size:14px;text-transform:capitalize}
.cc-fat-tot{font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}
.cc-fat-acts{display:flex;gap:6px}
.cc-fat-itens{flex-basis:100%;display:flex;flex-direction:column;gap:4px;margin-top:6px;padding-top:8px;border-top:1px solid var(--papel)}
.cc-item{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--corpo)}

/* ── Financeiro: orçamento (F3) + previsão (F4) ── */
.orc-list{display:flex;flex-direction:column;gap:16px}
.orc-head{display:flex;justify-content:space-between;gap:8px;font-size:14px;margin-bottom:5px}
.orc-estouro{color:#e03131;font-weight:700;font-size:12px}
.orc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:5px;gap:8px}
.orc-acts{display:flex;gap:4px;flex:none}
.prev-list{display:flex;flex-direction:column}
.prev-row{display:flex;align-items:center;gap:12px;padding:9px 8px;border-bottom:1px solid var(--papel);flex-wrap:wrap}
.prev-row:last-child{border-bottom:none}
.prev-row.atual{background:var(--papel);border-radius:8px}
.prev-mes{flex:1;min-width:90px;font-weight:600;font-size:14px;text-transform:capitalize}
.prev-row.neg .prev-mes{color:#e03131}
.prev-flux{display:flex;gap:10px;font-size:12.5px;flex-wrap:wrap}
.prev-ent{color:#1f8a4d;font-variant-numeric:tabular-nums}.prev-sai{color:#c0392b;font-variant-numeric:tabular-nums}
.prev-saldo{min-width:110px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.prev-saldo.neg{color:#e03131}
/* Lead scoring: faixas de score */
.fx-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.fx-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--borda);border-radius:10px;background:#fff;cursor:pointer;transition:border-color .12s}
.fx-row:hover{border-color:var(--azul)}
.fx-dot{width:12px;height:12px;border-radius:50%;flex:none}
.fx-main{flex:1;min-width:0}.fx-main b{display:block;font-size:14px}

/* ── Central de notificações (sino) ── */
.notif-wrap{position:relative}
.notif-bell{position:relative;border:1px solid var(--borda);background:#fff;border-radius:10px;width:38px;height:38px;display:grid;place-items:center;cursor:pointer;color:var(--corpo)}
.notif-bell:hover{border-color:var(--azul)}
.notif-badge{position:absolute;top:-6px;right:-6px;background:#e8552d;color:#fff;font-size:10.5px;font-weight:700;border-radius:20px;padding:1px 5px;min-width:16px;text-align:center}
.notif-panel{position:absolute;right:0;top:46px;width:360px;max-width:calc(100vw - 30px);background:#fff;border:1px solid var(--borda);border-radius:14px;box-shadow:0 16px 44px rgba(20,40,90,.18);z-index:1100;overflow:hidden}
.notif-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid var(--borda);background:var(--papel)}
.notif-list{max-height:380px;overflow:auto}
.notif-item{padding:10px 14px;border-bottom:1px solid var(--papel);cursor:pointer}
.notif-item:hover{background:var(--papel)}
.notif-item.nova{background:#f2f7ff}
.notif-item b{display:block;font-size:13.5px}
.notif-item time{display:block;font-size:11px;color:var(--muted);margin-top:2px}

/* ── Pipelines (funis múltiplos) ── */
.pl-et{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.pl-et .pl-lb{flex:1}
.pl-et .pl-pb{width:74px;text-align:right}

/* ── Cérebro da IA + Copiloto global ── */
.cb-list{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.cb-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--borda);border-radius:10px;background:#fff;cursor:pointer;transition:border-color .12s}
.cb-row:hover{border-color:var(--azul)}
.cb-row.inativa{opacity:.62}
.cb-main{flex:1;min-width:0}.cb-main b{display:block;font-size:14px}
.copilot-out{margin-top:12px;padding:14px;border:1px solid var(--borda);border-radius:12px;background:var(--papel);font-size:14px;line-height:1.55;overflow-wrap:break-word}
.ia-fab{position:fixed;right:22px;bottom:22px;width:52px;height:52px;border-radius:50%;border:none;background:var(--grad);color:#fff;font-size:22px;cursor:pointer;box-shadow:0 8px 24px rgba(20,40,90,.28);z-index:1200;transition:transform .12s}
.ia-fab:hover{transform:scale(1.07)}
.ia-panel{position:fixed;right:22px;bottom:84px;width:380px;max-width:calc(100vw - 44px);height:540px;max-height:calc(100vh - 120px);background:#fff;border:1px solid var(--borda);border-radius:16px;box-shadow:0 18px 50px rgba(20,40,90,.22);z-index:1200;display:flex;flex-direction:column;overflow:hidden}
.ia-panel-head{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--borda);background:var(--papel)}
.ia-panel-head b{font-size:14px;white-space:nowrap}
.ia-panel-head .in{flex:1;min-width:0;max-width:none}
.ia-msgs{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:10px}
.ia-hello{font-size:13.5px;color:var(--muted);background:var(--papel);border-radius:12px;padding:10px 12px}
.ia-msg{max-width:92%;padding:9px 12px;border-radius:12px;font-size:14px;line-height:1.5;overflow-wrap:break-word}
.ia-msg.de-user{align-self:flex-end;background:var(--grad);color:#fff}
.ia-msg.de-ia{align-self:flex-start;background:var(--papel);color:var(--corpo);border:1px solid var(--borda)}
.ia-input{display:flex;gap:8px;padding:10px;border-top:1px solid var(--borda)}
.ia-input textarea{flex:1;resize:none;border:1px solid var(--borda);border-radius:10px;padding:8px 10px;font:inherit;font-size:14px}
.ia-input .btn{padding:8px 14px}
/* `.ia-ask` e `.dash-hero .copilot-out` saíram junto com a caixa "Pergunte à IA"
   do Início (20/07). Eram os únicos usos — CSS órfão vira regra que ninguém sabe
   se pode mexer. O Copiloto lateral (.ia-panel/.ia-input abaixo) continua. */
@media(max-width:560px){.ia-panel{right:10px;left:10px;width:auto}}

/* ── Sequências de follow-up (editor de passos) ── */
.seq-passos{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.seq-passo{border:1px solid var(--borda);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px;background:var(--papel);position:relative}
.seq-passo::before{content:'';position:absolute;left:-1px;top:12px;bottom:12px;width:3px;border-radius:3px;background:var(--grad)}
.seq-passo-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.seq-passo-top .sp-canal{max-width:150px}
.seq-atraso{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--muted)}
.seq-atraso .in{width:56px;padding:6px 8px}
.seq-passo .sp-del{margin-left:auto}
.busca-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border:1px solid var(--borda);border-radius:10px;margin-bottom:6px}
.busca-item .cell-sub{display:block}

/* ── Copilot (IA) ── */
.copilot-body{font-size:14px;line-height:1.6;color:var(--corpo);max-height:56vh;overflow:auto}
.copilot-body h4{margin:12px 0 4px;color:var(--azul-esc);font-size:14.5px}
.copilot-body p{margin:5px 0}
.copilot-body ul{margin:4px 0 10px;padding-left:20px}
.copilot-body li{margin:2px 0}
.copilot-body b{color:var(--azul-esc)}
.copilot-ctx{white-space:pre-wrap;font-size:12.5px;background:var(--papel);border:1px solid var(--borda);border-radius:8px;padding:10px;margin-top:8px;color:var(--corpo)}

/* ── Notas livres ── */
.nt-list{max-height:40vh;overflow:auto;display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.nt-item{border:1px solid var(--borda);border-radius:10px;padding:10px 12px;background:var(--papel)}
.nt-corpo{font-size:14px;white-space:pre-wrap;color:var(--corpo);line-height:1.5}
.nt-meta{display:flex;justify-content:space-between;align-items:center;margin-top:6px;font-size:11.5px;color:var(--muted)}
.nt-add{display:flex;gap:8px;align-items:flex-end}
.nt-add textarea{flex:1}

/* ── PAINEL MODULAR (grade de blocos arrastáveis e redimensionáveis) ──────────
   Grade de 12 colunas com linhas de altura fixa: o bloco ocupa --pw colunas por
   --ph linhas, que é exatamente o que fica gravado no banco.
   SEM `grid-auto-flow: dense`: denso reempacota os blocos e o que a pessoa
   arrastou reaparece noutro lugar — a ordem do DOM tem que ser a ordem da tela
   para o arrastar ser previsível e o que se vê ser o que se grava.            */
.pn-painel h3{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pn-acoes{display:flex;align-items:center;gap:8px}
.pn-status{font-size:11.5px;color:var(--muted);opacity:0;transition:opacity .18s}
.pn-status.aparece{opacity:1}
.pn-status.erro{color:var(--quente);font-weight:600}
.pn-dica{font-size:11.5px;color:var(--muted);margin:10px 0 0}
.pn-dica b{font-size:13px;color:var(--corpo)}

.pn-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:104px;gap:12px;margin-top:4px}
.pn-b{position:relative;grid-column:span var(--pw,4);grid-row:span var(--ph,1);
  background:var(--branco);border:1px solid var(--borda);border-radius:var(--r);
  padding:10px 12px 12px;min-width:0;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--sh-1)}
.pn-b:hover{box-shadow:var(--sh-2)}
.pn-b-top{display:flex;align-items:center;gap:6px;flex:none;margin-bottom:6px}
.pn-b-tit{margin:0;font-size:12px;font-weight:700;color:var(--corpo);flex:1;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:.01em}
.pn-grip{cursor:grab;color:var(--muted);font-size:13px;line-height:1;flex:none;user-select:none}
.pn-b:active .pn-grip{cursor:grabbing}
.pn-b-x,.pn-b-ed{background:none;border:none;cursor:pointer;color:var(--muted);font-size:12px;line-height:1;
  padding:3px;flex:none;opacity:0;transition:opacity .15s;min-width:24px;min-height:24px}
.pn-b:hover .pn-b-x,.pn-b:focus-within .pn-b-x,
.pn-b:hover .pn-b-ed,.pn-b:focus-within .pn-b-ed{opacity:.75}
.pn-b-x:hover{opacity:1;color:var(--quente)}
.pn-b-ed:hover{opacity:1;color:var(--azul)}
/* o lápis só some no hover para não poluir a grade; no teclado ele PRECISA
   aparecer ao receber foco, senão vira um botão invisível que só o mouse acha */
.pn-b-ed:focus-visible,.pn-b-x:focus-visible{opacity:1}

/* ── editor de bloco (modelo de gráfico + nome) ── */
.pn-tipos{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
/* cada modelo é um CARD com miniatura-exemplo em cima + rótulo embaixo */
.pn-tipo-b{background:var(--papel);border:1px solid var(--borda);border-radius:10px;cursor:pointer;
  padding:8px;transition:border-color .15s,background .15s,box-shadow .15s;
  display:flex;flex-direction:column;align-items:center;gap:6px;width:118px}
.pn-tipo-b:hover{border-color:var(--azul);box-shadow:0 4px 12px rgba(58,91,169,.1)}
.pn-tipo-b.sel{border-color:var(--azul);background:#eef2fb;box-shadow:inset 0 0 0 1px var(--azul)}
.pn-tipo-lb{font-size:12px;font-weight:600;color:var(--corpo);display:inline-flex;align-items:center;gap:5px}
.pn-tipo-b.sel .pn-tipo-lb{color:var(--azul)}
.pn-tipo-b em{font-style:normal;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);border:1px solid var(--borda);border-radius:4px;padding:1px 3px}
/* miniatura (exemplo genérico da forma; a Prévia embaixo mostra os dados reais) */
.pn-th{width:100%;height:46px;display:flex;align-items:center;justify-content:center;
  background:var(--branco);border:1px solid var(--borda);border-radius:6px;overflow:hidden}
.pn-th svg{display:block}
.pn-th-kpi{font-size:22px;font-weight:800;color:var(--azul);font-variant-numeric:tabular-nums}
.pn-th-prog{width:74px;height:8px;border-radius:5px;background:#e6eaf2;overflow:hidden;display:block}
.pn-th-prog>i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#57BEB6,#3A5BA9)}
.pn-th-lista{width:80px;display:flex;flex-direction:column;gap:4px}
.pn-th-lista>span{height:5px;border-radius:3px;background:#dbe1ee}
.pn-th-lista>span:nth-child(2){width:72%}
.pn-th-lista>span:nth-child(3){width:88%}
.pn-prev{position:relative;margin-top:14px;border:1px solid var(--borda);border-radius:var(--r);
  background:var(--branco);padding:20px 12px 12px}
/* ALTURA FIXA, não min-height: os gráficos usam height:100% e, na grade, quem
   limita é a linha do grid (104px). Sem um teto aqui o height:100% resolve
   contra altura automática e o SVG cresce até virar um quadrado de 450px —
   foi exatamente o que aconteceu. 180px ≈ um bloco de 2 linhas. */
.pn-prev .pn-b-corpo{height:180px;display:flex;flex-direction:column;justify-content:center}
.pn-prev-tag{position:absolute;top:6px;left:10px;font-size:10px;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:var(--muted)}
.pn-b-corpo{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center}
.pn-vazio{margin:0;font-size:12px;color:var(--muted);text-align:center}
.pn-arrastando{opacity:.45}
.pn-redim{outline:2px dashed var(--azul);outline-offset:-2px}

/* alças: uma na borda direita (largura) e uma no canto (largura + altura) */
.pn-alca{position:absolute;background:none;border:none;padding:0;opacity:0;transition:opacity .15s}
.pn-b:hover .pn-alca,.pn-b:focus-within .pn-alca,.pn-alca:focus-visible{opacity:1}
.pn-alca-l{top:34%;bottom:34%;right:0;width:12px;cursor:ew-resize}
.pn-alca-l::before{content:'';position:absolute;top:50%;right:4px;transform:translateY(-50%);
  width:3px;height:22px;border-radius:2px;background:var(--azul);opacity:.5}
.pn-alca-c{right:0;bottom:0;width:20px;height:20px;cursor:nwse-resize}
.pn-alca-c::before{content:'';position:absolute;right:3px;bottom:3px;width:9px;height:9px;
  border-right:2.5px solid var(--azul);border-bottom:2.5px solid var(--azul);border-radius:0 0 3px 0;opacity:.65}
.pn-alca:focus-visible{outline:2px solid var(--azul);outline-offset:1px;border-radius:3px}

/* número grande (kpi) */
.pn-kpi{text-align:center}
.pn-kpi-n{font-family:var(--display);font-size:clamp(20px,4.4vw,30px);font-weight:800;color:var(--brand);
  line-height:1.05;word-break:break-word}
.pn-kpi-l{font-size:11.5px;color:var(--muted);margin-top:4px}

/* série temporal (linha) */
.pn-linha{display:flex;flex-direction:column;height:100%;gap:4px}
.pn-linha-topo{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex:none}
.pn-linha-topo b{font-family:var(--display);font-size:19px;color:var(--brand);line-height:1}
.pn-delta{font-size:11px;font-weight:700;color:var(--muted)}
.pn-delta.sobe{color:#2b8a3e}.pn-delta.desce{color:var(--quente)}
/* o SVG estica nos dois eixos; o traço não engorda por causa do non-scaling-stroke */
.pn-svg{flex:1;min-height:26px;width:100%;display:block}
.pn-eixo{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);flex:none}

/* barras */
.pn-barras{display:flex;align-items:flex-end;gap:6px;height:100%;min-height:0;padding-bottom:2px}
.pn-bar{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;height:100%}
.pn-bar-v{font-size:10px;color:var(--muted);flex:none;white-space:nowrap;line-height:1}
/* justify-content:flex-end cola o número no topo da SUA barra, não no topo do bloco */
.pn-bar-col{flex:1;width:100%;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:2px}
.pn-bar-col i{display:block;width:100%;border-radius:4px 4px 0 0;background:linear-gradient(180deg,#57BEB6,#3A5BA9)}
.pn-bar-col i.neg{background:linear-gradient(180deg,#f0a08a,var(--quente))}
.pn-bar-l{font-size:9.5px;color:var(--muted);flex:none;max-width:100%;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}

/* rosca — aqui o aspecto é preservado (círculo tem que ser círculo) */
.pn-rosca{display:flex;align-items:center;gap:10px;height:100%;min-height:0}
.pn-donut{width:auto;height:100%;max-height:150px;min-width:64px;flex:none}
.pn-leg{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;overflow:auto}
.pn-leg-i{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--corpo);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pn-leg-i span{width:8px;height:8px;border-radius:3px;flex:none}
.pn-leg-i b{margin-left:auto;color:var(--muted);font-weight:700}

/* lista */
.pn-lista{list-style:none;margin:0;padding:0;overflow:auto;height:100%;min-height:0}
.pn-lista li{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--borda);font-size:12px}
.pn-lista li:last-child{border-bottom:none}
.pn-lista a,.pn-li-b{display:flex;align-items:center;gap:8px;width:100%;color:inherit;text-decoration:none;
  background:none;border:none;padding:0;font:inherit;text-align:left;cursor:pointer}
.pn-lista a:hover .pn-li-r,.pn-li-b:hover .pn-li-r{color:var(--brand);text-decoration:underline}
.pn-li-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.pn-li-r{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* linha secundária do item (o painel-fontes manda em `sub`: origem, data…) */
.pn-li-s{font-size:10.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pn-li-v{flex:none;font-weight:700;color:var(--muted);font-size:11.5px}

/* progresso / medidor */
.pn-prog{display:flex;flex-direction:column;gap:6px;align-items:center;text-align:center}
.pn-prog-n{font-family:var(--display);font-size:clamp(20px,4vw,28px);font-weight:800;color:var(--brand);line-height:1}
.pn-prog-n span{font-size:.5em;margin-left:1px}
.pn-prog-trilho{width:100%;height:9px;border-radius:var(--r-pill);background:#eef1f7;overflow:hidden}
.pn-prog-trilho i{display:block;height:100%;border-radius:var(--r-pill);background:var(--grad)}
.pn-prog-l{font-size:11px;color:var(--muted)}
/* ── "NÃO SEI" NO BLOCO ────────────────────────────────────────────────────
   Estado de fonte vazia: o card diz que NÃO mediu, por quê, e onde se liga.
   Nenhuma cor é cravada: --muted (4,90:1) para o motivo e --morno-txt (5,79:1)
   para o rótulo do estado — os dois tokens de texto que passam em AA. Cravar
   um cinza ou um âmbar aqui reabriria o buraco de contraste que a onda 4 já
   fechou uma vez. */
.pn-nsei{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;text-align:center;padding:2px 4px;min-height:0}
.pn-nsei-t{font-size:11px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  color:var(--morno-txt)}
/* o motivo é a parte que importa; -webkit-line-clamp evita que um texto longo
   estoure a altura do bloco e empurre o botão para fora da área visível */
.pn-nsei-m{margin:0;font-size:11.5px;line-height:1.35;color:var(--muted);
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.pn-nsei-mais{font-size:10.5px;color:var(--muted);font-style:italic}
.pn-nsei-b{font:inherit;font-size:11.5px;font-weight:600;color:var(--azul);
  background:none;border:0;border-bottom:1px dashed currentColor;padding:0 0 1px;
  cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pn-nsei-b:hover{color:var(--brand)}
.pn-nsei-b:focus-visible{outline:2px solid var(--azul);outline-offset:2px;border-radius:2px}
/* sem href não há para onde levar: vira texto, não botão morto */
.pn-nsei-onde{font-size:11.5px;color:var(--muted);font-weight:600}

/* ── O RESUMO AGRUPADO DO PAINEL ───────────────────────────────────────────
   Uma linha só para a página inteira. Fechado por padrão (<details>): com 161
   de 260 tabelas vazias, a lista aberta seria mais alta que o painel. */
.pn-faltas{margin:12px 0 0;border-top:1px solid var(--borda);padding-top:10px}
.pn-faltas>summary{cursor:pointer;font-size:12px;font-weight:600;color:var(--morno-txt);
  list-style:revert}
.pn-faltas>summary:focus-visible{outline:2px solid var(--azul);outline-offset:2px;border-radius:3px}
.pn-faltas ul{margin:8px 0 0;padding:0 0 0 2px;list-style:none;display:flex;
  flex-direction:column;gap:6px}
.pn-faltas li{font-size:12px;color:var(--muted);line-height:1.4}
.pn-faltas li b{color:var(--corpo);font-weight:700}
.pn-faltas li span{display:block}

/* descrição do bloco no catálogo */
.pn-desc{display:block;font-size:11px;color:var(--muted);font-style:normal;margin-top:1px}

/* CELULAR: menos colunas. A grade vira 6 e depois 1 coluna, e a largura gravada
   deixa de mandar — num telefone qualquer bloco ocupa a linha inteira. */
@media(max-width:900px){
  .pn-grid{grid-template-columns:repeat(6,1fr)}
  .pn-b{grid-column:span min(var(--pw,4),6)}
}
@media(max-width:600px){
  .pn-grid{grid-template-columns:1fr;grid-auto-rows:auto}
  .pn-b{grid-column:1 / -1;grid-row:auto;min-height:118px}
  .pn-alca{display:none}          /* redimensionar não faz sentido com 1 coluna */
  /* a dica fala de arrastar e das alças: no celular as alças somem e o
     drag-and-drop do HTML5 não existe em toque — prometer isso seria mentira */
  .pn-dica{display:none}
  .pn-rosca{flex-direction:column}
  .pn-donut{max-height:112px}
}

/* quem pediu menos movimento não leva transição nenhuma */
@media(prefers-reduced-motion:reduce){
  .pn-b,.pn-b-x,.pn-b-ed,.pn-tipo-b,.pn-alca,.pn-status{transition:none}
}

.pn-cat{display:flex;flex-direction:column;gap:14px;margin-top:6px;max-height:44vh;overflow:auto}
.pn-grupo{display:flex;flex-direction:column;gap:5px}
.pn-grupo-tit{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.pn-item{display:flex;align-items:center;gap:8px;padding:5px 2px}
.pn-chk{flex:1;display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer;min-width:0}
.pn-chk input{width:17px;height:17px;accent-color:var(--azul);cursor:pointer;flex:none}
.pn-chk span{overflow:hidden;text-overflow:ellipsis}
.pn-delc{background:none;border:none;cursor:pointer;font-size:13px;opacity:.6;flex:none}.pn-delc:hover{opacity:1}

/* ── Acessibilidade ── */
/* pular direto pro conteúdo (leitores de tela / teclado) — invisível até receber foco */
.skip-link{position:absolute;left:-9999px;top:8px;z-index:2000;background:var(--azul);color:#fff;padding:10px 16px;border-radius:10px;font-weight:600;text-decoration:none}
.skip-link:focus{left:8px}
/* itens do sino navegáveis por teclado */
.notif-item{cursor:pointer}
.notif-item:focus-visible{outline:2px solid var(--azul);outline-offset:-2px;border-radius:8px}
/* usuário pediu menos movimento: corta animações e transições */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}
/* mobile: inputs com 16px pra evitar o zoom automático do iOS */
@media (max-width:640px){
  .in,.select,.search,input,select,textarea{font-size:16px !important}
}

/* ── Visão 360 do cliente ── */
.v360-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;margin-top:10px}
.v360-item{display:flex;flex-direction:column;gap:2px;align-items:flex-start;text-align:left;background:var(--papel);border:1px solid var(--borda);border-radius:10px;padding:10px 12px;cursor:pointer;font-family:inherit;transition:border-color .12s}
.v360-item:hover{border-color:var(--azul)}
.v360-item.alerta{border-color:#f0c36d;background:#fffaf0}
.v360-rot{font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.v360-val{font-size:16px;color:var(--corpo)}
.v360-sub{font-size:11.5px;color:var(--muted)}

/* score do lead na lista de cadastros */
.cad-score{display:inline-block;margin-left:8px;font-size:11px;font-weight:700;color:var(--teal-texto);background:#e9f6f4;border:1px solid #cdeae6;border-radius:999px;padding:1px 8px;vertical-align:middle}

/* alvos de toque: botões-ícone pequenos ganham área mínima clicável */
.pessoa-rm,.link-rm,.cat-add,.cc-del,.pn-delc{min-width:30px;min-height:30px;display:inline-flex;align-items:center;justify-content:center}

/* ── Construtor de landing pages (tipo Wix) ── */
.lpb-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--borda)}
.lpb-status{font-size:12px;color:var(--muted)}
.lpb-status.ok{color:#2b8a3e}.lpb-status.err{color:#c93a52}
.lpb-pub{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--corpo)}
.lpb-work{display:grid;grid-template-columns:minmax(340px,440px) 1fr;gap:16px;align-items:start}
.lpb-panel{display:flex;flex-direction:column;gap:14px;min-width:0}
.lpb-preview{position:sticky;top:8px;height:calc(100vh - 170px);min-height:460px;border:1px solid var(--borda);border-radius:14px;overflow:hidden;background:#fff;box-shadow:var(--sh-2)}
.lpb-preview iframe{width:100%;height:100%;border:0;display:block}
.lpb-linkline{margin-top:10px;font-size:12px;color:var(--muted)}
.lpb-linkline span{color:var(--azul);font-weight:600}
.lpb-palette{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px;padding-top:12px;border-top:1px dashed var(--borda)}
.lpb-add{display:inline-flex;align-items:center;gap:6px;background:var(--papel);border:1px solid var(--borda);border-radius:9px;padding:7px 11px;font-size:12.5px;font-weight:600;color:var(--corpo);cursor:pointer;font-family:inherit;transition:border-color .12s}
.lpb-add:hover{border-color:var(--azul);background:#fff}
.lpb-add-ic{font-size:14px}
.lpb-card{border:1px solid var(--borda);border-radius:12px;margin-bottom:10px;background:#fff;overflow:hidden}
.lpb-card-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;background:var(--papel);border-bottom:1px solid var(--borda)}
.lpb-card-t{font-size:13px;font-weight:700;color:var(--titulo);display:inline-flex;align-items:center;gap:7px}
.lpb-card-acts{display:inline-flex;gap:2px}
.lpb-card-acts button{min-width:30px;min-height:30px;border:0;background:none;cursor:pointer;font-size:14px;border-radius:7px;color:var(--corpo)}
.lpb-card-acts button:hover{background:var(--borda)}
.lpb-card-b{padding:12px}
.lpb-f{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:9px}
.lpb-f .in,.lpb-f .select,.lpb-f textarea{font-weight:400;font-size:13.5px}
.lpb-2{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.lpb-3{display:grid;grid-template-columns:60px 1fr 30px;gap:6px;align-items:center}
.lpb-items{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.lpb-item{border:1px solid var(--borda);border-radius:9px;padding:8px;display:flex;flex-direction:column;gap:6px;background:var(--papel)}
.lpb-itdel{border:0;background:none;color:#c93a52;cursor:pointer;font-size:13px;min-width:28px;min-height:28px}
/* ══ ONDA 21 · BLOCOS DE CONTEÚDO NA PROPOSTA ══════════════════════════════════
   Reaproveita .lpb-card/.lpb-f/.lpb-add do construtor de landing pages — mesmo
   motor, mesma cara. O que é PRÓPRIO da proposta é só o agrupamento por ÂNCORA
   ("onde na proposta o bloco entra"), que a landing page não tem: lá a página é
   uma lista só, aqui ela tem espinha (abertura → plano → fases → valores → aceite).
   O grupo VAZIO continua desenhado, fininho: sem ele o arrasto não teria destino
   — a mesma lição do defeito das fases que só apareciam quando havia serviço. */
.pb-paleta{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;padding:10px;border:1px dashed var(--borda);border-radius:10px;background:var(--papel);margin-bottom:12px}
.pb-paleta-onde{display:flex;flex-direction:column;gap:4px;font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.pb-paleta-onde .select{font-size:12.5px;font-weight:600;color:var(--titulo);padding:6px 8px;min-width:190px}
.pb-grupo{border:1px solid var(--borda);border-radius:12px;padding:9px 11px;margin-bottom:9px;background:#fbfcfe}
.pb-grupo.vazio{padding:6px 11px;background:transparent;border-style:dashed}
.pb-grupo.drop-over{border-color:var(--teal);border-style:solid;background:#f0faf8;box-shadow:0 0 0 2px rgba(87,190,182,.25)}
.pb-grupo-h{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.pb-grupo-tag{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--azul);background:#eef2fb;padding:3px 10px;border-radius:20px;white-space:nowrap}
.pb-grupo-n{font-size:11px;color:var(--muted);margin-left:auto;font-weight:600}
/* idem: #9aa3b2 sobre branco = 2,54:1. É o RÓTULO da posição — se some, a pessoa
   não sabe para onde está arrastando. */
.pb-grupo.vazio .pb-grupo-tag{background:transparent;color:var(--muted);padding-left:0}
/* ⚠ CONTRASTE MEDIDO NO NAVEGADOR, NÃO NO OLHO: #aab2c0 sobre branco dá 2,13:1 —
   reprova o mínimo de 4,5:1 e é a MESMA falha que a Onda 7 achou no Briefing
   (2,54). Este texto diz onde soltar o bloco: é instrução, não enfeite.
   var(--muted) mede 4,97:1 no mesmo fundo. */
.pb-vazio{font-size:11.5px;color:var(--muted);margin:0;padding:4px 0 2px}
.pb-card{margin-bottom:8px}
.pb-card.dragging{opacity:.45}
.pb-grip{cursor:grab;padding:3px 5px;border-radius:6px;font-size:14px}
.pb-grip:hover{background:var(--borda);color:var(--azul)}
.pb-grip:active{cursor:grabbing}
/* a nota do PDF sai de blocos.PERFIS — é declaração lida por código, e aparece
   ao lado do tipo para a pessoa saber ANTES de escrever o que vai para o papel */
.pb-pdf{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:#eef1f6;color:#5a6172;padding:2px 7px;border-radius:20px;margin-left:6px;white-space:nowrap}
.pb-pdf.alt{background:#fdf3e2;color:#8a5a10}
.lpb-card-acts button:disabled{opacity:.25;cursor:default}
.lpb-card-acts button:focus-visible{outline:2px solid var(--teal);outline-offset:1px}
@media(max-width:900px){
  .lpb-work{grid-template-columns:1fr}
  .lpb-preview{position:static;height:560px}
}

/* ── Cérebros por especialidade ── */
.esp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:8px}
.esp-card{display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;background:var(--papel);border:1px solid var(--borda);border-radius:12px;padding:13px 15px;cursor:pointer;font-family:inherit;transition:border-color .12s,transform .12s}
.esp-card:hover{border-color:var(--azul);transform:translateY(-1px)}
.esp-card.inativa{opacity:.55}
.esp-card-nome{font-size:14.5px;font-weight:700;color:var(--titulo)}
.esp-card-sub{font-size:12px;color:var(--muted)}
.esp-add{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.cb-fonte-info{background:#eef4fd;border:1px solid #d7e3f5;border-radius:8px;padding:8px 11px;font-size:12.5px;color:#2f4b6e}
.cb-fonte-info a{font-weight:600}
.esp-fontes{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.esp-fonte{display:flex;align-items:center;gap:10px;border:1px solid var(--borda);border-radius:10px;padding:9px 12px;background:#fff}
.esp-fonte.inativa{opacity:.55}
.esp-fonte-ic{font-size:18px;flex:none}
.esp-fonte-main{flex:1;min-width:0}
.esp-fonte-main b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.esp-fonte-main .cell-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
/* ── Fila de aprovação de conhecimento dos cérebros ── */
.cb-fila{border:1px solid #f0d9a8 !important;background:linear-gradient(180deg,#fffaf0,#fff)}
.cb-fila h3{color:#9a6a12}
.cb-fila-n{display:inline-block;min-width:20px;padding:0 6px;height:20px;line-height:20px;text-align:center;background:#e8912a;color:#fff;border-radius:999px;font-size:12px;font-weight:700;margin-left:4px;font-variant-numeric:tabular-nums}
.cb-fila-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.cb-fila-item{display:flex;align-items:flex-start;gap:12px;border:1px solid var(--borda);border-radius:10px;padding:10px 12px;background:#fff}
.cb-fila-main{flex:1;min-width:0}
.cb-fila-tit{font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cb-fila-tag{font-size:11px;font-weight:600;color:#5a7089;background:#eef2f5;border-radius:999px;padding:2px 8px}
.cb-fila-res{font-size:12.5px;color:#5a7089;line-height:1.5;margin-top:3px}
.cb-fila-acts{display:flex;gap:6px;flex:none}
@media (max-width:560px){.cb-fila-item{flex-direction:column}.cb-fila-acts{width:100%}}
/* seletor de especialidades no formulário do agente */
.ag-esp-grid{display:flex;flex-wrap:wrap;gap:7px 16px;margin-top:2px}
.ag-esp-chk{display:flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;white-space:nowrap}
.ag-esp-chk input{margin:0}
/* ── Motor de Agentes: estado, blocos do editor, biblioteca, aprovações ── */
.ag-ic{width:34px;height:34px;border-radius:9px;background:#eef4f3;display:flex;align-items:center;justify-content:center;font-size:17px;flex:0 0 auto}
.ag-estado{font-size:10.5px;font-weight:700;border-radius:6px;padding:1px 7px;margin-left:4px;vertical-align:middle}
.ag-estado.ativo{background:#e9f7ef;color:#2a7d55}
.ag-estado.pausado{background:#fdf3e3;color:#b9770f}
.ag-estado.rascunho{background:#eef1f4;color:#6a7b88}
.ag-pend{display:inline-block;min-width:18px;text-align:center;background:#c0392b;color:#fff;border-radius:9px;font-size:11px;font-weight:700;padding:0 5px}
.ag-blocos{display:flex;flex-direction:column;gap:10px;margin-top:8px;max-height:62vh;overflow:auto;padding-right:4px}
.ag-bloco{border:1px solid var(--borda);border-radius:10px;padding:10px 12px;background:#fafbfc}
.ag-bloco-h{font-weight:700;font-size:12.5px;color:#3f566d;margin-bottom:6px}
.ag-canais{display:flex;flex-wrap:wrap;gap:7px 16px}
.ag-radio{display:block;font-size:13px;margin:3px 0;cursor:pointer}
.ag-run-acoes{margin-top:8px;font-size:12.5px;background:#f4f8f7;border-radius:8px;padding:8px 10px}
.ag-run-acoes ul{margin:4px 0 0;padding-left:18px}
.ag-tpl-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px;max-height:56vh;overflow:auto}
.ag-tpl{border:1px solid var(--borda);border-radius:10px;padding:10px 12px;background:#fff}
.ag-tpl-top{display:flex;justify-content:space-between;align-items:center;gap:6px}
.ag-tpl-meta{font-size:11px;color:#7b8b98}
.ag-aprov{border:1px solid var(--borda);border-radius:10px;padding:10px 12px;margin-bottom:8px}
.ag-aprov-top{font-size:13px}
.ag-aprov-acoes{font-size:12px;color:#57708a}
.ag-aprov-btns{display:flex;gap:8px;margin-top:8px}
@media(max-width:640px){.ag-tpl-grid{grid-template-columns:1fr}}
/* ── Agentes: sub-páginas na área de conteúdo (editor / biblioteca / aprovações / personalizar) ──
   Segue o padrão das páginas internas: renderiza no conteúdo (mantém menu + topo),
   cabeçalho "← Voltar" (.cli-page-top). Sem overlay. */
.ag-sub{animation:agSubIn .16s ease}
@keyframes agSubIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.ag-sub .ag-blocos{max-height:none;overflow:visible;display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0;margin-top:0}
.ag-sub .ag-tpl-grid{max-height:none}
.ag-bloco-wide{grid-column:1 / -1}
.ag-sub-acts{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--borda)}
@media(max-width:760px){.ag-sub .ag-blocos{grid-template-columns:1fr}}
/* Automação: construtores de filtro + passos de ação */
.au-badge{font-size:10px;font-weight:700;color:#57708a;background:#eef1f4;border-radius:5px;padding:1px 6px;vertical-align:middle;margin-left:4px}
/* IntelMail · lista de automações */
.au-lista{display:flex;flex-direction:column;gap:8px}
.au-regra{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--borda);border-radius:12px;padding:11px 14px;background:#fff}
.au-regra.off{opacity:.62;background:#fafbfc}
.au-regra-main{min-width:0}
.au-regra-top{font-size:14px;color:#12314f}
.au-regra-top b{font-weight:700}
.au-regra .cell-sub{display:block;font-size:12px;color:#7b8b98;margin-top:3px}
.au-regra-acts{display:flex;gap:6px;flex:none;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:560px){.au-regra{flex-wrap:wrap}.au-regra-acts{width:100%}}
.au-modo{display:flex;gap:16px;margin-bottom:8px}
.au-modo .ag-radio{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;margin:0}
.au-filtro{display:flex;gap:6px;align-items:center;margin-bottom:6px}
.au-filtro .auFc{flex:1 1 170px;min-width:120px}.au-filtro .auFo{flex:1 1 130px;min-width:110px}.au-filtro .auFv{flex:1 1 110px;min-width:90px}
.au-passo{border:1px solid var(--borda);border-radius:10px;padding:10px 12px;margin-bottom:8px;background:#fff}
.au-passo-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.au-passo-n{width:22px;height:22px;border-radius:50%;background:#eef4f3;color:#2a7d55;font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;flex:none}
.au-passo-top .auPassoTipo{flex:1 1 200px}
.au-passo-esp{font-size:12px;color:#57708a;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.au-passo-cfg{margin-top:8px}
.au-passo-cond{border-color:#f0d59a;background:#fffbf1;border-style:dashed}
.au-passo-n-cond{background:#fbeecb;color:#a9761a}
.au-passo-cond .auCondCampo{flex:1 1 150px}
.au-passo-cond .auCondValor{flex:1 1 120px}
@media(max-width:640px){.au-filtro{flex-wrap:wrap}.au-filtro .auFc,.au-filtro .auFo,.au-filtro .auFv{flex:1 1 100%}}
/* Automação: teste (simulação) + histórico */
.au-test-res{font-size:13px;font-weight:600;padding:6px 10px;border-radius:8px}
.au-test-res.ok{background:#f4faf6;color:#2a7d55}
.au-test-res.no{background:#fdf3e3;color:#b9770f}
.au-test-lista{margin:6px 0 0;padding-left:18px;font-size:12.5px;line-height:1.55}
.au-hist{display:flex;flex-direction:column;gap:4px;max-height:240px;overflow:auto}
.au-hist-row{display:flex;gap:10px;font-size:12px;padding:4px 8px;border-radius:6px;background:#f7f9fa;border-left:3px solid #cbd5dd}
.au-hist-row.ok{border-left-color:#2a7d55}
.au-hist-row.erro{border-left-color:#c93a52;background:#fdf5f6}
.au-hist-when{color:#7b8b98;flex:none;font-variant-numeric:tabular-nums}
.au-hist-txt{color:#3f566d}
/* Cérebro — transparência do que o agente puxa */
.ag-cerebro{display:flex;flex-direction:column;gap:7px;margin-bottom:4px}
.ag-cere-line{border:1px solid var(--borda);border-left:3px solid #cbd5dd;border-radius:8px;padding:7px 10px;font-size:12.5px;line-height:1.45;background:#fff}
.ag-cere-line.ok{border-left-color:#2a7d55;background:#f4faf6}
.ag-cere-line.vazio{border-left-color:#b9770f;background:#fdf9f1}
.ag-cere-tag{font-size:10px;font-weight:700;color:#2a7d55;background:#e9f7ef;border-radius:5px;padding:1px 6px;vertical-align:middle}
/* Ações + configuração por ação */
.ag-ac-lista{display:flex;flex-direction:column;gap:6px}
.ag-ac-item{border:1px solid var(--borda);border-radius:9px;padding:8px 10px;background:#fff;transition:border-color .15s,background .15s}
.ag-ac-item.on{border-color:#1f7a72;background:#f3fbfa}
.ag-ac-cfg{margin:8px 0 2px;padding-left:24px;display:flex;flex-wrap:wrap;gap:8px 14px}
.ag-ac-campo{display:flex;flex-direction:column;gap:2px;min-width:190px}
.ag-ac-campo-l{font-size:11px;font-weight:600;color:#57708a}
.ag-ac-campo .in{padding:5px 8px;font-size:12.5px}
/* Personalizar: funções + gatilhos custom */
.ag-perso-cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:760px){.ag-perso-cols{grid-template-columns:1fr}}
.ag-perso-col{border:1px solid var(--borda);border-radius:10px;padding:12px 14px;background:#fafbfc}
.ag-perso-form{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 12px;align-items:center}
.ag-perso-form .in{flex:1 1 140px;min-width:120px}
/* ── Construtor de fluxo arrastável (canvas) ── */
.flux-panel{background:#fff;border:1px solid var(--borda);border-radius:12px;width:100%;height:calc(100vh - 210px);min-height:480px;display:flex;flex-direction:column;overflow:hidden}
.flux-body{flex:1;display:grid;grid-template-columns:170px 1fr 240px;min-height:0}
.flux-palette{border-right:1px solid var(--borda);padding:12px;display:flex;flex-direction:column;gap:6px;overflow:auto}
.flux-pal-h{font-weight:700;font-size:12px;color:#3f566d;margin-bottom:2px}
.flux-pal{border:1px solid var(--borda);background:#fff;border-radius:9px;padding:7px 9px;font-size:12.5px;text-align:left;cursor:pointer;font-family:inherit}
.flux-pal:hover{background:#f2f8ff;border-color:var(--teal,#1f7a72)}
.flux-canvas{position:relative;overflow:auto;background:#f6f8fa;background-image:radial-gradient(#dde3e9 1px,transparent 1px);background-size:18px 18px}
.flux-canvas svg{position:absolute;top:0;left:0;pointer-events:none}
.flux-edge{fill:none;stroke:#9db0c0;stroke-width:2;pointer-events:stroke;cursor:pointer}
.flux-edge:hover{stroke:#c93a52}
.flux-edge-lbl{fill:#5a6b7a;font-size:11px;font-weight:700;text-anchor:middle}
.flux-node{position:absolute;width:150px;background:#fff;border:1px solid var(--borda);border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,.08);user-select:none}
.flux-node.sel{border-color:var(--teal,#1f7a72);box-shadow:0 0 0 2px rgba(31,122,114,.25)}
.flux-node.alvo{cursor:pointer;border-style:dashed}
.flux-node-h{display:flex;justify-content:space-between;align-items:center;padding:5px 8px;border-bottom:1px solid var(--borda);font-size:12px;font-weight:700;cursor:grab;border-radius:10px 10px 0 0}
.flux-node.tipo-gatilho .flux-node-h{background:#eaf1fb;color:#3667a6}
.flux-node.tipo-ia .flux-node-h{background:#eef7f0;color:#2a7d55}
.flux-node.tipo-condicao .flux-node-h{background:#fdf3e3;color:#b9770f}
.flux-node.tipo-acao .flux-node-h{background:#eef1f4;color:#3f566d}
.flux-node.tipo-handoff .flux-node-h{background:#fdeaea;color:#c0392b}
.flux-node.tipo-fim .flux-node-h{background:#efeaff;color:#5b46b8}
.flux-del{border:0;background:transparent;color:#98a7b4;cursor:pointer;font-size:15px;line-height:1;padding:0 2px}
.flux-del:hover{color:#c93a52}
.flux-node-b{padding:7px 9px;font-size:11.5px;color:#57708a;min-height:20px}
.flux-ports{display:flex;gap:4px;padding:0 8px 7px;flex-wrap:wrap}
.flux-port{border:1px solid var(--borda);background:#fafbfc;border-radius:7px;font-size:10.5px;padding:2px 6px;cursor:pointer;font-family:inherit;color:#57708a}
.flux-port:hover{background:var(--teal,#1f7a72);color:#fff;border-color:var(--teal,#1f7a72)}
.flux-cfg{border-left:1px solid var(--borda);padding:12px;overflow:auto}
.flux-cfg-h{font-weight:700;font-size:13px;margin-bottom:8px}
@media(max-width:820px){.flux-body{grid-template-columns:1fr}.flux-palette,.flux-cfg{display:none}}
/* ── Resumo de reunião ── */
.reu-list{display:flex;flex-direction:column;gap:8px}
.reu-card{border:1px solid var(--borda);border-radius:10px;padding:10px 12px;cursor:pointer;background:#fff}
.reu-card:hover{border-color:var(--teal,#1f7a72);background:#f9fcfc}
.reu-card-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.reu-card-meta{font-size:11px;color:#8090a0;margin-top:4px}
.reu-resumo{background:#f4f8f7;border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.5;color:#33475b;max-height:34vh;overflow:auto}
.reu-itens{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.reu-item{display:flex;justify-content:space-between;align-items:center;gap:8px;border:1px solid var(--borda);border-radius:9px;padding:7px 10px;font-size:12.5px}
.reu-item.feito{opacity:.6;background:#f6f8fa}
.reu-item-tipo{font-size:10.5px;font-weight:700;border-radius:6px;padding:1px 6px;white-space:nowrap}
.reu-item-tipo.t-decisao{background:#eaf1fb;color:#3667a6}
.reu-item-tipo.t-tarefa{background:#eef7f0;color:#2a7d55}
.reu-item-tipo.t-proximo{background:#fdf3e3;color:#b9770f}
.reu-feito{font-size:11.5px;color:#2a7d55;font-weight:700}
.reu-transc{margin-top:6px;font-size:12px;color:#57708a;max-height:30vh;overflow:auto;white-space:pre-wrap;background:#fafbfc;border:1px solid var(--borda);border-radius:8px;padding:8px 10px}
.reu-upload{cursor:pointer;font-size:11.5px;font-weight:600;color:#57708a;border:1px solid var(--borda);border-radius:7px;padding:2px 8px}
/* Transcrição por voz */
.trs-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px}
.trs-status{font-size:12.5px;color:#6a7b88;font-weight:600}
.trs-txt{width:100%;font-size:13.5px;line-height:1.55}
.trs-acts{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
#trsMic.gravando{background:#c0392b;border-color:#c0392b;animation:trsPulse 1.3s infinite}
@keyframes trsPulse{0%,100%{opacity:1}50%{opacity:.68}}
/* badge de canal no Atendimento (WhatsApp / Instagram) */
.ch-canal{display:inline-block;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:999px;margin-right:6px;vertical-align:middle}
.ch-canal.wa{background:#e3f6ea;color:#1c7a45}
.ch-canal.ig{background:#fbe9f3;color:#b4267a}
/* barra de ajustes da conversa (cliente/responsável/agente) + filtros de status */
.ch-cfg{display:flex;flex-wrap:wrap;gap:8px 12px;padding:9px 14px;border-bottom:1px solid var(--borda);background:#fafbfc}
.ch-cfg label{display:flex;flex-direction:column;gap:2px;font-size:10.5px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:#7b8b98;flex:1;min-width:130px}
.ch-cfg .select{font-size:12.5px;padding:5px 7px;text-transform:none;letter-spacing:0;font-weight:400}
.ch-filtros{display:flex;gap:4px;margin-bottom:8px}
.ch-filtro{flex:1;border:1px solid var(--borda);background:#fff;border-radius:8px;padding:5px 0;font-size:12px;font-weight:600;color:#6a7b88;cursor:pointer;font-family:inherit;transition:background .12s}
.ch-filtro.on{background:var(--teal,#1f7a72);color:#fff;border-color:var(--teal,#1f7a72)}
.ch-canal-sel{width:100%;margin-bottom:8px;font-size:12.5px;padding:6px 8px}
/* ── Upgrade do inbox: busca, não-lidas, SLA, tags, painel do contato, compose ── */
.ch-busca{width:100%;margin-bottom:8px;font-size:12.5px;padding:6px 9px}
.ch-item.nao-lida b{font-weight:800}
.ch-item.nao-lida{background:#f2f8ff}
.ch-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--teal,#1f7a72);margin-right:5px;flex:0 0 auto}
.ch-item-top{display:flex;align-items:center;gap:4px}
.ch-item-meta{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;align-items:center}
.ch-tag-mini{font-size:10px;background:#eef1f4;color:#57708a;border-radius:6px;padding:1px 6px;font-weight:600}
.ch-espera{font-size:10.5px;color:#c2571a;font-weight:700;margin-left:auto}
.ch-rr{display:flex;gap:7px;align-items:flex-start;font-size:11.5px;color:#6a7b88;margin-top:10px;padding-top:9px;border-top:1px solid var(--borda);cursor:pointer;line-height:1.3}
.ch-rr input{margin-top:1px}
.ch-head-acts{display:flex;gap:5px;flex-wrap:wrap}
.ch-head-acts .btn-sm.on{background:var(--teal,#1f7a72);color:#fff;border-color:var(--teal,#1f7a72)}
.ch-badge.soneca{background:#efeaff;color:#5b46b8}
.ch-sla{display:flex;gap:8px;flex-wrap:wrap;padding:6px 14px 0}
.ch-sla-wait{font-size:11.5px;font-weight:700;color:#c2571a;background:#fdf1e7;border-radius:6px;padding:2px 8px}
.ch-sla-ok{font-size:11.5px;font-weight:600;color:#2a7d55;background:#e9f7ef;border-radius:6px;padding:2px 8px}
.ch-tags-bar{display:flex;flex-wrap:wrap;gap:5px;align-items:center;padding:8px 14px;border-bottom:1px solid var(--borda)}
.ch-tags-lbl{opacity:.6}
.ch-tag{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;background:#eef1f4;color:#3f566d;border-radius:8px;padding:2px 4px 2px 8px;font-weight:600}
.ch-tag-x{border:0;background:transparent;color:#8a99a8;cursor:pointer;font-size:14px;line-height:1;padding:0 2px}
.ch-tag-x:hover{color:#c93a52}
.ch-tag-input{border:1px dashed var(--borda);border-radius:8px;padding:2px 8px;font-size:11.5px;width:96px;font-family:inherit}
.ch-contato-card{margin:10px 14px 0;background:#fafbfc;border:1px solid var(--borda);border-radius:10px;padding:10px 12px}
.ch-contato-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
.ch-buyer{font-size:10.5px;font-weight:700;text-transform:capitalize;border-radius:6px;padding:1px 7px;background:#eef1f4;color:#57708a}
.ch-buyer.quente{background:#fdeaea;color:#c0392b}.ch-buyer.morno{background:#fdf3e3;color:#b9770f}.ch-buyer.frio{background:#eaf1fb;color:#3667a6}
.ch-contato-meta{font-size:11.5px;color:#6a7b88;margin-top:2px}
.ch-contato-resumo{font-size:12px;color:#42566a;margin:6px 0 0;line-height:1.4}
.ch-contato-notas{margin:6px 0 0;padding-left:16px;font-size:11.5px;color:#6a7b88}
.ch-contato-notas li{margin:2px 0}
.ch-msg.nota{align-self:center;max-width:82%}
.ch-msg.nota .ch-bubble{background:#fff8e1;border:1px solid #f0e3ac;color:#6b5b16;font-size:12.5px}
.ch-nota-tag{display:block;font-size:10px;font-weight:700;color:#b9950f;margin-bottom:3px;text-transform:uppercase;letter-spacing:.03em}
.ch-anexo-img{max-width:200px;max-height:200px;border-radius:8px;margin-top:6px;display:block}
.ch-anexo-file{display:inline-block;margin-top:6px;font-size:12px;font-weight:600}
.ch-compose-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px}
.ch-anexo-lbl{cursor:pointer;font-size:12px;font-weight:600;color:#57708a;border:1px solid var(--borda);border-radius:8px;padding:4px 8px}
.ch-nota-chk{display:flex;gap:5px;align-items:center;font-size:12px;color:#6a7b88;cursor:pointer}
.ch-anexo-nome{font-size:11.5px;color:#2a7d55;font-weight:600}
.atl-list{display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow:auto;margin:4px 0}
.atl-row{display:flex;gap:6px;align-items:stretch}
.atl-pick{flex:1;text-align:left;border:1px solid var(--borda);background:#fff;border-radius:9px;padding:8px 10px;cursor:pointer;font-family:inherit;font-size:12.5px}
.atl-pick:hover{background:#f2f8ff;border-color:var(--teal,#1f7a72)}
.atl-prev{display:block;color:#8090a0;font-size:11.5px;margin-top:2px}
.atl-del{border:1px solid var(--borda);background:#fff;border-radius:9px;width:34px;cursor:pointer;color:#c93a52;font-size:16px}
.atl-novo{display:flex;flex-direction:column;gap:6px;margin-top:10px;border-top:1px solid var(--borda);padding-top:10px}
.ch-soneca-btns{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.esp-fonte-acts{display:flex;gap:4px;flex:none}

/* ── Atribuição (loop de tráfego) ── */
.atrib-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.atrib-filtros{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.atrib-acoes{display:flex;gap:8px;flex-wrap:wrap}
.atrib-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:12px;margin-bottom:16px}
.atrib-card{background:#fff;border:1px solid #e6ebf1;border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.atrib-k{font-size:24px;font-weight:700;color:#1f2b3a;line-height:1.1}
.atrib-l{font-size:12px;color:var(--muted,#667085)}
.atrib-s{font-size:11px;color:#94a3b8}
.atrib-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:900px){.atrib-grid{grid-template-columns:1fr}}
.atrib-panel{background:#fff;border:1px solid #e6ebf1;border-radius:12px;padding:16px}
.atrib-h{margin:0 0 12px;font-size:15px;color:#1f2b3a}
.atrib-bar-row{display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:10px;margin-bottom:10px}
.atrib-bar-lbl{display:flex;align-items:center;gap:6px;font-size:13px;color:#334155}
.atrib-bar-lbl i{width:10px;height:10px;border-radius:3px;display:inline-block;flex:none}
.atrib-bar-track{height:8px;background:#eef2f7;border-radius:6px;overflow:hidden}
.atrib-bar-fill{display:block;height:100%;border-radius:6px;min-width:2px;transition:width .3s}
.atrib-bar-val{font-size:12px;color:var(--muted,#667085);white-space:nowrap}
.atrib-conv{width:100%;border-collapse:collapse;font-size:13px}
.atrib-conv th{text-align:left;color:var(--muted,#667085);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.03em;padding:6px 8px;border-bottom:1px solid #eef2f7}
.atrib-conv td{padding:8px;border-bottom:1px solid #f2f5f9}
.atrib-st{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600}
.atrib-st-enviado{background:#dcfce7;color:#166534}
.atrib-st-pendente{background:#fef9c3;color:#854d0e}
.atrib-st-erro{background:#fee2e2;color:#991b1b}
.atrib-st-exportado{background:#e0f2fe;color:#075985}
.atrib-st-ignorado{background:#f1f5f9;color:#64748b}
/* fila de pendentes dentro do modal ⚙ Conversões: até 50 linhas, então rola dentro da
   caixa em vez de esticar o modal para fora da tela */
.atrib-fila{max-height:230px;overflow:auto;border:1px solid #eef2f7;border-radius:8px;padding:8px}
.atrib-fila summary{font-size:13px}
.tai-cliente-sel{min-width:160px}

/* ── Painel da agência ── */
.agc-toggle{display:flex;align-items:center;gap:6px;font-size:13px;color:#334155;cursor:pointer;user-select:none}
.agc-tab td{vertical-align:middle}
.agc-row{cursor:pointer;transition:background .15s}
.agc-row:hover,.agc-row:focus-visible{background:#f6f9fc;outline:none}
.agc-row.agc-atencao{background:#fffdf5}
.agc-row.agc-atencao:hover{background:#fdf7e7}
.agc-nome .cell-sub{display:block;font-size:11px;color:#94a3b8}
.agc-tend{font-size:11px;font-weight:700;margin-left:4px;white-space:nowrap}
.agc-tu{color:#166534}.agc-td{color:#b91c1c}.agc-t0{color:#94a3b8;font-weight:400}
.agc-chips{max-width:230px}
.agc-chip{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600;margin:1px 3px 1px 0;white-space:nowrap}
.agc-a-ok{background:#dcfce7;color:#166534}
.agc-a-warn{background:#fef3c7;color:#92400e}
.agc-a-bad{background:#fee2e2;color:#991b1b}
.agc-a-info{background:#e0f2fe;color:#075985}
.agc-mini-bad{color:#b91c1c;font-weight:600;font-size:12px}

/* ── Estúdio de criativos ── */
.cri-form .ff-field{margin-bottom:10px}
.cri-form-row{display:flex;gap:12px;flex-wrap:wrap}
.cri-form-row .cri-tipo{flex:2;min-width:220px}
.cri-form-row .cri-qtd{flex:0 0 110px}
.cri-form-acts{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.cri-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px;margin-top:14px}
.cri-card{background:#fff;border:1px solid #e6ebf1;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px;position:relative;transition:box-shadow .15s}
.cri-card:hover{box-shadow:0 4px 14px rgba(20,40,80,.08)}
.cri-card.cri-ok{border-color:#86efac;background:#f7fef9}
.cri-card.cri-no{opacity:.55}
.cri-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.cri-status{font-size:11px;font-weight:700;color:#166534}
.cri-no .cri-status{color:#991b1b}
.cri-titulo{margin:0;font-size:14.5px;color:#1f2b3a;line-height:1.35}
.cri-corpo{margin:0;font-size:13px;color:#3d4d61;line-height:1.5;white-space:pre-wrap}
.cri-extra{font-size:12px;color:#5a7089;line-height:1.45}
.cri-extra b{color:#334155}
.cri-tags{color:#0e7490}
.cri-acts{display:flex;gap:6px;margin-top:auto;padding-top:6px;border-top:1px solid #f0f4f8}
.cri-acts .btn-mini{width:34px;height:30px;border:1px solid #e2e8f0;background:#fff;border-radius:8px;cursor:pointer;font-size:14px;color:#475569}
.cri-acts .btn-mini:hover{background:#f1f5f9}
.cri-brief-cell{max-width:280px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#5a7089}

/* ── Quiz builder (complementa .lpb-*) ── */
.qzb-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:700px){.qzb-row{grid-template-columns:1fr}}
.qzb-ops{display:flex;flex-direction:column;gap:6px;margin:6px 0}
.qzb-op{display:grid;grid-template-columns:1fr 72px 30px;gap:6px;align-items:center}
.qzb-op button{border:1px solid #e2e8f0;background:#fff;border-radius:8px;height:32px;cursor:pointer;color:#94a3b8}
.qzb-op button:hover{color:#c0392b;border-color:#f3c1bb}
.qzb-pts{text-align:center}
.qzb-add{font-size:12.5px;padding:3px 10px;margin-left:8px}
.qzb-sec{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:16px 0 8px;padding-top:12px;border-top:1px dashed var(--borda);display:flex;align-items:center}
.qzb-sec:first-child{margin-top:0;padding-top:0;border-top:0}
.qzb-ident{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.qzb-logo-box{width:96px;height:64px;flex:0 0 auto;border:1px solid var(--borda);border-radius:10px;background:#f7fafd;display:flex;align-items:center;justify-content:center;overflow:hidden}
.qzb-logo-box img{max-width:100%;max-height:100%;object-fit:contain}
.qzb-logo-box span{font-size:11px;color:var(--muted)}
.qzb-logo-acoes{display:flex;flex-direction:column;gap:5px;align-items:flex-start}
.qzb-logo-acoes .btn{padding:5px 12px;font-size:12.5px}

/* ── Qualidade de dados ── */
.dq-score{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid #e6ebf1;border-radius:12px;padding:16px 20px;margin-bottom:16px}
.dq-score-num{font-size:42px;font-weight:800;line-height:1}
.dq-score-num small{font-size:16px;color:#94a3b8;font-weight:600}
.dq-grupo{border:1px solid #e6ebf1;border-radius:12px;padding:12px 14px;margin-bottom:12px;background:#fff}
.dq-grupo-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.dq-contatos{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.dq-c{display:flex;align-items:flex-start;gap:9px;padding:8px 10px;border:1px solid #eef2f7;border-radius:9px;cursor:pointer}
.dq-c:hover{background:#f7fafd}
.dq-c input{margin-top:3px}
.dq-c-info b{font-size:14px;color:#1f2b3a}
.dq-c-info .cell-sub{display:block;font-size:11.5px;color:#94a3b8;margin-top:1px}

/* ── AEO (visibilidade em IA) ── */
.aeo-alvo{border:1px solid #e6ebf1;border-radius:12px;margin-bottom:10px;background:#fff;overflow:hidden}
.aeo-alvo-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;cursor:pointer}
.aeo-alvo-h:hover{background:#f7fafd}
.aeo-alvo-h .cell-sub{display:block;font-size:11.5px;color:#94a3b8;margin-top:1px}
.aeo-det{padding:0 14px 14px;border-top:1px solid #eef2f7}
.aeo-det-top{display:flex;align-items:center;gap:10px;padding:12px 0}
.aeo-tab td{vertical-align:top}
.aeo-conc{color:#5a7089;font-size:12.5px;max-width:230px}
.aeo-rec{margin-top:5px;font-size:12px;color:#5a7089}
.aeo-rec summary{color:#0e7490;cursor:pointer;font-weight:600}
.aeo-rec[open]{background:#f7fafd;border:1px solid #eef2f7;border-radius:8px;padding:8px;line-height:1.5}
.aeo-plano{border:1px solid #cfe8e5;background:linear-gradient(180deg,#f2fbfa,#fff);border-radius:12px;padding:12px 14px;margin:4px 0 14px}
.aeo-plano-h{font-weight:700;color:#0f766e;font-size:13.5px;margin-bottom:8px}
.aeo-plano-h .cell-sub{font-weight:400;color:#7b93a6;font-size:11.5px}
.aeo-plano-b{font-size:13px;line-height:1.6;color:#28323b}
.qzs-rec{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid #f0f4f8;font-size:13.5px}
.qzs-rec .cell-sub{display:block;font-size:11px;color:#94a3b8}
.qzs-rec .btn-grad{padding:5px 12px;font-size:12.5px}

/* WhatsApp Oficial */
.waof-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:900px){.waof-grid{grid-template-columns:1fr}}
.waof-card{border:1px solid #e6ebf1;border-radius:14px;background:#fff;padding:18px}
.waof-card-h h3{margin:0;font-size:16px;display:flex;align-items:center;gap:10px}
.waof-l{display:block;font-size:12.5px;font-weight:600;color:#475569;margin-bottom:10px}
.waof-l .inp,.waof-l input,.waof-l select,.waof-l textarea{display:block;width:100%;margin-top:4px;font-weight:400}
.waof-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:end}
.waof-check{display:flex;align-items:center;gap:8px;font-size:13px;color:#475569;margin:4px 0 14px;cursor:pointer}
.waof-check input{width:auto}
.waof-actions{display:flex;gap:8px}
.waof-teste{margin-top:12px;padding:10px 12px;border-radius:9px;font-size:13px;background:#f6f9fc;border:1px solid #eef2f7}
.waof-teste.waof-ok{background:#eafaf0;border-color:#c6ecd4;color:#1a7a3c}
.waof-teste.waof-err{background:#fdecec;border-color:#f6cccc;color:#c0392b}
.waof-teste.waof-warn{background:#fff7e6;border-color:#f5e2b8;color:#a9791b}
.waof-lim-n{font-size:34px;font-weight:800;color:var(--brand);line-height:1}
.waof-bar{height:9px;border-radius:6px;background:#eef2f7;overflow:hidden;margin:10px 0 12px}
.waof-bar-fill{height:100%;border-radius:6px;transition:width .3s}
.waof-lim-grid{display:flex;flex-wrap:wrap;gap:14px;font-size:13px}
.waof-lim-grid b{font-size:15px}
.waof-hr{border:none;border-top:1px solid #eef2f7;margin:16px 0}

/* Agente de Funil (SmartFunnel) */
.funil-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-bottom:16px}
@media(max-width:900px){.funil-grid{grid-template-columns:1fr}}
.funil-card{border:1px solid #e6ebf1;border-radius:14px;background:#fff;padding:18px}
.funil-card-h h3{margin:0 0 4px;font-size:16px;display:flex;align-items:center;gap:10px}
.funil-l{display:block;font-size:12.5px;font-weight:600;color:#475569;margin:10px 0}
.funil-l .inp,.funil-l select{display:block;width:100%;margin-top:4px;font-weight:400}
.funil-l input[type=range]{width:100%;margin-top:6px}
.funil-check{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#334155;margin:8px 0;cursor:pointer}
.funil-check input{width:auto}
.funil-actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.funil-nums{display:flex;gap:18px;flex-wrap:wrap}
.funil-nums b{display:block;font-size:26px;font-weight:800;color:var(--brand);line-height:1.1}
.funil-nums span{font-size:12px}
.funil-fila{border:1px solid #e6ebf1;border-radius:14px;background:#fff;padding:18px}
.funil-fila-h{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.funil-tabs{display:flex;gap:4px;flex-wrap:wrap}
.funil-tab{border:1px solid #e2e8f0;background:#f8fafc;border-radius:8px;padding:5px 12px;font-size:12.5px;font-weight:600;color:#64748b;cursor:pointer}
.funil-tab.on{background:var(--brand);border-color:var(--brand);color:#fff}
.funil-dec{border:1px solid #eef2f7;border-radius:12px;padding:14px;margin-bottom:10px;background:#fcfdfe}
.funil-dec-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.funil-move{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#475569;margin-left:8px}
.funil-arrow{color:#94a3b8}
.funil-conv{display:inline-block;margin-left:8px;font-size:11px;font-weight:700;color:#1a7a3c;background:#eafaf0;border:1px solid #c6ecd4;border-radius:20px;padding:1px 8px}
.funil-conf{font-weight:800;font-size:14px;white-space:nowrap}
.funil-resumo{margin:8px 0 0;font-size:13.5px;color:#334155;line-height:1.5}
.funil-sinais{margin:8px 0 0;padding-left:18px;font-size:12.5px;color:#5a7089}
.funil-sinais li{margin:2px 0}
.funil-prox{margin:8px 0 0;font-size:12.5px;color:#0e7490;font-weight:600}
.funil-dec-acoes{display:flex;gap:8px;margin-top:12px}
.funil-dec-acoes .btn{padding:6px 14px;font-size:13px}
/* saúde do negócio + probabilidade + risco (deal score) */
.funil-saude{display:flex;align-items:center;gap:10px;margin:8px 0 2px;flex-wrap:wrap}
.funil-saude-chip{font-size:11.5px;font-weight:700;border-radius:6px;padding:2px 8px}
.funil-prob{font-size:12.5px;color:#3f566d}
.funil-risco{margin:6px 0 0;font-size:12.5px;color:#c93a52;background:#fdf0f2;border-radius:8px;padding:6px 10px}
/* negócios parados (deal rotting) */
.funil-parados{border:1px solid #f1d9b8;border-radius:14px;background:#fffdf8;padding:18px;margin-bottom:16px}
.funil-parados-lista{display:flex;flex-direction:column;gap:8px}
.funil-parado{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #eef2f7;border-radius:10px;padding:10px 12px;background:#fff}
.funil-parado-info b{font-size:13.5px}
.funil-parado .cell-sub{display:block;font-size:12px;color:#7b8b98;margin-top:2px}
.funil-parado-acts{display:flex;gap:6px;flex:none;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:560px){.funil-parado{flex-wrap:wrap}.funil-parado-acts{width:100%}}

/* Copilot Autônomo */
.cpa-hero{display:flex;align-items:center;gap:16px;border:1px solid #e6ebf1;border-radius:14px;background:linear-gradient(120deg,#f0fbfa,#eef4fd);padding:16px 20px;margin-bottom:16px}
.cpa-hero-num{font-size:40px;font-weight:800;color:var(--brand);line-height:1}
.cpa-hero-num span{font-size:18px;margin-left:2px}
.cpa-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:900px){.cpa-grid{grid-template-columns:1fr}}
.cpa-card{border:1px solid #e6ebf1;border-radius:14px;background:#fff;padding:18px}
.cpa-card-h h3{margin:0;font-size:16px}
.cpa-lista{display:flex;flex-direction:column;gap:2px}
.cpa-exec-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border-radius:9px;cursor:pointer}
.cpa-exec-row:hover{background:#f7fafd}
/* ⚠ ONDA 44 · #94a3b8 no branco dá 2,59:1 — reprova o mínimo de 4,5:1 da regra
   de contraste, e esta sub-linha NÃO é decoração: é onde está escrito "automação
   #N está DESLIGADA", o gatilho e a data. var(--muted) é #667085 = 4,9:1. */
.cpa-exec-row .cell-sub{display:block;font-size:11.5px;color:var(--muted);margin-top:1px}
.cpa-item{border:1px solid #eef2f7;border-radius:12px;padding:14px;margin-top:10px;background:#fcfdfe}
.cpa-item-h{display:flex;align-items:center;gap:10px;font-size:14.5px;color:#12314f;margin-bottom:8px}
.cpa-tipo{font-size:11.5px;font-weight:700;color:#0e7490;background:#e6f6f9;border:1px solid #cbeef3;border-radius:20px;padding:2px 9px;white-space:nowrap}
.cpa-conteudo{white-space:pre-wrap;font-family:inherit;font-size:13.5px;line-height:1.55;color:#334155;background:#f8fafc;border:1px solid #eef2f7;border-radius:8px;padding:12px;margin:0;max-height:340px;overflow:auto}
.cpa-item-acoes{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.cpa-item-acoes .btn{padding:5px 12px;font-size:12.5px}
.cpa-conteudo.cpa-editando{background:#fffdf5;border-color:#f1d9b8;outline:2px solid #f6e2bf}
/* objetivos rápidos (chips) */
.cpa-chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}
.cpa-chip{border:1px solid var(--borda,#e6ebf1);background:#f7f9fb;border-radius:16px;padding:4px 11px;font-size:12px;color:#3f566d;cursor:pointer;font-family:inherit}
.cpa-chip:hover{background:#eef4ff;border-color:#c7d7f0}
/* Copilot: opções (profundidade + nº), loading, resultado, badges por tipo, estado-vazio */
.cpa-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.cpa-loading{display:flex;align-items:center;gap:9px;margin-top:10px;padding:11px 13px;border:1px solid #cbeef3;background:#f2fbfd;border-radius:10px;font-size:12.5px;color:#0e6b7e}
.cpa-spin{width:15px;height:15px;border:2px solid #bfe6ee;border-top-color:#0e7490;border-radius:50%;flex:none;animation:cpaspin .7s linear infinite}
@keyframes cpaspin{to{transform:rotate(360deg)}}
.cpa-res-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.cpa-res-acts{display:flex;gap:6px;flex-wrap:wrap}
.cpa-min{margin-left:auto;font-size:11px;color:#8194a6;background:#f1f5f9;border-radius:12px;padding:1px 8px;white-space:nowrap}
.cpa-item-h .agc-chip{margin-left:8px}
.cpa-item-h .cpa-min + .agc-chip{margin-left:6px}
/* badge colorido por tipo de entregável */
.cpa-tipo[data-tipo="email"]{color:#1d4ed8;background:#eaf1ff;border-color:#cfe0ff}
.cpa-tipo[data-tipo="tarefa"]{color:#15803d;background:#e9f9ef;border-color:#c7efd5}
.cpa-tipo[data-tipo="entrega"]{color:#7c3aed;background:#f3edff;border-color:#e2d3ff}
.cpa-tipo[data-tipo="ligacao"]{color:#0e7490;background:#e6f6f9;border-color:#cbeef3}
.cpa-tipo[data-tipo="reuniao"]{color:#4338ca;background:#eef0ff;border-color:#d7dbff}
.cpa-tipo[data-tipo="post"]{color:#be185d;background:#fdeaf3;border-color:#f8cfe0}
.cpa-tipo[data-tipo="legenda"]{color:#a16207;background:#fbf3e2;border-color:#f0e0bb}
.cpa-tipo[data-tipo="proposta"]{color:#334155;background:#eef2f7;border-color:#dbe3ec}
.cpa-tipo[data-tipo="roteiro"]{color:#c2410c;background:#fdeee3;border-color:#f8d5bd}
.cpa-vazio{border:1px dashed #d4dde8;border-radius:14px;background:#fbfcfe;padding:34px 24px;text-align:center;margin-top:16px}
.cpa-vazio-ic{font-size:30px;color:var(--brand);opacity:.6;margin-bottom:8px}
.cpa-vazio b{display:block;font-size:15px;color:#12314f;margin-bottom:6px}
.cpa-vazio p{max-width:520px;margin:0 auto;font-size:13px;line-height:1.55}
@media(max-width:560px){.cpa-opts{grid-template-columns:1fr}.cpa-min{margin-left:0}}

/* ══ ONDA 44 · painel do processo do Copiloto ═══════════════════════════════
   Um só CTA visual na tela: o card que espera decisão. Tudo o mais é leitura,
   e leitura fica em papel, sem sombra e com título menor. */
.copi-topo{margin-bottom:16px}
.copi-primario{border-left:3px solid var(--azul)}
.copi-primario>h3{font-size:16px}
.copi-badge{background:var(--azul);color:#fff;border-radius:var(--r-pill);padding:2px 11px;font-size:12px;font-weight:700;white-space:nowrap}
.copi-sec{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:16px;align-items:start}
.copi-quieto{background:var(--papel);box-shadow:none}
.copi-quieto>h3{font-size:14px;margin-bottom:12px}
.copi-h4{margin:14px 0 4px;font-size:13.5px;color:var(--titulo);font-family:var(--display)}
.copi-h4:first-of-type{margin-top:8px}
/* estado vazio: título + o gesto que enche. Nunca um zero.
   ⚠ O NOME É `copi-nada`, e NÃO `copi-vazio`, por um defeito medido pelo cético
   da Onda 44: `.copi-vazio` JÁ EXISTIA — é a bolha de saudação do fio do ✦
   (linha ~3090, dentro do bloco do chat). Duas telas diferentes com a mesma
   classe, e a regra do chat vem DEPOIS no arquivo: ela vencia em border,
   padding e border-radius, e esta borda tracejada (a que faz o card "ler" como
   vazio) nunca chegava à tela. Medido ao vivo: border-style `solid`, padding
   12px. Renomear é o conserto que não mexe no chat. */
.copi-nada{border:1px dashed var(--borda);border-radius:var(--r-md);background:var(--branco);padding:13px 15px}
.copi-nada b{display:block;font-size:13.5px;color:var(--titulo);margin-bottom:4px}
.copi-nada p{margin:0;font-size:12.5px;line-height:1.55;color:var(--muted)}
/* linha que não abre nada não finge ser clicável */
.copi-estatica{cursor:default}
.copi-estatica:hover{background:transparent}
/* o gerador de entregáveis, recolhido */
.copi-gerador{margin-top:22px;border:1px solid var(--borda);border-radius:var(--r);background:var(--branco)}
.copi-gerador>summary{cursor:pointer;padding:14px 18px;font-family:var(--display);font-size:14px;color:var(--titulo);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;border-radius:var(--r)}
.copi-gerador>summary::-webkit-details-marker{display:none}
.copi-gerador>summary::after{content:'▾';color:var(--muted);font-size:11px;flex:none}
.copi-gerador[open]>summary::after{content:'▴'}
.copi-gerador>summary:hover{background:var(--papel)}
.copi-gerador>summary:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
.copi-gerador>summary .cell-sub{display:block;font-weight:400;margin-top:3px;font-family:var(--corpo-f)}
.copi-gerador-corpo{padding:0 18px 18px;border-top:1px solid var(--borda)}
.copi-gerador-corpo>.cpa-grid{margin-top:18px}
@media(max-width:900px){.copi-sec{grid-template-columns:1fr}}
/* ══ ONDA 51 · o cérebro do Copiloto (instruções, regras, memória) ═══════════
   O card de abertura é o único da página que AVISA em vez de informar, e por
   isso é o único com faixa de atenção. ⚠ A frase da trava tem de ser lida antes
   de o dono escrever, não depois: é ela que impede alguém escrever "pode enviar
   e-mail sem aprovação" nas regras e concluir que o sistema está quebrado quando
   o e-mail virar tarefa do mesmo jeito. Os portões são código e estado — este
   parágrafo é o que conta isso em português. */
.copi-cerebro-aviso{border-left:3px solid var(--azul);margin-bottom:0}
.copi-trava{margin:0;padding:11px 13px;border:1px solid #e8c07d;background:#fff8ec;border-radius:var(--r-md);
  font-size:12.5px;line-height:1.55;color:#6b4a10}
.copi-trava b{color:#8a5a00}

/* IA: governança & intenção */
.iag-card{border:1px solid #e6ebf1;border-radius:14px;background:#fff;padding:18px}
.iag-card-h h3{margin:0;font-size:16px}
.iag-bar{display:inline-block;width:70px;height:8px;border-radius:5px;background:#eef2f7;overflow:hidden;vertical-align:middle}
.iag-bar-fill{display:block;height:100%;border-radius:5px}
.iag-chip{display:inline-block;color:#fff;font-size:11px;font-weight:700;border-radius:20px;padding:2px 10px;text-transform:capitalize}
.iag-sem{display:flex;flex-direction:column;gap:2px;max-height:340px;overflow:auto}
.iag-sem-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;border-radius:8px;font-size:13.5px}
.iag-sem-row:hover{background:#f7fafd}
.iag-sem-row .cell-sub{color:#94a3b8;font-size:11px;margin-left:4px}
.iag-sem-row .btn{padding:4px 12px;font-size:12px}
/* Governança: hero, escopo, biblioteca, auditor de conformidade, distribuição, filtros */
.sc-copy{display:flex;gap:6px;align-items:center;margin-top:3px}
.sc-copy .in{flex:1;min-width:0;font-family:ui-monospace,monospace;font-size:12.5px}
.sc-copy textarea.in{font-family:ui-monospace,monospace}
.iag-hero{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.iag-hero-stat{flex:1 1 150px;border:1px solid #e6ebf1;border-radius:14px;background:linear-gradient(120deg,#f0fbfa,#eef4fd);padding:14px 18px}
.iag-hero-n{display:block;font-size:26px;font-weight:800;color:#12314f;line-height:1.1}
.iag-hero-l{display:block;font-size:12px;color:#64748b;margin-top:3px}
.iag-escopo{display:flex;flex-wrap:wrap;align-items:center;gap:5px;font-size:12px;margin-bottom:10px}
.iag-escopo-chip{background:#eef4f3;color:#2a7d55;border:1px solid #d7ece2;border-radius:20px;padding:2px 9px;font-size:11px;font-weight:600}
.iag-lib{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}
.iag-lib-chip{border:1px solid #cfe0ff;background:#eff5ff;border-radius:16px;padding:4px 11px;font-size:12px;color:#1d4ed8;cursor:pointer;font-family:inherit}
.iag-lib-chip:hover{background:#dfeaff}
.iag-veredito{border-radius:10px;padding:11px 13px;font-weight:600;font-size:13.5px;margin-top:12px}
.iag-veredito.ok{background:#e9f9ef;border:1px solid #c7efd5;color:#15803d}
.iag-veredito.no{background:#fdeaea;border:1px solid #f5c9c9;color:#b91c1c}
.iag-viol{border-left:3px solid #e03131;background:#fff7f7;border-radius:0 8px 8px 0;padding:8px 12px;margin-top:8px;font-size:13px}
.iag-viol b{display:block;color:#b91c1c}
.iag-viol-t{display:block;color:#7b8b98;font-size:12px;margin-top:2px;font-style:italic}
.iag-sug{margin-top:12px}
.iag-sug pre{white-space:pre-wrap;font-family:inherit;font-size:13px;line-height:1.55;background:#f8fafc;border:1px solid #eef2f7;border-radius:8px;padding:12px;margin:4px 0 8px;max-height:260px;overflow:auto}
.iag-dist{display:flex;gap:3px;height:12px;border-radius:6px;overflow:hidden;margin-bottom:10px;background:#eef2f7}
.iag-dist-seg{display:block;min-width:6px;transition:flex .3s}
.iag-filtros{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.iag-f{border:1px solid var(--borda,#e6ebf1);background:#f7f9fb;border-radius:16px;padding:4px 12px;font-size:12px;color:#3f566d;cursor:pointer;font-family:inherit}
.iag-f.on{background:var(--brand,#0e7490);border-color:var(--brand,#0e7490);color:#fff}
@media(max-width:640px){.iag-hero-stat{flex:1 1 100%}}

/* Link-da-bio (editor) + validador de e-mail */
.lb-linkrow{display:grid;grid-template-columns:1fr 1.4fr auto;gap:8px;margin-bottom:8px}
.lb-linkrow .inp{width:100%}
.ev-card{border:1px solid #e6ebf1;border-radius:14px;background:#fff;padding:18px;margin-top:16px}
.ev-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ev-badge{display:inline-block;font-size:12px;font-weight:700;border-radius:20px;padding:2px 10px}
.ev-ok{background:#eafaf0;color:#1a7a3c}.ev-bad{background:#fdecec;color:#c0392b}

/* Content Remix */
.rmx-fmts{display:flex;flex-direction:column;gap:8px}
.rmx-fmt{display:flex;align-items:flex-start;gap:8px;font-size:13.5px;color:#334155;cursor:pointer;line-height:1.4}
.rmx-fmt input{margin-top:2px}

/* Orçamento (CPQ) */
.orc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:900px){.orc-grid{grid-template-columns:1fr}}
.orc-tot{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end}
.orc-tot b{display:block;font-size:19px;color:#12314f;line-height:1.1}
.orc-tot span{font-size:11.5px}
.orc-tot-big b{font-size:26px;color:var(--brand)}

/* ── LinkedIn · prospecção assistida (cadências) ── */
.lkd-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px;align-items:start}
@media(max-width:960px){.lkd-grid{grid-template-columns:1fr}}
.lkd-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:520px){.lkd-row2{grid-template-columns:1fr}}
.lkd-st{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700;text-transform:capitalize}
.lkd-st-rascunho{background:#eef1f5;color:#67788a}
.lkd-st-ativa{background:#e6f4ec;color:#1f8a4d}
.lkd-st-concluida{background:#e8eefc;color:#2b5bd7}
.lkd-passo{border:1px solid #e6ebf1;border-radius:12px;background:#fff;padding:12px}
.lkd-passo-done{background:#f6faf7;border-color:#cfe8d8}
.lkd-passo-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.lkd-tipo{font-weight:700;font-size:13px;color:#12314f}
.lkd-dia{font-size:11.5px;font-weight:700;color:#fff;background:var(--brand);padding:1px 8px;border-radius:999px}
.lkd-passo-t{font-size:12.5px;color:var(--muted);flex:1;min-width:80px}
.lkd-passo-badge{font-size:11px;font-weight:700;color:#a08316;background:#fbf5df;padding:2px 8px;border-radius:999px}
.lkd-txt{width:100%;font-family:inherit;font-size:13.5px;line-height:1.5;resize:vertical}
.lkd-passo-f{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;flex-wrap:wrap}
.lkd-cont{font-size:11.5px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.lkd-over{color:#e03131}

/* Integrações — cartões de inserção de chave (write-only) */
.intg-campos{display:grid;gap:9px;margin:10px 0 12px}
.intg-opt{font-size:11px;font-weight:400;color:var(--muted)}
.intg-acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ── Menu em 3 etapas (Agência/Gestão/Marketing) — recolhível + compacto ── */
#sideNav{gap:1px}
#sideNav .nav-item{padding:4px 11px;font-size:13px;gap:9px;border-radius:8px}
#sideNav .nav-item svg{width:17px;height:17px}
#sideNav .nav-item:not(.nav-sub){margin-top:0}
#sideNav .nav-item.active::before{top:5px;bottom:5px}
#sideNav .nav-inicio{margin-bottom:3px}
.nav-etapa{display:flex;flex-direction:column;margin-top:7px}
.nav-etapa-h{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;background:transparent;border:0;color:rgba(255,255,255,.5);font-family:var(--corpo-f);font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:6px 12px 4px;cursor:pointer;border-radius:7px}
.nav-etapa-h:hover{color:rgba(255,255,255,.85)}
.nav-etapa-h .nav-chev{width:13px;height:13px;transition:transform .15s;opacity:.7}
.nav-etapa.col .nav-etapa-h .nav-chev{transform:rotate(-90deg)}
.nav-etapa.col .nav-etapa-body{display:none}
.nav-etapa-body{display:flex;flex-direction:column;gap:1px}
.nav-grupo{display:flex;flex-direction:column;margin-top:2px}
.nav-mae-row{display:flex;align-items:center;gap:1px}
.nav-mae-row .nav-mae{flex:1;font-weight:600}
.nav-mae-col,.nav-grupo-h2{background:transparent;border:0;color:rgba(255,255,255,.55);cursor:pointer;display:flex;align-items:center;border-radius:8px;transition:.12s}
.nav-mae-col{padding:5px 8px;flex:none}
.nav-mae-col:hover{color:#fff;background:rgba(255,255,255,.10)}
.nav-grupo-h2{width:100%;gap:9px;padding:4px 11px;color:rgba(255,255,255,.82);font-family:var(--corpo-f);font-size:13px;font-weight:600}
.nav-grupo-h2>svg:first-child{width:17px;height:17px;flex:none;opacity:.9}
.nav-grupo-h2 .nav-label{flex:1;text-align:left}
.nav-grupo-h2:hover{background:rgba(255,255,255,.10);color:#fff}
.nav-mae-col .nav-chev,.nav-grupo-h2 .nav-chev{width:13px;height:13px;transition:transform .15s;flex:none;opacity:.75}
.nav-grupo.col .nav-mae-col .nav-chev,.nav-grupo.col .nav-grupo-h2 .nav-chev{transform:rotate(-90deg)}
.nav-grupo.col .nav-grupo-body{display:none}
.nav-grupo-body{display:flex;flex-direction:column;gap:1px;padding-top:1px}
#sideNav .nav-item.nav-sub{padding-top:3px;padding-bottom:3px;padding-left:20px;margin-left:15px}
.nav-novo{font-size:9px;font-weight:800;background:rgba(127,212,205,.22);color:#bfeee8;padding:1px 5px;border-radius:6px;margin-left:6px;text-transform:uppercase;letter-spacing:.05em;vertical-align:middle}
.nav-ext{font-size:11px;opacity:.55;vertical-align:middle}

/* Recorrentes ligadas a Recebimentos / Contas a pagar (painel recolhível) */
.frr{border:1px solid var(--borda);border-radius:12px;background:#fbfcfe;margin-bottom:12px;overflow:hidden}
.frr>summary{cursor:pointer;padding:10px 14px;font-weight:600;font-size:13.5px;list-style:none;display:flex;align-items:center;gap:8px}
.frr>summary::-webkit-details-marker{display:none}
.frr-badge{font-size:11.5px;font-weight:600;color:var(--muted);background:#eef2f7;border-radius:999px;padding:1px 9px}
.frr-body{padding:2px 14px 12px}
.frr-row{display:flex;align-items:center;gap:10px;padding:5px 0;border-top:1px solid var(--papel);font-size:13px}
.frr-row.off{opacity:.5}
.frr-desc{flex:1;min-width:0;font-weight:500}
.frr-val{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
.frr-val.receita{color:#1f8a4d}.frr-val.despesa{color:#c0392b}
.frr-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

/* Portal do cliente unificado — abas Clientes & Link / Painéis / Relatórios */
.pt-tabs{display:flex;gap:4px;border-bottom:1px solid var(--borda);margin-bottom:16px;flex-wrap:wrap}
.pt-tab{background:transparent;border:0;border-bottom:2px solid transparent;padding:8px 15px;font-size:13.5px;font-weight:600;color:var(--muted);cursor:pointer;border-radius:8px 8px 0 0;transition:.12s}
.pt-tab:hover{color:var(--texto);background:var(--papel)}
.pt-tab.on{color:var(--brand);border-bottom-color:var(--brand)}

/* ── Painel de Prospecção (LinkedIn + Google) ───────────────────────────────────
   Gráficos em SVG inline. Cores das séries só nas marcas — texto sempre em tinta. */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:12px}
.pp-2col{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:1000px){.pp-2col{grid-template-columns:1fr}}
.leads .num,.tbl .num,.pp-barra-v{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}

/* funil — uma cor só; o comprimento é que codifica a magnitude */
.pp-funil{display:grid;gap:13px}
.pp-funil-cab{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--corpo)}
.pp-funil-cab b{font-family:var(--display);font-size:15px;color:var(--titulo);font-variant-numeric:tabular-nums}
.pp-funil-tr{height:12px;background:var(--papel);border-radius:var(--r-pill);overflow:hidden;margin:5px 0 3px}
.pp-funil-b{height:100%;background:#3A5BA9;border-radius:var(--r-pill);transition:width .35s ease}
.pp-funil-sub{font-size:11.5px;color:var(--muted)}

/* barras de distribuição */
.pp-barras{display:grid;gap:9px}
.pp-barra-l{display:grid;grid-template-columns:112px 1fr 44px;align-items:center;gap:9px}
.pp-barra-rot{font-size:12.5px;color:var(--corpo);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-barra-tr{height:9px;background:var(--papel);border-radius:var(--r-pill);overflow:hidden}
.pp-barra-b{display:block;height:100%;border-radius:var(--r-pill);transition:width .35s ease}
.pp-barra-v{font-size:12.5px;font-weight:600;color:var(--corpo)}

/* legenda + gráfico de linhas */
.pp-leg-linha{display:flex;gap:16px;flex-wrap:wrap;margin:-4px 0 10px}
.pp-leg{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--corpo)}
.pp-leg i{width:11px;height:3px;border-radius:2px;display:inline-block}
.pp-graf svg{display:block;overflow:visible}
.pp-graf #ppHit{cursor:crosshair}
.pp-tip{position:absolute;top:6px;background:#fff;border:1px solid var(--borda);border-radius:var(--r-sm);
  box-shadow:var(--sh-2);padding:8px 10px;font-size:12px;pointer-events:none;display:grid;gap:3px;min-width:140px;z-index:5}
.pp-tip b{color:var(--titulo)}
.pp-tip span{display:flex;align-items:center;gap:6px;color:var(--corpo)}
.pp-tip i{width:9px;height:9px;border-radius:3px;display:inline-block}

/* listas de agenda e atividade */
.pp-lista{display:grid;gap:2px}
.pp-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--borda)}
.pp-item:first-child{border-top:0}
.pp-item-d{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;min-width:44px}
.pp-item-d.pp-atras{color:#b91c1c;font-weight:600}
.pp-item-t{flex:1;min-width:0;display:flex;flex-direction:column;font-size:13px}
.pp-item-t b{color:var(--corpo);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* selo de qualificação + barra de ações em lote */
.pp-score{display:inline-block;padding:1px 9px;border-radius:var(--r-pill);font-size:11.5px;font-weight:700;letter-spacing:.02em;cursor:help}
.pp-lote{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#eef3ff;border:1px solid #c9d8f7;
  border-radius:var(--r-sm);padding:9px 12px;margin-bottom:10px;font-size:13px}
.pp-lote b{color:var(--titulo)}
tr.lkd-sel{background:#eef3ff}

/* nas tabelas de prospecção o subtítulo é uma 2ª linha, não continuação do nome */
.leads td .cell-sub, .tbl td .cell-sub, .atrib-conv td .cell-sub{display:block;margin-top:2px;font-weight:400;line-height:1.35}

/* caixa de conversas */
.pp-badge{display:inline-block;background:#e8552d;color:#fff;border-radius:var(--r-pill);padding:0 7px;font-size:11px;font-weight:700;line-height:17px}
.pp-thread{max-height:46vh;overflow-y:auto;display:grid;gap:9px;padding:4px 2px}
.pp-msg{max-width:82%;padding:9px 12px;border-radius:var(--r);font-size:13.5px;line-height:1.45}
.pp-msg-out{background:#eef3ff;border:1px solid #c9d8f7;justify-self:end}
.pp-msg-in{background:var(--papel);border:1px solid var(--borda);justify-self:start}
.pp-msg-m{font-size:11px;color:var(--muted);margin-top:5px}
.pp-msg-t{white-space:pre-wrap}

/* ── Copiloto · chat fluido (uma caixa, um fio, confirmação embutida) ── */
#iaFab.on{transform:scale(.92);opacity:.85}
.copi-painel{position:fixed;right:20px;bottom:92px;width:390px;max-width:calc(100vw - 32px);height:min(560px,calc(100vh - 130px));
  background:#fff;border:1px solid var(--borda);border-radius:var(--r-lg);box-shadow:var(--sh-3);display:flex;flex-direction:column;overflow:hidden;z-index:1200}
.copi-top{padding:12px 14px;border-bottom:1px solid var(--borda);display:grid;grid-template-columns:1fr auto;gap:2px;align-items:center}
.copi-top b{font-family:var(--display);color:var(--titulo);font-size:14px}
.copi-sub{grid-column:1;font-size:11.5px;color:var(--muted)}
.copi-x{grid-row:1/3;grid-column:2;background:none;border:0;font-size:16px;color:var(--muted);cursor:pointer;padding:4px 6px}
.copi-fio{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:9px;background:var(--papel)}
.copi-vazio{font-size:13px;color:var(--muted);line-height:1.55;background:#fff;border:1px solid var(--borda);border-radius:var(--r);padding:12px}
.copi-msg{max-width:88%;padding:9px 12px;border-radius:var(--r);font-size:13.5px;line-height:1.5;white-space:normal;word-break:break-word}
.copi-user{align-self:flex-end;background:#3A5BA9;color:#fff;border-bottom-right-radius:4px}
.copi-copi{align-self:flex-start;background:#fff;border:1px solid var(--borda);color:var(--corpo);border-bottom-left-radius:4px}
.copi-fontes{margin-top:7px;font-size:11px;color:var(--muted);border-top:1px dashed var(--borda);padding-top:5px}
.copi-conf{margin-top:10px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.copi-conf-forte{background:#fff4f0;border:1px solid #e8552d55;border-radius:var(--r-sm);padding:8px}
.copi-alerta{width:100%;font-size:11.5px;color:#b91c1c;font-weight:600;margin-bottom:2px}
.copi-opts{display:flex;gap:6px;flex-wrap:wrap;background:none;border:0;padding:0}
.copi-barra{display:flex;gap:8px;padding:10px;border-top:1px solid var(--borda);background:#fff}
.copi-input{flex:1;border:1px solid var(--borda);border-radius:var(--r-pill);padding:9px 14px;font:inherit;font-size:13.5px;outline:none}
.copi-input:focus{border-color:var(--azul)}
.copi-send{border:0;background:var(--azul);color:#fff;width:38px;border-radius:50%;cursor:pointer;font-size:14px}
.copi-pensando{display:flex;gap:4px;align-items:center;padding:12px 14px}
.copi-pensando span{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:copiP 1.2s infinite}
.copi-pensando span:nth-child(2){animation-delay:.2s} .copi-pensando span:nth-child(3){animation-delay:.4s}
@keyframes copiP{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@media (max-width:520px){.copi-painel{right:8px;left:8px;width:auto;bottom:80px}}


/* ── LinkedIn · campanhas de conexão ── */
.lkdc-card{cursor:pointer;transition:border-color .15s,transform .15s}
.lkdc-card:hover{border-color:var(--azul);transform:translateY(-1px)}
.lkdc-card:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
.lkdc-topo{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px}
.lkdc-funil{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0 8px;text-align:center}
.lkdc-funil div{background:var(--papel);border-radius:var(--r-sm);padding:8px 4px}
.lkdc-funil b{display:block;font-family:var(--display);font-size:17px;color:var(--titulo)}
.lkdc-funil span{font-size:10.5px;color:var(--muted)}
.lista-simples{list-style:none;padding:0;margin:0}
.lista-simples li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--borda)}
.lista-simples li:last-child{border-bottom:0}
@media (max-width:720px){.lkdc-funil{grid-template-columns:repeat(2,1fr)}}


/* ── Funil da Régua de prospecção (colunas) — .pp-funil já é do Painel ── */
.pr-funil{display:flex;gap:10px;align-items:flex-end;margin-top:14px;min-height:120px}
.pr-fase{flex:1;text-align:center;display:flex;flex-direction:column;justify-content:flex-end;gap:4px}
.pr-barra{background:linear-gradient(180deg,#12b3b0,#2a4b9b);border-radius:6px 6px 0 0;min-height:8px}
.pr-fase b{font-family:var(--display);font-size:16px;color:var(--titulo)}
.pr-fase span{font-size:10.5px;color:var(--muted);line-height:1.2}
@media (max-width:720px){.pr-funil{overflow-x:auto}.pr-fase{min-width:76px}}

/* ── Atividades: esforço estimado, ordem manual e carga por pessoa ── */
/* selo estimado × apontado no cartão (⏱ 2h/5h). O vermelho é o estouro de escopo:
   é a informação que precisa saltar aos olhos antes da entrega, não depois. */
.chip.esf{background:#f4f0fb;color:#5b4a8a;font-weight:600}
.chip.esf.esf-estouro{background:#fdeceb;color:var(--quente)}
/* alvo do drop: linha acima do cartão na frente do qual o arrastado vai entrar */
.acard.drop-alvo{box-shadow:0 -3px 0 -1px #3A5BA9}
.acard.dragging{opacity:.45}

/* carga por pessoa (aba Gráficos) */
.gr-carga{grid-column:1/-1}
.cg-row{margin:0 0 13px}
.cg-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13px}
.cg-nome{font-weight:600;color:var(--titulo)}
.cg-num{white-space:nowrap;color:var(--corpo);font-size:12.5px}
.cg-num b{font-family:var(--display)}
.cg-semcap{white-space:nowrap;color:var(--muted);font-size:12px;font-style:italic}
.cg-track{height:10px;background:#eef1f6;border-radius:999px;overflow:hidden;margin:5px 0 4px}
.cg-bar{height:100%;border-radius:999px;background:var(--grad);transition:width .25s}
.cg-bar.cheio{background:linear-gradient(90deg,#e8a020,#e8552d)}
.cg-bar.estouro{background:linear-gradient(90deg,#e8552d,#b02a37)}
.cg-bar.sem-cap{background:#d7dce6}
.cg-pe{display:flex;flex-wrap:wrap;align-items:center;gap:7px;min-height:18px}
.cg-tag{font-size:11px;color:var(--muted);background:#f1f4f9;border-radius:999px;padding:1px 8px}
.cg-tag.atras{background:#fdeceb;color:var(--quente);font-weight:600}
.cg-cap{margin-left:auto;background:none;border:0;padding:0;font:inherit;font-size:11px;color:#3A5BA9;cursor:pointer;text-decoration:underline}
.cg-cap:hover{color:#2E4A9E}
.cg-ressalva{font-size:11.5px;color:var(--morno-txt);background:#fff8e8;border-radius:8px;padding:7px 10px;margin:10px 0 0;line-height:1.45}

/* ── Gestão de Tarefas: subtarefas, dependências e fechamento de período (v145) ── */
.chip.sub{background:#eef2fb;color:#2E4A9E}
.chip.bloq{background:#fdeceb;color:var(--quente,#b02a37)}
.sub-list,.dep-list{display:flex;flex-direction:column;gap:6px;margin:4px 0 10px}
.sub-row,.dep-row{display:flex;align-items:center;gap:8px}
.sub-row .ach-check{flex:0 0 auto;width:18px;height:18px;cursor:pointer;color:#2b8a3e}
.sub-tit,.dep-tit{flex:1 1 auto;cursor:pointer;font-size:13px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sub-tit:hover,.dep-tit:hover{text-decoration:underline}
.sub-tit.done{text-decoration:line-through;color:var(--muted)}
.sub-x,.dep-x{flex:0 0 auto;background:none;border:0;color:var(--muted);font-size:16px;line-height:1;cursor:pointer;padding:0 4px}
.sub-x:hover,.dep-x:hover{color:var(--quente,#b02a37)}
.sub-add{display:flex;gap:8px;align-items:center;margin-top:4px}
.sub-add .sub-novo{flex:1 1 auto}
.sub-hint{font-size:12.5px;color:#2b7a3e;background:#eef7ee;border-radius:8px;padding:7px 10px;margin:8px 0 0}
.dep-bloq{font-size:12.5px;color:var(--quente,#b02a37);background:#fdeceb;border-radius:8px;padding:7px 10px;margin:0 0 8px;line-height:1.45}
.dep-st{flex:0 0 auto;width:9px;height:9px;border-radius:50%}
.dep-st.ok{background:#2b8a3e}
.dep-st.pend{background:#e8552d}
.dep-add{margin-top:4px;width:100%}
.per-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin:4px 0 12px}
.per-form .in{max-width:230px}
.per-list{display:flex;flex-direction:column;gap:6px}
.per-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 10px;border:1px solid var(--linha,#e6e8ee);border-radius:9px}
.per-row.fechado{background:#fbf3f2}
.per-row.reaberto{background:#f5f7fb}
.per-comp{font-weight:600;font-size:13px;min-width:130px}
.per-info{font-size:12px;color:var(--muted)}
.per-quem{font-size:12px;color:var(--muted);flex:1 1 auto}
.per-toggle{flex:0 0 auto}

/* ── RESUMO DO DIA (card do Início) ─────────────────────────────────────────
   Cada bloco é um BOTÃO porque o briefing só tem valor se levar à tela onde se
   resolve — ler "3 tickets estourando" e ter que caçar o Pós-venda no menu
   devolveria o problema que o resumo existe para acabar. */
.rd-card h3{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rd-risco{font-size:12.5px;font-weight:700;color:var(--quente);background:#fdeceb;border-radius:999px;padding:3px 10px;letter-spacing:.01em}
.rd-card h3 .btn{margin-left:auto}
.rd-blocos{display:flex;flex-direction:column;gap:6px}
.rd-bloco{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:#fff;border:1px solid var(--borda);border-radius:10px;padding:9px 12px;cursor:pointer;font-family:inherit;color:var(--corpo);transition:.14s}
.rd-bloco:hover{border-color:#c9d3e6;background:#fafbfd;transform:translateX(2px)}
.rd-bloco[data-rdview=""]{cursor:default}
.rd-b-ico{flex:0 0 auto;font-size:16px;line-height:1}
.rd-b-txt{flex:1 1 auto;display:flex;flex-direction:column;gap:1px;min-width:0}
.rd-b-txt b{font-size:13.5px;font-weight:650}
.rd-b-sub{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rd-b-n{flex:0 0 auto;min-width:26px;text-align:center;font-size:13px;font-weight:700;color:var(--frio);background:#eef2fb;border-radius:8px;padding:3px 7px}
.rd-ocultos{font-size:11.5px;color:var(--muted);margin:9px 0 0;font-style:italic}

/* fontes da transcrição na reunião (colar · gravar · áudio · .txt) */
.reu-fontes{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.reu-fontes .btn.gravando{background:#fdecec;border-color:#c93a52;color:#c93a52}

/* ── News · painel de prontidão (Fase 1) ────────────────────────────────────
   Cada linha é uma etapa do pipeline. A que não está pronta mostra o que falta
   e o botão que resolve — era o silêncio dessa tela que fazia o sistema parecer
   quebrado quando estava só incompleto. */
.im-prontidao h3{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.im-pr-run{font-weight:600;font-size:12.5px;color:var(--azul);background:#eef2fb;border-radius:20px;padding:3px 10px}
.im-pr-linha{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--borda)}
.im-pr-linha:first-of-type{border-top:0}
.im-pr-n{flex:none;width:22px;height:22px;border-radius:50%;background:var(--papel);border:1px solid var(--borda);
  display:grid;place-items:center;font-size:11.5px;font-weight:700;color:var(--muted)}
.im-pr-linha.ok .im-pr-n{background:#e8f6ee;border-color:#bfe3d0;color:#2a7d55}
.im-pr-ic{flex:none;font-size:14px;line-height:1}
.im-pr-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.im-pr-txt b{font-size:13.5px;color:var(--corpo)}
.im-pr-det{font-size:12px;color:var(--muted)}
.im-pr-falta{font-size:12px;font-weight:600}
@media(max-width:640px){
  .im-pr-linha{flex-wrap:wrap}
  .im-pr-linha .btn{margin-left:32px}
}

/* ── News · Modelos de newsletter (Tela C) ──────────────────────────────────
   O bloco é a unidade que o dono arrasta com os olhos: número da ordem à
   esquerda, o que ele faz no meio, as ações à direita. A ordem visual é a ordem
   do e-mail — por isso o número é grande e vem primeiro. */
.nm-lista{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.nm-bloco{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--branco);
  border:1px solid var(--borda);border-radius:var(--r)}
.nm-bloco-n{flex:none;width:26px;height:26px;border-radius:50%;background:var(--papel);
  border:1px solid var(--borda);display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--azul)}
.nm-bloco-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.nm-bloco-top{font-size:13.5px;color:var(--corpo)}
.nm-bloco-tit{font-weight:400;color:var(--muted)}
.nm-bloco-cfg{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.nm-bloco-acts{flex:none;display:flex;gap:4px}
.nm-bloco-acts .btn[disabled]{opacity:.35}
/* paleta de blocos disponíveis: vem do catálogo do backend, não de uma lista fixa */
.nm-add{margin-top:14px;padding:12px 14px;background:var(--papel);border:1px dashed var(--borda);
  border-radius:var(--r);display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:var(--corpo)}
.nm-ajuda{display:block;font-size:11.5px;color:var(--muted);margin-top:3px;font-weight:400}
/* o e-mail montado roda isolado: é html completo com estilo inline */
.nm-iframe{width:100%;height:460px;border:1px solid var(--borda);border-radius:var(--r);background:#fff;margin-top:10px}
/* boletim sem uma notícia sequer: a tela diz na cara, em vez de exibir um
   quadro branco e deixar o usuário concluir que o sistema quebrou */
.nm-vazio{margin-top:10px;padding:12px 14px;border:1px solid #e6c9a8;border-left:3px solid #b9770f;
  border-radius:var(--r);background:#fdf6ec;font-size:13px;color:var(--corpo);line-height:1.5}
.nm-vazio-nota{font-size:12px;color:var(--muted);margin-top:6px}
.nm-obs{margin-top:10px;padding:10px 12px;border:1px solid var(--borda);border-radius:var(--r);
  background:var(--papel);font-size:12.5px;color:var(--muted);line-height:1.5}
@media(max-width:640px){
  .nm-bloco{flex-wrap:wrap}
  .nm-bloco-acts{margin-left:38px}
}

/* ── News · Contas de envio (Tela D) ────────────────────────────────────────
   SendGrid e Twilio ficam em blocos visualmente separados: são provedores
   distintos, com credenciais distintas, e tratá-los como "duas linhas da mesma
   lista" já confundiu quem cadastra. */
.ne-secao{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r);
  padding:16px 18px;margin-top:16px}
.ne-secao-top{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}
.ne-secao-top h3{margin:0;font-size:16px;color:var(--corpo)}
.ne-secao-top>div:first-child{flex:1;min-width:220px}
/* o estado do canal fica acima da lista: é a primeira pergunta de quem abre a
   tela ("isso entrega hoje?"), e a resposta vem com o que falta, escrito */
.ne-falta{margin-top:12px;padding:12px 14px;border:1px solid #e6c9a8;border-left:3px solid #b9770f;
  border-radius:var(--r);background:#fdf6ec;font-size:13px;color:var(--corpo);line-height:1.5}
.ne-falta div{font-size:12.5px;color:var(--muted);margin-top:4px}
.ne-ok{margin-top:12px;padding:10px 14px;border:1px solid #bfe3d0;border-left:3px solid #2a7d55;
  border-radius:var(--r);background:#f1f9f4;font-size:12.5px;color:var(--corpo)}
@media(max-width:640px){
  .ne-secao{padding:14px}
  .ne-secao-top{flex-direction:column}
}

/* ── News · seções propostas pela IA (Fase 2) ───────────────────────────────
   A procedência e a URL ficam VISÍVEIS em cada linha: a IA escolhe entre links
   que existem no site, e quem valida precisa poder conferir o endereço antes de
   confiar na descrição. */
.im-sec-lista{display:flex;flex-direction:column;gap:2px;max-height:46vh;overflow:auto;margin-top:4px}
.im-sec-linha{display:flex;align-items:flex-start;gap:9px;padding:9px 10px;border:1px solid var(--borda);
  border-radius:var(--r);background:var(--branco);cursor:pointer}
.im-sec-linha:hover{border-color:var(--azul)}
.im-sec-linha input{margin-top:3px;flex:none}
.im-sec-txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.im-sec-txt b{font-size:13.5px;color:var(--corpo)}
.im-sec-tipo{font-size:10.5px;font-weight:700;color:var(--muted);background:var(--papel);
  border:1px solid var(--borda);border-radius:4px;padding:1px 5px;margin-left:4px}
.im-sec-desc{font-size:12px;color:var(--corpo);opacity:.85}
.im-sec-url{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── News · uma página, seis abas ────────────────────────────────────────────
   O módulo ocupava 9 views e 3 itens de menu para um pipeline só ("3 páginas
   sobre o mesmo tema", nas palavras do dono). Virou uma barra de abas na ordem
   em que ele já pensa o processo: coletar → resumir → montar → destinatários →
   enviar. O ✅/⚠️ de cada aba vem da prontidão do pipeline — a barra navega e
   diz onde travou ao mesmo tempo. */
.news-tabs{display:flex;gap:2px;border-bottom:1px solid var(--borda);margin-bottom:18px;overflow-x:auto;overflow-y:hidden}
.news-tab{display:flex;align-items:center;gap:6px;flex:none;background:transparent;border:none;
  border-bottom:2px solid transparent;padding:9px 14px;font:inherit;font-size:14px;line-height:1.2;
  white-space:nowrap;cursor:pointer;color:var(--muted);border-radius:var(--r) var(--r) 0 0}
.news-tab:hover{color:var(--corpo);background:var(--papel)}
/* estado ativo por COR + BORDA (cor sozinha não é sinal suficiente) */
.news-tab.on{color:var(--azul);border-bottom-color:var(--azul);font-weight:600;background:var(--branco)}
.news-tab:focus-visible{outline:2px solid var(--azul);outline-offset:-2px}
.news-tab-ok{font-size:11px;line-height:1}
.news-tab-ok:empty{display:none}
/* blocos empilhados numa aba (ex.: Envio = contas + boletins + painel) */
.news-bloco{margin-top:26px;padding-top:18px;border-top:1px solid var(--borda)}
.news-bloco-h{margin:0 0 12px;font-size:15px;font-weight:600;color:var(--corpo)}
/* estado vazio: nunca um painel em branco — diz o que falta e leva ao conserto */
.news-vazio{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:18px;
  border:1px dashed var(--borda);border-radius:var(--r);background:var(--papel)}
.news-vazio p{margin:0;font-size:13px;max-width:60ch}
@media(max-width:640px){
  .news-tabs{margin-bottom:14px}
  .news-tab{padding:9px 10px;font-size:13px}
}
/* Blocos que deixaram de ser página e viraram seção empilhada dentro de uma aba
   trazem consigo o botão "voltar" da época em que eram tela própria. Na aba de
   Envio isso rendia TRÊS botões iguais, e na Visão geral um botão que já estava
   no destino. A barra de abas faz esse papel agora — o botão sai da vista sem
   tocar nas funções que o desenham. */
#imAutomacoesWrap #imAutoVoltar,
#imDisparosWrap #imdVoltar{display:none}
#imPainelWrap .cli-page-top{display:none}   /* só tinha o voltar dentro */

/* ── Briefing do dia — Início E tela própria ──────────────────────────────────
   O mesmo CSS serve os dois lugares porque o render é o mesmo (briefingDesenharEm).
   A faixa colorida à esquerda é a gravidade: quem passa o olho vê a temperatura
   do dia antes de ler qualquer palavra. Os chips de contagem (.brief-chip) saíram
   em 26/07 junto com o card-resumo — a lista inteira substituiu a contagem. */
.brief-card { border-left: 4px solid var(--sev, #9aa3b2); }
.brief-card h3 { display: flex; align-items: center; gap: 8px; }
.brief-sev { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px;
  color: #fff; background: var(--sev); padding: 2px 8px; border-radius: 9px; }
.brief-data { margin: 2px 0 8px; font-size: 12.5px; color: var(--muted); }
.brief-ia { margin: 6px 0 10px; font-size: 14.5px; line-height: 1.55; color: var(--txt, #2b3240); }
.brief-ia-velho { color: #8a8f99; font-style: italic; font-size: 13px; }
.brief-resumo { margin: 0 0 8px; font-size: 13px; color: #6b7280; }
.brief-prox { display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  background: rgba(0,0,0,.035); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; }
.brief-prox-rot { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: #8a8f99; }
.brief-prox b { font-size: 14px; }
.brief-prox-por { font-size: 12.5px; color: #6b7280; flex: 1 1 200px; }
.brief-prox-resto { font-size: 11.5px; color: var(--muted); }
.brief-rodape { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.brief-quando { font-size: 11.5px; color: var(--muted); }
.brief-escrevendo { font-size: 12px; color: #6b7280; font-style: italic; }

/* as seções: grade que se acomoda sozinha. minmax(300px,1fr) porque abaixo disso o
   título do item quebra em três linhas e a lista deixa de ser varrível. */
.brief-secoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 12px; margin-top: 12px; }
.brief-sec { border-top: 3px solid var(--c, #9aa3b2); }
.brief-sec h3 { display: flex; align-items: center; gap: 8px; }
.brief-sec h3 .btn { margin-left: auto; }
.brief-n { font-size: 11.5px; font-weight: 700; color: #fff; background: var(--c, #9aa3b2);
  padding: 1px 8px; border-radius: 999px; }
/* teto de altura + rolagem interna: a seção com 25 itens não pode empurrar as outras
   seis para fora da tela. Nada fica escondido atrás de um "ver mais" — só rola. */
.brief-itens { display: flex; flex-direction: column; gap: 5px; margin-top: 8px;
  max-height: 420px; overflow-y: auto; }
.brief-item { display: flex; align-items: flex-start; gap: 9px; width: 100%; text-align: left;
  padding: 8px 10px; border: 1px solid var(--borda); border-radius: 9px; background: #fff;
  cursor: pointer; transition: border-color .12s; }
.brief-item:hover { border-color: var(--c, #9aa3b2); }
.brief-item:focus-visible { outline: 2px solid var(--c, #9aa3b2); outline-offset: 1px; }
.brief-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--c, #9aa3b2);
  margin-top: 5px; }
.brief-i-txt { flex: 1; min-width: 0; display: block; }
.brief-i-tit { display: block; font-size: 13.5px; font-weight: 600; line-height: 1.35; }
.brief-i-sub { display: block; font-size: 12px; color: #6b7280; line-height: 1.4; margin-top: 1px; }
.brief-i-onde { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.brief-i-venc { flex: none; font-size: 11.5px; color: #6b7280; font-variant-numeric: tabular-nums; }
.brief-corte { margin: 8px 0 0; font-size: 11.5px; color: #a1670b; }
.brief-limpas { margin: 12px 0 0; font-size: 12.5px; color: #6b7280; }
/* corte por PERMISSÃO: tom neutro de propósito. O âmbar do .brief-omit quer dizer
   "algo quebrou"; isto aqui não quebrou nada — é a regra de acesso funcionando. */
.brief-semacesso { margin: 8px 0 0; font-size: 12.5px; color: #6b7280; }
.brief-semacesso b { color: #4b5563; }
/* omitida NÃO é vazia: âmbar, com o motivo à vista, porque é falta de dado e não paz */
/* COMPARTILHADA DE PROPÓSITO: .brief-omit e .brief-quando também vestem a
   Saúde do rastreamento. As duas telas dizem a mesma frase ("não consegui
   olhar" ≠ "está tudo certo") e um segundo bloco âmbar idêntico com outro
   nome divergiria no primeiro ajuste. Não são "só do briefing". */
.brief-omit { margin: 10px 0 0; font-size: 12px; color: #a1670b; background: rgba(217,164,6,.08);
  border-radius: 9px; padding: 9px 12px; }
.brief-omit ul { margin: 4px 0 0; padding-left: 18px; }
/* ── FONTE SEM DADO ≠ FONTE QUEBRADA ──────────────────────────────────────────
   NÃO usa o âmbar do .brief-omit de propósito: âmbar aqui quer dizer "algo
   quebrou, chame quem cuida do sistema", e aqui nada quebrou — a fonte está
   perfeitamente legível e só não tem linha. É tarefa de cadastro, com caminho
   conhecido, e por isso veste o mesmo cinza neutro do .brief-semacesso.

   E é <details> FECHADO por padrão: nesta base são doze fontes de uma vez, e
   doze avisos abertos empurram para baixo os itens que a pessoa precisa ver. A
   contagem no <summary> é o que não pode faltar; a lista é para quem for agir.
   `color` sai de var(--muted), que é um dos dois tokens de texto que passam em
   AA nesta paleta — cinza cravado em hex aqui já reprovou antes. */
.brief-semfonte { margin: 10px 0 0; font-size: 12px; color: var(--muted);
  background: rgba(107,114,128,.07); border-radius: 9px; padding: 9px 12px; }
.brief-semfonte > summary { cursor: pointer; list-style: revert; line-height: 1.45; }
.brief-semfonte > summary b { color: #4b5563; }
.brief-semfonte ul { margin: 6px 0 0; padding-left: 18px; }
.brief-semfonte li { margin: 3px 0; line-height: 1.45; }
/* ── POR QUE NÃO HÁ REGRA DE @media (prefers-color-scheme: dark) AQUI ───────
   Cético 26/07 · MEDIDO no navegador, admin.css real, esquema do sistema em
   escuro: `body` continua em var(--papel) = #F6F8FB e `.dash-card` em #fff,
   porque este painel NÃO tem tema escuro — não há :root escuro, não há troca
   de --papel/--branco/--corpo em lugar nenhum deste arquivo.
   Existiam dois blocos escuros mesmo assim, e eles pintavam para um fundo que
   nunca chega. O pior era `.brief-ia { color:#e6e8ec }`: o parágrafo da IA do
   Briefing do dia — que abre a tela Início e a op_briefing — ficava em cinza
   quase branco sobre cartão branco. Contraste medido: 1,23:1 (o mínimo de
   corpo de texto é 4,5:1). Some. Não fica feio: SOME. E some só na máquina de
   quem deixou o sistema em escuro, que é onde ninguém foi olhar.
   Os outros cinco eram cosméticos na mesma direção (fundo branco a 6% por cima
   de branco = nada).
   Tema escuro é obra de :root inteiro, não de seis regras avulsas. No dia em
   que ele existir, estas voltam JUNTO com o :root escuro — os apelidos de
   variável logo acima já garantem que os 51 pontos de admin.js acompanhem. */
/* ── Mapa do sistema (índice de todas as telas) ──────────────────────────── */
.mp-topo{display:flex;flex-direction:column;gap:14px;margin-bottom:22px}
.mp-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.mp-num{background:#fff;border:1px solid var(--borda);border-radius:var(--r-md);padding:12px 14px;box-shadow:var(--sh-1);display:flex;flex-direction:column;gap:2px}
.mp-num b{font-family:var(--display);font-size:24px;line-height:1;color:var(--azul)}
.mp-num span{font-size:11.5px;color:var(--muted);line-height:1.3}
.mp-num.aviso b{color:#b8860b}
.mp-num.alerta{border-color:#f0c9bb;background:#fdf5f2}
.mp-num.alerta b{color:#c9622d}
.mp-busca{width:100%;max-width:520px;padding:10px 14px;border:1px solid var(--borda);border-radius:var(--r-pill);font-family:inherit;font-size:14px;color:var(--corpo);background:#fff}
.mp-busca:focus{outline:2px solid var(--teal);outline-offset:1px;border-color:var(--teal)}
.mp-etapa{margin:0 0 26px}
.mp-etapa>h2{font-family:var(--display);font-size:15px;font-weight:700;color:var(--titulo);text-transform:uppercase;letter-spacing:.05em;margin:0 0 4px}
.mp-expl{font-size:12.5px;margin:0 0 12px;max-width:72ch;line-height:1.5}
.mp-grupos{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px;margin-top:10px;align-items:start}
.mp-grupo{background:#fff;border:1px solid var(--borda);border-radius:var(--r);box-shadow:var(--sh-1);padding:8px;display:flex;flex-direction:column;gap:2px}
.mp-semcapa{padding:10px 10px 6px;font-weight:700;font-size:14px;color:var(--titulo)}
.mp-filhas{display:flex;flex-direction:column;gap:2px}
.mp-tela{display:flex;flex-direction:column;gap:1px;text-align:left;width:100%;background:none;border:0;border-radius:var(--r-sm);padding:8px 10px;cursor:pointer;font-family:inherit;transition:background .12s}
.mp-tela:hover{background:#f2f6fc}
.mp-tela:focus-visible{outline:2px solid var(--teal);outline-offset:-2px}
.mp-l1{font-size:13.5px;font-weight:600;color:var(--titulo);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mp-l2{font-size:12px;color:var(--muted);line-height:1.35}
.mp-l3{font-size:10.5px;color:#98a2b3;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.mp-capa{background:#f7f9fd;border-bottom:1px solid var(--borda);border-radius:var(--r-sm) var(--r-sm) 0 0;margin-bottom:4px}
.mp-capa .mp-l1{font-size:14.5px}
.mp-tela.mp-bloq{cursor:not-allowed;opacity:.62}
.mp-tela.mp-bloq:hover{background:none}
.mp-tela.mp-orfa{background:#fdf5f2}
.mp-tela.mp-orfa:hover{background:#fbeee7}
.mp-bloco-orfas>h2{color:#c9622d}
.mp-bad{display:inline-block;font-size:10px;font-weight:700;padding:1px 7px;border-radius:999px;white-space:nowrap;letter-spacing:.01em}
.mp-bad.b-bloq{background:#eceff4;color:#5b6472}
.mp-bad.b-orfa{background:#c9622d;color:#fff}
.mp-bad.b-int{background:#eef1fb;color:#3A5BA9;font-weight:600}
.mp-bad.b-capa{background:#e7f5f3;color:#1F7A72}
.mp-bad.b-soon{background:#fdf3d9;color:#8a6600}
.mp-bad.b-cmdk{background:#eaf4f1;color:#1F7A72;font-weight:600}
.mp-expl code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;background:#f2f4f8;border-radius:4px;padding:1px 5px}
.mp-atalhos{display:flex;flex-wrap:wrap;gap:6px}
.mp-alias{background:#fff;border:1px solid var(--borda);border-radius:999px;padding:3px 11px;font-size:11.5px;color:var(--muted)}
.mp-alias code{font-size:11px;color:var(--corpo)}
@media (max-width:600px){.mp-grupos{grid-template-columns:1fr}}

/* ── Cobrança no documento financeiro: selo na lista, bloco de conferência no
   formulário e a tela "Como o cliente paga" (linha digitável + QR do Pix) ── */
.fd-pg{display:inline-block;margin-left:6px;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:20px;background:#eef3fb;color:#3A5BA9;vertical-align:middle}
.fd-pg.pix{background:#e6f7f5;color:#0F6E66}
.fd-pg.ruim{background:#fdecea;color:#a12a2a}
.fd-cob{margin-top:12px;border:1px solid var(--borda);border-radius:10px;padding:8px 12px;background:#fbfcfe}
.fd-cob>summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--corpo);list-style:none}
.fd-cob>summary::-webkit-details-marker{display:none}
.fd-cob>summary::before{content:"▸ ";color:var(--muted)}
.fd-cob[open]>summary::before{content:"▾ "}
.fd-cob-st{margin-top:6px;font-size:12.5px;min-height:1px}
.cob-ok{color:#1f9d57;font-weight:600}
.cob-erro{color:#c92a2a;font-weight:600}
.cob-neutro{color:var(--muted)}
.cob-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;color:var(--corpo);word-break:break-all;margin-top:3px;line-height:1.5}
.cob-pix{display:flex;gap:12px;align-items:flex-start;margin-top:4px}
.cob-pix-qr{flex:0 0 auto;line-height:0}
.cob-pix-qr svg{width:104px;height:104px;border:1px solid var(--borda);border-radius:6px}
.pg-grade{display:grid;grid-template-columns:1fr;gap:12px}
.pg-bloco{border:1px solid var(--borda);border-radius:12px;padding:14px 16px;background:#fbfcfe}
.pg-bloco.ruim{background:#fdecea;border-color:#f5c6cb}
.pg-tit{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.pg-linha{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:16px;font-weight:700;color:var(--corpo);margin-top:6px;word-break:break-all;line-height:1.5;user-select:all}
.pg-linha.pg-mini{font-size:11.5px;font-weight:400}
.pg-meta{font-size:12.5px;color:var(--muted);margin-top:4px}
.pg-qr{margin:10px 0;line-height:0}
.pg-qr svg{width:180px;height:180px;border:1px solid var(--borda);border-radius:8px}
.pg-copiar{margin-top:10px}
@media (min-width:720px){.pg-grade{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.cob-pix{flex-direction:column}}

/* ══════════════════════════════════════════════════════════════════════════
   ONDA 3 · DESENHO DAS TELAS NOVAS (26/07/2026)
   As Ondas 1 e 2 puseram ~10 telas no ar e o fechamento de cada uma admitiu
   que o CSS nunca foi visto. Isto aqui é a dívida paga: o que virou classe
   da casa em vez de style= solto, e o que passou a ter nome próprio em vez
   de usar o nome de outra tela. Regra da obra: se faltava uma classe,
   criar UMA e documentar — não vinte.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Severidade: UMA escala, várias telas ─────────────────────────────────
   Fadiga de criativo e Saúde do rastreamento nasceram cada uma com a sua
   tabela de cores dentro do JS (fadSevCor, RS_SEV) — fora de qualquer
   variável de tema e duplicada. Pior: a cor era o ÚNICO sinal. Cor sozinha
   não informa quem não separa vermelho de âmbar, e não sobrevive à troca de
   tema. Aqui a escala é uma só, mora no CSS, e a PALAVRA vai sempre junto no
   HTML (o chip .tai-badge já lê o --c da casa). */
.sev-critica,.sev-alta{--c:#c0392b}
.sev-media{--c:#a1670b}
.sev-baixa{--c:#3a7d9a}
.sev-info{--c:#5a6b7a}
.sev-ok{--c:#2b8a3e}
/* faixa lateral do cartão na MESMA escala (era border-left inline em 4 telas) */
.sev-borda{border-left:4px solid var(--c,#5a6b7a)}
/* número grande na cor da severidade, dentro do KPI da casa (.tai-stat) */
.sev-num{color:var(--c,var(--titulo))}

/* grupo de controles dentro da .tai-toolbar (filtros à esquerda, ações à
   direita). Substitui o style="display:flex;gap:8px;flex-wrap:wrap" que
   estava repetido em Ritmo de verba, Importar CSV, Fadiga, Não contatar e
   Saúde do rastreamento. */
.tai-grupo{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ── Estado vazio que ENSINA ──────────────────────────────────────────────
   Todas as telas destas ondas nascem com ZERO linha — o vazio é a primeira
   coisa que a pessoa vê, e "Nenhum registro" é um beco: informa que não há
   nada e não informa o que fazer. O padrão tem três partes obrigatórias: o
   que a tela faz, POR QUE está vazia, e o botão que a enche. .dash-empty
   continua valendo para o vazio de dentro de um cartão (uma linha, discreto);
   .tela-vazia é o vazio da TELA. */
.tela-vazia{display:flex;flex-direction:column;align-items:center;text-align:center;gap:9px;background:var(--branco);border:1px dashed #cfd8e6;border-radius:var(--r);padding:34px 24px;box-shadow:var(--sh-1)}
.tela-vazia-ico{font-size:30px;line-height:1}
.tela-vazia h3{font-family:var(--display);font-size:16px;color:var(--titulo);margin:0}
.tela-vazia p{margin:0;max-width:64ch;font-size:13.5px;color:var(--muted);line-height:1.55}
.tela-vazia .tai-grupo{justify-content:center;margin-top:4px}
/* duas variacoes do MESMO vazio, e so duas — o padrao nao pode virar vinte classes.
   .tela-vazia-td: a mensagem dentro de um <tbody>, quando a tabela e um bloco de
   dentro da tela (ou tem filtro aplicado) e desmonta-la perderia o contexto. Perde
   moldura e sombra porque a tabela ja e a moldura; ganharia duas bordas encaixadas.
   .tela-vazia-falta: a linha do que FALTA CONFIGURAR. E o unico caso em que o vazio
   nao e convite: fundo de aviso, para nao se confundir com o texto que ensina. */
.tela-vazia-td{padding:0!important;background:var(--papel)}
.tela-vazia-td .tela-vazia{border:0;box-shadow:none;background:transparent;border-radius:0}
.tela-vazia-falta{margin:0!important;max-width:64ch;font-size:12.5px!important;color:#8a5a12!important;background:#fdf6e7;border:1px solid #e6c9a8;border-radius:var(--r-sm);padding:7px 11px}

/* bloco monoespaçado para COPIAR (lista de negativas do Termos de busca).
   Estava como .code-block, que não existia em lugar nenhum. */
.code-block{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.6;color:var(--corpo);background:var(--papel);border:1px solid var(--borda);border-radius:var(--r-sm);padding:10px 12px;margin:0;white-space:pre-wrap;word-break:break-word}

/* ── Cronograma (aba Cronograma de Atividades) ────────────────────────────
   Estas 17 regras moravam num <style> injetado DENTRO do innerHTML de
   #ativView, com prefixo cg- — o mesmo da "carga por pessoa" (aba Gráficos),
   que redeclara .cg-nome logo acima neste arquivo com um layout totalmente
   diferente. As duas abas escrevem no MESMO container, então hoje não
   coexistem e nada quebra — é colisão adormecida, e o mesmo componente tinha
   duas fontes de verdade (.cg-ressalva ficou no CSS, as outras no JS).
   Agora: prefixo próprio cgt- (cronograma-timeline) e fonte única aqui.
   A largura da coluna de nomes entra por --cg-esq, que o JS escreve inline
   porque é a única medida calculada (CRONO_ESQ). */
.cgt-grid{display:flex;border:1px solid var(--borda);border-radius:12px;overflow:hidden;background:var(--branco)}
.cgt-col-esq{width:var(--cg-esq,268px);flex:0 0 var(--cg-esq,268px);border-right:1px solid var(--borda)}
.cgt-col-dir{flex:1;overflow-x:auto}
.cgt-cab{height:38px;border-bottom:1px solid var(--borda);position:relative;font-size:11.5px;color:var(--muted)}
.cgt-mes{position:absolute;top:2px;height:16px;line-height:16px;padding-left:5px;font-weight:600;border-left:1px solid var(--borda);overflow:hidden;white-space:nowrap}
.cgt-tick{position:absolute;top:20px;height:16px;line-height:16px;text-align:center;font-size:10.5px}
.cgt-tick.fds{opacity:.45}
.cgt-corpo{position:relative}
.cgt-linha{position:absolute;top:0;bottom:0;width:1px;background:#eef1f6}
.cgt-fds{position:absolute;top:0;bottom:0;background:rgba(0,0,0,.035)}
.cgt-hoje{position:absolute;top:0;bottom:0;width:2px;background:var(--quente);z-index:3}
.cgt-hoje::after{content:'hoje';position:absolute;top:-1px;left:3px;font-size:10px;color:var(--quente);font-weight:700}
.cgt-barra{position:absolute;height:16px;border-radius:4px;cursor:pointer;overflow:hidden;z-index:2;box-shadow:0 1px 2px rgba(0,0,0,.14)}
.cgt-barra.aberta{background:transparent!important;border:1.5px dashed currentColor;box-shadow:none}
.cgt-barra.invert{outline:2px solid #c93a52}
.cgt-fill{position:absolute;inset:0;background:rgba(0,0,0,.26);border-radius:4px 0 0 4px}
.cgt-rot{position:relative;z-index:1;color:#fff;font-size:11px;line-height:16px;padding:0 6px;white-space:nowrap;text-shadow:0 1px 1px rgba(0,0,0,.35)}
.cgt-marco{position:absolute;width:12px;height:12px;transform:rotate(45deg);border-radius:2px;cursor:pointer;z-index:2}
.cgt-base{position:absolute;height:7px;border-radius:4px;background:repeating-linear-gradient(90deg,#b9c2d4,#b9c2d4 6px,transparent 6px,transparent 10px)}
.cgt-nome{display:flex;align-items:center;gap:5px;padding:0 10px;font-size:12.5px;border-bottom:1px solid #f1f3f8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.cgt-nome.proj{background:var(--papel);cursor:default;flex-direction:column;align-items:flex-start;justify-content:center;gap:0}
.cgt-nome.proj .cell-sub{font-size:10.5px}
.cgt-nome.ok{opacity:.6;text-decoration:line-through}
.cgt-ram{opacity:.5}
/* no celular a coluna de nomes come a tela inteira */
@media (max-width:640px){.cgt-col-esq{width:150px;flex:0 0 150px}}

/* ── Seção dentro de um grupo do menu ─────────────────────────────────────
   Tráfego tem 12 filhas: lista longa demais para escanear, e as quatro que
   as ondas acrescentaram são todas de DIAGNÓSTICO, misturadas no meio da
   operação. Fundir as quatro numa tela de abas quebraria view, deep-link,
   Ctrl+K, Mapa do sistema e os botões "Abrir onde se conserta" — custo alto
   para ganho cosmético. Um rótulo de seção dá o mesmo ganho de leitura sem
   mexer em rota nenhuma. Não é botão: não navega, não recebe foco. */
/* 40px = 16 de margem + 24 de recuo do .nav-sub: o rótulo nasce exatamente na
   coluna do ícone da filha, e não flutuando entre a borda e o texto. */
/* ⚠ ONDA 18 · CÉTICO — CONTRASTE MEDIDO NO NAVEGADOR: era rgba(255,255,255,.42) e
   dava 2,87:1 no topo do gradiente da barra (--side-bg, #2f4795 → #1d2f63) e 3,55:1
   na base. O mínimo da WCAG AA para 9,5px é 4,5:1 — nem a régua frouxa de texto
   grande (3:1) passava, e 9,5px não é texto grande. Com .65 dá 4,65:1 no pior ponto
   (o mais claro) e sobe daí para baixo; continua ABAIXO do .78 do rótulo do item,
   então a hierarquia visual não se perde — quem carrega a diferença é a caixa alta,
   o corpo 9,5 e o letter-spacing, não o cinza.
   Não é dívida da Onda 18: o rótulo nasceu na Onda 3, no Tráfego, com este cinza. É
   que a Onda 18 mais que dobrou a superfície dele (3 rótulos → 7) e pôs quatro deles
   dentro da Administração, que é a gaveta que o dono mais abre — o defeito deixou de
   ser de um canto e passou a ser do menu. É a mesma correção por token que a Onda 7
   fez no Briefing (2,54 → 4,97).
   ⚠ este arquivo é CRLF (regra 2 da casa) e a versão está em sistema.html: mexer
   aqui SEM bumpar `admin.css?v=` não chega ao navegador de ninguém. */
.nav-sub-sec{display:block;margin:9px 0 2px 40px;font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.65);user-select:none}
.nav-grupo-body>.nav-sub-sec:first-child{margin-top:2px}
/* ══ AVALIAÇÃO DE IA (v196) — o julgamento de um clique ════════════════════════
   Namespace próprio (.aval-*), como o .brief-* fez — que é a tela mais limpa das
   recentes: 1,8 style= por 100 linhas justamente porque tudo mora aqui. Nada de
   .tbl/.tabs/.tab, que são as classes órfãs que a revisão de 26/07 achou.

   O DESENHO É DELIBERADAMENTE APAGADO. Este bloco aparece embaixo de TODA resposta
   de IA do sistema; se ele chamasse atenção, competiria com a resposta e viraria
   ruído em dez telas ao mesmo tempo. Cinza fino, sem borda, sem fundo — só ganha
   cor DEPOIS de clicado, que é quando a pessoa precisa de confirmação de que o
   clique valeu. Um formulário aqui mataria a coleta; um alerta também. */
.aval { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:8px; font-size:12px; color:var(--muted); }
.aval-rot { margin-right:2px; }
.aval-b {
  border:1px solid transparent; background:transparent; color:var(--muted);
  font:inherit; font-size:12px; line-height:1; padding:4px 8px;
  border-radius:var(--r-pill); cursor:pointer; transition:background .12s, color .12s, border-color .12s;
}
.aval-b:hover { background:var(--papel); border-color:var(--borda); color:var(--corpo); }
.aval-b:focus-visible { outline:2px solid var(--azul); outline-offset:1px; }
.aval-b[disabled] { opacity:.5; cursor:default; }
/* estados escolhidos: verde/vermelho/âmbar nas cores que o sistema já usa para
   bom, ruim e "atenção" (BRIEF_SEV em admin.js) — não uma paleta nova. */
.aval-b.on { border-color:currentColor; font-weight:600; }
.aval-b.on[data-v="bom"]       { color:#2b8a3e; background:rgba(43,138,62,.08); }
.aval-b.on[data-v="ruim"]      { color:#c0392b; background:rgba(192,57,43,.08); }
.aval-b.on[data-v="reescrevi"] { color:#c47f17; background:rgba(196,127,23,.10); }
.aval-eco { color:var(--teal-texto); font-weight:600; }

/* ── a TELA de avaliação (IA & Atendimento › Avaliação de IA) ───────────────── */
/* duas naturezas de medida, duas cores de cabeçalho: quem lê a tabela precisa ver
   de longe onde acaba o que a máquina mediu e começa o que gente julgou. */
.aval-tab th.aval-maq { background:rgba(58,91,169,.07); }
.aval-tab th.aval-hum { background:rgba(87,190,182,.14); }
.aval-tab td.aval-hum { background:rgba(87,190,182,.05); }
.aval-legenda { display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--muted); margin:8px 0 0; }
.aval-legenda b { color:var(--corpo); }
.aval-chip { display:inline-block; padding:1px 7px; border-radius:var(--r-pill); font-size:11px; font-weight:600; }
.aval-chip-ok   { background:rgba(43,138,62,.12);  color:#2b8a3e; }
.aval-chip-nao  { background:rgba(192,57,43,.12);  color:#c0392b; }
.aval-chip-re   { background:rgba(196,127,23,.14); color:#c47f17; }
.aval-chip-frio { background:var(--papel); color:var(--muted); }
/* barra de cobertura: quanto do que a IA respondeu chegou a ser julgado. É a
   métrica que decide se o resto da tela vale alguma coisa, por isso é a maior. */
.aval-cob { height:8px; border-radius:var(--r-pill); background:var(--borda); overflow:hidden; margin-top:6px; }
.aval-cob i { display:block; height:100%; background:var(--grad); }
.aval-vazio { color:var(--muted); font-size:13px; margin:8px 0; }
.aval-saida { white-space:pre-wrap; word-break:break-word; font-size:12.5px; background:var(--papel); border:1px solid var(--borda); border-radius:var(--r-sm); padding:8px 10px; margin:6px 0 0; max-height:220px; overflow:auto; }

/* ══ CONCILIAÇÃO BANCÁRIA (Financeiro › Conciliação) ══════════════════════════
   Namespace PRÓPRIO, .conc-*, e não emprestado de outra tela. A revisão de 26/07
   mediu o custo do contrário: `trafficai_rastreio` usa 8 classes .atrib-* que
   pertencem à Atribuição, então mexer no visual de uma muda o da outra sem aviso.
   Aqui nada é reaproveitado por fora do que é de casa mesmo (.dash-card, .leads,
   .table-wrap, .news-tabs, .btn*, .cell-emp/.cell-sub, .muted, .dash-empty).

   As cores vêm das variáveis REAIS do :root (--borda, --papel, --muted, --quente,
   --morno, --teal-texto). Nada de --border/--primary/--card: são apelidos criados
   depois justamente porque 51 usos caíam no literal de fallback e paravam de
   acompanhar o tema. Código novo usa o nome de verdade. */

/* faixa de números do topo — o resumo antes de qualquer lista */
.conc-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 14px}
.conc-stat{background:var(--branco);border:1px solid var(--borda);border-radius:var(--r-md);padding:10px 12px;border-top:3px solid var(--c,var(--azul))}
.conc-stat-l{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:3px}
.conc-stat b{display:block;font-size:19px;font-family:var(--display);color:var(--titulo);line-height:1.25}
.conc-stat .cell-sub{display:block;margin-top:2px}
.conc-stat.perigo{--c:var(--quente)} .conc-stat.perigo b{color:var(--quente)}
.conc-stat.atencao{--c:var(--morno)} .conc-stat.atencao b{color:var(--morno-txt)}
.conc-stat.bom{--c:var(--teal-texto)} .conc-stat.bom b{color:var(--teal-texto)}

/* barra de filtros (conta + período + janela) */
.conc-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px}
.conc-toolbar label{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.conc-toolbar .in,.conc-toolbar .select{max-width:200px}
.conc-toolbar .conc-espaco{flex:1 1 auto}

/* bloco de lista com título próprio — cada uma das listas que sobram */
.conc-bloco{margin:0 0 16px}
.conc-bloco>h3{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 4px}
.conc-bloco>p.conc-legenda{margin:0 0 10px;font-size:13px;color:var(--muted);line-height:1.5}
.conc-bloco.perigo{border-left:4px solid var(--quente)}
.conc-bloco.atencao{border-left:4px solid var(--morno)}
.conc-bloco.calmo{border-left:4px solid var(--borda)}

/* etiqueta de estado numa linha (entrada/saída, automático/manual…) */
.conc-tag{display:inline-block;padding:1px 8px;border-radius:var(--r-pill);font-size:11px;font-weight:600;
  background:var(--papel);color:var(--muted);border:1px solid var(--borda);white-space:nowrap}
.conc-tag.entrada{color:var(--teal-texto);border-color:#bfe3df;background:#eefaf8}
.conc-tag.saida{color:var(--quente);border-color:#f6cfc3;background:#fdf1ed}
.conc-tag.auto{color:var(--azul);border-color:#ccd6f0;background:#eef2fb}
.conc-tag.manual{color:var(--morno-txt);border-color:#f0dfb4;background:#fdf7e8}

/* o "por que não casou" / "por que casou" — texto secundário que é o produto */
.conc-porque{display:block;margin-top:2px;font-size:12px;color:var(--muted);line-height:1.45}

/* candidatos de uma linha ambígua: a escolha humana, aberta na própria linha */
.conc-cands{margin:6px 0 2px;padding:8px 10px;background:var(--papel);border:1px solid var(--borda);border-radius:var(--r-sm)}
.conc-cand{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:5px 0;border-bottom:1px solid var(--borda)}
.conc-cand:last-child{border-bottom:0}
.conc-cand-txt{flex:1 1 240px;font-size:13px;line-height:1.4}
.conc-cand-sc{font-size:11px;color:var(--muted);white-space:nowrap}

/* área de importação (arquivo + prévia) */
.conc-drop{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.conc-drop .in{max-width:340px}
.conc-previa-avisos{margin:0 0 12px;padding-left:18px;line-height:1.75;font-size:13px;color:var(--muted)}
.conc-conflito{margin:0 0 12px;padding:10px 12px;border-radius:var(--r-sm);
  background:#fdf1ed;border:1px solid #f6cfc3;color:#8c3417;font-size:13.5px;line-height:1.5}
.conc-acoes{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}

/* a tabela é a .leads da casa; só o alinhamento do dinheiro é próprio */
.conc-val{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.conc-val.entrada{color:var(--teal-texto)}
.conc-val.saida{color:var(--quente)}

/* ── Tabela dentro de cartão: uma moldura, não duas ───────────────────────
   Com .tbl ganhando as regras de .leads, toda tabela que estava enfiada num
   .dash-card passou a ter borda + sombra + raio DENTRO de outra borda +
   sombra + raio. Corrigir os cinco lugares que fazem esse aninhamento não
   impede o sexto; a regra impede. Vale para .leads também, que sempre teve o
   mesmo problema onde alguém aninhou. */
.dash-card>.leads,.dash-card>.tbl,
.dash-card>.table-wrap>.leads,.dash-card>.table-wrap>.tbl,
.dash-card>.tbl-wrap>.leads,.dash-card>.tbl-wrap>.tbl{border:0;border-radius:0;box-shadow:none}

/* ── Fadiga de criativo ───────────────────────────────────────────────────
   A tela tinha 18,5 style= por 100 linhas e nenhuma classe própria: `grep -c
   '\.fad' admin.css` dava ZERO. Estas quatro (só quatro) tiram do JS o que
   se repetia em toda peça cansada. O resto virou classe da casa: .tai-stats
   para os KPIs, .tai-grupo para as barras de botão, .sev-* para severidade. */
.fad-lista{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}
.fad-card-topo{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline}
/* o dinheiro perdido é o número que decide a troca da peça: corpo 20, na cor
   da severidade (que vem da classe .sev-alta, não de um literal no JS) */
.fad-dinheiro{font-size:20px;color:var(--c,var(--titulo))}
.fad-amarrar{margin-top:10px;padding:10px;border:1px dashed var(--borda);border-radius:var(--r-sm);background:var(--papel)}

/* ── Saúde do rastreamento ────────────────────────────────────────────────
   A tela vestia atrib-card/atrib-cards/atrib-k/atrib-l/atrib-s/atrib-top/
   atrib-filtros/atrib-acoes — 30 regras que pertencem à tela de Atribuição.
   Mexer no visual de uma mudava o da outra sem aviso. Os KPIs foram para as
   classes da casa (.tai-stats/.tai-stat); sobrou o que é mesmo próprio daqui:
   o cartão do achado e os dois blocos de texto dele.
   (.brief-omit e .brief-quando continuam vindo do briefing: aquele
   compartilhamento é deliberado e está documentado lá em cima.) */
.rs-achado{margin-bottom:14px}
/* "O que fazer" é a única parte acionável do achado — destaque em teal suave */
.rs-fazer{background:rgba(87,190,182,.10);border-radius:9px;padding:10px 12px;font-size:13.5px;line-height:1.5}
.rs-fatos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-bottom:12px}
.rs-fatos>div>b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.rs-fatos>div>div{font-size:13px;line-height:1.45;margin-top:2px}

/* ── BASE B2B · CNPJ (v193) ───────────────────────────────────────────────────
   Namespace próprio, como .brief-* — a tela não inventa classe sem regra nem
   sequestra o namespace de outra. As cores de situação saem das variáveis de tema
   que EXISTEM (--quente, --morno, --teal, --muted): as telas das ondas anteriores
   escreveram var(--border), var(--primary) e var(--card), que não estão definidas
   em canto nenhum deste arquivo e sempre caem no literal de reserva — ou seja,
   não acompanham a troca de tema. */
.b2b-sit{display:inline-block;padding:2px 9px;border-radius:var(--r-pill);font-size:11.5px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.b2b-sit.ativa{background:rgba(87,190,182,.16);color:#1d7d75}
.b2b-sit.alta{background:rgba(216,146,15,.16);color:#8a5c00}
.b2b-sit.critica{background:rgba(232,85,45,.14);color:#b23c17}
.b2b-sit.vazia{background:var(--papel);color:var(--muted)}

/* grade de filtros da segmentação: é o que transforma a base em "clínicas de
   odontologia de médio porte em SP" — e por isso ela precisa caber na tela toda,
   não virar uma barra que rola de lado. */
.b2b-filtros{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:14px}
.b2b-filtros label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--corpo)}
.b2b-filtros .select,.b2b-filtros .in{width:100%}
.b2b-acoes{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}

/* barra de progresso do lote. O lote é lento DE PROPÓSITO (pausa entre chamadas
   para não sobrecarregar uma API pública e gratuita); sem barra, "lento de
   propósito" é indistinguível de "travou". */
.b2b-prog{height:8px;border-radius:var(--r-pill);background:var(--papel);border:1px solid var(--borda);overflow:hidden;margin:10px 0 6px}
.b2b-prog i{display:block;height:100%;background:var(--teal);transition:width .25s}
.b2b-prog-txt{font-size:12.5px;color:var(--muted)}

/* linha de PROPOSTA (contato solto → empresa). Nunca é ação automática: cada
   linha tem a sua caixa, e a caixa nasce marcada só quando a sugestão é ligar em
   empresa que JÁ existe com o mesmo CNPJ. */
.b2b-prop{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--borda);border-radius:var(--r-md);background:var(--branco);margin-bottom:6px}
.b2b-prop-info{flex:1;min-width:0}
.b2b-prop-info b{display:block;font-size:13.5px;color:var(--titulo)}
.b2b-prop-alvo{font-size:12.5px;color:var(--corpo);white-space:nowrap}

/* nota explicativa: por que este número é este número. A regra da casa é não
   mostrar contagem sem dizer de onde ela vem. */
.b2b-nota{font-size:12.5px;color:var(--muted);line-height:1.5;margin:0 0 12px}
.b2b-dup{font-size:12.5px;color:#b23c17}

/* (o bloco escuro da Base B2B saiu pelo mesmo motivo — ver a nota do briefing) */

/* ── Rodadas de aprovação do cliente (v193) ─────────────────────────────────
   O fio da negociação de uma peça: cada ida ao cliente e o que voltou dela.
   Vive no editor da publicação e na aba Aprovações. */
.rod-n{display:inline-block;background:#eef2fb;color:var(--azul-esc);font-weight:700;font-size:11px;padding:2px 8px;border-radius:var(--r-pill);vertical-align:middle}
.rod-alerta{color:#c0392b}
/* linha da fila cujo prazo estourou — fundo tênue, sem virar semáforo de natal */
.leads tr.rod-atrasada>td{background:#fdf3f2}
.rod-fio{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.rod-item{border-left:3px solid var(--borda);padding:6px 0 6px 10px}
.rod-item-abre{border-left-color:var(--morno);background:#fffdf6}
.rod-item-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px}
.rod-tag{display:inline-block;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:var(--r-pill);background:#eef1f7;color:var(--muted)}
.rod-tag-ok{background:#e6f6ec;color:#1f8a4d}
.rod-tag-aj{background:#fdf1de;color:#a8720d}
.rod-tag-abre{background:#fdf1de;color:#a8720d}
.rod-mud{font-size:12.5px;color:#1f8a4d;font-weight:600;margin:3px 0 0}
.rod-coment{font-size:13px;margin:4px 0 0;white-space:pre-wrap;word-wrap:break-word;color:var(--corpo)}
/* ── .mk-kpis / .mk-kpi — a linha de números do topo das telas ────────────────
   ACHADO EM 26/07 (frente da Avaliação de IA): estas duas classes eram usadas em
   DEZ telas (Analytics, Captação, Custos de IA, Marketing…) e NÃO TINHAM UMA
   REGRA SEQUER — nem aqui, nem em <style> injetado. Os números saíam como texto
   corrido, sem caixa e sem hierarquia. É a mesma falha silenciosa de .tbl e
   .tabs, e igualmente invisível: classe que não existe não reclama.
   Estrutura fixa nos dez lugares: <div class="mk-kpi"><b>valor</b><span>rótulo</span></div>.
   auto-fit + minmax: quebra sozinho no celular sem media query, e uma linha de
   6 KPIs não espreme cada um a 40px numa tela estreita. */
.mk-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--sp-3);
  margin: var(--sp-3) 0;
}
.mk-kpi {
  background: var(--branco);
  border: 1px solid var(--borda);
  border-radius: var(--r);
  padding: var(--sp-3) var(--sp-4);
  box-shadow: var(--sh-1);
  min-width: 0;                      /* deixa o texto longo encolher em vez de estourar a grade */
}
.mk-kpi b {
  display: block;
  font-family: var(--display);
  font-size: 22px;
  line-height: 1.15;
  color: var(--titulo);
  word-break: break-word;
}
.mk-kpi span {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted);
}

/* ── PRIMEIROS PASSOS (roteiro do primeiro uso, no Início) ──────────────────
   Card temporário POR CONSTRUÇÃO: some sozinho quando o último passo é feito
   (roteiroDesenharEm apaga o container). Por isso ele pode ser visualmente
   forte — não vai competir para sempre com o briefing que fica embaixo. */
.rot-card{border-left:4px solid var(--teal-texto)}
.rot-card h3{margin-bottom:8px}
.rot-cont{font-size:12px;font-weight:700;color:var(--teal-texto);background:#eaf6f5;border-radius:var(--r-pill);padding:3px 10px}
.rot-sub{font-size:13px;color:var(--muted);margin:0 0 14px;line-height:1.5;max-width:74ch}
.rot-barra{height:6px;border-radius:var(--r-pill);background:#eef1f6;overflow:hidden;margin:0 0 16px}
.rot-barra>span{display:block;height:100%;background:var(--grad);border-radius:var(--r-pill)}
.rot-lista{display:flex;flex-direction:column;gap:10px}
.rot-passo{display:grid;grid-template-columns:26px 1fr auto;gap:12px;align-items:start;padding:12px 14px;border:1px solid var(--borda);border-radius:var(--r-md);background:var(--papel)}
.rot-num{width:22px;height:22px;border-radius:50%;background:var(--grad);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:1px}
.rot-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.rot-txt b{font-size:14px;color:var(--titulo)}
.rot-porque{font-size:12.5px;color:var(--corpo);line-height:1.45}
.rot-estado{font-size:12px;color:var(--muted)}
.rot-passo .btn{align-self:center;white-space:nowrap}
.rot-feitos{font-size:12.5px;color:var(--muted);margin:14px 0 0;line-height:1.6}
.rot-feitos b{color:var(--teal-texto)}
.rot-feito-n{color:var(--muted);opacity:.85}
/* omissão NÃO é pendência: cor de aviso, nunca de erro, e sempre com o motivo */
.rot-omit{font-size:12.5px;color:var(--corpo);background:#fff8e8;border:1px solid #f0dfb6;border-radius:var(--r-sm);padding:10px 12px;margin:12px 0 0;line-height:1.5}
.rot-falhou{border-left-color:var(--morno)}
/* ── O CLIENTE DE EXEMPLO, dentro do cartão de Primeiros passos ────────────
   Bloco discreto DE PROPÓSITO: é um atalho para entender o sistema, não um
   passo. Se tivesse o mesmo peso visual dos passos, competiria com eles — e o
   que a pessoa precisa fazer é cadastrar o cliente DELA, não o de mentira.
   Cor de texto: --muted e --corpo, os tokens que passam em AA. Nunca hex de
   cinza cravado (a regra da casa), nem aqui nem em style= inline. */
.rot-exemplo{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  margin:14px 0 0;padding:12px 14px;border:1px dashed var(--borda);border-radius:var(--r-md);background:var(--papel)}
.rot-ex-txt{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1 1 320px}
.rot-ex-txt b{font-size:13px;color:var(--titulo)}
.rot-ex-txt span{font-size:12.5px;color:var(--muted);line-height:1.5}
/* plantado: borda contínua e na cor de aviso — dado de demonstração vivo na
   base é um estado que precisa se anunciar, não se esconder. */
.rot-exemplo-on{border-style:solid;border-color:var(--morno)}
.rot-ex-alerta{font-size:12.5px;color:var(--morno-txt);line-height:1.45}
.rot-exemplo .btn{white-space:nowrap}
@media (max-width:720px){ .rot-exemplo .btn{width:100%} }
@media (max-width:720px){
  .rot-passo{grid-template-columns:26px 1fr}
  .rot-passo .btn{grid-column:2;justify-self:start;margin-top:6px}
}

/* ═══════ "NÃO SEI" — a terceira resposta na tela (Onda 7) ══════════════════
   Cor de AVISO e nunca de erro: não saber não é defeito do sistema, é falta de
   cadastro — e pintar de vermelho ensina a equipe a ignorar. Também não pode ser
   discreto: um "—" cinza é lido como "nada por aqui", que é exatamente a leitura
   errada. Fica âmbar, com a palavra escrita e o motivo no title. */
.ns-vazio{display:inline-block;padding:1px 7px;border-radius:20px;font-size:11.5px;font-weight:700;background:#fef3c7;color:#92400e;border:1px dashed #d9a441;cursor:help;white-space:nowrap;letter-spacing:.1px}
.ns-marca{display:inline-block;margin-left:7px;padding:1px 6px;border-radius:20px;font-size:10.5px;font-weight:700;background:#fff8e8;color:#92400e;border:1px solid #f0dfb6;cursor:help;white-space:nowrap;vertical-align:middle}
.ns-sub{display:block;font-size:11px;font-weight:700;color:#92400e;margin-top:2px}
.ns-marca-nm{background:#fef3c7;border:1px dashed #d9a441;color:#92400e}
.agc-a-nosei{background:#fef3c7;color:#92400e;border:1px dashed #d9a441}
.agc-nosei{background:#fffdf6}
/* o rodapé que torna o "não sei" ACIONÁVEL: o que falta, por quê e onde ligar */
.ns-box{margin:16px 0 0;border:1px solid #f0dfb6;background:#fffdf6;border-radius:var(--r-md);padding:14px 16px}
.ns-box h4{margin:0 0 10px;font-size:14px;color:#7a4d09;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.ns-box h4 span{font-size:12px;font-weight:500;color:var(--muted)}
.ns-lista{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ns-item{border-left:3px solid #e6c67a;padding:2px 0 2px 11px}
.ns-item > b{font-size:13.5px;color:var(--titulo)}
.ns-tag{display:inline-block;margin-left:7px;padding:1px 7px;border-radius:20px;font-size:10.5px;font-weight:700;background:#eef2f7;color:#4b5563;vertical-align:middle}
.ns-tag-erro{background:#fee2e2;color:#991b1b}
.ns-motivo{font-size:12.5px;color:var(--corpo);line-height:1.5;margin-top:3px}
.ns-onde{font-size:12px;color:var(--muted);margin-top:3px}
.ns-onde b{color:var(--corpo)}
.ns-acesso{font-size:12.5px;color:var(--corpo);margin-top:12px;padding-top:10px;border-top:1px dashed #e6c67a}

/* ONDA 7 — tela do portao de saida: o veto precisa ser LIDO, nao piscado num toast */
.portao-lista{display:flex;flex-direction:column;gap:10px;max-height:46vh;overflow:auto}
.portao-item{border-left:3px solid #b02a37;background:#fdf3f4;border-radius:0 10px 10px 0;padding:10px 12px}
.portao-trecho{font-size:14.5px;color:#7a1d27;margin-bottom:6px}
.portao-porque,.portao-troca{font-size:13px;color:var(--corpo);line-height:1.5}
.portao-troca{margin-top:4px}

/* ── v202 · O PORTAO APARECE ────────────────────────────────────────────────
   CONTRASTE: nenhum cinza nem ambar cravado como cor de TEXTO. Os unicos dois
   tokens que passam em AA sao --muted e --morno-txt, e sao esses que estao
   aqui. Cor de FUNDO e de BORDA pode ser hex (nao carrega texto). */
.portao-topo{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:5px}
.portao-selo{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;
  padding:2px 7px;border-radius:999px;white-space:nowrap}
.portao-selo.veto{background:#fbe3e5;color:#7a1d27}
.portao-selo.erro{background:#fff3d9;color:var(--morno-txt)}
.portao-selo.aviso{background:#eef1f6;color:var(--muted)}
.portao-selo.ok{background:#e3f3e8;color:#1d6b36}
/* os dois desfechos que faltavam ao vocabulario dos selos (ver `portaoDesfecho`
   no admin.js): o crachá da lista de Qualidade usa ESTAS classes em vez de um
   hex em `--c`, que virava cor de texto e reprovava em AA. */
.portao-selo.trocado{background:#f6efe0;color:var(--morno-txt)}
.portao-selo.forcado{background:#efe8fd;color:#5b3bb0}
/* CONSERTO DO CETICO (v202): `.portao-onde` estava declarado DUAS vezes (aqui e
   no bloco da Onda 7 acima), com cores diferentes. Regra de mesmo nome nao da
   erro em CSS — a ultima vence calada, que e a mesma armadilha da funcao
   duplicada. A duplicata (color:#8a5a60, cinza-rosado cravado) foi removida. */
.portao-onde{font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-bottom:0}

/* a valvula fica FECHADA por padrao: quem veio corrigir o texto nao precisa
   tropecar num botao de furar a conferencia para chegar no motivo. */
.portao-liberar{margin-top:14px;border:1px solid var(--borda);border-radius:10px;padding:10px 12px;background:var(--papel)}
.portao-liberar>summary{cursor:pointer;font-weight:600;font-size:13.5px;color:var(--corpo)}
.portao-liberar textarea{width:100%;box-sizing:border-box}
.portao-semliberar{margin:14px 0 0;font-size:13px;line-height:1.55;color:var(--muted);
  border-left:3px solid var(--borda);padding-left:10px}
.portao-acoes{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:16px;flex-wrap:wrap}

/* a faixa do Estudio: apontamento que NAO barra. Fica ACIMA do texto gerado —
   depois de um artigo inteiro ninguem rola ate o fim para descobrir o veto. */
.portao-faixa{border-radius:12px;padding:12px 14px;margin:12px 0}
.portao-faixa.grave{background:#fdf3f4;border:1px solid #f0cdd2}
.portao-faixa.morna{background:#fffaf0;border:1px solid #f0deb0}
.portao-faixa-h{font-size:13.5px;line-height:1.55;color:var(--corpo);margin-bottom:8px}
.portao-faixa .portao-lista{max-height:none}

/* detalhe de uma conferencia (tela de Qualidade) */
.portao-bloco{margin-top:12px;font-size:13px;color:var(--corpo)}
.portao-bloco pre{white-space:pre-wrap;word-break:break-word;background:var(--papel);border:1px solid var(--borda);
  border-radius:10px;padding:10px 12px;margin:6px 0 0;font-family:inherit;font-size:13px;line-height:1.55;max-height:32vh;overflow:auto}
.portao-just{background:#f3eefc;border-left:3px solid #8b5cf6;border-radius:0 10px 10px 0;
  padding:9px 12px;margin-bottom:12px;font-size:13px;line-height:1.5;color:var(--corpo)}
.portao-revisao{margin-top:16px;border-top:1px solid var(--borda);padding-top:12px;font-size:13.5px;color:var(--corpo)}
.portao-revisao textarea{width:100%;box-sizing:border-box;margin-top:6px}

/* ── Credenciais de link (Administração › girar credencial ao portador) ──
   Sem cor de texto cravada: cinza vem de --muted (4,90:1) e o alerta de
   --morno-txt (5,79:1), os dois tokens que passam em AA neste painel. */
.cred-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--sp-3);margin:var(--sp-4) 0}
.cred-card{display:flex;flex-direction:column;gap:6px;text-align:left;background:var(--branco);border:1px solid var(--borda);
  border-radius:var(--r);padding:14px;cursor:pointer;font:inherit;color:var(--corpo);box-shadow:var(--sh-1);transition:box-shadow .15s,transform .15s}
.cred-card:hover{box-shadow:var(--sh-2);transform:translateY(-1px)}
.cred-card:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
.cred-card.cred-off{opacity:.55;cursor:not-allowed;transform:none;box-shadow:var(--sh-1)}
.cred-card-top{display:flex;flex-direction:column;gap:2px}
.cred-card-top b{font-size:14px}
.cred-card-n{font-size:20px;font-family:var(--display);line-height:1.1}
.cred-card-n .muted{font-size:14px;font-weight:600}
/* impressão do token: é HASH, não segredo — mas fica em mono para ninguém
   confundir com o link e tentar colar no navegador. */
.cred-imp{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;background:var(--papel);
  border:1px solid var(--borda);border-radius:6px;padding:1px 6px;color:var(--muted)}
.cred-novo{background:var(--papel);border:1px solid var(--borda);border-radius:var(--r-sm);padding:12px;word-break:break-all}
.cred-novo code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;color:var(--corpo)}
.cred-graca-row{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;padding:9px 0;border-bottom:1px solid var(--borda)}
.cred-graca-row:last-child{border-bottom:0}
.cred-graca-row>div:first-child{flex:1;min-width:180px}
.cred-graca-ate{font-size:12.5px;color:var(--morno-txt);font-weight:600}
@media (max-width:640px){.cred-grid{grid-template-columns:1fr}}

/* ── SELO "ISTO É EXEMPLO" ──────────────────────────────────────────────────
   O rótulo da linha marcada como exemplo/teste, nas listas que escolhem
   REEXIBIR o marcado (hoje: Leads com "Mostrar dados de exemplo").

   POR QUE ELE EXISTE. O padrão do sistema é ESCONDER o exemplo; nessas telas o
   aviso de cima ("N registros fora desta conta") basta. Mas a tela que decide
   mostrar precisa de outra coisa: sem selo, a linha encenada fica visualmente
   idêntica a uma real e a pessoa não tem como saber por que ela não entra em
   total nenhum. Marca que ninguém vê é marca que não existe — e marca visível
   sem rótulo é a mesma coisa, um passo adiante.

   COR: `--morno-txt` (5,79:1 no branco, token medido) sobre o mesmo par
   fundo/borda de `.dono-sel.dono-casa`, que já é o vocabulário desta folha para
   "atenção sem alarme". NENHUM cinza ou âmbar cravado como cor de TEXTO: é a
   regra da casa, e o âmbar puro (--morno) tem 2,6:1 e reprovaria. */
.tag-exemplo{display:inline-block;margin-left:var(--sp-2);padding:1px 7px;
  border-radius:var(--r-pill);font-size:11px;font-weight:700;line-height:1.5;
  white-space:nowrap;vertical-align:middle;
  color:var(--morno-txt);background:#fffaf0;border:1px solid #f0deb0}

/* ── Retrato do sistema (Administração) ───────────────────────────────────────
   Três colunas em grade que vira pilha no celular. NENHUM cinza nem âmbar
   cravado como cor de texto: --muted (4,90:1) e --morno-txt (5,79:1) são os
   tokens de AA da casa, e é deles que sai toda cor de texto secundário aqui.
   Fundo âmbar/verde/azul claro pode ser literal — é fundo, não texto. */
.rt-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.rt-num{background:var(--card);border:1px solid var(--borda);border-radius:var(--r-md);padding:12px 14px;box-shadow:var(--sh-1);display:flex;flex-direction:column;gap:2px}
.rt-num b{font-family:var(--display);font-size:24px;line-height:1;color:var(--azul)}
.rt-num span{font-size:11.5px;color:var(--muted);line-height:1.3}
.rt-num.rt-verde b{color:var(--teal-texto)}
.rt-num.rt-morno b{color:var(--morno-txt)}
.rt-num.rt-frio b{color:var(--frio)}
.rt-veredito{margin:14px 0 0;font-size:14px;color:var(--corpo);line-height:1.5}
.rt-veredito b{color:var(--titulo)}
.rt-aviso{margin-top:12px;background:#fff8e8;border:1px solid #f0deb0;border-radius:var(--r-md);
  padding:11px 13px;font-size:12.5px;line-height:1.5;color:var(--morno-txt)}
.rt-aviso b{color:var(--morno-txt)}
.rt-aviso .btn{margin-top:8px}

.rt-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--sp-4);margin-top:var(--sp-5);align-items:start}
.rt-col{background:var(--card);border:1px solid var(--borda);border-radius:var(--r);padding:14px 14px 8px;box-shadow:var(--sh-1);min-width:0}
.rt-col>h2{font-family:var(--display);font-size:14.5px;font-weight:700;color:var(--titulo);margin:0 0 4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rt-conta{font-size:11px;font-weight:700;border-radius:var(--r-pill);padding:2px 9px;background:var(--papel);color:var(--muted);white-space:nowrap}
.rt-explica{font-size:11.5px;color:var(--muted);line-height:1.45;margin:0 0 10px}
.rt-nada{font-size:12px;color:var(--muted);margin:0 0 10px}
/* a cor mora na BORDA de cima da coluna, não no texto: assim as três se
   distinguem sem que nenhuma palavra perca contraste. */
.rt-cred{border-top:3px solid var(--frio)}
.rt-dado{border-top:3px solid var(--morno)}
.rt-pronta{border-top:3px solid var(--teal-texto)}

.rt-tela{display:flex;flex-direction:column;gap:2px;text-align:left;width:100%;background:none;border:0;
  border-top:1px solid var(--borda);border-radius:0;padding:9px 4px;cursor:pointer;font-family:inherit;transition:background .12s}
.rt-tela:hover:not(:disabled){background:var(--papel)}
.rt-tela:disabled,.rt-bloq{cursor:default;opacity:.62}
.rt-t1{font-size:13px;font-weight:600;color:var(--titulo);line-height:1.3}
.rt-t2{font-size:11px;color:var(--muted)}
.rt-t3{font-size:11.5px;color:var(--corpo);line-height:1.5;margin-top:3px;display:block}
.rt-t3 b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:var(--corpo)}
.rt-caminho{display:block;margin-top:3px;color:var(--teal-texto);font-weight:600}
.rt-so-exemplo{display:block;margin-top:3px;color:var(--morno-txt);font-weight:600}
.rt-desconto{color:var(--muted)}
.rt-tag{font-size:10.5px;font-weight:700;color:var(--muted)}

/* o cartão de UMA credencial. Classe própria (`rt-credcard`) e não `rt-cred`
   porque `rt-cred` já é a COLUNA — dois seletores com o mesmo nome e escopos
   diferentes é o tipo de colisão que só aparece meses depois. */
.rt-credcard{border-top:1px solid var(--borda);padding-top:10px}
.rt-credcard+.rt-credcard{margin-top:10px}
.rt-cred-cab{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--titulo)}
.rt-cred-onde{font-size:11.5px;color:var(--corpo);line-height:1.45;margin-top:3px}
.rt-cred-envs{font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.6}
.rt-cred-envs code{background:var(--papel);border-radius:5px;padding:1px 6px;font-size:10.5px;color:var(--corpo)}
.rt-cred-telas{font-size:11.5px;color:var(--muted);margin-top:5px;line-height:1.45}
.rt-cred .btn{margin-top:8px}

.rt-rodape{margin-top:var(--sp-4)}
.rt-lista{font-size:12px;color:var(--corpo);line-height:1.6;margin:0;padding-left:18px}
.rt-lista code{background:var(--papel);border-radius:5px;padding:1px 6px;font-size:10.5px}
.rt-atalhos{display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:640px){
  .rt-cols{grid-template-columns:1fr}
}

/* ══════════════════════════════════════════════════════════════════════════════
   TRÁFEGO · O ESPELHO DAS PLATAFORMAS (view trafficai_espelho)
   ══════════════════════════════════════════════════════════════════════════════
   REGRA DE COR DESTA CASA, aplicada aqui: NENHUM hex de cinza ou de âmbar é usado
   como COR DE TEXTO. Os únicos textos coloridos desta tela são (a) o chip
   `.tai-badge`, que já é da casa e escurece o próprio `--c` sobre um fundo em 14%,
   e (b) `.esp-txt-morno`, que é o token `--morno-txt` (#8a5c00, 5,59:1 medido) e
   existe porque `--morno` puro tem 2,6:1 e reprova até como texto grande.
   Todo o resto é `--corpo` ou `--muted`, os dois aprovados em AA nesta folha.

   Fundos claros (#f0f9f2, #fffaf0, #fdf2f3) são os mesmos já usados por
   `.tai-meta-banner` — vocabulário existente, não paleta nova. */

/* a faixa de frescor: a primeira coisa da tela, porque a hora vem antes do número */
.esp-faixa{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;border:1px solid var(--borda);border-radius:var(--r);padding:12px 14px;margin-bottom:14px;background:#fff}
/* MEDIDO a 375px na passada de navegador: sem o `min-width:0` o texto do meio
   nao encolhia e empurrava o botao para FORA da tela (a pagina ficava com 451px
   de largura numa viewport de 375). O `flex-wrap` acima manda o botao para a
   linha de baixo em vez de estourar a caixa. */
.esp-faixa>div{min-width:0;flex:1 1 220px}
.esp-faixa.is-fresco{background:#f0f9f2;border-color:#c3e6cd}
.esp-faixa.is-morno{background:#fffaf0;border-color:#f0dcae}
.esp-faixa.is-velho,.esp-faixa.is-nunca{background:#fdf2f3;border-color:#f0c9ce}
.esp-faixa.is-nunca{background:#f7f8fa;border-color:var(--borda)}
.esp-faixa-dot{width:9px;height:9px;border-radius:50%;flex:none;margin-top:5px;background:var(--c,var(--muted))}
.esp-faixa-sub{display:block;margin-top:2px}
.esp-faixa-btn{margin-left:auto;flex:none;align-self:center}
/* o ÚNICO texto em âmbar da tela, e só pelo token aprovado em AA */
.esp-txt-morno{color:var(--morno-txt)}

/* ── as diferenças ────────────────────────────────────────────────────────── */
.esp-h3-sub{font-weight:400;font-size:12px}
.esp-difs{display:grid;gap:10px}
.esp-dif{border:1px solid var(--borda);border-radius:var(--r-md);padding:12px 14px;background:#fff}
/* a barra da esquerda é o que separa "decida isto" de "só para saber" sem
   precisar de uma palavra a mais no cartão */
.esp-dif.is-grave{border-left:3px solid var(--erro-txt)}
.esp-dif-cab{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.esp-dif-meta{display:block;margin-top:1px}
.esp-nota{margin:6px 0 0}
.esp-acoes{margin-top:10px}
/* os dois (ou três) valores lado a lado: é o miolo da tela. Em telas estreitas
   viram uma coluna só — empilhado ainda é comparável, cortado não é. */
.esp-lados{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-top:10px}
.esp-lado{border:1px solid var(--borda);border-radius:var(--r-sm);padding:8px 10px;background:var(--papel);min-width:0}
.esp-lado-t{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600}
.esp-lado-v{font-size:15px;font-weight:600;color:var(--corpo);margin-top:2px;overflow-wrap:anywhere}
.esp-lado-q{font-size:11.5px;color:var(--muted);margin-top:2px}
.esp-infos{margin-top:10px}
.esp-infos>summary{cursor:pointer;font-size:13px;color:var(--muted);padding:6px 0}

/* ── a árvore ─────────────────────────────────────────────────────────────── */
.esp-arv{margin-top:14px}
.esp-sum-card{cursor:pointer;font-weight:600;color:var(--corpo)}
.esp-conta{border:1px solid var(--borda);border-radius:var(--r-md);margin-top:10px;background:#fff;overflow:hidden}
.esp-conta>summary,.esp-camp>summary{display:flex;gap:8px;align-items:center;flex-wrap:wrap;cursor:pointer;padding:10px 12px;list-style:none}
.esp-conta>summary{background:var(--papel);font-weight:600}
.esp-conta>summary::-webkit-details-marker,.esp-camp>summary::-webkit-details-marker{display:none}
.esp-conta>summary::before,.esp-camp>summary::before{content:'▸';color:var(--muted);flex:none;transition:transform .12s}
.esp-conta[open]>summary::before,.esp-camp[open]>summary::before{transform:rotate(90deg)}
.esp-conta-cli{padding:0 12px 8px}
.esp-camp{border-top:1px solid var(--borda)}
.esp-camp>summary{padding-left:26px}
.esp-camp-corpo{padding:0 14px 12px 34px}
.esp-conj{border-left:2px solid var(--borda);padding-left:10px;margin:8px 0}
.esp-no-linha{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:5px 0;font-size:13px;color:var(--corpo)}
.esp-anun{padding-left:16px}
/* ONDA 14 — a arvore passou a ter DOIS lados (lido da plataforma x montado aqui).
   `.esp-no-met` e a metrica do no, que so existe no lado espelhado; `.is-ausente`
   e a marca de "nao veio na ultima leitura" — a linha CONTINUA visivel, so fica
   apagada e com a barra vermelha, porque nada foi apagado do banco. */
.esp-no-met{margin-left:auto;font-variant-numeric:tabular-nums;white-space:nowrap}
.esp-no-linha.is-ausente,.esp-conj.is-ausente>.esp-no-linha{opacity:.62}
.esp-conj.is-ausente{border-left-color:var(--erro-txt)}
@media (max-width:640px){.esp-no-met{margin-left:0;width:100%}}
.esp-no-ico{flex:none;font-size:13px}
/* o nome encolhe antes de tudo: numa linha apertada é melhor cortar o nome do que
   empurrar o selo de status e a hora para fora da vista */
.esp-no-nome{font-weight:600;color:var(--corpo);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:min(52vw,420px)}
.esp-no-dir{margin-left:auto;font-size:12px;color:var(--muted);white-space:nowrap}
.esp-ext{background:var(--papel);border:1px solid var(--borda);border-radius:5px;padding:1px 6px;font-size:11px;color:var(--muted)}
.esp-quando{color:var(--c,var(--muted));font-weight:600}
.esp-erro{font-size:11.5px;color:var(--erro-txt);font-weight:600}
.esp-aviso-arv{background:#fffaf0;border:1px solid #f0dcae;border-radius:var(--r-sm);padding:7px 10px;margin:6px 0 8px}

/* ── o que este espelho ainda não sabe ────────────────────────────────────── */
.esp-limites{margin-top:14px;border:1px dashed var(--borda);border-radius:var(--r-md);padding:10px 14px;background:#fff}
.esp-limites>summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--corpo)}
.esp-limites ul{margin:8px 0 0;padding-left:18px;font-size:12.5px;color:var(--muted);line-height:1.6}

@media (max-width:640px){
  .esp-no-dir{margin-left:0;width:100%}
  .esp-faixa-btn{margin-left:0;width:100%}
  .esp-camp-corpo{padding-left:16px}
}

/* ── ONDA 14 · BARRA DE ABAS DE TELA (`abas` do MENU_ESTRUTURA) ───────────────
   Quatro itens de menu para uma coisa só (a campanha) viraram um item com abas.
   O visual é DE PROPÓSITO o mesmo da barra do News (.news-tabs): a casa já ensinou
   essa forma uma vez, e inventar um segundo desenho para o mesmo gesto obrigaria a
   pessoa a aprender duas linguagens para a mesma coisa. A diferença é só o que há
   por trás — no News cada aba é um painel; aqui cada aba é uma VIEW inteira. */
.view-abas{display:flex;gap:2px;border-bottom:1px solid var(--borda);margin-bottom:18px;overflow-x:auto;overflow-y:hidden}
.view-aba{display:flex;align-items:center;gap:6px;flex:none;background:transparent;border:none;
  border-bottom:2px solid transparent;padding:9px 14px;font:inherit;font-size:14px;line-height:1.2;
  white-space:nowrap;cursor:pointer;color:var(--muted);border-radius:var(--r) var(--r) 0 0}
.view-aba:hover{color:var(--corpo);background:var(--papel)}
/* ativo por COR + BORDA: cor sozinha não é sinal suficiente (mesma regra do News) */
.view-aba.on{color:var(--azul);border-bottom-color:var(--azul);font-weight:600;background:var(--branco)}
.view-aba:focus-visible{outline:2px solid var(--azul);outline-offset:-2px}

/* as mesmas abas, agora dentro do card da tela-mãe na capa do Tráfego: a aba deixou
   de ser item de menu e não podia deixar de ser porta na capa junto. Fica pequena e
   presa ao card para dizer que é PARTE daquela tela, não uma tela irmã. */
.mod-card-abas{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
.mod-card-aba{background:var(--papel);border:1px solid var(--borda);border-radius:999px;
  padding:3px 10px;font:inherit;font-size:12px;line-height:1.5;color:var(--muted);cursor:pointer}
.mod-card-aba:hover{color:var(--azul);border-color:var(--azul)}
.mod-card-aba:focus-visible{outline:2px solid var(--azul);outline-offset:2px}

@media (max-width:640px){
  .view-abas{margin-bottom:14px}
  .view-aba{padding:9px 10px;font-size:13px}
}

/* ══════════════════════════════════════════════════════════════════════════════
   ONDA 14 · CAMPANHAS — A ÁRVORE ÚNICA (uni-*)
   ══════════════════════════════════════════════════════════════════════════════
   Quase tudo aqui REUSA as classes do Espelho (.esp-conta, .esp-camp,
   .esp-no-linha, .esp-lados…): a árvore é a mesma árvore, só passou a caber os
   quatro assuntos. O que se acrescenta é o que não existia — a faixa de métrica
   por campanha e a distinção visual entre uma campanha que EXISTE lá fora e um
   rascunho que só existe aqui.
   ⚠ NENHUM HEX DE CINZA OU DE ÂMBAR COMO COR DE TEXTO. Os três tokens de texto
   desta folha (--cinza-txt 6,9:1 · --morno-txt 5,6:1 · --erro-txt 5,6:1 ·
   --verde-txt 7,0:1) já foram medidos no navegador; escolher um cinza no olho é
   exatamente como o Briefing foi parar em 2,54 de contraste. */
.uni-arv{margin-top:14px}
.uni-pills{margin:14px 0 4px}
.uni-pills .pill b{font-weight:700;margin-left:3px}
.uni-cabeca{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.uni-conx{font-size:12.5px}
.uni-linha-meta{margin:2px 0 8px}
.uni-acoes{margin-top:10px;flex-wrap:wrap}
/* a campanha que pede decisão ganha a MESMA marca vermelha à esquerda que o
   cartão de divergência já usava — o olho reconhece a mesma coisa nos dois
   níveis, sem precisar aprender um segundo código de cor. */
.uni-camp.uni-decidir>summary{border-left:3px solid var(--erro-txt)}
.uni-difs{margin:8px 0}
/* rascunho: fundo levemente distinto e sem faixa de métrica. A diferença tem de
   ser visível de relance (é rascunho × está no ar) sem tirá-lo da MESMA lista —
   para quem opera, são a mesma campanha em momentos diferentes. */
.uni-rasc>summary{background:color-mix(in srgb,var(--cinza-txt) 5%,transparent)}
.uni-met{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 4px}
.uni-met-c{flex:1 1 88px;min-width:88px;border:1px solid var(--borda);border-radius:var(--r-sm);padding:6px 9px;background:var(--papel)}
.uni-met-v{font-size:15px;font-weight:600;color:var(--corpo);line-height:1.2;overflow-wrap:anywhere}
.uni-met-r{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;margin-top:2px}
.esp-txt-verde{color:var(--verde-txt)}
.esp-txt-erro{color:var(--erro-txt)}
.esp-erro-linha{color:var(--erro-txt)}
@media (max-width:640px){
  .uni-met-c{flex:1 1 46%}
  .uni-cabeca{align-items:flex-start}
}

/* ══ ONDA 14 · INTEGRAÇÕES POR ABA ═══════════════════════════════════════════
   Toda cor de TEXTO aqui sai de token (--muted, --morno-txt, --erro-txt,
   --verde-txt, --cinza-txt). Nenhum hex de cinza ou âmbar cravado: os dois já
   viveram cravados em quatro lugares nesta base e passaram a discordar entre si
   (achado da Onda 10, repetido na 13). Fundo de chip pode ser cor sólida porque
   o texto em cima é branco — é a mesma regra do .stchip. */
.intga-tabs{flex-wrap:wrap;row-gap:2px}
.intga-cont{display:inline-block;min-width:18px;padding:0 6px;border-radius:999px;background:var(--papel);color:var(--cinza-txt);font-size:11px;font-weight:700;line-height:17px;text-align:center;border:1px solid var(--borda)}
.intga-cabec{margin:2px 0 12px}
.intga-cabec h3{margin:0 0 3px;font-size:19px}
.intga-resumo{margin:0;font-size:13.5px;color:var(--muted);line-height:1.5}
.intga-topo{border:1px solid var(--borda);border-radius:var(--r);padding:10px 13px;margin:0 0 12px;font-size:13.5px;line-height:1.55}
.intga-topo.is-bom{background:#f0fdf4;border-color:#bbf7d0;color:var(--verde-txt)}
.intga-topo.is-neutro{background:var(--papel);color:var(--cinza-txt)}
.intga-topo.is-ruim{background:#fef2f2;border-color:#fecaca;color:var(--erro-txt)}
.intga-alerta{background:#fffbeb;border:1px solid #fde68a;color:var(--morno-txt);border-radius:var(--r);padding:10px 13px;margin:0 0 12px;font-size:13px;line-height:1.6}
.intga-falhou{border:1px solid #fecaca;background:#fef2f2;color:var(--erro-txt);border-radius:var(--r);padding:16px 18px;font-size:14px;line-height:1.6}
.intga-falhou p{margin:6px 0}
.intga-sec{margin:20px 0 9px;font-size:14.5px;display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.intga-sec-sub{font-size:12.5px;font-weight:400;color:var(--muted)}
.intga-barra{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:0 0 14px}
.intga-cred .intga-falta{margin:0 0 8px;font-size:12.5px;color:var(--morno-txt)}
.intga-semcard{margin:8px 0 0;font-size:12.5px;color:var(--muted);line-height:1.55}
.intga-grupo{border:1px solid var(--borda);border-radius:var(--r);background:var(--branco);margin:0 0 12px;overflow:hidden}
.intga-grupo-cab{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:10px 14px;background:var(--papel);border-bottom:1px solid var(--borda);font-size:14px}
.intga-grupo-diz{font-size:12.5px;color:var(--muted);flex:1 1 240px}
.intga-linha{padding:11px 14px;border-bottom:1px solid var(--borda)}
.intga-linha:last-child{border-bottom:none}
.intga-linha-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.intga-nome{font-size:14px;word-break:break-word}
.intga-linha-sub{font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.55;word-break:break-word}
.intga-linha-sub.is-acao{color:var(--cinza-txt)}
.intga-linha-sub a{color:var(--azul,#3A5BA9)}
.intga-linha-sub code{font-size:11.5px;background:var(--papel);padding:1px 5px;border-radius:4px}
.intga-linha-acoes{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:7px}
.intga-sel{max-width:220px}
.intga-chip{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700;color:#fff;white-space:nowrap}
.intga-chip.is-bom{background:#16875a}
.intga-chip.is-morno{background:#8a5c00}
.intga-chip.is-ruim{background:#b02a37}
.intga-chip.is-neutro{background:#525a6c}
.intga-tag{display:inline-block;padding:1px 8px;border-radius:999px;font-size:11px;font-weight:600;background:var(--papel);color:var(--cinza-txt);border:1px solid var(--borda)}
.intga-tag.is-alerta{background:#fffbeb;color:var(--morno-txt);border-color:#fde68a}
.intga-ensina{border:1px dashed var(--borda);border-radius:var(--r);padding:14px 18px;margin:14px 0}
.intga-ensina.is-vazio{background:var(--papel)}
.intga-ensina h4{margin:0 0 8px;font-size:14.5px}
.intga-ensina ol{margin:0;padding-left:20px;font-size:13.5px;line-height:1.7;color:var(--corpo)}
.intga-ensina li{margin-bottom:5px}
.intga-multi{margin:12px 0;font-size:13px}
.intga-multi summary{cursor:pointer;font-weight:600;color:var(--morno-txt)}
.intga-multi ul{margin:8px 0 0;padding-left:20px;line-height:1.7;color:var(--muted)}
.intga-multi code{font-size:11.5px;background:var(--papel);padding:1px 5px;border-radius:4px}
.intga-maquina{margin:0;padding-left:20px;font-size:13px;line-height:1.8;color:var(--corpo)}
.intga-maquina code{font-size:12px;background:var(--papel);padding:1px 6px;border-radius:4px}
.intga-nota,.intga-rodape{margin-top:14px;line-height:1.6}
@media (max-width:720px){
  .intga-sel{max-width:100%;width:100%}
  .intga-linha-acoes{gap:6px}
}

/* ══ ONDA 19 · CONSTRUTOR DE SEÇÕES DO RELATÓRIO (ps*) ═══════════════════════
   A lista arrastável de seções do portal, dentro de ⚙️ Editar portal.
   NENHUMA COR CRAVADA: tudo sai dos tokens de :root. Os tokens de TEXTO
   (--verde-txt 7,0:1 · --morno-txt · --erro-txt 5,6:1 · --muted 4,9:1) existem
   exatamente porque o teal/âmbar puros reprovam no contraste como texto — ver a
   nota no :root. Foco visível vem da regra global de :focus-visible. */
.ps-resumo{display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:center;font-size:13px;color:var(--corpo);margin-bottom:var(--sp-2)}
.ps-resumo b{font-size:15px}
.ps-r-vazia{color:var(--morno-txt)}
.ps-r-erro{color:var(--erro-txt);font-weight:600}
.ps-ajuda{font-size:12.5px;color:var(--muted);margin:var(--sp-2) 0}
.ps-h{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:var(--sp-4) 0 var(--sp-2)}
.ps-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ps-nada{font-size:13px;color:var(--muted);padding:var(--sp-3);background:var(--papel);border-radius:var(--r-sm);margin:0}

.ps-item{display:flex;align-items:flex-start;gap:var(--sp-2);padding:10px 12px;border:1px solid var(--borda);
  border-radius:var(--r-md);background:var(--branco);cursor:default}
.ps-item:hover{background:var(--papel)}
/* a linha DESLIGADA não é "apagada": continua legível (o dono precisa ler o que
   ela mostra para decidir se põe). Só perde o destaque de fundo e a numeração. */
.ps-off{background:var(--papel);border-style:dashed}
.ps-arrastando{opacity:.45}
.ps-alca{cursor:grab;color:var(--muted);font-size:15px;line-height:1.5;user-select:none;flex:0 0 auto}
.ps-travada .ps-alca{cursor:not-allowed}
.ps-travada{cursor:default}
.ps-num{flex:0 0 20px;text-align:right;font-variant-numeric:tabular-nums;font-weight:700;color:var(--muted);font-size:12.5px;line-height:1.6}
.ps-txt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.ps-txt b{font-size:13.5px;color:var(--corpo)}
.ps-mostra{font-size:12px;color:var(--muted);line-height:1.45}
.ps-aviso{font-size:12px;color:var(--morno-txt);margin:2px 0 0;line-height:1.45}
.ps-aviso-erro{color:var(--erro-txt)}
.ps-aviso-fixa{color:var(--muted)}

/* a etiqueta de dado — três estados, três cores, e nenhuma delas é "0" */
.ps-dado{flex:0 0 auto;font-size:11.5px;font-weight:600;white-space:nowrap;align-self:center}
.ps-tem{color:var(--verde-txt)}
.ps-vazia{color:var(--muted)}
.ps-erro{color:var(--erro-txt)}

.ps-acts{flex:0 0 auto;display:flex;align-items:center;gap:4px;align-self:center}
/* ▲ ▼ são BOTÕES de verdade (Tab + Enter/Espaço), não enfeite: arrastar sem
   alternativa de teclado é a mesma falha do radiogroup sem teclado da Onda 18. */
.ps-mv{width:26px;height:26px;border:1px solid var(--borda);background:var(--branco);border-radius:var(--r-sm);
  color:var(--corpo);font-size:11px;line-height:1;cursor:pointer}
.ps-mv:hover:not(:disabled){background:var(--papel);border-color:var(--azul)}
.ps-mv:disabled{opacity:.35;cursor:not-allowed}

.ps-fixas{margin-top:var(--sp-4);padding:var(--sp-3);background:var(--papel);border-radius:var(--r-sm)}
.ps-fixas h4{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:0 0 var(--sp-2)}
.ps-fixa{display:flex;flex-direction:column;gap:2px}
.ps-fixa b{font-size:13px;color:var(--corpo)}

.ps-rodape{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-3);
  margin-top:var(--sp-4);padding-top:var(--sp-3);border-top:1px solid var(--borda)}
.ps-estado{font-size:12.5px;color:var(--muted)}
.ps-btns{display:flex;gap:var(--sp-2);flex-wrap:wrap}
/* região de anúncio para leitor de tela: existe, é lida, e não ocupa espaço.
   `clip` em vez de display:none — o que some do fluxo não é anunciado. */
.ps-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ⚠ CÉTICO O19-B · O AVISO DE PORTAL DE DEMONSTRAÇÃO.
   Quando contatos.portal_modelo está preenchido, a página que o visitante abre
   é a peça de venda inteira e NÃO é montada por estas seções — medido: gravar
   uma ordem nova não mudava um byte do que sai. A lista fica de leitura e este
   bloco diz por quê. Cor de texto por token (--morno-txt existe justamente
   porque o âmbar puro reprova no contraste como texto).                       */
.ps-modelo{display:flex;flex-direction:column;gap:4px;padding:var(--sp-3);margin-bottom:var(--sp-3);
  border:1px solid var(--borda);border-left:3px solid var(--morno-txt);border-radius:var(--r-sm);background:var(--papel)}
.ps-modelo b{font-size:13.5px;color:var(--corpo)}
.ps-modelo span{font-size:12px;color:var(--morno-txt);line-height:1.5}

@media (max-width:720px){
  .ps-item{flex-wrap:wrap}
  .ps-dado,.ps-acts{align-self:flex-start}
  .ps-txt{flex:1 1 100%;order:3}
}

/* == ONDA 20 - A LISTA VIROU DE PECAS (secao + grafico na mesma lista) ======
   O construtor deixou de ser "as secoes" e passou a ser "o relatorio": uma
   secao inteira e um cartao de KPI sao a mesma coisa - pecas ordenaveis.
   Isto pediu tres coisas novas na linha, e nenhuma cor crua: todas saem de
   token, pela mesma razao da Onda 17 (o contraste foi medido uma vez e mora
   no token; cravar #hex aqui recria a divergencia que os tokens curaram).   */

/* QUE TIPO DE PECA E. Sem esta etiqueta, "Leads captados" e "Paineis de
   marketing" ficam iguais na leitura - e nao sao: uma e um numero, a outra e
   um bloco inteiro de pagina. --cinza-txt tem 6,9:1 no branco. */
.ps-classe{font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:1px 7px;border-radius:var(--r-pill);border:1px solid var(--borda);
  color:var(--cinza-txt);background:var(--papel);white-space:nowrap;vertical-align:middle}
.ps-classe-bloco{color:var(--morno-txt);border-color:#f0deb0;background:#fffaf0}   /* 5,79:1 */

/* TAMANHO E MODELO - <select>, e nao alca de arrastar.
   O construtor de painel usava alcas (.pn-alca): boas com mouse, inexistentes
   no teclado. Esta tela prometeu teclado desde a Onda 19, e a Onda 18 ja foi
   pega prometendo teclado que nao existia. <select> entra no Tab, tem rotulo,
   funciona em leitor de tela - e largura e escolha entre 5 valores, nao um
   continuo. Perde-se o arraste fino; ganha-se que funciona para todo mundo. */
.ps-ctrl{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:6px}
.ps-ctrl:empty{display:none}
.ps-tam{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--cinza-txt)}
.ps-tam-l{font-weight:600}
.ps-tam select{font:inherit;font-size:11.5px;color:var(--corpo);background:var(--branco);
  border:1px solid var(--borda);border-radius:var(--r-sm);padding:2px 6px;min-height:26px}
/* foco VISIVEL: a lista e operada por teclado, e o contorno padrao do sistema
   some sobre o fundo claro em alguns navegadores. */
.ps-tam select:focus-visible{outline:2px solid var(--frio,#3A5BA9);outline-offset:1px}

/* OS GRUPOS DA LISTA "fora do relatorio".
   Sao 40 pecas no catalogo. Corrida, a lista dos desligados e uma parede em
   que o dono nao acha o que procura - agrupar pelo grupo que o proprio
   catalogo declara e o que transforma inventario em menu. */
.ps-grupo{margin-bottom:var(--sp-3)}
.ps-grupo-h{margin:var(--sp-2) 0 6px;font-size:11.5px;font-weight:700;letter-spacing:.03em;
  text-transform:uppercase;color:var(--cinza-txt)}
.ps-grupo-h span{font-weight:600;color:var(--muted);text-transform:none;letter-spacing:0}
.ps-r-tipo{color:var(--cinza-txt)}

@media (max-width:720px){
  /* no celular a linha ja quebra; os controles descem para baixo do texto e
     ocupam a largura toda, senao os dois <select> ficam espremidos. */
  .ps-ctrl{width:100%}
  .ps-tam{flex:1 1 44%}
  .ps-tam select{flex:1 1 auto;min-width:0}
}

/* ══ ONDA 22 · A COLUNA ÚNICA DA PROPOSTA ═══════════════════════════════════════
   Uma superfície, duas entidades. O prefixo é `uf-` porque ele estava LIVRE:
   medido antes de escrever uma linha — 0 ocorrências em admin.js, admin.css e
   src/blocos.js.
   ⚠ NÃO REUSAR `pb-`: `.pb-card` tem DUAS regras com donos diferentes
   (L386 playbooks · L2238 blocos) e TRÊS telas a emitem (cartão de WhatsApp,
   playbook de subserviço, e — até esta onda — o bloco da proposta). Regra nova
   ali repinta telas que ninguém vai abrir para conferir.
   ⚠ CONTRASTE: todo texto novo sai de `--muted` (4,85:1 sobre #fbfcfe) ou
   `--teal-texto` (5,01:1 em repouso, 4,83:1 no fundo do drop-over). O `--teal`
   NÃO é usado como cor de traço: 2,09:1 sobre #f0faf8, e `--borda` dá 1,20:1 —
   a borda de repouso do motor antigo era literalmente invisível. Os controles
   antigos que esta onda aposentou reprovavam: ⠿ 1,67:1 e ◀▶ 3,01:1. Não se
   copia o que já nasceu vermelho. */
.uf-col{display:flex;flex-direction:column}

/* ── peça FIXA do documento: existe na página, não aceita nada ── */
.uf-fixa{border-left:3px solid var(--borda);padding:6px 0 6px 12px;margin:3px 0}
.uf-fixa-r{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.uf-nota{font-size:12px;line-height:1.5;color:var(--muted);margin:5px 0 0;max-width:64ch}
.uf-fixa-crono #pCrono{margin-top:6px}

/* ── cabeçalho de fase: é um IRMÃO das faixas, nunca uma caixa que as envolve.
     Alvo dentro de alvo acende dois e dispara dois drops — medido. ── */
.uf-cab-fase{display:flex;align-items:center;gap:9px;flex-wrap:wrap;border-left:3px solid var(--teal-texto);background:var(--papel);border-radius:0 10px 10px 0;padding:8px 12px;margin:8px 0 3px}
.uf-cab-fase .uf-nota{flex:1 0 100%;margin-top:2px}

/* ── FAIXA: o alvo de soltar ── */
.uf-faixa{border:1.5px dashed var(--teal-texto);border-radius:12px;padding:8px 11px 7px;margin:4px 0;background:#fbfcfe}
.uf-faixa.uf-tem-fase{margin-left:15px;position:relative}
/* o filete da fase agrupa sem envolver — é um ::before, não um contêiner */
.uf-faixa.uf-tem-fase::before{content:"";position:absolute;left:-15px;top:0;bottom:0;width:3px;border-radius:2px;background:var(--teal-texto)}
.uf-faixa.drop-over{border-style:solid;background:#f0faf8;box-shadow:0 0 0 2px rgba(31,122,114,.35)}
.uf-faixa-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:5px}
.uf-faixa-r{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--teal-texto)}
/* a espécie que a faixa aceita, dita por ESCRITO e não só por cor */
.uf-faixa-e{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);border:1px solid var(--borda);border-radius:20px;padding:1px 8px;background:#fff}
.uf-faixa-n{margin-left:auto;font-size:11px;font-weight:600;color:var(--muted)}
.uf-faixa-b{min-height:6px}
.uf-vazia{font-size:12px;color:var(--muted);margin:0;padding:7px 0 5px}
.uf-faixa-f{margin-top:5px}

/* ── OS CONTROLES: os MESMOS três para serviço e para bloco ──
     É onde "o teclado move as duas coisas" deixa de ser promessa. Antes eram
     ◀▶ (que atravessavam fase) num, ↑↓ + dois <select> (que reordenavam dentro
     do grupo) no outro — dois vocabulários na mesma tela. ── */
.uf-ctrl{display:inline-flex;align-items:center;gap:3px;flex-wrap:wrap}
.uf-grip{cursor:grab;background:transparent;border:1px solid transparent;border-radius:7px;color:var(--muted);font-size:14px;line-height:1;padding:3px 6px;min-width:28px;min-height:28px;font-family:inherit}
.uf-grip:active{cursor:grabbing}
.uf-grip:hover{background:#eef2fb;color:var(--azul);border-color:var(--borda)}
.uf-grip:focus-visible{outline:2px solid var(--teal-texto);outline-offset:1px;color:var(--azul)}
.uf-mv{background:transparent;border:1px solid transparent;border-radius:7px;color:var(--muted);cursor:pointer;font-size:12px;line-height:1;min-width:28px;min-height:28px;font-family:inherit}
.uf-mv:hover:not(:disabled){color:var(--azul);background:#eef2fb;border-color:var(--borda)}
.uf-mv:focus-visible{outline:2px solid var(--teal-texto);outline-offset:1px;color:var(--azul)}
.uf-mv:disabled{opacity:.4;cursor:default}
.uf-para{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.uf-para-sel{font-family:var(--corpo-f);font-size:12px;font-weight:600;color:var(--titulo);border:1px solid var(--borda);border-radius:8px;padding:3px 6px;background:#fff;cursor:pointer;max-width:215px}
.uf-para-sel:focus{outline:2px solid var(--teal-texto);border-color:var(--teal-texto)}

/* ── os cartões ── */
.uf-cartao{border:1px solid var(--borda);border-radius:10px;background:#fff;margin-bottom:7px}
.uf-cartao:last-child{margin-bottom:2px}
.uf-cartao.dragging{opacity:.45}
.uf-serv{padding:8px 10px}
.uf-serv-campos{display:grid;grid-template-columns:1fr 86px 76px 80px 24px;gap:7px;align-items:center;margin-top:7px}
.uf-serv .pi-desc{margin-top:6px}
/* o bloco reusa .lpb-card do construtor de landing pages — mesmo motor, mesma
   cara, e é `blcCorpo` que desenha o miolo nos DOIS construtores */
.uf-bloco{padding:0;overflow:hidden}
.uf-bloco .lpb-card-t{flex-wrap:wrap;gap:6px}

/* ── inserir: a faixa É a âncora, então o botão mora nela ── */
.uf-add{background:transparent;border:1px dashed var(--borda);border-radius:8px;color:var(--teal-texto);font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;padding:5px 10px;min-height:28px}
.uf-add:hover{border-color:var(--teal-texto);background:#f0faf8}
.uf-add:focus-visible{outline:2px solid var(--teal-texto);outline-offset:1px}
.uf-pal{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px;padding-top:8px;border-top:1px dashed var(--borda)}
.uf-linha-add{margin:10px 0 4px}
.uf-fase-add{width:100%;justify-content:center}

@media(max-width:760px){
  .uf-serv-campos{grid-template-columns:1fr 1fr;gap:6px}
  .uf-para-sel{max-width:150px}
  .uf-faixa.uf-tem-fase{margin-left:9px}
  .uf-faixa.uf-tem-fase::before{left:-9px}
}


/* ── Aba "Agentes e Conhecimento" (fusão agente+conhecimento) ──────────────
   Cabeçalho de categoria: separa blocos sem virar mais um card. A linha fina
   embaixo faz o trabalho que uma caixa faria, com menos peso visual. */
.ag-cat-h{display:flex;align-items:baseline;gap:10px;margin:26px 0 2px;padding-bottom:7px;border-bottom:1px solid var(--borda)}
.ag-cat-h:first-of-type{margin-top:6px}
.ag-cat-nome{font-size:14px;font-weight:700;color:var(--titulo);letter-spacing:.01em}
.ag-cat-cont{font-size:12px;color:var(--cinza-txt);font-variant-numeric:tabular-nums}
/* ⚠ o vazio precisa ser VISÍVEL na varredura, não só legível: faixa à esquerda
   + rótulo. Sem isso, 21 agentes sem material somem no meio dos que têm. */
.esp-card.sem-mat{border-left:3px solid var(--borda)}
.esp-card .ag-badge-vazio{font-size:10.5px;font-weight:600;color:var(--cinza-txt);border:1px solid var(--borda);border-radius:999px;padding:1px 7px;margin-top:4px}
.esp-card-sub{font-variant-numeric:tabular-nums}
@media (max-width:640px){ .esp-grid{grid-template-columns:1fr} .ag-cat-h{margin-top:20px} }


/* ── Agentes: densidade (estilo Data-Dense Dashboard) ──────────────────────
   Grid mais apertado e card mais baixo: a mesma tela passa a mostrar ~2x mais
   agentes sem rolar. Padding mínimo é regra do estilo, não economia. */
.esp-grid{grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:8px}
.esp-card{padding:10px 12px;gap:2px;transition:background .15s ease,border-color .15s ease}
.esp-card:hover{background:var(--muted,#f3f6f9)}          /* row highlight on hover */
.esp-card-nome{font-size:13.5px;line-height:1.35}
/* ⚠ ONDA 48 · a etiqueta do código (A8, OP07, M1…). Ela é DELIBERADAMENTE
   apagada: peso baixo, cor de texto secundário e caixa de 10,5px. O código era
   PREFIXO DO NOME e roubava a primeira leitura de 34 cards; agora existe para
   quem precisa achar o material do pacote original, e some para quem só quer
   saber de que o agente trata. Os 2 agentes legados não têm código — e a
   ausência da etiqueta neles é informação, não falha de render. */
.esp-cod{display:inline-block;font-size:10.5px;font-weight:600;line-height:1.4;color:var(--cinza-txt);background:var(--papel);border:1px solid var(--borda);border-radius:5px;padding:0 5px;margin-left:5px;vertical-align:1px;font-variant-numeric:tabular-nums}
.esp-card-sub{font-size:11.5px;color:var(--cinza-txt)}
.esp-card .ag-ic{width:15px;height:15px;flex:none;color:var(--cinza-txt);margin-bottom:2px}
/* barra de busca — o anti-padrão nº1 que a skill apontou era não existir */
.ag-busca-wrap{display:flex;align-items:center;gap:8px;margin:10px 0 2px}
.ag-busca{flex:1;max-width:340px}
.ag-busca-cont{font-size:12px;color:var(--cinza-txt);font-variant-numeric:tabular-nums}
.ag-vazio-busca{padding:18px 2px;color:var(--cinza-txt);font-size:13px}
.ag-cat-h.oculta,.esp-grid.oculta{display:none}
@media (max-width:640px){ .esp-grid{grid-template-columns:1fr} .ag-busca{max-width:none} }


/* ── Página interna do agente ──────────────────────────────────────────────
   Faixa de resumo: o estado do agente lido de relance, antes do detalhe. */
.ag-hd{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;padding:12px 14px;border:1px solid var(--borda);border-radius:10px;margin-top:14px;background:var(--card,#fff)}
.ag-hd-main{flex:1;min-width:220px;display:flex;flex-direction:column;gap:3px}
.ag-hd-nome{font-size:15px;font-weight:700;color:var(--titulo);line-height:1.3}
.ag-hd-desc{font-size:12.5px;color:var(--cinza-txt);line-height:1.45}
.ag-hd-stats{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.ag-st{display:flex;flex-direction:column;line-height:1.2}
.ag-st b{font-size:15px;font-weight:700;color:var(--titulo);font-variant-numeric:tabular-nums}
.ag-st span{font-size:10.5px;color:var(--cinza-txt);text-transform:uppercase;letter-spacing:.04em}
.ag-pill{font-size:11px;font-weight:600;border-radius:999px;padding:2px 9px;border:1px solid var(--borda);color:var(--cinza-txt)}
.ag-pill.on{border-color:#2f9e6b;color:#2f9e6b}
.ag-pill.off{border-color:#c93a52;color:#c93a52}
/* Instruções: teto de altura com rolagem própria. Sem isso, 30 mil caracteres
   empurram tudo que vem depois para fora da tela. */
/* ⚠ width/box-sizing explícitos: a classe .in NÃO é 100% num .dash-card cru —
   sem isto a textarea nasce com as ~20 colunas do padrão do HTML. */
.ag-instr{width:100%;box-sizing:border-box;max-height:360px;overflow-y:auto;resize:vertical;font-size:13px;line-height:1.55;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;tab-size:2}
/* Instruções e Regras dividem a linha: são os dois textos que se lêem juntos
   (como trabalha × o que não pode). Uma coluna abaixo de 1100px, senão cada
   caixa ficaria com menos de 40 caracteres por linha. */
.ag-duo{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start;margin-top:14px}
.ag-duo>.dash-card{margin-top:0;min-width:0}
@media (max-width:1100px){ .ag-duo{grid-template-columns:1fr} }
.ag-instr.expandida{max-height:none;overflow-y:hidden}
/* Filtro das fontes — o anti-padrão nº1 da skill era não existir */
.ag-f-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0 6px}
.ag-f-busca{flex:1;min-width:180px;max-width:320px}
.ag-f-tipos{display:flex;gap:4px;flex-wrap:wrap}
.ag-f-tipo{font-size:12px;padding:4px 10px;border:1px solid var(--borda);border-radius:999px;background:none;color:var(--cinza-txt);cursor:pointer;font-variant-numeric:tabular-nums}
.ag-f-tipo:hover{background:var(--muted,#f3f6f9)}
.ag-f-tipo.sel{border-color:var(--titulo);color:var(--titulo);font-weight:600}
.ag-f-cont{font-size:12px;color:var(--cinza-txt);font-variant-numeric:tabular-nums;margin-left:auto}
.ag-add-bar{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 6px}
.esp-fonte .ag-ic2{width:16px;height:16px;color:var(--cinza-txt)}
@media (max-width:640px){ .ag-hd{gap:10px} .ag-f-busca{max-width:none} }


/* ── Automação: escolher vários agentes ───────────────────────────────────── */
.au-ags{display:flex;flex-direction:column;gap:2px;max-height:210px;overflow-y:auto;border:1px solid var(--borda);border-radius:8px;padding:6px}
.au-ag{display:flex;align-items:flex-start;gap:8px;padding:5px 7px;border-radius:6px;cursor:pointer;font-size:13px;line-height:1.35}
.au-ag:hover{background:var(--muted,#f3f6f9)}
.au-ag input{margin-top:2px;flex:none}
.au-ag i{font-style:normal;color:var(--cinza-txt);font-size:12px}
.au-ags-topo{display:flex;align-items:center;gap:10px;margin:0 0 5px;font-size:12px}
.au-ags-cont{color:var(--cinza-txt);font-variant-numeric:tabular-nums;margin-left:auto}
.au-ags-lnk{background:none;border:0;padding:0;color:var(--azul,#1f6feb);cursor:pointer;font-size:12px}
.au-ags-lnk:hover{text-decoration:underline}


/* ── Memória do agente (derivada, somente leitura) ────────────────────────── */
.ag-mem{width:100%;box-sizing:border-box;max-height:320px;overflow-y:auto;white-space:pre-wrap;font-size:12.5px;line-height:1.55;
  border:1px solid var(--borda);border-radius:8px;padding:10px 12px;background:var(--muted,#f7f9fb);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.ag-mem-vazia{color:var(--cinza-txt);font-style:italic;font-family:inherit}
.ag-mem-barra{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 8px}
.ag-mem-velha{font-size:11.5px;font-weight:600;color:#a86400;border:1px solid #e8c07d;background:#fff8ec;border-radius:999px;padding:2px 9px}


/* ── Paginação da biblioteca do agente ────────────────────────────────────── */
.ag-pag{display:flex;align-items:center;gap:12px;justify-content:center;margin-top:10px;padding-top:10px;border-top:1px solid var(--borda)}
.ag-pag-info{font-size:12px;color:var(--cinza-txt);font-variant-numeric:tabular-nums}
.ag-pag .btn[disabled]{opacity:.4;cursor:default}


/* ── Memória do agente: leitura + índice (Onda 32) ─────────────────────────
   Sai da monoespaçada: 37 mil chars em fonte de código é uma parede. */
/* ⚠ O fundo era `var(--muted)`, que neste tema resolve ESCURO — texto cinza
   claro sobre cinza escuro, ilegível (o dono reclamou, com razão). Fundo de
   card e cor de corpo EXPLÍCITOS, sem depender de token que muda de valor. */
.ag-mem{font-family:var(--corpo-f,inherit);white-space:normal;max-height:460px;font-size:13px;line-height:1.6;
  background:var(--card,#fff);color:var(--corpo,#1f2933);border:1px solid var(--borda)}
.ag-mem.ag-mem-vazia{background:var(--card,#fff);color:var(--cinza-txt)}
.mem-indice{border:1px solid var(--borda);border-radius:8px;padding:10px 14px;margin:0 0 14px;background:var(--card,#fff)}
.mem-indice>b{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--cinza-txt)}
.mem-indice ol{margin:6px 0 0;padding-left:18px;columns:2;column-gap:24px}
.mem-indice li{margin:2px 0;break-inside:avoid;font-size:12.5px}
.mem-indice li.n2{padding-left:10px;list-style:none;color:var(--cinza-txt)}
.mem-indice a{color:var(--titulo);text-decoration:none;cursor:pointer}
.mem-indice a:hover{text-decoration:underline}
@media (max-width:820px){ .mem-indice ol{columns:1} }
.mem-corpo h3.mem-h,.mem-corpo h4.mem-h{margin:16px 0 6px;color:var(--titulo);line-height:1.3}
.mem-corpo h3.mem-h{font-size:14.5px;padding-bottom:5px;border-bottom:1px solid var(--borda)}
.mem-corpo h4.mem-h{font-size:13px}
.mem-corpo h5.mem-h,.mem-corpo h6.mem-h{font-size:12.5px;margin:12px 0 4px;color:var(--cinza-txt)}
.mem-corpo p{margin:6px 0}
.mem-ul{margin:6px 0;padding-left:20px}
.mem-ul li{margin:4px 0}
.mem-corpo code{font-family:ui-monospace,Menlo,monospace;font-size:12px;background:var(--muted,#f3f6f9);padding:1px 5px;border-radius:4px}
/* ⚠ a ORIGEM é a peça antideriva — depois da Onda 31 ela TEM que saltar */
.mem-fonte{font-size:11px;color:var(--cinza-txt);border:1px solid var(--borda);border-radius:999px;padding:1px 7px;margin-left:4px;white-space:nowrap}


/* ── Conversar com o agente (Onda 33) ─────────────────────────────────────── */
.ag-chat{max-height:420px;overflow-y:auto;border:1px solid var(--borda);border-radius:8px;padding:10px;background:var(--card,#fff);display:flex;flex-direction:column;gap:8px;min-height:60px}
.ag-chat:empty::before{content:'Pergunte alguma coisa a ele. Ele responde com as instruções, as regras e a memória dele.';color:var(--cinza-txt);font-size:12.5px;font-style:italic}
.ag-bolha{max-width:82%;padding:8px 12px;border-radius:12px;font-size:13px;line-height:1.55}
.ag-bolha.eu{align-self:flex-end;background:var(--teal,#127475);color:#fff;border-bottom-right-radius:4px}
/* ⚠ ERA `var(--muted)`, que neste tema resolve ESCURO — texto cinza sobre
   cinza-escuro, reprovado no 4.5:1 da lista da skill. É o MESMO defeito que já
   corrigi na memória: token que muda de valor não serve para fundo de leitura. */
.ag-bolha.ele{align-self:flex-start;background:#f4f7f9;color:#1f2933;border:1px solid var(--borda);border-bottom-left-radius:4px}
/* — itens da lista de conferência da skill — */
.ag-chat-barra .btn,.ag-bolha a,.mem-indice a{cursor:pointer}
.ag-chat-barra .btn{transition:background .18s ease,opacity .18s ease}
.ag-chat-barra textarea:focus-visible,.ag-chat-barra .btn:focus-visible{outline:2px solid var(--teal,#127475);outline-offset:2px}
.ag-chat{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ .ag-chat{scroll-behavior:auto} .ag-chat-barra .btn{transition:none} }
.ag-bolha .mem-corpo h3.mem-h,.ag-bolha .mem-corpo h4.mem-h{font-size:13px;margin:8px 0 4px;border:0}
.ag-bolha .mem-indice{display:none}
.ag-chat-barra{display:flex;gap:8px;align-items:flex-end;margin-top:8px}
.ag-chat-barra textarea{flex:1;box-sizing:border-box}