/* estilo_v2.css — Reforma visual Astrea → Pizoni Fogaça
   ============================================================
   Complemento AGREGADO ao estilo.css original. Não substitui, não sobrescreve
   nenhuma classe existente. Todas as classes novas usam prefixo `v2-` para
   convivência limpa.

   Origem: 20/09/2026, decisão de Arthur após dissecação do Astrea.
   Objetivo: mesclar o que o Astrea tem de bonito (cards, cores, KPIs, badges,
   header rico) sem tocar na lógica ou na identidade do Pizoni Fogaça.

   ROLLBACK: basta remover o <link> deste arquivo em base.html.
   O estilo.css original continua íntegro.
   ============================================================ */

/* --------- 1. Tokens agregados (usam as variáveis já existentes) --------- */
:root {
  --v2-radius:      12px;
  --v2-radius-sm:   8px;
  --v2-gap:         14px;
  --v2-gap-sm:      10px;
  --v2-pad:         18px;
  --v2-pad-sm:      12px;
  --v2-sombra-suave: 0 1px 2px rgba(15,42,74,.04), 0 2px 6px rgba(15,42,74,.06);
  --v2-verde:       #1f9d55;
  --v2-verde-claro: #dcfce7;
  --v2-verde-escuro:#166534;
  --v2-amarelo:     #f0b429;
  --v2-amarelo-claro:#fef3c7;
  --v2-amarelo-escuro:#92400e;
  --v2-vermelho:    #d33a2c;
  --v2-vermelho-claro:#fee2e2;
  --v2-vermelho-escuro:#991b1b;
  --v2-azul:        #1f4e79;
  --v2-azul-claro:  #dbeafe;
  --v2-azul-escuro: #1e40af;
  --v2-roxo:        #7c3aed;
  --v2-roxo-claro:  #ede9fe;
  --v2-roxo-escuro: #5b21b6;
}

/* Ajuste de tema escuro para os pastéis (que ficariam muito claros no dark) */
@media (prefers-color-scheme: dark) {
  html[data-tema="auto"] {
    --v2-verde-claro:    #14351f;
    --v2-amarelo-claro:  #3a2c0a;
    --v2-vermelho-claro: #3a1a17;
    --v2-azul-claro:     #142a44;
    --v2-roxo-claro:     #241a3d;
  }
}
:root[data-tema="escuro"] {
  --v2-verde-claro:    #14351f;
  --v2-amarelo-claro:  #3a2c0a;
  --v2-vermelho-claro: #3a1a17;
  --v2-azul-claro:     #142a44;
  --v2-roxo-claro:     #241a3d;
}

/* --------- 2. Grid de painéis do Início (resolve o empilhamento) --------- */
/* Antes: h2 seguido de .cartoes e depois outro h2 seguido de outra .cartoes
   ficava tudo enfileirado verticalmente. Agora agrupa por seção. */
.v2-painel {
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--v2-radius);
  padding: var(--v2-pad);
  margin: 18px 0;
  box-shadow: var(--v2-sombra-suave);
}
.v2-painel-cab {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
  margin: 0 0 12px;
}
.v2-painel-titulo {
  margin: 0; font-size: 16px; font-weight: 650;
  display: inline-flex; align-items: center; gap: 8px;
}
.v2-painel-titulo .conta { margin-left: 0; }
.v2-painel-acoes { display: inline-flex; gap: 8px; align-items: center; }

/* --------- 3. Cartão de KPI destacado (números grandes por semântica) --------- */
.v2-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--v2-gap);
}
.v2-kpi {
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--v2-radius-sm);
  padding: 14px 16px;
  position: relative;
  transition: transform .12s ease, box-shadow .12s ease;
}
.v2-kpi:hover { transform: translateY(-1px); box-shadow: var(--v2-sombra-suave); }
.v2-kpi-rotulo {
  font-size: 11px; font-weight: 650; letter-spacing: .5px;
  text-transform: uppercase; color: var(--suave); margin-bottom: 6px;
}
.v2-kpi-numero {
  font-size: 28px; font-weight: 700; line-height: 1.05;
  color: var(--texto);
}
.v2-kpi-legenda {
  font-size: 12px; color: var(--suave); margin-top: 4px;
}
.v2-kpi-legenda a { color: inherit; }
.v2-kpi-legenda a:hover { color: var(--realce); }
.v2-kpi-cta { display: block; margin-top: 8px; font-size: 12px;
              color: var(--realce); text-decoration: none; font-weight: 600; }
