/* ===================== Tokens ===================== */
:root {
  --bg: #0f1714;
  --bg-2: #13201c;
  --surface: #ffffff;
  --surface-2: #f4f8f6;      /* fundo da página (corrigido: era var(--surface-2) circular) */
  --ink: #11201b;
  --ink-2: #4b5a54;
  --ink-3: #7d8c86;
  --line: #e3e9e6;
  --green: #16a34a;
  --green-d: #0f7a38;
  --teal: #0d4d44;
  --teal-2: #0a3a33;
  --accent: #19b87a;
  --green-l: #dcfce7;        /* verde-claro p/ fundos (badges, banners, chips) */
  --chip: #fef3e2;
  --chip-ink: #b45309;
  --radius: 14px;            /* cartões um pouco mais arredondados (alinha c/ o protótipo) */
  --r-sm: 10px;
  --r-lg: 18px;
  --shadow: 0 10px 30px rgba(8, 30, 24, .12);
  --shadow-sm: 0 2px 8px rgba(8, 30, 24, .07);
  --shadow-lift: 0 14px 34px rgba(8, 30, 24, .16);
  --surface-3: #fafdfb;     /* hover/zebra (modo claro) */
  --line-2: #eef2f0;        /* separadores sutis (modo claro) */
  --t: .16s;                 /* transição padrão dos elementos interativos */
  --ease: cubic-bezier(.4, 0, .2, 1);   /* curva padrão do movimento */
  /* cores semânticas de status: base única (antes hard-coded em ~30 lugares) */
  --ok: #0f7a38;      --ok-bg: #e7f7ec;
  --warn: #b45309;    --warn-bg: #fdf1df;
  --danger: #b42318;  --danger-bg: #fdecec;
  --info: #0e7490;    --info-bg: #e6f4f7;
  font-synthesis: none;
}

* { box-sizing: border-box; }
/* Números tabulares (Fase 4), dígitos com largura fixa: KPIs, valores, tabelas e contadores
   ficam alinhados e não "dançam" ao atualizar. Aplicado nas superfícies numéricas do produto. */
.pv-kpi b, .kc-valor, .p-valor, .pi-preco, .pi-total, .disp-agg, .disp-num, .disp-grade td,
.disp-lance-row, .badge, .cb-cron, .mon-quando, .prz, .cnt, .hab-num, .score-num,
.int-preco, .int-num, .di-num, .dash-num, table td { font-variant-numeric: tabular-nums; }
html, body { margin: 0; padding: 0; overflow-x: clip; }  /* trava anti-overflow horizontal (clip não quebra sticky) */
body {
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  background: var(--surface-2);
  color: var(--ink);
  line-height: 1.5;
}
a { color: var(--green-d); cursor: pointer; text-decoration: none; }
a:hover { text-decoration: underline; }

/* ============ Acessibilidade - foco de teclado consistente + motion reduzido ============ */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
}

/* ============ Skeleton screens (Fase 1 - velocidade percebida) ============ */
.sk-wrap { display: grid; gap: 12px; }
.sk-wrap.cols { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.sk { position: relative; overflow: hidden; background: var(--line-2); border-radius: 6px; }
.sk::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  animation: sk-shimmer 1.25s var(--ease) infinite; }
html[data-theme="dark"] .sk::after { background: linear-gradient(90deg, transparent, rgba(255,255,255,.07), transparent); }
@keyframes sk-shimmer { to { transform: translateX(100%); } }
.sk-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; box-shadow: var(--shadow-sm); }
.sk-line { height: 12px; margin-bottom: 10px; }
.sk-line:last-child { margin-bottom: 0; }
.sk-line.w95 { width: 95%; } .sk-line.w80 { width: 80%; } .sk-line.w65 { width: 65%; }
.sk-line.w45 { width: 45%; } .sk-line.w30 { width: 30%; } .sk-line.tall { height: 22px; }
.sk-row { display: flex; gap: 8px; margin-top: 14px; }
.sk-pill { height: 20px; width: 62px; border-radius: 20px; } .sk-pill.sm { width: 40px; }
.sk-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.sk-kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow-sm); }
.sk-chart { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow-sm); height: 200px; }
@media (prefers-reduced-motion: reduce) { .sk::after { animation: none; opacity: .55; } }

/* ============ Toast global (Fase 1 - feedback de ações + Desfazer) ============ */
.toast-box { position: fixed; right: 18px; bottom: 18px; z-index: 60; display: flex; flex-direction: column;
  gap: 10px; max-width: min(92vw, 380px); pointer-events: none; }
.toast { pointer-events: auto; display: flex; align-items: center; gap: 10px; background: var(--surface); color: var(--ink);
  border: 1px solid var(--line); border-left: 4px solid var(--ok); border-radius: 12px; padding: 11px 12px 11px 14px;
  box-shadow: var(--shadow); font-size: 13.5px; transform: translateY(14px); opacity: 0;
  transition: transform .22s var(--ease), opacity .22s var(--ease); }
.toast.in { transform: translateY(0); opacity: 1; }
.toast.out { transform: translateY(8px); opacity: 0; }
.toast-ic { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center;
  font-size: 13px; font-weight: 800; background: var(--ok-bg); color: var(--ok); }
.toast-msg { flex: 1; line-height: 1.4; }
.toast-undo { flex: 0 0 auto; border: 0; background: transparent; color: var(--green-d); font-weight: 800;
  font-size: 13px; cursor: pointer; padding: 4px 9px; border-radius: 8px; }
.toast-undo:hover { background: var(--ok-bg); }
.toast-x { flex: 0 0 auto; border: 0; background: transparent; color: var(--ink-3); cursor: pointer;
  font-size: 13px; padding: 3px 5px; border-radius: 6px; line-height: 1; }
.toast-x:hover { color: var(--ink); }
.toast.t-erro { border-left-color: var(--danger); } .toast.t-erro .toast-ic { background: var(--danger-bg); color: var(--danger); }
.toast.t-info { border-left-color: var(--info); } .toast.t-info .toast-ic { background: var(--info-bg); color: var(--info); }

