/* =====================================================================
   Financeiro P2B — aplicação
   Paleta: KIT MARCA P2B / BRAND_SPEC.md
   Estrutura de sistema: navegação lateral fixa, barra de contexto e
   área de trabalho. Fundo claro, sem gradiente.
   ===================================================================== */

@font-face{font-family:Poppins;src:url('/fontes/Poppins-Light.ttf') format('truetype');font-weight:300;font-display:swap}
@font-face{font-family:Poppins;src:url('/fontes/Poppins-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Poppins;src:url('/fontes/Poppins-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Poppins;src:url('/fontes/Poppins-Bold.ttf') format('truetype');font-weight:700;font-display:swap}

:root{
  --verde-profundo:#0E2E28;
  --verde-esmeralda:#1C5E52;
  --acento:#22705E;
  --verde-claro:#79B6A4;
  --cinza-nevoa:#F2F3F3;
  --verde-nevoa:#EEF4F2;
  --branco:#FFFFFF;
  --ok:#2E8C6A;
  --atencao:#3F6E8C;
  --risco:#C0492F;
  --parcial:#A8721B;
  --ok-fundo:#E6F3EE;
  --atencao-fundo:#E8EFF5;
  --risco-fundo:#FBECE8;
  --parcial-fundo:#FBF3E3;

  --trabalho:#F4F6F5;       /* área de trabalho, mais fria que a carta */
  --carta:#FFFFFF;
  --tinta:#0E2E28;
  --corpo:#22312C;
  --apoio:#556862;
  --regra:#E7EBEA;
  --regra-forte:#D2DAD7;
  --lateral:190px;
  color-scheme:light only;
}
*{box-sizing:border-box}
img{max-width:100%;height:auto}
body{margin:0;background:var(--trabalho);color:var(--corpo);
  font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif;
  font-weight:400;font-size:15.5px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--acento);text-underline-offset:3px}

/* ================= navegação lateral ================= */
body.app{display:block;min-height:100vh}
html.sem-rolagem{overflow:hidden}
.lateral{background:var(--branco);border-right:1px solid var(--regra);display:flex;
  flex-direction:column;position:fixed;top:0;left:0;height:100vh;width:238px;z-index:60;
  padding:22px 0 16px;overflow-y:auto;transform:translateX(-100%);
  transition:transform .18s ease;box-shadow:0 0 0 rgba(14,46,40,0)}
.lateral.aberto{transform:none}
/* Em tela larga o menu empurra o conteúdo em vez de cobrir: nada do que se
   está lendo some atrás dele. Em tela estreita não há largura para empurrar,
   então ali ele sobrepõe, com o véu por trás. */
.area{transition:margin-left .18s ease}
body.menu-aberto .area{margin-left:238px}
.veu{position:fixed;inset:0;background:rgba(14,46,40,.32);z-index:55;display:none}
@media(max-width:860px){
  body.menu-aberto .area{margin-left:0}
  .lateral.aberto{box-shadow:2px 0 24px rgba(14,46,40,.10)}
  .veu:not([hidden]){display:block}
}
.hamburguer{background:none;border:none;padding:8px;margin-left:-8px;cursor:pointer;
  display:flex;flex-direction:column;gap:4px;border-radius:5px;flex-shrink:0}
.hamburguer:hover{background:var(--cinza-nevoa)}
.hamburguer span{display:block;width:17px;height:1.5px;background:var(--corpo);border-radius:1px}
.lateral .marca{display:flex;align-items:center;gap:10px;padding:0 20px 4px;
  text-decoration:none}
.lateral .marca img{height:24px;width:auto;max-width:none;flex-shrink:0}
.lateral .marca b{display:block;font-size:16px;font-weight:500;color:var(--tinta);
  letter-spacing:-.01em;line-height:1.15}
.lateral .marca small{display:block;font-size:12px;letter-spacing:.09em;
  text-transform:uppercase;color:#7A8B85;font-weight:400;margin-top:1px}
.lateral-titulo{margin:14px 20px 22px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--apoio);font-weight:500;padding-top:14px;border-top:1px solid var(--regra)}
.nav{display:flex;flex-direction:column;gap:1px;padding:0 10px;flex:1}
.nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:5px;
  text-decoration:none;color:var(--corpo);font-size:16px;line-height:1.3}