.v2-kpi-cta:hover { text-decoration: underline; }

/* Variantes semânticas (usam a paleta já existente) */
.v2-kpi.v2-kpi-alerta   { background: var(--alerta-fundo); border-color: var(--alerta-borda); }
.v2-kpi.v2-kpi-erro     { background: var(--erro-fundo);   border-color: var(--erro-borda); }
.v2-kpi.v2-kpi-erro .v2-kpi-numero, .v2-kpi.v2-kpi-erro .v2-kpi-rotulo { color: var(--aberto); }
.v2-kpi.v2-kpi-ok       { background: var(--v2-verde-claro); border-color: var(--v2-verde); }
.v2-kpi.v2-kpi-ok .v2-kpi-numero, .v2-kpi.v2-kpi-ok .v2-kpi-rotulo { color: var(--v2-verde-escuro); }
.v2-kpi.v2-kpi-info     { background: var(--realce-claro); border-color: var(--realce); }
.v2-kpi.v2-kpi-info .v2-kpi-numero { color: var(--realce); }
.v2-kpi.v2-kpi-discreto { opacity: .78; }

/* --------- 4. Banner CTA proativo (ex.: sem honorário, prazos pendentes) --------- */
.v2-cta {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 16px; margin: 14px 0;
  border-radius: var(--v2-radius-sm);
  border: 1px solid var(--alerta-borda);
  background: var(--alerta-fundo);
  font-size: 14px;
}
.v2-cta-icone {
  width: 32px; height: 32px; border-radius: 50%;
  background: rgba(0,0,0,.06); display: inline-flex;
  align-items: center; justify-content: center; font-size: 16px; flex: none;
}
.v2-cta-texto { flex: 1; line-height: 1.4; }
.v2-cta-texto strong { display: block; margin-bottom: 2px; }
.v2-cta-acoes { display: inline-flex; gap: 8px; flex: none; }
.v2-cta .btn-primario { padding: 6px 14px; font-size: 13px; }
.v2-cta .btn-link { font-size: 13px; }

.v2-cta.v2-cta-info { border-color: var(--realce); background: var(--realce-claro); }

/* --------- 5. Sugestão de IA (para publicações — usa depois) --------- */
.v2-ia {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px; margin: 10px 0 4px;
  border-radius: var(--v2-radius-sm);
  background: var(--realce-claro);
  border: 1px dashed var(--realce);
  font-size: 13px;
}
.v2-ia-marca {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px; padding: 2px 7px; border-radius: 4px;
  background: var(--realce); color: #fff;
}
.v2-ia-texto { flex: 1; line-height: 1.4; color: var(--texto); }
.v2-ia-conf { font-size: 11px; color: var(--suave); font-weight: 600; }
.v2-ia .btn-primario { padding: 5px 12px; font-size: 12px; }

/* --------- 6. Header de processo enriquecido (usa depois em processo_detalhe.html) --------- */
.v2-cabecalho { margin: 0 0 18px; }
.v2-cabecalho-linha1 {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; margin-bottom: 8px;
}
.v2-cabecalho-titulo { margin: 0; font-size: 22px; font-weight: 650; line-height: 1.15; }
.v2-cabecalho-meta {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  font-size: 13px; color: var(--suave); margin: 4px 0 10px;
}
.v2-cabecalho-meta a { color: var(--realce); text-decoration: none; }
.v2-cabecalho-meta a:hover { text-decoration: underline; }
.v2-copiar {
  display: inline-flex; align-items: center; gap: 4px;
  background: transparent; border: 1px solid var(--borda);
  border-radius: 5px; padding: 2px 7px; font: inherit; font-size: 11px;
  cursor: pointer; color: var(--suave); vertical-align: middle;
}
.v2-copiar:hover { border-color: var(--realce); color: var(--realce); }
.v2-cabecalho-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.v2-cabecalho-acoes { display: inline-flex; gap: 6px; flex: none; }
.v2-cabecalho-acoes .btn-secundario,
.v2-cabecalho-acoes .btn-primario { padding: 7px 12px; font-size: 13px; }