/* ===================== Topbar ===================== */
.topbar {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: 28px;
  background: var(--surface);              /* neutro: acompanha a página (claro/escuro) */
  color: var(--ink);
  padding: 0 28px; height: 64px;
  box-shadow: 0 2px 10px rgba(8,30,24,.05);
  border-bottom: 1px solid var(--line);
}
.topbar .nav-item { color: var(--ink-2); }
.topbar .nav-item:hover { background: var(--surface-2); color: var(--ink); }
.topbar .nav-item.active { color: var(--green-d); background: var(--green-l); box-shadow: inset 0 -2px 0 var(--accent); }
.brand { display: flex; align-items: baseline; gap: 7px; }
.brand-link { cursor: pointer; transition: opacity .14s; }
.brand-link:hover { opacity: .75; }
.brand-mark { color: var(--accent); font-size: 20px; transform: translateY(2px); }
.brand-name { font-weight: 800; letter-spacing: .14em; font-size: 19px; }
.brand-sub { color: var(--accent); font-weight: 600; font-size: 14px; }
.nav { display: flex; gap: 6px; margin-left: 10px; }
.nav-item {
  color: #bcd6cd; font-weight: 600; font-size: 14px;
  padding: 8px 14px; border-radius: 8px; cursor: pointer; transition: background var(--t), color var(--t);
}
.nav-item:hover { background: rgba(255,255,255,.07); text-decoration: none; color: #fff; }
.nav-item.active { color: #fff; background: rgba(25,184,122,.18); box-shadow: inset 0 -2px 0 var(--accent); }
.badge {
  display: inline-block; min-width: 18px; text-align: center;
  background: var(--green); color: #fff; border-radius: 20px;
  font-size: 11px; padding: 1px 6px; margin-left: 4px;
}
.topbar-right { margin-left: auto; }
/* Botão hambúrguer + overlay do menu (só aparecem no mobile) */
.nav-burger { display: none; background: var(--surface-2); border: 1px solid var(--line); color: var(--ink-2); width: 38px; height: 38px; border-radius: 9px; font-size: 18px; cursor: pointer; flex-shrink: 0; align-items: center; justify-content: center; }
.nav-burger:hover { background: var(--line-2); color: var(--ink); }
.nav-overlay { display: none; }
.fonte-tag {
  font-size: 12px; color: var(--ink-3); border: 1px solid var(--line);
  padding: 4px 10px; border-radius: 20px;
}
/* MARCA DE DESENVOLVIMENTO (temporaria): rotula o que vem da API do Portal de Compras Publicas,
   para separar da massa que vem do PNCP/Compras enquanto construimos. REMOVER NA VERSAO FINAL:
   apague esta regra + o bloco MARCA_DEV_PCP/seloDevPcp no app.js. */
/* Faixa "cadastre a empresa": pré-requisito do Monitorar (sem CNPJ + razão social o alarme de
   convocação não tem como reconhecer você). Avisa antes, e leva direto ao cadastro. */
.mn-ident { display: flex; align-items: center; gap: 14px; margin: 0 0 14px;
  border: 1px solid var(--warn); background: var(--warn-bg); border-radius: 12px; padding: 14px 16px; }
.mn-ident-ic { font-size: 26px; line-height: 1; flex-shrink: 0; }
.mn-ident-txt { flex: 1; min-width: 0; font-size: 13.5px; line-height: 1.55; color: var(--ink); }
.mn-ident-txt b { display: block; margin-bottom: 2px; }
.mn-ident .btn { flex-shrink: 0; }
@media (max-width: 720px) { .mn-ident { flex-wrap: wrap; } .mn-ident .btn { width: 100%; } }

.selo-dev { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700;
  padding: 2px 8px; border-radius: 6px; border: 1px dashed var(--warn); color: var(--warn);
  background: var(--warn-bg); white-space: nowrap; }

/* ===================== Views ===================== */
.view { display: none; }
.view.active { display: block; }

/* ===================== Hero / busca ===================== */
.hero {
  position: relative;
  background: var(--surface-2);            /* neutro: mesma cor da página (claro/escuro) */
  color: var(--ink); text-align: center;
  padding: 22px 20px 16px;                 /* compacto: sem excesso de espaço */
  border-bottom: 1px solid var(--line);
}
.hero::after { content: none; }            /* sem faixa colorida / brilho verde */
.hero > * { position: relative; z-index: 1; }
.hero.compact { padding: 16px 20px 12px; }
.hero h1 { font-size: 28px; margin: 0 0 4px; font-weight: 800; letter-spacing: -.02em; }
.hero-sub { color: var(--ink-2); margin: 0 auto 14px; max-width: 640px; font-size: 14px; }

.search-wrap { max-width: 820px; margin: 0 auto; }
.search-box {
  display: flex; align-items: center; gap: 8px;
  background: var(--surface); border-radius: 14px; padding: 8px 8px 8px 16px;
  box-shadow: var(--shadow); flex-wrap: wrap;
}
.search-ico { font-size: 16px; opacity: .6; }
.search-box input {
  flex: 1; min-width: 180px; border: 0; outline: 0;
  font-size: 16px; color: var(--ink); padding: 10px 4px; background: transparent;
}
.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--chip); color: var(--chip-ink);
  border-radius: 8px; padding: 5px 10px; font-size: 13px; font-weight: 600;
}
.chip button { border: 0; background: none; color: var(--chip-ink); cursor: pointer; font-size: 13px; }
.icon-btn { border: 0; background: var(--surface-2); width: 36px; height: 36px; border-radius: 9px; cursor: pointer; color: var(--ink-3); }
.icon-btn:hover { background: #e6ece9; }
.search-btn {
  border: 0; color: #fff; font-weight: 700; cursor: pointer; font-size: 14.5px;
  padding: 11px 21px; border-radius: 10px;
  background: linear-gradient(180deg, var(--accent), var(--green-d));
  box-shadow: 0 4px 12px rgba(22,163,74,.28);
  transition: transform var(--t), box-shadow var(--t), filter var(--t);
}
.search-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(22,163,74,.36); }
.search-btn:active { transform: translateY(1px); box-shadow: 0 3px 9px rgba(22,163,74,.3); }
.search-btn:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(22,163,74,.4); }
.search-btn:disabled { opacity: .55; cursor: default; transform: none; box-shadow: none; filter: grayscale(.25); }
.btn-exportar {
  display: inline-flex; align-items: center; gap: 6px; text-decoration: none;
  border: 1px solid var(--line); background: var(--surface); color: var(--green-d);
  border-radius: 10px; padding: 9px 15px; font-size: 14px; font-weight: 700; cursor: pointer;
  transition: background var(--t), border-color var(--t), transform var(--t);
}
.btn-exportar:hover { background: #f0faf4; border-color: var(--green); transform: translateY(-1px); }
.btn-exportar:active { transform: translateY(1px); }
.hero .btn-exportar { margin-top: 14px; }

/* ===================== Cofre de documentos ===================== */
#doc-novo { margin-top: 8px; }
.doc-alertas { border-radius: 10px; padding: 11px 14px; font-size: 14px; margin-bottom: 14px; }
.doc-alertas.grave { background: var(--danger-bg); border: 1px solid #f3c2c2; color: var(--danger); }
.doc-alertas.aviso { background: #fff7e6; border: 1px solid #fde0a3; color: #92610a; }
.doc-alertas.ok { background: var(--green-l); border: 1px solid #bce8cf; color: var(--green-d); }

.doc-lista { display: grid; gap: 10px; }
.doc-card { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--ink-3); border-radius: 12px; padding: 14px 16px; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.doc-card.valido { border-left-color: var(--green); }
.doc-card.vencendo { border-left-color: #f59e0b; }
.doc-card.vencido { border-left-color: #ef4444; }
.doc-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.doc-card-info { min-width: 0; }
.doc-nome { font-size: 15px; font-weight: 700; color: var(--ink); }
.doc-tipo { font-size: 11.5px; font-weight: 700; color: var(--green-d); background: var(--green-l); border-radius: 6px; padding: 2px 7px; margin-left: 6px; white-space: nowrap; }
.doc-meta { font-size: 12.5px; color: var(--ink-3); margin-top: 4px; display: flex; flex-wrap: wrap; gap: 3px 12px; }
.doc-badge { flex-shrink: 0; font-size: 12px; font-weight: 800; border-radius: 20px; padding: 5px 11px; white-space: nowrap; }
.doc-badge.valido { background: var(--green-l); color: var(--green-d); }
.doc-badge.vencendo { background: #fff3da; color: #92610a; }
.doc-badge.vencido { background: var(--danger-bg); color: var(--danger); }
.doc-badge.sem { background: var(--surface-2); color: var(--ink-3); }
.doc-obs { font-size: 13px; color: var(--ink-2); margin: 8px 0 0; line-height: 1.5; white-space: pre-wrap; }
.doc-card-acoes { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--line-2); flex-wrap: wrap; }
.doc-link { color: var(--green-d); font-weight: 700; font-size: 13px; text-decoration: none; }
.doc-link:hover { text-decoration: underline; }
.doc-sem-arq { font-size: 12.5px; color: var(--ink-3); }
.doc-acoes-dir { display: flex; gap: 8px; }
.doc-editar, .doc-excluir { border: 1px solid var(--line); background: var(--surface); border-radius: 8px; padding: 5px 12px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--ink-2); }
.doc-editar:hover { border-color: var(--green); color: var(--green-d); }
.doc-excluir:hover { border-color: #ef4444; color: var(--danger); }

/* Formulário do documento (modal) */
.modal-titulo { font-size: 18px; font-weight: 800; color: var(--ink); margin: 0 0 14px; }
.doc-form { display: flex; flex-direction: column; text-align: left; }
.doc-f-lbl { font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin: 8px 0 4px; }
.doc-form input, .doc-form textarea, .doc-form select { width: 100%; padding: 9px 11px; border: 1px solid var(--line); border-radius: 9px; font-size: 14px; color: var(--ink); font-family: inherit; background: var(--surface); }
.doc-form input:focus, .doc-form textarea:focus, .doc-form select:focus { outline: none; border-color: var(--green); }
.doc-f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.doc-f-row.tres { grid-template-columns: 1fr 1fr 1fr; }
.doc-arq-atual { font-size: 12.5px; color: var(--ink-2); margin-top: 6px; }
.doc-arq-remover { margin-left: 8px; color: var(--ink-3); cursor: pointer; }
.doc-f-erro { background: var(--danger-bg); color: var(--danger); border: 1px solid #f3c2c2; border-radius: 8px; padding: 8px 11px; font-size: 13px; margin-top: 10px; }
.doc-f-acoes { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.btn-sec { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); border-radius: 10px; padding: 10px 18px; font-size: 14px; font-weight: 700; cursor: pointer; font-family: inherit; }
.btn-sec:hover { background: var(--surface-2); }
@media (max-width: 520px) { .doc-f-row, .doc-f-row.tres { grid-template-columns: 1fr; } }

/* ===================== Cofre de Documentos - layout (M5) ===================== */
.doc-hero { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; text-align: left; }
.doc-hero-tx { min-width: 0; }
.doc-hero .search-btn { flex-shrink: 0; }

/* KPIs */
.doc-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 4px 0 18px; }
.doc-kpi { background: var(--surface); border: 1px solid var(--line); border-top: 3px solid var(--ink-3); border-radius: 12px; padding: 13px 15px; box-shadow: var(--shadow-sm); }
.doc-kpi b { display: block; font-size: 28px; font-weight: 800; line-height: 1.1; color: var(--ink); }
.doc-kpi span { font-size: 12.5px; color: var(--ink-3); font-weight: 600; }
.doc-kpi.ok { border-top-color: var(--green); } .doc-kpi.ok b { color: var(--green-d); }
.doc-kpi.aviso { border-top-color: #f59e0b; } .doc-kpi.aviso b { color: var(--warn); }
.doc-kpi.grave { border-top-color: #ef4444; } .doc-kpi.grave b { color: var(--danger); }
.doc-kpi.neutro { border-top-color: var(--ink-3); }

/* Layout 2 colunas */
.doc-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 18px; align-items: start; }
.doc-main { min-width: 0; }

/* Tabela */
.doc-tabela-wrap { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; overflow-x: auto; box-shadow: var(--shadow-sm); }
.doc-tabela { width: 100%; border-collapse: collapse; font-size: 14px; }
.doc-tabela thead th { text-align: left; background: var(--surface-2); color: var(--ink-2); font-size: 11.5px; text-transform: uppercase; letter-spacing: .6px; font-weight: 700; padding: 10px 14px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.doc-tabela th.doc-th-acao { text-align: right; }
.doc-tabela tbody td { padding: 11px 14px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.doc-tabela tbody tr:last-child td { border-bottom: 0; }
.doc-tabela tbody tr:hover td { background: var(--surface-3); }
.doc-tabela .doc-badge { font-size: 11.5px; padding: 4px 9px; }
/* "Documento" absorve a sobra e trunca; as demais colunas encolhem ao conteúdo (mantêm Status/Ação inteiros) */
.doc-tabela td:not(.doc-td-nome), .doc-tabela th:not(:first-child) { white-space: nowrap; width: 1%; }
.doc-nome-row { display: flex; align-items: center; gap: 7px; min-width: 0; }
.doc-anexo { text-decoration: none; font-size: 14px; opacity: .8; flex-shrink: 0; }
.doc-anexo:hover { opacity: 1; }
.doc-td-nome .doc-nome { font: inherit; font-weight: 700; color: var(--ink); background: transparent; border: 0; padding: 0; cursor: pointer; text-align: left; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-td-nome .doc-nome:hover { color: var(--green-d); text-decoration: underline; }
.doc-sub { font-size: 12px; color: var(--ink-3); margin-top: 2px; }
.doc-cat { display: inline-block; font-size: 12px; font-weight: 600; color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; padding: 3px 10px; }
.doc-td-val { white-space: nowrap; color: var(--ink-2); }
.doc-td-acao { text-align: right; }
.doc-acoes-cell { display: inline-flex; align-items: center; gap: 6px; justify-content: flex-end; }
.doc-acao { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--line); background: var(--surface); border-radius: 8px; padding: 6px 11px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--ink-2); white-space: nowrap; }
.doc-acao:hover { border-color: var(--green); color: var(--green-d); }
.doc-acao.doc-renovar { text-decoration: none; background: var(--green-l); border-color: #b8e6cb; color: var(--green-d); }
.doc-acao.doc-renovar:hover { background: var(--green); border-color: var(--green); color: #fff; }
.doc-del { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line); background: var(--surface); border-radius: 8px; padding: 6px 9px; font-size: 14px; cursor: pointer; line-height: 1; }
.doc-del:hover { border-color: #f3c2c2; background: var(--danger-bg); }
.doc-badge.cofre { background: var(--surface-2); color: var(--ink-2); }

/* Campo de renovação no formulário (modal) */
.doc-renovar-row { display: flex; gap: 8px; align-items: center; }
.doc-renovar-row #doc-f-url { flex: 1; width: auto; min-width: 0; }
.doc-form .doc-modelo-sel { width: auto; max-width: 46%; flex-shrink: 0; }
.doc-hint-renovar { font-size: 12px; color: var(--ink-3); margin: 6px 0 0; line-height: 1.45; }
.doc-buscar-portal { color: var(--green-d); font-weight: 600; cursor: pointer; white-space: nowrap; }
.doc-buscar-portal:hover { text-decoration: underline; }

/* Badge de alerta no menu Documentos (vencidas/vencendo) */
.badge-docs { background: #ef4444; color: #fff; }

/* Painel lateral */
.doc-side { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 78px; }
.doc-side-card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 14px 15px; box-shadow: var(--shadow-sm); }
.doc-side-h { font-size: 14px; font-weight: 800; color: var(--ink); margin: 0 0 10px; }
.doc-venc-lista { display: flex; flex-direction: column; gap: 2px; }
.doc-venc-item { display: flex; align-items: center; gap: 9px; width: 100%; background: transparent; border: 0; border-radius: 8px; padding: 8px; cursor: pointer; text-align: left; font-family: inherit; font-size: 13.5px; }
.doc-venc-item:hover { background: var(--surface-2); }
.doc-venc-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; background: var(--ink-3); }
.doc-venc-dot.ok { background: var(--green); }
.doc-venc-dot.aviso { background: #f59e0b; }
.doc-venc-dot.grave { background: #ef4444; }
.doc-venc-nome { flex: 1; min-width: 0; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-venc-prazo { font-size: 12.5px; font-weight: 700; color: var(--ink-3); white-space: nowrap; }
.doc-venc-prazo.aviso { color: var(--warn); }
.doc-venc-prazo.grave { color: var(--danger); }
.doc-venc-vazio { font-size: 13px; color: var(--ink-3); margin: 0; }

/* Dropzone */
.doc-dropzone { border: 2px dashed #c9d6d0; border-radius: 12px; padding: 20px 14px; text-align: center; cursor: pointer; transition: var(--t); background: var(--surface-2); }
.doc-dropzone:hover { border-color: var(--accent); background: #eef7f2; }
.doc-dropzone.drag { border-color: var(--green); background: var(--green-l); }
.doc-drop-ic { font-size: 26px; display: block; margin-bottom: 6px; }
.doc-drop-tx { font-size: 13.5px; color: var(--ink-2); margin: 0 0 4px; }
.doc-drop-tx a { color: var(--green-d); font-weight: 700; cursor: pointer; }
.doc-drop-hint { font-size: 12px; color: var(--ink-3); margin: 0; }

/* Responsivo: empilha mais cedo p/ a tabela nunca espremer */
@media (max-width: 1080px) {
  .doc-layout { grid-template-columns: 1fr; }
  .doc-side { position: static; }
}
@media (max-width: 860px) {
  .doc-kpis { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .doc-tabela-wrap { overflow-x: auto; }
  .doc-tabela { min-width: 540px; }
}

/* ===================== Proposta - Precificador (M4, wireframe 04) ===================== */
.prop-hero { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; text-align: left; }
.prop-hero-tx { min-width: 0; max-width: 720px; }
.prop-hero-acoes { display: flex; gap: 10px; flex-shrink: 0; flex-wrap: wrap; }
.btn-prop-sec { border: 1px solid var(--line); background: var(--surface); color: var(--ink); border-radius: 11px; padding: 10px 16px; font-size: 14px; font-weight: 700; cursor: pointer; box-shadow: var(--shadow-sm); }
.btn-prop-sec:hover { border-color: var(--accent); color: var(--green-d); }
.btn-prop-pri { border: 0; background: var(--teal); color: #fff; border-radius: 11px; padding: 10px 16px; font-size: 14px; font-weight: 700; cursor: pointer; box-shadow: var(--shadow-sm); }
.btn-prop-pri:hover { background: var(--teal-2); }

/* caixa "importar itens do edital" */
.prop-import-box { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; box-shadow: var(--shadow-sm); }
.prop-imp-tit { font-weight: 800; font-size: 14px; margin-bottom: 8px; }
.prop-imp-item { display: block; width: 100%; text-align: left; background: var(--surface-2); border: 1px solid var(--line); border-radius: 9px; padding: 9px 12px; margin-top: 6px; cursor: pointer; font-size: 13.5px; color: var(--ink-2); font-family: inherit; }
.prop-imp-item:hover { border-color: var(--accent); background: var(--green-l); }
.prop-imp-item b { color: var(--green-d); }
.prop-imp-vazio { font-size: 13.5px; color: var(--ink-2); }
.prop-imp-ok { font-size: 13.5px; color: var(--green-d); font-weight: 600; }

/* cartão Composição */
.prop-comp-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; box-shadow: var(--shadow-sm); }
.prop-comp-head { font-size: 16px; margin-bottom: 14px; color: var(--ink); }
.prop-comp-head b, #prop-comp-num { font-weight: 800; }

/* tabela: nº do item + chip de mercado */
.pi-n { color: var(--ink-3); font-weight: 700; width: 36px; }
.pi-mercado { white-space: nowrap; }
.pi-chip { display: inline-block; font-size: 12px; font-weight: 800; border-radius: 999px; padding: 4px 10px; white-space: nowrap; }
.pi-chip.ok { background: var(--green-l); color: var(--green-d); border: 1px solid #b8e6cb; }
.pi-chip.acima { background: #fff3da; color: #92610a; border: 1px solid #fde0a3; }
.pi-ref.re { margin-left: 4px; }

/* rodapé do cartão: total + margem média + callout de competitividade */
.prop-rodape { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.prop-tot-bloco { display: flex; flex-direction: column; }
.prop-tot-bloco span { font-size: 12.5px; color: var(--ink-3); font-weight: 600; }
.prop-tot-bloco b { font-size: 26px; font-weight: 800; color: var(--ink); line-height: 1.2; }
.prop-callout { flex: 1; min-width: 260px; border-radius: 11px; padding: 11px 14px; font-size: 13.5px; border: 1px solid; }
.prop-callout.boa { background: var(--green-l); border-color: #b8e6cb; color: #14532d; }
.prop-callout.ruim { background: #fff3da; border-color: #fde0a3; color: #92610a; }
.prop-callout.dica { background: var(--surface-2); border-color: var(--line); color: var(--ink-3); }
.prop-acoes { align-items: center; }

/* grid dos 3 cards inferiores (documentos · modelos · referência) */
.prop-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; align-items: start; }
.prop-side-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 15px 16px; box-shadow: var(--shadow-sm); }
.prop-side-h { font-size: 14.5px; font-weight: 800; margin: 0 0 6px; color: var(--ink); }
.prop-doc-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line-2); font-size: 13.5px; }
.prop-doc-row:last-of-type { border-bottom: 0; }
.prop-doc-nm { color: var(--ink); }
.prop-doc-acao { color: var(--green-d); font-weight: 700; cursor: pointer; white-space: nowrap; }
.prop-doc-acao:hover { text-decoration: underline; }
.prop-doc-acao.mod { white-space: normal; color: var(--ink); font-weight: 600; }
.prop-doc-acao.mod:hover { color: var(--green-d); }
.prop-side-hint { font-size: 11.5px; color: var(--ink-3); margin: 9px 0 0; }

/* card referência de mercado */
.prop-ref-busca { display: flex; gap: 8px; margin-bottom: 10px; }
.prop-ref-busca input { flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-size: 13.5px; }
.prop-ref-busca input:focus { outline: none; border-color: var(--green); }
.prop-ref-busca button { border: 1px solid var(--green); background: var(--surface); color: var(--green-d); border-radius: 9px; padding: 8px 13px; font-weight: 700; cursor: pointer; font-size: 13px; }
.prop-ref-busca button:hover { background: var(--green-l); }
.prop-ref-out { font-size: 13px; color: var(--ink-2); }
.prop-ref-out.dim { color: var(--ink-3); }
.prop-ref-out p { margin: 0 0 7px; }
.prop-ref-base { color: var(--ink-3); }
.prop-ref-nums b { color: var(--green-d); }

@media (max-width: 1080px) { .prop-grid3 { grid-template-columns: 1fr; } }
@media (max-width: 720px) {
  .prop-rodape { gap: 16px; }
  .prop-tot-bloco b { font-size: 22px; }
}

/* ===================== Disputa - feed ao vivo (capturador, M6) ===================== */
.disp-feed { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--accent); border-radius: 12px; padding: 12px 15px; margin-top: 14px; box-shadow: var(--shadow-sm); }
.disp-feed-head { font-size: 14px; color: var(--ink); margin-bottom: 6px; }
/* Selo de confiança do Capturador: mostra ao vivo/instável/aguardando (mesma linguagem das tags .prz) */
.disp-feed-st { display: flex; align-items: center; flex-wrap: wrap; gap: 3px 10px; margin-bottom: 10px; }
.feed-pill { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; font-size: 12.5px;
  padding: 4px 12px; border-radius: 999px; white-space: nowrap; }
.feed-pill .fp-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.feed-pill.viva { background: var(--ok-bg); color: var(--ok); }
.feed-pill.viva .fp-dot { animation: fp-pulse 1.4s var(--ease) infinite; }
.feed-pill.parada { background: var(--warn-bg); color: var(--warn); }
.feed-pill.espera { background: var(--surface-2); color: var(--ink-3); }
.feed-meta { font-size: 12px; color: var(--ink-3); }
@keyframes fp-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(22,163,74,.45); opacity: 1; }
  50% { box-shadow: 0 0 0 5px rgba(22,163,74,0); opacity: .6; } }
@media (prefers-reduced-motion: reduce) { .feed-pill.viva .fp-dot { animation: none; } }
.disp-feed-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.disp-bm { display: inline-block; background: var(--green); color: #fff; font-weight: 800; font-size: 13px; padding: 8px 14px; border-radius: 9px; text-decoration: none; cursor: grab; box-shadow: var(--shadow-sm); }
.disp-bm:active { cursor: grabbing; }
.disp-bm:hover { background: var(--green-d); }
.disp-feed-como { flex: 1 1 100%; font-size: 13px; color: var(--ink-2); }
.disp-feed-como summary { cursor: pointer; color: var(--green-d); font-weight: 700; font-size: 13px; }
.disp-feed-como ol { margin: 8px 0 4px; padding-left: 20px; }
.disp-feed-como li { margin-bottom: 5px; }

/* ===================== Pós-venda & Transparência (Onda 4) ===================== */
.pv-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.pv-kpi { background: var(--surface); border: 1px solid var(--line); border-top: 3px solid var(--ink-3); border-radius: 12px; padding: 13px 15px; box-shadow: var(--shadow-sm); }
.pv-kpi b { display: block; font-size: 24px; font-weight: 800; line-height: 1.15; color: var(--ink); }
.pv-kpi span { font-size: 12.5px; color: var(--ink-3); font-weight: 600; }
.pv-kpi i { font-style: normal; font-size: 11.5px; color: var(--danger); font-weight: 700; }
.pv-kpi.ok { border-top-color: var(--green); } .pv-kpi.ok b { color: var(--green-d); }
.pv-kpi.info { border-top-color: var(--info); } .pv-kpi.info b { color: var(--info); font-size: 20px; }
.pv-kpi.aviso { border-top-color: #f59e0b; } .pv-kpi.aviso b { color: var(--warn); }
.pv-kpi.grave { border-top-color: #ef4444; } .pv-kpi.grave b { color: var(--danger); }
.pv-kpi.neutro { border-top-color: var(--ink-3); }

.pv-tabs { display: flex; gap: 8px; margin-bottom: 14px; border-bottom: 1px solid var(--line); }
.pv-tab { border: 0; background: none; padding: 9px 14px; font-size: 14px; font-weight: 700; color: var(--ink-3); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.pv-tab.on { color: var(--green-d); border-bottom-color: var(--green); }
.pv-tab:hover { color: var(--ink); }

.pv-head { margin-bottom: 12px; }
.pv-cards { display: flex; flex-direction: column; gap: 10px; }
.pv-card { display: flex; align-items: center; gap: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 13px 16px; box-shadow: var(--shadow-sm); cursor: pointer; transition: .14s; }
.pv-card:hover { border-color: var(--accent); transform: translateY(-1px); }
.pv-card-main { flex: 1; min-width: 0; }
.pv-card-tit { font-weight: 700; color: var(--ink); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pv-card-sub { font-size: 12.5px; color: var(--ink-3); margin-top: 3px; }
.pv-card-right { text-align: right; white-space: nowrap; }
.pv-card-val { font-weight: 800; color: var(--green-d); }
.pv-adit { font-size: 11px; color: var(--info); font-weight: 700; }
.pv-st { font-size: 11px; font-weight: 800; padding: 2px 9px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); }
.pv-st.s-vigente { background: var(--green-l); color: var(--green-d); }
.pv-st.s-aditado { background: #e0f2fe; color: #0369a1; }
.pv-st.s-encerrado, .pv-st.s-rescindido { background: var(--danger-bg); color: var(--danger); }
.pv-st.s-suspenso { background: #fff3da; color: #92610a; }
.pv-venc { display: inline-block; margin-top: 4px; font-size: 11.5px; font-weight: 700; color: var(--ink-3); }
.pv-venc.aviso { color: var(--warn); } .pv-venc.grave { color: var(--danger); }

/* editor de contrato */
.pv-comp-card, .pv-sub-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; box-shadow: var(--shadow-sm); margin-bottom: 14px; }
.pv-ed-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.pv-form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.pv-form-grid .pv-col2 { grid-column: span 2; }
.pv-form-grid label { display: block; font-size: 12px; font-weight: 700; color: var(--ink-2); margin-bottom: 4px; }
.pv-form-grid input, .pv-form-grid select, .pv-form-grid textarea { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13.5px; font-family: inherit; }
.pv-form-grid input:focus, .pv-form-grid select:focus, .pv-form-grid textarea:focus { outline: none; border-color: var(--green); }
.pv-acoes { margin-top: 14px; }
.pv-sub-card h4 { margin: 0 0 10px; font-size: 14px; color: var(--ink); }
.pv-li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line-2); font-size: 13.5px; }
.pv-li:last-of-type { border-bottom: 0; }
.pv-li-ac { display: flex; align-items: center; gap: 6px; }
.pv-li-rm { border: 0; background: none; color: var(--danger); cursor: pointer; font-size: 14px; }
.pv-vazio { font-size: 13px; padding: 4px 0; }
.pv-est { font-size: 10.5px; font-weight: 800; padding: 2px 7px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); }
.pv-est.s-entregue { background: #e0f2fe; color: #0369a1; } .pv-est.s-faturado { background: #fef3c7; color: #92610a; }
.pv-est.s-liquidado { background: #ede9fe; color: #6d28d9; } .pv-est.s-pago { background: var(--green-l); color: var(--green-d); }
.pv-add { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line); }
.pv-add input, .pv-add select { border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; font-size: 13px; flex: 1 1 120px; min-width: 90px; }
.pv-ent-st { border: 1px solid var(--line); border-radius: 7px; padding: 3px 6px; font-size: 12px; }

/* bom pagador */
.pv-pagador-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; box-shadow: var(--shadow-sm); max-width: 640px; }
.pv-pag-busca { display: flex; gap: 8px; margin: 12px 0; }
.pv-pag-busca input { flex: 1; border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; font-size: 14px; }
.pv-pag-busca input:focus { outline: none; border-color: var(--green); }
.pv-pag-out { font-size: 13.5px; color: var(--ink-2); line-height: 1.6; }
.pv-pag-out.dim { color: var(--ink-3); }
.pv-pag-out code { background: var(--surface-2); border: 1px solid var(--line); border-radius: 5px; padding: 1px 6px; font-size: 12.5px; }
.pv-pag-out a { color: var(--green-d); font-weight: 700; }
.pv-selo { display: inline-block; font-size: 15px; font-weight: 800; padding: 6px 14px; border-radius: 999px; margin-bottom: 8px; }
.pv-selo.bom { background: var(--green-l); color: var(--green-d); }
.pv-selo.atencao { background: #fff3da; color: #92610a; }
.pv-selo.lento { background: var(--danger-bg); color: var(--danger); }
.pv-selo.indefinido { background: var(--surface-2); color: var(--ink-2); }
.pv-pag-org { font-size: 16px; font-weight: 800; color: var(--ink); }
.pv-pag-nums { margin: 6px 0; }
.pv-pag-nums b { color: var(--ink); }

@media (max-width: 760px) { .pv-kpis { grid-template-columns: repeat(2, 1fr); } .pv-form-grid { grid-template-columns: 1fr 1fr; } .pv-form-grid .pv-col2 { grid-column: span 2; } }

/* ============================================================================
   Inteligência de mercado (B.I.), portada do PROTOTIPO-F, ESCOPADA em #view-inteligencia.
   Mesma ponte de tokens do Pós-venda (nomes do protótipo -> tokens do app; a cor segue o
   --accent configurável). Todos os números vêm de dados REAIS do PNCP (nada é inventado).
   ============================================================================ */
#view-inteligencia {
  --pri: var(--accent); --pri-d: var(--green-d); --pri-l: var(--green-l);
  --bg: var(--surface-2); --ink2: var(--ink-2); --ink3: var(--ink-3); --line2: var(--line-2);
  --amber: var(--warn); --amber-l: var(--warn-bg);
  --red: var(--danger); --red-l: var(--danger-bg); --sh: var(--shadow-sm);
}
#view-inteligencia .resultados { max-width: none; margin: 0; padding: 22px 20px 60px; }
/* classes compartilhadas do protótipo, escopadas (não colidem com as globais) */
#view-inteligencia .card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--sh); overflow: hidden; margin-bottom: 16px; }
#view-inteligencia .card-h { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); font-weight: 800; font-size: 13.5px; flex-wrap: wrap; }
#view-inteligencia .card-h .sp { margin-left: auto; }
#view-inteligencia .card-b { padding: 14px 16px; }
#view-inteligencia .op-sub { font-size: 12px; color: var(--ink2); margin-top: 2px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
#view-inteligencia .st { font-size: 10px; font-weight: 800; border-radius: 999px; padding: 2px 8px; text-transform: uppercase; letter-spacing: .3px; white-space: nowrap; }
#view-inteligencia .st.g { background: var(--green-l); color: var(--green); }
#view-inteligencia .st.b { background: var(--pri-l); color: var(--pri); }
#view-inteligencia .st.a { background: var(--amber-l); color: var(--amber); }
#view-inteligencia .st.r { background: var(--red-l); color: var(--red); }
#view-inteligencia .btn { border: 1px solid var(--line); background: var(--surface); border-radius: 9px; padding: 9px 14px; font-weight: 700; font-size: 13px; cursor: pointer; color: var(--ink2); display: inline-flex; align-items: center; gap: 7px; font-family: inherit; }
#view-inteligencia .btn.pri { background: var(--pri); color: #fff; border-color: var(--pri); }
#view-inteligencia .btn.pri:hover { background: var(--pri-d); color: #fff; }
#view-inteligencia .btn.sm { padding: 6px 10px; font-size: 12px; }
/* barra de comando + KPIs */
#view-inteligencia .bi-sticky { position: sticky; top: 0; z-index: 6; background: var(--bg); padding: 2px 0 4px; margin: 0 0 12px; }
#view-inteligencia .bi-cmdcard { background: var(--surface); border: 1px solid var(--line); border-radius: 13px; padding: 12px 14px; box-shadow: var(--sh); }
#view-inteligencia .bi-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
#view-inteligencia .bi-sel { border: 1px solid var(--line); background: var(--bg); border-radius: 9px; padding: 8px 10px; font-size: 12.5px; font-weight: 700; color: var(--ink); outline: none; font-family: inherit; cursor: pointer; }
#view-inteligencia .bi-sel:focus { border-color: var(--pri); }
#view-inteligencia .bi-chip { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: 5px 12px; font-size: 12px; font-weight: 700; color: var(--ink2); cursor: pointer; }
#view-inteligencia .bi-chip.on { background: var(--pri-l); color: var(--pri); border-color: transparent; }
#view-inteligencia .bi-chip.novo { border-style: dashed; background: transparent; }
#view-inteligencia .bi-busca-in { border: 1px solid var(--line); background: var(--bg); border-radius: 9px; padding: 8px 12px; font-size: 13px; font-family: inherit; outline: none; color: var(--ink); }
#view-inteligencia .bi-busca-in:focus { border-color: var(--pri); }
#view-inteligencia .bi-spinner { width: 28px; height: 28px; border-radius: 50%; border: 3px solid var(--line); border-top-color: var(--pri); animation: biSpin .8s linear infinite; margin: 0 auto 14px; }
@keyframes biSpin { to { transform: rotate(360deg); } }
#view-inteligencia .bi-note { display: inline-flex; align-items: center; gap: 7px; background: var(--amber-l); color: var(--amber); border-radius: 999px; padding: 4px 12px; font-size: 11.5px; font-weight: 700; }
#view-inteligencia .bi-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: 10px; margin-top: 11px; }
#view-inteligencia .bi-kpi { background: var(--bg); border: 1px solid var(--line); border-radius: 11px; padding: 10px 12px; cursor: pointer; }
#view-inteligencia .bi-kpi:hover { border-color: var(--pri); }
#view-inteligencia .bi-kpi .lb { font-size: 11.5px; font-weight: 700; color: var(--ink2); }
#view-inteligencia .bi-kpi .num { font-size: 19px; font-weight: 800; margin-top: 3px; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 7px; }
#view-inteligencia .bi-kpi .dl { font-size: 11px; font-weight: 800; }
#view-inteligencia .bi-kpi .bi-sub { font-size: 10.5px; color: var(--ink3); margin-top: 1px; }
/* gráficos + listas */
#view-inteligencia .bi-svg { width: 100%; height: auto; display: block; }
#view-inteligencia .bi-svg text { font-family: inherit; }
#view-inteligencia .bi-legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 11.5px; color: var(--ink2); font-weight: 700; margin: 2px 0 8px; }
#view-inteligencia .bi-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
#view-inteligencia .bi-2col { display: grid; grid-template-columns: 1fr 1.15fr; gap: 16px; align-items: start; }
@media (max-width: 1000px) { #view-inteligencia .bi-2col { grid-template-columns: 1fr; } }
#view-inteligencia .bi-verd { border-radius: 10px; padding: 9px 13px; font-size: 13px; font-weight: 700; margin-top: 10px; }
#view-inteligencia .bi-verd.ok { background: var(--green-l); color: var(--green); }
#view-inteligencia .bi-verd.no { background: var(--red-l); color: var(--red); }
#view-inteligencia .bi-actrow { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 10px; }
#view-inteligencia .bi-li { display: flex; gap: 10px; align-items: center; padding: 8px 2px; border-bottom: 1px solid var(--line2); font-size: 13px; }
#view-inteligencia .bi-li .grow { flex: 1; min-width: 160px; }
#view-inteligencia .bi-rv { display: flex; gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--line2); }
#view-inteligencia .bi-rv .nm { width: 200px; flex-shrink: 0; font-size: 12.5px; font-weight: 700; line-height: 1.25; }
#view-inteligencia .bi-rv .nm small { display: block; color: var(--ink3); font-weight: 600; font-size: 10.5px; }
#view-inteligencia .bi-rv .bar { flex: 1; min-width: 80px; }
#view-inteligencia .bi-rv .tot { width: 130px; flex-shrink: 0; text-align: right; font-size: 11.5px; color: var(--ink2); font-weight: 700; line-height: 1.3; }
#view-inteligencia .bi-rv.eu { background: var(--green-l); border-radius: 8px; padding: 7px 8px; }
#view-inteligencia .bi-heat { display: grid; gap: 3px; align-items: center; font-size: 11px; }
#view-inteligencia .bi-heat .hl { font-weight: 700; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 6px; cursor: pointer; }
#view-inteligencia .bi-heat .hl:hover { color: var(--pri); }
#view-inteligencia .bi-heat .hm { font-weight: 800; color: var(--ink3); text-align: center; font-size: 10px; }
#view-inteligencia .bi-heat .cel { height: 26px; border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 800; color: #fff; }
#view-inteligencia .bi-heat .jan { font-size: 10.5px; font-weight: 800; text-align: center; border-radius: 999px; padding: 4px 4px; background: var(--line2); color: var(--ink2); }
#view-inteligencia .bi-heat .jan.hot { background: var(--amber-l); color: var(--amber); }
#view-inteligencia .bi-drill { background: var(--bg); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin-top: 8px; font-size: 12.5px; }
#view-inteligencia .bi-scroll { overflow-x: auto; }
#view-inteligencia .bi-vazio { text-align: center; color: var(--ink2); padding: 26px 16px; max-width: 520px; margin: 0 auto; line-height: 1.5; font-size: 13px; }

/* ============================================================================
   Pós-venda migrada para o LAYOUT do protótipo F (tema ERP). As cores saem dos
   tokens do app (accent configurável), via uma "ponte" que mapeia os nomes de
   token do protótipo -> nomes do app. Tudo escopado em #view-posvenda: não vaza
   para as outras telas e não colide com as classes globais (.card/.btn/.st...).
   ============================================================================ */
#view-posvenda {
  --pri: var(--accent); --pri-d: var(--green-d); --pri-l: var(--green-l);
  --ink2: var(--ink-2); --ink3: var(--ink-3); --line2: var(--line-2);
  --amber: var(--warn); --amber-l: var(--warn-bg);
  --red: var(--danger); --red-l: var(--danger-bg); --sh: var(--shadow-sm);
}
/* Pós-venda segue o fundo global (--surface-2), escolhível em Config > Aparência > Cor de fundo.
   O tom que o dono gostou (#F4F6FA "Azulado") é a 1ª opção da paleta e vale para o app inteiro. */
/* full width, flush ao menu à esquerda: mesmo padrão de .busca-layout (22px 20px 60px, sem centralizar) */
#view-posvenda .resultados { max-width: none; margin: 0; padding: 22px 20px 60px; }
/* KPIs */
#view-posvenda .pv-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px,100%), 1fr)); gap: 12px; margin-bottom: 16px; }
#view-posvenda .kpi { background: var(--surface); border: 1px solid var(--line); border-radius: 13px; padding: 13px 15px; box-shadow: var(--sh); }
#view-posvenda .kpi .lb { display: flex; gap: 7px; align-items: center; font-size: 12px; font-weight: 700; color: var(--ink2); }
#view-posvenda .kpi .num { font-size: 22px; font-weight: 800; margin-top: 5px; font-variant-numeric: tabular-nums; color: var(--ink); }
#view-posvenda .kpi .num.money, #view-posvenda .kpi .num.ok { color: var(--green); }
#view-posvenda .kpi .num.warn { color: var(--amber); }
#view-posvenda .kpi .num.bad { color: var(--red); }
#view-posvenda .kpi .sb2 { font-size: 11.5px; color: var(--ink3); margin-top: 1px; }
/* abas em pílula */
#view-posvenda .pv-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; border-bottom: 0; }
#view-posvenda .pv-tab { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: 7px 15px; font-weight: 700; font-size: 12.5px; color: var(--ink2); cursor: pointer; margin: 0; }
#view-posvenda .pv-tab.on { background: var(--pri-l); color: var(--pri); border-color: transparent; }
#view-posvenda .pv-tab:hover { color: var(--ink); }
/* barra de ações + botões (padrão do protótipo) */
#view-posvenda .pv-bar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
#view-posvenda .pv-hint { color: var(--ink3); font-size: 11.5px; flex-basis: 100%; margin-top: 2px; }
#view-posvenda .btn { border: 1px solid var(--line); background: var(--surface); border-radius: 9px; padding: 9px 14px; font-weight: 700; font-size: 13px; cursor: pointer; color: var(--ink2); display: inline-flex; align-items: center; gap: 7px; }
#view-posvenda .btn:hover { border-color: var(--pri); color: var(--pri); }
#view-posvenda .btn.pri { background: var(--pri); color: #fff; border-color: var(--pri); }
#view-posvenda .btn.pri:hover { background: var(--pri-d); color: #fff; }
#view-posvenda .btn.sm { padding: 6px 10px; font-size: 12px; }
#view-posvenda .btn[disabled] { opacity: .6; cursor: default; }
#view-posvenda .pill-on { display: inline-flex; align-items: center; gap: 7px; background: var(--green-l); color: var(--green); border-radius: 999px; padding: 5px 11px; font-size: 12px; font-weight: 700; white-space: nowrap; }
#view-posvenda .pv-saude { display: inline-flex; align-items: center; gap: 6px; background: var(--green-l); color: var(--green); border-radius: 999px; padding: 5px 11px; font-size: 12px; font-weight: 700; white-space: nowrap; }
#view-posvenda .pv-saude.instavel { background: var(--amber-l); color: var(--amber); }
#view-posvenda .pill-on .d { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
/* card + tabela */
#view-posvenda .card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--sh); overflow: hidden; margin-bottom: 16px; }
#view-posvenda .card-h { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); font-weight: 800; font-size: 13.5px; flex-wrap: wrap; }
#view-posvenda .card-h .sp { margin-left: auto; }
#view-posvenda .card-b { padding: 14px 16px; }
#view-posvenda table { width: 100%; border-collapse: collapse; }
#view-posvenda thead th { text-align: left; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: var(--ink3); padding: 11px 14px; border-bottom: 1px solid var(--line); }
#view-posvenda th.r, #view-posvenda td.r { text-align: right; }
#view-posvenda tbody td { padding: 12px 14px; border-bottom: 1px solid var(--line2); font-size: 13px; vertical-align: middle; }
#view-posvenda tbody tr:hover { background: var(--surface-2); }
#view-posvenda tbody tr:last-child td { border-bottom: none; }
#view-posvenda tbody tr.clk { cursor: pointer; }
/* status pills / sub / valor */
#view-posvenda .st { font-size: 10px; font-weight: 800; border-radius: 999px; padding: 2px 8px; text-transform: uppercase; letter-spacing: .3px; display: inline-block; }
#view-posvenda .st.g { background: var(--green-l); color: var(--green); }
#view-posvenda .st.b { background: var(--pri-l); color: var(--pri); }
#view-posvenda .st.a { background: var(--amber-l); color: var(--amber); }
#view-posvenda .st.r { background: var(--red-l); color: var(--red); }
#view-posvenda .op-sub { font-size: 12px; color: var(--ink2); margin-top: 2px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
#view-posvenda .op-tit { font-weight: 700; color: var(--ink); line-height: 1.3; }
#view-posvenda .val { font-weight: 800; }
#view-posvenda .tnum { font-variant-numeric: tabular-nums; }
#view-posvenda .dim { color: var(--ink3); }
/* editor: seções e campos */
#view-posvenda .sec { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--sh); margin-bottom: 14px; overflow: hidden; }
#view-posvenda .sec-h { display: flex; align-items: center; gap: 9px; padding: 14px 18px 0; font-weight: 800; font-size: 14px; }
#view-posvenda .sec-h .n { width: 24px; height: 24px; border-radius: 8px; background: var(--pri-l); color: var(--pri); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 12px; }
#view-posvenda .sec-b { padding: 12px 18px 16px; }
#view-posvenda .frow { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
#view-posvenda .frow.um { grid-template-columns: 1fr; }
#view-posvenda .fld label { display: block; font-size: 12px; font-weight: 700; color: var(--ink2); margin: 8px 0 5px; }
#view-posvenda .fld input, #view-posvenda .fld select, #view-posvenda .fld textarea { width: 100%; border: 1px solid var(--line); background: var(--surface-2); border-radius: 9px; padding: 9px 11px; font-size: 13px; color: var(--ink); outline: none; font-family: inherit; }
#view-posvenda .fld input:focus, #view-posvenda .fld select:focus, #view-posvenda .fld textarea:focus { border-color: var(--pri); }
/* radar de renovação / funil de empenhos / lista / alerta / add rápido */
#view-posvenda .pv-radar { display: flex; gap: 10px; flex-wrap: wrap; }
#view-posvenda .pv-radar-c { flex: 1 1 300px; min-width: 260px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 13px; }
#view-posvenda .pv-radar-o { font-size: 12px; color: var(--ink3); margin: 3px 0 8px; }
#view-posvenda .pv-funil-row { display: flex; align-items: center; gap: 10px; margin: 9px 0; }
#view-posvenda .pv-funil-k { width: 96px; font-size: 12.5px; font-weight: 700; color: var(--ink2); }
#view-posvenda .pv-funil-bar { flex: 1; height: 12px; border-radius: 999px; background: var(--line2); overflow: hidden; }
#view-posvenda .pv-funil-bar i { display: block; height: 100%; border-radius: 999px; }
#view-posvenda .pv-funil-v { width: 130px; text-align: right; font-weight: 800; font-variant-numeric: tabular-nums; }
#view-posvenda .pv-li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 2px; border-bottom: 1px solid var(--line2); font-size: 13px; }
#view-posvenda .pv-li:last-child { border-bottom: 0; }
#view-posvenda .pv-li-rm { border: 0; background: none; color: var(--ink3); cursor: pointer; font-size: 13px; padding: 2px 7px; border-radius: 6px; }
#view-posvenda .pv-li-rm:hover { color: var(--red); background: var(--red-l); }
#view-posvenda .pv-alerta { display: flex; gap: 11px; background: var(--amber-l); border: 1px solid var(--warn); border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; font-size: 13px; }
#view-posvenda .pv-add { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; align-items: center; }
#view-posvenda .pv-add input, #view-posvenda .pv-add select { border: 1px solid var(--line); background: var(--surface-2); border-radius: 8px; padding: 7px 9px; font-size: 12.5px; flex: 1 1 130px; min-width: 100px; color: var(--ink); font-family: inherit; }
#view-posvenda .pv-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
#view-posvenda .pv-chip { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: 5px 12px; font-size: 12px; font-weight: 700; color: var(--ink2); cursor: pointer; }
#view-posvenda .pv-chip.on { background: var(--pri-l); color: var(--pri); border-color: transparent; }
#view-posvenda .pv-saldo-mini { height: 6px; border-radius: 999px; background: var(--line2); overflow: hidden; margin: 4px 0; }
#view-posvenda .pv-saldo-mini > span { display: block; height: 100%; background: var(--green); border-radius: 999px; }
/* entregas: cards com stepper, ladrilhados */
#view-posvenda .pv-ent-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(380px,100%), 1fr)); gap: 12px; align-items: start; }
#view-posvenda .pv-ent-card { background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--pri); border-radius: 12px; padding: 12px 14px; box-shadow: var(--sh); }
#view-posvenda .pv-step { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 9px 0; }
#view-posvenda .pv-step-i { font-size: 11.5px; font-weight: 700; color: var(--ink3); display: inline-flex; gap: 4px; align-items: center; }
#view-posvenda .pv-step-i.on { color: var(--green); }
#view-posvenda .pv-step-sep { color: var(--ink3); opacity: .5; }
/* bom pagador: métricas em blocos (reusa .ed-fatos do editor de edital) */
#view-posvenda .pv-selo { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: 12.5px; border-radius: 999px; padding: 4px 12px; white-space: nowrap; }
#view-posvenda .pv-selo.v { background: var(--green-l); color: var(--green); }
#view-posvenda .pv-selo.a { background: var(--amber-l); color: var(--amber); }
#view-posvenda .pv-selo.r { background: var(--red-l); color: var(--red); }
#view-posvenda .pv-selo.c { background: var(--surface-2); color: var(--ink3); border: 1px solid var(--line); }
#view-posvenda .pv-pag-metr { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
#view-posvenda .pv-pag-metr > div { background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px; padding: 9px 13px; min-width: 120px; }
#view-posvenda .pv-pag-metr small { display: block; font-size: 11px; color: var(--ink3); font-weight: 700; }
#view-posvenda .pv-pag-metr b { font-size: 15px; font-weight: 800; color: var(--ink); }
#view-posvenda .pv-busca-l { display: flex; align-items: center; gap: 8px; max-width: 380px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; color: var(--ink3); }
#view-posvenda .pv-busca-l input { border: 0; background: none; outline: none; flex: 1; color: var(--ink); font-size: 13px; font-family: inherit; }

/* ============================================================================
   MONITORAR V2 (Chat do Pregoeiro) migrada para o LAYOUT do protótipo F. Mesma
   ponte de tokens do Pós-venda: as classes do protótipo (.mn-*, .card/.card-h,
   .st, .btn, .kpi) escopadas em #view-monitorar puxam as cores dos tokens reais
   do app (accent configurável, claro/escuro). A mini-vigia é global (flutua sobre
   qualquer tela). O overlay #alarme já existe (seção "Alarme insistente").
   ============================================================================ */
#view-monitorar {
  --pri: var(--accent); --pri-d: var(--green-d); --pri-l: var(--green-l);
  --ink2: var(--ink-2); --ink3: var(--ink-3); --line2: var(--line-2); --bg: var(--surface-2);
  --amber: var(--warn); --amber-l: var(--warn-bg);
  --red: var(--danger); --red-l: var(--danger-bg); --sh: var(--shadow-sm);
}
#view-monitorar .resultados { max-width: none; margin: 0; padding: 22px 20px 60px; }
/* KPIs */
#view-monitorar .mn-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px,100%), 1fr)); gap: 12px; margin-bottom: 16px; }
#view-monitorar .kpi { background: var(--surface); border: 1px solid var(--line); border-radius: 13px; padding: 13px 15px; box-shadow: var(--sh); }
#view-monitorar .kpi .lb { font-size: 12px; font-weight: 700; color: var(--ink2); }
#view-monitorar .kpi .num { font-size: 22px; font-weight: 800; margin-top: 5px; font-variant-numeric: tabular-nums; color: var(--ink); }
#view-monitorar .kpi .num.ok { color: var(--green); }
#view-monitorar .kpi .num.warn { color: var(--amber); }
#view-monitorar .kpi .num.bad { color: var(--red); }
#view-monitorar .kpi .sb2 { font-size: 11.5px; color: var(--ink3); margin-top: 1px; }
/* abas em pílula */
#view-monitorar .mn-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
#view-monitorar .mn-tab { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: 7px 15px; font-weight: 700; font-size: 12.5px; color: var(--ink2); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
#view-monitorar .mn-tab.on { background: var(--pri-l); color: var(--pri); border-color: transparent; }
#view-monitorar .mn-tab:hover { color: var(--ink); }
#view-monitorar .mn-tab .badge { margin-left: 2px; }
/* botões, cards, status, utilitários (mesmo vocabulário do protótipo) */
#view-monitorar .btn { border: 1px solid var(--line); background: var(--surface); border-radius: 9px; padding: 9px 14px; font-weight: 700; font-size: 13px; cursor: pointer; color: var(--ink2); display: inline-flex; align-items: center; gap: 7px; font-family: inherit; }
#view-monitorar .btn:hover { border-color: var(--pri); color: var(--pri); }
#view-monitorar .btn.pri { background: var(--pri); color: #fff; border-color: var(--pri); }
#view-monitorar .btn.pri:hover { background: var(--pri-d); color: #fff; }
#view-monitorar .btn.sm { padding: 6px 10px; font-size: 12px; }
#view-monitorar .card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--sh); overflow: hidden; margin-bottom: 16px; }
#view-monitorar .card-h { display: flex; align-items: center; gap: 8px; padding: 13px 16px; border-bottom: 1px solid var(--line); font-weight: 800; font-size: 13.5px; flex-wrap: wrap; }
#view-monitorar .card-h .sp { margin-left: auto; }
#view-monitorar .card-b { padding: 14px 16px; }
#view-monitorar .st { font-size: 10px; font-weight: 800; border-radius: 999px; padding: 2px 8px; letter-spacing: .2px; white-space: nowrap; display: inline-block; }
#view-monitorar .st.g { background: var(--green-l); color: var(--green); }
#view-monitorar .st.b { background: var(--pri-l); color: var(--pri); }
#view-monitorar .st.a { background: var(--amber-l); color: var(--amber); }
#view-monitorar .st.r { background: var(--red-l); color: var(--red); }
#view-monitorar .op-sub { font-size: 12px; color: var(--ink2); display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
#view-monitorar .dim { color: var(--ink3); }
#view-monitorar .tnum { font-variant-numeric: tabular-nums; }
#view-monitorar .sel { width: 100%; border: 1px solid var(--line); background: var(--surface-2); border-radius: 9px; padding: 8px 11px; font-size: 13px; color: var(--ink); font-family: inherit; }
/* faixa de aviso (buraco / captura caiu) */
#view-monitorar .pv-alerta { display: flex; gap: 11px; align-items: flex-start; background: var(--amber-l); border: 1px solid var(--warn); border-left: 4px solid var(--warn); border-radius: 12px; padding: 11px 14px; margin-bottom: 14px; font-size: 13px; }
#view-monitorar .pv-alerta.forte { background: var(--danger-bg); border-color: var(--danger); border-left-color: var(--danger); }
/* AO VIVO: grade lista de sessões + painel do chat */
#view-monitorar .mn-grid { display: grid; grid-template-columns: 320px 1fr; gap: 14px; align-items: start; }
#view-monitorar .mn-sess { background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--green); border-radius: 12px; padding: 11px 13px; cursor: pointer; box-shadow: var(--sh); }
#view-monitorar .mn-sess:hover { border-color: var(--pri); border-left-color: var(--green); }
#view-monitorar .mn-sess.sel { outline: 2px solid var(--pri); outline-offset: 1px; }
#view-monitorar .mn-sess.instavel { border-left-color: var(--amber); }
#view-monitorar .mn-sess.caiu { border-left-color: var(--red); }
/* X de remover a sessão, no card do Ao vivo (discreto; fica vermelho no hover) */
#view-monitorar .mn-sess-x { border: 0; background: none; color: var(--ink3); cursor: pointer; font-size: 12px; line-height: 1; padding: 3px 6px; border-radius: 6px; flex-shrink: 0; font-family: inherit; }
#view-monitorar .mn-sess-x:hover { background: var(--red-l); color: var(--red); }
#view-monitorar .mn-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); display: inline-block; animation: mnPulse 1.6s infinite; flex-shrink: 0; }
@keyframes mnPulse { 0% { box-shadow: 0 0 0 0 rgba(22,163,74,.45); } 70% { box-shadow: 0 0 0 7px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
#view-monitorar .mn-chat { max-height: 460px; overflow-y: auto; display: flex; flex-direction: column; gap: 7px; padding: 2px; }
#view-monitorar .mn-m { display: flex; gap: 9px; font-size: 12.5px; align-items: flex-start; padding: 3px 4px; }
#view-monitorar .mn-m .h { color: var(--ink3); font-size: 11px; min-width: 40px; padding-top: 2px; font-variant-numeric: tabular-nums; }
#view-monitorar .mn-m .who { font-weight: 800; font-size: 10.5px; border-radius: 6px; padding: 2px 8px; flex-shrink: 0; }
#view-monitorar .mn-m .who.preg { background: var(--pri-l); color: var(--pri); }
#view-monitorar .mn-m .who.sis { background: var(--surface-2); color: var(--ink3); border: 1px solid var(--line); }
#view-monitorar .mn-m .who.forn { background: var(--green-l); color: var(--green-d); }
#view-monitorar .mn-m .tx { flex: 1; line-height: 1.5; }
#view-monitorar .mn-m.critico { background: var(--red-l); border: 1px solid var(--danger); border-left: 3px solid var(--red); border-radius: 10px; padding: 9px 11px; }
#view-monitorar .mn-m.nos { background: var(--pri-l); border: 1px solid var(--pri); border-left: 3px solid var(--pri); border-radius: 10px; padding: 9px 11px; }
#view-monitorar .mn-m.nos.critico { background: var(--red-l); border-color: var(--danger); border-left-color: var(--danger); }
#view-monitorar .mn-item { display: inline-block; font-size: 10px; font-weight: 800; background: var(--surface-2); color: var(--ink2); border: 1px solid var(--line); border-radius: 6px; padding: 1px 6px; margin-right: 2px; }
#view-monitorar .mn-orig { font-size: 11px; opacity: .7; cursor: help; }   /* selo de procedencia da mensagem */
/* era da fonte oficial: faixa de fontes por portal + capturador recolhido como legado */
#view-monitorar .mn-fontes { font-size: 11.5px; color: var(--ink2); background: var(--surface-2); border: 1px dashed var(--line); border-radius: 10px; padding: 8px 11px; line-height: 1.55; margin-top: 10px; }
#view-monitorar .mn-legado { border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); padding: 8px 11px; }
#view-monitorar .mn-legado > summary { cursor: pointer; font-size: 12px; font-weight: 700; color: var(--ink2); list-style: none; }
#view-monitorar .mn-legado > summary::-webkit-details-marker { display: none; }
#view-monitorar .mn-legado > summary::before { content: "▸ "; color: var(--ink3); }
#view-monitorar .mn-legado[open] > summary::before { content: "▾ "; }
/* chip de fase (anonimato x reveladas) + chip de motor (dado/tela/aviso) */
#view-monitorar .mn-fase { font-size: 10.5px; font-weight: 800; border-radius: 7px; padding: 3px 9px; white-space: nowrap; }
#view-monitorar .mn-fase.lances { background: var(--amber-l); color: var(--amber); }
#view-monitorar .mn-fase.julg { background: var(--green-l); color: var(--green-d); }
#view-monitorar .mn-fase.ind { background: var(--surface-2); color: var(--ink3); border: 1px solid var(--line); }
#view-monitorar .mn-motor { font-size: 10px; font-weight: 800; border-radius: 6px; padding: 2px 7px; white-space: nowrap; }
#view-monitorar .mn-motor.dado { background: var(--pri-l); color: var(--pri); }
#view-monitorar .mn-motor.tela { background: var(--amber-l); color: var(--amber); }
#view-monitorar .mn-motor.aviso { background: var(--surface-2); color: var(--ink3); border: 1px solid var(--line); }
#view-monitorar .mn-nota { font-size: 11.5px; color: var(--ink2); background: var(--amber-l); border: 1px solid var(--line2); border-left: 3px solid var(--amber); border-radius: 9px; padding: 8px 11px; margin-top: 9px; line-height: 1.5; }
#view-monitorar .mn-onb { border: 1px dashed var(--line); border-radius: 12px; padding: 18px 20px; background: var(--surface-2); }
#view-monitorar .mn-onb b { font-size: 14px; display: block; margin-bottom: 8px; }
#view-monitorar .mn-onb ol { margin: 0 0 10px; padding-left: 20px; font-size: 12.5px; line-height: 1.7; color: var(--ink2); }
#view-monitorar .mn-foot { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; border-top: 1px solid var(--line2); padding-top: 11px; margin-top: 11px; }
/* Diário (eventos) + Vigiadas (watchlist) + Regras */
#view-monitorar table { width: 100%; border-collapse: collapse; }
#view-monitorar thead th { text-align: left; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: var(--ink3); padding: 11px 14px; border-bottom: 1px solid var(--line); }
#view-monitorar th.r, #view-monitorar td.r { text-align: right; }
#view-monitorar tbody td { padding: 11px 14px; border-bottom: 1px solid var(--line2); font-size: 13px; vertical-align: middle; }
#view-monitorar tbody tr:hover { background: var(--surface-2); }
#view-monitorar tbody tr:last-child td { border-bottom: none; }
#view-monitorar .mn-ev { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 4px; border-bottom: 1px solid var(--line2); font-size: 13px; }
#view-monitorar .mn-ev:last-child { border-bottom: 0; }
#view-monitorar .mn-ev.novo { border-left: 3px solid var(--pri); padding-left: 9px; }
#view-monitorar .tglrow { display: flex; align-items: flex-start; gap: 11px; padding: 9px 0; }
#view-monitorar .tglrow small { display: block; color: var(--ink3); font-size: 12px; margin-top: 2px; }
#view-monitorar .tgl { width: 40px; height: 22px; border-radius: 999px; border: 0; background: var(--line); position: relative; cursor: pointer; flex-shrink: 0; transition: background var(--t); }
#view-monitorar .tgl::after { content: ""; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform var(--t); }
#view-monitorar .tgl.on { background: var(--pri); }
#view-monitorar .tgl.on::after { transform: translateX(18px); }
#view-monitorar .duas { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
#view-monitorar .sec { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--sh); overflow: hidden; }
#view-monitorar .sec-h { display: flex; align-items: center; gap: 9px; padding: 14px 18px 6px; font-weight: 800; font-size: 14px; }
#view-monitorar .sec-h .n { width: 24px; height: 24px; border-radius: 8px; background: var(--pri-l); color: var(--pri); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 12px; }
#view-monitorar .sec-b { padding: 6px 18px 16px; }
#view-monitorar .fld label { display: block; font-size: 12px; font-weight: 700; color: var(--ink2); margin: 8px 0 5px; }
#view-monitorar .fld select { width: 100%; border: 1px solid var(--line); background: var(--surface-2); border-radius: 9px; padding: 9px 11px; font-size: 13px; color: var(--ink); font-family: inherit; }
@media (max-width: 820px) {
  #view-monitorar .mn-grid { grid-template-columns: 1fr; }
  #view-monitorar .duas { grid-template-columns: 1fr; }
}
/* Janelinha flutuante do vigia (mini-vigia): global, flutua sobre qualquer tela */
.mini-vigia { position: fixed; right: 18px; bottom: 18px; width: 300px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-lift); z-index: 85; display: none; overflow: hidden; }
.mini-vigia.on { display: block; }
.mini-vigia .mv-h { display: flex; align-items: center; gap: 7px; padding: 9px 12px; background: var(--accent); color: #fff; cursor: grab; font-weight: 800; font-size: 12.5px; user-select: none; touch-action: none; }
.mini-vigia .mv-h:active { cursor: grabbing; }
.mini-vigia .mv-h .sp { margin-left: auto; }
.mini-vigia .mv-h button { border: 0; background: rgba(255,255,255,.2); color: #fff; width: 22px; height: 22px; border-radius: 6px; cursor: pointer; font-size: 11px; line-height: 1; flex-shrink: 0; }
.mini-vigia .mv-h button:hover { background: rgba(255,255,255,.34); }
.mini-vigia .mv-b { padding: 9px 11px; display: flex; flex-direction: column; gap: 7px; max-height: 340px; overflow-y: auto; }
.mini-vigia.min .mv-b { display: none; }
.mini-vigia .mv-s { display: flex; align-items: center; gap: 8px; font-size: 12px; border: 1px solid var(--line-2); border-radius: 9px; padding: 6px 9px; cursor: pointer; background: var(--surface); color: var(--ink); }
.mini-vigia .mv-s:hover { border-color: var(--accent); }
.mini-vigia .mv-s .nm { font-weight: 700; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-vigia .mv-s small { color: var(--ink-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.mini-vigia .mv-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.mini-vigia .mv-dot.vivo { background: var(--green); animation: mnPulse 1.6s infinite; }
.mini-vigia .mv-dot.instavel { background: var(--warn); }
.mini-vigia .mv-dot.caiu { background: var(--danger); }
.mini-vigia .mv-inc { color: var(--danger); font-weight: 800; margin-right: 3px; }
.mini-vigia .mv-ev { font-size: 11.5px; color: var(--ink-2); border-left: 3px solid var(--warn); background: var(--warn-bg); border-radius: 8px; padding: 6px 9px; }
.mini-vigia .mv-alarme { font-size: 12px; font-weight: 800; color: #fff; background: var(--danger); border-radius: 9px; padding: 8px 10px; text-align: center; cursor: pointer; }

.link-filtros { display: inline-block; margin-top: 12px; color: #cdeadd; font-size: 14px; font-weight: 600; }
.link-filtros:hover { color: #fff; }

/* ===================== Filtros ===================== */
.filtros {
  max-width: 980px; margin: 18px auto 0; background: var(--surface); color: var(--ink);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: 22px;
  text-align: left; display: none;
}
.filtros.open { display: block; }
.filtro-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 26px; }
.filtro-bloco label { display: block; font-size: 13px; font-weight: 700; color: var(--ink-2); margin-bottom: 8px; }
.filtro-bloco select, .filtro-bloco input {
  width: 100%; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: 9px; font-size: 14px; color: var(--ink); background: var(--surface);
}
.pill-group { display: flex; flex-wrap: wrap; gap: 7px; }
.pill {
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
  padding: 7px 12px; border-radius: 20px; font-size: 13px; cursor: pointer; user-select: none;
}
.pill:hover { border-color: var(--green); }
.pill.on { background: var(--green); border-color: var(--green); color: #fff; font-weight: 600; }

.uf-bloco { margin-top: 22px; }
.uf-group { display: flex; flex-wrap: wrap; gap: 6px; }
.uf {
  width: 42px; text-align: center; border: 1px solid var(--line); background: var(--surface);
  padding: 7px 0; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--ink-2);
}
.uf:hover { border-color: var(--green); }
.uf.on { background: var(--teal); border-color: var(--teal); color: #fff; }
.uf-actions { margin-top: 10px; display: flex; gap: 16px; }
.uf-actions a { font-size: 13px; }

/* Filtro por nota CAPAG: pílulas de nível (mesma mecânica das de UF, com a cor da nota) */
.capag-group { display: flex; flex-wrap: wrap; gap: 6px; }
.cg-pill {
  border: 1px solid var(--line); background: var(--surface); padding: 7px 12px;
  border-radius: 8px; font-size: 13px; font-weight: 700; cursor: pointer; color: var(--ink-2);
}
.cg-pill:hover { border-color: var(--green); }
.cg-pill.on { color: #fff; }
.cg-pill.cg-a.on { background: #0f7a38; border-color: #0f7a38; }
.cg-pill.cg-b.on { background: #1d5ea8; border-color: #1d5ea8; }
.cg-pill.cg-c.on { background: #92660a; border-color: #92660a; }
/* hex FIXO (como os três acima) de propósito: os tokens --danger/--ink-2 clareiam no tema
   escuro e o texto branco sumiria em cima deles. */
.cg-pill.cg-d.on { background: #b02a2a; border-color: #b02a2a; }
.cg-pill.cg-sem.on { background: #55635c; border-color: #55635c; }

.extra-bloco { margin-top: 22px; }
.extra-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.extra-grid label { display: block; font-size: 13px; font-weight: 700; color: var(--ink-2); margin-bottom: 6px; }
.extra-grid input {
  width: 100%; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: 9px; font-size: 14px; color: var(--ink); background: var(--surface);
}
.filtro-hint { font-size: 12.5px; color: var(--ink-3); margin: 12px 0 0; }
@media (max-width: 720px) { .extra-grid { grid-template-columns: 1fr 1fr; } }

/* Período do intervalo (abertura/publicação) + atalhos de publicação */
.periodo-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px 24px; margin-bottom: 16px; }
.periodo-campo label { display: block; font-size: 13px; font-weight: 700; color: var(--ink-2); margin-bottom: 6px; }
.periodo-atalhos { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.atalhos-lbl { font-size: 13px; font-weight: 700; color: var(--ink-3); }
.preset { font: inherit; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); padding: 6px 12px; border-radius: 20px; font-size: 13px; cursor: pointer; }
.preset:hover { border-color: var(--green); color: var(--green); }

/* ===================== Busca: sidebar de filtros (acordeões) + resultados ===================== */
.busca-layout { max-width: 1480px; margin: 0 auto; display: grid; grid-template-columns: 300px 1fr; gap: 22px; padding: 22px 20px 60px; align-items: start; }
.busca-main { min-width: 0; }

.filtros-side { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; overflow: hidden auto; max-height: calc(100vh - 96px); box-shadow: var(--shadow); position: sticky; top: 76px; text-align: left; }
.filtros-side-head { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border-bottom: 1px solid var(--line); background: #fafbfa; position: sticky; top: 0; z-index: 3; }
.filtros-side-title { font-size: 13px; font-weight: 800; color: var(--ink); }
.filtros-side-head-right { display: flex; align-items: center; gap: 12px; }
.link-limpar-side { font-size: 11.5px; font-weight: 700; color: var(--ink-3); cursor: pointer; }
.link-limpar-side:hover { color: var(--danger); }
.filtros-side-close { display: none; border: 0; background: var(--surface-2); color: var(--ink-2); width: 30px; height: 30px; border-radius: 8px; font-size: 15px; cursor: pointer; align-items: center; justify-content: center; }
.filtros-side-close:hover { background: #e6ece9; color: var(--ink); }

.acc { border-bottom: 1px solid var(--line); }
.acc:last-of-type { border-bottom: 0; }
.acc-head { display: flex; align-items: center; gap: 9px; width: 100%; padding: 12px 16px; cursor: pointer; background: var(--surface); border: 0; text-align: left; font-family: inherit; }
.acc-head:hover { background: #fafbfa; }
.acc-ico { font-size: 15px; flex-shrink: 0; opacity: .85; }
.acc-title { flex: 1; font-size: 13px; font-weight: 700; color: var(--ink); }
.acc-count { background: var(--green); color: #fff; border-radius: 12px; min-width: 18px; height: 18px; padding: 0 6px; font-size: 11px; font-weight: 800; display: none; align-items: center; justify-content: center; }
.acc-count.show { display: inline-flex; }
.acc-arrow { font-size: 10px; color: var(--ink-3); flex-shrink: 0; transition: transform .22s ease; }
.acc.open .acc-arrow { transform: rotate(180deg); }
.acc-body { max-height: 0; overflow: hidden; transition: max-height .26s cubic-bezier(.4,0,.2,1); }
.acc.open .acc-body { max-height: 640px; }
.acc-inner { padding: 4px 16px 16px; }
.acc-lbl { display: block; font-size: 12px; font-weight: 700; color: var(--ink-3); margin: 0 0 5px; }
.acc-inner .periodo-atalhos { margin: 10px 0 0; }
.acc-inner input, .acc-select { width: 100%; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; font-size: 13.5px; color: var(--ink); background: var(--surface); font-family: inherit; }
.acc-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.filtros-side .uf { width: 38px; padding: 6px 0; font-size: 12px; }
.filtros-side-foot { padding: 12px 16px; border-top: 1px solid var(--line); background: #fafbfa; position: sticky; bottom: 0; }
.btn-aplicar-filtros { width: 100%; background: var(--green); color: #fff; border: 0; border-radius: 9px; padding: 10px; font-size: 13.5px; font-weight: 700; cursor: pointer; font-family: inherit; }
.btn-aplicar-filtros:hover { background: var(--green-d); }

/* Barra mobile + overlay do drawer: escondidos no desktop */
.filtros-mobilebar { display: none; }
.filtros-overlay { display: none; }

/* ===== Mobile (≤820px): a sidebar vira drawer deslizante da esquerda ===== */
@media (max-width: 820px) {
  .topbar { position: static; }
  .busca-layout { grid-template-columns: 1fr; padding-top: 0; }

  .filtros-mobilebar { display: flex; align-items: center; gap: 10px; position: sticky; top: 0; z-index: 45; background: var(--surface); border-bottom: 1px solid var(--line); padding: 10px 16px; box-shadow: 0 2px 8px rgba(11,61,53,.06); }
  .btn-filtros-mobile { display: inline-flex; align-items: center; gap: 8px; background: var(--green); color: #fff; border: 0; border-radius: 10px; padding: 10px 16px; font-size: 14px; font-weight: 700; cursor: pointer; font-family: inherit; }
  .btn-filtros-mobile .filtros-badge { background: rgba(255,255,255,.28); border-radius: 11px; min-width: 20px; height: 20px; padding: 0 6px; font-size: 12px; font-weight: 800; display: none; align-items: center; justify-content: center; }
  .btn-filtros-mobile .filtros-badge.show { display: inline-flex; }

  .filtros-overlay { display: block; position: fixed; inset: 0; z-index: 90; background: rgba(7,28,22,.45); opacity: 0; pointer-events: none; transition: opacity .28s ease; }
  .filtros-overlay.open { opacity: 1; pointer-events: auto; }

  .filtros-side { position: fixed; top: 0; left: 0; bottom: 0; z-index: 100; width: 86%; max-width: 360px; max-height: none; border-radius: 0; border: 0; box-shadow: 8px 0 32px rgba(7,28,22,.18); overflow-y: auto; transform: translateX(-100%); transition: transform .3s cubic-bezier(.4,0,.2,1); }
  .filtros-side.open { transform: translateX(0); }
  .filtros-side-head { position: sticky; top: 0; z-index: 2; }
  .filtros-side-foot { position: sticky; bottom: 0; }
  .filtros-side-close { display: flex; }
  .acc.open .acc-body { max-height: 1200px; }
}

/* ===================== Filtros aplicados ===================== */
.aplicados-wrap {
  display: flex; align-items: center; gap: 10px; margin: 0 0 14px;
  flex-wrap: wrap; color: var(--ink-3); font-size: 13px;
}
.aplicados-label { font-size: 12.5px; color: var(--ink-3); font-weight: 700; white-space: nowrap; }
.aplicados { display: flex; gap: 7px; flex-wrap: wrap; }
.aplicados .tag {
  background: #edf8f2; color: var(--green-d); border: 1px solid #c3e6cc; border-radius: 16px;
  padding: 4px 10px; font-size: 12.5px; display: inline-flex; gap: 6px; align-items: center;
}
.aplicados .tag button { border: 0; background: none; color: var(--green-d); cursor: pointer; }
.link-limpar { color: #ffd9b0; font-weight: 600; }

/* ===================== Resultados ===================== */
.resultados { max-width: 980px; margin: 0 auto; padding: 26px 20px 60px; }
.busca-main .resultados { max-width: none; margin: 0; padding: 0; }
.result-info { color: var(--ink-2); font-size: 14px; margin-bottom: 14px; }
.result-info b { color: var(--ink); }
.info-warn { color: var(--warn); font-weight: 600; }
/* selo do indice local: a busca respondeu pelo nosso indice (cobertura total, imediata) */
.info-ok { color: var(--ok); font-weight: 600; }
/* "tentar de novo" dentro de um aviso: e um BOTAO (acao), mas com cara de link para nao
   competir com o botao principal da tela. Aparece quando o PNCP falhou em parte da consulta. */
.link-btn {
  background: none; border: 0; padding: 0 2px; margin: 0;
  color: inherit; font: inherit; font-weight: 700;
  text-decoration: underline; cursor: pointer;
}
.link-btn:hover { opacity: .8; }
.link-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }
.lista { display: flex; flex-direction: column; gap: 14px; }

.card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 18px 20px; box-shadow: var(--shadow-sm); cursor: pointer;
  transition: border-color var(--t), box-shadow var(--t), transform var(--t);
}
.card:hover { border-color: #d4e3dc; transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.card:active { transform: translateY(0); }
.card-top { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.card-titulo { color: var(--green-d); font-weight: 800; font-size: 15.5px; margin: 0; }
.card-fav {
  border: 1px solid var(--line); background: var(--surface); border-radius: 8px; padding: 6px 11px;
  font-size: 13px; font-weight: 600; color: var(--ink-2); cursor: pointer; white-space: nowrap;
}
.card-fav:hover { border-color: var(--green); color: var(--green-d); }
.card-fav.on { background: var(--warn-bg); border-color: #f59e0b; color: var(--warn); }
/* 💬 acompanhar o CHAT em 1 clique (irmão do ☆ Acompanhar, mas para o chat do pregoeiro) */
.card-chat {
  border: 1px solid var(--line); background: var(--surface); border-radius: 8px; padding: 6px 9px;
  font-size: 13px; line-height: 1; cursor: pointer; flex-shrink: 0;
}
.card-chat:hover { border-color: var(--pri); }
.card-chat.on { background: var(--pri-l); border-color: var(--pri); }
.card-chat:disabled { opacity: .5; cursor: default; }
.card-obj { color: var(--ink-2); font-size: 14px; margin: 8px 0 12px; }
.card-obj mark { background: #fde68a; color: inherit; padding: 0 2px; border-radius: 3px; }
/* "itens que casaram" no card (opção 2): fundo branco, 1 linha por item, palavra realçada */
.card-itens { margin: 8px 0 2px; font-size: 12.5px; color: var(--ink-2); background: var(--surface); border: 1px solid var(--line); border-radius: 9px; padding: 8px 11px; }
.card-itens .ci-lbl { display: block; font-weight: 800; color: var(--ink-3); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; margin-bottom: 3px; }
.card-itens .ci-it { display: block; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-itens .ci-meta { color: var(--ink-3); }
.card-itens .ci-mais { display: block; margin-top: 4px; color: var(--ink-3); font-size: 11.5px; }
.card-itens mark { background: #fde047; color: #111; font-weight: 700; padding: 0 3px; border-radius: 3px; }
.card-meta { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 13px; color: var(--ink-2); }
.card-meta .ico { opacity: .7; margin-right: 4px; }
.tags { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 12px; }
.tag-pill { display: inline-flex; align-items: center; font-size: 12px; line-height: 1.3; padding: 4px 10px; border-radius: 7px; font-weight: 600; }
.t-mod { background: var(--green-l); color: var(--green-d); }
.t-uf { background: #e6f0fb; color: #1d4ed8; }
.t-portal { background: #f3f0fb; color: #6d28d9; }
.t-status { background: var(--warn-bg); color: var(--warn); }
.t-prazo { background: var(--danger-bg); color: var(--danger); }
.t-prazo.ok { background: var(--green-l); color: var(--green-d); }

/* ===================== Estados ===================== */
.estado { text-align: center; padding: 50px 20px; color: var(--ink-2); }
.estado .dim { color: var(--ink-3); font-size: 14px; }
.hidden { display: none !important; }
.loading { display: flex; align-items: center; gap: 12px; justify-content: center; padding: 30px; color: var(--ink-2); }
.spinner {
  width: 22px; height: 22px; border: 3px solid var(--line); border-top-color: var(--green);
  border-radius: 50%; animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ===================== Paginação ===================== */
.paginacao { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 26px; }
.page-btn {
  border: 1px solid var(--line); background: var(--surface); color: var(--ink);
  padding: 9px 16px; border-radius: 9px; cursor: pointer; font-weight: 600; font-size: 14px;
}
.page-btn:hover:not(:disabled) { border-color: var(--green); color: var(--green-d); }
.page-btn:disabled { opacity: .4; cursor: default; }
.page-label { color: var(--ink-2); font-size: 14px; }
.page-tam-lbl { color: var(--ink-3); font-size: 13px; margin-left: 6px; }
.page-tam-sel {
  border: 1px solid var(--line); background: var(--surface); color: var(--ink);
  padding: 7px 10px; border-radius: 9px; font-size: 13.5px; font-weight: 600; cursor: pointer; font-family: inherit;
}
@media (max-width: 640px) { .paginacao { flex-wrap: wrap; row-gap: 10px; } }

/* ===================== Painel lateral ===================== */
.overlay { position: fixed; inset: 0; background: rgba(8,20,16,.5); z-index: 50; }
.painel {
  position: fixed; top: 0; right: 0; height: 100vh; width: var(--painel-w, 540px); max-width: 95vw;
  background: var(--surface); z-index: 60; box-shadow: -12px 0 40px rgba(0,0,0,.25);
  transform: translateX(100%); transition: transform .28s ease; overflow-y: auto;
}
.painel.open { transform: translateX(0); }
.painel.resizing { transition: none; }
body.painel-resizing { cursor: col-resize; user-select: none; }
/* Alça: arraste a borda esquerda do painel para alargar/estreitar */
.painel-resizer {
  position: fixed; top: 0; left: 0; width: 9px; height: 100%;
  cursor: col-resize; z-index: 4; touch-action: none;
}
.painel-resizer::before {
  content: ""; position: absolute; top: 0; left: 0; width: 3px; height: 100%;
  background: transparent; transition: background .15s;
}
.painel-resizer:hover::before,
.painel.resizing .painel-resizer::before { background: var(--green); }
.painel-close {
  position: absolute; top: 14px; right: 14px; z-index: 2;
  border: 0; background: var(--surface-2); width: 38px; height: 38px;
  border-radius: 10px; cursor: pointer; font-size: 16px; color: var(--ink-2);
}
.painel-close:hover { background: #e6ece9; }
.painel-conteudo { padding: 30px 28px 40px; }
.p-portal { display: inline-flex; align-items: center; gap: 7px; color: var(--ink-3); font-size: 13px; font-weight: 600; }
.p-orgao { font-size: 13px; color: var(--ink-2); font-weight: 700; margin: 14px 0 4px; letter-spacing: .02em; }
.p-numero { font-size: 13px; color: var(--ink-3); }
.p-objeto { font-size: 16px; font-weight: 700; color: var(--ink); margin: 16px 0; line-height: 1.5; }
.p-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin: 14px 0; }
.p-valor { background: var(--teal); color: #fff; border-radius: 9px; padding: 10px 14px; font-weight: 700; text-align: center; margin: 8px 0; }
.p-datas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 16px 0; }
.p-data-box { background: var(--surface-2); border-radius: 10px; padding: 12px 14px; }
.p-data-box .lbl { font-size: 12px; color: var(--ink-3); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.p-data-box .val { font-size: 15px; color: var(--ink); font-weight: 700; margin-top: 3px; }
.p-acoes { display: flex; gap: 10px; margin: 20px 0; }
.btn-acessar {
  flex: 1; text-align: center; background: var(--green); color: #fff !important; font-weight: 700;
  padding: 12px; border-radius: 10px; text-decoration: none !important;
}
.btn-acessar:hover { background: var(--green-d); }
.btn-fav-painel {
  border: 1px solid var(--line); background: var(--surface); border-radius: 10px; padding: 12px 16px;
  font-weight: 700; cursor: pointer; color: var(--ink-2);
}
.btn-fav-painel.on { background: var(--warn-bg); border-color: #f59e0b; color: var(--warn); }
.p-secao-titulo { font-size: 14px; font-weight: 800; color: var(--ink); margin: 26px 0 12px; border-top: 1px solid var(--line); padding-top: 18px; }
.item-row { border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin-bottom: 8px; }
.item-row .it-desc { font-size: 14px; color: var(--ink); font-weight: 600; }
.item-row .it-meta { font-size: 12.5px; color: var(--ink-2); margin-top: 4px; display: flex; flex-wrap: wrap; gap: 10px 18px; }
.p-vazio-itens { color: var(--ink-3); font-size: 14px; }

/* Busca/filtro dentro dos itens da contratação */
.itens-busca { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; margin-bottom: 12px; background: var(--surface); transition: border-color .15s, box-shadow .15s; }
.itens-busca:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px rgba(22,163,74,.1); }
.itens-busca-ico { font-size: 14px; opacity: .7; flex-shrink: 0; }
.itens-busca input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font-size: 14px; color: var(--ink); font-family: inherit; }
.itens-busca input::placeholder { color: var(--ink-3); }
.itens-busca-x { flex-shrink: 0; border: 0; background: var(--surface-2); color: var(--ink-2); border-radius: 6px; width: 24px; height: 24px; font-size: 13px; cursor: pointer; transition: background .12s, color .12s; }
.itens-busca-x:hover { background: #e9efec; color: var(--ink); }
.itens-contador { font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
.item-row mark { background: #fde68a; color: inherit; padding: 0 1px; border-radius: 2px; }

/* Gestão do processo (dentro do painel) */
.p-gestao-hint { font-size: 13.5px; color: var(--ink-2); background: var(--surface-2); border-radius: 10px; padding: 12px 14px; margin: 18px 0 0; }
.p-label { display: block; font-size: 12px; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; margin: 14px 0 5px; }
.p-select, .p-textarea {
  width: 100%; border: 1px solid var(--line); border-radius: 9px; padding: 10px 11px;
  font-size: 14px; color: var(--ink); font-family: inherit; background: var(--surface);
}
.p-textarea { min-height: 82px; resize: vertical; }
.p-salvo { font-size: 12px; color: var(--green-d); height: 16px; margin-top: 4px; }
.p-hist { margin-top: 14px; }
.p-hist-titulo { font-size: 12px; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 6px; }
.p-hist-item { font-size: 13px; color: var(--ink-2); padding: 3px 0; }
.p-hist-item .dim { color: var(--ink-3); font-size: 12px; }
.btn-remover {
  margin-top: 18px; width: 100%; border: 1px solid #f3c2c2; background: var(--danger-bg); color: var(--danger);
  border-radius: 10px; padding: 11px; font-weight: 700; cursor: pointer;
}
.btn-remover:hover { background: var(--danger-bg); }

/* ===================== Kanban ===================== */
.kanban-wrap { padding: 22px 20px 60px; overflow-x: auto; }
.kanban { display: flex; gap: 14px; align-items: flex-start; min-height: 55vh; }
.kanban-col {
  flex: 0 0 282px; width: 282px; background: var(--surface-2); border: 1px solid var(--line);
  border-radius: 12px; display: flex; flex-direction: column; max-height: 78vh; min-height: 340px;
  transition: background .12s, outline-color .12s;
}
.kanban-col.dragover { outline: 2px dashed var(--green); outline-offset: -3px; background: var(--green-l); }
.kanban-col-head { display: flex; justify-content: space-between; align-items: center; padding: 13px 14px 4px; }
.kc-nome { font-weight: 800; font-size: 14px; color: var(--ink); }
.kc-count { background: var(--teal); color: #fff; border-radius: 20px; font-size: 12px; font-weight: 700; padding: 1px 9px; }
.kc-soma { padding: 0 14px 10px; font-size: 12.5px; font-weight: 700; color: var(--green-d); }
.kc-soma.dim { color: var(--ink-3); font-weight: 500; }
.kanban-col-body { padding: 6px 10px 12px; overflow-y: auto; flex: 1; min-height: 120px; display: flex; flex-direction: column; }
.kc-placeholder {
  flex: 1; border: 2px dashed var(--line); border-radius: 10px; color: var(--ink-3);
  font-size: 13px; font-weight: 600; text-align: center; min-height: 120px;
  display: flex; align-items: center; justify-content: center; padding: 10px; transition: var(--t);
}
.kanban-col.dragover .kc-placeholder { border-color: var(--green); color: var(--green-d); background: rgba(25,184,122,.08); }
/* linha que mostra ONDE o card vai cair entre dois cards */
.kc-dropline { height: 3px; background: var(--green); border-radius: 3px; margin: 2px 2px 11px;
  box-shadow: 0 0 0 3px rgba(25,184,122,.18); }
.kanban-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 11px 12px;
  margin-bottom: 10px; cursor: grab; box-shadow: var(--shadow-sm);
}
.kanban-card:hover { border-color: var(--green); }
.kanban-card.dragging { opacity: .45; }
.kanban-card:active { cursor: grabbing; }
.kc-titulo { font-size: 11px; font-weight: 700; color: var(--green-d); text-transform: uppercase; letter-spacing: .02em; }
.kc-orgao { font-size: 13px; font-weight: 700; color: var(--ink); margin: 3px 0; line-height: 1.3; }
.kc-obj { font-size: 12.5px; color: var(--ink-2); line-height: 1.35; }
.kc-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 9px; gap: 6px; flex-wrap: wrap; }
.kc-valor { font-size: 12.5px; font-weight: 700; color: var(--ink); }
.kc-valor.dim { color: var(--ink-3); font-weight: 500; }
.kc-anot { margin-top: 9px; font-size: 12px; color: var(--ink-2); background: var(--surface-2); border-radius: 7px; padding: 6px 8px; }

/* ===================== Tela de login / cadastro ===================== */
.auth-screen {
  position: fixed; inset: 0; z-index: 100;
  background: linear-gradient(160deg, var(--teal-2) 0%, var(--teal) 100%);
  display: flex; align-items: center; justify-content: center; padding: 20px; overflow-y: auto;
}
.auth-card {
  background: var(--surface); width: 100%; max-width: 420px; border-radius: 16px;
  box-shadow: var(--shadow); padding: 30px 30px 22px; margin: auto;
}
.auth-brand { display: flex; align-items: baseline; gap: 7px; justify-content: center; }
.auth-brand .brand-mark { color: var(--accent); font-size: 20px; }
.auth-brand .brand-name { font-weight: 800; letter-spacing: .14em; font-size: 20px; color: var(--ink); }
.auth-brand .brand-sub { color: var(--green-d); font-weight: 600; font-size: 14px; }
.auth-tagline { text-align: center; color: var(--ink-3); font-size: 13.5px; margin: 6px 0 20px; }
.auth-tabs { display: flex; gap: 6px; background: var(--surface-2); border-radius: 10px; padding: 4px; margin-bottom: 20px; }
.auth-tab { flex: 1; border: 0; background: none; padding: 9px; border-radius: 8px; font-weight: 700; font-size: 14px; color: var(--ink-2); cursor: pointer; }
.auth-tab.active { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-sm); }
.auth-form label { display: block; font-size: 13px; font-weight: 700; color: var(--ink-2); margin: 12px 0 5px; }
.auth-form input[type=text], .auth-form input[type=email], .auth-form input[type=password] {
  width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 9px; font-size: 14px; color: var(--ink);
}
.auth-radios { display: flex; gap: 14px; margin: 16px 0 6px; flex-wrap: wrap; }
.auth-radio { font-size: 13.5px !important; font-weight: 600 !important; color: var(--ink-2); margin: 0 !important; display: flex; align-items: center; gap: 5px; cursor: pointer; }
.auth-erro { color: var(--danger); font-size: 13px; min-height: 18px; margin-top: 10px; }
.auth-btn { width: 100%; border: 0; background: var(--green); color: #fff; font-weight: 700; padding: 12px; border-radius: 10px; font-size: 15px; cursor: pointer; margin-top: 6px; }
.auth-btn:hover { background: var(--green-d); }
.auth-link { display: block; width: 100%; margin-top: 12px; background: none; border: 0; color: var(--green-d); font-weight: 600; font-size: 13px; cursor: pointer; text-align: center; padding: 4px; }
.auth-link:hover { text-decoration: underline; }
.auth-erro.ok { color: var(--green); }
.auth-aceite { display: flex; gap: 9px; align-items: flex-start; margin: 16px 0 4px; font-size: 13px !important; font-weight: 500 !important; color: var(--ink-2); cursor: pointer; }
/* Campo-isca do cadastro (antibot): sai do fluxo sem usar display:none nem visibility:hidden,
   que é o que robô mais experiente checa antes de preencher. Fica fora da tela para o olho e
   fora da tabulação/leitor pelo HTML (tabindex=-1 + aria-hidden). */
.hp-isca { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.auth-aceite input { margin-top: 2px; width: 16px; height: 16px; accent-color: var(--green); cursor: pointer; }
.auth-aceite a { color: var(--green-d); font-weight: 600; }

/* ===================== Cadastro em 4 etapas (Fatia 3) ===================== */
.reg-passos { display: flex; gap: 4px; list-style: none; margin: 0 0 18px; padding: 0; counter-reset: none; }
.reg-passos li { flex: 1; display: flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: var(--ink-3); border-top: 3px solid var(--line); padding-top: 7px; min-width: 0; }
.reg-passos li.atual, .reg-passos li.feito { color: var(--ink); border-top-color: var(--green); }
.rp-n { display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; border-radius: 50%; background: var(--line-2); color: var(--ink-2); font-size: 10px; flex: none; }
.reg-passos li.atual .rp-n, .reg-passos li.feito .rp-n { background: var(--green); color: #fff; }
.reg-linha { display: flex; gap: 8px; align-items: stretch; }
.reg-linha input { flex: 1; min-width: 0; }
.reg-btn-sec { border: 1px solid var(--line); background: var(--surface-2); color: var(--ink); font-weight: 700; font-size: 13.5px; padding: 10px 14px; border-radius: 10px; cursor: pointer; white-space: nowrap; }
.reg-btn-sec:hover { background: var(--line-2); }
.reg-btn-sec[disabled] { opacity: .55; cursor: progress; }
.reg-selo { margin-top: 10px; padding: 9px 11px; border-radius: 9px; font-size: 12.5px; font-weight: 600; line-height: 1.45; background: var(--surface-2); color: var(--ink-2); border: 1px solid var(--line); }
.reg-selo.ok { background: color-mix(in srgb, var(--green) 12%, transparent); border-color: var(--green); color: var(--green-d); }
.reg-selo.alerta { background: color-mix(in srgb, var(--warn) 15%, transparent); border-color: var(--warn); color: var(--ink); }
.reg-selo.erro { background: color-mix(in srgb, var(--danger) 12%, transparent); border-color: var(--danger); color: var(--danger); }
/* --ink-2 e não --ink-3: em tema claro o terciário dá 3,5:1 de contraste, abaixo dos 4,5:1
   da WCAG AA para texto normal. Aqui não é enfeite, é o texto que explica por que o nome da
   empresa faz o alarme tocar. */
.reg-dica { font-size: 12.5px; color: var(--ink-2); line-height: 1.5; margin: 12px 0 0; }
.reg-busca-area { width: 100%; margin: 8px 0 2px; }
/* Cabeçalho de família (Fatia 2): com dezenas de áreas, a lista corrida vira parede de texto.
   `position: sticky` mantém a família visível enquanto a pessoa rola dentro do grupo. */
.reg-fam { flex: none; position: sticky; top: 0; z-index: 1; background: var(--surface);
  font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em;
  color: var(--green-d); padding: 8px 2px 4px; border-bottom: 1px solid var(--line); margin-top: 6px; }
.reg-fam:first-child { margin-top: 0; }
.reg-areas { display: flex; flex-direction: column; gap: 6px; max-height: 46vh; overflow-y: auto; margin-top: 4px; }
/* flex-shrink: 0 é obrigatório aqui. Item de coluna flex encolhe por padrão, e com a lista
   maior que o max-height as linhas viram tiras de 2px (bug já visto no protótipo). */
.reg-area { display: flex; align-items: center; gap: 9px; flex: none; padding: 9px 11px; border: 1px solid var(--line); border-radius: 9px; font-size: 13.5px; color: var(--ink-2); cursor: pointer; background: var(--surface); }
.reg-area:hover { border-color: var(--green); }
.reg-area input { width: 16px; height: 16px; flex: none; accent-color: var(--green); cursor: pointer; }
.reg-area.on { border-color: var(--green); background: color-mix(in srgb, var(--green) 8%, transparent); color: var(--ink); font-weight: 600; }
.reg-area .ra-obj { display: block; font-size: 11.5px; color: var(--ink-3); font-weight: 400; margin-top: 1px; }
.reg-vitrine { display: flex; flex-direction: column; gap: 8px; max-height: 46vh; overflow-y: auto; }
.reg-ed { flex: none; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); }
.reg-ed-obj { font-size: 13px; font-weight: 600; color: var(--ink); line-height: 1.4; }
.reg-ed-meta { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; display: flex; gap: 10px; flex-wrap: wrap; }
.reg-ed-val { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--green-d); }
.reg-acoes { display: flex; gap: 8px; align-items: center; margin-top: 14px; }
.reg-acoes .auth-btn { margin-top: 0; }
.reg-acoes .reg-btn-sec { flex: none; }
@media (max-width: 460px) {
  .reg-passos li { font-size: 0; gap: 0; justify-content: center; }
  .rp-n { font-size: 10px; }
}

/* ===================== Alarme insistente do vigia (convocação / captura caiu) ===================== */
.alarme { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(120, 12, 12, .55); animation: alarmePisca 1s steps(2, end) infinite; }
@keyframes alarmePisca { 0% { background: rgba(150, 14, 14, .62); } 50% { background: rgba(80, 6, 6, .40); } }
.alarme-card { background: var(--surface); border: 3px solid var(--danger); border-radius: 16px; max-width: 460px; width: 94%; padding: 26px 24px; text-align: center; box-shadow: 0 22px 64px rgba(0, 0, 0, .5); }
.alarme-ic { font-size: 46px; line-height: 1; animation: alarmeShake .55s ease-in-out infinite; }
@keyframes alarmeShake { 0%, 100% { transform: rotate(-13deg); } 50% { transform: rotate(13deg); } }
.alarme-tit { font-size: 21px; font-weight: 800; color: var(--danger); margin: 10px 0 6px; }
.alarme-det { font-size: 14px; color: var(--ink-2); line-height: 1.5; margin-bottom: 18px; }
.alarme-acoes { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.alarme-btn { border: 0; background: var(--danger); color: #fff; font-weight: 800; font-size: 15px; padding: 13px 22px; border-radius: 11px; cursor: pointer; }
.alarme-btn:hover { filter: brightness(1.06); }
.alarme-btn.ghost { background: var(--surface-2); color: var(--ink); border: 1px solid var(--line); }
.alarme-sub { font-size: 12px; color: var(--ink-3); margin-top: 12px; }
.feed-pill.caiu { background: #fee2e2; color: #b91c1c; }
:root[data-theme="dark"] .feed-pill.caiu { background: #3a1414; color: #f9a8a8; }
@media (prefers-reduced-motion: reduce) { .alarme, .alarme-ic { animation: none; } }
.auth-rodape { text-align: center; color: var(--ink-3); font-size: 12px; margin: 18px 0 0; }

/* ===================== Caixa de usuário (topbar) ===================== */
.user-box { position: relative; }
.user-btn { display: flex; align-items: center; gap: 9px; background: var(--surface-2); border: 1px solid var(--line); color: var(--ink); border-radius: 10px; padding: 5px 10px; cursor: pointer; }
.user-btn:hover { background: var(--line-2); }
.user-avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--accent); color: #06281f; font-weight: 800; font-size: 13px; display: flex; align-items: center; justify-content: center; text-transform: uppercase; background-size: cover; background-position: center; }
.user-avatar.has-foto { color: transparent; }

/* Foto de perfil (seção em Configurações) */
.cfg-foto { display: flex; align-items: center; gap: 18px; margin-top: 8px; }
.cfg-foto-prev { width: 84px; height: 84px; border-radius: 50%; flex-shrink: 0; background-color: var(--teal); background-size: cover; background-position: center; color: #fff; font-size: 34px; font-weight: 800; display: flex; align-items: center; justify-content: center; text-transform: uppercase; border: 2px solid var(--line); box-shadow: var(--shadow-sm); }
.cfg-foto-acoes { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cfg-btn-foto { border: 1px solid var(--line); background: var(--surface); color: var(--ink); border-radius: 9px; padding: 8px 14px; font-weight: 700; cursor: pointer; font-size: 14px; }
.cfg-btn-foto:hover { border-color: var(--green); color: var(--green-d); }
.cfg-btn-foto.sec { color: var(--danger); }
.cfg-btn-foto.sec:hover { border-color: #f3c2c2; }
.cfg-foto-msg { font-size: 13px; color: var(--ink-3); }

/* ===== Verificação em duas etapas (segundo fator) =====================================
   Vale nos DOIS lugares: no cartão de login (segunda etapa) e na tela de Configurações. */
/* Campo de código: fonte tabular e espaçamento largo, porque a pessoa está COPIANDO
   dígitos de outra tela e precisa conferir um a um sem se perder. */
.cod-input { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 22px;
  letter-spacing: 6px; text-align: center; font-variant-numeric: tabular-nums; }
.auth-ajuda { font-size: 12.5px; color: var(--ink-2); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin-top: 10px; line-height: 1.5; }
.auth-ajuda code { font-size: 12px; background: var(--surface); padding: 1px 5px; border-radius: 5px; }

.tfa { font-size: 14px; }
.tfa-linha { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tfa-selo { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 12.5px;
  padding: 4px 10px; border-radius: 999px; }
.tfa-selo.on { background: var(--ok-bg); color: var(--ok); }
.tfa-selo.off { background: var(--surface-2); color: var(--ink-3); border: 1px solid var(--line); }
.tfa-passo { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin-top: 10px;
  background: var(--surface); }
.tfa-passo h4 { margin: 0 0 6px; font-size: 13.5px; font-weight: 800; }
.tfa-passo p { margin: 0 0 8px; font-size: 13px; color: var(--ink-2); line-height: 1.5; }
/* O segredo quebra em qualquer ponto: em blocos de 4 ele é largo e não pode vazar da caixa
   no celular (é digitado à mão justamente quando o link otpauth não está disponível). */
.tfa-segredo { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 15px;
  font-weight: 700; letter-spacing: 1px; background: var(--surface-2); border: 1px dashed var(--line);
  border-radius: 10px; padding: 10px 12px; word-break: break-all; user-select: all; }
.tfa-codigos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 10px 0; }
.tfa-cod { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 15px;
  font-weight: 700; text-align: center; background: var(--surface-2); border: 1px solid var(--line);
  border-radius: 8px; padding: 8px 4px; user-select: all; }
.tfa-aviso { background: var(--warn-bg); color: var(--warn); border-radius: 10px; padding: 10px 12px;
  font-size: 13px; line-height: 1.5; font-weight: 600; }
.tfa-msg { font-size: 13px; color: var(--ink-3); }
.tfa-msg.erro { color: var(--danger); }
.tfa-msg.ok { color: var(--ok); }
.tfa .cod-input { font-size: 19px; letter-spacing: 4px; max-width: 220px; }
@media (max-width: 560px) { .tfa-codigos { grid-template-columns: 1fr; } }
@media print { .tfa-passo, .tfa-cod { break-inside: avoid; } }

/* ===== Ficha do cliente (painel master) ================================================ */
.adm-link-ficha { color: var(--green-d); font-weight: 700; cursor: pointer; }
.adm-link-ficha:hover { text-decoration: underline; }
.fi-linhas { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px; margin: 12px 0 4px; }
.fi-l { background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 12px; font-size: 14px; }
.fi-l > span { display: block; color: var(--ink-3); font-size: 12px; text-transform: uppercase;
  letter-spacing: .4px; margin-bottom: 3px; }
.fi-l > b { display: block; }
.fi-l .dim { display: block; font-size: 12px; margin-top: 2px; }
.fi-h { font-size: 14px; margin: 18px 0 8px; color: var(--ink-2); }
.fi-selo { display: inline-block; border-radius: 999px; padding: 1px 8px; font-size: 11.5px;
  font-weight: 700; white-space: nowrap; }
.fi-selo.bom { background: var(--ok-bg); color: var(--ok); }
.fi-selo.aviso { background: var(--warn-bg); color: var(--warn); }
.fi-selo.mau { background: var(--danger-bg); color: var(--danger); }
.fi-uso { display: flex; flex-wrap: wrap; gap: 8px; }
.fi-chip { background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px;
  padding: 4px 12px; font-size: 13px; }
.fi-priv { font-size: 12.5px; color: var(--ink-3); background: var(--surface-2);
  border-radius: 10px; padding: 10px 12px; margin: 16px 0 0; line-height: 1.5; }

/* ===== Livro de assinaturas (dentro da ficha) ========================================== */
.assin-vale > td { background: var(--ok-bg); }
.assin-obs { font-size: 12.5px; padding-top: 0 !important; font-style: italic; }
.assin-nova { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 12px;
  padding-top: 12px; border-top: 1px dashed var(--line); }
.assin-nova .pa-input { width: auto; flex: 1 1 140px; min-width: 120px; }
.assin-nova input[type=date] { flex: 0 0 auto; }
.af-nota { font-size: 13px; color: var(--ink-2); background: var(--surface-2);
  border-radius: 10px; padding: 10px 12px; margin: 12px 0 0; line-height: 1.5; }

/* ===== Painel master: filtros e paginação ============================================== */
.adm-filtros { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 10px 0 12px; }
.adm-filtros .pa-input { width: auto; flex: 1 1 200px; min-width: 160px; }
.adm-filtros select.pa-input { flex: 0 1 190px; }
.adm-pag { display: flex; gap: 10px; align-items: center; justify-content: center;
  margin-top: 12px; font-size: 13.5px; }
.adm-pag button[disabled] { opacity: .45; cursor: default; }

/* ===== Trilha de auditoria (painel master) ============================================= */
.aud-filtros { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.aud-filtros .pa-input { width: auto; min-width: 150px; flex: 0 1 200px; }
.aud-filtros input[type=date] { flex: 0 0 auto; min-width: 140px; }
/* A tabela é larga por natureza (seis colunas de contexto). Rola CONTIDA: quem lê a trilha
   está procurando uma linha específica, e a página inteira andando de lado atrapalha. */
.aud-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.aud-tab { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 860px; }
.aud-tab th { text-align: left; padding: 10px 12px; background: var(--surface-2);
  border-bottom: 1px solid var(--line); font-size: 12px; text-transform: uppercase;
  letter-spacing: .4px; color: var(--ink-3); white-space: nowrap; }
.aud-tab td { padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.aud-tab tr:last-child td { border-bottom: 0; }
.aud-tab tbody tr:hover { background: var(--surface-2); }
.aud-quando { white-space: nowrap; font-variant-numeric: tabular-nums; }
.aud-det { display: block; max-width: 280px; overflow-wrap: anywhere; font-size: 11.5px;
  color: var(--ink-3); background: var(--surface-2); border-radius: 6px; padding: 4px 6px; }

/* ===== Aparelhos conectados ============================================================ */
.apar { font-size: 14px; }
.apar-lista { display: flex; flex-direction: column; gap: 8px; margin: 10px 0; }
.apar-item { display: flex; align-items: center; gap: 12px; border: 1px solid var(--line);
  border-radius: 12px; padding: 11px 14px; background: var(--surface); }
.apar-item.agora { border-color: var(--ok); background: var(--ok-bg); }
.apar-ic { font-size: 20px; flex-shrink: 0; }
.apar-txt { flex: 1; min-width: 0; }
.apar-nome { font-weight: 700; font-size: 14px; }
.apar-det { font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
.apar-selo { font-size: 11.5px; font-weight: 800; color: var(--ok); background: var(--surface);
  border: 1px solid var(--ok); border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.apar-x { border: 1px solid var(--line); background: var(--surface); color: var(--danger);
  border-radius: 9px; padding: 6px 12px; font-weight: 700; font-size: 13px; cursor: pointer;
  white-space: nowrap; }
.apar-x:hover { border-color: var(--danger); }
.apar-x[disabled] { opacity: .55; cursor: default; }
.apar-msg { font-size: 13px; color: var(--ink-3); }
.apar-msg.erro { color: var(--danger); }
.apar-msg.ok { color: var(--ok); }
/* No celular o cartão empilha: nome, detalhe e ação em linhas próprias, senão o botão
   espreme o nome do aparelho, que é justamente o dado que a pessoa veio ler. */
@media (max-width: 560px) {
  .apar-item { flex-wrap: wrap; }
  .apar-txt { flex-basis: calc(100% - 44px); }
  .apar-x, .apar-selo { margin-left: 32px; }
}

.user-info { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.user-nome { font-size: 13px; font-weight: 700; }
.user-equipe { font-size: 11px; color: var(--ink-3); }
.user-caret { color: #9fc4b8; font-size: 11px; }
.user-menu { position: absolute; right: 0; top: 110%; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); padding: 6px; min-width: 180px; z-index: 60; }
.user-menu a { display: block; padding: 9px 12px; border-radius: 8px; color: var(--ink); font-size: 14px; font-weight: 600; cursor: pointer; }
.user-menu a:hover { background: var(--surface-2); text-decoration: none; }

/* ===================== Modal de equipe ===================== */
.equipe-modal { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 60; background: var(--surface); width: 480px; max-width: 94vw; max-height: 88vh; overflow-y: auto; border-radius: 14px; box-shadow: var(--shadow); }
.equipe-conteudo { padding: 28px 26px 30px; }
.equipe-conteudo h2 { margin: 0 0 18px; font-size: 22px; color: var(--ink); }
.eq-label { font-size: 12px; font-weight: 800; color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; margin: 18px 0 8px; }
.eq-convite-box { background: var(--surface-2); border-radius: 12px; padding: 14px 16px; }
.eq-convite-box .eq-label { margin-top: 0; }
.eq-convite-row { display: flex; align-items: center; gap: 10px; }
.eq-convite-row code { font-size: 22px; font-weight: 800; letter-spacing: .14em; color: var(--teal); background: var(--surface); border: 1px dashed var(--line); border-radius: 8px; padding: 6px 14px; }
.eq-copiar { border: 0; background: var(--green); color: #fff; font-weight: 700; padding: 9px 14px; border-radius: 9px; cursor: pointer; }
.eq-copiar:hover { background: var(--green-d); }
.eq-hint { margin: 10px 0 0; font-size: 12.5px; }
.eq-membros { display: flex; flex-direction: column; gap: 8px; }
.eq-membro { display: flex; justify-content: space-between; align-items: center; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; font-size: 14px; }
.eq-membro .dim { font-size: 12.5px; }
.eq-papel { font-size: 11px; font-weight: 700; text-transform: uppercase; padding: 3px 9px; border-radius: 20px; }
.eq-papel.admin { background: var(--green-l); color: var(--green-d); }
.eq-papel.membro { background: #e6f0fb; color: #1d4ed8; }
.eq-cabecalho { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
.eq-cabecalho h2 { margin: 0; }
.eq-link { border: 0; background: none; color: var(--green-d); font-weight: 700; font-size: 13px; cursor: pointer; padding: 4px 6px; border-radius: 6px; }
.eq-link:hover { background: var(--surface-2); text-decoration: underline; }
.eq-nome-input { font-size: 18px; font-weight: 700; border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px; color: var(--ink); flex: 1; min-width: 140px; }
.eq-membro-info { display: flex; flex-direction: column; line-height: 1.3; }
.eq-membro-info .dim { font-size: 12.5px; }
.eq-voce { font-size: 10.5px; font-weight: 700; background: var(--surface-2); color: var(--ink-2); border-radius: 20px; padding: 1px 7px; text-transform: uppercase; }
.eq-membro-acoes { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
.eq-btn-acao { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); border-radius: 7px; padding: 4px 9px; font-size: 12px; font-weight: 600; cursor: pointer; }
.eq-btn-acao:hover { border-color: var(--green); color: var(--green-d); }
.eq-btn-acao.remover:hover { border-color: #f3c2c2; color: var(--danger); background: var(--danger-bg); }
.eq-msg { font-size: 13px; color: var(--danger); min-height: 18px; margin-top: 12px; }
/* ===================== Painel de Leads (Fatia 6), abas do master ===================== */
.adm-abas { display: flex; gap: 6px; background: var(--surface-2); border-radius: 10px;
  padding: 4px; margin-bottom: 18px; max-width: 420px; }
.adm-aba { flex: 1; border: 0; background: none; padding: 9px; border-radius: 8px;
  font-weight: 700; font-size: 13.5px; color: var(--ink-2); cursor: pointer; }
.adm-aba.on { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-sm); }
.adm-h3 { font-size: 15px; font-weight: 800; color: var(--ink); margin: 26px 0 4px; }
.adm-nota { font-size: 12.5px; line-height: 1.5; margin: 0 0 12px; max-width: 78ch; }
.lead-fila { display: flex; flex-direction: column; gap: 8px; }
.lead-fila-item { flex: none; border: 1px solid var(--warn); border-radius: 10px; padding: 11px 13px;
  background: color-mix(in srgb, var(--warn) 8%, transparent); }
.lf-topo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.lf-meta { font-size: 12.5px; margin-top: 3px; }
.lf-acoes { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 9px; }
.lf-check { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink-2);
  cursor: pointer; }
.lf-check input { width: 15px; height: 15px; accent-color: var(--green); cursor: pointer; }
.lead-areas { display: flex; flex-direction: column; gap: 5px; }
.lead-area { display: flex; align-items: center; gap: 10px; flex: none; width: 100%;
  border: 1px solid var(--line); background: var(--surface); border-radius: 9px;
  padding: 8px 11px; cursor: pointer; text-align: left; font-size: 13px; color: var(--ink-2); }
.lead-area:hover { border-color: var(--green); }
.lead-area.on { border-color: var(--green); background: color-mix(in srgb, var(--green) 8%, transparent);
  color: var(--ink); font-weight: 600; }
.la-nome { flex: none; width: 190px; }
.la-barra { flex: 1; height: 8px; background: var(--line-2); border-radius: 5px; overflow: hidden; }
.la-barra i { display: block; height: 100%; background: var(--green); border-radius: 5px; }
.la-n { flex: none; width: 42px; text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; }
.lead-tag { display: inline-block; font-size: 11px; font-weight: 700; padding: 2px 7px;
  border-radius: 20px; background: var(--surface-2); color: var(--ink-2); white-space: nowrap; }
.lead-tag.ok { background: color-mix(in srgb, var(--green) 15%, transparent); color: var(--green-d); }
.lead-tag.alerta { background: color-mix(in srgb, var(--warn) 22%, transparent); color: var(--ink); }
.lead-tag.off { background: var(--line-2); color: var(--ink-3); }
@media (max-width: 560px) {
  .adm-abas { max-width: none; }
  .la-nome { width: 118px; }
  .la-barra { min-width: 40px; }
}

/* "De onde veio esta sugestão": mostra o CNAE que originou cada área marcada pelo CNPJ. */
.pa-pq { margin-top: 10px; border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 12px; background: var(--surface-2); }
.pa-pq-tit { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  color: var(--ink-3); margin-bottom: 6px; }
.pa-pq-sub { font-size: 12px; color: var(--ink-2); line-height: 1.45; margin: 10px 0 6px;
  padding-top: 8px; border-top: 1px dashed var(--line); }
.pa-pq-item { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 5px 0;
  font-size: 12.5px; }
.pa-pq-sel { flex: none; width: 72px; font-weight: 700; color: var(--green-d); font-size: 11.5px; }
/* "já coberto" e "sem área correspondente": estados informativos, sem cor de sucesso */
.pa-pq-sel.cob { color: var(--ink-3); font-weight: 600; }
.pa-pq-nome { flex: none; font-weight: 700; color: var(--ink); }
.pa-pq-nome.dim { color: var(--ink-3); font-weight: 600; }
/* selo Material x Servico, a mesma divisao do cadastro de fornecedor do governo */
.pa-pq-ms { flex: none; font-size: 10.5px; font-weight: 700; border-radius: 20px;
  padding: 1px 8px; letter-spacing: .02em; }
.pa-pq-ms.m { background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--green-d); }
.pa-pq-ms.s { background: var(--surface-2); border: 1px solid var(--line); color: var(--ink-2); }
/* O texto do CNAE e longo: ele encolhe e trunca, mas nome e botao nunca somem. */
.pa-pq-cnae { flex: 1; min-width: 120px; color: var(--ink-3); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 560px) {
  .pa-pq-item { align-items: flex-start; }
  .pa-pq-cnae { white-space: normal; flex-basis: 100%; }
  .pa-pq-item .eq-btn-acao { min-height: 34px; }
}

/* Catálogo de áreas editável (Fatia 2), aba do painel master. */
.areas-adm { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.area-adm { flex: none; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.area-adm.off { opacity: .62; }
.area-adm > summary { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 13px; cursor: pointer; font-size: 14px; list-style: none; }
.area-adm > summary::-webkit-details-marker { display: none; }
.area-adm > summary::before { content: "▸"; color: var(--ink-3); flex: none; }
.area-adm[open] > summary::before { content: "▾"; }
.area-adm[open] > summary { border-bottom: 1px solid var(--line); }
.aa-tags { display: flex; gap: 5px; flex-wrap: wrap; margin-left: auto; }
.aa-corpo { padding: 12px 13px 14px; }
.aa-corpo label { display: block; font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin: 10px 0 4px; }
.aa-corpo label:first-child { margin-top: 0; }
.aa-corpo textarea { width: 100%; min-height: 52px; resize: vertical; border: 1px solid var(--line);
  border-radius: 9px; padding: 8px 11px; font-family: inherit; font-size: 13px;
  background: var(--surface); color: var(--ink); }
.aa-corpo textarea:focus, .aa-nome:focus { outline: 2px solid var(--green); border-color: var(--green); }
.aa-nome { width: 100%; }
.aa-acoes { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
@media (max-width: 560px) {
  .area-adm > summary { font-size: 13px; }
  .aa-tags { margin-left: 0; width: 100%; }
}

/* As 3 portas de entrada na equipe (Fatia 5), no painel do admin. */
.eq-porta-linha { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.eq-porta-linha .eq-nome-input { flex: 1; min-width: 180px; }
.eq-porta-sel { max-width: 130px; min-width: 110px; flex: none !important; }
.eq-porta-lista { margin-top: 10px; }
.eq-porta-nota { margin-top: -4px; }
.eq-vagas { text-transform: none; font-weight: 600; color: var(--ink-3); }
@media (max-width: 560px) {
  /* No celular os controles empilham: lado a lado o campo de e-mail ficava com menos de
     120px, estreito demais para conferir o endereço antes de convidar alguém. */
  .eq-porta-linha { flex-direction: column; align-items: stretch; }
  .eq-porta-sel { max-width: none; }
  /* Alvo de toque: os botões de ação da equipe tinham 23px de altura, menos que a ponta do
     dedo. Vale para os que já existiam (renomear, promover, remover) e para os novos das
     3 portas, que usam a mesma classe. */
  .eq-porta-linha .eq-btn-acao { padding: 10px; }
  .eq-btn-acao, .eq-link { min-height: 38px; padding-top: 8px; padding-bottom: 8px; }
  .eq-membro-acoes { flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
}

/* ===================== Inteligência de mercado ===================== */
.intel-busca { display: flex; gap: 8px; max-width: 720px; margin: 18px auto 0; background: var(--surface); border-radius: 14px; padding: 8px; box-shadow: var(--shadow); }
.intel-busca input[type=text] { flex: 1; min-width: 0; border: 0; outline: 0; font-size: 15px; padding: 10px 12px; color: var(--ink); }
.intel-busca #intel-uf { flex: 0 0 64px; text-align: center; text-transform: uppercase; border-left: 1px solid var(--line); }
.intel-titulo { font-size: 18px; font-weight: 800; color: var(--ink); margin: 6px 0 16px; }
.intel-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.intel-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 14px; text-align: center; box-shadow: var(--shadow-sm); }
.intel-card.destaque { background: var(--teal); border-color: var(--teal); }
.intel-card.destaque .ic-lbl, .intel-card.destaque .ic-val { color: #fff; }
.ic-lbl { font-size: 12px; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: .03em; }
.ic-val { font-size: 19px; font-weight: 800; color: var(--ink); margin-top: 6px; }
.intel-nota { font-size: 12.5px; color: var(--ink-3); margin: 10px 0 0; }
.intel-bloco { margin-top: 26px; }
.intel-bloco h3 { font-size: 15px; font-weight: 800; color: var(--ink); margin: 0 0 10px; }
.intel-tab-wrap { overflow-x: auto; }
.intel-tab { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; font-size: 13.5px; }
.intel-tab th { background: var(--surface-2); color: var(--ink-2); font-weight: 700; text-align: left; padding: 10px 12px; font-size: 12.5px; }
.intel-tab td { padding: 10px 12px; border-top: 1px solid var(--line); color: var(--ink); vertical-align: top; }
.intel-tab td.num, .intel-tab th.num { text-align: right; white-space: nowrap; }
.intel-tab td.forte { font-weight: 800; color: var(--teal); }
.intel-tab .dim { font-size: 11.5px; color: var(--ink-3); }
.intel-interpretado { background: #eef6ff; border: 1px solid #cfe3fb; color: #1d4ed8; border-radius: 10px; padding: 11px 14px; font-size: 13.5px; margin-bottom: 14px; }
.intel-vazio-box { max-width: 640px; margin: 30px auto; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 22px 24px; text-align: center; }
.intel-vazio-titulo { font-size: 16px; font-weight: 800; color: var(--ink); margin: 0 0 10px; }
.intel-vazio-box p { font-size: 14px; color: var(--ink-2); margin: 8px 0; line-height: 1.5; }
@media (max-width: 760px) { .intel-cards { grid-template-columns: repeat(2, 1fr); } }

/* ===================== Dashboard do funil (refinado) ===================== */
.dash-kpis { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 18px; }
.dash-stat { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; box-shadow: var(--shadow-sm); }
.dash-stat .k { font-size: 11.5px; font-weight: 800; color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; }
.dash-stat .v { font-size: 25px; font-weight: 800; color: var(--ink); line-height: 1.12; margin-top: 7px; word-break: break-word; }
.dash-stat.accent .v { color: var(--green-d); }
.dash-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dash-card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; box-shadow: var(--shadow-sm); transition: border-color .15s, box-shadow .15s; }
.dash-card:hover { border-color: #d4e3dc; box-shadow: 0 6px 18px rgba(8,30,24,.10); }
.dash-card.wide { grid-column: 1 / -1; }
.dash-card-h { display: flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 800; color: var(--ink); margin: 0 0 16px; }
.dash-card-ic { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; font-size: 15px; background: var(--green-l); border: 1px solid #cdeadd; flex: none; }
.dash-card-sub { font-weight: 600; color: var(--ink-3); font-size: 12px; margin-left: auto; }
/* funil em colunas (entradas por etapa) */
.dash-funnel { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.dash-fcol { background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 14px 8px; text-align: center; position: relative; }
.dash-fcol .n { font-size: 26px; font-weight: 800; color: var(--teal); line-height: 1; }
.dash-fcol .l { font-size: 11.5px; font-weight: 700; color: var(--ink-2); margin-top: 6px; }
.dash-fcol::after { content: "›"; position: absolute; right: -8px; top: 50%; transform: translateY(-50%); color: var(--ink-3); font-weight: 800; font-size: 16px; }
.dash-fcol:last-child::after { display: none; }
/* barras horizontais (etapa / UF) */
.dash-row { display: grid; grid-template-columns: 132px 1fr auto; align-items: center; gap: 12px; margin-bottom: 11px; font-size: 13px; }
.dash-row-lbl { color: var(--ink-2); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-bar-track { background: var(--surface-2); border-radius: 20px; height: 13px; overflow: hidden; }
.dash-bar { height: 100%; border-radius: 20px; min-width: 4px; background: var(--accent);   /* sólido (segue a cor do layout) */
  transform-origin: left center; animation: dash-grow-x .65s var(--ease) both; }   /* cresce da esquerda (Fase 4) */
@keyframes dash-grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.dash-row-val { font-weight: 800; color: var(--ink); white-space: nowrap; font-size: 12.5px; }
/* donut (por modalidade) */
.dash-donut-wrap { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; }
.dash-donut { width: 156px; height: 156px; flex: none; }
.dash-donut-c { font-size: 30px; font-weight: 800; fill: var(--ink); }
.dash-donut-s { font-size: 11px; font-weight: 700; fill: var(--ink-3); }
.dash-legend { display: flex; flex-direction: column; gap: 9px; font-size: 13px; color: var(--ink-2); min-width: 180px; }
.dash-legend-item { display: flex; align-items: center; gap: 9px; }
.dash-legend-dot { width: 11px; height: 11px; border-radius: 50%; flex: none; }
.dash-legend-item b { margin-left: auto; color: var(--ink); }
/* colunas (por mês) */
.dash-cols { display: flex; align-items: stretch; gap: 12px; height: 180px; padding-top: 8px; }
.dash-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 7px; min-width: 0; }
.dash-col-wrap { flex: 1; width: 100%; max-width: 38px; margin: 0 auto; display: flex; align-items: flex-end; }
.dash-col-bar { width: 100%; background: var(--accent); border-radius: 6px 6px 0 0; min-height: 4px; transition: filter .15s;   /* sólido, sem degradê */
  transform-origin: bottom center; animation: dash-grow-y .6s var(--ease) both; }   /* cresce de baixo (Fase 4) */
@keyframes dash-grow-y { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.dash-col:hover .dash-col-bar { filter: brightness(1.08); }
/* entrada escalonada dos cards de KPI (dashboard + cockpit) */
.dash-stat, .ck-kpi { animation: kpi-in .5s var(--ease) both; }
.dash-stat:nth-child(2), .ck-kpi:nth-child(2) { animation-delay: .06s; }
.dash-stat:nth-child(3), .ck-kpi:nth-child(3) { animation-delay: .12s; }
.dash-stat:nth-child(4), .ck-kpi:nth-child(4) { animation-delay: .18s; }
.dash-stat:nth-child(5) { animation-delay: .24s; }
@keyframes kpi-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .dash-bar, .dash-col-bar, .dash-stat, .ck-kpi { animation: none; } }
.dash-col-lbl { font-size: 11px; color: var(--ink-3); white-space: nowrap; font-weight: 600; }
@media (max-width: 860px) {
  .dash-kpis { grid-template-columns: repeat(2, 1fr); }
  .dash-grid { grid-template-columns: 1fr; }
  .dash-funnel { grid-template-columns: repeat(3, 1fr); }
  .dash-fcol::after { display: none; }
  .dash-row { grid-template-columns: 92px 1fr auto; }
}

/* Proposta / Precificador (M4) */
.prop-lista-head { margin-bottom: 14px; }
.prop-cards { display: flex; flex-direction: column; gap: 10px; }
.prop-card { display: flex; align-items: center; gap: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px; box-shadow: var(--shadow-sm); }
.prop-card-main { flex: 1; min-width: 0; }
.prop-card-tit { font-weight: 700; color: var(--ink); }
.prop-card-sub { font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
.prop-card-val { font-weight: 800; color: var(--green-d); white-space: nowrap; }
.prop-card-edit { border: 1px solid var(--green); background: var(--surface); color: var(--green-d); padding: 6px 14px; border-radius: 8px; cursor: pointer; font-weight: 700; }
.prop-card-edit:hover { background: var(--green-l); }
.prop-ed-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.btn-voltar { border: 0; background: none; color: var(--green-d); font-weight: 700; cursor: pointer; font-size: 14px; }
.btn-excluir-prop { border: 1px solid #f3c2c2; background: var(--surface); color: var(--danger); padding: 6px 12px; border-radius: 8px; cursor: pointer; }
.prop-ed-campos { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.prop-ed-campos label { display: block; font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin-bottom: 5px; }
.prop-ed-campos input { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 14px; }
.prop-tab-wrap { overflow-x: auto; }
.prop-tab { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 720px; }
.prop-tab th { text-align: left; font-size: 11px; text-transform: uppercase; color: var(--ink-3); padding: 6px 6px; border-bottom: 1px solid var(--line); }
.prop-tab td { padding: 5px 6px; border-bottom: 1px solid var(--line); vertical-align: top; }
.prop-tab input { border: 1px solid var(--line); border-radius: 6px; padding: 6px 7px; font-size: 13px; width: 100%; }
.prop-tab .pi-num { text-align: right; max-width: 80px; }
.pi-preco, .pi-total { font-weight: 700; color: var(--ink); white-space: nowrap; text-align: right; }
.pi-preco.pi-alerta { color: var(--danger); }
.pi-preco.pi-alerta::after { content: " ⚠"; }
.pi-ref { border: 0; background: none; color: var(--green-d); cursor: pointer; font-size: 11px; padding: 2px 0; }
.pi-refout { font-size: 11.5px; color: var(--ink-3); }
.pi-del { border: 0; background: none; color: var(--danger); cursor: pointer; font-size: 15px; }
.prop-add-btn { margin-top: 10px; border: 1px dashed var(--green); background: var(--surface); color: var(--green-d); padding: 7px 14px; border-radius: 8px; cursor: pointer; font-weight: 700; }
.prop-totais { display: flex; flex-wrap: wrap; gap: 8px 22px; justify-content: flex-end; margin-top: 14px; font-size: 13.5px; color: var(--ink-2); }
.prop-totais b { color: var(--ink); }
.prop-tot-final { font-size: 15px; }
.prop-tot-final b { color: var(--green-d); }
.prop-obs { margin-top: 14px; }
.prop-obs label { display: block; font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin-bottom: 5px; }
.prop-obs textarea { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13.5px; font-family: inherit; resize: vertical; }
.prop-acoes { display: flex; gap: 10px; margin-top: 16px; }
@media (max-width: 720px) { .prop-ed-campos { grid-template-columns: 1fr; } }

/* Ações nas tabelas (painel admin) */
.intel-tab td.acoes-cell { white-space: normal; text-align: right; }
.intel-tab td.acoes-cell .eq-btn-acao { margin: 2px; }
.intel-tab td code { background: var(--surface-2); padding: 2px 6px; border-radius: 5px; font-size: 12px; }
.intel-tab td .eq-papel { margin-left: 4px; }

/* Cabeçalho do bloco com botão de criar (Nova equipe / Novo usuário) */
.admin-bloco-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.admin-bloco-head h3 { margin: 0; }
.search-btn.sm { padding: 8px 14px; font-size: 13.5px; }

/* Formulários do painel admin (criar/editar usuário e equipe) */
.af-input { width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; font-size: 14px; color: var(--ink); font-family: inherit; background: var(--surface); }
select.af-input { cursor: pointer; }
.af-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); margin: 16px 0 4px; cursor: pointer; }
.af-aviso { font-size: 12.5px; color: var(--ink-2); background: var(--surface-2); border-radius: 9px; padding: 10px 12px; margin: 14px 0 0; }
.af-texto { font-size: 13.5px; color: var(--ink-2); margin: 12px 0 0; }
.af-texto.dim { color: var(--ink-3); font-size: 12.5px; }
.af-acoes { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }
.af-senha-box { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.af-senha-box code { flex: 1; font-size: 18px; font-weight: 800; letter-spacing: .08em; color: var(--teal); background: var(--surface-2); border: 1px dashed var(--line); border-radius: 8px; padding: 10px 14px; word-break: break-all; }

/* ===================== Converse com o edital ===================== */
.ed-arquivos { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.arq-item { display: flex; justify-content: space-between; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 9px; padding: 9px 12px; }
.arq-nome { font-size: 13px; color: var(--ink); font-weight: 600; word-break: break-word; }
.arq-tipo { font-size: 11px; color: var(--ink-3); font-weight: 500; }
.arq-acoes { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.arq-baixar { font-size: 13px; font-weight: 600; }
.arq-conversar { border: 1px solid var(--green); background: var(--surface); color: var(--green-d); border-radius: 8px; padding: 5px 11px; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.arq-conversar:hover { background: var(--green-l); }
.arq-conversar.on { background: var(--green); color: #fff; }
.ed-aviso { font-size: 13px; color: var(--ink-2); background: var(--surface-2); border-radius: 10px; padding: 12px 14px; }
.ed-aviso code { background: #e6ece9; padding: 1px 5px; border-radius: 5px; font-size: 12px; }
.ed-dim { font-size: 11.5px; color: var(--ink-3); margin: 8px 0 0; }

.chat-msgs { border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); padding: 12px; max-height: 340px; overflow-y: auto; display: flex; flex-direction: column; gap: 9px; }
.chat-msg { padding: 9px 12px; border-radius: 12px; font-size: 13.5px; line-height: 1.5; max-width: 88%; white-space: pre-wrap; }
.chat-msg.assistant { background: var(--surface); border: 1px solid var(--line); align-self: flex-start; border-bottom-left-radius: 4px; }
.chat-msg.user { background: var(--teal); color: #fff; align-self: flex-end; border-bottom-right-radius: 4px; }
.chat-msg.chat-erro { background: var(--danger-bg); color: var(--danger); border-color: #f3c2c2; }
.chat-prompts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; }
.chat-prompts-lbl { font-size: 12px; color: var(--ink-3); font-weight: 700; margin-right: 2px; }
.chat-prompt { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); border-radius: 16px; padding: 6px 11px; font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit; transition: border-color .12s, color .12s, background .12s; }
.chat-prompt:hover { border-color: var(--green); color: var(--green-d); background: #f0faf4; }
.chat-prompt:disabled { opacity: .5; cursor: default; }
.chat-input-row { display: flex; gap: 8px; margin-top: 10px; }
#chat-input { flex: 1; border: 1px solid var(--line); border-radius: 10px; padding: 11px 13px; font-size: 14px; color: var(--ink); font-family: inherit; }
.chat-enviar { border: 0; background: var(--green); color: #fff; font-weight: 700; padding: 0 18px; border-radius: 10px; cursor: pointer; font-size: 14px; }
.chat-enviar:hover { background: var(--green-d); }
.chat-enviar:disabled { opacity: .5; cursor: default; }
.chat-uso { font-size: 11px; color: var(--ink-3); margin: -2px 0 2px; align-self: flex-start; }
.chat-uso-total { font-size: 12px; color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; margin-top: 8px; line-height: 1.5; }
.chat-uso-total .dim { color: var(--ink-3); }

/* ===================== Rodapé ===================== */
.rodape { text-align: center; color: var(--ink-3); font-size: 13px; padding: 24px; }

.kc-mover-wrap { display: none; }  /* kanban: "mover" só no mobile (desktop usa drag) */

/* ===================== Responsivo ===================== */
@media (max-width: 720px) {
  /* topbar compacta */
  .topbar { gap: 10px; padding: 0 12px; height: 56px; }
  .brand-sub, .fonte-tag { display: none; }
  .brand-name { font-size: 17px; }
  .nav-burger { display: flex; }

  /* a nav vira um menu que desliza de cima (hambúrguer) */
  .nav {
    position: fixed; top: 56px; left: 0; right: 0; z-index: 45;
    flex-direction: column; gap: 0; margin: 0;
    background: var(--surface); border-bottom: 1px solid var(--line); box-shadow: var(--shadow);
    max-height: calc(100vh - 56px); overflow-y: auto;
    transform: translateY(-130%); transition: transform .28s cubic-bezier(.4,0,.2,1);
  }
  .nav.open { transform: translateY(0); }
  .nav-item {
    display: flex; align-items: center; gap: 9px;
    color: var(--ink); font-size: 15.5px; padding: 15px 18px; border-radius: 0;
    border-bottom: 1px solid var(--line);
  }
  .nav-item:hover { background: var(--surface-2); color: var(--ink); }
  .nav-item.active { color: var(--green-d); background: #f0faf4; }
  .nav-item .badge { margin-left: auto; }

  /* fundo escuro do menu */
  .nav-overlay { display: block; position: fixed; inset: 56px 0 0; z-index: 44; background: rgba(7,28,22,.4); opacity: 0; pointer-events: none; transition: opacity .28s; }
  .nav-overlay.open { opacity: 1; pointer-events: auto; }

  /* caixa de usuário compacta: só o avatar */
  .user-btn { padding: 3px; gap: 0; background: transparent; border: 0; }
  .user-info, .user-caret { display: none; }

  /* Inteligência: busca quebra em linhas (termo / UF+Analisar / exportar) */
  .intel-busca { flex-wrap: wrap; max-width: 100%; }
  .intel-busca #intel-termo { flex: 1 1 100%; }
  .intel-busca #intel-uf { flex: 1 0 64px; border-left: 0; text-align: left; }
  .intel-busca .search-btn { flex: 2 0 auto; }
  .intel-busca #intel-exportar { flex: 1 1 100%; justify-content: center; }

  /* Painel de detalhe: ocupa a tela toda, sem a alça de redimensionar */
  .painel { width: 100vw; max-width: 100vw; }
  .painel-resizer { display: none; }
  .painel-conteudo { padding: 24px 16px 40px; }
  .p-datas { grid-template-columns: 1fr; }

  /* Kanban: mover card por seletor (drag por toque é instável no iOS) */
  .kc-mover-wrap { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 13px; color: var(--ink-3); }
  .kc-mover { flex: 1; min-width: 0; padding: 7px 8px; border: 1px solid var(--line); border-radius: 8px; font-size: 13px; color: var(--ink); background: var(--surface); font-family: inherit; }

  /* demais ajustes mobile */
  .filtro-grid { grid-template-columns: 1fr; gap: 18px; }
  .hero h1 { font-size: 27px; }
}

/* ===================== Perfis de busca + termos indesejados (M1) ===================== */
#excluir { width: 100%; padding: 9px 11px; border: 1px solid var(--line); border-radius: 9px;
  font-size: 14px; color: var(--ink); font-family: inherit; }
.acc-hint { font-size: 11.5px; color: var(--ink-3); margin: 6px 0 0; line-height: 1.45; }
.perfis-lista { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.perfis-vazio { font-size: 12px; color: var(--ink-3); margin: 0 0 4px; line-height: 1.45; }
.perfil-item { display: flex; align-items: stretch; gap: 6px; }
.perfil-aplicar { flex: 1; min-width: 0; text-align: left; background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 9px; padding: 7px 10px; cursor: pointer;
  display: flex; flex-direction: column; gap: 2px; font-family: inherit; }
.perfil-aplicar:hover { border-color: var(--green); background: #eef7f1; }
.perfil-nome { font-size: 13px; font-weight: 700; color: var(--ink); }
.perfil-resumo { font-size: 11px; color: var(--ink-3); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.perfil-excluir { border: 1px solid var(--line); background: var(--surface); border-radius: 9px;
  width: 32px; flex-shrink: 0; cursor: pointer; color: var(--ink-3); font-size: 13px; }
.perfil-excluir:hover { border-color: #ef4444; color: var(--danger); background: var(--danger-bg); }
.perfil-salvar { display: flex; flex-direction: column; gap: 7px; }
#perfil-nome { width: 100%; padding: 8px 10px; border: 1px solid var(--line);
  border-radius: 9px; font-size: 13px; font-family: inherit; color: var(--ink); }
.btn-perfil-salvar { border: 0; background: var(--green); color: #fff; font-weight: 700;
  padding: 9px 12px; border-radius: 9px; cursor: pointer; font-size: 13px; }
.btn-perfil-salvar:hover { background: var(--green-d); }

/* ===================== Score de aderência (IA) - M2 ===================== */
.ed-score-row { margin: 12px 0 8px; }
.btn-score { width: 100%; border: 1px solid var(--green); background: var(--surface); color: var(--green-d);
  border-radius: 9px; padding: 10px 14px; font-size: 13.5px; font-weight: 700; cursor: pointer;
  transition: background var(--t), transform var(--t), box-shadow var(--t); }
.btn-score:hover { background: var(--green-l); }
.btn-score:active { transform: translateY(1px); }
.btn-score:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(22,163,74,.2); }
.btn-score:disabled { opacity: .6; cursor: default; transform: none; }
.edital-score { margin-bottom: 6px; }
.edital-score:empty { display: none; }
.ed-score-card { display: flex; gap: 14px; align-items: center; background: var(--surface);
  border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
.ed-gauge { width: 92px; height: 92px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.ed-gauge .inner { width: 68px; height: 68px; border-radius: 50%; background: var(--surface); display: grid; place-items: center; text-align: center; }
.ed-gauge .sc { font-size: 23px; font-weight: 800; color: var(--ink); line-height: 1; }
.ed-gauge .lbl { font-size: 9px; color: var(--ink-3); font-weight: 700; letter-spacing: .03em; }
.ed-score-body { flex: 1; min-width: 0; }
.ed-score-obj { font-size: 13px; font-weight: 700; color: var(--ink); margin-bottom: 4px; }
.ed-score-resumo { font-size: 13px; color: var(--ink-2); line-height: 1.5; }
.ed-score-cols { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; margin-top: 10px; }
.ed-score-col h4 { margin: 0 0 4px; font-size: 12px; font-weight: 800; color: var(--ink); }
.ed-score-lista { margin: 0; padding-left: 16px; }
.ed-score-lista li { font-size: 12px; color: var(--ink-2); margin-bottom: 3px; line-height: 1.4; }
@media (max-width: 640px) {
  .ed-score-cols { grid-template-columns: 1fr; }
  .ed-score-card { flex-direction: column; text-align: center; }
}

/* Matriz de habilitação (M5) */
.ed-score-row { display: flex; gap: 8px; }
.ed-score-row .btn-score { width: auto; flex: 1; }
.hab-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; margin-top: 10px; }
.hab-head { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.hab-resumo { font-size: 13.5px; color: var(--ink); flex: 1; min-width: 180px; }
.hab-totais { display: flex; gap: 6px; flex-wrap: wrap; }
.hab-badge { font-size: 11.5px; font-weight: 700; padding: 3px 8px; border-radius: 20px; white-space: nowrap; }
.hab-b-tem { background: #e7f6ec; color: #0f7a38; }
.hab-b-parcial { background: #fef3da; color: #a96a00; }
.hab-b-falta { background: var(--danger-bg); color: var(--danger); }
.hab-tab { width: 100%; border-collapse: collapse; font-size: 13px; }
.hab-tab th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: var(--ink-3); border-bottom: 1px solid var(--line); padding: 6px 8px; }
.hab-tab td { padding: 8px; border-bottom: 1px solid var(--line); vertical-align: top; color: var(--ink); }
.hab-tab tr:last-child td { border-bottom: 0; }
.hab-tab td:first-child { white-space: nowrap; }
.hab-cat { display: inline-block; margin-left: 6px; font-size: 10px; text-transform: uppercase; color: var(--ink-3); background: var(--surface-2); padding: 1px 6px; border-radius: 6px; }
.hab-obs { font-size: 12px; color: var(--ink-3); margin-top: 2px; }
.hab-falta td { background: #fff7f7; }

/* ===================== Alertas por e-mail (M10) ===================== */
.perfil-salvar-row { display: flex; gap: 6px; }
#perfil-alerta { flex: 1; min-width: 0; padding: 8px; border: 1px solid var(--line);
  border-radius: 9px; font-size: 12.5px; font-family: inherit; color: var(--ink-2); background: var(--surface); }
.perfil-salvar-row .btn-perfil-salvar { width: auto; white-space: nowrap; }
.perfil-foot { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 3px; }
.perfil-testar { font-size: 12px; font-weight: 700; color: var(--green-d); cursor: pointer; }
.perfil-testar:hover { text-decoration: underline; }
.perfil-smtp-hint { font-size: 11px; color: var(--ink-3); }
.perfil-item { display: flex; flex-direction: column; gap: 5px; }
.perfil-item-main { display: flex; align-items: stretch; gap: 6px; }
.perfil-alerta-sel { width: 100%; padding: 5px 8px; border: 1px solid var(--line);
  border-radius: 8px; font-size: 11.5px; font-family: inherit; color: var(--ink-2); background: var(--surface-2); }

/* ===================== Planos & assinatura (M0) ===================== */
.user-plano { font-size: 11px; font-weight: 700; color: #0a3a33; background: #d9f2e6;
  border-radius: 20px; padding: 2px 9px; margin-left: 4px; white-space: nowrap; }
/* Teste grátis nos últimos 3 dias: âmbar, não vermelho. Vermelho é a cor do alarme de
   convocação neste sistema, e gastá-la com cobrança de plano enfraquece o que salva dinheiro. */
.user-plano.trial { background: #fdf0d5; color: #7a4a08; }
:root[data-theme="dark"] .user-plano.trial { background: #3d2f10; color: #f5cf86; }

/* ============ Modo suporte: vendo a conta de um cliente (fatia 4c) ============
   Vermelho de verdade, e não um aviso discreto: quem esquece que está na conta alheia
   comete o erro que este modo existe para impedir. A moldura fica por cima de TUDO
   (z-index acima de modal e overlay) e não recebe clique, então nada fica inalcançável. */
.sup-borda { position: fixed; inset: 0; z-index: 90; pointer-events: none;
  box-shadow: inset 0 0 0 3px #c0392b; }
.sup-faixa { position: fixed; left: 0; right: 0; bottom: 0; z-index: 91;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 9px 16px; background: #c0392b; color: #fff;
  font-size: 13px; font-weight: 600; box-shadow: 0 -2px 12px rgba(0, 0, 0, .22); }
.sup-ic { font-size: 15px; flex: none; }
.sup-txt { flex: 1; min-width: 180px; line-height: 1.4; }
.sup-motivo { opacity: .85; font-weight: 500; }
.sup-prazo { flex: none; font-variant-numeric: tabular-nums; opacity: .9; }
.sup-btn { border: 1px solid rgba(255, 255, 255, .8); background: rgba(255, 255, 255, .12);
  color: #fff; font-weight: 700; font-size: 12.5px; padding: 5px 12px; border-radius: 8px;
  cursor: pointer; flex: none; }
.sup-btn:hover { background: rgba(255, 255, 255, .25); }
/* Espaço reservado no fim da página com a altura REAL da faixa (medida no JS, porque ela
   quebra em 2 ou 3 linhas conforme a largura). Sem isto, a faixa tapa o rodapé da tela do
   cliente, e o suporte não veria justamente a parte de baixo que foi conferir. */
body.modo-suporte { padding-bottom: var(--sup-h, 56px); }
@media (max-width: 720px) {
  .sup-faixa { padding: 8px 12px; font-size: 12px; }
  .sup-motivo { display: none; }   /* no celular a faixa some da tela se não couber em 2 linhas */
}

/* ===================== Aviso "confirme seu e-mail" (Fatia 4) ===================== */
.aviso-email { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 9px 16px; background: #fdf0d5; color: #7a4a08; border-bottom: 1px solid #f0d9a8;
  font-size: 13px; font-weight: 600; }
:root[data-theme="dark"] .aviso-email { background: #3d2f10; color: #f5cf86; border-bottom-color: #56410f; }
.ae-ic { font-size: 15px; flex: none; }
.ae-txt { flex: 1; min-width: 180px; line-height: 1.4; }
.ae-btn { border: 1px solid currentColor; background: transparent; color: inherit;
  font-weight: 700; font-size: 12.5px; padding: 5px 12px; border-radius: 8px; cursor: pointer; flex: none; }
.ae-btn:hover { background: rgba(0, 0, 0, .06); }
.ae-btn[disabled] { opacity: .6; cursor: progress; }
.planos-wrap { max-width: 1180px; margin: 0 auto; padding: 22px 20px 70px; }
.planos-uso { text-align: center; color: var(--ink-2); font-size: 13px; margin-bottom: 18px; }
.planos-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.plano-card { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 20px 18px;
  box-shadow: var(--shadow-sm); display: flex; flex-direction: column; position: relative; }
.plano-card.atual { border: 2px solid var(--green); box-shadow: 0 12px 30px rgba(22,163,74,.16); }
.plano-badge { position: absolute; top: -10px; left: 18px; background: var(--green); color: #fff;
  font-size: 11px; font-weight: 800; padding: 3px 10px; border-radius: 20px; }
.plano-nome { font-size: 17px; font-weight: 800; color: var(--teal); }
.plano-tag { font-size: 12px; color: var(--ink-3); margin-bottom: 8px; }
.plano-preco { font-size: 28px; font-weight: 800; color: var(--ink); }
.plano-preco small { font-size: 13px; font-weight: 600; color: var(--ink-3); }
.plano-limites { list-style: none; margin: 12px 0; padding: 10px 0;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.plano-limites li { font-size: 12.5px; color: var(--ink-2); padding: 2px 0; }
.plano-recursos { list-style: none; margin: 12px 0; padding: 0; flex: 1; }
.plano-recursos li { font-size: 12.5px; color: var(--ink-2); padding: 3px 0 3px 18px; position: relative; }
.plano-recursos li::before { content: "✓"; color: var(--green); position: absolute; left: 0; font-weight: 800; }
.plano-btn { border: 0; background: var(--green); color: #fff; font-weight: 700; padding: 10px;
  border-radius: 9px; font-size: 13px; cursor: pointer; }
.plano-btn.atual, .plano-btn[disabled] { background: var(--surface-2); color: var(--ink-2);
  border: 1px solid var(--line); cursor: default; }
.planos-nota { text-align: center; color: var(--ink-3); font-size: 12.5px; margin-top: 20px;
  max-width: 760px; margin-left: auto; margin-right: auto; }
@media (max-width: 920px) { .planos-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .planos-grid { grid-template-columns: 1fr; } }

/* ===================== Tarefas (no painel do negócio) - M3 ===================== */
.p-tarefa-form { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 10px; }
.p-tarefa-form input[type=text] { flex: 1 1 140px; min-width: 120px; }
.p-tarefa-form input, .p-tarefa-form select { border: 1px solid var(--line); border-radius: 9px;
  padding: 7px 9px; font-size: 13px; color: var(--ink); font-family: inherit; background: var(--surface); }
.btn-mini { border: 1px solid var(--green); background: var(--surface); color: var(--green-d); border-radius: 9px;
  padding: 7px 13px; font-weight: 700; cursor: pointer; font-size: 13px; font-family: inherit; }
.btn-mini:hover { background: var(--green-l); }
.p-tarefas { margin-bottom: 8px; }
.p-tarefa-item { display: flex; align-items: center; gap: 8px; padding: 6px 0; font-size: 13.5px;
  border-bottom: 1px solid var(--line); }
.p-tarefa-item:last-child { border-bottom: 0; }
.p-tarefa-item label { flex: 1; display: flex; align-items: center; gap: 8px; cursor: pointer; min-width: 0; }
.p-tarefa-item label span { word-break: break-word; }
.p-tarefa-item.feita label span { text-decoration: line-through; opacity: .55; }
/* Tags pequenas das TAREFAS, escopadas p/ NÃO afetar a pill do card/painel (.tag-pill.t-prazo) */
/* ⚠️ `:not(.prz)` porque `.t-prazo:not(.tag-pill)` tem especificidade (0,2,0) e VENCERIA
   `.prz-hoje` (0,1,0): sem esta ressalva a tag de urgencia da tarefa continuaria cinza,
   e o conserto do achado UI-A-3 nao apareceria na tela. */
.t-prazo:not(.tag-pill):not(.prz), .t-resp { font-size: 11.5px; color: var(--ink-3); white-space: nowrap; }
.t-prazo:not(.tag-pill):not(.prz) { background: var(--surface-2); padding: 1px 8px; border-radius: 7px; }
.t-del { border: 0; background: none; color: var(--danger); cursor: pointer; font-size: 14px; line-height: 1; padding: 2px; }
.t-del:hover { color: #7f1d1d; }

/* ===================== Agenda de prazos (M3/M7) ===================== */
.agenda-lista { max-width: 860px; margin: 0 auto; }
.agenda-grupo { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--line);
  border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; box-shadow: var(--shadow-sm); }
.agenda-grupo h3 { margin: 0 0 10px; font-size: 14px; color: var(--ink); display: flex; align-items: center; gap: 8px; }
.agenda-grupo h3 .badge { background: var(--surface-2); color: var(--ink-2); }
.agenda-grupo.g-atrasado { border-left-color: #ef4444; }
.agenda-grupo.g-hoje { border-left-color: var(--teal); }
.agenda-grupo.g-semana { border-left-color: #f59e0b; }
.agenda-grupo.g-futuro { border-left-color: #94a3b8; }
.agenda-item { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 0;
  border-bottom: 1px solid var(--line); font-size: 13.5px; }
.agenda-item:last-child { border-bottom: 0; }
.agenda-item.feita { opacity: .55; }
.agenda-item.feita span:last-child, .agenda-item.feita > span:nth-child(3) { text-decoration: line-through; }
.a-data { font-weight: 800; color: var(--ink); min-width: 90px; }
.a-tag { font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 20px;
  text-transform: uppercase; letter-spacing: .03em; }
.a-tag.sessao { background: #e7f0fb; color: #1d4ed8; }
.a-tag.tarefa { background: #ecfdf3; color: #0f7a38; }

/* ===================== IA jurídica - peças (M2/M7) ===================== */
.jur-box { margin: 14px 0 8px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); }
.jur-titulo { font-size: 13.5px; font-weight: 800; color: var(--ink); margin-bottom: 10px; }
.jur-controles { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.jur-controles .p-select { flex: 1; min-width: 180px; }
.jur-intimacao-wrap { font-size: 12.5px; color: var(--ink-2); display: flex; align-items: center; gap: 6px; }
.jur-intimacao-wrap input { border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; font-family: inherit; font-size: 13px; }
.jur-box .p-textarea { width: 100%; margin-bottom: 8px; }
.jur-interessado { margin-bottom: 8px; font-size: 12.5px; }
.jur-interessado summary { cursor: pointer; color: var(--green-d); font-weight: 600; }
.jur-interessado input { display: block; width: 100%; margin-top: 6px; border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; font-family: inherit; font-size: 13px; }
.jur-erro { color: var(--danger); font-size: 13px; margin: 8px 0 0; }
.edital-juridico { margin-top: 4px; }
.jur-prazo { background: #fff8e6; border: 1px solid #f3d98a; border-left: 4px solid #e0a516; border-radius: 9px; padding: 10px 12px; font-size: 12.8px; color: #5a4a1a; margin-bottom: 10px; line-height: 1.5; }
/* prazo já vencido não pode ter a mesma cara de prazo que ainda corre */
.jur-prazo.vencido { background: #fdecec; border-color: #f0b4b4; border-left-color: #d64545; color: #7a2020; }
.jur-venc { color: #b02020; }
.jur-hoje { color: #a06a00; }
.jur-peca { background: var(--surface); border: 1px solid var(--line); border-radius: 9px; padding: 14px 16px; font-size: 13px; line-height: 1.6; color: var(--ink); max-height: 460px; overflow-y: auto; }
.jur-acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.jur-titulo-input { flex: 1; min-width: 160px; border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; font-family: inherit; font-size: 13px; }

/* Aba Jurídico: peças salvas */
.pecas-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; max-width: 1100px; margin: 0 auto; }
.peca-card { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--teal); border-radius: 12px; padding: 14px 16px; box-shadow: var(--shadow-sm); }
.peca-cab { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 6px; }
.peca-tipo { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; background: #e7f0fb; color: #1d4ed8; padding: 2px 8px; border-radius: 20px; }
.peca-prazo { font-size: 11.5px; font-weight: 700; background: #fff8e6; color: #92660a; padding: 2px 8px; border-radius: 20px; }
.peca-data { font-size: 11.5px; margin-left: auto; }
.peca-tit { font-weight: 700; color: var(--ink); margin-bottom: 2px; }
.peca-orgao { font-size: 12px; margin-bottom: 6px; }
.peca-prev { font-size: 12px; color: var(--ink-2); line-height: 1.5; margin-bottom: 10px; white-space: pre-wrap; }
.peca-acoes { display: flex; gap: 8px; align-items: center; }
.peca-acoes .t-del { margin-left: auto; }
.peca-full { margin-top: 10px; }
.peca-full .jur-peca { max-height: 320px; }
/* Compositor de peça (modo sem IA) */
.peca-composer { max-width: 1100px; margin: 0 auto 18px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); padding: 18px 20px; }
.peca-composer .jur-titulo { font-size: 15px; font-weight: 800; color: var(--ink); margin-bottom: 12px; }
.cp-row { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.cp-inp { flex: 1; min-width: 200px; border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; font-family: inherit; font-size: 13.5px; }
.cp-inp:focus, .cp-texto:focus { outline: 0; border-color: var(--green); box-shadow: 0 0 0 3px rgba(22,163,74,.14); }
.cp-acoes { display: flex; gap: 8px; align-items: center; margin-top: 10px; }
.cp-acoes .btn-score { width: auto; }
.cp-texto { width: 100%; margin-top: 12px; border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; font-family: "Times New Roman", Georgia, serif; font-size: 13.5px; line-height: 1.6; resize: vertical; color: var(--ink); }
.jur-erro { color: var(--danger); font-size: 13px; margin: 8px 0; }

/* ----------------- Monitorar (M7) ----------------- */
.mon-status { margin-left: 12px; font-size: 13.5px; color: var(--ink-2); }
.mon-status.erro { color: var(--danger); }
.mon-add { max-width: 1100px; margin: 0 auto 18px; display: flex; gap: 10px; align-items: center;
  flex-wrap: wrap; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; }
.mon-add label { font-weight: 700; color: var(--ink); font-size: 14px; }
.mon-add select { flex: 1; min-width: 200px; padding: 9px 12px; border: 1px solid var(--line);
  border-radius: 9px; background: var(--surface); color: var(--ink); font-size: 14px; }
.mon-add .btn-score { width: auto; }
.mon-cols { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.mon-h { font-size: 15px; font-weight: 800; color: var(--ink); margin: 0 0 12px; }
.mon-link { color: var(--green-d); font-weight: 600; text-decoration: none; font-size: 13px; }
.mon-link:hover { text-decoration: underline; }
.mon-lista { display: flex; flex-direction: column; gap: 10px; }
.mon-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; box-shadow: var(--shadow-sm); }
.mon-card-top { display: flex; align-items: center; gap: 8px; color: var(--ink); }
.mon-card-top b { font-size: 14px; }
.mon-card-meta { font-size: 13px; color: var(--ink-2); margin: 4px 0 8px; display: flex; align-items: center;
  gap: 8px; flex-wrap: wrap; }
.mon-pill { background: var(--green-l); color: var(--green-d); border-radius: 999px; padding: 2px 9px; font-size: 12px; font-weight: 700; }
.mon-badge-min { margin-left: auto; background: var(--green); color: #fff; border-radius: 999px;
  min-width: 20px; height: 20px; padding: 0 6px; font-size: 12px; font-weight: 700; display: inline-flex;
  align-items: center; justify-content: center; }
.mon-card-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12.5px; }
.mon-x { margin-left: auto; border: 0; background: none; color: var(--danger); cursor: pointer; font-size: 12.5px; padding: 2px; }
.mon-x:hover { text-decoration: underline; }
.mon-eventos { display: flex; flex-direction: column; gap: 8px; }
.mon-ev { display: flex; align-items: flex-start; gap: 10px; background: var(--surface); border: 1px solid var(--line);
  border-radius: 11px; padding: 10px 12px; }
.mon-ev.novo { border-left: 4px solid var(--green); background: #f6fcf8; }
.mon-ev.lido { opacity: .7; }
.mon-ev-ic { font-size: 18px; line-height: 1.4; }
.mon-ev-body { flex: 1; min-width: 0; }
.mon-ev-tit { font-size: 13.5px; color: var(--ink); }
.mon-ev-det { font-size: 13px; color: var(--ink-2); margin-top: 2px; word-break: break-word; }
.mon-ev-sub { font-size: 12px; margin-top: 3px; }
.mon-ev-lido { border: 1px solid var(--green); background: var(--surface); color: var(--green-d); border-radius: 8px;
  width: 26px; height: 26px; cursor: pointer; flex: 0 0 auto; font-weight: 700; }
.mon-ev-lido:hover { background: var(--green-l); }
@media (max-width: 860px) { .mon-cols { grid-template-columns: 1fr; } }

/* ----------------- Sino de notificações (M10) ----------------- */
.topbar-right { display: flex; align-items: center; gap: 12px; }
.sino-box { position: relative; }
.sino-btn { position: relative; background: var(--surface-2); border: 1px solid var(--line);
  color: var(--ink-2); width: 38px; height: 38px; border-radius: 10px; font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sino-btn:hover { background: var(--line-2); color: var(--ink); }
.sino-ic { display: inline-block; transform-origin: 50% 12%; line-height: 1; }
.sino-btn.tocando .sino-ic { animation: sino-shake 1.1s ease; }
@keyframes sino-shake {
  0%,72%,100% { transform: rotate(0); }
  8% { transform: rotate(16deg); } 16% { transform: rotate(-14deg); }
  24% { transform: rotate(12deg); } 32% { transform: rotate(-9deg); }
  40% { transform: rotate(7deg); } 48% { transform: rotate(-5deg); }
  56% { transform: rotate(3deg); } 64% { transform: rotate(-2deg); }
}
.sino-badge { position: absolute; top: -5px; right: -5px; min-width: 17px; height: 17px; padding: 0 4px;
  border-radius: 999px; background: #e5484d; color: #fff; font-size: 10.5px; font-weight: 800;
  line-height: 17px; text-align: center; box-shadow: 0 0 0 2px var(--surface); }
.sino-btn.tocando .sino-badge { animation: sino-pop .5s ease; }
@keyframes sino-pop { 0% { transform: scale(.6); } 50% { transform: scale(1.3); } 100% { transform: scale(1); } }
.sino-painel { position: absolute; right: 0; top: 116%; width: 340px; max-width: 90vw; background: var(--surface);
  border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); z-index: 70; overflow: hidden; }
.sino-cab { display: flex; align-items: center; gap: 8px; padding: 11px 13px; border-bottom: 1px solid var(--line); }
.sino-tit { font-weight: 800; color: var(--ink); font-size: 14px; margin-right: auto; }
.sino-acao { background: none; border: 0; color: var(--green-d); font-size: 12.5px; font-weight: 700;
  cursor: pointer; padding: 3px 6px; border-radius: 7px; }
.sino-acao:hover { background: var(--surface-2); }
.sino-lista { max-height: 380px; overflow-y: auto; }
.sino-item { display: flex; gap: 9px; padding: 10px 13px; border-bottom: 1px solid var(--surface-2); cursor: pointer; }
.sino-item:hover { background: var(--surface-2); }
.sino-item.novo { background: #f6fcf8; border-left: 3px solid var(--green); }
.sino-item-ic { font-size: 16px; line-height: 1.35; }
.sino-item-txt { min-width: 0; }
.sino-item-tit { font-size: 13px; color: var(--ink); font-weight: 700; }
.sino-item-det { font-size: 12.5px; color: var(--ink-2); margin-top: 1px; word-break: break-word; }
.sino-item-sub { font-size: 11.5px; margin-top: 2px; }
.sino-vazio { padding: 26px 16px; text-align: center; color: var(--ink-2); font-size: 13.5px; line-height: 1.7; }
.sino-rodape { padding: 9px 13px; border-top: 1px solid var(--line); text-align: center; }
.sino-rodape a { color: var(--green-d); font-weight: 700; font-size: 13px; cursor: pointer; }
.sino-rodape a:hover { text-decoration: underline; }
@media (max-width: 720px) { .sino-painel { position: fixed; right: 8px; left: 8px; top: 62px; width: auto; max-width: none; } }

/* ----------------- Sala de Disputa (M6) ----------------- */
.disp-lista { max-width: 1100px; margin: 0 auto; }
.disp-nova-card { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin-bottom: 16px; }
.disp-nova-card .cp-inp { flex: 1; min-width: 180px; }
.disp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.disp-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 13px 15px;
  box-shadow: var(--shadow-sm); cursor: pointer; transition: border-color var(--t), box-shadow var(--t), transform var(--t); }
.disp-card:hover { border-color: #d4e3dc; transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.disp-card:active { transform: translateY(0); }
.disp-card-top { display: flex; align-items: center; gap: 8px; color: var(--ink); }
.disp-card-top b { font-size: 14px; flex: 1; }
.disp-card-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 9px; font-size: 12.5px; }
.disp-stag { font-size: 11px; font-weight: 800; border-radius: 999px; padding: 2px 9px; }
.disp-stag.s-preparando { background: var(--surface-2); color: var(--ink-2); }
.disp-stag.s-ao_vivo { background: #e5484d; color: #fff; }
.disp-stag.s-encerrada { background: var(--green-l); color: var(--green-d); }
.disp-x { border: 0; background: none; color: var(--danger); cursor: pointer; font-size: 12.5px; }
.disp-x:hover { text-decoration: underline; }

.disp-sala { max-width: 1200px; margin: 0 auto; }
.disp-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.disp-voltar { border: 1px solid var(--line); background: var(--surface); border-radius: 9px; padding: 7px 12px; cursor: pointer; font-weight: 700; color: var(--ink-2); }
.disp-voltar:hover { background: var(--surface-2); }
.disp-titulo { flex: 1; min-width: 200px; font-size: 18px; font-weight: 800; color: var(--ink); border: 1px solid transparent; border-radius: 8px; padding: 6px 8px; background: transparent; }
.disp-titulo:hover, .disp-titulo:focus { border-color: var(--line); background: var(--surface); outline: 0; }
.disp-sala-st { border: 1px solid var(--line); border-radius: 9px; padding: 7px 10px; font-weight: 700; background: var(--surface); }
.disp-sub { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 8px 2px 14px; font-size: 13px; }
.disp-decr { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.disp-decr .disp-num { width: 100px; }
.disp-tools { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.disp-tools .btn-score { width: auto; }
.disp-imp { display: flex; gap: 8px; align-items: center; }
.disp-imp .cp-inp { min-width: 170px; }
.disp-agg { margin-left: auto; font-size: 13.5px; color: var(--ink); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; }

.disp-grade-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.disp-grade { width: 100%; border-collapse: collapse; min-width: 880px; }
.disp-grade th { text-align: left; font-size: 11.5px; text-transform: uppercase; letter-spacing: .03em;
  color: var(--ink-3); background: var(--surface-2); padding: 9px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.disp-grade td { padding: 7px 10px; border-bottom: 1px solid var(--surface-2); vertical-align: middle; }
.disp-grade .disp-i { color: var(--ink-3); font-size: 12px; }
.disp-grade input, .disp-grade select { border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; font-size: 13px; color: var(--ink); background: var(--surface); }
.disp-grade input:focus, .disp-grade select:focus { outline: 0; border-color: var(--green); box-shadow: 0 0 0 3px rgba(22,163,74,.13); }
.disp-desc { width: 100%; min-width: 160px; }
.disp-num { width: 96px; text-align: right; }
.disp-qtd { white-space: nowrap; } .disp-qtd .disp-num { width: 64px; } .disp-un { width: 48px; margin-left: 4px; }
.disp-st { font-weight: 700; }
.disp-dec-cell { min-width: 250px; }
.disp-dec { display: inline-block; font-size: 12.5px; font-weight: 700; padding: 3px 8px; border-radius: 7px; }
.disp-dec.ok { background: var(--green-l); color: var(--green-d); }
.disp-dec.perigo { background: var(--danger-bg); color: var(--danger); }
.disp-dec.n { background: var(--surface-2); color: var(--ink-3); }
.disp-darlance { display: inline-block; margin-left: 6px; margin-top: 4px; border: 1px solid var(--green); background: var(--green); color: #fff;
  border-radius: 8px; padding: 5px 10px; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.disp-darlance:hover { background: var(--green-d); }
.disp-rm { border: 0; background: none; color: var(--danger); cursor: pointer; font-size: 15px; }

.disp-rodape { margin-top: 16px; display: grid; gap: 14px; }
.disp-reg { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 12px; padding: 11px 14px; }
.disp-reg .cp-inp { min-width: 170px; } .disp-reg .disp-num { width: 120px; }
.disp-reg label { font-size: 13px; display: inline-flex; align-items: center; gap: 4px; }
.disp-reg .btn-score { width: auto; }
.disp-hist summary { cursor: pointer; font-weight: 700; color: var(--ink); padding: 6px 0; }
.disp-hist-lista { display: flex; flex-direction: column; gap: 5px; padding: 6px 0; }
.disp-lance-row { display: grid; grid-template-columns: 100px 110px 1fr 130px; gap: 8px; font-size: 13px; align-items: center;
  padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; }
.disp-lance-q { font-weight: 800; font-size: 11px; text-transform: uppercase; border-radius: 999px; padding: 2px 8px; text-align: center; }
.disp-lance-row.nos .disp-lance-q { background: var(--green-l); color: var(--green-d); }
.disp-lance-row.conc .disp-lance-q { background: var(--danger-bg); color: var(--danger); }
.disp-diario label { display: block; font-weight: 700; color: var(--ink); margin-bottom: 6px; }
.disp-diario textarea { width: 100%; min-height: 80px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px;
  font-size: 13.5px; color: var(--ink); resize: vertical; font-family: inherit; }
.disp-diario textarea:focus { outline: 0; border-color: var(--green); box-shadow: 0 0 0 3px rgba(22,163,74,.13); }
@media (max-width: 820px) { .disp-agg { margin-left: 0; } .disp-decr { margin-left: 0; } }

/* ===================== Sidebar (layout "Barra lateral") + preferências ===================== */
:root { --sb-w: 244px; }
.sidebar { display: none; }
.page-title { display: none; }
/* bloco do título da tela na topbar: nome + resumo (VIEWS[].sub) empilhados */
.page-head { display: none; }
.page-sub { display: none; }

/* mecânica compartilhada pelas DUAS barras laterais (clássica escura + clara/escura) */
.nav-lateral .sidebar {
  display: flex; flex-direction: column;
  position: fixed; top: 0; left: 0; bottom: 0; width: var(--sb-w); z-index: 50;
  padding: 12px 12px 10px; overflow-y: auto; transition: width .18s, transform .2s;
}
body[data-nav="sidebar"] .sidebar { background: linear-gradient(180deg, #0c463d, #0a3a33); color: #cfe3dc; }
.nav-lateral .topbar { margin-left: var(--sb-w); }
.nav-lateral main.view { margin-left: var(--sb-w); }
/* O aviso de e-mail é irmão da topbar no HTML e precisa do MESMO recuo: sem isto ele passa
   por baixo da barra lateral (fixed, z-index 50) e o começo da frase some da tela. Bug real,
   invisível para auditoria de geometria (o elemento tem largura e altura corretas, só está
   coberto) e visível de olho no primeiro screenshot. */
.nav-lateral .aviso-email { margin-left: var(--sb-w); }
.nav-lateral .topbar .nav,
.nav-lateral .topbar .brand,
.nav-lateral .topbar .nav-burger { display: none; }
.nav-lateral .page-head { display: flex; flex-direction: column; justify-content: center; min-width: 0; gap: 1px; }
.nav-lateral .page-title { display: block; font-weight: 800; font-size: 16px; color: var(--ink); line-height: 1.2; }
.nav-lateral .page-sub { display: block; font-size: 11.5px; font-weight: 600; color: var(--ink-3); line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 68ch; }
.page-sub:empty { display: none; }
.nav-lateral.sb-collapsed { --sb-w: 66px; }
.nav-lateral.sb-collapsed .sb-tx,
.nav-lateral.sb-collapsed .sb-grp,
.nav-lateral.sb-collapsed .sb-brand-tt,
.nav-lateral.sb-collapsed .sb-search,
.nav-lateral.sb-collapsed .sb-item .badge,
.nav-lateral.sb-collapsed .sb-sw { display: none; }
.nav-lateral.sb-collapsed .sb-item,
.nav-lateral.sb-collapsed .sb-collapse,
.nav-lateral.sb-collapsed .sb-foot-btn { justify-content: center; }

.sb-brand { display: flex; align-items: center; gap: 8px; padding: 6px 8px 12px; border-bottom: 1px solid rgba(255,255,255,.08); margin-bottom: 6px; }
.sb-brand .brand-mark { color: var(--accent); font-size: 18px; }
.sb-brand-tt { display: flex; flex-direction: column; line-height: 1.1; }
.sb-brand-name { font-weight: 800; letter-spacing: .12em; color: #fff; font-size: 15px; }
.sb-brand-sub { font-size: 11px; font-weight: 600; letter-spacing: .04em; color: var(--accent); }
.sb-nav { display: flex; flex-direction: column; gap: 2px; }
.sb-grp { font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #7fa99c; padding: 12px 10px 4px; }
.sb-item { display: flex; align-items: center; gap: 11px; padding: 9px 10px; border-radius: 9px; color: #dcebe5; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.sb-item:hover { background: rgba(255,255,255,.07); color: #fff; text-decoration: none; }
.sb-item.active { background: rgba(25,184,122,.20); color: #fff; box-shadow: inset 3px 0 0 var(--accent); }
.sb-ic { width: 20px; text-align: center; flex: 0 0 auto; }
.sb-item .badge { margin-left: auto; background: var(--accent); color: #06281f; }
.sb-collapse { margin-top: auto; display: flex; align-items: center; gap: 11px; border: 0; background: rgba(255,255,255,.06); color: #cfe3dc; border-radius: 9px; padding: 10px; cursor: pointer; font-size: 13px; font-weight: 600; font-family: inherit; }
.sb-collapse:hover { background: rgba(255,255,255,.12); }
.sb-collapse .sb-col-ic { width: 20px; text-align: center; }
body.sb-collapsed .sb-collapse .sb-col-ic { transform: rotate(180deg); }

/* Sidebar no mobile: vira off-canvas (desliza da esquerda) */
@media (max-width: 820px) {
  .nav-lateral .topbar { position: sticky; top: 0; margin-left: 0; }
  .nav-lateral main.view { margin-left: 0; }
  /* No celular a barra lateral vira gaveta e não ocupa espaço: manter o recuo aqui espremia
     o aviso em 131px e a frase transbordava do próprio aviso. */
  .nav-lateral .aviso-email { margin-left: 0; }
  /* Alvo de toque: 26px de altura é menor que a ponta do dedo. */
  .aviso-email { padding: 10px 14px; }
  .ae-btn { padding: 9px 14px; min-height: 40px; }
  .nav-lateral .topbar .brand { display: flex; }
  .nav-lateral .topbar .nav-burger { display: flex; }
  .nav-lateral .page-title { display: none; }
  .nav-lateral .page-head { display: none; }
  .nav-lateral .sidebar { width: 250px; transform: translateX(-100%); box-shadow: 0 0 44px rgba(0,0,0,.45); }
  .nav-lateral .sidebar.open { transform: translateX(0); }
  .nav-lateral .nav-overlay { display: block; position: fixed; inset: 0; z-index: 49; background: rgba(7,28,22,.45); opacity: 0; pointer-events: none; transition: opacity .25s; }
  .nav-lateral .nav-overlay.open { opacity: 1; pointer-events: auto; }
}

/* ===================== Ícones da nav: vazado (SVG) ou colorido (emoji) - Aparência global ===================== */
.nav-svg { width: 20px; height: 20px; flex: 0 0 auto; }
.sb-ic .nav-svg { width: 20px; height: 20px; display: block; margin: 0 auto; }
.nav-ic { display: inline-flex; align-items: center; }
.nav-ic .nav-svg { width: 1.15em; height: 1.15em; vertical-align: -0.2em; }

/* ===================== 6º layout: Barra lateral clara/escura ===================== */
.sb-dl { display: none; }                             /* elementos exclusivos do 6º layout */
body[data-nav="lateraltema"] .sb-dl { display: flex; }
body[data-nav="lateraltema"] #sb-collapse { display: none; }   /* recolher fica no ‹ do topo */

/* skin claro/escuro (segue o tema via tokens) */
body[data-nav="lateraltema"] .sidebar {
  background: var(--sb-tint, var(--surface)); color: var(--ink-2);
  border-right: 1px solid var(--line); box-shadow: 2px 0 16px rgba(8,30,24,.05);
}
body[data-nav="lateraltema"] .sb-brand { position: relative; border-bottom: 1px solid var(--line); }
body[data-nav="lateraltema"] .sb-brand-name { color: var(--ink); }
body[data-nav="lateraltema"] .sb-grp { color: var(--ink-3); }
body[data-nav="lateraltema"] .sb-item { color: var(--ink-2); }
body[data-nav="lateraltema"] .sb-item:hover { background: var(--sb-tint-h, var(--surface-2)); color: var(--ink); }
body[data-nav="lateraltema"] .sb-item.active { background: var(--accent); color: #fff; box-shadow: 0 5px 14px rgba(8,30,24,.16); }
body[data-nav="lateraltema"] .sb-item .badge { background: var(--green-d); color: #fff; }
body[data-nav="lateraltema"] .sb-item.active .badge { background: rgba(255,255,255,.3); color: #fff; }

/* recolher no topo (‹) */
.sb-collapse-top { position: absolute; right: 8px; top: 9px; border: 0; background: var(--surface-2); color: var(--ink-3);
  width: 24px; height: 24px; border-radius: 7px; cursor: pointer; font-size: 17px; line-height: 1; align-items: center; justify-content: center; }
.sb-collapse-top:hover { color: var(--ink); }
.nav-lateral.sb-collapsed .sb-col-ic2 { display: inline-block; transform: rotate(180deg); }

/* busca no topo da barra */
.sb-search { align-items: center; gap: 8px; background: var(--surface-2); border: 1px solid var(--line);
  border-radius: 10px; padding: 8px 11px; margin: 2px 0 8px; }
.sb-search-ic { width: 17px; height: 17px; color: var(--ink-3); flex: none; }
.sb-search input { border: 0; background: none; outline: none; color: var(--ink); font: 500 13.5px inherit; width: 100%; }
.sb-search input::placeholder { color: var(--ink-3); }

/* rodapé: alternador de tema + sair */
.sb-foot { margin-top: auto; display: flex; flex-direction: column; gap: 2px; padding-top: 8px; }
.sb-foot-btn { display: flex; align-items: center; gap: 11px; border: 0; background: none; border-radius: 9px;
  padding: 9px 10px; cursor: pointer; font: 600 13.5px inherit; color: var(--ink-2); width: 100%; text-align: left; }
.sb-foot-btn:hover { background: var(--sb-tint-h, var(--surface-2)); color: var(--ink); }
.sb-fic { width: 20px; display: inline-flex; flex: none; }
.sb-fic svg { width: 20px; height: 20px; }
.sb-sw { margin-left: auto; width: 38px; height: 20px; border-radius: 20px; background: var(--line); position: relative; transition: background .2s; flex: none; }
.sb-sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: left .2s; box-shadow: 0 1px 3px rgba(0,0,0,.3); }
.sb-sw.on { background: var(--accent); }
.sb-sw.on::after { left: 20px; }

/* Tooltip quando a barra está RECOLHIDA (só ícones), ancorado no body p/ escapar o overflow da barra */
.sb-tip-float {
  position: fixed; transform: translateY(-50%); z-index: 3000; pointer-events: none;
  background: var(--ink); color: var(--surface); padding: 6px 11px; border-radius: 8px;
  font-size: 12.5px; font-weight: 600; white-space: nowrap; box-shadow: 0 6px 18px rgba(8,30,24,.28);
  animation: sb-tip-in .09s var(--ease);
}
.sb-tip-float::before {
  content: ""; position: absolute; right: 100%; top: 50%; transform: translateY(-50%);
  border: 6px solid transparent; border-right-color: var(--ink);
}
@keyframes sb-tip-in { from { opacity: 0; transform: translate(-4px, -50%); } to { opacity: 1; transform: translate(0, -50%); } }
@media (prefers-reduced-motion: reduce) { .sb-tip-float { animation: none; } }

/* Config: thumb clara/escura + badge NOVO */
.cfg-side.dl { background: linear-gradient(90deg, #ffffff 55%, #1f2233 55%) !important; }
.cfg-novo { font-size: 9px; font-weight: 800; background: #334155; color: #fff; border-radius: 5px; padding: 1px 5px; vertical-align: middle; }
.cfg-swatches { display: flex; gap: 9px; flex-wrap: wrap; }
.cfg-sw { width: 30px; height: 30px; border-radius: 9px; border: 2px solid transparent; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); position: relative; padding: 0; }
.cfg-sw.on { border-color: var(--ink); }
.cfg-sw.on::after { content: "✓"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 900; font-size: 14px; }
/* Fundos: tons off-white, o ✓ branco some, use tinta escura */
#cfg-fundos .cfg-sw.on::after { color: var(--ink); }
.cfg-hint { font-size: 12px; color: var(--ink-3); margin: 7px 0 0; }

/* ===================== Configurações (guia ⚙) ===================== */
.cfg-sec { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: 20px 22px; margin: 0 auto 18px; max-width: 1000px; }
.cfg-h { font-size: 15px; font-weight: 800; color: var(--ink); margin: 0 0 4px; }
.cfg-d { font-size: 13px; color: var(--ink-2); margin: 0 0 16px; }
.cfg-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.cfg-lc { border: 1.5px solid var(--line); border-radius: 14px; padding: 11px; cursor: pointer; transition: var(--t); position: relative; background: var(--surface); }
.cfg-lc:hover:not(.disabled) { border-color: #c7e8d6; box-shadow: var(--shadow-sm); }
.cfg-lc.on { border-color: var(--green); box-shadow: 0 0 0 3px rgba(22,163,74,.15); }
.cfg-lc.on::after { content: "✓"; position: absolute; top: 8px; right: 8px; width: 21px; height: 21px; border-radius: 50%; background: var(--green); color: #fff; font-size: 12px; font-weight: 800; display: grid; place-items: center; }
.cfg-lc.disabled { opacity: .55; cursor: not-allowed; }
.cfg-nm { font-weight: 800; font-size: 13px; color: var(--ink); margin-top: 8px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cfg-rec { font-size: 9px; font-weight: 800; background: var(--green); color: #fff; border-radius: 5px; padding: 1px 5px; }
.cfg-soon { font-size: 9.5px; font-weight: 800; background: var(--surface-2); color: var(--ink-3); border-radius: 5px; padding: 1px 6px; }
.cfg-ds { font-size: 11.5px; color: var(--ink-2); margin-top: 3px; line-height: 1.4; }
.cfg-thumb { height: 74px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; display: flex; background: #eef3f0; }
.cfg-thumb.col { flex-direction: column; }
.cfg-side { width: 26px; background: linear-gradient(180deg, #0c463d, #0a3a33); flex: 0 0 auto; }
.cfg-top { height: 15px; background: linear-gradient(180deg, #0c463d, #0a3a33); }
.cfg-top2 { height: 24px; background: linear-gradient(180deg, #0c463d 0, #0a3a33 58%, #fff 58%, #fff 100%); }
.cfg-topseg { height: 15px; background: repeating-linear-gradient(90deg, #0c463d 0, #0c463d 26px, #2c6258 26px, #2c6258 28px); }
.cfg-toppill { height: 15px; background: #0a3a33; position: relative; }
.cfg-toppill::after { content: ""; position: absolute; left: 50%; top: 4px; transform: translateX(-50%); width: 40px; height: 7px; border-radius: 4px; background: rgba(255,255,255,.25); }
.cfg-cont { flex: 1; padding: 7px; display: flex; flex-direction: column; gap: 5px; background: var(--surface-2); }
.cfg-cont i { height: 6px; border-radius: 3px; background: #dde6e1; display: block; }
.cfg-cont i.s { width: 55%; }
.cfg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cfg-fld label { display: block; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; color: var(--ink-3); margin-bottom: 8px; }
.cfg-sel { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 13.5px; background: var(--surface); }
.cfg-sel:focus { outline: 0; border-color: var(--green); box-shadow: 0 0 0 3px rgba(22,163,74,.14); }
.cfg-seg { display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.cfg-seg button { border: 0; background: var(--surface); padding: 9px 16px; font-size: 13.5px; font-weight: 700; color: var(--ink-2); cursor: pointer; font-family: inherit; }
.cfg-seg button.on { background: var(--green); color: #fff; }
.cfg-note { display: flex; gap: 9px; align-items: center; background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af; border-radius: 12px; padding: 11px 14px; font-size: 13px; font-weight: 600; max-width: 1000px; margin: 0 auto; }
@media (max-width: 760px) { .cfg-grid { grid-template-columns: 1fr; } }
/* governança da equipe */
.cfg-lock { display: flex; gap: 9px; align-items: center; background: #fffbeb; border: 1px solid #fde68a; color: #92400e; border-radius: 12px; padding: 11px 14px; font-size: 13px; font-weight: 600; margin-bottom: 14px; }
.cfg-lc.travado { opacity: .6; cursor: not-allowed; }
.cfg-lc.travado:hover { border-color: var(--line); box-shadow: none; }
.cfg-admintag { font-size: 10px; font-weight: 800; background: var(--green-l); color: var(--green-d); border-radius: 6px; padding: 2px 7px; vertical-align: middle; }
.cfg-pol { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cfg-polbtn { text-align: left; border: 1.5px solid var(--line); border-radius: 12px; padding: 13px 15px; background: var(--surface); cursor: pointer; font-family: inherit; display: flex; flex-direction: column; gap: 3px; transition: var(--t); }
.cfg-polbtn b { font-size: 14px; color: var(--ink); }
.cfg-polbtn span { font-size: 12px; color: var(--ink-2); }
.cfg-polbtn:hover { border-color: #c7e8d6; }
.cfg-polbtn.on { border-color: var(--green); box-shadow: 0 0 0 3px rgba(22,163,74,.15); background: var(--green-l); }   /* token: adapta ao claro/escuro + segue a cor */
.cfg-polbtn.bloqueado { opacity: .65; }
.cfg-polbtn.bloqueado b::after { content: " ⭐"; }
.cfg-upsell { margin-top: 12px; background: #fffbeb; border: 1px solid #fde68a; color: #92400e; border-radius: 12px; padding: 11px 14px; font-size: 13px; font-weight: 600; }
.cfg-upsell a { color: var(--green-d); font-weight: 800; cursor: pointer; }
@media (max-width: 620px) { .cfg-pol { grid-template-columns: 1fr; } }

/* ===================== Layouts extras (Fase 3): por fases · dois níveis · busca global ===================== */
.topbar .nav, #bar-fases, #bar-cmd, #bar-dois { display: none; }
body[data-nav="topbar"] .topbar .nav { display: flex; }
body[data-nav="fases"] #bar-fases { display: flex; }
body[data-nav="comando"] #bar-cmd { display: flex; }
body[data-nav="dois"] #bar-dois { display: block; }

/* --- POR FASES --- */
.bar-fases { align-items: stretch; background: linear-gradient(180deg,#0c463d,#0a3a33); color: #eaf5f0; padding: 0 16px; position: sticky; top: 64px; z-index: 39; overflow-x: auto; box-shadow: 0 2px 10px rgba(0,0,0,.18); }
.bf-grp { display: flex; align-items: center; padding: 0 14px; border-right: 1px solid rgba(255,255,255,.12); position: relative; min-height: 54px; }
.bf-grp:last-child { border-right: 0; }
.bf-lbl { position: absolute; top: 7px; left: 14px; font-size: 9.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: #7fa99c; }
.bf-items { display: flex; gap: 4px; margin-top: 14px; }
.bar-fases .nav-item { font-size: 13.5px; font-weight: 600; color: #cfe3dc; padding: 6px 11px; border-radius: 8px; white-space: nowrap; }
.bar-fases .nav-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.bar-fases .nav-item.active { color: #fff; background: rgba(25,184,122,.20); box-shadow: inset 0 -2px 0 var(--accent); }

/* --- DOIS NÍVEIS --- */
.bar-dois { position: sticky; top: 64px; z-index: 39; }
.nd-areas { display: flex; gap: 22px; background: linear-gradient(180deg,#0c463d,#0a3a33); color: #eaf5f0; padding: 0 24px; overflow-x: auto; }
.nd-area { border: 0; background: none; color: #bcd6cd; font-weight: 700; font-size: 14px; padding: 12px 6px; cursor: pointer; font-family: inherit; border-bottom: 2px solid transparent; white-space: nowrap; }
.nd-area:hover { color: #fff; }
.nd-area.on { color: #fff; border-bottom-color: var(--accent); }
.nd-subs { background: var(--surface); border-bottom: 1px solid var(--line); padding: 0 24px; box-shadow: var(--shadow-sm); }
.nd-sub { display: none; gap: 4px; }
.nd-sub.on { display: flex; flex-wrap: wrap; }
.nd-sub .nav-item { color: var(--ink-2); font-size: 13.5px; font-weight: 600; padding: 9px 12px; border-radius: 8px; }
.nd-sub .nav-item:hover { background: var(--surface-2); color: var(--ink); }
.nd-sub .nav-item.active { color: var(--green-d); background: var(--green-l); }

/* --- BUSCA GLOBAL ⌘K --- */
.bar-cmd { align-items: center; gap: 18px; background: linear-gradient(180deg,#0c463d,#0a3a33); color: #eaf5f0; padding: 10px 24px; position: sticky; top: 64px; z-index: 39; box-shadow: 0 2px 10px rgba(0,0,0,.18); }
.cmd-pill { flex: 1; max-width: 520px; display: flex; align-items: center; gap: 9px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); border-radius: 10px; padding: 9px 14px; color: #cfe3dc; cursor: pointer; font-size: 14px; font-family: inherit; }
.cmd-pill .cmd-k { margin-left: auto; font-size: 11px; background: rgba(255,255,255,.16); border-radius: 5px; padding: 2px 7px; font-weight: 700; }
.cmd-quick { display: flex; gap: 4px; }
.cmd-quick .nav-item { color: #cfe3dc; font-size: 14px; font-weight: 600; padding: 7px 12px; border-radius: 8px; white-space: nowrap; }
.cmd-quick .nav-item:hover { color: #fff; background: rgba(255,255,255,.08); }
.cmd-quick .nav-item.active { color: #fff; background: rgba(25,184,122,.18); }
.cmd-palette { position: fixed; inset: 0; background: rgba(8,20,16,.5); z-index: 90; display: flex; align-items: flex-start; justify-content: center; padding-top: 90px; }
.cmd-palette.hidden { display: none; }
.cmd-card { width: 560px; max-width: 94vw; background: var(--surface); border-radius: 16px; box-shadow: 0 30px 70px rgba(0,0,0,.4); overflow: hidden; }
.cmd-in { display: flex; align-items: center; gap: 10px; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.cmd-in input { flex: 1; border: 0; outline: 0; font-size: 16px; }
.cmd-in .cmd-esc { font-size: 11px; color: var(--ink-3); border: 1px solid var(--line); border-radius: 5px; padding: 2px 6px; }
.cmd-list { max-height: 52vh; overflow-y: auto; padding: 8px; }
.cmd-it { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 9px; font-size: 14.5px; color: var(--ink); cursor: pointer; }
.cmd-it:hover, .cmd-it.sel { background: var(--green-l); color: var(--green-d); }
.cmd-vazio { padding: 18px; text-align: center; color: var(--ink-3); font-size: 14px; }
.cmd-ic { flex: 0 0 20px; text-align: center; opacity: .85; }
.cmd-tx { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmd-gp { flex: 0 0 auto; font-size: 11px; font-weight: 700; color: var(--ink-3); background: var(--surface-2); padding: 1px 8px; border-radius: 20px; }
.cmd-it:hover .cmd-gp, .cmd-it.sel .cmd-gp { background: rgba(255,255,255,.55); color: var(--green-d); }

/* Seleção por teclado na lista de resultados (Fase 1) */
#lista .card.card-sel { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ============ Cockpit "Início" (Fase 2) ============ */
/* #view-inicio fica full-width (respeita o offset da sidebar); o .ck-wrap centraliza o conteúdo */
.ck-wrap { max-width: 1320px; margin: 0 auto; padding: 20px 32px 44px; }   /* centralizado + respiro simétrico (esq = dir) */
.ck-head { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; margin: 4px 0 18px; }
.ck-head h1 { font-size: 25px; font-weight: 800; color: var(--ink); letter-spacing: -.02em; margin: 0; }
.ck-sub { color: var(--ink-2); font-size: 14px; margin-top: 3px; text-transform: capitalize; }
.ck-acts { margin-left: auto; }
.ck-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.ck-kpi { position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: 16px 18px; overflow: hidden; }
.ck-kpi::after { content: ""; position: absolute; right: -22px; top: -22px; width: 84px; height: 84px; border-radius: 50%; background: radial-gradient(circle, rgba(25,184,122,.10), transparent 70%); }
.ck-kpi-ic { position: absolute; right: 14px; top: 13px; font-size: 17px; opacity: .5; }
.ck-kpi-l { font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; color: var(--ink-3); }
.ck-kpi-n { font-size: 26px; font-weight: 800; color: var(--ink); margin-top: 6px; line-height: 1; font-variant-numeric: tabular-nums; }
.ck-kpi-d { font-size: 12px; font-weight: 700; margin-top: 7px; color: var(--ink-3); }
.ck-kpi-d.warn { color: var(--warn); } .ck-kpi-d.info { color: var(--info); }
/* atrasado saiu de dentro do numero de 'Prazos (7 dias)' e virou subtitulo proprio */
.ck-kpi-d.danger { color: var(--danger); }
.ck-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ck-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: 16px 18px; }
.ck-card-funil { margin-top: 16px; }
.ck-card-h { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 800; color: var(--ink); margin-bottom: 10px; }
.ck-more { margin-left: auto; font-size: 12.5px; font-weight: 700; color: var(--green-d); cursor: pointer; }
.ck-more:hover { text-decoration: underline; }
.ck-feed { display: flex; align-items: center; gap: 11px; padding: 9px 0; border-bottom: 1px solid var(--line-2); }
.ck-feed:last-child { border-bottom: 0; }
.ck-feed-ic { flex: 0 0 auto; font-size: 15px; }
.ck-feed-b { flex: 1; min-width: 0; }
.ck-feed-t { font-size: 13.5px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ck-feed-d { font-size: 12px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ck-feed-w { flex: 0 0 auto; font-size: 11.5px; color: var(--ink-3); font-weight: 700; white-space: nowrap; }
.ck-feed.atras .ck-feed-w { color: var(--danger); } .ck-feed.hoje .ck-feed-w { color: var(--warn); }
/* Novidades: detalhe costuma ser uma frase longa; quebra em até 2 linhas (não estica até a data) */
#ck-novidades .ck-feed { align-items: flex-start; }
#ck-novidades .ck-feed-w { padding-top: 1px; }
#ck-novidades .ck-feed-d { white-space: normal; overflow-wrap: anywhere; text-overflow: ellipsis;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.4; }
.ck-vazio { color: var(--ink-3); font-size: 13px; padding: 10px 2px; }
.ck-funil { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.ck-fcol { text-align: center; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 12px 8px; }
.ck-fcol-n { font-size: 10.5px; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: .02em; line-height: 1.25; }
.ck-fcol-q { font-size: 22px; font-weight: 800; color: var(--ink); margin: 5px 0 2px; font-variant-numeric: tabular-nums; }
.ck-fcol-v { font-size: 11.5px; color: var(--ink-2); font-weight: 700; }
@media (max-width: 900px) { .ck-kpis { grid-template-columns: 1fr 1fr; } .ck-cols { grid-template-columns: 1fr; } .ck-funil { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 520px) { .ck-funil { grid-template-columns: 1fr 1fr; } }

/* ============ Urgência de prazo - linguagem única (Fase 2) ============ */
.prz { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700;
  padding: 2px 9px; border-radius: 20px; white-space: nowrap; line-height: 1.6; }
.prz-vencido { background: var(--surface-2); color: var(--ink-3); }   /* licitacao encerrada: nao ha o que fazer */
.prz-atrasado { background: var(--danger-bg); color: var(--danger); }  /* tarefa vencida: voce ainda deve isto */
.prz-hoje { background: var(--warn-bg); color: var(--warn); animation: prz-pulse 1.7s var(--ease) infinite; }
.prz-semana { background: #fef9c3; color: #92660a; }
.prz-futuro { background: var(--ok-bg); color: var(--ok); }
@keyframes prz-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(217,119,6,.30); } 50% { box-shadow: 0 0 0 4px rgba(217,119,6,0); } }
@media (prefers-reduced-motion: reduce) { .prz-hoje { animation: none; } }
html[data-theme="dark"] .prz-semana { background: #3a2f16; color: #fcd34d; }
/* Na Agenda a urgencia colore a DATA da linha: dentro de 'Proximos 7 dias', o item de
   2 dias e o de 7 tinham exatamente a mesma cara e so a borda do grupo dizia algo. */
.a-data.prz-atrasado, .a-data.prz-hoje, .a-data.prz-semana, .a-data.prz-futuro,
.a-data.prz-vencido { background: none; padding: 0; font-weight: 700; }
.a-data.prz-atrasado { color: var(--danger); } .a-data.prz-hoje { color: var(--warn); }
.a-data.prz-semana { color: #92660a; } .a-data.prz-futuro, .a-data.prz-vencido { color: var(--ink-3); }
/* ⚠️ No escuro, --warn e a cor da pilula .prz-semana sao ambos #fcd34d: como a data da
   Agenda nao tem fundo, "hoje" e "esta semana" sairiam IDENTICAS. Aqui a semana fica um
   tom abaixo, para os dois niveis continuarem distinguiveis sem o fundo. */
html[data-theme="dark"] .a-data.prz-semana { color: #c9a227; }

/* ============ Empty states que ensinam + agem (Fase 2) ============ */
.empty { text-align: center; padding: 46px 20px; }
.empty-ic { font-size: 40px; margin-bottom: 10px; line-height: 1; }
.empty-t { font-size: 16.5px; font-weight: 800; color: var(--ink); margin: 0 0 6px; }
.empty-d { font-size: 13.5px; color: var(--ink-2); max-width: 470px; margin: 0 auto 16px; line-height: 1.55; }
.empty-chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.empty-chip { border: 1px solid var(--line); background: var(--surface); color: var(--ink); font-size: 13px;
  font-weight: 600; padding: 7px 14px; border-radius: 20px; cursor: pointer; transition: var(--t); font-family: inherit; }
.empty-chip:hover { border-color: var(--green); background: var(--ok-bg); color: var(--green-d); }
.empty .search-btn { width: auto; }

/* ============ Onboarding de primeiro-uso (Fase 2) ============ */
.onboard { position: fixed; inset: 0; z-index: 70; background: rgba(7,28,22,.55); backdrop-filter: blur(3px);
  display: grid; place-items: center; padding: 20px; }
.onboard-card { background: var(--surface); border-radius: 18px; box-shadow: var(--shadow); max-width: 480px; width: 100%;
  padding: 28px 26px; text-align: center; animation: ob-in .25s var(--ease); }
@keyframes ob-in { from { transform: translateY(12px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .onboard-card { animation: none; } }
.onboard-ic { font-size: 42px; line-height: 1; }
.onboard-card h2 { font-size: 21px; font-weight: 800; color: var(--ink); margin: 8px 0 8px; }
.onboard-step > p { color: var(--ink-2); font-size: 14.5px; margin: 0 auto 18px; max-width: 400px; line-height: 1.55; }
.onboard-chips { display: flex; flex-wrap: wrap; gap: 9px; justify-content: center; margin-bottom: 22px; }
.onboard-chip { border: 1.5px solid var(--line); background: var(--surface); color: var(--ink); font-size: 13.5px;
  font-weight: 600; padding: 9px 14px; border-radius: 12px; cursor: pointer; transition: var(--t); font-family: inherit; }
.onboard-chip:hover { border-color: var(--green); }
.onboard-chip.on { border-color: var(--green); background: var(--ok-bg); color: var(--green-d); box-shadow: inset 0 0 0 1px var(--green); }
.onboard-acts { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.onboard-skip { border: 0; background: transparent; color: var(--ink-3); font-size: 13px; cursor: pointer; font-weight: 600; }
.onboard-skip:hover { color: var(--ink); }
.onboard-acts .search-btn { width: auto; }
.onboard-acts .search-btn:disabled { opacity: .5; cursor: default; }

/* ============ Celebração de vitória (Fase 3) ============ */
.confete-canvas { position: fixed; inset: 0; z-index: 90; pointer-events: none; display: none; }
.vitoria-ov { position: fixed; inset: 0; z-index: 95; display: none; place-items: center; padding: 20px;
  background: rgba(7,28,22,.5); backdrop-filter: blur(3px); }
.vitoria-ov.show { display: grid; }
.vitoria-card { background: var(--surface); border-radius: 20px; box-shadow: var(--shadow); max-width: 420px; width: 100%;
  padding: 32px 28px; text-align: center; animation: vit-in .3s var(--ease); }
@keyframes vit-in { from { transform: scale(.9); opacity: 0; } to { transform: none; opacity: 1; } }
.vitoria-ic { font-size: 60px; line-height: 1; animation: vit-bounce .6s var(--ease); }
@keyframes vit-bounce { 0% { transform: scale(0) rotate(-20deg); } 60% { transform: scale(1.2) rotate(8deg); } 100% { transform: scale(1) rotate(0); } }
.vitoria-card h2 { font-size: 26px; font-weight: 800; color: var(--green-d); margin: 10px 0 4px; }
.vitoria-item { font-size: 15px; color: var(--ink); font-weight: 600; margin: 0 0 6px; }
.vitoria-valor { font-size: 30px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; margin: 6px 0; }
.vitoria-sub { color: var(--ink-2); font-size: 13.5px; margin: 8px 0 20px; }
.vitoria-card .search-btn { width: auto; }
@media (prefers-reduced-motion: reduce) { .vitoria-ic, .vitoria-card { animation: none; } }

/* ===================== Paywall que vende (Fase 3) ===================== */
.pw-ov { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center;
  padding: 20px; background: rgba(9,20,16,.55); backdrop-filter: blur(3px); opacity: 0; transition: opacity .18s var(--ease); }
.pw-ov.show { opacity: 1; }
.pw-ov.hidden { display: none; }
.pw-card { position: relative; width: min(440px, 100%); background: var(--surface); border: 1px solid var(--line);
  border-radius: 18px; padding: 30px 28px 22px; box-shadow: var(--shadow-lift); text-align: center;
  transform: translateY(10px) scale(.98); transition: transform .2s var(--ease); }
.pw-ov.show .pw-card { transform: none; }
.pw-x { position: absolute; top: 12px; right: 12px; border: none; background: transparent; color: var(--ink-3);
  font-size: 18px; cursor: pointer; line-height: 1; padding: 4px 7px; border-radius: 8px; }
.pw-x:hover { background: var(--surface-2); color: var(--ink); }
.pw-ic { width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; font-size: 30px; background: var(--ok-bg); }
.pw-eyebrow { font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); margin-bottom: 6px; }
.pw-tit { font-size: 20px; font-weight: 800; color: var(--ink); margin: 0 0 8px; line-height: 1.25; }
.pw-desc { font-size: 14px; color: var(--ink-2); line-height: 1.55; margin: 0 auto 16px; max-width: 360px; }
.pw-benef { list-style: none; margin: 0 auto 18px; padding: 0; max-width: 320px; text-align: left; display: grid; gap: 8px; }
.pw-benef li { position: relative; padding-left: 26px; font-size: 13.5px; color: var(--ink); line-height: 1.4; }
.pw-benef li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 18px; height: 18px; border-radius: 50%;
  background: var(--ok-bg); color: var(--ok); font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.pw-plano { display: flex; align-items: center; justify-content: space-between; gap: 10px 14px; flex-wrap: wrap;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 11px 15px; margin-bottom: 18px; }
.pw-plano-nome { font-weight: 800; color: var(--ink); font-size: 14px; }
.pw-plano-tag { font-size: 11px; font-weight: 700; color: var(--accent); background: var(--ok-bg); padding: 1px 8px; border-radius: 20px; margin-left: 4px; }
.pw-plano-preco { font-size: 13px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.pw-plano-preco b { color: var(--ink); font-size: 15px; }
.pw-acoes { display: flex; flex-direction: column; gap: 8px; }
.pw-cta { background: var(--accent); color: #fff; border: none; border-radius: 11px; padding: 13px 20px;
  font-size: 15px; font-weight: 800; cursor: pointer; transition: background .15s var(--ease); }
.pw-cta:hover { background: var(--green-d); }
.pw-depois { background: transparent; border: none; color: var(--ink-3); font-size: 13px; cursor: pointer; padding: 6px; }
.pw-depois:hover { color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .pw-ov, .pw-card { transition: none; } }

/* Botão "Precificar este edital" no painel (Fase 3) */
.btn-precificar { border: 1px solid var(--green); background: var(--ok-bg); color: var(--green-d); font-weight: 700;
  font-size: 13px; padding: 8px 14px; border-radius: 10px; cursor: pointer; transition: var(--t); font-family: inherit; }
.btn-precificar:hover { background: var(--green); color: #fff; }

/* Autosave do precificador (Fase 3) */
.prop-autosave { font-size: 12px; font-weight: 700; color: var(--ink-3); margin-left: 4px; transition: var(--t); }
.prop-autosave.st-salvo { color: var(--ok); }
.prop-autosave.st-erro { color: var(--danger); }

/* Seleção múltipla no Kanban (Fase 3) */
.kanban-card { position: relative; }
.kc-check { position: absolute; top: 8px; right: 8px; width: 17px; height: 17px; cursor: pointer; z-index: 2;
  opacity: 0; transition: var(--t); accent-color: var(--green); }
.kanban-card:hover .kc-check, .kc-check:checked { opacity: 1; }
.kanban-card.kc-sel { outline: 2px solid var(--green); outline-offset: 1px; }
.kanban-bulk { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 55;
  display: flex; align-items: center; gap: 12px; background: var(--teal); color: #fff;
  border-radius: 14px; padding: 10px 16px; box-shadow: var(--shadow); font-size: 13.5px; font-weight: 600; }
.kanban-bulk.hidden { display: none; }
.kb-n { font-weight: 800; }
.kanban-bulk select { border: 0; border-radius: 8px; padding: 5px 8px; font-family: inherit; font-size: 13px; color: var(--ink); }
.kb-mv { display: flex; align-items: center; gap: 6px; }
.kb-rm, .kb-x { border: 1px solid rgba(255,255,255,.4); background: transparent; color: #fff; border-radius: 8px;
  padding: 5px 11px; cursor: pointer; font-weight: 700; font-size: 12.5px; }
.kb-rm:hover, .kb-x:hover { background: rgba(255,255,255,.15); }

@media (max-width: 820px) {
  .bar-fases, .bar-dois, .bar-cmd { top: 56px; }
  .bar-cmd { flex-wrap: wrap; gap: 8px; }
  .cmd-quick { display: none; }
  body[data-nav="fases"] .nav-burger, body[data-nav="dois"] .nav-burger, body[data-nav="comando"] .nav-burger { display: none; }
}

/* ===================== Densidade "compacta" (leve e segura) ===================== */
body.compacto .hero { padding: 30px 20px 22px; }
body.compacto .hero.compact { padding: 22px 20px 16px; }
body.compacto .resultados { padding-top: 16px; }
body.compacto .card { padding: 13px 16px; }
body.compacto .kpi, body.compacto .cardx { padding: 13px 15px; }

/* ============================================================
   TEMA - Modo Claro (padrão) e Modo Escuro (por usuário)
   ============================================================ */
html[data-theme="dark"] {
  --bg: #0b1110; --bg-2: #0e1614;
  --surface: #18211d;        /* cartões / painéis */
  --surface-2: #0f1614;      /* fundo da página */
  --surface-3: #212b27;      /* hover / zebra */
  --ink: #e7efea; --ink-2: #aebbb4; --ink-3: #7f8d86;
  --line: #2b3631; --line-2: #222c27;
  --green-d: #3ad695;        /* links / realce legíveis no escuro */
  --green-l: #16301f;        /* fundo verde-claro -> verde escuro */
  --chip: #3a2c16; --chip-ink: #fbbf6b;
  --ok: #3ad695;      --ok-bg: #16301f;
  --warn: #fcd34d;    --warn-bg: #3a2f16;
  --danger: #fca5a5;  --danger-bg: #3a1d1d;
  --info: #67d3e8;    --info-bg: #10333a;
  --shadow: 0 10px 30px rgba(0,0,0,.45);
  --shadow-sm: 0 2px 8px rgba(0,0,0,.35);
  --shadow-lift: 0 14px 34px rgba(0,0,0,.55);
  color-scheme: dark;
}
/* rede de segurança p/ cores fixas remanescentes no escuro */
html[data-theme="dark"] body { background: var(--surface-2); }
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select { background: var(--surface); color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: var(--ink-3); }
html[data-theme="dark"] ::-webkit-scrollbar { width: 12px; height: 12px; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #2c3833; border-radius: 8px; border: 3px solid var(--surface-2); }
html[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--surface-2); }
/* banners de status em versão escura (mantêm a cor do texto) */
html[data-theme="dark"] .doc-alertas.grave { background: #3a1d1d; border-color: #5b2b2b; color: #fca5a5; }
html[data-theme="dark"] .doc-alertas.aviso { background: #3a2f16; border-color: #5b4a1f; color: #fcd34d; }
html[data-theme="dark"] .prop-callout.ruim { background: #3a2f16; border-color: #5b4a1f; color: #fcd34d; }
html[data-theme="dark"] .doc-badge.vencido,
html[data-theme="dark"] .pv-st.s-encerrado, html[data-theme="dark"] .pv-st.s-rescindido { background: #3a1d1d; color: #fca5a5; }
html[data-theme="dark"] .doc-badge.vencendo { background: #3a2f16; color: #fcd34d; }
html[data-theme="dark"] .pi-chip.acima { background: #3a2f16; color: #fcd34d; border-color: #5b4a1f; }
html[data-theme="dark"] mark { background: #5b4a1f; color: #fde68a; }

/* ---- Botão de troca de tema (topbar) ---- */
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%; cursor: pointer;
  background: var(--surface-2); border: 1px solid var(--line);
  color: var(--ink-2); font-size: 17px; transition: var(--t); flex-shrink: 0;
}
.theme-toggle:hover { background: var(--line-2); color: var(--ink); }

/* ---- Escolha de tema no 1º acesso ---- */
.tema-overlay { position: fixed; inset: 0; background: rgba(6,16,12,.66); backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center; z-index: 200; padding: 18px; }
.tema-overlay.hidden { display: none; }
.tema-modal { background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 20px;
  padding: 30px 30px 26px; max-width: 480px; width: 100%; text-align: center; box-shadow: var(--shadow-lift); }
.tema-modal h2 { margin: 0 0 4px; font-size: 22px; }
.tema-modal p { margin: 0 0 20px; color: var(--ink-2); font-size: 15px; }
.tema-opts { display: flex; gap: 14px; }
.tema-opt { flex: 1; border: 2px solid var(--line); border-radius: 16px; padding: 20px 14px; cursor: pointer;
  background: var(--surface-2); transition: var(--t); }
.tema-opt:hover { border-color: var(--green); transform: translateY(-2px); }
.tema-opt .tema-ic { font-size: 34px; display: block; margin-bottom: 8px; }
.tema-opt .tema-nm { font-weight: 800; font-size: 16px; color: var(--ink); }
.tema-opt .tema-ds { font-size: 12.5px; color: var(--ink-3); margin-top: 3px; }
.tema-prev-claro { background: linear-gradient(135deg,#eef3f0 60%,#0d4d44 60%); }
.tema-prev-escuro { background: linear-gradient(135deg,#18211d 60%,#0d4d44 60%); }
.tema-prev { height: 40px; border-radius: 8px; margin-bottom: 10px; border: 1px solid var(--line); }
.tema-rodape { margin-top: 16px; font-size: 12.5px; color: var(--ink-3); }

/* ===================== Busca: faixa do topo (redesign híbrido + pré-definidos) ===================== */
.busca-topo { max-width: 1180px; margin: 14px auto 0; padding: 0 20px; display: flex; flex-direction: column; gap: 10px; }
.bt-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.bt-lbl { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; color: var(--ink-3); white-space: nowrap; }
.bt-chips { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 1; min-width: 0; }
.bt-link { background: none; border: 1px dashed var(--green); color: var(--green-d); border-radius: 999px; padding: 5px 13px; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.bt-link:hover { background: var(--green-l); }

/* pré-definidos (atalhos de 1 clique) */
.pd-chip { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); border-radius: 999px; padding: 6px 13px; font-size: 13px; font-weight: 600; cursor: pointer; transition: var(--t); white-space: nowrap; flex-shrink: 0; }
.pd-chip:hover { border-color: var(--accent); color: var(--green-d); }
.pd-chip.on { background: var(--green); border-color: var(--green); color: #fff; }

/* perfis (buscas salvas) como chips */
.perfil-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--surface); border: 1.5px solid var(--line); border-radius: 999px; padding: 3px 5px 3px 10px; box-shadow: var(--shadow-sm); flex-shrink: 0; max-width: 100%; }
.perfil-chip.tem-alerta { border-color: #8fd6ad; }
.perfil-chip .perfil-aplicar { display: inline-flex; align-items: center; gap: 6px; border: 0; background: none; color: var(--ink); font-weight: 700; font-size: 13px; cursor: pointer; padding: 2px 0; min-width: 0; }
.perfil-chip .perfil-aplicar .pc-ic { flex-shrink: 0; font-size: 13px; line-height: 1; }
.perfil-chip .perfil-aplicar .pc-nome { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px; }
.perfil-chip .perfil-aplicar:hover .pc-nome { color: var(--green-d); text-decoration: underline; }
.perfil-chip .perfil-alerta-sel { flex-shrink: 0; border: 1px solid var(--line); background: var(--surface-2); border-radius: 999px; font-size: 11.5px; padding: 3px 4px; color: var(--ink-2); cursor: pointer; max-width: 130px; }
.perfil-chip .perfil-excluir { flex-shrink: 0; border: 0; background: none; color: var(--ink-3); cursor: pointer; font-size: 12px; padding: 3px 6px; border-radius: 50%; line-height: 1; }
.perfil-chip .perfil-excluir:hover { color: var(--danger); }
.perfis-vazio { font-size: 13px; color: var(--ink-3); font-style: italic; }

/* mini-formulário salvar busca */
.perfil-salvar-box { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; }
.perfil-salvar-box.hidden { display: none; }
.perfil-salvar-box input { flex: 1; min-width: 160px; border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-size: 14px; background: var(--surface); color: var(--ink); }
.perfil-salvar-box select { border: 1px solid var(--line); border-radius: 9px; padding: 8px; font-size: 13px; background: var(--surface); color: var(--ink); }
.btn-perfil-salvar { border: 0; background: var(--green); color: #fff; border-radius: 9px; padding: 8px 14px; font-weight: 700; cursor: pointer; }
.btn-perfil-salvar:hover { background: var(--green-d); }
.perfil-testar { color: var(--green-d); font-weight: 600; cursor: pointer; font-size: 13px; }
.perfil-smtp-hint { font-size: 11.5px; color: var(--ink-3); }

/* filtros ATIVOS (chips removíveis) */
.bt-ativos { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 9px 12px; min-height: 46px; }
.bt-ativos-lbl { font-size: 13px; color: var(--ink-3); font-weight: 600; }
#aplicados { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 1; }
.chip-ativo { display: inline-flex; align-items: center; gap: 6px; background: var(--green-l); border: 1px solid #8fd6ad; color: var(--green-d); border-radius: 999px; padding: 3px 6px 3px 11px; font-size: 13px; font-weight: 600; }
.chip-ativo.neg { background: var(--chip); border-color: var(--chip-ink); color: var(--chip-ink); }
.chip-ativo .ca-cat { color: var(--ink-3); font-weight: 600; }
.chip-ativo .ca-x { border: 0; background: rgba(15,122,56,.14); color: var(--green-d); width: 18px; height: 18px; border-radius: 50%; cursor: pointer; font-size: 11px; line-height: 1; display: flex; align-items: center; justify-content: center; }
.chip-ativo .ca-x:hover { background: var(--green); color: #fff; }
.chip-ativo.neg .ca-x { background: rgba(180,83,9,.18); color: var(--chip-ink); }
.ca-limpar { margin-left: auto; border: 0; background: none; color: var(--ink-3); font-size: 13px; cursor: pointer; text-decoration: underline; white-space: nowrap; }
.ca-limpar:hover { color: var(--danger); }
.aplicados-vazio { color: var(--ink-3); font-size: 13px; font-style: italic; }

/* "ver mais" das pills + esconder extras */
.pill.hid, .uf.hid { display: none; }
.vermais { display: inline-block; font-size: 12.5px; color: var(--green-d); cursor: pointer; font-weight: 600; margin-top: 4px; }
.vermais:hover { text-decoration: underline; }

@media (max-width: 820px) {
  .busca-topo { padding: 0 14px; }
  .perfil-chip .perfil-aplicar { max-width: 150px; }
}

/* ===================== Minhas Buscas - Direção A (botão + painel gerenciador) ===================== */
.mb-row { position: relative; }
.mb-btn { display: inline-flex; align-items: center; gap: 7px; background: var(--surface); border: 1.5px solid var(--line); border-radius: 999px; padding: 7px 14px; font-weight: 800; font-size: 13.5px; color: var(--ink); cursor: pointer; box-shadow: var(--shadow-sm); }
.mb-btn:hover { border-color: var(--accent); }
.mb-btn.on { border-color: var(--green); background: var(--green-l); color: var(--green-d); }
.mb-btn .st { color: #eab308; }
.mb-caret { color: var(--ink-3); font-size: 11px; }
.mb-count { background: var(--green); color: #fff; border-radius: 999px; font-size: 11px; font-weight: 800; padding: 1px 8px; }
.mb-count.hidden { display: none; }
.mb-aplicada { font-size: 12.5px; color: var(--ink-3); }
.mb-aplicada b { color: var(--ink); }

.mb-panel { position: absolute; top: 100%; left: 0; margin-top: 8px; z-index: 50; width: 440px; max-width: 94vw; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-lift); overflow: hidden; }
.mb-panel.hidden { display: none; }
.mb-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 15px; border-bottom: 1px solid var(--line); font-weight: 800; }
.mb-nova { background: none; border: 1px dashed var(--green); color: var(--green-d); border-radius: 999px; padding: 5px 12px; font-weight: 700; font-size: 12.5px; cursor: pointer; }
.mb-nova:hover { background: var(--green-l); }
.mb-lista { max-height: 342px; overflow-y: auto; }
.mb-item { display: flex; align-items: center; gap: 10px; padding: 11px 15px; border-bottom: 1px solid var(--line-2); }
.mb-item:last-child { border-bottom: 0; }
.mb-item:hover { background: var(--surface-2); }
.mb-aplicar { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; background: none; border: 0; cursor: pointer; text-align: left; padding: 2px 0; }
.mb-nm { font-weight: 800; color: var(--ink); font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.mb-aplicar:hover .mb-nm { color: var(--green-d); }
.mb-rs { font-size: 12px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.mb-acoes { display: flex; align-items: center; gap: 5px; flex-shrink: 0; }
.mb-acoes .perfil-alerta-sel { border: 1px solid var(--line); background: var(--surface-2); border-radius: 7px; font-size: 11.5px; padding: 4px 5px; color: var(--ink-2); cursor: pointer; max-width: 118px; }
.mb-mini { width: 30px; height: 30px; border: 1px solid var(--line); background: var(--surface); border-radius: 8px; cursor: pointer; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; }
.mb-mini:hover { border-color: var(--accent); }
.mb-mini.perfil-excluir:hover { border-color: #f3c2c2; background: var(--danger-bg); }
.mb-salvar { padding: 13px 15px; border-top: 1px solid var(--line); background: var(--surface-2); display: flex; flex-direction: column; gap: 6px; }
.mb-salvar.hidden { display: none; }
.mb-f-lbl { font-size: 12px; font-weight: 700; color: var(--ink-2); margin-top: 2px; }
.mb-salvar input, .mb-salvar select { border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-size: 13.5px; background: var(--surface); color: var(--ink); }
.mb-salvar-acoes { display: flex; align-items: center; gap: 14px; margin-top: 4px; }
.mb-vazio { padding: 24px 16px; text-align: center; color: var(--ink-2); font-size: 13.5px; line-height: 1.7; }
.mb-vazio span { color: var(--ink-3); font-size: 12.5px; }
@media (max-width: 560px) { .mb-panel { width: 92vw; } }

/* Toolbar compacta do topo: Minhas buscas + Pré-definidos viram botões/dropdowns */
.bt-toolbar { gap: 9px; }
.bt-drop { position: relative; }
.st-amber { color: #f59e0b !important; }
.pd-head-hint { font-size: 12px; font-weight: 600; color: var(--ink-3); }
.pd-panel { width: 460px; }
.pd-panel.hidden { display: none; }
.pd-chips-panel { padding: 14px; gap: 9px; align-items: flex-start; }
.pd-chips-panel .pd-chip { flex: 0 0 auto; }
@media (max-width: 560px) { .pd-panel { width: 92vw; } }
/* "Busca padrão" fixada no topo da lista */
.mb-item.is-padrao { background: var(--green-l); }
.mb-padrao-tag { font-size: 10px; font-weight: 800; color: var(--green-d); background: var(--surface); border: 1px solid var(--green); border-radius: 999px; padding: 1px 7px; margin-left: 6px; vertical-align: middle; white-space: nowrap; }
.mb-mini.mb-pin.on { border-color: var(--green); background: var(--green-l); color: var(--green-d); }
/* No celular os dropdowns ocupam a largura da toolbar (evita vazar pela direita) */
@media (max-width: 560px) {
  .bt-toolbar { position: relative; }
  .bt-drop { position: static; }
  .mb-panel, .pd-panel { left: 0; width: 92vw; max-width: 92vw; }
}

/* ===== Perfil de Atuação (Fase 1): modo Dirigido/Livre, banner, explicabilidade, editor ===== */
.modo-row { gap: 12px; }
.modo-seg { display: inline-flex; border: 1.5px solid var(--green); border-radius: 999px; overflow: hidden; flex-shrink: 0; }
.modo-seg button { border: 0; background: var(--surface); color: var(--green-d); font-weight: 800; font-size: 13px; padding: 7px 15px; cursor: pointer; transition: var(--t); }
.modo-seg button.on { background: var(--green); color: #fff; }
.modo-banner { font-size: 13px; color: var(--ink-2); display: inline-flex; align-items: center; gap: 6px; background: var(--green-l); border: 1px solid var(--green); border-radius: 10px; padding: 5px 12px; }
.modo-banner b { color: var(--green-d); }
.modo-ajustar { color: var(--green-d); font-weight: 700; cursor: pointer; text-decoration: underline; white-space: nowrap; }
/* explicabilidade no card ("🎯 casou: …") */
.card-match { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 2px 0 8px; font-size: 12px; }
.cm-chip { background: var(--green-l); color: var(--green-d); border: 1px solid var(--green); border-radius: 999px; padding: 1px 9px; font-weight: 700; font-size: 11.5px; }
/* editor em Configurações */
.pa-block { margin: 12px 0; }
.pa-lbl { display: block; font-size: 13px; font-weight: 700; color: var(--ink); margin-bottom: 6px; }
.pa-lbl .dim, .dim { font-weight: 500; color: var(--ink-3); }
.pa-segs { display: flex; flex-wrap: wrap; gap: 8px; }
.pa-seg { border: 1.5px solid var(--line); background: var(--surface); color: var(--ink-2); border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 700; cursor: pointer; transition: var(--t); }
.pa-seg:hover:not(:disabled) { border-color: var(--green); }
.pa-seg.on { background: var(--green); border-color: var(--green); color: #fff; }
.pa-seg:disabled { opacity: .6; cursor: not-allowed; }
.pa-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 720px) { .pa-grid { grid-template-columns: 1fr; } }
.pa-input { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; font-size: 13.5px; background: var(--surface); color: var(--ink); font-family: inherit; resize: vertical; }
.pa-actions { display: flex; align-items: center; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
/* Fase 2: CNPJ, recorte pessoal, onboarding */
.pa-cnpj-row, .pa-ia-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pa-cnpj-row .pa-input { max-width: 260px; }
.pa-ia-row .pa-input { max-width: 520px; flex: 1; min-width: 220px; }
/* classificação CATMAT/CATSER nos itens do edital (Fase 3): selo no canto sup. direito */
.it-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.it-top .it-desc { flex: 1; min-width: 0; }
.it-catalogo { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; flex-shrink: 0; justify-content: flex-end; max-width: 46%; }
.it-cat-tag { font-size: 10.5px; font-weight: 700; color: var(--ink-2); background: var(--surface-3); border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px; }
.it-cat-tag.cod { color: var(--green-d); border-color: var(--green); font-family: Consolas, monospace; }
.pa-sub { font-size: 14px; font-weight: 800; color: var(--ink); margin: 18px 0 8px; padding-top: 14px; border-top: 1px dashed var(--line); }
.pa-pessoal { margin-top: 4px; }
.onboard-perfil { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; max-width: 1180px; margin: 14px auto 0; padding: 12px 16px; background: var(--green-l); border: 1px solid var(--green); border-radius: 12px; }
.onboard-perfil.hidden { display: none; }
.ob-txt { font-size: 13.5px; color: var(--ink); }
.ob-acoes { display: flex; align-items: center; gap: 8px; }
.ob-btn { background: var(--green); color: #fff; border: 0; border-radius: 9px; padding: 8px 14px; font-weight: 800; font-size: 13px; cursor: pointer; }
.ob-x { background: transparent; border: 0; color: var(--ink-3); font-size: 15px; cursor: pointer; padding: 4px 8px; }
/* destaque ao chegar via "ajustar"/"Configurar": chama atenção p/ a seção certa */
.cfg-destaque { animation: cfgDestaque 2.2s ease; border-radius: 14px; }
@keyframes cfgDestaque {
  0% { box-shadow: 0 0 0 0 rgba(22,163,74,0); }
  18% { box-shadow: 0 0 0 4px rgba(22,163,74,.55); }
  100% { box-shadow: 0 0 0 0 rgba(22,163,74,0); }
}

/* ===================== Chat do Pregoeiro (caixa unificada, Fase A) ===================== */
.disp-chat { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface);
  margin: 14px 0; box-shadow: var(--shadow-sm); overflow: hidden; }
.chat-head { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, #f6faf8, #fff); }
.chat-head-l { font-size: 14px; color: var(--ink); }
.chat-mon { font-size: 12px; color: var(--ink-3); margin-left: 6px; }
.chat-head .btn-score { width: auto; padding: 6px 12px; }

/* banner de convocação (vermelho) com contagem regressiva */
.chat-banner { display: flex; align-items: center; gap: 12px; margin: 12px 14px 0; padding: 11px 14px;
  background: #fff1f0; border: 1px solid #ffccc7; border-left: 4px solid #e5484d; border-radius: 10px; }
.chat-banner.urgente { animation: cbPulse 1s ease-in-out infinite; }
.chat-banner.vencido { background: #f4f4f5; border-color: var(--line); border-left-color: #9ca3af; }
@keyframes cbPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(229,72,77,0); } 50% { box-shadow: 0 0 0 4px rgba(229,72,77,.18); } }
.cb-ic { font-size: 20px; }
.cb-txt { display: flex; flex-direction: column; }
.cb-txt b { color: #c11717; font-size: 14px; }
.cb-sub { color: var(--ink-3); font-size: 11.5px; }
.cb-rel { margin-left: auto; text-align: right; }
.cb-cron { display: block; font-size: 22px; font-weight: 800; color: #c11717; font-variant-numeric: tabular-nums; }
.cb-rel-l { font-size: 11px; color: var(--ink-3); }

.chat-timeline { max-height: 360px; overflow-y: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.chat-vazio { text-align: center; color: var(--ink-2); padding: 22px 10px; }
.chat-msg { display: flex; }
.chat-msg.nos { justify-content: flex-end; }
.chat-bolha { max-width: 78%; padding: 9px 12px; border-radius: 12px; font-size: 13px; line-height: 1.45; }
.chat-msg.eles .chat-bolha { background: #f3f5f4; border: 1px solid var(--line); border-top-left-radius: 4px; }
.chat-msg.nos .chat-bolha { background: #e7f0ff; border: 1px solid #cdddff; border-top-right-radius: 4px; color: #0b2e6b; }
.chat-rem { font-size: 11.5px; font-weight: 700; color: var(--ink-2); margin-bottom: 3px; }
.chat-corpo { color: var(--ink); }
.chat-meta { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.chat-tag { font-size: 10.5px; font-weight: 700; padding: 2px 7px; border-radius: 999px; border: 1px solid transparent; }
.chat-tag.c-conv { background: #fff1f0; color: #c11717; border-color: #ffccc7; }
.chat-tag.c-doc { background: var(--warn-bg); color: var(--warn); border-color: #ffe1a8; }
.chat-tag.c-neg { background: #f5f0ff; color: #6b46c1; border-color: #e3d7ff; }
.chat-tag.c-dil { background: #eef6ff; color: #1d4ed8; border-color: #cfe2ff; }
.chat-tag.c-inf { background: #f3f4f6; color: #4b5563; border-color: #e5e7eb; }
.chat-tag.c-prazo { background: var(--warn-bg); color: var(--warn); border-color: #ffe1a8; }
.chat-tag.c-cnpj { background: var(--green-l); color: var(--green-d); border-color: #bbf7d0; }
.chat-tag.c-part { background: #f5f0ff; color: #6b46c1; border-color: #e3d7ff; }
.chat-tag.c-voce { background: #fff1f0; color: #c11717; border-color: #ffccc7; font-weight: 800; }
/* remetente do chat: pregoeiro (autoridade) x participante/concorrente x sistema */
.chat-msg.eles.preg .chat-bolha { border-left: 3px solid var(--teal); }
.chat-msg.eles.part .chat-bolha { background: #faf7ff; border-color: #e7dcff; border-left: 3px solid #a78bfa; }
.chat-msg.eles.part .chat-rem { color: #6b46c1; }
.chat-msg.eles.sis .chat-bolha { background: var(--surface); border-style: dashed; }
.chat-msg.eles.sis .chat-rem { color: var(--ink-2); }
.chat-selo { font-size: 11px; font-weight: 700; }
.chat-selo.ok { color: var(--green-d); }
.chat-selo.pend { color: var(--warn); }
.chat-sug { margin-top: 8px; background: #f0fbf5; border: 1px dashed #9fe3bf; border-radius: 10px; padding: 8px 10px; }
.chat-sug-h { font-size: 11.5px; font-weight: 800; color: var(--green-d); margin-bottom: 3px; }
.chat-sug-t { font-size: 12.5px; color: var(--ink); font-style: italic; }
.chat-sug-b { margin-top: 6px; }

.chat-resp { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--line); background: #fafcfb; }
.chat-resp textarea { flex: 1; min-height: 44px; max-height: 120px; resize: vertical; border: 1px solid var(--line);
  border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 13px; color: var(--ink); }
.chat-resp .btn-score { width: auto; align-self: flex-end; white-space: nowrap; }
.chat-aud { padding: 0 14px 11px; font-size: 11px; }

/* ===================== Modal "Monitorar nova disputa" ===================== */
#disp-mon-modal { width: 520px; }
.mm-sub { color: var(--ink-2); font-size: 13px; margin: -6px 0 14px; }
.mm-lbl { display: block; font-size: 12px; font-weight: 800; color: var(--ink-2); margin: 12px 0 5px; text-transform: uppercase; letter-spacing: .02em; }
.mm-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mm-buscar { width: 100%; margin-top: 8px; }
.mm-resolvido { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: #f3f4f6; border: 1px solid var(--line); font-size: 12.5px; display: flex; flex-direction: column; gap: 2px; }
.mm-resolvido.ok { background: #f0fbf5; border-color: #bbf7d0; }
.mm-resolvido b { color: var(--green-d); }
.mm-resolvido span { color: var(--ink-2); }
.mm-canais { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mm-canal { display: flex; align-items: center; gap: 7px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 10px; font-size: 13px; color: var(--ink); cursor: pointer; }
.mm-canal input { accent-color: var(--green); }
.mm-aviso { margin: 14px 0 4px; padding: 10px 12px; background: #eef6ff; border: 1px solid #cfe2ff; border-radius: 10px; font-size: 12px; color: #1d4ed8; }
.mm-acoes { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.mm-acoes .btn-score { width: auto; padding: 9px 16px; }
.btn-ghost { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); border-radius: 10px;
  padding: 9px 16px; font-weight: 700; font-size: 13px; cursor: pointer; }
.btn-ghost:hover { background: #f3f4f6; }

/* mobile: timeline mais alta e bolhas mais largas */
@media (max-width: 720px) {
  .chat-bolha { max-width: 88%; }
  .chat-timeline { max-height: 60vh; }
  #disp-mon-modal { width: 96vw; }
  .mm-row2, .mm-canais { grid-template-columns: 1fr; }
}

/* ===================== Monitorar - sub-abas (Editais / Agenda) ===================== */
.mon-tabs { display: flex; gap: 6px; border-bottom: 2px solid var(--line); margin-bottom: 16px; flex-wrap: wrap; }
.mon-tab { padding: 9px 16px; font-weight: 700; color: var(--ink-2); cursor: pointer; border: 0; background: none;
  border-radius: 9px 9px 0 0; position: relative; top: 2px; font-size: 14px; }
.mon-tab:hover { color: var(--ink); }
.mon-tab.active { color: var(--green-d); background: var(--surface); border: 2px solid var(--line); border-bottom: 2px solid var(--surface); }
.mon-tab-sub { font-weight: 600; font-size: 12px; }
.mon-pane[hidden] { display: none; }
.mon-toolbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
/* placeholder da aba Pregoeiro (próxima etapa) */
.mon-soon { text-align: center; max-width: 580px; margin: 28px auto; padding: 30px 26px; background: var(--surface);
  border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-sm); }
.mon-soon-ic { font-size: 44px; }
.mon-soon h2 { margin: 8px 0 6px; color: var(--ink); }
.mon-soon p { color: var(--ink-2); margin: 6px 0; }
/* Agenda dentro do Monitorar: linhas por urgência (espelha o protótipo) */
.mon-agenda { display: flex; flex-direction: column; gap: 9px; }
.monag-row { display: flex; gap: 14px; align-items: center; background: var(--surface); border: 1px solid var(--line);
  border-left: 4px solid var(--green); border-radius: 12px; padding: 12px 16px; box-shadow: var(--shadow-sm); }
.monag-row.warn { border-left-color: var(--warn); }
.monag-row.urg { border-left-color: #e5484d; }
.monag-row.feita { opacity: .6; }
.monag-d { font-weight: 800; min-width: 76px; text-align: center; color: var(--ink-2); font-size: 13px; }
.monag-row.urg .monag-d { color: #c11717; }
.monag-c { flex: 1; min-width: 0; }
.monag-c b { color: var(--ink); }
.monag-open { margin-left: auto; border: 1px solid var(--green); background: var(--surface); color: var(--green-d);
  border-radius: 9px; padding: 6px 14px; font-weight: 700; cursor: pointer; text-decoration: none; font-size: 13px; white-space: nowrap; }
.monag-open:hover { background: var(--green-l); }
@media (max-width: 600px) { .monag-d { min-width: 56px; font-size: 12px; } .monag-open { padding: 5px 10px; } }

/* ===================== Aba Pregoeiro & Julgamento (acompanhamentos) ===================== */
.acomp-md { display: grid; grid-template-columns: 300px 1fr; gap: 14px; align-items: start; }
.acomp-listcard { overflow: hidden; }
.acomp-filtros { display: flex; gap: 6px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.acomp-f { font-size: 12px; padding: 4px 11px; border-radius: 999px; border: 1px solid var(--line); color: var(--ink-2); background: var(--surface); cursor: pointer; }
.acomp-f.active { background: var(--green-l); color: var(--green-d); border-color: #bbf7d0; font-weight: 700; }
.acomp-lista { max-height: 620px; overflow-y: auto; }
.acomp-item { padding: 12px 14px; border-bottom: 1px solid var(--line); cursor: pointer; border-left: 3px solid transparent; }
.acomp-item:hover { background: #f8faf9; }
.acomp-item.sel { background: #f0fbf5; border-left-color: var(--green); }
.acomp-item.conv { border-left-color: #e5484d; }
.acomp-item b { font-size: 13.5px; color: var(--ink); }
.acomp-org { font-size: 12px; margin: 2px 0; }
.acomp-tags { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 5px; }
.acomp-tag { font-size: 10.5px; font-weight: 800; border-radius: 999px; padding: 1px 8px; }
.acomp-tag.conv { background: #fff1f0; color: #c11717; }
.acomp-tag.fase { background: #ede9fe; color: #6d28d9; }
.acomp-tag.portal { background: #f3f4f6; color: #6b7280; }
.acomp-tag.unread { background: #e5484d; color: #fff; }
/* detalhe */
.acomp-dhd { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.acomp-dhd b { font-size: 15px; }
.acomp-mon { font-size: 12px; color: var(--ink-3); }
.acomp-dhd .btn-score { width: auto; padding: 6px 12px; margin-left: auto; }
.acomp-dhd .btn-ghost { padding: 6px 12px; }
/* régua do julgamento (stepper) */
.acomp-stepper { display: flex; align-items: center; padding: 16px; overflow-x: auto; }
.acomp-step { display: flex; flex-direction: column; align-items: center; min-width: 96px; position: relative; cursor: pointer; }
.acomp-dot { width: 28px; height: 28px; border-radius: 50%; background: #e6ece9; color: var(--ink-3); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 12px; z-index: 2; }
.acomp-snm { font-size: 11px; font-weight: 700; margin-top: 5px; color: var(--ink-3); text-align: center; }
.acomp-step.done .acomp-dot { background: var(--green); color: #fff; } .acomp-step.done .acomp-snm { color: var(--green-d); }
.acomp-step.cur .acomp-dot { background: #7c3aed; color: #fff; box-shadow: 0 0 0 4px #ede9fe; } .acomp-step.cur .acomp-snm { color: #6d28d9; }
.acomp-step:not(:first-child)::before { content: ""; position: absolute; height: 3px; background: #e6ece9; top: 12px; left: -48px; width: 48px; }
.acomp-step.done::before, .acomp-step.cur::before { background: var(--green); }
.acomp-step:hover .acomp-dot { outline: 2px solid var(--accent); outline-offset: 2px; }
/* capturador + painéis */
.acomp-feed { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 16px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--ink-2); background: #fafcfb; }
.acomp-paineis { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 14px 16px; }
.acomp-paineis .pnl { border: 1px solid var(--line); border-radius: 12px; }
.acomp-pnl-hd { padding: 10px 13px; border-bottom: 1px solid var(--line); font-weight: 800; font-size: 13px; }
.acomp-pnl-bd { padding: 11px 13px; font-size: 12.5px; }
.acomp-conv { border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; margin-bottom: 8px; }
.acomp-conv-top { display: flex; align-items: center; gap: 8px; } .acomp-conv-top b { font-size: 12.5px; }
.acomp-pz { margin-left: auto; font-weight: 800; color: var(--warn); font-size: 11.5px; }
.acomp-conv-acts, .acomp-rec-acts { margin-top: 7px; }
.acomp-rec { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.acomp-leg { font-size: 11.5px; color: var(--ink-3); background: #f3f6f4; border: 1px dashed var(--line); border-radius: 9px; padding: 8px 10px; margin-top: 7px; }
#acomp-modal { width: 520px; }
@media (max-width: 860px) { .acomp-md, .acomp-paineis { grid-template-columns: 1fr; } }

/* ===================== Radar de Convocação (painel Minha participação) ===================== */
.acomp-tag.pausado { background: var(--surface-2); color: var(--ink-3); border: 1px dashed var(--line); }
.acomp-tag.radar { background: var(--info-bg); color: var(--info); }
.acomp-tag.radar.atencao { background: var(--warn-bg); color: var(--warn); }
.acomp-tag.radar.iminente { background: #ffedd5; color: #c2410c; }
.acomp-nudge { margin: 10px 16px 0; padding: 9px 12px; border-radius: 10px; font-size: 13px; line-height: 1.45;
  background: var(--warn-bg); color: var(--warn); border: 1px solid var(--warn); }
.radar-card { margin: 12px 16px 0; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; background: var(--surface); }
.radar-card.vazio { border-style: dashed; color: var(--ink-2); font-size: 13px; }
.radar-hd { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 14px; }
.radar-niv { font-size: 11px; font-weight: 800; border-radius: 999px; padding: 2px 10px; }
.radar-niv.tranquilo { background: var(--ok-bg); color: var(--ok); }
.radar-niv.atencao { background: var(--warn-bg); color: var(--warn); }
.radar-niv.iminente { background: #ffedd5; color: #c2410c; animation: cbPulse 1s ease-in-out infinite; }
.radar-leitura { font-size: 11.5px; font-weight: 700; margin-left: auto; }
.radar-leitura.ok { color: var(--ok); }
.radar-leitura.velha { color: var(--warn); }
.radar-pos { font-size: 13px; color: var(--ink-2); margin-top: 7px; }
.radar-aviso { margin-top: 8px; font-size: 12.5px; background: var(--warn-bg); color: var(--warn); border-radius: 9px; padding: 8px 10px; }
.radar-barra { display: flex; height: 10px; border-radius: 999px; overflow: hidden; margin: 9px 0 7px; background: var(--surface-2); border: 1px solid var(--line); }
.radar-barra i { height: 100%; }
.radar-barra .b-ativos { background: #94a3b8; }
.radar-barra .b-desc { background: var(--danger); opacity: .75; }
.radar-barra .b-voce { background: var(--green); min-width: 6px; }
.radar-barra .b-resto { background: var(--line-2); }
.radar-rodape { display: flex; align-items: center; gap: 10px; justify-content: space-between; flex-wrap: wrap; font-size: 11.5px; }
.radar-rodape .btn-mini { width: auto; }
.radar-lista { margin-top: 9px; border-top: 1px solid var(--line); max-height: 300px; overflow-y: auto; }
.radar-linha { display: flex; align-items: center; gap: 9px; padding: 6px 2px; border-bottom: 1px dashed var(--line-2); font-size: 12.5px; }
.radar-linha:last-child { border-bottom: 0; }
.radar-linha.fora { opacity: .55; }
.radar-linha.fora .rl-nome { text-decoration: line-through; }
.radar-linha.voce { background: var(--ok-bg); border-radius: 8px; padding-left: 8px; padding-right: 8px; }
.rl-pos { min-width: 34px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ink-2); }
.rl-nome { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.rl-uf { min-width: 26px; color: var(--ink-3); font-weight: 700; }
.rl-val { min-width: 110px; text-align: right; font-variant-numeric: tabular-nums; color: var(--ink-2); }
.rl-st { font-size: 10px; font-weight: 800; border-radius: 999px; padding: 1px 8px; text-transform: uppercase; }
.rl-st.ativo { background: var(--ok-bg); color: var(--ok); }
.rl-st.fora { background: var(--danger-bg); color: var(--danger); }
/* alarme âmbar do radar iminente (o vermelho fica reservado à convocação/queda) */
.alarme.iminente { background: rgba(140, 78, 8, .55); }
.alarme.iminente .alarme-card { border-color: #c2410c; }
.alarme.iminente .alarme-tit { color: #c2410c; }
.alarme.iminente .alarme-btn { background: #c2410c; }
@keyframes alarmePiscaIm { 0% { background: rgba(160, 90, 10, .62); } 50% { background: rgba(90, 50, 5, .40); } }
.alarme.iminente { animation-name: alarmePiscaIm; }

/* ===================== Bom Pagador - badge no painel do edital (Onda 4) ===================== */
.p-pagador { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 1px 8px; border-radius: 20px; white-space: nowrap; vertical-align: middle; }
.p-pagador:empty { display: none; }
.p-pagador.pg-bom { background: #e7f7ec; color: #0f7a38; }
.p-pagador.pg-atencao { background: #fff5e0; color: #92660a; }
.p-pagador.pg-lento { background: var(--danger-bg); color: var(--danger); }

/* CAPAG (Tesouro Nacional) - nota de saúde fiscal do ente, no card da busca e no painel */
.p-capag { margin-left: 2px; }
.t-capag.cp-a, .p-pagador.cp-a { background: #e7f7ec; color: #0f7a38; }
.t-capag.cp-b, .p-pagador.cp-b { background: #e3eefb; color: #1d5ea8; }
.t-capag.cp-c, .p-pagador.cp-c { background: #fff5e0; color: #92660a; }
.t-capag.cp-d, .p-pagador.cp-d { background: var(--danger-bg); color: var(--danger); }

/* ===================== Atas de RP - saldo por item (Onda 4, Fatia 2) ===================== */
.pv-saldo-mini { height: 5px; width: 96px; background: #e6efe9; border-radius: 4px; overflow: hidden; margin: 4px 0 2px auto; }
.pv-saldo-mini > span { display: block; height: 100%; background: var(--green); }
.pv-saldo-bar { height: 8px; background: #e6efe9; border-radius: 6px; overflow: hidden; margin: 6px 0; }
.pv-saldo-bar > span { display: block; height: 100%; background: linear-gradient(90deg, var(--green), var(--accent)); transition: width .2s; }
.pv-ata-item { border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; margin-bottom: 8px; }
.pv-ata-item.esgotado { opacity: .65; }
.pv-ata-item.esgotado .pv-saldo-bar > span { background: #c0392b; }
.pv-ata-i-top { display: flex; align-items: center; gap: 8px; font-size: 13.5px; }
.pv-ata-i-top b { flex: 1; min-width: 0; }
.pv-ata-i-nums { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; font-size: 12px; color: var(--ink-2); }
.pv-ata-i-nums .ok b { color: var(--green-d); }
.pv-ata-i-nums .grave b { color: var(--danger); }
.pv-i-edit { border: 1px solid var(--line); background: #fff; border-radius: 7px; padding: 2px 9px; font-size: 11.5px; cursor: pointer; color: var(--ink-2); margin-left: auto; }
.pv-i-edit:hover { border-color: var(--green); color: var(--green-d); }
.pv-add-ata { flex-wrap: wrap; }
.pv-add-ata .pv-in-un { max-width: 74px; }
.pv-st.s-encerrada, .pv-st.s-cancelada { background: var(--surface-2); color: var(--ink-3); }

/* ---- Pós-venda 2.0: importar atas, radar, chips, funil, entregas (stepper) ---- */
.pv-acbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pv-acbar-hint { font-size: 12px; color: var(--ink-3); flex: 1 1 220px; }
.btn-ghost { border: 1px solid var(--line); background: var(--surface); color: var(--ink); border-radius: 9px; padding: 8px 13px; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.btn-ghost:hover { border-color: var(--green); color: var(--green-d); }
.pv-venc.ok { color: var(--green-d); } .pv-venc.info { color: var(--info); }
.pv-fonte { font-size: 10.5px; font-weight: 800; color: var(--info); background: var(--surface-2); border-radius: 999px; padding: 1px 8px; }
.pv-carona { font-size: 10.5px; font-weight: 800; color: #92610a; background: #fef3c7; border-radius: 999px; padding: 1px 8px; }
.pv-link { font-size: 11.5px; font-weight: 700; color: var(--info); margin-left: 4px; }
.pv-radar-card { padding-bottom: 14px; }
.pv-radar { display: flex; gap: 10px; flex-wrap: wrap; }
.pv-radar-c { flex: 1 1 180px; min-width: 160px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; cursor: pointer; transition: .14s; }
.pv-radar-c:hover { border-color: var(--accent); }
.pv-radar-n { font-weight: 700; font-size: 12.5px; color: var(--ink); }
.pv-radar-o { font-size: 12px; color: var(--ink-3); margin: 2px 0 5px; }
.pv-radar-wide { flex: 1 1 300px; min-width: 260px; cursor: default; }
.pv-radar-acoes { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.pv-radar-acoes .btn-score { width: auto; padding: 6px 12px; font-size: 12.5px; }
.pv-chips { display: flex; gap: 8px; flex-wrap: wrap; margin: 4px 0 12px; }
.pv-chip { font-size: 12.5px; font-weight: 700; color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; cursor: pointer; }
.pv-chip:hover { border-color: var(--green); }
.pv-chip.on { background: var(--green); color: #fff; border-color: var(--green); }
.pv-funil-row { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.pv-funil-k { width: 92px; font-size: 12.5px; color: var(--ink-2); }
.pv-funil-bar { flex: 1; height: 12px; background: var(--surface-2); border-radius: 7px; overflow: hidden; }
.pv-funil-bar > span { display: block; height: 100%; border-radius: 7px; transition: width .25s; }
.pv-funil-v { min-width: 96px; text-align: right; font-weight: 800; font-size: 13px; color: var(--ink); }
.pv-alerta { display: flex; gap: 12px; align-items: flex-start; background: var(--danger-bg); border: 1px solid var(--danger); border-radius: 12px; padding: 12px 15px; margin-bottom: 14px; }
.pv-alerta-ic { font-size: 20px; }
.pv-ent-card { background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--info); border-radius: 12px; padding: 12px 15px; margin-bottom: 10px; box-shadow: var(--shadow-sm); }
.pv-ent-top { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.pv-step { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; font-size: 12px; margin: 10px 0 6px; }
.pv-step-i { color: var(--ink-3); font-weight: 600; }
.pv-step-i.on { color: var(--green-d); font-weight: 700; }
.pv-step-sep { color: var(--ink-3); }
.pv-siafi { font-size: 10px; color: var(--info); font-weight: 800; }
.pv-ent-acoes { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.pv-ent-acoes .btn-score { width: auto; padding: 6px 12px; font-size: 12.5px; }
.pv-btn-voltar { border: 0; background: none; color: var(--ink-3); font-size: 12px; cursor: pointer; text-decoration: underline; }
.pv-btn-voltar:hover { color: var(--ink); }
.pv-saude { font-size: 11.5px; font-weight: 700; color: var(--green-d); align-self: center; }
.pv-saude.instavel { color: var(--warn); }
html[data-theme="dark"] .pv-carona { background: #3a2e12; color: #fbcf6b; }

/* ===================== Consultar histórico (Fase 1) ===================== */
.badge-novo { background: var(--warn); color: #fff; font-size: 9.5px; font-weight: 800;
  border-radius: 20px; padding: 1px 7px; letter-spacing: .03em; text-transform: uppercase; }

.hist-form { display: grid; grid-template-columns: 1.1fr 1fr 1fr 1.3fr auto; gap: 12px; align-items: end; margin-top: 12px; }
.hist-fld { display: flex; flex-direction: column; }
.hist-fld label { font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  color: var(--ink-3); margin-bottom: 5px; }
.hist-fld input, .hist-fld select { border: 1px solid var(--line); background: var(--surface-2);
  border-radius: 10px; padding: 10px 12px; font: 500 14px inherit; color: var(--ink); outline: none;
  transition: border-color .14s, box-shadow .14s; }
.hist-fld input:focus, .hist-fld select:focus { border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(22,163,74,.14); }
.hist-hint { font-size: 11.5px; font-weight: 700; margin-top: 5px; min-height: 15px; }
.hist-hint.ok { color: var(--ok); } .hist-hint.bad { color: var(--danger); }
.hist-hint.dim { color: var(--ink-3); font-weight: 500; }
.hist-form .search-btn { white-space: nowrap; height: 42px; }
@media (max-width: 900px) { .hist-form { grid-template-columns: 1fr 1fr; } .hist-form .search-btn { grid-column: 1 / -1; } }
@media (max-width: 560px) { .hist-form { grid-template-columns: 1fr; } }

.hist-chips { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 10px; }
.hist-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--green-l);
  color: var(--green-d); border-radius: 999px; padding: 4px 6px 4px 12px; font-size: 12px; font-weight: 700; }
.hist-chip button { border: 0; background: rgba(0,0,0,.1); color: inherit; width: 17px; height: 17px;
  border-radius: 50%; font-size: 10px; line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.hist-chip button:hover { background: rgba(0,0,0,.22); }

.hist-mods { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 12px; }
.hist-mod { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
  border-radius: 999px; padding: 5px 13px; font-size: 12px; font-weight: 700; cursor: pointer; transition: all .13s; }
.hist-mod:hover { border-color: var(--green); }
.hist-mod.on { background: var(--green); border-color: var(--green); color: #fff; }

.hist-info { font-size: 13px; color: var(--ink-2); margin-bottom: 12px; }
.hist-info b { color: var(--ink); }
.hist-cache { display: inline-block; background: var(--surface-2); color: var(--ink-3); border-radius: 6px;
  padding: 1px 7px; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; margin-left: 4px; }

.hist-vazio-ic { font-size: 32px; margin-bottom: 8px; }
.hist-vazio-tx { font-size: 13.5px; color: var(--ink-2); line-height: 1.6; }
.hist-vazio-tx b { color: var(--ink); }

.hist-lista { display: flex; flex-direction: column; gap: 10px; }
.hist-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); overflow: hidden; transition: border-color .14s, box-shadow .14s; }
.hist-card:hover { border-color: var(--green); }
.hist-card-h { display: flex; gap: 9px; align-items: center; flex-wrap: wrap; padding: 13px 16px 4px; cursor: pointer; }
.hist-card-t { flex: 1; min-width: 220px; font-size: 13.6px; font-weight: 800; color: var(--green-d); }
.hist-caret { color: var(--ink-3); font-size: 14px; transition: transform .2s; }
.hist-card.aberto .hist-caret { transform: rotate(180deg); }
.hist-card-o { padding: 0 16px; font-size: 12.8px; color: var(--ink-2); margin: 4px 0 8px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hist-card.aberto .hist-card-o { -webkit-line-clamp: unset; }
.hist-card-m { padding: 0 16px 13px; display: flex; gap: 12px; flex-wrap: wrap; font-size: 11.6px; color: var(--ink-3); }
.hist-card-m b { color: var(--ink-2); font-variant-numeric: tabular-nums; }

.hist-pill { display: inline-block; border-radius: 999px; padding: 2px 9px; font-size: 10.5px; font-weight: 800; white-space: nowrap; }
.hist-pill.ok { background: var(--ok-bg); color: var(--ok); }
.hist-pill.warn { background: var(--warn-bg); color: var(--warn); }
.hist-pill.danger { background: var(--danger-bg); color: var(--danger); }
.hist-pill.info { background: var(--info-bg); color: var(--info); }
.hist-pill.dim { background: var(--surface-2); color: var(--ink-3); }

.hist-detalhe { display: none; padding: 0 16px 15px; border-top: 1px solid var(--line); margin-top: 2px; }
.hist-card.aberto .hist-detalhe { display: block; padding-top: 13px; }
.hist-kv { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 9px; margin-bottom: 10px; }
.hist-kv > div { background: var(--surface-2); border-radius: 9px; padding: 8px 12px; font-size: 11.3px; color: var(--ink-3); }
.hist-kv b { display: block; font-size: 13.5px; color: var(--ink); margin-top: 2px; font-variant-numeric: tabular-nums; }

.hist-ata { background: var(--warn-bg); border: 1px solid var(--warn); border-radius: 11px; padding: 12px 14px; margin-bottom: 10px; }
.hist-ata.dim { background: var(--surface-2); border-color: var(--line); color: var(--ink-2); font-size: 12.5px; }
.hist-ata-h { font-size: 13px; font-weight: 800; color: var(--ink); margin-bottom: 8px; }
.hist-ata .hist-kv > div { background: rgba(255,255,255,.5); }
.hist-prog { height: 8px; background: rgba(0,0,0,.08); border-radius: 999px; overflow: hidden; margin: 4px 0 2px; }
.hist-prog i { display: block; height: 100%; background: var(--warn); border-radius: 999px; }
.hist-ata-dica { font-size: 12.3px; font-weight: 700; color: var(--warn); margin-top: 8px; }

.hist-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.hist-btn { display: inline-block; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
  border-radius: 9px; padding: 8px 14px; font-size: 12.5px; font-weight: 700; text-decoration: none; cursor: pointer; }
.hist-btn:hover { border-color: var(--green); color: var(--green-d); }
html[data-theme="dark"] .hist-ata .hist-kv > div { background: rgba(0,0,0,.25); }

/* abas do detalhe (Resumo | Itens e vencedores | Ata) */
.hist-abas { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 12px; overflow-x: auto; }
.hist-aba { border: 0; background: none; padding: 8px 14px; font-size: 12.8px; font-weight: 700; color: var(--ink-3);
  border-bottom: 2px solid transparent; white-space: nowrap; cursor: pointer; }
.hist-aba:hover { color: var(--ink); }
.hist-aba.on { color: var(--green-d); border-bottom-color: var(--green); }
html[data-theme="dark"] .hist-aba.on { color: var(--ok); }
.hist-pane { display: none; }
.hist-pane.on { display: block; }

.hist-itens-load { padding: 20px 8px; text-align: center; color: var(--ink-2); font-size: 13px; }
.hist-itens-aviso { background: var(--warn-bg); color: var(--warn); border-radius: 9px; padding: 8px 12px; font-size: 12px; font-weight: 700; margin-bottom: 10px; }
.hist-itens-topo { font-size: 12px; color: var(--ink-3); margin-bottom: 8px; font-weight: 700; }
.hist-spin { display: inline-block; width: 14px; height: 14px; border: 2px solid var(--line); border-top-color: var(--green);
  border-radius: 50%; animation: hist-rot .7s linear infinite; vertical-align: -2px; margin-right: 4px; }
@keyframes hist-rot { to { transform: rotate(360deg); } }

.hist-tab-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; }
.hist-tab { border-collapse: collapse; width: 100%; font-size: 12.6px; min-width: 620px; }
.hist-tab th, .hist-tab td { text-align: left; padding: 8px 11px; border-bottom: 1px solid var(--line); vertical-align: top; }
.hist-tab th { background: var(--surface-2); font-size: 10.5px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: var(--ink-3); white-space: nowrap; position: sticky; top: 0; }
.hist-tab tbody tr:last-child td { border-bottom: 0; }
.hist-tab tbody tr:hover { background: var(--surface-2); }
.hist-tab .num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.hist-tab .dim { color: var(--ink-3); font-style: italic; }
.hist-ms, .hist-porte { display: inline-block; background: var(--surface-2); color: var(--ink-3); border-radius: 5px;
  padding: 0 6px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; }
.hist-porte { background: var(--brand-l); color: var(--green-d); }
html[data-theme="dark"] .hist-porte { color: var(--ok); }

/* ---------------- Preços Oficiais (Pesquisa de Preços do governo) ---------------- */
.pr-busca{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}
.pr-fld{display:flex;flex-direction:column;gap:4px}
.pr-fld.pr-grow{flex:1;min-width:220px}
.pr-fld label{font-size:12px;font-weight:700;color:var(--ink-3,#6b7a88);text-transform:uppercase;letter-spacing:.4px}
.pr-select,.pr-fld input{border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:14px;background:var(--surface,#fff);color:var(--ink)}
.pr-itens{margin-bottom:14px}
.pr-itens-tt{font-size:13px;color:var(--ink-3,#6b7a88);margin:2px 0 8px;font-weight:600}
.pr-item{display:block;width:100%;text-align:left;border:1px solid var(--line);background:var(--surface,#fff);color:var(--ink);border-radius:9px;padding:9px 12px;margin:5px 0;cursor:pointer;font-size:13.5px}
.pr-item:hover{border-color:var(--accent);background:var(--ok-bg,#eef7f2)}
.pr-dim{color:var(--ink-3,#6b7a88);font-size:14px;padding:8px 2px}
.pr-painel{margin-top:6px}
.pr-item-sel{background:var(--ok-bg,#eef7f2);border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-size:14px;margin-bottom:14px}
.pr-filtros{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.pr-chk{display:flex;align-items:center;gap:7px;font-size:13.5px;color:var(--ink-3,#6b7a88)}
.pr-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:640px){.pr-kpis{grid-template-columns:1fr 1fr}}
.pr-kpi{background:var(--surface,#fff);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.pr-kpi .pr-lbl{font-size:12px;color:var(--ink-3,#6b7a88);font-weight:600}
.pr-kpi .pr-val{font-size:24px;font-weight:800;margin-top:3px;font-variant-numeric:tabular-nums}
.pr-kpi.ref{background:var(--ok-bg,#eaf7ef);border-color:var(--green,#16a34a)}
.pr-kpi.ref .pr-val{color:var(--green,#16a34a)}
.pr-kpi.min .pr-val{color:#2563eb}
.pr-kpi.max .pr-val{color:#dc2626}
.pr-ncompras{color:var(--ink-3,#6b7a88);font-size:13.5px;margin:10px 2px 16px}
.pr-sug{display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:var(--surface,#fff);border:1px solid var(--line);border-left:5px solid var(--green,#16a34a);border-radius:12px;padding:14px 18px;margin-bottom:16px}
.pr-sug-tx{color:var(--ink-2,#374151);font-size:14px}
.pr-sug-val{font-size:26px;font-weight:800;color:var(--green,#16a34a);font-variant-numeric:tabular-nums}
.pr-btn{margin-left:auto;background:var(--accent);color:#fff;border:none;border-radius:9px;padding:9px 15px;font-weight:700;cursor:pointer;font-size:14px}
.pr-grid2{display:grid;grid-template-columns:1.3fr 1fr;gap:16px;margin-bottom:16px}
@media(max-width:760px){.pr-grid2{grid-template-columns:1fr}}
.pr-card{background:var(--surface,#fff);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.pr-card h3{margin:0 0 12px;font-size:15px}
.pr-bar{display:flex;align-items:center;gap:10px;margin:7px 0;font-size:13px}
.pr-bar .pr-bk{width:120px;color:var(--ink-3,#6b7a88);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-bar .pr-track{flex:1;background:var(--line);border-radius:6px;height:15px;overflow:hidden}
.pr-bar .pr-fill{height:100%;background:var(--accent);border-radius:6px}
.pr-bar.dist .pr-fill{background:#2563eb}
.pr-bar .pr-bv{width:38px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.pr-tblwrap{overflow-x:auto}
.pr-tbl{width:100%;border-collapse:collapse;font-size:13px;min-width:720px}
.pr-tbl th,.pr-tbl td{text-align:left;padding:8px 11px;border-bottom:1px solid var(--line);white-space:nowrap}
.pr-tbl th{color:var(--ink-3,#6b7a88);font-size:11px;text-transform:uppercase;letter-spacing:.4px;cursor:pointer}
.pr-tbl th:hover{color:var(--accent)}
.pr-tbl td.pr-preco{font-weight:800;font-variant-numeric:tabular-nums}
.pr-tbl td.pr-marca{font-weight:600}
.pr-uf{background:var(--line);border-radius:5px;padding:1px 7px;font-size:12px;font-weight:700;color:var(--ink-3,#6b7a88)}
.pr-trocar{background:none;border:none;color:var(--accent);font-weight:700;font-size:13px;cursor:pointer;text-decoration:underline;margin-left:6px;padding:0}
.pr-marca-inp{min-width:230px}
.pr-bar.pr-mk{cursor:pointer;border-radius:6px;padding:2px 4px;margin:5px -4px}
.pr-bar.pr-mk:hover{background:var(--ok-bg,#eef7f2)}

/* Radar de Planejamento (PCA) */
.pca-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.pca-input{flex:1;min-width:240px;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:10px 12px;font-size:14px;color:var(--ink);font-family:inherit}
.pca-sel{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:10px 12px;font-size:13px;color:var(--ink-2);font-family:inherit;cursor:pointer}
.pca-info{color:var(--ink-2);font-size:13px;margin-bottom:10px}
.pca-card{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:12px;padding:12px 14px;margin-bottom:10px}
.pca-card-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:5px}
.pca-badge{font-size:10.5px;font-weight:800;letter-spacing:.4px;background:var(--green-l);color:var(--green-d);border-radius:999px;padding:3px 9px;white-space:nowrap}
.pca-desc{font-size:14px;color:var(--ink)}
.pca-meta{font-size:12.5px;color:var(--ink-2);display:flex;gap:6px;flex-wrap:wrap}

/* ===================== PWA: convite de instalação + modo app (mobile Fase 1A) ===================== */
.pwa-convite {
  position: fixed; left: 12px; right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  /* z 54: acima do conteúdo/overlay (50), ABAIXO da barra de lote do kanban (55), dos
     toasts (60) e do onboarding (70): convite nunca tapa ação nem o fluxo guiado */
  z-index: 54; display: flex; align-items: center; gap: 10px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 14px;
  padding: 10px 12px; box-shadow: 0 8px 30px rgba(10, 30, 25, .22);
}
.pwa-convite.hidden { display: none; }
.pwa-convite-ico img { display: block; border-radius: 8px; }
.pwa-convite-txt { flex: 1; font-size: 13px; line-height: 1.35; color: var(--ink); }
.pwa-convite-btn { background: var(--accent); color: #fff; border: 0; border-radius: 10px; padding: 9px 14px; font-weight: 800; font-size: 13px; cursor: pointer; white-space: nowrap; }
.pwa-convite-x { background: none; border: 0; color: var(--ink3); font-size: 15px; cursor: pointer; padding: 4px 6px; flex-shrink: 0; }
@media (min-width: 821px) { .pwa-convite { left: auto; right: 18px; max-width: 430px; } }

/* Modo app instalado: o que é só-desktop some. O bookmarklet do Capturador precisa ser
   arrastado para a barra de favoritos e injeta na página do PORTAL, nada disso existe
   dentro do app; a sala continua mostrando o feed que o desktop estiver capturando. */
.pwa-app .disp-feed-row { display: none; }
.pwa-app .mn-legado { display: none; }

/* ===================== Mobile Fase 1B: as 4 telas que só rolavam de lado ===================== */

/* Kanban no celular: UMA etapa por vez, escolhida pelos chips (o quadro de 6 colunas de
   282px era só scroll horizontal). No desktop os chips somem e nada muda. */
.kanban-etapas { display: none; }
.kc-placeholder .kc-ph-mob { display: none; }
@media (max-width: 720px) {
  .kanban-wrap { padding: 14px 12px 60px; overflow-x: visible; }
  .kanban { display: block; }
  .kanban-etapas { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 10px; -webkit-overflow-scrolling: touch; }
  .ke-chip { flex-shrink: 0; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
    border-radius: 999px; padding: 7px 12px; font-size: 12.5px; font-weight: 700; cursor: pointer; font-family: inherit; }
  .ke-chip.on { background: var(--teal); border-color: var(--teal); color: #fff; }
  .kanban-col { display: none; }
  .kanban-col.kb-ativa { display: flex; width: 100%; flex-basis: auto; max-height: none; }
  /* sem hover no touch, o checkbox de seleção ficava invisível (opacity 0) */
  .kanban-card .kc-check { opacity: 1; }
  /* etapa vazia: no touch não existe arrastar, o caminho é o ⇄ do card */
  .kc-placeholder .kc-ph-desk { display: none; }
  .kc-placeholder .kc-ph-mob { display: inline; }
  /* barra de seleção múltipla: largura total, sem tapar o indicador de home do iPhone */
  .kanban-bulk { left: 12px; right: 12px; transform: none; flex-wrap: wrap; justify-content: center;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
}

/* Cockpit da Disputa no celular: cada item da tabela de 9 colunas vira um CARD empilhado
   (o data-rotulo do td vira o cabeçalho do campo). No desktop a tabela segue igual. */
@media (max-width: 720px) {
  /* a moldura com overflow-x:auto decapitava o selo #1 e o ✕ do primeiro card (top: -10px) */
  .disp-grade-wrap { overflow: visible; border: 0; background: transparent; }
  .disp-grade { min-width: 0; }
  .disp-grade thead { display: none; }
  .disp-grade, .disp-grade tbody { display: block; }
  .disp-grade tr { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 10px;
    background: var(--surface); border: 1px solid var(--line); border-radius: 12px;
    padding: 16px 12px 12px; margin-bottom: 14px; position: relative; }
  .disp-grade td { display: block; padding: 0; border: 0; }
  .disp-grade td[colspan] { grid-column: 1 / -1; }
  .disp-grade td[data-rotulo]::before { content: attr(data-rotulo); display: block;
    font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em;
    color: var(--ink-3); margin-bottom: 3px; }
  /* .disp-grade na frente: a regra base .disp-grade .disp-i (0,2,0) venceria .disp-i (0,1,0) */
  .disp-grade .disp-i { position: absolute; top: -10px; left: 10px; background: var(--teal); color: #fff;
    border-radius: 999px; font-size: 11px; font-weight: 800; padding: 2px 10px; }
  .disp-grade .disp-c-rm { position: absolute; top: -10px; right: 8px; }
  .disp-c-desc { grid-column: 1 / -1; }
  .disp-c-desc .disp-desc { width: 100%; }
  .disp-grade td .disp-num { width: 100%; }
  /* qtd + unidade lado a lado (o rótulo ::before ocupa a linha de cima) */
  .disp-grade td.disp-qtd { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; white-space: normal; }
  .disp-grade td.disp-qtd::before { flex-basis: 100%; margin-bottom: 0; }
  .disp-grade .disp-qtd .disp-num { width: 96px; flex: 0 0 auto; }
  .disp-grade .disp-qtd .disp-un { width: 64px; margin-left: 0; }
  .disp-c-st { grid-column: 1 / -1; }
  .disp-c-st .disp-st { width: 100%; }
  .disp-dec-cell { grid-column: 1 / -1; min-width: 0; }
  /* mini-vigia: 300px fixos ocupavam 80% de um iPhone; agora cabe na tela */
  .mini-vigia { width: min(300px, calc(100vw - 24px)); right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
}

/* B.I. no celular: os gráficos densos continuam roláveis (viewBox largo encolhido ficaria
   ilegível), mas a rolagem ganha uma dica fixa, para ninguém achar que o gráfico terminou.
   .tem-scroll é ligada por JS só quando o gráfico realmente transborda. */
@media (max-width: 680px) {
  #view-inteligencia .bi-scroll.tem-scroll::after { content: "‹ deslize de lado para ver o gráfico inteiro ›";
    position: sticky; left: 8px; display: inline-block; font-size: 11px; color: var(--ink3);
    padding: 4px 8px 2px; }
}

/* Agenda em telas estreitas: menos moldura, mais conteúdo */
@media (max-width: 600px) {
  .agenda-grupo { padding: 12px 12px; }
  .agenda-item { gap: 6px; font-size: 13px; }
}

/* Safe areas do iPhone: com a status bar translúcida (black-translucent) o conteúdo
   desenha sob o notch; no modo instalado a topbar absorve o recuo do sistema. A ALTURA
   cresce junto com o padding (box-sizing: border-box esmagaria o conteúdo sem isto). */
@media (display-mode: standalone) {
  .topbar { padding-top: env(safe-area-inset-top, 0px); height: calc(64px + env(safe-area-inset-top, 0px)); }
  .filtros-mobilebar { padding-left: env(safe-area-inset-left, 0px); padding-right: env(safe-area-inset-right, 0px); }
}
@media (display-mode: standalone) and (max-width: 720px) {
  .topbar { height: calc(56px + env(safe-area-inset-top, 0px)); }
  .nav { top: calc(56px + env(safe-area-inset-top, 0px)); max-height: calc(100vh - 56px - env(safe-area-inset-top, 0px)); }
  .nav-overlay { inset: calc(56px + env(safe-area-inset-top, 0px)) 0 0; }
}