.nav a i{display:flex;color:#5E6D67;flex-shrink:0}
.nav a:hover{background:var(--cinza-nevoa)}
.nav a:hover i{color:var(--corpo)}
.nav a.ativo{background:var(--verde-nevoa);color:var(--verde-profundo);font-weight:500}
.nav a.ativo i{color:var(--acento)}
.lateral-pe{padding:14px 20px 0;margin-top:12px;border-top:1px solid var(--regra)}
.usuario{display:block;text-decoration:none;margin-bottom:9px}
.usuario b{display:block;color:var(--tinta);font-size:15px;font-weight:500}
.usuario span{display:block;color:var(--apoio);font-size:13px;text-transform:capitalize}
.lateral-pe button{background:none;border:none;padding:0;color:var(--apoio);cursor:pointer;
  font-family:inherit;font-size:14.5px}
.lateral-pe button:hover{color:var(--risco)}

/* ================= área de trabalho ================= */
.area{min-width:0;display:flex;flex-direction:column}
.topo{background:var(--branco);border-bottom:1px solid var(--regra);padding:0 24px;
  min-height:54px;display:flex;align-items:center;gap:14px;
  position:sticky;top:0;z-index:10}
.topo .busca-topo{margin-left:auto}
.topo-acoes{flex-shrink:0}
.topo-titulo{font-size:16px;font-weight:500;color:var(--tinta)}
.topo-acoes{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
main{padding:18px 22px 50px;flex:1;min-width:0}

/* ================= indicadores ================= */
.indicadores{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px;margin-bottom:18px}
.ind{background:var(--carta);border:1px solid var(--regra);border-radius:7px;padding:16px 18px}
.ind .rot{font-size:14.5px;color:#42514B;margin:0 0 6px;display:block;font-weight:500}
.ind .val{font-size:24px;white-space:nowrap;font-weight:600;color:var(--tinta);letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;display:block;line-height:1.1}
.ind .comp{font-size:14px;color:var(--apoio);margin-top:6px;display:block}
.ind.principal{background:var(--verde-profundo);border-color:var(--verde-profundo)}
.ind.principal .rot{color:var(--verde-claro)}
.ind.principal .val{color:var(--branco)}
.ind.principal .comp{color:#9DB5AE}
/* barra de progresso do mês */
.progresso{height:3px;background:var(--regra);border-radius:2px;margin-top:12px;overflow:hidden}
.progresso i{display:block;height:100%;background:var(--acento);border-radius:2px}
.ind.principal .progresso{background:rgba(255,255,255,.16)}
.ind.principal .progresso i{background:var(--verde-claro)}

/* ================= blocos de conteúdo ================= */
.bloco{background:var(--carta);border:1px solid var(--regra);border-radius:6px;
  overflow:hidden;margin-bottom:14px}
.bloco-topo{padding:10px 15px;border-bottom:1px solid var(--regra);display:flex;
  justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.bloco-topo h2{margin:0;font-size:15px;font-weight:500;color:var(--tinta)}
.bloco-topo .conta{font-size:14px;color:var(--apoio)}
.ferramentas{padding:12px 18px;border-bottom:1px solid var(--regra);display:flex;gap:9px;
  align-items:center;flex-wrap:wrap;background:#F4F6F5}

/* ================= tabela densa ================= */
.rolagem{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:15px}
th{text-align:left;font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:#42514B;
  font-weight:600;padding:11px 16px;background:#F4F6F5;border-bottom:1px solid var(--regra-forte);white-space:nowrap}
td{padding:7px 14px;border-bottom:1px solid var(--regra);vertical-align:middle}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover td{background:#FAFBFB}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
td.forte{font-weight:500;color:var(--tinta)}
tfoot th{background:var(--carta);border-top:1px solid var(--regra-forte);border-bottom:none;
  color:var(--tinta);font-size:15px;letter-spacing:0;text-transform:none;font-weight:500;padding:12px 16px}
.dim{color:var(--apoio);font-size:15px}
td a{text-decoration:none}
td a:hover{text-decoration:underline}

/* estado com marcador */
.marca-estado{display:inline-flex;align-items:center;gap:6px;font-size:15px;color:#42514B;white-space:nowrap}
.marca-estado::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--regra-forte);flex-shrink:0}
.e-recebida{color:var(--ok)} .e-recebida::before{background:var(--ok)}
.e-parcial{color:var(--atencao)} .e-parcial::before{background:var(--atencao)}
.e-perdoada,.e-perdida{color:var(--risco)} .e-perdoada::before,.e-perdida::before{background:var(--risco)}

/* ================= controles ================= */
button.acao{background:var(--verde-profundo);color:var(--branco);border:1px solid var(--verde-profundo);
  padding:7px 14px;border-radius:5px;font-family:inherit;font-size:15px;cursor:pointer;white-space:nowrap}
button.acao:hover{background:var(--verde-esmeralda);border-color:var(--verde-esmeralda)}
button.discreta{background:var(--branco);border:1px solid var(--regra-forte);color:var(--corpo);
  padding:7px 13px;border-radius:5px;font-family:inherit;font-size:15px;cursor:pointer;white-space:nowrap}
button.discreta:hover{border-color:var(--acento);color:var(--acento)}
input,select{font-family:inherit;font-size:15.5px;padding:7px 10px;border:1px solid var(--regra-forte);
  border-radius:5px;background:var(--branco);color:var(--tinta);max-width:100%}
input:focus,select:focus{outline:2px solid var(--acento);outline-offset:-1px;border-color:var(--acento)}
form.linha{display:flex;gap:6px;align-items:center;flex-wrap:wrap}

/* ================= avisos ================= */
.avisos{display:flex;flex-direction:column;gap:1px;margin-bottom:20px;background:var(--regra);
  border:1px solid var(--regra);border-radius:6px;overflow:hidden}
.aviso{background:var(--carta);border:none;border-left:2px solid var(--regra-forte);
  border-radius:0;padding:10px 15px;font-size:15px;line-height:1.5}
.avisos:has(.aviso:only-child){background:var(--carta)}
.aviso.erro{border-left-color:var(--risco)}
.aviso.ok{border-left-color:var(--ok)}
.aviso.atencao{border-left-color:var(--atencao)}
.aviso b{font-weight:500;color:var(--tinta)}

/* ================= entrar ================= */
body.sem-sessao{background:var(--trabalho)}
.entrar-tela{min-height:100vh;display:grid;place-items:center;padding:40px 24px}
.entrar{width:100%;max-width:370px;background:var(--carta);border:1px solid var(--regra);
  border-radius:8px;padding:36px 34px}
.entrar .marca-caixa{margin-bottom:30px}
.entrar .marca-caixa img{height:38px;width:auto;max-width:none;display:block;margin-bottom:20px}
.entrar h1{font-size:13.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--apoio);
  font-weight:500;margin:0}
.entrar label{display:block;font-size:15px;color:#42514B;margin-bottom:6px;font-weight:500}
.entrar input{width:100%;margin-bottom:18px;padding:9px 12px}
.entrar button{width:100%;padding:11px;margin-top:2px}
.rodape-marcas{display:flex;align-items:center;gap:20px;margin-top:32px;padding-top:20px;
  border-top:1px solid var(--regra)}
.rodape-marcas img{height:14px;width:auto;max-width:none;opacity:.4}
.so-escuro{display:none}
.vazio{padding:30px 18px;text-align:center;color:var(--apoio);font-size:15.5px}

@media(max-width:860px){
  .topo{padding:0 16px;gap:10px}
  .topo .busca-topo{display:none}   /* a busca cabe na tela larga; aqui atrapalha */
  main{padding:16px 16px 50px}
  .lateral{width:min(84vw,278px)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
:focus-visible{outline:2px solid var(--acento);outline-offset:2px}

/* ================= elementos de operação ================= */

/* fita de retorno da ação, no topo da área de trabalho */
.fita{padding:11px 16px;border-radius:5px;margin-bottom:16px;font-size:15.5px;border:1px solid}
.fita.ok{background:var(--verde-nevoa);border-color:var(--verde-claro);color:var(--ok)}
.fita.erro{background:#FBEDEA;border-color:#E3B5AA;color:var(--risco)}

/* abas de filtro dentro da barra de ferramentas */
.abas{display:flex;gap:2px;margin-left:auto;background:var(--cinza-nevoa);
  padding:3px;border-radius:6px}
.abas a{padding:6px 13px;border-radius:4px;text-decoration:none;color:#42514B;
  font-size:15px;white-space:nowrap}
.abas a:hover{color:var(--tinta)}
.abas a.ativa{background:var(--branco);color:var(--tinta);font-weight:500;
  box-shadow:0 1px 2px rgba(14,46,40,.06)}

/* ordenação por coluna */
th.ordenavel a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:5px}
th.ordenavel a:hover{color:var(--tinta)}
th.ordenavel.ativa a{color:var(--acento)}
th.ordenavel.ativa.asc a::after{content:"▴";font-size:12px}
th.ordenavel.ativa.desc a::after{content:"▾";font-size:12px}
th.ordenavel a::after{content:"⇅";font-size:12px;opacity:.35}
th.ordenavel.ativa a::after{opacity:1}
th.num,td.num{width:34px;text-align:right;padding-right:6px;font-variant-numeric:tabular-nums}
td.mono{font-variant-numeric:tabular-nums;white-space:nowrap}
.tabela-fechamento td .px{margin-right:0}

/* seleção em lote */
th.caixa,td.caixa{width:34px;padding-right:0}
input[type=checkbox]{width:15px;height:15px;accent-color:var(--acento);cursor:pointer;margin:0}
.lote-barra{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:11px 16px;
  background:var(--verde-nevoa);border-bottom:1px solid var(--verde-claro);font-size:15px}
.lote-barra span:first-child{font-weight:500;color:var(--verde-profundo)}

/* linha vencida: sinalizar com calma, como manda o manual */
tr.vencida td{background:#FDF7F5}
tr.vencida:hover td{background:#FBEFEB}
.tag-venc{color:var(--risco);font-weight:500;font-size:13px;text-transform:uppercase;letter-spacing:.06em}

/* formulário compacto dentro da linha da tabela */
form.compacta{gap:4px;justify-content:flex-end}
form.compacta input[type=date]{width:126px;padding:5px 7px;font-size:14.5px}
form.compacta input.valor{width:88px;padding:5px 7px;font-size:14.5px;text-align:right}
form.compacta select{max-width:118px;padding:5px 7px;font-size:14.5px}
form.compacta button{padding:5px 11px;font-size:14.5px}

/* indicadores em versão compacta para telas de operação */
.indicadores.compacto{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:18px}
.indicadores.compacto .ind{padding:13px 16px}
.indicadores.compacto .val{font-size:22px}
.ind.alerta{border-color:#E3B5AA;background:#FDF7F5}
.ind.alerta .val{color:var(--risco)}

/* contador de pendências ao lado do módulo */
.nav a{position:relative}
.conta-nav{margin-left:auto;font-style:normal;font-size:13.5px;font-weight:600;
  background:#E4E9E7;color:#42514B;padding:1px 7px;border-radius:9px;min-width:20px;text-align:center}
.nav a.ativo .conta-nav{background:var(--branco);color:var(--acento)}

/* ================= gráficos e colunas ================= */
.colunas{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
@media(max-width:900px){.colunas{grid-template-columns:1fr}}
.bloco-corpo{padding:13px 15px}
.bloco-corpo svg{display:block;max-width:100%}

/* legenda da rosca */
.rosca{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.legenda{list-style:none;margin:0;padding:0;flex:1;min-width:150px}
.legenda li{display:flex;align-items:center;gap:9px;padding:6px 0;border-bottom:1px solid var(--regra);font-size:15px}
.legenda li:last-child{border-bottom:none}
.legenda i{width:9px;height:9px;border-radius:2px;flex-shrink:0}
.legenda span{flex:1;color:var(--corpo)}
.legenda b{font-weight:500;color:var(--tinta);font-variant-numeric:tabular-nums}
.legenda small{color:var(--apoio);font-size:13.5px;min-width:42px;text-align:right;font-variant-numeric:tabular-nums}

/* tabelas compactas dentro de blocos lado a lado */
.colunas .bloco table td{padding:9px 16px}
.colunas .bloco .vazio{padding:26px 16px;text-align:left}

/* navegação agrupada por área */
.nav-area{margin:2px 0 0}
/* a área se veste como um item comum (ícone, mesmo tamanho, sem seta); os
   subitens ficam recuados abaixo dela */
.nav-area>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:11px;
  padding:9px 11px;border-radius:5px;font-size:16px;line-height:1.3;color:var(--corpo);position:relative}
.nav-area>summary::-webkit-details-marker{display:none}
.nav-area>summary i{display:flex;color:#5E6D67;flex-shrink:0}
.nav-area>summary:hover{background:var(--cinza-nevoa)}
.nav-area>summary:hover i{color:var(--corpo)}
.nav-area[open]>summary{color:var(--verde-profundo);font-weight:500}
.nav-area[open]>summary i{color:var(--acento)}
.nav-area>summary span{flex:1}
.nav-area>summary .conta-nav{position:static}
.nav-area>a{margin-left:22px;padding-top:7px;padding-bottom:7px;font-size:15.5px}
.nav-area>a i{transform:scale(.9)}
.nav-area[open]{padding-bottom:4px}
.lateral{padding-top:20px}
.lateral .marca{padding:0 20px 16px;border-bottom:1px solid var(--regra);margin-bottom:4px}
.nav{overflow-y:auto}

/* ================= formulários de lançamento ================= */
details.formulario{background:var(--branco);border:1px solid var(--regra);border-radius:6px;
  margin-bottom:20px;overflow:hidden}
details.formulario > summary{padding:13px 18px;cursor:pointer;font-size:15.5px;font-weight:500;
  color:var(--tinta);list-style:none;display:flex;align-items:center;gap:9px}
details.formulario > summary::-webkit-details-marker{display:none}
details.formulario > summary::before{content:"+";display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;border-radius:4px;background:var(--verde-nevoa);color:var(--acento);
  font-size:16px;line-height:1}
details.formulario[open] > summary{border-bottom:1px solid var(--regra);background:#FAFBFB}
details.formulario[open] > summary::before{content:"−"}
.grade-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;padding:15px}
.grade-form label{display:flex;flex-direction:column;gap:5px;font-size:14.5px;color:#42514B;font-weight:500}
.grade-form label.largo{grid-column:1/-1}
.grade-form input,.grade-form select,.grade-form textarea{font-size:15.5px;padding:8px 10px;
  border:1px solid var(--regra-forte);border-radius:5px;background:var(--branco);color:var(--tinta);
  font-family:inherit;width:100%}
.grade-form textarea{resize:vertical;min-height:90px}
.grade-form fieldset{grid-column:1/-1;border:1px solid var(--regra);border-radius:5px;padding:14px 16px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:0}
.grade-form legend{font-size:13.5px;color:var(--apoio);padding:0 6px}
.acoes-form{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;
  gap:14px;flex-wrap:wrap;padding-top:4px}

/* ================= etiquetas de tipo ================= */
.etiqueta{display:inline-block;padding:3px 9px;border-radius:4px;font-size:13.5px;
  background:var(--cinza-nevoa);color:#42514B;white-space:nowrap;font-weight:500}
.etiqueta.t-operacional{background:var(--verde-nevoa);color:var(--acento)}
.etiqueta.t-retirada{background:#EDF1F4;color:var(--atencao)}
.etiqueta.t-imposto{background:#F3F1EC;color:#7A6A4F}
.etiqueta.t-reembolso,.etiqueta.t-transferencia{background:var(--cinza-nevoa);color:var(--apoio)}

/* linha que ainda exige ação */
tr.pendente td{background:#FCFCFB}
tr.pendente:hover td{background:#F7F8F7}

/* ================= tabela de DRE ================= */
table.dre td{padding:9px 18px}
table.dre tr.grupo td{background:#EDF1EF;font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--tinta);font-weight:600;padding:12px 18px}
table.dre tr.subtotal td{font-weight:500;color:var(--tinta)}
table.dre tr.total td{border-top:1px solid var(--regra-forte);border-bottom:none;
  font-weight:600;color:var(--tinta);font-size:16px;padding-top:13px;padding-bottom:13px}
table.dre tr.fora td{color:var(--apoio)}
td.negativo{color:var(--risco)}

/* ================= disciplina de tabela densa ================= */
/* texto longo não empurra a tabela: corta com reticências e mostra inteiro no hover */
td.limitado{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
td.limitado.largo{max-width:290px}
/* célula sem valor recebe um traço, para a linha não parecer quebrada */
td:empty::after{content:"—";color:var(--regra-forte)}
/* a primeira coluna acompanha a rolagem horizontal, para não perder a referência */
.rolagem table.fixa th:first-child,
.rolagem table.fixa td:first-child{position:sticky;left:0;background:var(--carta);z-index:1}
.rolagem table.fixa tbody tr:hover td:first-child{background:#FAFBFB}
.rolagem table.fixa thead th:first-child{background:#FAFBFB;z-index:2}
/* par de informações na mesma célula, para reduzir número de colunas */
.par{display:block;line-height:1.35}
.par small{display:block;color:var(--apoio);font-size:13.5px}

/* criar despesa a partir de um movimento do extrato, dentro da própria linha */
details.criar-do-extrato > summary{cursor:pointer;font-size:14.5px;color:var(--acento);list-style:none}
details.criar-do-extrato > summary::-webkit-details-marker{display:none}
details.criar-do-extrato > summary:hover{text-decoration:underline}
.grade-form.compacto{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;padding:12px 0 4px;
  text-align:left}
.grade-form.compacto label{font-size:13px}
.grade-form.compacto select{font-size:14.5px;padding:6px 8px}
.grade-form.compacto .acoes-form{padding-top:0;justify-content:flex-start}

/* categoria da DRE sem lançamento na competência: visível, porém discreta */
table.dre tr.zerada td{color:#66756F;font-size:15px}
table.dre tr.zerada td:first-child{padding-left:18px}

/* rótulo de eixo e legenda com contraste suficiente */
.bloco-corpo svg text{fill:#42514B}
.legenda small{color:#42514B}
.usuario span{color:#5E6D67}
.lateral-pe button{color:#556862}

/* busca global no topo da área de trabalho */
.busca-topo{flex:1;max-width:420px;margin:0 12px}
.busca-topo input{width:100%;padding:7px 12px;font-size:15.5px;border-radius:6px;
  border:1px solid var(--regra-forte);background:#F8FAF9}
.busca-topo input:focus{background:var(--branco)}
@media(max-width:860px){ .busca-topo{order:3;flex-basis:100%;max-width:none;margin:0 0 10px} }

/* opção com caixa de marcar, usada na cobertura de contrato e no agrupamento */
.marca-op{flex-direction:row!important;align-items:center;gap:8px;font-size:15px;
  color:var(--tinta);font-weight:400;padding:7px 10px;border:1px solid var(--regra);
  border-radius:5px;background:var(--branco);cursor:pointer}
.marca-op:hover{border-color:var(--regra-forte)}
.marca-op input{width:15px;height:15px;flex-shrink:0;accent-color:var(--acento);margin:0}
.marca-op:has(input:checked){border-color:var(--acento);background:var(--verde-nevoa)}

/* matriz de faturamento: CNPJ nas linhas, fatura nas colunas. Com 10 CNPJs e
   20 faturas, uma lista seria ilegível; aqui a cobertura se lê de uma olhada. */
.matriz{border-collapse:separate;border-spacing:0}
.matriz th,.matriz td{border-bottom:1px solid var(--regra)}
.matriz thead th{vertical-align:bottom;padding:12px 10px;text-align:center;font-weight:400;
  background:var(--trabalho);border-bottom:1px solid var(--regra-forte);min-width:104px}
.matriz th.canto{text-align:left;position:sticky;left:0;background:var(--trabalho);
  z-index:2;min-width:190px}
.matriz tbody td:first-child{position:sticky;left:0;background:var(--carta);z-index:1;
  border-right:1px solid var(--regra)}
.matriz .fat-nome{display:block;font-size:14.5px;color:var(--tinta);font-weight:500;line-height:1.3}
.matriz .fat-val{display:block;font-size:15px;color:var(--corpo);margin-top:3px;
  font-variant-numeric:tabular-nums}
.matriz .fat-pe{display:block;font-size:13px;color:var(--apoio);margin-top:1px}
.matriz td.cel{text-align:center;padding:0}
.matriz td.cel label{display:flex;align-items:center;justify-content:center;
  padding:13px 0;cursor:pointer;height:100%}
.matriz td.cel label:hover{background:var(--cinza-nevoa)}
.matriz td.cel input{width:16px;height:16px;accent-color:var(--acento);margin:0;cursor:pointer}
.matriz td.cel input:disabled{cursor:default;opacity:.55}
.matriz tr:has(input:checked) td:first-child{background:#FCFDFD}
.matriz .somas td{background:var(--trabalho);font-size:14.5px;color:var(--apoio);
  border-bottom:none;padding:11px 10px}
.matriz tbody td{padding:0 10px}
.matriz tbody td:first-child,.matriz tbody td.n{padding:11px 12px}
.matriz .marca-estado{margin-left:8px;font-size:13.5px;color:var(--risco)}
.matriz .marca-estado::before{background:var(--risco)}
.matriz .etiqueta{margin-top:5px;display:inline-block}

/* bloco de atraso: a borda avisa sem gritar, o valor continua legível */
.bloco.destaque-risco{border-color:#E3B5AA}
.bloco.destaque-risco>.bloco-topo{background:#FDF7F5;border-bottom-color:#E3B5AA}
.bloco.destaque-risco>.bloco-topo h2{color:var(--risco)}
.bloco.destaque-risco .tag-venc{background:#FBEDEA;color:var(--risco);
  border-radius:4px;padding:2px 7px;font-size:14px;white-space:nowrap}

/* cartão que leva a uma tela: o painel só resume, o detalhe mora lá dentro */
a.ind{text-decoration:none;display:flex;flex-direction:column;
  transition:border-color .12s ease,background .12s ease}
a.ind:hover{border-color:var(--regra-forte);background:#FCFDFD}
a.ind .val{color:var(--tinta)}
a.ind.alerta:hover{background:#FBEFEB}
.titulo-secao{margin:24px 0 10px;font-size:13.5px;letter-spacing:.13em;text-transform:uppercase;
  color:#5E6D67;font-weight:600}
.titulo-secao:first-child{margin-top:0}

/* menu fixo em tela larga */
/* Em tela larga o menu fica sempre à vista: é a navegação principal e esconder
   custa um clique a cada troca de tela. O sanduíche continua valendo no
   celular, onde não há largura para os dois. */
@media(min-width:861px){
  body.app{display:grid;grid-template-columns:238px 1fr;align-items:start}
  .lateral{position:sticky;top:0;transform:none;height:100vh;z-index:20}
  .area{margin-left:0!important}
  body.menu-aberto .area{margin-left:0}
  .hamburguer{display:none}
  .veu{display:none!important}
}

/* barra de proporção dentro do cartão: mostra de relance quanto de cada frente
   já foi resolvido, sem precisar abrir a tela */
.ind .barra{height:4px;background:var(--regra);border-radius:3px;margin-top:11px;overflow:hidden}
.ind .barra.oca{background:transparent}
.ind .barra i{display:block;height:100%;background:var(--verde-claro);border-radius:3px}
.ind .barra.cheia i{background:var(--ok)}
a.ind:hover .barra i{background:var(--acento)}
.ind{display:flex;flex-direction:column}
/* o rótulo reserva duas linhas: assim os números de todos os cartões ficam na
   mesma altura, mesmo quando um título quebra e outro não */
.ind .marca-frente{display:flex;align-items:flex-start;gap:7px;margin-bottom:8px;
  min-height:38px;flex-shrink:0;line-height:1.35}
.ind .marca-frente i{margin-top:1px}
.ind .comp{margin-top:auto;padding-top:6px}
.ind .barra{margin-top:9px}
.ind .marca-frente i{display:flex;color:#7A8B85}
.ind .marca-frente i svg{width:15px;height:15px}

/* navegação por mês: seta, seletor, seta, e o atalho de volta ao mês corrente */
.passo-mes{display:flex;align-items:center;gap:4px}
.passo-mes>a{display:flex;align-items:center;justify-content:center;width:28px;height:30px;
  border:1px solid var(--regra-forte);border-radius:5px;background:var(--branco);
  color:var(--corpo);text-decoration:none;font-size:17px;line-height:1}
.passo-mes>a:hover{background:var(--cinza-nevoa);border-color:var(--apoio)}
.passo-mes form{margin:0}
.passo-mes .volta-hoje{width:auto;padding:0 10px;font-size:14.5px;color:var(--acento)}
.ferramentas{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 15px;
  border-bottom:1px solid var(--regra)}
.ferramentas form.linha{display:flex;gap:8px;align-items:center;margin:0}

/* mês e ano em listas, no lugar do campo de data que aparecia como "2026-09" */
.seletor-mes{display:flex;gap:6px;margin:0}
.seletor-mes select{padding:6px 9px;font-size:15px;border:1px solid var(--regra-forte);
  border-radius:5px;background:var(--branco);color:var(--tinta);font-family:inherit}
.seletor-mes select:first-child{min-width:118px;text-transform:capitalize}
.seletor-mes select:hover{border-color:var(--apoio)}
/* campos de pagamento na própria linha da cobrança */
td>input[type=date]{padding:5px 8px;font-size:14.5px;border:1px solid var(--regra-forte);
  border-radius:4px;background:var(--branco);font-family:inherit;color:var(--tinta)}
td>input.valor{width:104px;text-align:right;padding:5px 8px;font-size:14.5px;
  border:1px solid var(--regra-forte);border-radius:4px;font-family:inherit;
  font-variant-numeric:tabular-nums;color:var(--tinta)}
td>input:focus{border-color:var(--acento);outline:none}

/* A tabela do fechamento tem dez colunas e duas delas carregam campo de
   formulário: aperta o espaçamento lateral para o botão de confirmar caber
   sem empurrar a linha para fora da tela. */
.tabela-fechamento td,.tabela-fechamento th{padding-left:9px;padding-right:9px}
.tabela-fechamento td>input.valor{width:92px}
.tabela-fechamento td>input[type=date]{padding:5px 6px}
.tabela-fechamento .caixa{padding-left:12px;padding-right:4px}

/* seção que abre e fecha: informação de conferência, não de operação do dia */
.dobra{background:var(--carta);border:1px solid var(--regra);border-radius:6px;
  margin-bottom:14px;overflow:hidden}
.dobra>summary{list-style:none;cursor:pointer;padding:11px 15px;font-size:15px;
  color:var(--corpo);display:flex;align-items:center;gap:9px;font-weight:500}
.dobra>summary::-webkit-details-marker{display:none}
.dobra>summary::before{content:"";width:5px;height:5px;flex-shrink:0;
  border-right:1.5px solid #7A8B85;border-bottom:1.5px solid #7A8B85;
  transform:rotate(-45deg);transition:transform .15s ease}
.dobra[open]>summary::before{transform:rotate(45deg)}
.dobra>summary:hover{background:var(--trabalho)}
.dobra[open]>summary{border-bottom:1px solid var(--regra)}
.dobra-corpo{padding:14px 15px}
.dobra-corpo .bloco{margin-bottom:0}
.dobra-corpo .colunas{gap:12px}

/* linha de acordo homologado sem cobrança: o que falta fazer, dito na linha */
/* acordo homologado esperando cobrança: é tarefa, não problema. A data fica na
   cor do texto; só o que falta fazer ganha a cor de atenção. */
.passo-cobrar{background:#F4F8FA}
.passo-cobrar b{color:var(--tinta);font-weight:500;font-size:14.5px;display:block;margin-bottom:5px}
.passo-cobrar b .pendente{color:var(--atencao);font-weight:400;margin-left:8px}
.passo-cobrar b .pendente::before{content:"·";margin-right:8px;color:var(--apoio)}
.e-acao{color:var(--atencao)} .e-acao::before{background:var(--atencao)}
.passo-cobrar form{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0}
.passo-cobrar label{display:flex;align-items:center;gap:5px;font-size:14px}
.passo-cobrar input[type=date]{padding:4px 7px;font-size:14.5px;border:1px solid var(--regra-forte);
  border-radius:4px;font-family:inherit;color:var(--tinta)}
tr:has(.passo-cobrar) td{background:#FDF7F5}
.alerta-cobrar{color:var(--risco);font-weight:500;text-decoration:none}
.alerta-cobrar:hover{text-decoration:underline}

/* trilha do caso: onde ele está e o que falta, lido de uma vez */
.trilha{display:flex;flex-wrap:wrap;gap:0;padding:4px 0}
.passo{display:flex;align-items:flex-start;gap:9px;padding:12px 15px;flex:1 1 168px;
  border-right:1px solid var(--regra);min-width:150px}
.passo:last-child{border-right:none}
.passo .marca{width:15px;height:15px;border-radius:50%;border:1.5px solid var(--regra-forte);
  flex-shrink:0;margin-top:2px;background:var(--branco)}
.passo.feito .marca{background:var(--ok);border-color:var(--ok);position:relative}
.passo.feito .marca::after{content:"";position:absolute;left:4px;top:1.5px;width:4px;height:8px;
  border:solid var(--branco);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.passo b{display:block;font-size:14.5px;font-weight:500;color:var(--apoio);line-height:1.3}
.passo.feito b{color:var(--tinta)}
.passo small{display:block;font-size:13.5px;color:var(--apoio);margin-top:2px;line-height:1.35}

/* separador dentro do formulário: o que basta para lançar fica acima, o que
   se completa depois fica abaixo */
.grade-form label.depois{grid-column:1/-1;font-size:13px;letter-spacing:.11em;
  text-transform:uppercase;color:#7A8B85;font-weight:600;border-top:1px solid var(--regra);
  padding-top:13px;margin-top:3px}

/* link que se comporta como botão, para abrir a ficha do caso */
a.como-botao{display:inline-block;text-decoration:none;padding:5px 12px;border-radius:5px;
  border:1px solid var(--regra-forte);background:var(--branco);color:var(--corpo);font-size:14.5px}
a.como-botao:hover{background:var(--cinza-nevoa);border-color:var(--apoio)}
/* o que falta preencher, dito na própria linha */
.falta{display:block;color:var(--atencao);font-weight:400;font-style:italic}
.alerta-falta{color:var(--atencao);font-weight:500;text-decoration:none}
.alerta-falta:hover{text-decoration:underline}
td a.par{text-decoration:none;display:block}
td a.par:hover{text-decoration:underline}

/* Formulário de casadinha: cada campo com a largura do que guarda. A grade
   automática dava o mesmo tamanho a todos e sobrava um sozinho na linha. */
.form-casadinha{grid-template-columns:1.7fr 1.7fr .9fr 1.1fr;align-items:start}
/* o separador vira uma linha fina com o texto ao lado, em vez de ocupar
   uma faixa inteira só para o rótulo */
.form-casadinha .depois{grid-column:1/-1;display:flex;align-items:center;gap:10px;
  border:none;padding:6px 0 0;margin:2px 0 0}
.form-casadinha .depois::after{content:"";flex:1;height:1px;background:var(--regra)}
.form-casadinha .acoes-form{grid-column:4/-1;justify-content:flex-end;align-self:end;padding-top:0}
.form-casadinha label.curto input{max-width:96px}
@media(max-width:1080px){ .form-casadinha{grid-template-columns:1fr 1fr} }
@media(max-width:640px){ .form-casadinha{grid-template-columns:1fr} }
/* campo curto de verdade: número de parcelas não precisa de 180px */
.form-casadinha input[type=number][name=parcelas]{max-width:88px}

/* código do cliente ou do grupo: a chave que não muda, discreta ao lado do nome */
.cod{display:inline-block;font-size:13px;font-variant-numeric:tabular-nums;color:var(--apoio);
  background:var(--cinza-nevoa);border-radius:3px;padding:1px 6px;margin-right:7px;
  letter-spacing:.02em;vertical-align:middle}
td .cod{margin-right:7px}

/* prioridade do cliente (PX1 a PX5): etiqueta ao lado do nome */
.px{display:inline-block;font-size:12.5px;font-weight:600;letter-spacing:.04em;color:var(--verde-profundo);
  background:var(--verde-nevoa);border:1px solid #CFE0DA;border-radius:3px;padding:1px 6px;margin-right:7px;
  vertical-align:middle}

/* nota curta dentro do formulário dobrável */
.nota-form{grid-column:1/-1;margin:0 0 4px;font-size:14.5px;color:var(--apoio)}

/* barra de filtros do fee mensal: duas linhas, grupos segmentados com contagem,
   listas de prioridade e pacote como pílulas, busca à direita */
.filtros{border-bottom:1px solid var(--regra);padding:10px 15px;display:flex;flex-direction:column;gap:8px}
.filtros-linha{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.filtros-linha form.linha{margin:0}
.filtros-linha .busca{margin-left:auto}
.filtros-linha .segmentos:last-child{margin-left:auto}
.segmentos{display:inline-flex;border:1px solid var(--regra-forte);border-radius:6px;overflow:hidden;background:var(--branco)}
.segmentos a{padding:6px 12px;font-size:14.5px;color:#42514B;text-decoration:none;border-right:1px solid var(--regra);
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;line-height:18px}
.segmentos a:last-child{border-right:none}
.segmentos a:hover{background:var(--cinza-nevoa);color:var(--tinta)}
.segmentos a.ativa{background:var(--verde-profundo);color:var(--branco)}
.segmentos a em{font-style:normal;font-size:13px;color:var(--apoio);background:var(--cinza-nevoa);border-radius:9px;
  padding:0 6px;line-height:16px;font-variant-numeric:tabular-nums}
.segmentos a.ativa em{background:rgba(255,255,255,.18);color:var(--branco)}
select.pilula{padding:6px 28px 6px 11px;font-size:14.5px;border-radius:6px;appearance:none;-webkit-appearance:none;
  color:#42514B;border:1px solid var(--regra-forte);cursor:pointer;line-height:18px;
  background:var(--branco) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23556862' stroke-width='1.5'/></svg>") no-repeat right 10px center}
select.pilula:hover{border-color:var(--apoio)}
select.pilula.ativa{border-color:var(--verde-profundo);color:var(--verde-profundo);font-weight:500}
.filtros .busca input{min-width:220px;padding:6px 10px 6px 30px;border-radius:6px;font-size:14.5px;line-height:18px;
  background:var(--branco) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 13 13'><circle cx='5.5' cy='5.5' r='4' fill='none' stroke='%23556862' stroke-width='1.4'/><path d='M8.6 8.6L12 12' stroke='%23556862' stroke-width='1.4' stroke-linecap='round'/></svg>") no-repeat 10px center}
.limpar{font-size:14.5px;color:var(--acento);text-decoration:none;white-space:nowrap}
.limpar:hover{text-decoration:underline}
.lote-barra[hidden]{display:none}
@media (max-width:760px){.filtros-linha .busca,.filtros-linha .segmentos:last-child{margin-left:0;width:100%}
  .filtros .busca input{width:100%}.segmentos{max-width:100%;overflow-x:auto}}

/* ---- cor com moderação: estados, prioridade, quem cobra e cartões ---- */
/* estado da cobrança vira etiqueta com fundo tingido; o ponto continua */
.marca-estado{padding:2px 9px 2px 7px;border-radius:12px;font-size:14px;background:var(--cinza-nevoa);color:#42514B}
.e-aberta{background:var(--atencao-fundo);color:var(--atencao)} .e-aberta::before{background:var(--atencao)}
.e-parcial{background:var(--parcial-fundo);color:var(--parcial)} .e-parcial::before{background:var(--parcial)}
.e-recebida{background:var(--ok-fundo);color:var(--ok)}
.e-perdoada,.e-perdida{background:var(--risco-fundo)}
.e-acao{background:var(--atencao-fundo)}
tr.vencida .e-aberta,tr.vencida .e-parcial{background:var(--risco-fundo);color:var(--risco)}
tr.vencida .e-aberta::before,tr.vencida .e-parcial::before{background:var(--risco)}
tr.vencida td{background:#FFFAF9}

/* prioridade: quanto mais alta, mais verde; PX1 apagada */
.px{border-radius:4px;border-color:transparent}
.px.px5{background:var(--verde-profundo);color:var(--branco)}
.px.px4{background:#D6E9E2;color:var(--verde-esmeralda)}
.px.px3{background:var(--verde-nevoa);color:var(--verde-profundo)}
.px.px2{background:var(--cinza-nevoa);color:var(--apoio)}
.px.px1{background:transparent;color:#8A9994;border-color:var(--regra-forte)}

/* quem cobra */
.tag-frente{display:inline-block;font-size:13px;font-weight:500;letter-spacing:.04em;padding:2px 8px;border-radius:4px;white-space:nowrap}
.tag-frente.f-p2b{background:var(--ok-fundo);color:var(--acento)}
.tag-frente.f-pl{background:var(--atencao-fundo);color:var(--atencao)}
.tag-frente.f-p2badm{background:var(--cinza-nevoa);color:var(--apoio)}

/* cartões: um fio de cor no topo e o valor na cor do tom */
.ind{border-top:3px solid var(--acento)}
.ind.principal{border-top-color:var(--verde-profundo)}
.ind.tom-ok{border-top-color:var(--ok)} .ind.tom-ok .val{color:var(--ok)}
.ind.alerta{border-top-color:var(--risco);background:var(--carta)} .ind.alerta .val{color:var(--risco)}

/* cabeçalho das tabelas um tom mais frio que a carta */
.rolagem table thead th{background:#F7F9F8}
.rolagem table.fixa thead th:first-child{background:#F7F9F8}

.ind.tom-atencao{border-top-color:var(--atencao)} .ind.tom-atencao .val{color:var(--atencao)}
.ind.tom-neutro{border-top-color:var(--regra-forte)}
a.ind{text-decoration:none;display:block}
a.ind:hover{border-color:var(--regra-forte);box-shadow:0 1px 3px rgba(14,46,40,.08)}
/* Em atraso: cartão de origem escolhido e origem na lista */
.ind.escolhido{outline:2px solid var(--verde-profundo);outline-offset:-2px}
.tag-frente.f-origem{background:var(--cinza-nevoa);color:var(--corpo);font-weight:400;letter-spacing:0}
tr.escolhida td{background:var(--verde-nevoa)}
.bloco .filtros{border-bottom:1px solid var(--regra)}
.indicadores.origens{grid-template-columns:repeat(auto-fit,minmax(148px,1fr))}
.indicadores.origens .val{font-size:20px}
.tag-frente.f-thais{background:var(--parcial-fundo);color:var(--parcial)}
.filtros-linha label.dim{display:inline-flex;align-items:center;gap:6px;font-size:14.5px}
.filtros-linha label.dim input[type=date]{padding:5px 8px;font-size:14.5px;border-radius:6px}

/* campos de data no padrão do sistema, não no do navegador: texto na cor do
   corpo, máscara vazia na cor de apoio, ícone do calendário em verde */
input[type=date]{color:var(--corpo);font-variant-numeric:tabular-nums;min-height:32px}
input[type=date].vazio{color:#8A9994}
input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.7;
  filter:invert(36%) sepia(28%) saturate(580%) hue-rotate(118deg) brightness(88%)}
input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}
input[type=date]:focus{color:var(--tinta)}
input::placeholder{color:#8A9994;opacity:1}
select{color:var(--corpo)}
.indicadores.origens{grid-template-columns:repeat(auto-fit,minmax(136px,1fr))}
input[type=month].pilula{padding:5px 9px;border-radius:6px;font-size:14.5px;appearance:auto;-webkit-appearance:auto;background-image:none}
/* preposição: tabela que cabe na tela, cada célula com duas linhas */
table.prep{table-layout:auto}
table.prep td{vertical-align:top;white-space:normal}
table.prep .par small{white-space:normal;line-height:1.4}
table.prep .par small .tag-frente{margin-top:2px}
table.prep td .compacta{display:flex;gap:4px;align-items:center}
table.prep td .compacta input[type=date]{width:128px;padding:4px 6px;font-size:14px}
/* filtros em grupos com legenda; linhas da preposição mais baixas */
.filtro-grupo{display:flex;flex-direction:column;gap:4px}
.filtro-grupo>span{font-size:12.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--apoio);font-weight:500}
.filtro-grupo.busca{margin-left:auto}
.filtro-grupo .passo-mes .volta-hoje{width:auto}
table.prep td{padding-top:7px;padding-bottom:7px}
table.prep .par{line-height:1.25}
table.prep .par small{margin-top:1px;line-height:1.3}
table.prep td .compacta{display:inline-flex;gap:5px;align-items:center;white-space:nowrap}
/* preposição: filtros compactos e ação em linha */
.filtro-grupo input[type=date]{padding:5px 8px;font-size:14.5px;min-height:30px;line-height:18px}
.filtro-grupo form.linha{flex-wrap:nowrap}
.filtro-grupo .seletor-mes select{padding:5px 8px;min-height:30px}
table.prep td .compacta{flex-wrap:nowrap}
table.prep td:last-child{white-space:nowrap}
table.prep td:nth-child(5),table.prep td:nth-child(6){min-width:200px}
table.prep td:nth-child(2){min-width:180px}
table.prep td:nth-child(5),table.prep td:nth-child(6){min-width:150px}
table.prep td:nth-child(2){min-width:140px}
table.prep td .compacta{display:inline-block}
.filtro-grupo.busca{margin-left:0}
.filtro-grupo.busca input{min-width:190px}
/* fichas com parcelas lado a lado do formulário: controles enxutos para caber */
.colunas td select.pilula{max-width:150px;padding-right:24px}
.colunas td input[type=date]{width:128px;padding:4px 6px;font-size:14px;min-height:28px}
.colunas .bloco table td{padding-left:10px;padding-right:10px}

/* ---- celular: cabeçalho, cartões, filtros e tabelas ---- */
@media (max-width:640px){
  .topo{flex-wrap:wrap;row-gap:8px}
  .topo-titulo{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:16px}
  .topo-acoes{order:4;flex-basis:100%;display:flex;gap:8px;flex-wrap:wrap}
  .topo-acoes select,.topo-acoes button,.topo-acoes a{flex:1 1 auto}
  .indicadores,.indicadores.compacto,.indicadores.origens{grid-template-columns:1fr 1fr;gap:8px}
  .ind{padding:11px 12px}
  .ind .val,.indicadores.compacto .val,.indicadores.origens .val{font-size:18px;white-space:normal;word-break:break-word}
  .ind .rot{font-size:14px}
  .ind .comp{font-size:13px}
  .ind.principal{grid-column:1/-1}
  .filtros{padding:8px 10px;gap:6px}
  .filtros-linha{gap:8px}
  .segmentos{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .segmentos a{padding:6px 9px;font-size:14px}
  .filtro-grupo.busca input,.filtros .busca input{min-width:0;width:100%}
  .filtro-grupo{max-width:100%}
  .rolagem table th.oc,.rolagem table td.oc{display:none}
  .tabela-fechamento td,.tabela-fechamento th{padding-left:7px;padding-right:7px}
  .colunas{grid-template-columns:1fr}
  .grade-form{grid-template-columns:1fr}
  .bloco-topo{flex-wrap:wrap;gap:4px}
  .bloco-topo .conta{width:100%}
  .lote-barra{padding:9px 10px;gap:6px}
  .cabecalho-pagina h1{font-size:22px}
}
.tag-frente.f-convenia{background:var(--ok-fundo);color:var(--acento)}
.tag-frente.f-controlid{background:var(--atencao-fundo);color:var(--atencao)}
/* etiqueta do recorte ativo nos cartões (mensalidades) */
.ind .rot .recorte { font-weight: 600; color: var(--acento, #2f5f8f); margin-left: 4px; }

/* contas a pagar v2 */
/* formulário da conta: uma coluna central, campos mais altos (mais "app",
   menos "planilha"), o essencial em cima e o resto dobrado */
.form-conta{max-width:760px;margin:0 auto}
.bloco.form-conta{margin:0 auto 14px}
.form-conta.grade-form{grid-template-columns:1fr 1fr;padding:18px 20px}
.form-conta input:not([type=checkbox]):not([type=radio]),.form-conta select{height:40px;font-size:16px}
.form-conta [hidden]{display:none!important}
.form-conta .dobra{grid-column:1/-1;margin-bottom:0}
.form-conta .dobra-corpo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* valor com o "R$" na frente do campo */
.prefixo{display:flex;align-items:center;border:1px solid var(--regra-forte);border-radius:5px;background:var(--branco);overflow:hidden}
.prefixo i{font-style:normal;padding:0 10px;color:var(--apoio);font-size:15px;border-right:1px solid var(--regra);align-self:stretch;display:flex;align-items:center}
.form-conta .prefixo input{border:none;border-radius:0;flex:1;min-width:0}
.form-conta .prefixo input:focus{outline:none}
.prefixo:focus-within{outline:2px solid var(--acento);outline-offset:-1px;border-color:var(--acento)}
/* faixa da condição de pagamento */
.faixa{grid-column:1/-1;background:var(--cinza-nevoa);border:1px solid var(--regra);border-radius:8px;padding:12px 14px;
  display:flex;flex-direction:column;gap:12px}
.faixa-rotulo{font-size:14.5px;font-weight:500;color:#42514B}
.faixa .linha{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
.faixa .linha>label{flex:0 0 auto;min-width:160px}
.faixa .linha .dim{align-self:center;padding-bottom:2px}
/* segmento à vista / parcelado: rádio escondido, marcado na cor do .segmentos a.ativa */
.opcoes{display:inline-flex;border:1px solid var(--regra-forte);border-radius:6px;overflow:hidden;background:var(--branco);align-self:center}
.form-conta label.opcao{flex-direction:row;align-items:center;gap:0;padding:0 14px;height:38px;font-size:15px;font-weight:400;
  color:#42514B;cursor:pointer;border-right:1px solid var(--regra);position:relative;white-space:nowrap}
.form-conta label.opcao:last-child{border-right:none}
.form-conta label.opcao:hover{background:var(--cinza-nevoa);color:var(--tinta)}
.form-conta label.opcao input{position:absolute;opacity:0;width:0;height:0;margin:0}
.form-conta label.opcao:has(input:checked){background:var(--verde-profundo);color:var(--branco)}
.form-conta label.opcao:has(input:focus-visible){outline:2px solid var(--acento);outline-offset:-2px}
/* interruptor "já foi paga" */
.form-conta label.chave{flex-direction:row;align-items:center;gap:9px;font-size:15.5px;font-weight:400;color:var(--tinta);
  cursor:pointer;position:relative;align-self:center;height:40px;white-space:nowrap}
.chave input{position:absolute;opacity:0;width:0;height:0;margin:0}
.chave .botao{width:38px;height:22px;border-radius:11px;background:var(--regra-forte);position:relative;flex-shrink:0;transition:background .15s ease}
.chave .botao::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--branco);
  box-shadow:0 1px 2px rgba(14,46,40,.18);transition:left .15s ease}
.chave input:checked+.botao{background:var(--acento)}
.chave input:checked+.botao::after{left:19px}
.chave input:focus-visible+.botao{outline:2px solid var(--acento);outline-offset:2px}
@media (max-width:640px){
  .form-conta.grade-form,.form-conta .dobra-corpo{grid-template-columns:1fr}
  .form-conta.grade-form{padding:14px}
  .faixa .linha{flex-direction:column;align-items:stretch}
  .faixa .linha>label{min-width:0}
  .opcoes{align-self:flex-start}
}
/* lista de contas: a descrição é a coluna que precisa de espaço; o vencimento
   não quebra. Anula as larguras por posição herdadas de table.prep */
table.contas td:nth-child(2),table.contas td:nth-child(5),table.contas td:nth-child(6){min-width:0}
table.contas td.venc{white-space:nowrap}
table.contas td.desc{min-width:220px}
table.contas td.desc .par{max-width:360px}
/* contas do mês v3 */
/* checklist: o "✓" de lançada/paga, o valor digitado na linha da conta a confirmar */
.check{display:inline-flex;align-items:center;gap:5px;font-size:15px;color:var(--apoio);text-decoration:none;white-space:nowrap}
.check.ok{color:var(--ok);font-weight:500}
a.check.ok:hover{text-decoration:underline}
table.checklist td.dia{white-space:nowrap}
table.checklist td>input.valor{width:132px;padding:5px 7px;font-size:14.5px;text-align:right;margin-right:6px}
table.checklist td .compacta{justify-content:flex-start}
.lancar-mes{display:flex;justify-content:flex-end;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 16px;border-top:1px solid var(--regra)}
/* lista de contas: o valor digitado junto do "Pagar" numa conta a confirmar */
table.contas td .compacta input.valor{width:104px}

/* repasses v4 */
/* a data prevista editável na linha e o checkbox do lote, no mesmo desenho do checklist */
table.repasses td input.venc{width:140px;padding:5px 7px;font-size:14.5px}

/* contas do mês semanal */
/* "Repete" no bloco principal do formulário da recorrente: rótulo como o de um
   label da grade, o segmento de rádios e o dia (do mês ou da semana) na mesma linha */
.grade-form .campo{display:flex;flex-direction:column;gap:5px;font-size:14.5px;color:#42514B;font-weight:500}
.grade-form .campo.largo{grid-column:1/-1}
.grade-form .campo .linha{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
.grade-form .campo .linha>label{flex:0 0 auto;min-width:160px}
.grade-form .campo .linha .dim{align-self:center;padding-bottom:2px;font-weight:400}
@media (max-width:640px){
  .grade-form .campo .linha{flex-direction:column;align-items:stretch}
  .grade-form .campo .linha>label{min-width:0}
}

/* cartão de crédito v6 */
/* pagar a fatura: data e valor na barra de rodapé do bloco (mesmo desenho de
   .lancar-mes); o valor de uma fatura precisa de mais espaço que o da linha */
.pagar-fatura label.dim{display:inline-flex;align-items:center;gap:6px;font-size:14.5px}
.pagar-fatura input.valor{width:124px;padding:5px 7px;font-size:14.5px;text-align:right}
.pagar-fatura input[type=date]{padding:5px 8px;font-size:14.5px}
/* seletor de fatura dentro do passo-mes: uma pílula larga entre as setas */
.passo-mes select.pilula{min-width:220px}
.passo-mes>a[aria-disabled=true]{opacity:.35;pointer-events:none}
/* tabela da fatura: a compra não quebra, a descrição tem espaço */
table.fatura td.venc{white-space:nowrap}
@media (max-width:640px){.pagar-fatura{flex-wrap:wrap;justify-content:flex-start}.passo-mes select.pilula{min-width:0;max-width:220px}}

/* quem pagou na linha */
select.pilula.quem-pagou{max-width:150px;padding-right:24px}
@media (max-width:640px){form.compacta,table.prep td .compacta{flex-wrap:wrap;white-space:normal}}

/* Redesign aprovado em 13/09/2026: superfícies claras, marca monocromática,
   sete áreas principais e navegação contextual. Regras financeiras preservadas. */
:root{--acento:#168653;--verde-profundo:#153D30;--verde-esmeralda:#147047;--verde-claro:#78BB96;--trabalho:#F5F8F6;--verde-nevoa:#EAF6EE;--tinta:#153D30;--corpo:#253D31;--apoio:#607469;--regra:#E3EBE6;--regra-forte:#C9D9CF;--ok:#19754A;--atencao:#386A96;--risco:#AD4833;--parcial:#956B1C}
body{font-family:Arial,-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;line-height:1.5}
.lateral{width:210px;padding:24px 12px 18px;border-right:1px solid var(--regra)}
.lateral .marca{padding:0 7px 25px;margin:0 0 15px;border:0;gap:9px}
.lateral .marca img{height:43px;width:86px;object-fit:contain}
.lateral .marca b{font-size:15px;font-weight:600}.lateral .marca small{font-size:12px;letter-spacing:0;line-height:1.4;text-transform:none}
.nav{padding:0;gap:7px}.nav a{padding:12px 11px;font-size:16px;border-radius:9px;line-height:1.3;gap:11px;color:#526B5B}
.nav a i{color:#6F8B79}.nav a.ativo{background:var(--verde-nevoa);color:var(--acento);font-weight:600}.nav a.ativo i{color:var(--acento)}
.nav .conta-nav{margin-left:auto;background:#EDF2EE;color:var(--apoio);font-size:12px;font-style:normal;min-width:18px;text-align:center;padding:2px 4px;border-radius:4px}
.lateral-pe{padding:18px 9px 0;margin-top:26px}.usuario b{font-size:15px}
.topo{padding:15px 28px;min-height:77px;gap:20px;position:relative;flex-wrap:wrap;background:var(--trabalho)}
.topo-titulo{display:flex;flex-direction:column;gap:2px;flex:1;min-width:120px}.topo-titulo .trilha{font-size:13px;color:var(--apoio);font-weight:400}.topo-titulo strong{font-size:16px;font-weight:500}
.topo-acoes{gap:8px}.topo .busca-topo{margin-left:auto}.busca-topo input{min-width:0;width:245px;background:white;border-radius:8px;font-size:14px}
main{padding:0 28px 42px;min-width:0}.titulo-pagina{padding:24px 0 19px}.titulo-pagina h1{font-size:26px;line-height:1.25;letter-spacing:-.6px;font-weight:600;margin:0;color:var(--tinta)}
main:has(.abertura)>.titulo-pagina{display:none}.abertura{margin:24px 0 20px;padding:0}.abertura .regua,.abertura .contexto{display:none}.abertura h1{font-size:26px;letter-spacing:-.6px;font-weight:600}.abertura .sub{font-size:15px;color:var(--apoio)}
.abas-area{display:flex;flex-wrap:wrap;gap:0 23px;border-bottom:1px solid var(--regra);padding-top:20px;margin:0 0 18px}
.abas-area a{font-size:15px;color:var(--apoio);padding:0 0 11px;text-decoration:none;border-bottom:2px solid transparent}.abas-area a.ativa{color:var(--acento);border-bottom-color:var(--acento);font-weight:600}.abas-area a:hover{color:var(--acento)}
.abas-servicos{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 4px}.abas-servicos a{padding:8px 13px;font-size:14px;color:#4C6857;background:#EBF1ED;border-radius:7px;text-decoration:none}.abas-servicos a.ativa{color:#FFF;background:var(--verde-profundo)}
.indicadores,.indicadores.compacto{gap:14px;margin-bottom:22px}.ind,.indicadores.compacto .ind{border:1px solid var(--regra);border-radius:14px;padding:19px 17px;box-shadow:none;background:#FFF}
.ind .rot,.indicadores.compacto .rot{font-size:14px;font-weight:500;color:#516B5B}.ind .val,.indicadores.compacto .val{font-size:27px;font-weight:500;letter-spacing:-.7px;line-height:1.2;margin-top:7px;color:var(--tinta);white-space:normal;overflow-wrap:anywhere}
.ind .comp,.indicadores.compacto .comp{font-size:13px;color:var(--apoio);line-height:1.5;padding-top:6px}
.ind.principal{background:var(--verde-nevoa);border-color:#CBE5D3}.ind.principal .rot,.ind.principal .comp{color:#426D50}.ind.principal .val{color:var(--verde-profundo)}
.ind.principal .progresso{background:#CEE6D6}.ind.principal .progresso i{background:var(--acento)}
.ind.tom-ok,.ind.tom-atencao,.ind.tom-neutro,.ind.alerta{border-top:1px solid var(--regra)}.ind.alerta{background:#FFF8F5;border-color:#F0DACE}.ind.alerta .val{color:var(--risco)}
a.ind:hover{background:#FAFDFB;border-color:#ADCDB8;box-shadow:0 2px 7px #153D3008}a.ind.principal:hover{background:#E2F2E7}
.bloco{border-radius:14px;border-color:var(--regra);margin-bottom:20px}.bloco-topo{padding:18px 20px;border-bottom:1px solid var(--regra)}.bloco-topo h2{font-size:16px;font-weight:600}.bloco-topo .conta{font-size:14px}.bloco-corpo{padding:19px 20px}
.ferramentas,.filtros{background:#FFF;padding:14px 20px;border-color:var(--regra)}
th{background:#FAFCFA;letter-spacing:0;text-transform:none;font-size:14px;font-weight:500;padding:13px 16px;color:var(--apoio);border-bottom:1px solid var(--regra)}td{padding:12px 16px;font-size:15px;border-color:var(--regra)}tfoot th{padding:14px 16px}
td a{text-underline-offset:3px}tbody tr:hover td{background:#F8FCF9}
button.acao{background:var(--acento);border-color:var(--acento);border-radius:8px;padding:9px 14px;font-size:15px}button.acao:hover{background:#116C41;border-color:#116C41}button.discreta{border-radius:8px;padding:9px 13px}
/* A ação principal mantém contraste mesmo quando também usa a classe discreta. */
button.acao,button.acao:hover,button.acao:focus-visible,button.acao:active{color:#FFF}
input,select,textarea{border-color:var(--regra-forte);border-radius:8px;background:#FFF}input:focus,select:focus,textarea:focus{outline:2px solid #60A97D;outline-offset:1px}
.segmentos{background:#F2F6F3;padding:4px;border-radius:8px}.segmentos a{border-radius:6px;padding:7px 11px}.segmentos a.ativo,.segmentos a.ativa{background:white;color:var(--acento);box-shadow:0 1px 4px #153D300E}
.filtro-grupo>span,.filtro-grupo>label{color:var(--apoio)}.filtro-grupo{gap:7px}.filtros-linha{gap:12px}
.marca-estado{font-size:14px;white-space:normal}.e-recebida{color:var(--ok)}.e-parcial,.e-acao{color:var(--parcial)}.e-aberta{color:var(--atencao)}.tag-venc{color:var(--risco)}
.fita,.avisos{border-radius:10px}.aviso{padding:13px 17px}.formulario{border-radius:12px;border-color:var(--regra)}details.formulario>summary{padding:15px 18px;color:var(--acento)}
.painel-novo .indicadores{grid-template-columns:repeat(4,minmax(0,1fr))}.painel-colunas{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.painel-colunas .bloco{min-width:0}
.painel-prioridades{display:flex;flex-direction:column}.painel-prioridade{padding:15px 20px;border-bottom:1px solid var(--regra);display:flex;gap:12px;justify-content:space-between;align-items:center;text-decoration:none}.painel-prioridade:last-child{border:0}.painel-prioridade:hover{background:#F8FCF9}
.retorno-servicos td:last-child{white-space:nowrap}.retorno-servicos .positivo,.retorno-servicos .retorno-positivo{color:var(--ok);font-weight:600}.retorno-servicos .negativo,.retorno-servicos .retorno-negativo{color:var(--risco);font-weight:600}
.painel-novo .nota,.painel-novo .nota-painel{font-size:14px;color:var(--apoio);line-height:1.6}.painel-novo .resumo-caixa{margin-bottom:20px}
.resumo-servico-mensal .ind{min-width:0}.resumo-servico-mensal{grid-template-columns:repeat(4,minmax(0,1fr))!important}.resumo-servico-mensal .val{font-size:25px}
.resumo-servico-nota{font-size:14px;color:var(--apoio);margin:-10px 0 19px}.operacao-servico{margin-bottom:20px}.operacao-servico>summary{cursor:pointer;color:var(--acento);padding:12px 0;font-size:15px}.operacao-servico[open]>summary{margin-bottom:8px}
.entrar{border-radius:16px;box-shadow:0 8px 35px #153D3006;border-color:var(--regra)}.entrar .marca-caixa img{height:58px}.rodape-marcas img{opacity:.7}
@media(min-width:861px){body.app{grid-template-columns:210px minmax(0,1fr)}.lateral{width:210px}.topo{position:relative}}
@media(max-width:1150px){.busca-topo input{width:180px}.topo{gap:12px}.painel-colunas{grid-template-columns:1fr}.painel-novo .indicadores{grid-template-columns:repeat(2,minmax(0,1fr))}.resumo-servico-mensal{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:860px){.lateral{width:min(85vw,270px)}.topo{padding:14px 18px}.topo .busca-topo{display:none}main{padding:0 18px 30px}.titulo-pagina h1,.abertura h1{font-size:23px}.abas-area{gap:0 17px}.painel-colunas{gap:0}.bloco-topo{padding:15px 16px}}
@media(max-width:640px){.topo-titulo{white-space:normal}.topo-acoes{flex-basis:auto}.topo-acoes:empty{display:none}.ind.principal{grid-column:auto}.indicadores,.indicadores.compacto{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ind,.indicadores.compacto .ind{padding:15px 12px}.ind .val,.indicadores.compacto .val{font-size:22px;letter-spacing:-.6px}.bloco-topo h2{font-size:16px}.abas-area a{font-size:14px;padding-bottom:10px}.abas-servicos a{padding:8px 10px;font-size:14px}.ferramentas,.filtros{padding:12px}.filtros-linha .filtro-grupo{max-width:100%}.painel-novo .indicadores{gap:10px}.titulo-pagina{padding:21px 0 16px}td,th{padding:12px}.painel-novo .retorno-servicos td{font-size:14px}.resumo-servico-nota{font-size:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}}

/* Clareza de contexto e busca global */
.orientacao-tela{background:#edf5f0;border-left:3px solid #418563;border-radius:8px;padding:12px 16px;color:#365549;line-height:1.6;margin:0 0 20px}
.busca-resultados{display:grid;gap:12px}.busca-resultado{display:block;padding:18px;border:1px solid #dce7e0;border-radius:12px;background:#fff;color:inherit;text-decoration:none}.busca-resultado:hover{border-color:#418563;background:#f7faf8}.busca-resultado strong{display:block;font-size:16px;margin:5px 0}.busca-resultado p{margin:0;overflow-wrap:anywhere}.busca-categoria{font-size:14px;color:#547263}.busca-paginacao{display:flex;gap:18px;align-items:center;padding:18px 0}.base-periodo{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.base-periodo a{padding:10px 15px;border:1px solid #dce7e0;border-radius:8px;text-decoration:none}.base-periodo a[aria-current=page]{background:#153d30;color:white}.importacao-previa{max-height:360px;overflow:auto}.painel-prioridade small{display:block;color:inherit}.busca-form input{min-width:0!important;flex:1}.busca-form{flex-wrap:wrap}

@media(max-width:600px){.busca-form input,.busca-form select{flex:1 1 100%;width:100%}}

/* Mobile: navegação compacta, leitura vertical e controles de toque. */
.busca-mobile,.mobile-area-switch,.mobile-table-hint{display:none}
.mobile-filtros>summary{display:none}
.mobile-filtros{border:0;margin:0}
@media(max-width:860px){
 body.app{display:block;min-width:0}.area,main,.bloco,.colunas,.painel-colunas{min-width:0;max-width:100%}
 .topo{display:flex;flex-wrap:wrap;padding:12px 16px;gap:10px;min-height:64px}
 .topo-titulo{flex:1 1 0;min-width:0}.topo-titulo strong{font-size:16px;line-height:1.35}.topo-titulo .trilha{font-size:13px}
 .hamburguer{width:44px;height:44px;flex:0 0 44px;margin:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px}
 .busca-mobile{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 12px;border:1px solid var(--regra);border-radius:9px;text-decoration:none;font-size:16px;background:white}
 .topo-acoes{order:4;flex:1 1 100%;width:100%;min-width:0}.topo-acoes:empty{display:none}
 .topo-acoes .seletor-mes{display:flex;width:100%;gap:8px;flex-wrap:nowrap}.topo-acoes .seletor-mes select{flex:1;min-width:0;width:0}
 .lateral{height:100dvh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(24px,env(safe-area-inset-bottom));width:min(86vw,300px)}
 .lateral .nav a{min-height:48px;font-size:16px}.lateral-pe button{min-height:44px}.lateral .marca img{width:86px;height:43px}
 main{padding:0 14px max(30px,env(safe-area-inset-bottom))}
 .abas-area.mobile-enhanced{display:none}.mobile-area-switch{display:flex;align-items:center;gap:10px;padding:14px 0 8px;color:var(--apoio);font-size:15px}
 .mobile-area-switch select{min-width:0;flex:1;width:0;background:white}
 .abas-area:not(.mobile-enhanced),.abas-servicos{flex-wrap:nowrap;overflow-x:auto;max-width:100%;gap:8px;padding:8px 0;scrollbar-width:thin}
 .abas-area a,.abas-servicos a{flex:0 0 auto;min-height:44px;display:flex;align-items:center;white-space:nowrap;padding:10px 12px;font-size:16px}
 input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea{font-size:16px!important;min-height:44px;max-width:100%;box-sizing:border-box}
 button,.acao,.discreta{min-height:44px;white-space:normal;line-height:1.3}input[type=checkbox],input[type=radio]{width:20px;height:20px;min-height:20px;flex-shrink:0}
 .titulo-pagina{padding:18px 0 14px}.titulo-pagina h1{font-size:24px;line-height:1.25}
 .colunas,.painel-colunas{grid-template-columns:minmax(0,1fr)}
 .grade-form,.form-conta.grade-form,.grade-form.compacto,.form-casadinha{grid-template-columns:minmax(0,1fr)}
 .grade-form>*{min-width:0}.grade-form fieldset{min-width:0;padding:12px}.grade-form .linha,.acoes-form{flex-wrap:wrap;gap:10px}
 .grade-form label,.grade-form .campo{max-width:100%;min-width:0}.grade-form .campo .linha>label{min-width:0;flex:1 1 100%}
 .ferramentas,.filtros{padding:12px;min-width:0;max-width:100%;gap:12px}
 .filtros-linha{align-items:stretch;gap:14px}.filtro-grupo{width:100%;min-width:0;max-width:100%}.filtro-grupo form.linha{flex-wrap:wrap;width:100%;min-width:0}
 .filtro-grupo select,.filtro-grupo input{min-width:0!important;max-width:100%}.filtro-grupo.busca form,.filtro-grupo.busca input{width:100%}
 .filtro-grupo .seletor-mes{display:flex;flex-wrap:nowrap!important;gap:8px}.filtro-grupo .seletor-mes select{flex:1;width:0}
 .segmentos{width:100%;max-width:100%;flex-wrap:nowrap;overflow-x:auto;min-width:0}.segmentos a{min-height:44px;display:inline-flex;align-items:center;flex:0 0 auto;white-space:nowrap;font-size:15px}
 .mobile-filtros>summary{display:list-item;padding:14px 16px;min-height:48px;font-weight:600;color:var(--acento);cursor:pointer;border-bottom:1px solid var(--regra)}
 .mobile-filtros:not([open])>.filtros{display:none}
 .orientacao-tela{font-size:15px;line-height:1.6;padding:12px;margin-bottom:16px}.resumo-servico-nota{font-size:14px;line-height:1.6}
 .bloco-topo{padding:14px;gap:8px}.bloco-topo h2{font-size:16px;line-height:1.35}.bloco-topo .conta{font-size:14px}
 .painel-prioridade{padding:14px 4px;gap:12px}.painel-prioridade>span:first-of-type{flex:1;min-width:0}.painel-prioridade small{line-height:1.5;margin-top:4px}
 .rolagem,.importacao-previa{max-width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
 .rolagem table th.oc,.rolagem table td.oc{display:table-cell}
 .mobile-table-hint{display:block;margin:0;padding:8px 12px;background:#f2f6f3;color:var(--apoio);font-size:14px}
 .lote-barra{flex-wrap:wrap;max-width:100%;gap:10px}.lote-barra>*{max-width:100%;min-width:0}
 .entrar{width:calc(100% - 28px);max-width:380px;box-sizing:border-box;margin:24px auto;padding:24px}.sem-sessao{min-width:0}
}
@media(max-width:640px){
 .indicadores,.indicadores.compacto,.indicadores.origens,.painel-novo .indicadores,.resumo-servico-mensal{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
 .ind,.indicadores.compacto .ind{min-width:0;padding:14px 12px;border-radius:12px}
 .ind .val,.indicadores.compacto .val,.resumo-servico-mensal .val{font-size:clamp(18px,4.8vw,24px);line-height:1.3;letter-spacing:-.5px;word-break:normal;overflow-wrap:normal}
 .ind .rot{font-size:14px;line-height:1.4}.ind .comp{font-size:13px;line-height:1.5}
 table.mobile-cards{display:block;width:100%;min-width:0!important;table-layout:auto}
 table.mobile-cards>thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 table.mobile-cards>tbody{display:block;padding:0 12px}
 table.mobile-cards>tbody>tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;padding:16px 0;border-bottom:1px solid var(--regra)}
 table.mobile-cards>tbody>tr:last-child{border-bottom:0}
 table.mobile-cards>tbody>tr>td,table.mobile-cards>tbody>tr>th, .rolagem table.mobile-cards>tbody>tr>td.oc{display:block;min-width:0;width:auto!important;max-width:none;padding:0!important;border:0;text-align:left;white-space:normal;position:static;font-size:16px;line-height:1.5;overflow-wrap:anywhere}
 table.mobile-cards>tbody>tr>:first-child,table.mobile-cards .mobile-wide{grid-column:1/-1}
 table.mobile-cards>tbody>tr>td::before{content:attr(data-mobile-label);display:block;font-size:13px;color:var(--apoio);font-weight:500;margin-bottom:4px}
 table.mobile-cards .limitado{max-width:none;white-space:normal;overflow:visible;text-overflow:clip}
 table.mobile-cards form{white-space:normal;flex-wrap:wrap;max-width:100%}table.mobile-cards input,table.mobile-cards select{width:100%;min-width:0!important}
 table.mobile-cards tfoot{display:table;width:100%}table.mobile-cards tfoot th{white-space:normal}
 .base-periodo{display:grid;grid-template-columns:1fr}.base-periodo a{min-height:44px}
}
@media(max-width:359px){
 .indicadores,.indicadores.compacto,.indicadores.origens,.painel-novo .indicadores,.resumo-servico-mensal{grid-template-columns:minmax(0,1fr)!important}
 .ind .val,.indicadores.compacto .val{font-size:25px}
}

.fechar-mobile{display:none}@media(max-width:860px){.fechar-mobile{display:block;align-self:flex-end;padding:8px 12px;background:#f1f6f3;border:1px solid var(--regra);border-radius:8px;margin-bottom:12px}}

/* Rotina financeira e conciliação: 2026-09-16. */

/* Enquadramento: conteúdo se reorganiza antes de ultrapassar a área disponível. */
.area,main,.colunas,.bloco,.formulario,.filtros,.indicadores{min-width:0;max-width:100%}
.colunas{grid-template-columns:repeat(2,minmax(0,1fr))}
.colunas>*,.grade-form>*,.filtros-linha>*,.bloco-topo>*{min-width:0;max-width:100%}
.rolagem,.importacao-previa{min-width:0;max-width:100%}
.bloco-topo .conta,.grade-form label{overflow-wrap:anywhere}
.filtros-linha form.linha,.ferramentas,.linha{flex-wrap:wrap}
.filtros input,.filtros select,.formulario input,.formulario select,.formulario textarea{max-width:100%;min-width:0}
/* Valores monetários são uma unidade: nunca separam reais e centavos. */
.ind .val,.indicadores.compacto .val{white-space:nowrap;word-break:normal;overflow-wrap:normal}
.ind{min-width:0}
.indicadores.origens{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.indicadores.origens .ind{padding:14px 8px}
.indicadores.origens .rot{font-size:13px;line-height:1.4;min-height:2.8em}
.indicadores.origens .val{font-size:clamp(14px,1.1vw,22px);letter-spacing:-.35px;margin-top:6px}
.indicadores.origens .comp{font-size:12px;line-height:1.45}
@media(max-width:1199px){.indicadores.origens{grid-template-columns:repeat(4,minmax(0,1fr))}.indicadores.origens .val{font-size:clamp(17px,2vw,23px)}}
@media(max-width:900px){.colunas{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){
 .indicadores.origens{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .indicadores.origens .rot{font-size:14px}.indicadores.origens .comp{font-size:13px}
 .segmentos,.abas-servicos{flex-wrap:wrap;overflow:visible}.segmentos a,.abas-servicos a{white-space:normal;max-width:100%}
}
@media(max-width:359px){.indicadores.origens{grid-template-columns:minmax(0,1fr)!important}}
.indicadores.ind-fit{grid-template-columns:repeat(var(--fit-columns),minmax(0,1fr))!important}
/* Tabelas com colunas alinhadas. */
.rolagem>table:not(.dem-matrix)>thead>tr>th{white-space:normal}
.rolagem>table:not(.dem-matrix)>thead>tr>th,.rolagem>table:not(.dem-matrix)>tbody>tr>td{padding-left:12px;padding-right:12px}
.indicadores.origens .rot{overflow-wrap:anywhere}

/* Mensalidades: uma cobrança por linha, com filtros em cada cabeçalho. */
body[data-modulo="fechamento"] .tabela-fechamento{display:table;width:100%;font-size:15px}
body[data-modulo="fechamento"] .tabela-fechamento th.oc,body[data-modulo="fechamento"] .tabela-fechamento td.oc{display:table-cell}
body[data-modulo="fechamento"] .tabela-fechamento td{white-space:nowrap;padding:10px 12px;vertical-align:middle}
body[data-modulo="fechamento"] .tabela-fechamento .marca-estado{white-space:nowrap}
body[data-modulo="fechamento"] .mensalidades-grid{max-height:72vh;overflow:auto;position:relative;isolation:isolate}
body[data-modulo="fechamento"] .mensalidades-grid thead th{position:sticky;top:0;z-index:2;background:#f2f7f3;vertical-align:middle}
.column-title{display:flex;align-items:center;gap:5px;justify-content:space-between}
.column-title>a{white-space:nowrap}
.column-filter{display:inline-flex;align-items:center;justify-content:center;flex:0 0 28px;width:28px;min-height:30px;padding:4px;border:1px solid transparent;border-radius:5px;color:#527060;background:transparent;cursor:pointer}
.column-filter:hover,.column-filter.ativa{background:#dfeee4;border-color:#a6cbb7;color:#106841}
.column-filter:focus-visible{outline:2px solid #168653;outline-offset:2px}
.column-filter-dialog{position:fixed;inset:auto;margin:0;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:18px;border:1px solid #c7dace;border-radius:12px;box-shadow:0 12px 40px #0d332b30;color:var(--corpo);background:white;overflow:auto}
.column-filter-dialog::backdrop{background:#153d3010}
.column-filter-heading{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-bottom:14px}
.column-filter-heading strong{font-size:16px}.column-filter-heading button{border:0;background:none;color:#557264;font-size:23px;cursor:pointer;padding:0 5px;line-height:1.3}
.column-filter-dialog form{display:grid;gap:14px}.column-filter-dialog label{display:grid;gap:6px;font-size:14px}
.column-filter-dialog input:not([type=hidden]),.column-filter-dialog select{width:100%;min-width:0;min-height:42px;padding:9px;font:inherit}
.column-filter-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:4px}
.column-filter-actions a{font-size:14px}.mensalidades-ajuda{margin:0;padding:11px 16px;color:var(--apoio);font-size:14px;border-bottom:1px solid var(--regra)}
@media(max-width:860px){body[data-modulo="fechamento"] .column-filter{min-height:36px;flex-basis:32px;width:32px}}
@media print{.column-filter,.column-filter-dialog,.mensalidades-ajuda{display:none!important}body[data-modulo="fechamento"] .mensalidades-grid{max-height:none;overflow:visible}}

/* Mensalidades compactas: todas as colunas e a confirmação cabem no desktop. */
body[data-modulo="fechamento"] .mensalidades-grid .tabela-fechamento{table-layout:fixed;width:100%;min-width:0}
.mensalidades-grid col.mc-selecao{width:26px}.mensalidades-grid col.mc-codigo{width:52px}.mensalidades-grid col.mc-px{width:38px}.mensalidades-grid col.mc-frente{width:64px}.mensalidades-grid col.mc-pacote{width:68px}.mensalidades-grid col.mc-valor{width:104px}.mensalidades-grid col.mc-vence{width:84px}.mensalidades-grid col.mc-status{width:68px}.mensalidades-grid col.mc-data{width:106px}.mensalidades-grid col.mc-pago{width:96px}.mensalidades-grid col.mc-acao{width:78px}
body[data-modulo="fechamento"] .mensalidades-grid .tabela-fechamento td,body[data-modulo="fechamento"] .mensalidades-grid .tabela-fechamento th{padding:6px 4px;font-size:14px;line-height:1.35;vertical-align:middle;white-space:nowrap}
body[data-modulo="fechamento"] .mensalidades-grid .tabela-fechamento th{font-size:12px;font-weight:600;height:38px}
body[data-modulo="fechamento"] .mensalidades-grid .column-title{gap:0;justify-content:space-between;min-width:0}
body[data-modulo="fechamento"] .mensalidades-grid th.ordenavel a{gap:0;min-width:0}
body[data-modulo="fechamento"] .mensalidades-grid th.ordenavel a::after{display:none}
body[data-modulo="fechamento"] .mensalidades-grid th.ordenavel.ativa a::after{display:inline;font-size:10px}
body[data-modulo="fechamento"] .mensalidades-grid .column-filter{width:18px;flex-basis:18px;min-height:26px;padding:1px;border:0}
body[data-modulo="fechamento"] .mensalidades-grid .column-filter svg{width:13px;height:13px}
body[data-modulo="fechamento"] .mensalidades-grid .mensal-cliente>a,body[data-modulo="fechamento"] .mensalidades-grid .mensal-pacote>span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body[data-modulo="fechamento"] .mensalidades-grid .px,body[data-modulo="fechamento"] .mensalidades-grid .tag-frente{font-size:11px;line-height:18px;padding:1px 3px;letter-spacing:0}
body[data-modulo="fechamento"] .mensalidades-grid .marca-estado{font-size:12px;gap:4px;white-space:nowrap}
body[data-modulo="fechamento"] .mensalidades-grid .e-vencida{color:#a53229}
body[data-modulo="fechamento"] .mensalidades-grid td input:not([type=checkbox]){width:100%;min-width:0;max-width:100%;font-size:13px;min-height:30px;height:30px;padding:4px 3px;box-sizing:border-box}
body[data-modulo="fechamento"] .mensalidades-grid td input[type=number]{appearance:textfield;-moz-appearance:textfield}
body[data-modulo="fechamento"] .mensalidades-grid td input[type=number]::-webkit-inner-spin-button,body[data-modulo="fechamento"] .mensalidades-grid td input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
body[data-modulo="fechamento"] .mensalidades-grid td input[type=date]::-webkit-calendar-picker-indicator{margin-left:0;padding:0;width:13px}
body[data-modulo="fechamento"] .mensalidades-grid td .acao{padding:6px 5px;min-height:30px;width:100%;font-size:12px;line-height:1.2;white-space:nowrap}
body[data-modulo="fechamento"] .mensalidades-grid td.caixa,body[data-modulo="fechamento"] .mensalidades-grid th.caixa{text-align:center;padding:4px}
body[data-modulo="fechamento"] .mensalidades-grid input[type=checkbox]{width:16px;height:16px;min-height:16px;margin:0}
/* A navegação usa seu modo recolhido quando a janela precisa desse espaço. */
@media(min-width:861px) and (max-width:1250px){
 body.app[data-modulo="fechamento"]{display:block}
 body[data-modulo="fechamento"] main{padding-left:18px;padding-right:18px}
 body[data-modulo="fechamento"] .lateral{position:fixed;transform:translateX(-100%);z-index:60;width:210px}
 body[data-modulo="fechamento"] .lateral.aberto{transform:none}
 body[data-modulo="fechamento"] .hamburguer{display:flex}
 body[data-modulo="fechamento"] .fechar-mobile{display:block}
 body[data-modulo="fechamento"] .veu:not([hidden]){display:block!important}
}
@media(max-width:1023px){body[data-modulo="fechamento"] .mensalidades-grid .tabela-fechamento{min-width:960px}}

/* Topo de Mensalidades: contexto, período e filtros em faixas compactas. */
body[data-modulo="fechamento"] .topo{min-height:54px;padding-top:9px;padding-bottom:9px}
body[data-modulo="fechamento"] .topo-titulo .trilha{font-size:15px;color:var(--corpo)}
body[data-modulo="fechamento"] .abas-area{padding-top:12px;margin-bottom:0}
body[data-modulo="fechamento"] .abas-area a{padding-bottom:9px}
.mensalidades-heading{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;margin:16px 0 14px;min-width:0}
.mensalidades-heading h1{font-size:25px;font-weight:600;line-height:1.25;letter-spacing:-.5px;margin:0;color:var(--tinta)}
.mensalidades-heading .passo-mes{gap:5px;flex-wrap:wrap}
.mensalidades-heading .seletor-mes{flex-wrap:nowrap;gap:5px}
.mensalidades-heading .seletor-mes select{padding:5px 7px;min-height:32px;font-size:15px;background:white}
.mensalidades-heading .passo-mes>a{height:32px}.mensalidades-heading .volta-hoje{font-size:13px}
.mensalidades-meta{display:flex;align-items:center;gap:12px;margin-left:auto;color:var(--apoio);font-size:13px}
.mensalidades-help{position:relative;margin:0}
.mensalidades-help>summary{list-style:none;display:flex;align-items:center;justify-content:center;cursor:pointer;width:26px;height:26px;border:1px solid #cbdcd1;border-radius:50%;background:white;font-size:14px;font-weight:600;color:#466856}
.mensalidades-help>summary::-webkit-details-marker{display:none}
.mensalidades-help>p{position:absolute;top:32px;right:0;z-index:25;width:260px;max-width:calc(100vw - 32px);padding:13px 15px;border:1px solid #cbdcd1;border-radius:9px;background:#fff;box-shadow:0 5px 20px #153d301a;margin:0;font-size:14px;line-height:1.5;color:var(--corpo)}
body[data-modulo="fechamento"] .indicadores.compacto{gap:10px;margin-bottom:14px}
body[data-modulo="fechamento"] .indicadores.compacto .ind{padding:12px 14px;border-radius:11px}
body[data-modulo="fechamento"] .indicadores.compacto .rot{margin:0;line-height:1.35}
body[data-modulo="fechamento"] .indicadores.compacto .val{margin-top:5px;line-height:1.15}
body[data-modulo="fechamento"] .indicadores.compacto .comp{margin-top:4px;padding-top:0;line-height:1.4}
.mensalidades-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px;border-bottom:1px solid var(--regra);background:#fff}
.mensalidades-toolbar form{margin:0;min-width:0}
.mensalidades-empresa{flex:0 1 165px}
.mensalidades-empresa select{width:100%;min-width:0;height:36px;padding:6px 9px;font-size:14px}
.mensalidades-toolbar .mensalidades-situacao{display:flex;gap:1px;flex-wrap:nowrap;min-width:0;width:auto;max-width:100%;padding:3px;margin:0;overflow:visible}
.mensalidades-situacao a{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 9px;min-height:30px;white-space:nowrap;font-size:14px;line-height:1.35}
.mensalidades-situacao em{font-size:12px;margin:0;padding:0;font-style:normal;color:inherit;opacity:.8}
.mensalidades-situacao .mensal-vencidas{color:#a4362b}
.mensalidades-situacao .mensal-vencidas.ativa{color:#9c2d24;background:#fcece9;box-shadow:inset 0 0 0 1px #e5b9b3}
.mensalidades-busca{display:flex;align-items:center;flex:1 1 165px;max-width:260px;margin-left:auto!important;position:relative}
.mensalidades-busca input{width:100%;min-width:0;height:36px;padding:7px 34px 7px 10px;font-size:14px}
.mensalidades-busca button{display:flex;align-items:center;justify-content:center;position:absolute;right:2px;top:2px;width:32px;height:32px;min-height:32px;background:none;border:0;color:var(--acento);font-size:24px;line-height:1;padding:0;cursor:pointer}
.mensalidades-limpar{font-size:13px;white-space:nowrap}
.mensalidades-refinos{display:flex;flex-wrap:wrap;gap:6px;flex-basis:100%;min-width:0}
.mensalidades-refinos a{display:inline-flex;align-items:center;gap:7px;max-width:100%;padding:3px 8px;border:1px solid #d4e1d8;border-radius:5px;background:#f4f8f5;color:#416753;font-size:12px;text-decoration:none;overflow-wrap:anywhere}
.mensalidades-refinos span{font-size:16px;line-height:1}
.mensalidades-gerar{padding:9px 12px;border-bottom:1px solid #efd7b4;background:#fff9ee;color:#815b25;font-size:13px}
.mensalidades-gerar .linha{gap:10px}.mensalidades-gerar button.acao{padding:5px 10px;font-size:13px;min-height:30px}
@media(max-width:860px){
 .mensalidades-heading{gap:10px;margin-top:12px}.mensalidades-heading h1{font-size:23px}
 .mensalidades-meta{font-size:12px;gap:8px}.mensalidades-help>summary{width:32px;height:32px}
 .mensalidades-heading .mensalidades-periodo{order:3;flex-basis:100%;gap:6px}
 .mensalidades-heading .seletor-mes{flex:1;min-width:0}.mensalidades-heading .seletor-mes select{flex:1;width:0;min-width:0;min-height:40px}
 .mensalidades-heading .passo-mes>a{min-height:40px;min-width:32px}
 body[data-modulo="fechamento"] .indicadores.compacto .ind{padding:11px 12px}
 .mensalidades-toolbar{gap:9px;padding:10px}.mensalidades-empresa{flex:1 1 130px}
 .mensalidades-busca{flex:1 1 150px;max-width:none}.mensalidades-busca button{height:40px;min-height:40px}
 .mensalidades-toolbar .mensalidades-situacao{order:3;flex:1 1 100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:1px}
 .mensalidades-situacao a{white-space:normal;padding:7px 3px;font-size:13px;gap:4px;min-height:40px;flex-wrap:wrap;text-align:center}
 .mensalidades-situacao em{font-size:11px}.mensalidades-limpar,.mensalidades-refinos{order:4}
}
@media print{.mensalidades-help,.mensalidades-toolbar,.mensalidades-gerar{display:none!important}}

/* Duas marcas no cabeçalho do cartão original de entrada. */
.entrar .login-marcas-inline{display:grid;grid-template-columns:1fr 1.2fr;align-items:center;gap:18px;width:100%;margin-bottom:20px}
.entrar .login-marcas-inline img{display:block;width:100%;max-width:100%;min-width:0;height:58px;object-fit:contain;margin:0}

/* Mensalidades: cartões e empresa como filtros combinados. */
body[data-modulo="fechamento"] .mensalidades-quem-cobra{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:0 0 12px;min-width:0}
body[data-modulo="fechamento"] .mensalidades-quem-cobra>span{font-size:13px;color:#51685e;margin-right:5px}
body[data-modulo="fechamento"] .mensalidades-quem-cobra a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:7px 13px;border:1px solid #ceddd5;border-radius:7px;background:#fff;color:#285846;text-decoration:none;box-sizing:border-box;max-width:100%}
body[data-modulo="fechamento"] .mensalidades-quem-cobra a.ativa{background:#e0f2e8;border-color:#287757;color:#174a37;font-weight:700;box-shadow:inset 0 0 0 1px #287757}
body[data-modulo="fechamento"] .mensalidades-cards>a.ind{color:inherit;text-decoration:none;cursor:pointer;min-width:0;transition:border-color .15s,box-shadow .15s}
body[data-modulo="fechamento"] .mensalidades-cards>a.ind:hover{border-color:#287757}
body[data-modulo="fechamento"] .mensalidades-cards>a.ind.selecionado{box-shadow:inset 0 0 0 2px #287757}
body[data-modulo="fechamento"] .mensalidades-cards>a.ind.alerta.selecionado{box-shadow:inset 0 0 0 2px #b54732}
body[data-modulo="fechamento"] .mensalidades-cards>a:focus-visible,body[data-modulo="fechamento"] .mensalidades-quem-cobra a:focus-visible{outline:3px solid #287757;outline-offset:3px}
@media(max-width:600px){body[data-modulo="fechamento"] .mensalidades-quem-cobra{gap:6px}body[data-modulo="fechamento"] .mensalidades-quem-cobra>span{flex-basis:100%}body[data-modulo="fechamento"] .mensalidades-quem-cobra a{padding:7px 10px;min-height:44px}}

/* Rateio: mês e seleção múltipla visíveis. */
.rateio-filtros{background:#fff;border:1px solid #d7e3dc;border-radius:9px;padding:12px;margin-bottom:12px;min-width:0}
.rateio-filtros fieldset{border:0;padding:0;margin:8px 0 12px;min-width:0}.rateio-filtros legend{font-weight:600;margin-bottom:8px}
.rateio-filtros-linha,.rateio-pessoas{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.rateio-pessoas label{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border:1px solid #ceddd5;border-radius:6px;background:#f8faf9;min-height:40px;box-sizing:border-box}
.rateio-pessoas input{width:18px;height:18px;accent-color:#176c54}.rateio-pessoas label:has(input:checked){background:#e0f2e8;border-color:#287757;color:#174a37}
.rateio-filtros .seletor-mes{margin:0}.rateio-filtros input[type=month]{max-width:100%;min-height:40px}
@media(max-width:600px){.rateio-pessoas{gap:6px}.rateio-pessoas label{flex:1 1 130px}.rateio-filtros{padding:10px}.rateio-filtros-linha{gap:8px}}