/* --------- 7. Chip de status colorido (pill grande) --------- */
.v2-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 650; letter-spacing: .3px;
  text-transform: uppercase;
  border: 1px solid transparent;
}
.v2-chip-verde   { background: var(--v2-verde-claro); color: var(--v2-verde-escuro); border-color: rgba(31,157,85,.35); }
.v2-chip-amarelo { background: var(--v2-amarelo-claro); color: var(--v2-amarelo-escuro); border-color: rgba(240,180,41,.4); }
.v2-chip-vermelho{ background: var(--v2-vermelho-claro); color: var(--v2-vermelho-escuro); border-color: rgba(211,58,44,.35); }
.v2-chip-azul    { background: var(--v2-azul-claro); color: var(--v2-azul-escuro); border-color: rgba(31,78,121,.3); }
.v2-chip-roxo    { background: var(--v2-roxo-claro); color: var(--v2-roxo-escuro); border-color: rgba(124,58,237,.3); }
.v2-chip-neutro  { background: var(--realce-claro); color: var(--suave); border-color: var(--borda); }

/* --------- 8. Layout de 2 colunas para o detalhe do processo --------- */
.v2-grade-detalhe {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 18px;
  align-items: start;
}
.v2-grade-detalhe > .v2-lado { display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 900px) {
  .v2-grade-detalhe { grid-template-columns: 1fr; }
}

/* --------- 9. Widget lateral compacto (Honorários/Timesheet/Atendimentos) --------- */
.v2-widget {
  background: var(--papel);
  border: 1px solid var(--borda);
  border-radius: var(--v2-radius-sm);
  padding: 12px 14px;
}
.v2-widget-titulo {
  font-size: 11px; font-weight: 650; letter-spacing: .5px;
  text-transform: uppercase; color: var(--suave); margin-bottom: 8px;
}
.v2-widget-linha {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 13px; padding: 3px 0;
}
.v2-widget-linha.total {
  margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--borda);
  font-weight: 650;
}
.v2-widget-numero-grande { font-size: 22px; font-weight: 700; line-height: 1.1; }
.v2-widget-sub { font-size: 11px; color: var(--suave); margin-top: 4px; }

/* --------- 10. Última movimentação (destaque na listagem) --------- */
.v2-ultimas-movs { list-style: none; margin: 0; padding: 0; }
.v2-ultimas-movs li {
  padding: 6px 0; border-top: 1px dashed var(--borda);
  font-size: 13px; line-height: 1.45;
}
.v2-ultimas-movs li:first-child { border-top: 0; }
.v2-ultimas-movs .data {
  color: var(--suave); font-size: 12px; margin-right: 8px;
  font-variant-numeric: tabular-nums;
}

/* --------- 11. Melhorias em pastilhas de responsável (Lucas/Renata/Arthur) --------- */
/* Não sobrescreve nada — só agrega a variante v2- */
.v2-resp {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; font-weight: 650; padding: 2px 8px;
  border-radius: 999px;
  background: var(--realce-claro); color: var(--realce);
}
.v2-resp-arthur { background: #e0f2fe; color: #0369a1; }
.v2-resp-lucas  { background: #fef3c7; color: #92400e; }
.v2-resp-renata { background: #fce7f3; color: #9d174d; }
.v2-resp .inicial {
  display: inline-block; width: 16px; height: 16px; line-height: 16px;
  text-align: center; border-radius: 50%; background: currentColor;
  color: var(--papel); font-size: 9px; font-weight: 700;
}

/* --------- 12. Ajuste de espaçamento para o topo do Início --------- */
.v2-inicio-header {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 14px;
}
.v2-inicio-header h1 { margin: 0; }
.v2-inicio-header .rodape-nota { margin: 0; }

/* --------- 13. Tabela mais leve (variante v2 usada dentro de painel) --------- */
.v2-painel table {
  border: 0; border-radius: 0; background: transparent;
  font-size: 13.5px;
}
.v2-painel table th {
  background: transparent; border-bottom: 1px solid var(--borda);
  color: var(--suave);
}
.v2-painel table td { border-top: 1px solid var(--borda); }
.v2-painel table tbody tr:nth-child(even) { background: transparent; }
.v2-painel table tbody tr:hover { background: var(--realce-claro); }

/* --------- 14. Botão pill de responsável (topo dos painéis) --------- */
.v2-filtros-resp { display: inline-flex; gap: 6px; align-items: center;
                   font-size: 12px; color: var(--suave); }
.v2-filtros-resp .chip { padding: 3px 10px; font-size: 12px; }

/* 16.1 (21/09/2026) — andamentos novos do tribunal (Inicio e ficha do processo) */
.andamentos-novos .form-inline { display: inline; margin: 0; }
.andamentos-novos td { vertical-align: top; }
.andamentos-novos .and-importante { background: var(--alerta-fundo); }
.and-estrela { background: none; border: 0; cursor: pointer; font-size: 18px; line-height: 1;
  color: #b8b8b8; padding: 2px 4px; }
.and-estrela.ligada { color: #d99a00; }
.and-motivo { margin-left: 6px; font-size: 11px; }
.and-acoes { white-space: nowrap; text-align: right; }
.and-acoes .btn-link { margin-right: 8px; }
.and-rotina .form-inline { display: inline; }
.and-rotina .btn-link { background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; color: inherit; font: inherit; }

/* 16.2 (21/09/2026) — grupos na paleta Ctrl+K */
.paleta li.paleta-grupo { padding: 8px 12px 2px; font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; color: var(--suave); }
.paleta .paleta-sub { margin-left: auto; padding-left: 12px; font-size: 12px; color: var(--suave);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 55%; }
.and-motivo { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 11px;
  font-weight: 600; background: #fff1c2; color: #7a5200; border: 1px solid #e6c86a; }

/* 16.3 (21/09/2026) — contadores no menu e botao "+ Novo" no topo */
.lateral .link .contador { margin-left: auto; min-width: 20px; padding: 0 6px; border-radius: 999px;
  font-size: 11px; font-weight: 700; line-height: 18px; text-align: center;
  background: rgba(255,255,255,.16); color: #fff; }
.lateral .link .contador.contador-alerta { background: #d33a2c; }
.lateral .link .contador + .pastilha { margin-left: 6px; }
.mais-novo { position: relative; margin-left: 10px; }
.mais-novo > summary { list-style: none; cursor: pointer; padding: 6px 12px; border-radius: 8px;
  background: var(--v2-verde, #1f9d55); color: #fff; font-weight: 700; font-size: 13px; white-space: nowrap; }
.mais-novo > summary::-webkit-details-marker { display: none; }
.mais-novo-menu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 50; min-width: 230px;
  background: var(--papel); border: 1px solid var(--borda); border-radius: 10px; padding: 6px;
  box-shadow: 0 8px 24px rgba(15,42,74,.18); display: flex; flex-direction: column; }
.mais-novo-menu a { padding: 8px 10px; border-radius: 6px; text-decoration: none; color: inherit; }
.mais-novo-menu a:hover { background: var(--realce-claro); }
.busca-abre .busca-curto { display: none; }
@media (max-width: 600px) {
  .busca-abre .busca-longo, .busca-abre kbd { display: none; }
  .busca-abre .busca-curto { display: inline; }
  .mais-novo-menu { left: auto; right: 0; }
}

/* 16.4 (21/09/2026) — financeiro na ficha do processo */
.fin-proc { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 12px 0 18px; }
.fin-proc-item { border: 1px solid var(--borda); border-radius: var(--v2-radius-sm, 8px); padding: 10px 12px; background: var(--papel); }
.fin-proc-rotulo { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--suave); }
.fin-proc-valor { font-size: 15px; font-weight: 600; margin-top: 3px; }
.fin-proc-aviso { font-size: 13px; margin-top: 3px; color: #7a5200; }
.fin-proc-atraso { color: #d33a2c; font-size: 12px; font-weight: 600; }

/* 16.5 (21/09/2026) — reagendar em um clique */
.reagendar { margin-top: 4px; font-size: 12px; }
.reagendar .form-inline, .reagendar-opcoes .form-inline { display: inline; margin: 0; }
.reagendar .btn-link, .reagendar-opcoes .btn-link { background: none; border: 0; padding: 0 6px 0 0; cursor: pointer;
  color: var(--realce, #1d4f8a); text-decoration: underline; font: inherit; }
.reagendar-menu { display: inline-block; position: relative; margin-left: 4px; }
.reagendar-menu > summary { list-style: none; cursor: pointer; color: var(--suave); font-weight: 700; }
.reagendar-menu > summary::-webkit-details-marker { display: none; }
.reagendar-opcoes { position: absolute; z-index: 40; top: 100%; left: 0; background: var(--papel);
  border: 1px solid var(--borda); border-radius: 8px; padding: 6px 8px; white-space: nowrap;
  box-shadow: 0 6px 18px rgba(15,42,74,.16); font-family: inherit; }
/* a tabela da casa tem overflow:hidden (borda arredondada) e cortaria o menu — mesma licao do 13.7 */
table:has(.reagendar-menu[open]) { overflow: visible; }

/* 16.6 (21/09/2026) — produtividade na Carteira */
.ct-secao { margin-top: 26px; }
.ct-par { display: flex; gap: 24px; margin: 8px 0; }
.ct-par-n { font-size: 34px; font-weight: 800; line-height: 1.1; }
.ct-par-sem { color: var(--suave); }
.ct-sobe { color: #1f9d55; font-weight: 700; }
.ct-desce { color: #d33a2c; font-weight: 700; }

/* 16.7 (21/09/2026) — processos ligados */
.ligados { list-style: none; padding: 0; margin: 6px 0 10px; }
.ligados li { padding: 6px 0; border-bottom: 1px solid var(--borda); }
.ligados .form-inline { display: inline; }
.ligados .btn-link, .ligar-form .btn-link { background: none; border: 0; cursor: pointer; color: var(--realce, #1d4f8a); text-decoration: underline; font: inherit; padding: 0 4px; }
.ligar-form { margin: 6px 0 18px; }
.ligar-form > summary { list-style: none; cursor: pointer; display: inline-block; }
.ligar-form > summary::-webkit-details-marker { display: none; }
.ligar-form form { margin-top: 8px; flex-wrap: wrap; }

/* 16.8 (21/09/2026) — tratar publicacao lado a lado (so em tela larga) */
@media (min-width: 1100px) {
  .trat-lado-a-lado { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
  .trat-coluna-fonte { position: sticky; top: 12px; max-height: calc(100vh - 24px); overflow: auto; }
  .trat-coluna-fonte .trat-integral { max-height: none; }
  .trat-coluna-acoes .trat-grade { grid-template-columns: 1fr; }
}

/* 22/09/2026 — filtro de TRIBUNAL com varios marcados (caixas num painel). */
.combo-trib { position: relative; display: inline-block; }
.combo-trib > summary { list-style: none; cursor: pointer; min-width: 170px; max-width: 320px;
  padding: 7px 30px 7px 10px; border: 1px solid var(--borda); border-radius: 6px; background: var(--papel, #fff);
  font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; }
.combo-trib > summary::-webkit-details-marker { display: none; }
.combo-trib > summary::after { content: "▾"; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: var(--suave); }
.combo-trib-painel { position: absolute; z-index: 50; top: calc(100% + 4px); left: 0; width: 290px; max-height: 70vh; overflow-y: auto;
  background: var(--papel, #fff); border: 1px solid var(--borda); border-radius: 10px; padding: 8px 12px;
  box-shadow: 0 8px 22px rgba(15,42,74,.18); }
.combo-trib-topo { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.combo-trib-topo .btn-link { background: none; border: 0; padding: 0; cursor: pointer; color: var(--realce, #1d4f8a); text-decoration: underline; font-size: 12px; }
.combo-trib-grupo { border: 0; margin: 6px 0 0; padding: 0; }
.combo-trib-grupo legend { font-weight: 700; font-size: 12.5px; padding: 0; margin-bottom: 2px; }
.combo-trib-grupo label { display: flex; align-items: center; gap: 8px; padding: 3px 4px 3px 12px; font-size: 13.5px; cursor: pointer; border-radius: 5px; }
.combo-trib-grupo label:hover { background: var(--realce-claro, #eef3fb); }
.combo-trib-grupo label.combo-trib-todos { padding-left: 4px; font-style: italic; }
.combo-trib-rodape { position: sticky; bottom: -8px; background: var(--papel, #fff); padding: 8px 0 4px; text-align: right; }

/* 16.10 (21/09/2026) — etiquetas */
.etq { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px;
  color: #fff; font-size: 12px; font-weight: 600; border: 0; line-height: 18px; white-space: nowrap; }
button.etq { cursor: pointer; }
.etq .form-inline { display: inline; margin: 0; }
.etq-x { background: none; border: 0; color: rgba(255,255,255,.85); cursor: pointer; font-size: 14px; line-height: 1; padding: 0 0 0 2px; }
.etq-x:hover { color: #fff; }
.etq-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0 12px; }
.etq-mais { position: relative; }
.etq-mais > summary { list-style: none; cursor: pointer; font-size: 12px; color: var(--suave); border: 1px dashed var(--borda);
  border-radius: 999px; padding: 1px 9px; }
.etq-mais > summary::-webkit-details-marker { display: none; }
.etq-menu { position: absolute; z-index: 45; top: calc(100% + 4px); left: 0; min-width: 240px; max-width: 360px;
  display: flex; flex-wrap: wrap; gap: 6px; background: var(--papel); border: 1px solid var(--borda); border-radius: 10px;
  padding: 10px; box-shadow: 0 8px 22px rgba(15,42,74,.18); }
.etq-menu .form-inline { display: inline; margin: 0; }
/* 22/09 (Arthur: "esta cortado [...] de forma que eu veja todas as etiquetas e
   ainda possa cadastrar"). Duas causas: a tabela da casa tem overflow:hidden
   (borda arredondada) e cortava o menu aberto; e, na ultima coluna, o menu
   abria para a DIREITA, para fora da tela. Agora a tabela solta o menu, e
   numa celula de tabela o menu abre para a ESQUERDA, largo o bastante para
   as etiquetas quebrarem em linhas sem sumir. */
table:has(.etq-mais[open]) { overflow: visible; }
td .etq-menu { left: auto; right: 0; min-width: 300px; max-width: min(440px, 92vw); }
.etq-menu { max-height: 70vh; overflow-y: auto; }
.etq-gerenciar { flex-basis: 100%; font-size: 12px; margin-top: 4px; }
/* 22/09: criar etiqueta sem sair da ficha (dentro do menu "+ etiqueta"). */
.etq-nova { flex-basis: 100%; display: flex; align-items: center; gap: 6px; margin-top: 8px;
  padding-top: 8px; border-top: 1px dashed var(--borda); }
.etq-nova input[type=color] { width: 28px; height: 28px; padding: 0; border: 1px solid var(--borda);
  border-radius: 6px; background: none; cursor: pointer; flex: none; }
.etq-nova input[type=text] { flex: 1; min-width: 0; padding: 4px 8px; border: 1px solid var(--borda);
  border-radius: 6px; font-size: 13px; }
.etq-erro { color: #b91c1c; font-size: 12px; font-weight: 600; }
.etq-form { display: grid; gap: 10px; }
.etq-paleta { display: flex; flex-wrap: wrap; gap: 6px; }
.etq-cor { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.etq-cor input { accent-color: #fff; margin: 0; }
.etq-escopos { display: flex; flex-wrap: wrap; gap: 12px; }
.etq-inativa td { opacity: .55; }
.etq-acoes { white-space: nowrap; }
.etq-acoes .form-inline { display: inline; }
.etq-acoes .btn-link { background: none; border: 0; cursor: pointer; color: var(--realce, #1d4f8a); text-decoration: underline; font: inherit; }
.etq-mini { font-size: 10.5px; padding: 0 7px; line-height: 16px; margin-left: 4px; text-decoration: none; }
a.etq:hover { color: #fff; filter: brightness(1.1); }
.etq-filtro .etq { margin: 0 2px; }

/* 21/09 (Arthur: "44 importantes esta feio, marrom") — selo leve, ambar claro */
.and-selo-imp { display: inline-flex; align-items: center; gap: 5px; margin-left: 10px; padding: 3px 11px;
  border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: .01em; vertical-align: middle;
  background: #fff7e0; color: #9a6700; border: 1px solid #f3d27a; }
.and-selo-imp span { color: #e0a100; font-size: 13px; }
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) .and-selo-imp { background: #3a2f12; color: #f5cf6b; border-color: #6b5a20; }
}
:root[data-tema="escuro"] .and-selo-imp { background: #3a2f12; color: #f5cf6b; border-color: #6b5a20; }

/* 16.9 item 9 (21/09/2026) — leitura por regras na publicacao */
.triagem-regras { border-left: 3px dashed var(--borda); }
.pistas-texto { font-size: 13px; margin: 8px 0 0; }
.pistas-texto small { color: var(--suave); }

/* 16.13 (22/09/2026) — estado do escritorio (30 dias) no Inicio */
.v2-painel-mini { margin-top: 10px; }
.estat-linha { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; padding: 4px 0; }
.estat-item { display: block; padding: 12px 14px; border: 1px solid var(--borda); border-radius: 10px;
  background: var(--papel); color: inherit; text-decoration: none; transition: background .12s ease; }
.estat-item:hover { background: var(--realce-claro); text-decoration: none; }
.estat-n { font-size: 22px; font-weight: 700; line-height: 1.1; }
.estat-r { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--suave); margin-top: 3px; }
.estat-l { font-size: 11px; color: var(--suave); margin-top: 2px; }