/* SyrusAI Juris — design system com DOIS temas: Aurora (claro) + Vidro Escuro (noturno)
   Identidade: azul-royal/violeta (06/10/2026, escolha do Geone — o verde anterior fica em
   html[data-paleta="verde"], no fim deste arquivo); versalete nos rótulos; números SANS.
   O tema vem de html[data-tema]; tokens semânticos abaixo, valores por tema. */
:root {
  --radius: 16px;
  --font-ui: 'Segoe UI', system-ui, Calibri, sans-serif;
  --font-display: Georgia, 'Times New Roman', serif;
  /* acentos (iguais nos dois temas, salvo texto) — PALETA VIOLETA (06/10/2026); --vivo é o
     tom claro que acende sobre o preto da lateral (era o lima var(--vivo) da logo verde) */
  --acc: #2626C7;
  --acc-2: #3A3AD9;
  --vivo: #8E8EF6;
  --acc-glow: transparent;
  /* v6: sem vermelho e sem amarelo no painel — urgência é dita por TOM e PESO.
     Os tokens continuam existindo (código legado usa) apontando para tinta neutra. */
  --v4-red: #1A2026;
  --v4-amber: #4C555D;

  /* ===== MODO DIA — "grafite claro" v6.1 (26/07/2026, pedido do Geone) =====
     A v6 deixou os cards em BRANCO PURO e a tela virou refletor — sistema fica aberto o
     dia inteiro na frente do advogado, conforto ocular manda. Regra nova: NENHUMA
     superfície é #FFF. O chão desce mais um tom, o cartão grande fica um degrau acima
     do chão, os cards um degrau acima do cartão — profundidade por CAMADAS, não por brilho. */
  --tx: #1A2026;
  --tx-2: #46505A;
  --tx-3: #66717B;
  --acc-tx: #27279B;
  --acc-tx-2: #1D1D7C;
  --acc-soft: #B8B8E0;
  --acc-hair: #6E6ECF;
  --panel-a: #E8ECEF;
  --panel-b: #D8DEE3;
  --line: #8D9BA6;
  --line-2: #71818E;
  --topo-bg: #C4CED5;
  --field-bg: #CFD7DD;
  --field-bg-focus: #EDF1F4;
  --autofill: #E4E4F3;
  --mesh: transparent;
  --blur: none;                 /* v6: nada de vidro — superfícies sólidas */
  --ok-tx: #27279B;
  --ok-bg: #DEDEF3;
  --err-tx: #3A4148;
  --err-vivid: #3A4148;
  --err-bg: #D5DCE1;
  --badge-ring: #C4CED5;
  --shadow-1: 0 1px 2px rgba(15, 23, 30, .14), 0 3px 8px rgba(15, 23, 30, .10);
  --shadow-2: 0 2px 4px rgba(15, 23, 30, .16), 0 16px 32px -12px rgba(15, 23, 30, .32);
  --modal-a: #E8ECEF;
  --modal-b: #E8ECEF;
  --overlay: rgba(20, 26, 32, .44);
  --sino-bg: #E8ECEF;
  --toast-bg: #E8ECEF;
  --thead-bg: #D8DEE3;
  --zebra: #E1E6EA;
  --hover-acc: #D4D4EC;
  --scroll-thumb: #8794A0;
  /* camadas do metálico claro: chão < cartão grande < cards (nunca branco puro) */
  --met-fundo: #98A4AE;
  --met-hi: #D5DCE2;  --met-lo: #C8D1D8;
  --met-hi2: #EAEEF1; --met-lo2: #DAE1E6;
  --met-edge: rgba(255, 255, 255, .75);
}
/* ===== MODO NOITE — "metálico grafite" (aprovado 26/07/2026) =====
   Tudo OPACO: zero transparência, zero blur. O brilho vem do degradê sólido dentro da
   superfície mais o fio de luz na aresta de cima, como metal anodizado. */
html[data-tema="escuro"] {
  --tx: #F4F7FA;
  --tx-2: #C2CBD5;
  --tx-3: #96A1AD;
  --acc: #4B4BD2;
  --acc-2: #6868DF;
  --vivo: #8E8EF6;
  --acc-tx: #9A9AF4;
  --acc-tx-2: #B4B4F9;
  --acc-soft: #2D2D5D;
  --acc-hair: #5959CF;
  --v4-red: #F4F7FA;
  --v4-amber: #96A1AD;
  --panel-a: #1B232D;
  --panel-b: #212B36;
  --line: #333E4B;
  --line-2: #46525F;
  --topo-bg: #151C24;
  --field-bg: #161E27;
  --field-bg-focus: #1D2731;
  --autofill: #1D2731;
  --mesh: transparent;
  --ok-tx: #9A9AF4;
  --ok-bg: #22224A;
  --err-tx: #D3DAE2;
  --err-vivid: #D3DAE2;
  --err-bg: #222C37;
  --badge-ring: #151C24;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .5), 0 3px 10px rgba(0, 0, 0, .3);
  --shadow-2: 0 8px 26px rgba(0, 0, 0, .5), 0 2px 6px rgba(0, 0, 0, .4);
  --modal-a: #1B232D;
  --modal-b: #1B232D;
  --overlay: rgba(5, 9, 13, .66);
  --sino-bg: #1B232D;
  --toast-bg: #1B232D;
  --thead-bg: #1E2731;
  --zebra: #1D2630;
  --hover-acc: #1F2A20;
  --scroll-thumb: #46525F;
  --met-fundo: #0C1116;
  --met-hi: #252E39;  --met-lo: #1A222B;
  --met-hi2: #2A343F; --met-lo2: #1E2731;
  --met-edge: rgba(255, 255, 255, .085);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: var(--font-ui);
  font-size: 14px;
  color: var(--tx);
  min-height: 100vh;
  background: var(--met-fundo);   /* chão chapado: é o degrau até o card branco que dá a profundidade */
  -webkit-font-smoothing: antialiased;
}
html[data-tema="escuro"] body { background: var(--met-fundo); }
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background:
    repeating-linear-gradient(90deg, var(--mesh) 0 1px, transparent 1px 88px),
    repeating-linear-gradient(0deg, var(--mesh) 0 1px, transparent 1px 88px);
}
#view-login, #view-registro, #view-app, #ui-camada { position: relative; z-index: 1; }
button { font-family: inherit; cursor: pointer; }
a { color: var(--acc-tx); font-weight: 600; text-decoration: none; }
a:hover { color: var(--acc-tx-2); }
[hidden] { display: none !important; }
svg.i { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; display: block; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: var(--scroll-thumb); border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-track { background: transparent; }
:focus-visible { outline: 2px solid var(--acc-hair); outline-offset: 2px; }

/* Alternador de tema: lua no claro, sol no escuro */
html[data-tema="escuro"] .ico-lua { display: none; }
html:not([data-tema="escuro"]) .ico-sol { display: none; }
.tema-flutuante { position: absolute; top: 20px; right: 22px; z-index: 5; display: grid; place-items: center; padding: 8px 10px; }
.tema-flutuante svg.i { width: 17px; height: 17px; }

/* ===== Botões ===== */
.btn {
  border: none; border-radius: 11px; padding: 11px 20px;
  font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: #FFFFFF; transition: transform .18s ease, box-shadow .18s ease;
}
.btn.ouro {
  background: linear-gradient(160deg, #4545DC 0%, #2626C7 52%, #18189A 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 8px 22px rgba(38, 38, 199, .28);
}
.btn.ouro:hover { transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 12px 30px rgba(38, 38, 199, .4); }
.btn.vermelho { background: linear-gradient(160deg, #D0574A, #A23429); color: #FFF6F4; }
.btn.vermelho:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(192, 80, 67, .4); }
.btn.verde { background: linear-gradient(160deg, #3E9E63, #23713F); color: #F0FBF3; }
.btn-bloco { width: 100%; margin-top: 10px; }
.ghbtn {
  background: var(--panel-b); border: 1px solid var(--line-2); color: var(--tx-2);
  border-radius: 10px; padding: 8px 14px; font-size: 12.5px; font-weight: 600;
  transition: border-color .18s, color .18s, background .18s;
}
.ghbtn:hover { border-color: var(--acc-hair); color: var(--acc-tx); background: var(--hover-acc); }
.ghbtn.mini { padding: 5px 10px; font-size: 11.5px; }

/* ===== Formulários ===== */
.nf { margin-bottom: 14px; }
.nf label {
  display: block; font-size: 10px; color: var(--tx-3); font-weight: 700;
  text-transform: uppercase; letter-spacing: .2em; margin-bottom: 7px;
}
.nf input, .nf select, .nf textarea {
  width: 100%; padding: 10px 13px;
  border: 1px solid var(--line-2); border-radius: 11px;
  font-family: inherit; font-size: 14px;
  background: var(--field-bg); color: var(--tx);
  transition: border-color .18s, box-shadow .18s, background .18s;
}
.nf input::placeholder { color: var(--tx-3); }
html[data-tema="escuro"] .nf select option { background: #101C31; color: #EEF1F8; }
.nf input:focus, .nf select:focus, .nf textarea:focus {
  outline: none; border-color: var(--acc);
  box-shadow: 0 0 0 3px var(--acc-glow);
  background: var(--field-bg-focus);
}
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 60px var(--autofill) inset; -webkit-text-fill-color: var(--tx);
  caret-color: var(--tx); border-radius: 11px;
}
.senha-wrap { position: relative; }
.senha-wrap input { padding-right: 44px; }
.olho {
  position: absolute; right: 7px; top: 50%; transform: translateY(-50%);
  background: none; border: none; color: var(--tx); opacity: .45; padding: 6px;
}
.olho:hover { opacity: 1; }
.olho svg.i { width: 18px; height: 18px; }
/* medidor de senha forte (requisitos ao vivo) */
.senha-req { display: flex; flex-wrap: wrap; gap: 5px 10px; margin-top: 8px; }
.senha-req .req { font-size: 11.5px; color: var(--tx-3); white-space: nowrap; }
.senha-req .req-ok { color: var(--ok-tx); font-weight: 700; }
.erro-inline {
  background: var(--err-bg); color: var(--err-tx); border: 1px solid var(--err-vivid);
  border-radius: 11px; padding: 10px 13px; font-size: 13px; font-weight: 600; margin-bottom: 14px;
}
/* passo do código de verificação no cadastro */
.cod-dica { margin-top: 7px; font-size: 12.5px; color: var(--tx-2); line-height: 1.5; }
.cod-reenviar {
  background: none; border: none; padding: 0; color: var(--acc); font: inherit;
  font-weight: 700; cursor: pointer; text-decoration: underline;
}
.cod-reenviar:disabled { opacity: .45; cursor: default; text-decoration: none; }

/* ===== Autenticação ===== */
.tela-auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 28px; position: relative; }
.auth-card {
  position: relative;
  background: linear-gradient(180deg, var(--panel-a), var(--panel-b));
  border: 1px solid var(--line-2);
  border-radius: 20px;
  box-shadow: var(--shadow-2), inset 0 1px 0 rgba(255, 255, 255, .35);
  width: 100%; max-width: 412px; padding: 40px 38px 28px;
  backdrop-filter: var(--blur);
}
html[data-tema="escuro"] .auth-card { box-shadow: var(--shadow-2), inset 0 1px 0 rgba(255, 255, 255, .09); }
/* card mais largo p/ o portão do 2FA obrigatório (comporta os passos de ativação) */
.auth-card-larga { max-width: 560px; }
.auth-card::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: linear-gradient(90deg, transparent 6%, var(--acc-hair) 50%, transparent 94%);
  border-radius: 20px 20px 0 0;
}
.auth-brand { text-align: center; margin-bottom: 26px; }
/* ===== Logo oficial OnlixAI: lockup em imagem (arquivo enviado, sem alteração) ===== */
/* halo suave ATRÁS da logo — ::before MAIOR que a caixa; o degradê termina transparente antes
   do limite (dissolve no fundo, sem corte quadrado); a logo fica intacta na camada de cima */
.ox-lockup { display: block; position: relative; background-repeat: no-repeat; background-position: center; background-size: contain; aspect-ratio: 1200 / 1100; }
html[data-tema="claro"] .ox-lockup { background-image: url("/img/logo-lockup-claro-azul.png"); }
html[data-tema="escuro"] .ox-lockup { background-image: url("/img/logo-lockup-escuro-azul.png"); }
.ox-lockup::before { content: ""; position: absolute; inset: -34% -38%; z-index: -1; pointer-events: none; }
html[data-tema="claro"] .ox-lockup::before { background: radial-gradient(ellipse closest-side at 50% 47%, rgba(230,184,92,.24), rgba(78,162,40,.10) 46%, transparent 73%); }
html[data-tema="escuro"] .ox-lockup::before { background: radial-gradient(ellipse closest-side at 50% 47%, rgba(230,184,92,.17), rgba(111,190,42,.08) 46%, transparent 73%); }
.ox-lockup-auth { width: 184px; margin: 0 auto 8px; }
.ox-lockup-vitrine { width: 248px; margin: 0 auto 10px; }
/* ===== Segurança / 2FA ===== */
.seg-wrap { max-width: 640px; }
.seg-titulo { font-size: 22px; margin: 0 0 4px; letter-spacing: -.01em; }
.seg-sub { color: var(--tx-2); margin: 0 0 20px; font-size: 14px; line-height: 1.6; }
.seg-card { background: var(--panel-a); border: 1px solid var(--line); border-radius: 14px; padding: 22px; }
.seg-card p { color: var(--tx-2); font-size: 14px; line-height: 1.6; }
.seg-status { display: flex; align-items: center; gap: 9px; font-size: 15px; margin-bottom: 6px; color: var(--tx); }
.seg-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.seg-status.ok .seg-dot { background: #35c46a; box-shadow: 0 0 0 3px rgba(53,196,106,.18); }
.seg-status.off .seg-dot { background: #e6b85c; }
.seg-h3 { font-size: 15px; margin: 20px 0 6px; color: var(--tx); }
.seg-dica { color: var(--tx-2); font-size: 13px; margin: 0 0 10px; }
/* QR CENTRALIZADO na tela (pedido do Geone 31/07): o inline-block encostava o código à
   esquerda do card. O wrapper vira bloco centralizado e o quadro branco fica com largura
   do conteúdo — vale no enroll da tela Segurança e no portão do 2FA do convite. */
.seg-qr { display: block; width: max-content; max-width: 100%; margin: 14px auto; background: #fff; padding: 10px; border-radius: 10px; border: 1px solid var(--line); }
.seg-qr canvas { display: block; margin: 0 auto; max-width: 100%; height: auto; image-rendering: pixelated; }
.seg-manual { margin: 12px 0; font-size: 13px; }
.seg-manual summary { cursor: pointer; color: var(--acc-tx); }
.seg-chave { display: inline-block; margin-top: 8px; font-family: ui-monospace, Consolas, monospace; letter-spacing: .1em; background: rgba(127,127,127,.12); padding: 8px 12px; border-radius: 8px; user-select: all; word-break: break-all; }
.seg-form { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 8px; }
.seg-form input { flex: 1; min-width: 160px; padding: 11px 14px; border-radius: 10px; border: 1px solid var(--line); background: var(--panel-b); color: var(--tx); font-size: 16px; }
.seg-form input:focus-visible { outline: 2px solid var(--acc-tx); outline-offset: 1px; }
.seg-recup { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 12px 0 16px; }
.seg-recup code { font-family: ui-monospace, Consolas, monospace; background: rgba(127,127,127,.10); border: 1px solid var(--line); border-radius: 8px; padding: 9px 12px; text-align: center; letter-spacing: .06em; color: var(--tx); }
.btn.perigo { background: #c24534; color: #fff; border-color: transparent; }
.seg-kv { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 8px 0; font-size: 14px; color: var(--tx); }
.seg-kv > span:first-child { color: var(--tx-2); min-width: 118px; font-size: 13px; }
.seg-nota { background: rgba(230,184,92,.12); border: 1px solid rgba(230,184,92,.34); border-radius: 10px; padding: 10px 12px; font-size: 13px; line-height: 1.55; color: var(--tx); margin: 14px 0; }
/* o lockup/globo já é a marca; o nome em texto fica só para leitor de tela (nunca em fonte do site) */
#login-brand, #vitrine-nome, #brand-nome { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.auth-brand h1 {
  font-size: 21px; font-weight: 600; color: var(--tx);
  letter-spacing: .32em; text-transform: uppercase; text-indent: .32em;
}
.auth-sub {
  margin-top: 9px; color: var(--acc-tx); font-size: 9.5px; font-weight: 600;
  letter-spacing: .27em; text-transform: uppercase;
}
.auth-troca { text-align: center; margin-top: 22px; color: var(--tx-3); font-size: 13px; }

/* convite de equipe */
.conv-boas-vindas { background: var(--panel-a); border-radius: 10px; padding: 16px 18px; margin-bottom: 20px; }
.conv-boas-vindas p { margin: 0 0 6px; font-size: 14px; color: var(--tx-2); }
.conv-boas-vindas p:last-child { margin-bottom: 0; }
.conv-boas-vindas .conv-dica { margin-top: 10px; color: var(--tx-3); font-size: 13px; }
/* wizard do convite em etapas (31/07): e-mail → código → dados/senha → 2FA */
.conv-dica { color: var(--tx-3); font-size: 12.5px; line-height: 1.5; margin: 10px 0 0; }
.conv-linha-acoes { display: flex; justify-content: center; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.conv-expirado-msg { text-align: center; color: var(--tx-2); font-size: 14px; line-height: 1.6; padding: 20px 0; }

/* ===== Shell ===== */
.topo {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 13px 26px;
  background: var(--topo-bg);
  backdrop-filter: var(--blur);
  border-bottom: 1px solid var(--acc-soft);
  box-shadow: var(--shadow-1);
}
#topo-brand-nome { font-size: 14.5px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--tx); }
.topo-escritorio {
  font-size: 10px; font-weight: 600; color: var(--acc-tx); letter-spacing: .15em; text-transform: uppercase;
  border: 1px solid var(--acc-soft); border-radius: 999px; padding: 4px 12px; margin-left: 10px;
  background: rgba(132, 217, 58, .08);
}
.topo-user { font-size: 13px; color: var(--tx-2); }
.topo-btn {
  background: var(--panel-b); border: 1px solid var(--line-2); color: var(--tx-2);
  border-radius: 10px; padding: 7px 10px; position: relative; display: grid; place-items: center;
  transition: border-color .18s, color .18s, background .18s;
}
.topo-btn:hover { border-color: var(--acc-hair); color: var(--acc-tx); background: var(--hover-acc); }
.topo-btn svg.i { width: 18px; height: 18px; }
.topo-btn.sair {
  font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--err-tx); border-color: var(--err-vivid); padding: 8px 14px;
}
.topo-btn.sair:hover { background: var(--err-bg); color: var(--err-tx); border-color: var(--err-vivid); }
.badge {
  position: absolute; top: -6px; right: -6px; background: var(--err-vivid); color: #fff;
  font-size: 10px; font-weight: 700; border-radius: 9px; padding: 1px 5px; min-width: 17px;
  border: 2px solid var(--badge-ring);
}

/* ===== Sino ===== */
.sino-box {
  position: fixed; top: 66px; right: 24px; width: 352px; max-height: 62vh;
  background: var(--sino-bg); backdrop-filter: var(--blur);
  border: 1px solid var(--line-2); border-radius: var(--radius);
  box-shadow: var(--shadow-2);
  z-index: 1100; display: flex; flex-direction: column; overflow: hidden;
}
.sino-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid var(--line);
}
.sino-head strong { font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--tx-2); font-weight: 700; }
.sino-lista { overflow-y: auto; }
.sino-item { padding: 11px 16px; border-bottom: 1px solid var(--line); cursor: pointer; }
.sino-item:hover { background: var(--hover-acc); }
.sino-item.nao-lida { border-left: 2px solid var(--acc-2); background: var(--hover-acc); }
.sino-item .de { font-size: 12px; font-weight: 700; color: var(--acc-tx); }
.sino-item .msg { font-size: 13px; color: var(--tx-2); margin-top: 2px; }
.sino-item .quando { font-size: 11px; color: var(--tx-3); margin-top: 4px; }
.sino-vazio { padding: 28px; text-align: center; color: var(--tx-3); font-size: 13px; }

/* ===== Conteúdo ===== */
/* full-width fluido (igual à landing): o conteúdo ocupa a tela e adapta ao monitor */
.conteudo { max-width: none; margin: 0; padding: 20px clamp(14px, 1.7vw, 28px) 32px; }
/* banner "modo visualização" (master vendo um escritório em só-leitura) */
#imp-banner { position: fixed; top: 0; left: 0; right: 0; z-index: 1200; display: flex; align-items: center;
  justify-content: center; gap: 16px; flex-wrap: wrap; padding: 8px 16px; font-size: 13px; font-weight: 600;
  color: #101033; background: linear-gradient(160deg, #F2C94C, #E6B84C); box-shadow: 0 2px 10px rgba(0,0,0,.18); }
#imp-banner b { font-weight: 800; }
#imp-banner button { border: none; background: #101033; color: #fff; border-radius: 8px; padding: 6px 13px;
  font-size: 12px; font-weight: 700; cursor: pointer; }
#imp-banner button:hover { filter: brightness(1.15); }
body.tem-imp { padding-top: 38px; } /* empurra o app para o banner não cobrir o topo */
.secao-titulo {
  display: flex; align-items: center; gap: 10px;
  font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .24em;
  color: var(--tx-3); margin: 36px 0 14px;
}
.secao-titulo::before { content: ''; width: 24px; height: 1px; background: linear-gradient(90deg, var(--acc-2), transparent); }
.volta { margin-bottom: 18px; }

/* Indicadores */
.indicadores { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
.card {
  position: relative;
  background: linear-gradient(180deg, var(--panel-a), var(--panel-b));
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-1);
  padding: 18px 20px 16px; overflow: hidden;
}
.card::after {
  content: ''; position: absolute; left: 20px; bottom: 14px; width: 28px; height: 2px;
  background: linear-gradient(90deg, var(--acc-2), transparent);
}
.card .lbl { font-size: 9.5px; color: var(--tx-3); text-transform: uppercase; letter-spacing: .22em; font-weight: 700; }
.card .num {
  font-family: var(--font-display); font-size: 34px; font-weight: 400;
  color: var(--tx); line-height: 1.25; margin-top: 3px;
}

.ic-badge {
  width: 47px; height: 47px; border-radius: 50%;
  display: grid; place-items: center; color: var(--acc-tx);
  background: radial-gradient(circle at 50% 28%, rgba(132, 217, 58, .17), rgba(132, 217, 58, .04));
  border: 1px solid var(--acc-soft);
  transition: color .2s, border-color .2s, box-shadow .2s;
}

/* Tabelas */
.tablewrap {
  background: linear-gradient(180deg, var(--panel-a), var(--panel-b));
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-1);
  overflow: hidden;
}
.tbar { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; gap: 10px; flex-wrap: wrap; }
.tbar h2 { font-size: 16px; font-weight: 600; color: var(--tx); letter-spacing: .02em; }
.scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
thead th {
  background: var(--thead-bg); color: var(--tx-2); text-align: left; padding: 10px 14px;
  font-size: 10px; text-transform: uppercase; letter-spacing: .18em; font-weight: 700;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); white-space: nowrap;
}
tbody td { padding: 10px 14px; border-bottom: 1px solid var(--line); color: var(--tx-2); }
tbody td strong { color: var(--tx); }
tbody tr:nth-child(even) td { background: var(--zebra); }
tbody tr:hover td { background: var(--hover-acc); }
.pill {
  display: inline-block; border-radius: 999px; padding: 3px 10px;
  font-size: 10px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  background: rgba(132, 217, 58, .14); color: var(--acc-tx); border: 1px solid var(--acc-soft);
}
.pill.cinza { background: var(--panel-b); color: var(--tx-2); border-color: var(--line-2); }
.pill.verde { background: var(--ok-bg); color: var(--ok-tx); border-color: var(--ok-tx); }
.pill.vermelho { background: var(--err-bg); color: var(--err-tx); border-color: var(--err-vivid); }
.pill.ambar { background: rgba(201, 147, 47, .14); color: #A17B22; border-color: #C9932F; }
html[data-tema="escuro"] .pill.ambar, html.escuro .pill.ambar { color: #E2B44E; }

/* Placeholder de área em construção */
.construcao {
  background: linear-gradient(180deg, var(--panel-a), var(--panel-b));
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-1);
  padding: 66px 30px; text-align: center;
}
.construcao .ic-badge { width: 60px; height: 60px; margin: 0 auto 18px; }
.construcao .ic-badge svg.i { width: 27px; height: 27px; }
.construcao h2 { font-family: var(--font-display); font-weight: 400; font-size: 25px; color: var(--tx); margin-bottom: 8px; }
.construcao p { color: var(--tx-2); font-size: 13.5px; }

/* ===== Kit UI (toast, confirm, modal — vidro pleno) ===== */
.uiToastWrap {
  position: fixed; bottom: 26px; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px; z-index: 2000;
}
.uiToast {
  background: var(--toast-bg); color: var(--tx);
  backdrop-filter: var(--blur);
  border: 1px solid var(--line-2); border-left: 3px solid var(--acc-2);
  border-radius: 12px; padding: 11px 18px; font-size: 13px; font-weight: 600;
  box-shadow: var(--shadow-2); max-width: 90vw;
  animation: toastIn .4s cubic-bezier(.2, .8, .3, 1);
}
.uiToast.ok { border-left-color: #58BF82; }
.uiToast.err { border-left-color: var(--err-vivid); }
@keyframes toastIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.uiOverlay {
  position: fixed; inset: 0;
  background: var(--overlay);
  backdrop-filter: blur(8px); z-index: 1500;
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.uiModal {
  background: linear-gradient(180deg, var(--modal-a), var(--modal-b));
  backdrop-filter: saturate(170%) blur(26px);
  border: 1px solid var(--line-2);
  border-radius: 20px; max-width: 560px; width: 100%;
  box-shadow: var(--shadow-2), 0 0 46px var(--acc-glow);
  overflow: hidden;
  animation: modalIn .32s cubic-bezier(.2, .8, .3, 1); max-height: 90vh; display: flex; flex-direction: column;
  position: relative;
}
.uiModal::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px; z-index: 1;
  background: linear-gradient(90deg, transparent 6%, var(--acc-hair) 50%, transparent 94%);
}
.uiModal::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(118deg, rgba(255, 255, 255, .10) 0%, rgba(255, 255, 255, .03) 16%, transparent 38%);
}
@keyframes modalIn { from { opacity: 0; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: none; } }
.uiModal-h {
  display: flex; align-items: center; justify-content: space-between; padding: 15px 22px;
  border-bottom: 1px solid var(--line);
}
.uiModal-h h3 { font-size: 12.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--acc-tx); }
.uiModal-x { background: none; border: none; color: var(--tx-3); font-size: 20px; line-height: 1; }
.uiModal-x:hover { color: var(--tx); }
.uiModal-b { padding: 20px 22px; overflow-y: auto; color: var(--tx-2); }
.uiModal-f {
  display: flex; justify-content: flex-end; gap: 10px; padding: 14px 22px;
  border-top: 1px solid var(--line);
}

/* Checkboxes de áreas */
.areas-check { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.areas-check label {
  display: flex; align-items: center; justify-content: flex-start; gap: 9px;
  font-size: 13px; font-weight: 500; color: var(--tx);
  text-transform: none; letter-spacing: 0; margin-bottom: 0;
  border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; cursor: pointer;
  background: var(--field-bg);
  transition: border-color .15s, background .15s;
}
.areas-check label:hover { border-color: var(--acc-soft); background: var(--hover-acc); }
.areas-check input { accent-color: var(--acc); width: 15px; height: 15px; padding: 0; flex: 0 0 auto; }

@media (max-width: 640px) {
  .topo { padding: 11px 14px; }
  .topo-escritorio, .topo-user { display: none; }
  .conteudo { padding: 16px 12px 30px; }
  .areas-check { grid-template-columns: 1fr; }
  .auth-card { padding: 32px 24px 22px; }
}

/* ============================================================
   SHELL COM SIDEBAR (SyrusAI)
   ============================================================ */
.shell { display: block; min-height: 100vh; }

.plano-chip {
  font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--acc-tx); border: 1px solid var(--acc-soft); border-radius: 999px; padding: 3px 11px;
  background: rgba(132, 217, 58, .08);
}

/* ============================================================
   PÁGINA (título) + BENTO
   ============================================================ */
/* título só para leitor de tela: a tela dispensa o cabeçalho (o menu já diz onde estamos),
   mas a página não pode ficar sem h1 para quem navega por audiodescrição */
.so-leitor { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pagina-topo { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 6px; }
.pagina-titulo { font-size: 23px; font-weight: 600; color: var(--tx); letter-spacing: .01em; }
.pagina-sub { color: var(--tx-3); font-size: 13px; margin-top: 3px; }
.vazio-inline { color: var(--tx-3); font-size: 13.5px; padding: 8px 2px; }

/* cockpit da área (renderArea): KPIs + prazos + processos da matéria */
.pt-titulo { display: flex; align-items: center; gap: 13px; min-width: 0; }
.ic-badge.sm { width: 42px; height: 42px; margin: 0; flex: none; }
.ic-badge.sm svg.i { width: 21px; height: 21px; }
.ar-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 20px; align-items: start; }
.ar-col { min-width: 0; }
.ar-prazos { display: flex; flex-direction: column; gap: 8px; }
.ar-prazo { display: grid; grid-template-columns: 84px minmax(0, 1fr) 118px; gap: 10px; align-items: center; padding: 11px 13px; background: var(--panel-a); border: 1px solid var(--line); border-radius: 10px; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.ar-prazo:hover { border-color: var(--acc); box-shadow: 0 3px 10px color-mix(in srgb, var(--acc) 7%, transparent); }
.ar-prazo:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
.ar-prazo-pz { font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.ar-prazo-prov { font-size: 12.5px; font-weight: 700; color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ar-prazo-proc { font-size: 11px; color: var(--tx-3); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ar-procs { display: flex; flex-direction: column; gap: 10px; }
.ar-vazio { padding: 22px 16px; text-align: center; color: var(--tx-3); font-size: 13px; background: var(--panel-a); border: 1px dashed var(--line-2); border-radius: 10px; line-height: 1.55; }
.ar-vermais { display: block; width: 100%; text-align: left; padding: 10px 4px; border: none; background: none; font-size: 12px; font-weight: 700; color: var(--acc-tx); cursor: pointer; }
.ar-vermais:hover { text-decoration: underline; }
@media (max-width: 820px) { .ar-cols { grid-template-columns: 1fr; } }

.tile {
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, var(--panel-a), var(--panel-b));
  border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1);
  padding: 18px 20px;
}
.tile-lbl { display: block; font-size: 9.5px; color: var(--tx-3); text-transform: uppercase; letter-spacing: .2em; font-weight: 700; }
.tile-num .tile-lbl { padding-right: 26px; }
.tile-num { display: flex; flex-direction: column; gap: 7px; }
.tile-num .tile-ic { position: absolute; right: 15px; top: 15px; color: var(--acc-tx); opacity: .5; }
.tile-num .tile-ic svg.i { width: 20px; height: 20px; }
.tile-val { font-size: 30px; font-weight: 700; color: var(--tx); line-height: 1; font-variant-numeric: tabular-nums; }
.tile::after { content: ''; position: absolute; left: 20px; bottom: 12px; width: 26px; height: 2px; background: linear-gradient(90deg, var(--acc-2), transparent); }


/* ============================================================
   RADAR DE PRAZOS
   ============================================================ */
.radar-busca { margin-top: 16px; margin-bottom: 4px; }
/* RADAR = busca de processos (Escavador) — mesma paleta da casa */
.rd-busca { padding: 16px 18px; }
.rd-tipos { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.rd-tipo { min-width: 64px; text-align: center; }
.rd-form { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
.rd-form .nf { margin-bottom: 0; }
.rd-in { flex: 1 1 260px; min-width: 200px; }
.rd-uf { flex: 0 0 90px; }
.rd-buscar { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.rd-buscar svg.i { width: 16px; height: 16px; }
.rd-resultados { margin-top: 16px; }
.rd-carregando { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 44px 20px; color: var(--tx-2); font-size: 14px; font-weight: 600; }
.rd-spin { width: 20px; height: 20px; border-radius: 50%; border: 3px solid var(--line-2); border-top-color: var(--acc); animation: rdspin .8s linear infinite; flex: none; }
@keyframes rdspin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .rd-spin { animation: none; } }
.rd-emconstr { margin-top: 0; }
/* OAB no cadastro (número + UF lado a lado) */
.oab-wrap { display: grid; grid-template-columns: 1fr .5fr; gap: 8px; }
.nf-op { font-weight: 400; color: var(--tx-3); font-size: 11.5px; }

.radar-filtros { display: flex; gap: 8px; margin: 20px 0 12px; flex-wrap: wrap; }
.chip {
  border: 1px solid var(--line-2); background: var(--panel-b); color: var(--tx-2);
  border-radius: 999px; padding: 6px 15px; font-size: 12px; font-weight: 600;
  transition: background .15s, color .15s, border-color .15s;
}
.chip:hover { border-color: var(--acc-hair); color: var(--acc-tx); }
.chip.ativo { background: linear-gradient(160deg, var(--acc-2), var(--acc)); color: #FFFFFF; border-color: transparent; }

.pub-lista { display: flex; flex-direction: column; gap: 12px; }
.pub-card {
  background: linear-gradient(180deg, var(--panel-a), var(--panel-b));
  border: 1px solid var(--line); border-left: 3px solid var(--line-2);
  border-radius: var(--radius); box-shadow: var(--shadow-1); padding: 16px 18px;
  transition: box-shadow .18s;
}
.pub-card:hover { box-shadow: var(--shadow-2); }
.pub-card.prio-alta { border-left-color: var(--err-vivid); }
.pub-card.prio-media { border-left-color: var(--acc-2); }
.pub-card.prio-baixa { border-left-color: var(--tx-3); }
.pub-card.tratada { opacity: .6; }
.pub-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 9px; }
.prazo-badge { font-size: 12px; font-weight: 700; border-radius: 9px; padding: 4px 11px; letter-spacing: .01em; white-space: nowrap; }
.prazo-badge.prio-alta { background: var(--err-bg); color: var(--err-tx); border: 1px solid var(--err-vivid); }
.prazo-badge.prio-media { background: rgba(132, 217, 58, .14); color: var(--acc-tx); border: 1px solid var(--acc-soft); }
.prazo-badge.prio-baixa, .prazo-badge.sem { background: var(--panel-b); color: var(--tx-3); border: 1px solid var(--line-2); }
.pub-tipo { font-weight: 600; color: var(--tx); font-size: 14px; }
.conf { margin-left: auto; font-size: 9px; text-transform: uppercase; letter-spacing: .12em; font-weight: 700; padding: 3px 9px; border-radius: 999px; }
.conf-alta { color: var(--ok-tx); background: var(--ok-bg); border: 1px solid var(--ok-tx); }
.conf-media { color: var(--tx-2); background: var(--panel-b); border: 1px solid var(--line-2); }
.conf-baixa { color: var(--err-tx); background: var(--err-bg); border: 1px solid var(--err-vivid); }
.pub-proc { font-size: 13px; color: var(--tx-2); margin-bottom: 6px; }
.pub-proc strong { color: var(--tx); font-variant-numeric: tabular-nums; letter-spacing: .01em; }
.pub-org { color: var(--tx-3); font-size: 12px; }
.pub-peca { font-size: 13px; color: var(--tx-2); margin-bottom: 8px; }
.pub-peca strong { color: var(--tx); }
.pub-base { color: var(--acc-tx); font-size: 12px; }
.pub-teor { font-size: 12.5px; color: var(--tx-2); line-height: 1.55; margin-bottom: 11px; }
.pub-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.pub-fatal { margin-top: 9px; font-size: 12px; color: var(--err-tx); font-weight: 600; }

.det { display: flex; flex-direction: column; gap: 0; }
.det-linha { display: flex; justify-content: space-between; gap: 14px; font-size: 13px; border-bottom: 1px solid var(--line); padding: 7px 0; }
.det-linha span { color: var(--tx-3); flex: 0 0 auto; }
.det-linha strong { color: var(--tx); text-align: right; }
.teor-box { background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 11px; padding: 12px 14px; font-size: 13px; color: var(--tx-2); line-height: 1.55; max-height: 260px; overflow: auto; white-space: pre-wrap; }

/* ============================================================
   VITRINE DO ECOSSISTEMA (pública)
   ============================================================ */
.tela-vitrine { min-height: 100vh; padding: 46px 24px 60px; display: flex; align-items: flex-start; justify-content: center; }
.vitrine-wrap { width: 100%; max-width: 1000px; }
.vitrine-hero { text-align: center; margin-bottom: 34px; }
.vitrine-hero h1 { font-size: 34px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--tx); margin-top: 16px; }
.vitrine-tag { color: var(--acc-tx); font-size: 11px; letter-spacing: .28em; text-transform: uppercase; margin-top: 9px; font-weight: 600; }
.vitrine-lead { color: var(--tx-2); font-size: 15px; margin-top: 15px; max-width: 560px; margin-inline: auto; line-height: 1.6; }
.vitrine-blocos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.bloco-card {
  background: linear-gradient(180deg, var(--panel-a), var(--panel-b));
  border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1);
  padding: 22px; display: flex; flex-direction: column; gap: 12px;
}
.bloco-card.ativo { border-color: var(--acc-hair); box-shadow: var(--shadow-1), 0 0 26px var(--acc-glow); }
.bloco-card.breve { opacity: .82; }
.bloco-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.bloco-nome { font-size: 15.5px; color: var(--tx-2); letter-spacing: .04em; }
.bloco-nome b { color: var(--tx); }
.bloco-status { font-size: 9.5px; text-transform: uppercase; letter-spacing: .12em; font-weight: 700; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.bloco-card.ativo .bloco-status { background: var(--ok-bg); color: var(--ok-tx); border: 1px solid var(--ok-tx); }
.bloco-card.breve .bloco-status { background: var(--panel-b); color: var(--tx-3); border: 1px solid var(--line-2); }
.bloco-desc { font-size: 13px; color: var(--tx-2); line-height: 1.55; flex: 1; }
.bloco-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.vitrine-acoes { display: flex; gap: 12px; justify-content: center; margin-top: 32px; flex-wrap: wrap; }
.auth-vitrine { text-align: center; margin-top: 10px; font-size: 12.5px; }

/* ============================================================
   RESPONSIVO
   ============================================================ */
/* ============================================================
   BLOCO 2 — abas por área, filtro OAB, chips de área, drawer do processo
   ============================================================ */
.radar-abas { display: flex; gap: 8px; flex-wrap: wrap; margin: 4px 0 12px; }
.radar-oabs { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 14px; }
.radar-oabs-lbl { font-size: 10.5px; color: var(--tx-3); font-weight: 700; text-transform: uppercase; letter-spacing: .16em; }
.chip.aba b, .chip.mini b { font-weight: 700; opacity: .7; margin-left: 3px; }
.chip.mini { padding: 4px 11px; font-size: 11px; }

.area-chip {
  display: inline-flex; align-items: center; font-size: 9.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em; padding: 3px 9px; border-radius: 999px; border: 1px solid;
}
/* v6: o chip da área deixou de ter cor própria. Doze cores diferentes numa lista de
   processos viram confete — e vermelho/amarelo saíram do painel por decisão do Geone.
   A área é dita por texto; a cor fica reservada para o que exige ação. */
.area-chip { color: var(--tx-2); background: var(--panel-b); border-color: var(--line-2); }


/* ===== PROCESSOS — layout tabela (indicadores + Agenda da Semana, barra, tabela, paginação) ===== */
.proc-integrar { display: inline-flex; align-items: center; gap: 8px; }
.proc-integrar svg.i { width: 15px; height: 15px; }
/* Topo de Processos (redesenho 18/08/2026): Agenda (mês+dia juntos) | Publicações do dia */
/* GRADE DE HORAS dentro da caixa da Agenda em Processos (25/08). Reusa as classes .agh-*
   da Agenda completa; o que muda e o numero de colunas (7 na Semanal, 1 na vista Dia,
   via --agh-cols) e a escala, porque a caixa e bem menor que a tela cheia. */
.agh.ag2-agh { border: 0; border-radius: 0; background: none; box-shadow: none;
  height: 100%; min-height: 0; min-width: 0; grid-column: auto; }
/* sem a caixinha do dia ao lado (25/08), a grade da semana ocupa a caixa inteira */
.agh.ag2-agh-cheia { grid-column: 1 / -1; }
/* dia ESCOLHIDO na grade de horas — vale na Agenda completa E na caixa de Processos:
   a coluna se destaca e o cabecalho ganha o fio de acento, para ficar obvio de qual dia
   a lateral esta falando */
.agh-dcab[data-dia] { cursor: pointer; }
.agh-dcab[data-dia]:hover { background: var(--hover-acc); }
.agh-dcab.sel { box-shadow: inset 0 3px 0 var(--acc-2); color: var(--tx); }
.agh-dcab.sel b { color: var(--acc-tx); }
.agh-cel.sel, .agh-shcol.sel { background: var(--acc-soft); }
.agh-cel.sel.fora { background: var(--acc-soft); filter: brightness(.97); }
.agh-dcab[data-dia]:focus-visible { outline: 2px solid var(--acc); outline-offset: -2px; }
.ag2-agh .agh-cab, .ag2-agh .agh-sh, .ag2-agh .agh-grade {
  grid-template-columns: 42px repeat(var(--agh-cols, 7), minmax(0, 1fr)); }
.ag2-agh .agh-grade { grid-auto-rows: minmax(38px, auto); }
.ag2-agh .agh-dcab { padding: 5px 2px 6px; font-size: 9.5px; }
.ag2-agh .agh-dcab b { font-size: 13px; }
.ag2-agh .agh-hora { font-size: 9.5px; padding-right: 5px; }
.ag2-agh .agh-cel .agn-sev, .ag2-agh .agh-shcol .agn-sev { padding: 2px 4px 2px 7px; font-size: 10px; }
.ag2-agh .agh-cel .agn-sev b, .ag2-agh .agh-shcol .agn-sev b { font-size: 9px; }
.ag2-agh .agh-sh { grid-auto-rows: minmax(22px, 60px); }
/* o seletor de vista fica no INICIO, junto do titulo — mesma disposicao da aba Agenda,
   onde as vistas ficam a esquerda e o "< periodo >" a direita */
.pnl-esq { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ag2-vistas .agx-esc-bt { padding: 3px 9px; font-size: 11px; }
/* na vista Dia a coluna unica ganha a largura toda e a pilula pode respirar */
.ag2-agh[style*="--agh-cols:1"] .agh-cel .agn-sev { font-size: 11.5px; padding: 3px 8px 3px 10px; }

/* botao de cadastro no cabecalho da pagina: fica ACIMA das duas caixas e fora do
   alinhamento delas (25/08 — dentro da coluna ele empurrava Publicacoes para baixo e
   as caixas desencontravam). Compacto: e uma acao pontual, nao o assunto da tela. */
.proc-addproc { flex: none; padding: 6px 14px; font-size: 12.5px; }

.proc-top { display: grid; grid-template-columns: minmax(0, 2.05fr) minmax(260px, .9fr); gap: 16px; align-items: stretch; margin: 0 0 14px; }

/* ===== painel AGENDA (calendário do mês + agenda do dia, juntos) ===== */
/* Altura FIXA e igual para os dois painéis (agenda e publicações): sem isso a coluna de
   publicações (muitos cards) esticava a linha e o calendário ficava com faixa branca embaixo.
   Aqui os dois têm a mesma altura e cada um rola por dentro. */
.proc-agenda2, .proc-pubdia { background: linear-gradient(180deg, var(--panel-a), var(--panel-b)); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); display: flex; flex-direction: column; overflow: hidden; height: clamp(420px, 62vh, 660px); }
.pnl-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 15px 10px; border-bottom: 1px solid var(--line); }
.pnl-tit { font-size: 14px; font-weight: 800; color: var(--tx); }
.pnl-nav { display: flex; align-items: center; gap: 5px; }
.ag2-seta { width: 28px; height: 28px; border: 1px solid var(--line-2); background: var(--field-bg); border-radius: 8px; color: var(--tx-2); cursor: pointer; font-size: 15px; line-height: 1; }
.ag2-seta:hover { border-color: var(--acc-hair); color: var(--acc-tx); }
.ag2-mes { font-weight: 800; font-size: 13px; min-width: 104px; text-align: center; text-transform: capitalize; }
.pnl-link { font-size: 12px; font-weight: 700; color: var(--acc-tx); margin-left: 4px; white-space: nowrap; }
.ag2-corpo { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); flex: 1; min-height: 0; }
.ag2-mesbox { display: flex; flex-direction: column; min-height: 0; min-width: 0; padding: 2px 3px 4px; }
.ag2-diabox { border-left: 1px solid var(--line); display: flex; flex-direction: column; min-width: 0; min-height: 0; }
/* grade preenche a altura disponível: as semanas dividem o espaço por igual (mesmo modelo do
   calendário da Agenda), sem faixa branca embaixo. */
.ag2-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-template-rows: max-content; grid-auto-rows: minmax(0, 1fr); gap: 5px; padding: 8px 10px 10px; flex: 1; min-height: 0; }
.ag2-wd { text-align: center; font-size: 9.5px; color: var(--tx-3); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: 1px 0 3px; }
/* azulejo de VIDRO CLARO, igual ao calendário da Agenda (--agn-tile) — nada de cinza escuro */
.ag2-cel { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; min-height: 0; min-width: 0; padding: 5px 7px; background: linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .22)); border: 1px solid rgba(255, 255, 255, .70); border-radius: 10px; box-shadow: 0 1px 0 rgba(255, 255, 255, .60) inset, 0 4px 12px -6px rgba(15, 23, 30, .20); cursor: pointer; font-family: inherit; transition: transform .1s, box-shadow .1s; }
.ag2-cel:hover { transform: translateY(-2px); box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 6px 16px -6px rgba(15, 23, 30, .28); }
.ag2-cel.mut { background: transparent; border: none; box-shadow: none; cursor: default; pointer-events: none; }
.ag2-cel.hoje { border-color: var(--acc-hair); box-shadow: 0 0 0 1px var(--acc-hair) inset, 0 4px 12px -6px rgba(15, 23, 30, .20); }
.ag2-cel.sel { border-color: var(--acc-2); box-shadow: 0 0 0 2px var(--acc-hair) inset, 0 4px 12px -6px rgba(15, 23, 30, .20); }
.ag2-num { font-size: 12.5px; font-weight: 800; color: var(--tx-2); }
.ag2-cel.hoje .ag2-num { color: var(--acc-tx); }
.ag2-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--acc); margin-top: 1px; }
.ag2-dot.vazio { background: transparent; }
/* modo noite: azulejo de vidro escuro, mesmo do calendário da Agenda */
html[data-tema="escuro"] .ag2-cel { background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02)); border-color: rgba(255, 255, 255, .12); box-shadow: 0 1px 0 rgba(255, 255, 255, .07) inset, 0 4px 12px -6px rgba(0, 0, 0, .45); }
html[data-tema="escuro"] .ag2-cel.hoje { border-color: var(--acc-hair); box-shadow: 0 0 0 1px var(--acc-hair) inset, 0 4px 12px -6px rgba(0, 0, 0, .45); }
html[data-tema="escuro"] .ag2-cel.sel { border-color: var(--acc-2); box-shadow: 0 0 0 2px var(--acc-hair) inset, 0 4px 12px -6px rgba(0, 0, 0, .45); }
.ag2-diahead { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 13px 10px; border-bottom: 1px solid var(--line); }
.ag2-diatit { font-size: 13px; font-weight: 800; color: var(--tx); text-transform: capitalize; }
.ag2-diacont { font-size: 10.5px; font-weight: 700; color: var(--acc-tx); background: var(--hover-acc); border-radius: 20px; padding: 2px 9px; min-width: 8px; text-align: center; }
.ag2-diacont:empty { display: none; }
.ag2-dialista { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 7px; overflow: auto; flex: 1; min-height: 0; }
.ag2-item { display: flex; align-items: flex-start; gap: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 10px; background: var(--field-bg); cursor: pointer; border-left: 3px solid var(--acc); }
.ag2-item:hover { border-color: var(--acc-hair); }
.ag2-item.prio-alta { border-left-color: var(--err-vivid); }
.ag2-item.prio-media { border-left-color: var(--acc-2); }
.ag2-item.feito { opacity: .55; }
.ag2-item.feito .ag2-txt b { text-decoration: line-through; }
.ag2-item.aberto { flex-wrap: wrap; }
.ag2-item .pa-acoes { padding-left: 52px; justify-content: flex-start; }
.ag2-hora { font-weight: 800; font-size: 12.5px; color: var(--acc-tx); min-width: 44px; font-variant-numeric: tabular-nums; padding-top: 1px; }
.ag2-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.ag2-txt b { font-size: 13px; font-weight: 600; color: var(--tx); }
.ag2-loc { font-size: 11.5px; color: var(--tx-3); }

/* ===== painel PUBLICAÇÕES DO DIA ===== */
.pd-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 15px 10px; border-bottom: 1px solid var(--line); }
.pd-tit { font-size: 14px; font-weight: 800; color: var(--tx); }
.pd-hoje { font-size: 10px; font-weight: 800; color: var(--acc-tx); background: var(--hover-acc); border-radius: 20px; padding: 3px 9px; text-transform: uppercase; letter-spacing: .03em; }
.pd-corpo { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 8px; overflow: auto; flex: 1; min-height: 0; }
.pd-card { border: 1px solid var(--line); border-radius: 11px; background: var(--field-bg); padding: 10px 11px; cursor: pointer; transition: border-color .1s, transform .09s; }
.pd-card:hover { border-color: var(--acc-hair); transform: translateY(-1px); }
.pd-card-top { display: flex; align-items: center; gap: 7px; margin-bottom: 4px; }
.pd-tag { font-size: 9.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; color: var(--acc-tx); background: var(--hover-acc); border-radius: 6px; padding: 2px 7px; }
.pd-tag-alta { color: var(--err-vivid); }
.pd-hora { font-size: 10.5px; color: var(--tx-3); margin-left: auto; }
.pd-oque { font-weight: 700; font-size: 12.5px; color: var(--tx); margin-bottom: 2px; }
.pd-proc { font-size: 11px; color: var(--tx-3); }
.pd-teor { font-size: 11.5px; color: var(--tx-2); margin-top: 5px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.proc-kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 0; }
.tile-proc { display: flex; flex-direction: column; gap: 4px; font-family: inherit; text-align: left; cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s; }
.tile-proc:hover { border-color: var(--acc-hair); box-shadow: var(--shadow-2); transform: translateY(-1px); }
.tile-proc .tile-ic { position: absolute; right: 15px; top: 15px; color: var(--acc-tx); opacity: .5; }
.tile-proc .tile-ic svg.i { width: 20px; height: 20px; }
.tile-proc .tile-lbl { padding-right: 26px; }
.tile-proc .tile-val { font-size: 28px; margin-top: 2px; }
.tile-cap { font-size: 11.5px; color: var(--tx-3); font-weight: 500; }
.tile-proc::after { display: none; }

/* painel Agenda da Semana à direita dos indicadores */
.proc-agenda { background: linear-gradient(180deg, var(--panel-a), var(--panel-b)); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); padding: 14px 15px; display: flex; flex-direction: column; }
.pa-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.pa-tit { font-size: 14px; font-weight: 700; color: var(--tx); }
.pa-nav { display: flex; align-items: center; gap: 6px; }
.pa-seta { width: 24px; height: 24px; border: 1px solid var(--line-2); background: var(--panel-b); color: var(--tx-2); border-radius: 7px; font-size: 14px; line-height: 1; }
.pa-seta:hover { border-color: var(--acc-hair); color: var(--acc-tx); }
.pa-link { font-size: 11px; font-weight: 700; color: var(--acc-tx); margin-left: 4px; white-space: nowrap; }
.pa-dias { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 12px; }
.pa-dia { display: flex; flex-direction: column; align-items: center; gap: 2px; border: none; background: transparent; border-radius: 9px; padding: 6px 2px; cursor: pointer; min-height: 62px; }
.pa-dia:hover { background: var(--field-bg); }
.pa-dow { font-size: 9px; font-weight: 700; letter-spacing: .04em; color: var(--tx-3); }
.pa-num { width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 13px; font-weight: 700; color: var(--tx); }
.pa-dia.hoje .pa-num { background: var(--acc); color: #fff; }
.pa-dia.sel:not(.hoje) .pa-num { box-shadow: 0 0 0 2px var(--acc-hair) inset; color: var(--acc-tx); }
.pa-dia.sel { background: var(--field-bg); }
.pa-cont { font-size: 8.5px; font-weight: 600; color: var(--acc-tx); text-align: center; line-height: 1.1; min-height: 10px; }
.pa-lista { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--line); padding-top: 12px; overflow: auto; max-height: 168px; }
.pa-item { display: flex; gap: 10px; align-items: flex-start; padding-left: 10px; border-left: 3px solid var(--acc); }
.pa-item.prio-alta { border-left-color: var(--err-vivid); }
.pa-item.prio-media { border-left-color: var(--acc-2); }
.pa-item.feito { opacity: .55; }
.pa-item.feito .pa-corpo b { text-decoration: line-through; }
.pa-hora { font-size: 12px; font-weight: 700; color: var(--tx); font-variant-numeric: tabular-nums; min-width: 42px; }
.pa-corpo { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.pa-corpo b { font-size: 12.5px; font-weight: 600; color: var(--tx); }
.pa-loc { font-size: 11px; color: var(--tx-3); }
.pa-vazio { font-size: 12px; color: var(--tx-3); text-align: center; padding: 8px 0; }

/* ações inline (agenda e prazos): Abrir ↗ / ✓ Concluir-Finalizar */
.pa-item { cursor: pointer; border-radius: 8px; padding-top: 2px; padding-bottom: 2px; }
.pa-item:hover { background: var(--field-bg); }
.pa-abrir { margin-left: auto; color: var(--tx-3); font-size: 10px; align-self: center; }
.pa-acoes, .pz-acoes { display: flex; gap: 6px; flex-basis: 100%; margin-top: 7px; justify-content: center; }
.pa-item .pa-acoes { padding-left: 52px; justify-content: flex-start; }
.pa-item.aberto { flex-wrap: wrap; background: var(--field-bg); }
.pz-abrir { border: 1px solid var(--acc-soft); background: var(--panel-b); color: var(--acc-tx); border-radius: 7px; padding: 4px 10px; font-size: 11px; font-weight: 700; }
.pz-abrir:hover { border-color: var(--acc-hair); }
.pz-fim { border: none; background: var(--acc); color: #fff; border-radius: 7px; padding: 4px 10px; font-size: 11px; font-weight: 700; }
.pz-fim:hover { filter: brightness(1.08); }

/* PRAZOS URGENTES — chips de filtro + card HERÓI (contagem regressiva) + linha do tempo */
.proc-prazos { background: linear-gradient(180deg, var(--panel-a), var(--panel-b)); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); display: flex; flex-direction: column; overflow: hidden; }
.pz-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 13px 15px 11px; border-bottom: 1px solid var(--line); }
.pz-tit { font-size: 14px; font-weight: 700; color: var(--tx); flex: 1 0 100%; }
.pz-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.pz-chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: 10.5px; font-weight: 700; cursor: pointer; font-family: inherit; background: var(--panel-b); color: var(--tx-3); border: 1px solid var(--line-2); transition: border-color .15s, color .15s; }
.pz-chip:hover { color: var(--tx-2); }
.pz-chip.on { color: var(--tx); border-color: var(--acc-hair); background: var(--field-bg); }
.pz-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.pz-red .pz-dot { background: var(--err-vivid); }
.pz-amber .pz-dot { background: var(--v4-amber); }
.pz-green .pz-dot { background: var(--acc-2); }
.pz-corpo { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding: 12px 14px 14px; max-height: 320px; }
/* card herói do próximo prazo */
.pz-hero { display: flex; flex-direction: column; gap: 3px; padding: 12px 13px; border-radius: 12px; border: 1px solid var(--err-vivid); background: var(--err-bg); position: relative; }
.pz-hero.pz-amber { border-color: var(--v4-amber); background: rgba(214, 154, 63, .1); }
.pz-hero.pz-green { border-color: var(--acc-soft); background: var(--acc-glow); }
.pz-hero-lbl { font-size: 10px; font-weight: 700; letter-spacing: .06em; color: var(--err-tx); }
.pz-hero.pz-amber .pz-hero-lbl { color: var(--v4-amber); } .pz-hero.pz-green .pz-hero-lbl { color: var(--acc-tx); }
.pz-hero-lbl b { font-variant-numeric: tabular-nums; }
.pz-hero-oque { font-size: 14px; font-weight: 700; color: var(--tx); }
.pz-hero-sub { font-size: 11px; color: var(--tx-3); font-variant-numeric: tabular-nums; }
.pz-hero .pz-acoes { margin-top: 8px; justify-content: flex-start; }
/* linha do tempo do restante */
.pz-tl { display: flex; flex-direction: column; gap: 5px; }
.pz-row { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 9px; background: var(--panel-b); border: 1px solid var(--line); border-left: 3px solid var(--acc-2); }
.pz-row.pz-red { border-left-color: var(--err-vivid); } .pz-row.pz-amber { border-left-color: var(--v4-amber); }
.pz-row:hover { background: var(--field-bg); }
.pz-badge { font-size: 11px; font-weight: 700; color: var(--tx); min-width: 34px; font-variant-numeric: tabular-nums; }
.pz-red .pz-badge { color: var(--err-tx); } .pz-amber .pz-badge { color: var(--v4-amber); } .pz-green .pz-badge { color: var(--acc-tx); }
.pz-info { display: flex; flex-direction: column; gap: 0; flex: 1; min-width: 0; }
.pz-oque { font-size: 11.5px; font-weight: 600; color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pz-proc { font-size: 10px; color: var(--tx-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.pz-row .pz-acoes { flex-basis: auto; margin-top: 0; opacity: 0; transition: opacity .12s; }
.pz-row:hover .pz-acoes, .pz-row:focus-within .pz-acoes { opacity: 1; }
.pz-mais { font-size: 10px; font-weight: 700; color: var(--tx-3); align-self: center; padding-top: 4px; }

/* TUTELA DE URGÊNCIA — aba, faixa explicativa, selos na linha, chip da ficha e pergunta do cadastro */
.proc-tab.tut.ativo { background: linear-gradient(160deg, #D6A93F, #C08A2E); }
.proc-tutela-info { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: rgba(214, 154, 63, .1); border: 1px solid rgba(214, 154, 63, .35); border-radius: 12px; padding: 10px 14px; font-size: 12.5px; color: var(--tx-2); margin-bottom: 14px; }
.proc-tutela-info b { color: var(--tx); }
.lin-tutela { display: inline-flex; align-items: center; gap: 4px; margin-left: 7px; padding: 1px 8px; border-radius: 999px; font-size: 10px; font-weight: 700; vertical-align: middle; white-space: nowrap; }
.tut-aguardando { color: var(--v4-amber); background: rgba(214, 154, 63, .14); border: 1px solid rgba(214, 154, 63, .4); }
.tut-deferida { color: var(--ok-tx); background: var(--ok-bg); border: 1px solid var(--ok-tx); }
.tut-indeferida { color: var(--err-tx); background: var(--err-bg); border: 1px solid var(--err-vivid); }
.dw-tutela.on.tut-aguardando { color: var(--v4-amber); border-color: rgba(214, 154, 63, .5); background: rgba(214, 154, 63, .1); }
.dw-tutela.on.tut-deferida { color: var(--ok-tx); border-color: var(--ok-tx); background: var(--ok-bg); }
.dw-tutela.on.tut-indeferida { color: var(--err-tx); border-color: var(--err-vivid); background: var(--err-bg); }
.dw-tutela { display: inline-flex; align-items: center; gap: 6px; }
/* bolinha simples de status da tutela (substitui o antigo raio ⚡): amarela = aguardando,
   verde = deferida, vermelha = indeferida. Segue a cor do texto do estado. */
.tut-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--v4-amber); }
.tut-deferida .tut-dot { background: var(--ok-tx); }
.tut-indeferida .tut-dot { background: var(--err-vivid); }
.proc-tab.tut .tut-dot { background: var(--v4-amber); margin-right: 6px; vertical-align: middle; }
.proc-tab.tut.ativo .tut-dot { background: #fff; }
.np-tutela-ops { display: flex; flex-direction: column; gap: 7px; margin-top: 4px; }
.np-op { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--tx); font-weight: 500; cursor: pointer; }
.np-op input { accent-color: var(--acc); width: 16px; height: 16px; }
/* tema escuro: âmbar dos fundos/bordas acompanha o --v4-amber claro do tema */
html[data-tema="escuro"] .tut-aguardando,
html[data-tema="escuro"] .dw-tutela.on.tut-aguardando { background: rgba(230, 184, 92, .14); border-color: rgba(230, 184, 92, .45); }
html[data-tema="escuro"] .proc-tutela-info { background: rgba(230, 184, 92, .1); border-color: rgba(230, 184, 92, .35); }
html[data-tema="escuro"] .st-suspenso { background: rgba(230, 184, 92, .16); }
html[data-tema="escuro"] .pz-hero.pz-amber { background: rgba(230, 184, 92, .1); }

/* barra de ferramentas */
.proc-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.proc-tabs { display: inline-flex; gap: 4px; background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 11px; padding: 4px; }
.proc-tab { border: none; background: transparent; color: var(--tx-2); border-radius: 8px; padding: 7px 15px; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.proc-tab:hover { color: var(--tx); }
.proc-tab.ativo { background: var(--acc); color: #fff; box-shadow: var(--shadow-1); }
.proc-tab.star.ativo { background: linear-gradient(160deg, #D6A93F, #B9862A); }
.proc-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.proc-busca { position: relative; display: flex; align-items: center; }
.proc-busca .pb-ic { position: absolute; left: 11px; color: var(--tx-3); display: flex; }
.proc-busca .pb-ic svg.i { width: 16px; height: 16px; }
.proc-busca input { width: 260px; max-width: 44vw; border: 1px solid var(--line-2); background: var(--field-bg); color: var(--tx); border-radius: 10px; padding: 9px 12px 9px 34px; font-size: 13px; }
.proc-busca input:focus { border-color: var(--acc-hair); background: var(--field-bg-focus); outline: none; }
.pt-btn { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line-2); background: var(--panel-b); color: var(--tx-2); border-radius: 10px; padding: 9px 14px; font-size: 12.5px; font-weight: 700; }
.pt-btn:hover { border-color: var(--acc-hair); color: var(--tx); }
.pt-btn svg.i { width: 15px; height: 15px; }
.pt-badge { background: var(--acc); color: #fff; font-size: 10px; font-weight: 700; border-radius: 999px; min-width: 16px; height: 16px; display: inline-flex; align-items: center; justify-content: center; padding: 0 4px; }
.pt-ic { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line-2); background: var(--panel-b); color: var(--tx-2); border-radius: 10px; }
.pt-ic:hover { border-color: var(--acc-hair); color: var(--tx); }
.pt-ic svg.i { width: 17px; height: 17px; }
.pt-novo { padding: 10px 16px; border-radius: 10px; }

/* AUDIÊNCIAS (046, 14/08/2026) — calendário só de audiências, mês/semana */
.aud-card { display: flex; flex-direction: column; gap: 4px; }
.aud-card.feito { opacity: .55; }
.aud-card.feito .aud-tit { text-decoration: line-through; }
.aud-topo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.aud-hora { font-size: 13px; font-variant-numeric: tabular-nums; color: var(--acc-tx); }
.aud-tit { font-size: 13px; font-weight: 700; color: var(--tx); }
.cli-chip.aud-online { color: #2F6FB0; border-color: rgba(47,111,176,.35); }
.cli-chip.aud-pres { color: var(--acc-tx); }
.aud-trib { font-size: 12px; color: var(--tx-2); }
.aud-onde { font-size: 12px; color: var(--tx-3); }
.aud-link { font-size: 12.5px; font-weight: 700; color: var(--acc-tx); }
/* AÇÕES do cartão da agenda unificada (17/08, 7ª rodada — pedido do Geone): no CANTO
   SUPERIOR DIREITO, ícones só (sem palavra "Realizada" — o próprio checkzinho já diz).
   Botão bem menor que o .ghbtn.mini, quadrado, alto contraste no hover. O ".feita" pinta
   o check em verde quando concluído; excluir é discreto até o hover. */
.agn-acoes { position: absolute; top: 8px; right: 8px; display: flex; gap: 4px; z-index: 2; }
.agn-abtn { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px;
  padding: 0; font-size: 13px; line-height: 1; font-weight: 700;
  color: var(--tx-2); background: var(--panel-a); border: 1px solid var(--line-2); border-radius: 7px;
  cursor: pointer; transition: color .12s, border-color .12s, background .12s, transform .08s; }
.agn-abtn:hover { color: var(--tx); border-color: var(--acc-hair); background: var(--hover-acc); transform: translateY(-1px); }
.agn-abtn.feita { color: #fff; background: var(--acc); border-color: var(--acc); }
.agn-abtn.feita:hover { background: var(--acc-2, var(--acc)); }
.agn-abtn.del { color: var(--tx-3); }
.agn-abtn.del:hover { color: var(--err-tx); border-color: var(--err-vivid); background: var(--err-bg); }
.agn-abtn:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
/* na vista MÊS a lista lateral (Resumo do dia) precisa RESPIRAR entre os cartões — a
   sombra do .agn-cp já existe, mas sem gap eles colavam e a profundidade se perdia */
.agn .agx-dia-lista { display: flex; flex-direction: column; gap: 10px; padding: 10px 10px 12px; }
/* a lateral acompanha a ALTURA DO CALENDÁRIO e rola por dentro (9ª rodada, 17/08): o
   .agx-dia nunca foi flex, então a lista crescia com o nº de compromissos e ESTICAVA a
   linha do grid — num dia cheio o painel passava do dobro da janela e a página rolava
   sem parar, justamente o espaço que o calendário deveria ocupar. */
.agn .agx-dia { display: flex; flex-direction: column; min-height: 0; max-height: clamp(500px, calc(100vh - 204px), 1170px); }
.agx-chip.aud-chip { background: var(--acc-soft); color: var(--acc-tx); font-weight: 700; }
/* aba "Novos processos" (25/08) — ao lado de Tutela, com o contador do que espera decisao */
.proc-tab.novos { display: inline-flex; align-items: center; gap: 6px; }
.proc-tab-n { display: inline-flex; align-items: center; justify-content: center; min-width: 18px;
  height: 18px; padding: 0 5px; border-radius: 9px; background: var(--acc); color: #fff;
  font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }

/* caixinha "monitorar o DJEN por esta OAB" (053) — dentro do bloco da OAB, com a mesma
   familia visual dos cards de modulo da Equipe (.nf label vira CAIXA ALTA, por isso o
   text-transform explicito aqui) */
.eq-oab-mon { display: block; margin-top: 8px; padding: 8px 10px; border: 1px solid var(--line);
  border-radius: 9px; background: var(--panel-a); cursor: pointer; font-size: 12.5px;
  font-weight: 600; color: var(--tx); text-transform: none; letter-spacing: 0; }
.eq-oab-mon:hover { background: var(--hover-acc); }
.eq-oab-mon input { margin-right: 7px; }
.eq-oab-mon .eq-sub-dica { display: block; margin-top: 3px; font-weight: 500; }

/* navegacao de dia na caixinha de Publicacoes (25/08): setas + o dia como botao */
.pd-nav { display: flex; align-items: center; gap: 2px; }
.pd-nav .ag2-seta:disabled { opacity: .3; cursor: default; }
select.pd-sel { background: none; border: 1px solid transparent; font: inherit; color: inherit;
  cursor: pointer; padding: 1px 4px; border-radius: 6px; font-variant-numeric: tabular-nums;
  max-width: 150px; }
select.pd-sel:hover { background: var(--hover-acc); border-color: var(--line); }
select.pd-sel:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
.pd-dica { display: inline-block; margin-top: 6px; font-size: 11.5px; color: var(--tx-3); line-height: 1.4; }

/* a ultima movimentacao corta com reticencia na largura REAL da coluna (antes era um
   slice(0,60) no JS, que cortava no seco e ainda estourava a coluna em nome comprido) */
.td-mov-tx { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===== GRADE DE HORAS da vista Semana (25/08) =====
   Linhas de hora x colunas de dia, no espirito do Google Agenda, com rotulo em
   formato brasileiro de 24h ("13h", "14h").
   ALINHAMENTO: cabecalho, faixa "sem hora" e grade ficam TODOS dentro do mesmo
   container rolavel. Com o cabecalho fora dele, a barra de rolagem tirava ~10px
   so da grade e as colunas iam desencontrando ate 9px no sabado. Grudados no
   topo por sticky, continuam visiveis ao descer nas horas.
   PROFUNDIDADE: mesma linguagem dos azulejos do mes (--agn-tile) — placa com
   aresta clara em cima, sombra por baixo e as horas fora do expediente rebaixadas. */
.agh { display: flex; flex-direction: column; min-height: 0; height: 100%; grid-column: 1 / -1;
  border: 1px solid var(--agn-tile-bd); border-radius: 12px; overflow: hidden;
  background: var(--agn-tile); box-shadow: var(--agn-tile-sombra); }
.agh-corpo { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.agh-cab, .agh-sh, .agh-grade { display: grid; grid-template-columns: 52px repeat(7, minmax(0, 1fr)); }
.agh-topo { position: sticky; top: 0; z-index: 3;
  background: linear-gradient(180deg, var(--panel-a), var(--panel-b, var(--panel-a)));
  box-shadow: 0 1px 0 var(--met-edge) inset, 0 6px 14px -8px rgba(15, 23, 30, .35); }
.agh-cab { border-bottom: 1px solid var(--line); }
.agh-dcab { padding: 7px 4px 8px; text-align: center; font-size: 10.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; color: var(--tx-3); border-left: 1px solid var(--line); }
.agh-dcab b { display: block; font-size: 15px; font-weight: 700; color: var(--tx);
  letter-spacing: 0; text-transform: none; font-variant-numeric: tabular-nums; }
/* o dia de hoje ganha um filete de destaque no alto da coluna, nao um bloco chapado */
.agh-dcab.hoje { color: var(--acc-tx); box-shadow: inset 0 3px 0 var(--acc); }
.agh-dcab.hoje b { color: var(--acc-tx); }
/* faixa do que nao tem hora marcada — equivalente ao "dia inteiro" do Google */
/* a rolagem do excedente fica em CADA COLUNA, nao na faixa: barra na faixa inteira
   encolheria o conteudo dela e as colunas voltariam a desencontrar da grade */
.agh-sh { border-bottom: 1px solid var(--line); grid-auto-rows: minmax(26px, 92px); }
.agh-shcol { min-height: 26px; padding: 3px; border-left: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 3px; overflow-y: auto; scrollbar-width: thin; }
.agh-gut { display: flex; align-items: center; justify-content: flex-end; padding-right: 6px; }
.agh-gut-quina { border-right: 1px solid var(--line); }
.agh-grade { grid-auto-rows: minmax(42px, auto); }
.agh-hora { padding: 3px 6px 0 0; text-align: right; font-size: 10.5px; font-weight: 700;
  color: var(--tx-3); font-variant-numeric: tabular-nums; border-top: 1px solid var(--line); }
.agh-cel { border-top: 1px solid var(--line); border-left: 1px solid var(--line);
  padding: 2px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
/* fora do expediente rebaixado: da relevo a faixa util sem esconder nada */
.agh-cel.fora, .agh-hora.fora { background: rgba(0, 0, 0, .055); }
.agh-hora.fora { opacity: .62; }
:root[data-tema="escuro"] .agh-cel.fora, :root[data-tema="escuro"] .agh-hora.fora { background: rgba(0, 0, 0, .22); }
.agh-cel.hoje { background: var(--hover-acc); }
.agh-cel.hoje.fora { background: var(--hover-acc); filter: brightness(.97); }
.agh-cel.agn-solta, .agh-shcol.agn-solta { background: var(--acc-soft); box-shadow: 0 0 0 2px var(--acc-hair) inset; }
/* a pilula ja existe (.agn-sev) — aqui encolhe p/ caber e ganha relevo sobre a grade */
.agh-cel .agn-sev, .agh-shcol .agn-sev { padding: 3px 6px 3px 9px; font-size: 11px; line-height: 1.2;
  border-radius: 6px; box-shadow: 0 1px 0 var(--met-edge) inset, 0 2px 6px -3px rgba(15, 23, 30, .45); }
.agh-cel .agn-sev b, .agh-shcol .agn-sev b { display: inline; font-size: 10px; margin-right: 3px; }
.agh-cel .agn-sev span, .agh-shcol .agn-sev span { display: inline; }
.agh-cel .agn-sev:hover, .agh-shcol .agn-sev:hover { transform: translateY(-1px);
  box-shadow: 0 1px 0 var(--met-edge) inset, 0 5px 12px -4px rgba(15, 23, 30, .5); }
@media (max-width: 760px) {
  /* no celular 7 colunas de hora nao cabem: o rotulo encolhe e a grade rola na horizontal */
  .agh-cab, .agh-sh, .agh-grade { grid-template-columns: 38px repeat(7, minmax(64px, 1fr)); }
  .agh-corpo { overflow-x: auto; }
}

.aud-semana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; grid-column: 1 / -1; }
/* cartão de dia com o MESMO acabamento metálico das faixas/painéis (degradê + fio de
   aresta + sombra) — antes era fundo chapado e a semana ficava sem profundidade */
.aud-sem-dia { border: 1px solid var(--line); border-radius: 10px; padding: 8px; min-height: 120px;
  background: linear-gradient(180deg, var(--met-hi2) 0%, var(--met-lo2) 100%);
  box-shadow: inset 0 1px 0 var(--met-edge), var(--shadow-1);
  display: flex; flex-direction: column; gap: 6px; }
.aud-sem-dia.hoje { border-color: var(--acc-hair); box-shadow: 0 0 0 1px var(--acc-hair) inset, inset 0 1px 0 var(--met-edge), var(--shadow-1); }
.aud-sem-cab { font-size: 10.5px; font-weight: 800; letter-spacing: .08em; color: var(--tx-3); }
.aud-sem-vazio { color: var(--tx-3); font-size: 12px; text-align: center; padding: 12px 0; }
/* PÍLULA da semana (17/08, 8ª rodada): hora + título compactos, tinta por tipo — o cartão
   completo não cabia na coluna de 1/7 ("totalmente desorganizada"); clicar abre a ficha */
.agn-sev { display: block; width: 100%; text-align: left; border: 0; cursor: pointer; font: inherit;
  font-size: 11px; line-height: 1.3; border-radius: 7px; padding: 5px 7px 5px 10px; position: relative;
  color: var(--tx); box-shadow: 0 1px 2px rgba(15, 23, 30, .12); transition: box-shadow .1s, transform .08s; }
.agn-sev::before { content: ''; position: absolute; left: 0; top: 4px; bottom: 4px; width: 3px; border-radius: 0 3px 3px 0; }
.agn-sev.aud { background: var(--agn-aud-bg); } .agn-sev.aud::before { background: var(--agn-aud); }
.agn-sev.reu { background: var(--agn-reu-bg); } .agn-sev.reu::before { background: var(--agn-reu); }
.agn-sev.tar { background: var(--agn-tar-bg); } .agn-sev.tar::before { background: var(--agn-tar); }
.agn-sev.lem { background: var(--agn-lem-bg); } .agn-sev.lem::before { background: var(--agn-lem); }
.agn-sev b { display: block; font-size: 10px; font-weight: 800; font-variant-numeric: tabular-nums; }
.agn-sev.aud b { color: var(--agn-aud); } .agn-sev.reu b { color: var(--agn-reu); }
.agn-sev.tar b { color: var(--agn-tar); } .agn-sev.lem b { color: var(--agn-lem); }
.agn-sev span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-weight: 600; }
.agn-sev.feito { opacity: .55; } .agn-sev.feito span { text-decoration: line-through; }
button.agn-sev:hover { box-shadow: 0 2px 6px rgba(15, 23, 30, .22); transform: translateY(-1px); }
button.agn-sev:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
span.agn-sev { cursor: default; }
@media (max-width: 900px) { .aud-semana { grid-template-columns: 1fr; } .aud-sem-dia { min-height: auto; } }

/* AGENDA UNIFICADA (modelo N aprovado, 17/08/2026) — a PROFUNDIDADE pedida pelo Geone:
   fundo vivo em gradiente, painéis-vidro com desfoque, azulejos com relevo nos dias e
   cores por TIPO (audiência/reunião/tarefa/lembrete). Tokens próprios com par escuro. */
.agn {
  --agn-aud: #B4321F; --agn-aud-bg: rgba(180, 50, 31, .14);
  --agn-reu: #2C577A; --agn-reu-bg: rgba(44, 87, 122, .14);
  --agn-tar: var(--acc-tx); --agn-tar-bg: color-mix(in srgb, var(--acc) 14%, transparent);
  --agn-lem: #8A6510; --agn-lem-bg: rgba(184, 134, 11, .16);
  --agn-vidro: rgba(255, 255, 255, .42);
  --agn-vidro-bd: rgba(255, 255, 255, .65);
  /* 9ª rodada (17/08): o azulejo era branco quase chapado com borda cinza forte e lia como
     "quadradinho colado". Agora é VIDRO — deixa o fundo do painel atravessar, a borda vira
     fio branco e a sombra abre. Mesmo desenho, ar mais leve (modelo A aprovado). */
  --agn-tile: linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .22));
  --agn-tile-bd: rgba(255, 255, 255, .70);
  --agn-sombra: 0 1px 0 rgba(255, 255, 255, .60) inset, 0 4px 10px rgba(15, 23, 30, .16), 0 22px 48px -14px rgba(15, 23, 30, .38);
  --agn-tile-sombra: 0 1px 0 rgba(255, 255, 255, .60) inset, 0 4px 12px -6px rgba(15, 23, 30, .20);
  background:
    radial-gradient(900px 380px at 12% -60px, color-mix(in srgb, var(--acc) 13%, transparent) 0%, transparent 60%),
    radial-gradient(760px 340px at 96% 6%, rgba(44, 87, 122, .12) 0%, transparent 55%),
    linear-gradient(165deg, var(--panel-a), var(--panel-b));
  /* 17/08 (10ª rodada, pedido do Geone): fundo do calendário com MAIS profundidade —
     duas camadas de sombra (uma perto, uma longe) para o painel parecer flutuar */
  border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 6px 16px rgba(15, 23, 30, .14), 0 28px 64px -18px rgba(15, 23, 30, .42);
  padding: 14px; margin-top: 4px;
}
/* MODO EXPANDIDO (17/08, 10ª rodada, pedido do Geone): botão ⛶ abre o calendário em
   tela cheia — o painel ocupa a janela inteira, o resto some por trás. Sair pelo ×,
   pelo próprio ⛶ ou pela tecla Esc. Não mexe no menu lateral (fica atrás do painel). */
.agn.agn-cheio { position: fixed; inset: 0; z-index: 1450; margin: 0; border-radius: 0;
  overflow: hidden; box-shadow: none; padding: 14px 18px; display: flex; flex-direction: column; }
/* no modo expandido, o container .agx ocupa TODA a altura restante e as duas colunas
   (calendário e lista lateral) esticam junto — sem a diferença de rodapé (18/08, 2ª rodada) */
.agn.agn-cheio .agx { flex: 1; min-height: 0; margin-top: 10px; align-items: stretch; }
.agn.agn-cheio .agx-cal { display: flex; flex-direction: column; min-height: 0; }
.agn.agn-cheio .agx-grid { flex: 1; min-height: 0; height: auto; }
.agn.agn-cheio .agx-dia { max-height: none; height: auto; min-height: 0; }
.agn.agn-cheio .agx-dia-lista { flex: 1; min-height: 0; overflow-y: auto; }
.agn-fexp { display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; padding: 0; font-size: 15px; line-height: 1; }
html[data-tema="escuro"] .agn {
  --agn-aud: #E8907F; --agn-aud-bg: rgba(232, 144, 127, .14);
  --agn-reu: #8AB4D8; --agn-reu-bg: rgba(138, 180, 216, .14);
  --agn-tar: var(--acc-tx); --agn-tar-bg: color-mix(in srgb, var(--acc-tx) 13%, transparent);
  --agn-lem: #E0B45C; --agn-lem-bg: rgba(224, 180, 92, .14);
  --agn-vidro: rgba(10, 18, 32, .45);
  --agn-vidro-bd: rgba(255, 255, 255, .1);
  --agn-tile: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02));
  --agn-tile-bd: rgba(255, 255, 255, .12);
  --agn-sombra: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 2px 6px rgba(0, 0, 0, .4), 0 16px 36px -10px rgba(0, 0, 0, .6);
  --agn-tile-sombra: 0 1px 0 rgba(255, 255, 255, .07) inset, 0 4px 12px -6px rgba(0, 0, 0, .45);
  background:
    radial-gradient(900px 380px at 12% -60px, color-mix(in srgb, var(--acc) 10%, transparent) 0%, transparent 60%),
    radial-gradient(760px 340px at 96% 6%, rgba(70, 120, 170, .12) 0%, transparent 55%),
    linear-gradient(165deg, var(--panel-a), var(--panel-b));
}
/* painéis em vidro (calendário e coluna do dia) */
.agn .agn-vidro { background: var(--agn-vidro); backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); border: 1px solid var(--agn-vidro-bd); border-radius: 14px; box-shadow: var(--agn-sombra); padding: 12px; }
.agn .agx { margin-top: 12px; }
/* faixa de filtros por tipo */
.agn-tipos { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; background: var(--agn-vidro); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid var(--agn-vidro-bd); border-radius: 12px; box-shadow: var(--agn-sombra); padding: 8px 11px; }
.agn-trot { font-size: 9.5px; font-weight: 800; letter-spacing: .1em; color: var(--tx-3); text-transform: uppercase; }
/* filtro por tipo no MESMO padrão dos botões Mês/Semana (segmentos retos — 2ª rodada 17/08);
   só o pontinho de cor do tipo é próprio */
.agn-tgrp { background: var(--panel-b); }
.agn-tbt { display: inline-flex; align-items: center; gap: 6px; }
.agn-tbt .pt { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.agn-tbt.t-todos .pt { background: conic-gradient(var(--agn-aud) 0 25%, var(--agn-reu) 25% 50%, var(--agn-tar) 50% 75%, var(--agn-lem) 75%); }
.agn-tbt.t-aud .pt { background: var(--agn-aud); } .agn-tbt.t-reu .pt { background: var(--agn-reu); }
.agn-tbt.t-tar .pt { background: var(--agn-tar); } .agn-tbt.t-lem .pt { background: var(--agn-lem); }
.agn-tbt.on .pt { box-shadow: 0 0 0 2px rgba(255, 255, 255, .55); }
.agn-tnota { margin-left: auto; font-size: 10.5px; color: var(--tx-3); }
.agn-tnota b { color: var(--acc-tx); }
.agn-vistas { margin-left: auto; }
/* dias do mês como AZULEJOS com relevo (sobrepõe o visual chapado do .agx-d aqui dentro).
   ALTURA PELA JANELA (17/08, 4ª rodada): o mês inteiro CABE na tela — o grid ocupa a altura
   disponível do monitor e as semanas dividem esse espaço por igual (estilo Astrea). A 3ª
   rodada usava aspect-ratio pela largura e em monitor largo o calendário estourava a tela
   e cortava as últimas semanas (achado do Geone). */
/* 9ª rodada (17/08): sem o cabeçalho "Agenda" a faixa devolveu ~66px — o desconto caiu de
   340 para 274px, então a linha da semana fica MAIS ALTA e a célula menos achatada
   (o pedido "mais quadradinho, não tão retangular"). Segue governado pela JANELA, nunca
   por aspect-ratio da largura (lição da 3ª rodada: em monitor largo o mês estourava). */
.agn .agx-grid { height: clamp(430px, calc(100vh - 274px), 1100px); grid-template-rows: max-content; grid-auto-rows: minmax(0, 1fr); }
.agn .agx-d { background: var(--agn-tile); border: 1px solid var(--agn-tile-bd); border-radius: 11px; box-shadow: var(--agn-tile-sombra); min-height: 0; overflow: hidden; align-items: stretch; transition: transform .1s, box-shadow .1s; }
.agn .agx-d:hover { transform: translateY(-2px); box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 6px 16px -6px rgba(15, 23, 30, .28); }
.agn .agx-d.agx-mut { background: transparent; box-shadow: none; border-color: transparent; }
.agn .agx-d.agx-hoje { border-color: var(--acc-hair); box-shadow: 0 0 0 1px var(--acc-hair) inset, var(--agn-tile-sombra); }
.agn .agx-d.agx-sel { border-color: var(--acc-2); box-shadow: 0 0 0 2px var(--acc-hair) inset, var(--agn-tile-sombra); }
/* pílula colorida do compromisso dentro do dia */
/* 9ª rodada (17/08): a pílula virou BOTÃO (abre a ficha) e ganha o estado "concluído" —
   apagadinha com risco no meio, igual à lista. `width:100%` + reset porque agora é <button>. */
/* 17/08 (10ª rodada, pedido do Geone): pílula do compromisso no MÊS — só o TEXTO na cor
   do tipo, fino e sem fundo/listra ("apenas a escrita, de forma fina, ficaria melhor").
   O fundo grifado + border-left + font-weight:800 saem; a cor por tipo vira do texto. */
.agn-ev { display: block; width: 100%; font: inherit; font-size: 9.5px; font-weight: 500; line-height: 1.4; border: 0; background: transparent; border-radius: 4px; padding: 1px 4px; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; }
button.agn-ev { cursor: pointer; }
button.agn-ev:hover { background: rgba(15, 23, 30, .06); }
html[data-tema="escuro"] button.agn-ev:hover { background: rgba(255, 255, 255, .06); }
button.agn-ev:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
.agn-ev.aud { color: var(--agn-aud); }
.agn-ev.reu { color: var(--agn-reu); }
.agn-ev.tar { color: var(--agn-tar); }
.agn-ev.lem { color: var(--agn-lem); }
/* concluída: risca e desbota a cor — sem fundo/borda para tirar */
.agn-ev.feito { text-decoration: line-through; color: var(--tx-3); }
/* cabeçalho da célula: número do dia + "+N" na MESMA linha (o "+N" embaixo custava uma
   linha da pilha e, em notebook, matava a 2ª pílula — revisão 17/08) */
.agx-cab { display: flex; align-items: baseline; gap: 5px; min-width: 0; }
.agn-mais { font-size: 8.5px; font-weight: 800; color: var(--tx-3); margin-left: auto;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
/* cartões da lista: trilho colorido do tipo + selo. Prefixo .agn para VENCER a regra base
   .agx-ev (mesma classe no elemento) independentemente da ordem no arquivo — sem isso o
   padding/raio/borda de lista da agenda antiga atropelava o cartão-vidro (revisão 17/08) */
/* 17/08 (10ª rodada, pedido do Geone): cartões da lista lateral MENORES — as caixinhas
   estavam grandes demais. Padding compacto e as fontes internas encolhem (regras abaixo). */
.agn .agn-cp { position: relative; padding: 7px 8px 7px 13px; background: var(--agn-tile); box-shadow: var(--agn-tile-sombra); border-radius: 9px; border-bottom: 0; }
.agn .agn-cp .aud-tit { font-size: 12px; font-weight: 600; }
.agn .agn-cp .aud-hora { font-size: 11.5px; }
.agn .agn-cp .aud-trib, .agn .agn-cp .aud-onde, .agn .agn-cp .aud-link { font-size: 11px; }
.agn .agn-cp .agn-cptipo { font-size: 7.5px; padding: 1.5px 5px; }
.agn .agn-cp .agn-area { font-size: 8px; padding: 1px 5px; }
.agn .agn-cp .td-sub { font-size: 10.5px; }
.agn .agn-cp .agn-acoes { top: 6px; right: 6px; }
.agn .agn-cp .agn-abtn { width: 22px; height: 22px; font-size: 11px; }
/* a reserva de 92px p/ as ações absolutas SÓ onde o cartão é largo (kanban do dia e lista
   lateral) — na vista SEMANA a coluna tem ~100px e 92px de padding esmagaria o cartão
   inteiro sob os botões (achado ALTA da revisão de 17/08) */
.agn .agx-dia-lista .agn-cp, .agn-kcorpo .agn-cp { padding-right: 92px; }
/* botão do processo (CNJ inteiro) não pode atravessar a calha das ações no kanban */
.agn .agn-cp .ghbtn.mini { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agn .agn-cp:hover { background: var(--agn-tile); box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 3px 8px rgba(15, 23, 30, .18), 0 12px 24px -10px rgba(15, 23, 30, .34); }
.agn .agn-cp::before { content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 4px; border-radius: 0 4px 4px 0; }
.agn .agn-cp.aud::before { background: var(--agn-aud); } .agn .agn-cp.reu::before { background: var(--agn-reu); }
.agn .agn-cp.tar::before { background: var(--agn-tar); } .agn .agn-cp.lem::before { background: var(--agn-lem); }
.agn-cptipo { font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; border-radius: 5px; padding: 2px 6px; white-space: nowrap; }
.agn-cptipo.t-aud { background: var(--agn-aud-bg); color: var(--agn-aud); }
.agn-cptipo.t-reu { background: var(--agn-reu-bg); color: var(--agn-reu); }
.agn-cptipo.t-tar { background: var(--agn-tar-bg); color: var(--agn-tar); }
.agn-cptipo.t-lem { background: var(--agn-lem-bg); color: var(--agn-lem); }
.agn-urg { color: var(--err-tx); font-weight: 800; }
/* SUPERAGENDA (17/08): filtro no botão "Filtros ▾" que desce o painel, vista Dia, envolvidos e ficha */
.agn-fbar { display: flex; align-items: center; gap: 12px; }
.agn-fbtn { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; position: relative; }
.agn-fseta { font-size: 10px; }
.agn-fbadge { min-width: 17px; height: 17px; display: grid; place-items: center; background: var(--acc); color: #fff; font-size: 10px; font-weight: 800; border-radius: 999px; padding: 0 4px; }
.agn-fesp { flex: 1; }
/* cores por tipo TAMBÉM no global: o menu "Filtrar por" flutua no body, fora do escopo .agn */
:root { --agn-aud: #B4321F; --agn-reu: #2C577A; --agn-tar: #2626C7; --agn-lem: #8A6510; }
html[data-tema="escuro"] { --agn-aud: #E8907F; --agn-reu: #8AB4D8; --agn-tar: var(--acc-tx); --agn-lem: #E0B45C; }
/* menu vertical do "Filtrar por" (modelo Astrea): itens empilhados, grupos separados */
.agn-fmenu { min-width: 240px; max-height: min(72vh, 560px); overflow: auto; }
.agn-fop { display: flex; align-items: center; gap: 8px; }
.agn-fop.on { color: var(--acc-tx); font-weight: 800; }
.agn-fn { margin-left: auto; font-size: 10.5px; color: var(--tx-3); font-weight: 600; }
.agn-fpt { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.agn-fpt.t-todos { background: conic-gradient(var(--agn-aud, #B4321F) 0 25%, var(--agn-reu, #2C577A) 25% 50%, var(--agn-tar, #2626C7) 50% 75%, var(--agn-lem, #8A6510) 75%); }
.agn-fpt.t-aud { background: var(--agn-aud, #B4321F); } .agn-fpt.t-reu { background: var(--agn-reu, #2C577A); }
.agn-fpt.t-tar { background: var(--agn-tar, #2626C7); } .agn-fpt.t-lem { background: var(--agn-lem, #8A6510); }
.agn-fdica { font-weight: 400; text-transform: none; letter-spacing: 0; font-size: 9.5px; color: var(--tx-3); }
.agn-area { font-size: 8.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--acc-tx); border: 1px solid var(--acc-hair); border-radius: 5px; padding: 1.5px 6px; white-space: nowrap; }
.agn-abrivel { cursor: pointer; }
/* VISTA DIA = KANBAN (17/08, 7ª rodada — pedido do Geone): quando a vista é 'dia', o
   grid dos 7 azulejos é liberado (block, sem os `1fr` de cada semana) e o kanban ocupa
   toda a altura disponível. Cada coluna rola por dentro — a página não estica, os cartões
   que sobram somem sob a barra da coluna, e não sob o rodapé do navegador. */
.agn .agx-grid.agx-grid-dia { display: block; padding: 8px 8px 10px; overflow: hidden; }
.agn-kanban { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; height: 100%; align-items: stretch; }
.agn-kcol { display: flex; flex-direction: column; min-height: 0; background: rgba(255, 255, 255, .32);
  border: 1px solid var(--line); border-radius: 12px; overflow: hidden; box-shadow: var(--agn-tile-sombra); }
html[data-tema="escuro"] .agn-kcol { background: rgba(255, 255, 255, .04); }
.agn-kcab { display: flex; align-items: center; gap: 8px; padding: 9px 12px; font-size: 10.5px; font-weight: 800;
  letter-spacing: .09em; text-transform: uppercase; color: var(--tx-2); border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .18)); }
html[data-tema="escuro"] .agn-kcab { background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02)); color: var(--tx); }
.agn-kdot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.agn-kdot.t-aud { background: var(--agn-aud); } .agn-kdot.t-reu { background: var(--agn-reu); }
.agn-kdot.t-tar { background: var(--agn-tar); } .agn-kdot.t-lem { background: var(--agn-lem); }
.agn-kn { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--tx-3); font-weight: 700; font-size: 11px; letter-spacing: 0; }
.agn-kcorpo { display: flex; flex-direction: column; gap: 8px; padding: 10px; overflow-y: auto; flex: 1; min-height: 0; scrollbar-width: thin; }
.agn-kcorpo .agn-cp { width: auto; }
/* mobile: colunas empilham e o CORTE some — a altura fixa + overflow:hidden do desktop
   decapitaria as colunas de baixo (ficariam inacessíveis); no celular a página rola,
   que é o gesto natural, e cada coluna mostra tudo sem scroll interno */
@media (max-width: 900px) {
  .agn .agx-grid.agx-grid-dia { height: auto; overflow: visible; }
  .agn-kanban { grid-template-columns: 1fr; height: auto; }
  .agn-kcorpo { overflow-y: visible; }
  /* a pílula virou botão e tem ~13px: alvo de toque abaixo do mínimo (WCAG 2.5.8) e errar
     o toque trocava o dia em vez de abrir a ficha. No celular ela cresce. */
  .agn .agx-d .agn-ev { min-height: 24px; padding: 5px 4px; font-size: 10px; line-height: 1.15; }
}
/* a trava de altura da lateral tem que soltar no MESMO ponto em que as colunas empilham
   (980px, regra pré-existente do .agx) — solta só em 900px, a faixa 901–980 ficava com a
   lista rolando dentro de uma caixa embaixo do calendário, scroll dentro de scroll */
@media (max-width: 980px) {
  .agn .agx-dia { max-height: none; }
  .agn .agx-dia-lista { overflow-y: visible; }
}
.agn-mini { font-size: 11.5px; color: var(--tx-2); padding: 4px 2px; border-bottom: 1px dashed var(--line); }
.agn-mini b { color: var(--tx); font-variant-numeric: tabular-nums; margin-right: 4px; }
.agn-envs { display: flex; gap: 6px 12px; flex-wrap: wrap; border: 1px solid var(--line); background: var(--field-bg); border-radius: 9px; padding: 8px 10px; }
.agn-env { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--tx-2); cursor: pointer; text-transform: none; letter-spacing: 0; }
.agn-ficha { display: flex; flex-direction: column; gap: 8px; }
/* CONVERSA da tarefa (17/08): comentários da equipe com @menção e anexos */
.cmt-lista { display: flex; flex-direction: column; gap: 8px; max-height: 260px; overflow-y: auto; scrollbar-width: thin; }
.cmt-item { background: var(--field-bg); border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; }
.cmt-cab { display: flex; align-items: baseline; gap: 8px; }
.cmt-autor { font-size: 12px; color: var(--tx); }
.cmt-quando { font-size: 10.5px; color: var(--tx-3); }
.cmt-x { margin-left: auto; border: 0; background: none; color: var(--tx-3); font-size: 14px; line-height: 1; cursor: pointer; padding: 0 2px; }
.cmt-x:hover { color: var(--err-tx); }
.cmt-texto { font-size: 12.5px; color: var(--tx-2); white-space: pre-wrap; line-height: 1.5; margin-top: 2px; }
.cmt-anexos { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.cmt-arq { cursor: pointer; }
.cmt-composer { display: flex; flex-direction: column; gap: 6px; }
/* 17/08 (10ª rodada, pedido do Geone): campo de comentário maior — o composer tinha
   duas linhas de altura e pedia por respiro para escrever de verdade */
.cmt-composer textarea { font: inherit; font-size: 12.5px; color: var(--tx); background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 9px; padding: 10px 12px; resize: vertical; min-height: 96px; line-height: 1.5; }
.cmt-acoes { display: flex; align-items: center; gap: 8px; }
.cmt-clip { padding: 5px 9px; }
.cmt-pend { flex: 1; display: flex; gap: 6px; flex-wrap: wrap; }
.cmt-env { padding: 7px 16px; font-size: 12px; }
/* arrastar p/ remarcar (17/08): origem com "pegada", destino aceso enquanto o item paira */
.agn [data-mov] { cursor: grab; }
.agn [data-mov]:active { cursor: grabbing; }
.agn .agn-solta { outline: 2px dashed var(--acc); outline-offset: -2px; }
.agn-f-tit { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14.5px; }
.agn-f-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.agn-f-sec { font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--tx-3); margin-top: 6px; }
.agn-f-obs { font-size: 13px; color: var(--tx-2); white-space: pre-wrap; line-height: 1.5; background: var(--field-bg); border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; }
/* MENU DE AÇÕES no topo da ficha (18/08, 2ª rodada, pedido do Geone): um botão
   "Ações ▾" e um menu flutuante logo abaixo, com rótulos + logos coloridas de
   WhatsApp e Gmail (SVG). Substitui a antiga barra de ícones nus. */
.fic-aes { position: relative; padding: 4px 0 6px; margin-bottom: 6px; }
/* 18/08 (3ª rodada): o "Ações" vive no RODAPÉ do modal — encosta à esquerda
   (margin-right:auto empurra Concluir p/ a direita) e o menu abre PARA CIMA */
.uiModal-h .fic-aes { padding: 0; margin: 0 8px 0 auto; }
.uiModal-h .fic-menu { top: calc(100% + 8px); left: auto; right: 0; }
.fic-abrir { display: inline-flex; align-items: center; gap: 6px; }
.fic-abrir .fic-seta { font-size: 10px; margin-left: 2px; }
.fic-menu { position: absolute; top: 100%; left: 0; z-index: 40; min-width: 280px;
  background: linear-gradient(180deg, var(--modal-a), var(--modal-b));
  border: 1px solid var(--line-2); border-radius: 12px; padding: 6px;
  box-shadow: 0 12px 32px -10px rgba(15, 23, 30, .38);
  display: flex; flex-direction: column; gap: 1px; }
.fic-mi { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px;
  border: 0; background: none; color: var(--tx); font: inherit; font-size: 12.5px;
  text-align: left; border-radius: 8px; cursor: pointer; }
.fic-mi:hover { background: var(--hover-acc); }
.fic-mi:focus-visible { outline: 2px solid var(--acc); outline-offset: -2px; }
.fic-mi-ic { flex: 0 0 22px; display: inline-flex; align-items: center; justify-content: center; }
.fic-mi-rot { flex: 1; }
.fic-mi-br { font-style: normal; font-size: 10px; color: var(--tx-3); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; margin-left: 6px; }
.fic-mi-sep { height: 1px; background: var(--line); margin: 4px 6px; }
.fic-mi-del { color: var(--tx-2); }
.fic-mi-del:hover { background: var(--err-bg); color: var(--err-tx); }
.fic-svg { display: block; }
.fic-emoji { font-size: 15px; line-height: 1; }
/* ABAS Conversa | Histórico (18/08): mesma pegada das abas do sistema, retas + sublinhado */
.fic-abas { display: flex; gap: 0; border-bottom: 1px solid var(--line); margin: 10px 0 8px; }
.fic-aba { border: 0; background: none; color: var(--tx-2); font: inherit; font-size: 12.5px; font-weight: 600;
  padding: 8px 14px; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.fic-aba:hover { color: var(--acc-tx); }
.fic-aba.on { color: var(--acc-tx); border-bottom-color: var(--acc); }
.fic-aba:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.fic-painel { display: block; }
/* HISTÓRICO de alterações — linha por evento: ícone + autor + texto + quando */
.hist-lista { display: flex; flex-direction: column; gap: 6px; max-height: 320px; overflow-y: auto; scrollbar-width: thin; padding: 4px 2px; }
.hist-item { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; background: var(--field-bg); border: 1px solid var(--line); border-radius: 8px; }
.hist-ic { flex: 0 0 auto; font-size: 13px; line-height: 1.4; color: var(--tx-3); }
.hist-tx { font-size: 12.5px; color: var(--tx-2); line-height: 1.5; }
.hist-tx b { color: var(--tx); font-weight: 600; margin-right: 4px; }
.hist-quando { display: block; font-size: 10.5px; color: var(--tx-3); margin-top: 2px; }
@media (max-width: 900px) { .agn { padding: 10px; } .agn-tnota { display: none; } .agn-vistas { margin-left: 0; } }
.agx-esc-bt.on { background: var(--acc); color: #fff; }

/* ===== PUBLICAÇÕES (18/08/2026, pedido do Geone) — tratamento das publicações
   diárias no lugar do antigo "Petições". Cartão compacto → expande com o teor. ===== */
.pub { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.pub-topo { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pub-abas { display: flex; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.pub-aba { border: 0; background: var(--panel-b); color: var(--tx-2); font: inherit; font-size: 12.5px; font-weight: 600; padding: 8px 14px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.pub-aba + .pub-aba { border-left: 1px solid var(--line); }
.pub-aba.on { background: var(--acc); color: #fff; }
.pub-aba:not(.on):hover { background: var(--hover-acc); color: var(--acc-tx); }
.pub-n { font-size: 10px; font-weight: 800; background: rgba(0, 0, 0, .12); border-radius: 999px; padding: 1px 7px; }
.pub-aba.on .pub-n { background: rgba(255, 255, 255, .25); }
.pub-n:empty { display: none; }
.pub-acoes-topo { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.pub-busca { font: inherit; font-size: 12.5px; color: var(--tx); background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 9px; padding: 8px 12px; min-width: 240px; }
.pub-areas { display: flex; gap: 6px; flex-wrap: wrap; }
.pub-areas:empty { display: none; }
.pub-chip { border: 1px solid var(--line-2); background: var(--panel-b); color: var(--tx-2); font: inherit; font-size: 11.5px; font-weight: 600; border-radius: 999px; padding: 5px 12px; cursor: pointer; }
.pub-chip:hover { border-color: var(--acc-hair); color: var(--acc-tx); }
.pub-chip.on { background: var(--acc); border-color: var(--acc); color: #fff; }
.pub-chip-n { font-size: 10px; font-weight: 800; opacity: .8; }
.pub-lista { display: flex; flex-direction: column; gap: 8px; }
.pub-card { background: linear-gradient(180deg, var(--met-hi2, var(--panel-a)) 0%, var(--met-lo2, var(--panel-b)) 100%);
  border: 1px solid var(--line); border-radius: 11px; padding: 10px 12px;
  box-shadow: inset 0 1px 0 var(--met-edge, rgba(255,255,255,.4)), var(--shadow-1); }
.pub-card.aberto { border-color: var(--acc-hair); }
.pub-card-cab { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pub-data { font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--acc-tx); }
.pub-cnj { font-size: 12.5px; font-weight: 600; color: var(--tx); font-variant-numeric: tabular-nums; }
.pub-trib { font-size: 11px; color: var(--tx-3); }
.pub-selos { display: flex; gap: 5px; flex-wrap: wrap; }
.pub-selo { font-size: 9px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; border-radius: 5px; padding: 2px 7px; white-space: nowrap; }
.pub-selo-alta { background: var(--err-bg); color: var(--err-tx); }
.pub-selo-media { background: rgba(214, 154, 63, .16); color: var(--v4-amber, #B8860B); }
.pub-selo-baixa { background: var(--acc-soft); color: var(--acc-tx); }
.pub-selo-area { border: 1px solid var(--acc-hair); color: var(--acc-tx); }
.pub-selo-peca { background: rgba(44, 87, 122, .13); color: #2C577A; }
html[data-tema="escuro"] .pub-selo-peca { color: #8AB4D8; }
.pub-selo-trat { background: var(--acc-soft); color: var(--acc-tx); }
.pub-selo-desc { background: rgba(120, 120, 120, .15); color: var(--tx-3); }
.pub-toggle { margin-left: auto; }
.pub-partes { font-size: 11.5px; color: var(--tx-2); margin-top: 4px; }
.pub-trecho { font-size: 12px; color: var(--tx-3); margin-top: 5px; line-height: 1.5; }
.pub-corpo { margin-top: 8px; display: flex; flex-direction: column; gap: 8px; }
.pub-teor { font-size: 12.5px; color: var(--tx-2); line-height: 1.6; white-space: pre-wrap; background: var(--field-bg); border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; max-height: 340px; overflow-y: auto; scrollbar-width: thin; }
.pub-base { font-size: 11.5px; color: var(--tx-3); }
.pub-acoes { display: flex; gap: 6px; flex-wrap: wrap; }
.pub-del:hover { color: var(--err-tx); border-color: var(--err-vivid); background: var(--err-bg); }
@media (max-width: 900px) { .pub-acoes-topo { margin-left: 0; width: 100%; } .pub-busca { flex: 1; min-width: 0; } }

/* CONTRATOS — LAYOUT "HONORÁRIOS M — FAIXA SUPERIOR" (aprovado pelo Geone, 17/08/2026).
   A lista lateral da Mesa de Minutas saiu: KPIs + FAIXA de filtros no topo (abas de status
   retas + busca + régua de vencimento + pastas, padrão da tela de Processos) e cards em
   LARGURA TOTAL. Clicar num card abre o EDITOR em tela cheia (← Voltar). Serve às duas
   abas do menu: Contratos de honorários e Contratos. */
.ctr-adv-sel { border: 1px solid var(--line-2); background: var(--field-bg); color: var(--tx); border-radius: 10px; padding: 8px 10px; font-size: 12.5px; }
.mm-chip-venc { border-style: dashed; }
.mm-pastas { gap: 5px; }
.mm-selo { display: inline-flex; align-items: center; border-radius: 999px; padding: 2.5px 9px; font-size: 10px; font-weight: 800; letter-spacing: .02em; white-space: nowrap; }
.mm-avencer { background: rgba(214, 154, 63, .16); color: var(--v4-amber, #D69A3F); border: 1px solid rgba(214, 154, 63, .45); }
.mm-venc { background: var(--err-bg); color: var(--err-tx); border: 1px solid var(--err-vivid); }
/* KPIs da faixa */
.ctf-kpis { margin-bottom: 12px; }
.ctf-kpi[data-k] { cursor: pointer; }
.ctf-kpi[data-k]:hover { border-color: var(--acc-hair); }
.ctf-kpi-amb .tile-val { color: var(--v4-amber, #D69A3F); }
.ctf-kpi-venc .tile-val { color: var(--err-tx); }
.ctf-kpi-din { color: var(--acc-tx); }
/* a FAIXA: linha 1 = abas de status retas + busca; linha 2 = vencimento + pastas */
.ctf-faixa { background: linear-gradient(180deg, var(--panel-a), var(--panel-b)); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-1); margin-bottom: 14px; overflow: hidden; }
.ctf-l1 { display: flex; align-items: stretch; flex-wrap: wrap; border-bottom: 1px solid var(--line); }
.ctf-tabs { display: flex; align-items: stretch; flex-wrap: wrap; }
.ctf-tab { border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--tx-2); font: inherit; font-size: 12.5px; font-weight: 700; padding: 0 16px; min-height: 44px; position: relative; white-space: nowrap; cursor: pointer; }
.ctf-tab:hover { background: var(--field-bg); color: var(--tx); }
.ctf-tab.on { color: var(--acc-tx); background: var(--field-bg); }
.ctf-tab.on::after { content: ''; position: absolute; left: 11px; right: 11px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--acc-2); }
.ctf-tab .n { font-size: 11px; font-weight: 600; opacity: .7; margin-left: 4px; }
.ctf-tab-pend { color: var(--v4-amber, #D69A3F); }
.ctf-busca { flex: 1; display: flex; align-items: center; gap: 8px; padding: 6px 12px; min-width: 200px; }
.ctf-busca input[type="search"] { flex: 1; min-width: 120px; border: 1px solid var(--line-2); background: var(--field-bg); color: var(--tx); border-radius: 10px; padding: 8px 12px; font: inherit; font-size: 12.5px; }
.ctf-l2 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 12px; }
.ctf-rot { font-size: 9.5px; font-weight: 800; letter-spacing: .1em; color: var(--tx-3); text-transform: uppercase; }
.ctf-venc { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.ctf-chip-amb { color: var(--v4-amber, #D69A3F); border-color: var(--v4-amber, #D69A3F); }
.ctf-chip-amb.ativo { background: var(--v4-amber, #D69A3F); border-style: solid; color: #fff; }
.ctf-chip-venc { color: var(--err-tx); border-color: var(--err-vivid); }
.ctf-chip-venc.ativo { background: var(--err-vivid); border-style: solid; color: #fff; }
.ctf-sep { width: 1px; align-self: stretch; background: var(--line); margin: 2px 4px; }
/* cards em largura total, com friso de estado à esquerda */
.ctf-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 12px; }
.ctf-card { position: relative; display: flex; flex-direction: column; gap: 7px; text-align: left; border: 1px solid var(--line); background: linear-gradient(180deg, var(--panel-a), var(--panel-b)); border-radius: 13px; padding: 12px 14px 11px 16px; cursor: pointer; color: var(--tx); box-shadow: var(--shadow-1); transition: border-color .12s, box-shadow .12s; }
.ctf-card:hover { border-color: var(--acc-hair); box-shadow: var(--shadow-2); }
.ctf-card.sel { border-color: var(--acc); }
.ctf-card::before { content: ''; position: absolute; left: 0; top: 11px; bottom: 11px; width: 4px; border-radius: 0 4px 4px 0; background: var(--acc-2); }
.ctf-card.fr-avencer::before { background: var(--v4-amber, #D69A3F); }
.ctf-card.fr-venc::before { background: var(--err-vivid); }
.ctf-card.fr-minuta::before { background: var(--tx-3); }
.ctf-card.fr-enc::before { background: var(--line-2); }
.ctf-l1c { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ctf-l1c .st-pill { font-size: 10px; padding: 2.5px 9px; }
.ctf-kebab { margin-left: auto; font-size: 15px; font-weight: 800; padding: 2px 8px; }
.ctf-tipo { font-size: 9.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; border-radius: 6px; padding: 3px 8px; border: 1px solid var(--line-2); background: var(--field-bg); color: var(--tx-2); white-space: nowrap; max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
/* cores dos tipos em VARIÁVEL, com par mais claro no tema escuro (contraste — revisão 17/08) */
:root { --ctf-exito: #7A56A8; --ctf-misto: #64609E; --ctf-contratual: #3E6C93; }
html[data-tema="escuro"] { --ctf-exito: #B79BDD; --ctf-misto: #A5A1D6; --ctf-contratual: #8AB4D8; }
.ctf-tipo.t-exito { border-color: var(--ctf-exito); color: var(--ctf-exito); }
.ctf-tipo.t-misto { border-color: var(--ctf-misto); color: var(--ctf-misto); }
.ctf-tipo.t-contratual { border-color: var(--ctf-contratual); color: var(--ctf-contratual); }
.ctf-tipo.t-consulta { border-color: var(--acc-2); color: var(--acc-tx); }
.ctf-tipo.t-hora { border-color: var(--v4-amber, #D69A3F); color: var(--v4-amber, #D69A3F); }
.ctf-tipo.t-sucumbencia { border-color: var(--line-2); color: var(--tx-2); }
.ctf-tit { font-size: 13.5px; font-weight: 800; line-height: 1.3; }
.ctf-meta { font-size: 11.5px; color: var(--tx-3); }
.ctf-num { font-variant-numeric: tabular-nums; color: var(--acc-tx); }
.ctf-fin { border-top: 1px solid var(--line); padding-top: 7px; display: flex; flex-direction: column; gap: 5px; margin-top: auto; }
.ctf-fin-l1 { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.ctf-val { font-size: 14.5px; font-weight: 800; font-variant-numeric: tabular-nums; }
.ctf-parc { font-size: 11px; font-weight: 700; color: var(--tx-2); }
.ctf-prox { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--tx-3); white-space: nowrap; }
.ctf-prox.venc { color: var(--err-tx); }
.ctf-barra { display: block; height: 6px; border-radius: 999px; background: var(--field-bg); border: 1px solid var(--line); overflow: hidden; }
.ctf-barra i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--acc), var(--acc-2)); }
.ctf-barra.venc i { background: var(--err-vivid); }
.ctf-rodape-tx { font-size: 10.5px; color: var(--tx-3); }
.ctf-resp { display: flex; align-items: center; gap: 6px; }
/* editor em tela cheia */
.ctf-ed { margin-top: 4px; }
.ctf-voltar { font-weight: 700; white-space: nowrap; }
.ctf-honmeta { border-top: 1px dashed var(--line); padding-top: 9px; }
.ctf-parc-resumo { font-size: 12.5px; color: var(--tx-2); margin-bottom: 10px; }
.ctf-parc-tab .mm-selo { font-size: 9.5px; }
.ctf-selo-ok { background: color-mix(in srgb, var(--acc) 16%, transparent); color: var(--acc-tx); border: 1px solid var(--acc-hair); }
.ctf-selo-prev { background: var(--field-bg); color: var(--tx-2); border: 1px solid var(--line-2); }
.ctf-tr-venc td { color: var(--err-tx); }
/* modal Novo contrato: cartões de tipo de honorário + caixas condicionais */
.ctf-tipos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ctf-tp { position: relative; display: flex; flex-direction: column; gap: 3px; border: 1px solid var(--line); background: var(--field-bg); border-radius: 11px; padding: 10px 11px 9px; cursor: pointer; }
.ctf-tp:hover { border-color: var(--acc-hair); }
.ctf-tp.on { border-color: var(--acc); box-shadow: var(--shadow-1); }
.ctf-tp.on::after { content: '✓'; position: absolute; top: 7px; right: 9px; width: 17px; height: 17px; border-radius: 50%; background: var(--acc); color: #fff; font-size: 10.5px; font-weight: 800; display: grid; place-items: center; }
.ctf-tp-mini { font-size: 8.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--acc-tx); }
.ctf-tp-nome { font-size: 12.5px; font-weight: 800; color: var(--tx); }
.ctf-tp-desc { font-size: 10.5px; color: var(--tx-3); line-height: 1.35; text-transform: none; letter-spacing: 0; }
.ctf-parc-caixa { border: 1px solid var(--line); border-radius: 11px; background: var(--panel-b); padding: 10px 12px; }
.ctf-exito-caixa { border: 1px dashed var(--ctf-exito); border-radius: 11px; background: rgba(142, 107, 191, .08); padding: 10px 12px; }
/* editor à direita (herdado da Mesa de Minutas — agora em tela cheia) */
.mm-ed { background: linear-gradient(180deg, var(--panel-a), var(--panel-b)); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-1); min-height: calc(100vh - 190px); display: flex; flex-direction: column; overflow: hidden; }
.mm-head { background: linear-gradient(180deg, var(--met-hi2), var(--met-lo2)); box-shadow: inset 0 1px 0 var(--met-edge); border-bottom: 1px solid var(--line); padding: 11px 14px 0; }
.mm-h1 { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.mm-titulo { flex: 1; min-width: 160px; font: inherit; font-size: 15.5px; font-weight: 800; color: var(--tx); background: transparent; border: 1px solid transparent; border-radius: 8px; padding: 5px 8px; }
.mm-titulo:hover:not(:disabled), .mm-titulo:focus { border-color: var(--line-2); background: var(--field-bg); outline: none; }
.mm-titulo:disabled { color: var(--tx); opacity: 1; }
.mm-acoes { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mm-acoes .btn { padding: 8px 14px; font-size: 11px; }
.mm-acoes .ghbtn { padding: 7px 11px; font-size: 11.5px; }
.mm-h2 { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.mm-vinc { cursor: pointer; font-family: inherit; }
.mm-vinc:hover { border-color: var(--acc-hair); color: var(--acc-tx); }
.mm-falta { color: var(--v4-amber, #D69A3F); border-color: var(--v4-amber, #D69A3F); }
.mm-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 10px; margin-top: 10px; }
.mm-meta .nf label { font-size: 9.5px; }
.mm-meta .nf input, .mm-meta .nf select { width: 100%; font-size: 12px; padding: 6px 8px; }
.mm-vistas { display: flex; gap: 2px; margin-top: 10px; }
.mm-vista { border: 0; background: transparent; color: var(--tx-3); font: inherit; font-size: 11.5px; font-weight: 800; letter-spacing: .04em; padding: 8px 13px 7px; border-bottom: 3px solid transparent; cursor: pointer; }
.mm-vista:hover { color: var(--tx-2); }
.mm-vista.on { color: var(--acc-tx); border-bottom-color: var(--acc-2); }
.mm-corpo { flex: 1; min-height: 0; overflow: auto; padding: 16px; }
/* o "papel": o contrato com cara de documento (claro de propósito nos DOIS temas, como um PDF) */
.mm-papel-wrap { max-width: 820px; margin: 0 auto; }
.mm-papel { display: block; width: 100%; min-height: 560px; resize: vertical; background: #FCFCF7; color: #22271E; border: 1px solid #C7CDBF; border-radius: 4px; box-shadow: var(--shadow-2); padding: 42px 52px; font-family: var(--font-display); font-size: 14px; line-height: 1.72; }
.mm-papel:focus { outline: 2px solid var(--acc-hair); outline-offset: 1px; }
.mm-papel[readonly] { opacity: .92; }
/* vista Arquivo: upload + visualização imediata (048) */
.mm-arq-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.mm-up { cursor: pointer; }
.mm-preview { min-height: 200px; }
.mm-prev-pdf { width: 100%; height: min(72vh, 760px); border: 1px solid var(--line); border-radius: 8px; background: #525659; }
.mm-prev-imgwrap { display: flex; justify-content: center; }
.mm-prev-img { max-width: 100%; max-height: min(72vh, 760px); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow-1); }
.mm-arqs { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.mm-arq { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: var(--panel-b); border-radius: 9px; padding: 7px 10px; }
.mm-arq.on { border-color: var(--acc-hair); }
@media (max-width: 1080px) {
  .mm-ed { min-height: 60vh; }
  .mm-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ctf-cards { grid-template-columns: 1fr; }
  .ctf-tipos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ctf-l1 { flex-direction: column; }
  .ctf-tab { min-height: 40px; text-align: left; }
  .ctf-tabs { border-bottom: 1px solid var(--line); }
}
/* painel de contratos de honorários no Financeiro */
.fin-hc-kpis { margin-bottom: 10px; }
.fin-cts { display: flex; flex-direction: column; gap: 6px; }
.fin-ct { display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); background: var(--panel-b); border-radius: 9px; padding: 8px 11px; cursor: pointer; }
.fin-ct:hover { background: var(--field-bg); border-color: var(--acc-hair); }

/* PASTAS pessoais (043, 14/08/2026) — ao lado das abas Meus/Ativos/Arquivados/Tutela */
.proc-pastas { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.proc-tab.pasta { display: inline-flex; align-items: center; gap: 6px; background: var(--field-bg); border: 1px solid var(--line-2); color: var(--tx-2); border-radius: 8px; padding: 6px 12px; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.proc-tab.pasta:hover { color: var(--tx); border-color: var(--acc-hair); }
.proc-tab.pasta.ativo { background: var(--acc); color: #fff; border-color: transparent; }
.proc-tab-n { font-size: 10.5px; font-weight: 700; opacity: .75; }
.proc-pasta-nova { padding: 7px 14px; border-radius: 8px; font-size: 11.5px; }
.proc-tab.ger { border: none; background: transparent; color: var(--tx-3); padding: 6px 8px; font-size: 13px; cursor: pointer; }
.proc-tab.ger:hover { color: var(--tx); }

/* painel de filtros recolhível */
/* (06/10) a faixa de filtros (.proc-filtros-painel / .fp-*) saiu: os filtros viraram o menu
   compacto .filtros-menu, que desce do botão como o "Ações ▾" */

/* tabela de processos */
.proc-tabela-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); background: var(--panel-b); }
.proc-tabela { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 900px; }
.proc-tabela thead th { text-align: left; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--tx-3); padding: 13px 14px; background: var(--thead-bg); border-bottom: 1px solid var(--line); white-space: nowrap; }
.proc-tabela th.th-fav { width: 34px; padding-right: 0; }
.proc-tabela th.th-acoes { text-align: center; width: 60px; }
.proc-lin { border-bottom: 1px solid var(--line); cursor: pointer; transition: background .12s; }
.proc-lin:last-child { border-bottom: none; }
.proc-lin:hover { background: var(--hover-acc, var(--field-bg)); }
.proc-tabela td { padding: 12px 14px; vertical-align: middle; color: var(--tx-2); }
.td-fav { padding-right: 0; }
.lin-star { color: var(--line-2); font-size: 15px; }
.lin-star.on { color: #D6A93F; }
.td-proc b { color: var(--tx); font-weight: 700; font-variant-numeric: tabular-nums; }
.td-proc .td-sub, .td-sub { display: block; font-size: 11.5px; color: var(--tx-3); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
/* Autor × réu embaixo do número (01/08/2026). Mesmo cinza da vara/comarca por pedido do
   Geone — o autor só um tom mais firme, para o olho achar o polo ativo primeiro. Nome de
   parte é longo (razão social inteira), então a largura aqui é maior que a do td-sub. */
/* 360px: medido no navegador com "MARIA APARECIDA DOS SANTOS × BANCO SANTANDER BRASIL S/A"
   (a linha real do Geone), que precisa de 357px. Em 330px o réu cortava; em 360px a coluna
   Processo cresce só 19px, a tabela não transborda e nomes maiores seguem com reticências. */
.td-proc .td-partes { display: block; font-size: 11.5px; color: var(--tx-3); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 360px; }
.td-partes .pt-a { color: var(--tx-2); font-weight: 600; }
.td-partes .pt-x { opacity: .65; margin: 0 5px; }
/* separador NEUTRO para partes sem polo conhecido: não pode parecer o "×" de autor × réu */
.td-partes .pt-sep { opacity: .5; margin: 0 6px; }
.td-proc .td-sub { max-width: 360px; }
/* Tribunal (sigla do nº CNJ) com a região embaixo, menor */
.td-trib { font-size: 11.5px; font-weight: 700; color: var(--tx-2); letter-spacing: .04em; white-space: nowrap; }
.td-trib s { display: block; font-size: 10.5px; font-weight: 500; color: var(--tx-3); text-decoration: none; letter-spacing: 0; }
.proc-tabela td b { color: var(--tx); }
.lin-etqs { display: inline-flex; gap: 3px; margin-left: 7px; vertical-align: middle; }
.lin-etq { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.lin-adv { display: inline-flex; align-items: center; gap: 8px; }
.lin-avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--acc-glow); color: var(--acc-tx); font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.st-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; padding: 3px 11px; border-radius: 999px; white-space: nowrap; }
.st-pill i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.st-ativo { color: var(--ok-tx); background: var(--ok-bg); }
.st-suspenso { color: var(--v4-amber); background: rgba(214,154,63,.14); }
.st-arquivado { color: var(--tx-3); background: var(--field-bg); }
.st-encerrado { color: var(--tx-2); background: var(--field-bg); }
.td-mov { color: var(--tx); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.td-acoes { text-align: center; }
.lin-acoes { border: none; background: transparent; color: var(--tx-3); border-radius: 8px; width: 30px; height: 30px; }
.lin-acoes:hover { background: var(--field-bg); color: var(--tx); }
.lin-acoes svg.i { width: 18px; height: 18px; }
.proc-tvazio { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 30px 20px; color: var(--tx-3); }
.proc-tvazio svg.i { width: 34px; height: 34px; opacity: .5; }
.proc-tvazio b { font-size: 15px; color: var(--tx); }
.proc-tvazio span { font-size: 13px; }

/* rodapé / paginação */
.proc-rodape { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 14px 2px 4px; }
.pg-info { font-size: 12.5px; color: var(--tx-3); }
.pg-nav { display: flex; align-items: center; gap: 6px; }
.pg-porpag select { border: 1px solid var(--line-2); background: var(--field-bg); color: var(--tx-2); border-radius: 9px; padding: 7px 10px; font-size: 12px; font-weight: 600; margin-right: 6px; }
.pg-btn { min-width: 32px; height: 32px; border: 1px solid var(--line-2); background: var(--panel-b); color: var(--tx-2); border-radius: 9px; font-size: 12.5px; font-weight: 700; padding: 0 8px; }
.pg-btn:hover:not(:disabled) { border-color: var(--acc-hair); color: var(--tx); }
.pg-btn.ativo { background: var(--acc); color: #fff; border-color: transparent; }
.pg-btn:disabled { opacity: .4; }
.pg-reti { color: var(--tx-3); padding: 0 2px; }
@media (max-width: 1200px) { .proc-top { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .ag2-corpo { grid-template-columns: 1fr; } .ag2-diabox { border-left: none; border-top: 1px solid var(--line); } }
@media (max-width: 560px) { .proc-kpis { grid-template-columns: 1fr; } }

/* (06/10) os chips de etiqueta da faixa de filtros (.pe-chip/.pe-nova/.pe-ger) saíram com a
   faixa; o .pe-dot continua, dentro dos menus (.etq-op .pe-dot) */

/* etiqueta em forma de "pílula" — usada nos cards e na ficha */
.etq-tag {
  display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: var(--tx-2);
  background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 999px; padding: 3px 10px;
}
.etq-tag .pe-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ecor, #5F6B72); flex: none; }

/* faixa de etiquetas dentro da ficha do processo */
.dw-etqs { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 8px 0 2px; }
.dw-etqs .etq-tag { padding-right: 5px; }
.etq-x { margin-left: 2px; border: none; background: transparent; color: var(--tx-3); font-size: 15px; line-height: 1; cursor: pointer; padding: 0 2px; }
.etq-x:hover { color: var(--err-vivid); }
.etq-add { border: 1px dashed var(--acc-soft); background: transparent; color: var(--acc-tx); border-radius: 999px; padding: 3px 11px; font-size: 11px; font-weight: 700; cursor: pointer; }
.etq-add:hover { background: var(--acc-glow); }

/* menu flutuante de marcar etiqueta (na ficha) */
.etq-menu {
  position: fixed; z-index: 60; min-width: 210px; max-height: 320px; overflow: auto;
  background: var(--modal-a); border: 1px solid var(--line-2); border-radius: 12px; box-shadow: var(--shadow-2); padding: 6px;
  display: flex; flex-direction: column; gap: 2px;
}
.etq-op { display: flex; align-items: center; gap: 8px; text-align: left; border: none; background: transparent; color: var(--tx); border-radius: 8px; padding: 8px 10px; font-size: 13px; font-weight: 500; cursor: pointer; }
.etq-op:hover { background: var(--field-bg); }
.etq-op.on { font-weight: 700; }
.etq-op .pe-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--ecor, #5F6B72); flex: none; }
.etq-op.nova { color: var(--acc-tx); font-weight: 700; border-top: 1px solid var(--line); margin-top: 2px; padding-top: 9px; }
.etq-menu-vazio { color: var(--tx-3); font-size: 12px; padding: 8px 10px; }
/* menu ⋮ de AÇÕES do processo (status / etiquetar / classificar / mover para pasta / tutela / segredo) */
.acoes-proc { min-width: 232px; }
.acoes-proc .etq-lab { font-size: 10.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--tx-3); font-weight: 700; padding: 8px 10px 3px; }
.acoes-proc .etq-sep { height: 1px; background: var(--line); margin: 5px 4px; }
.acoes-proc .etq-op.etq-sub { padding-left: 20px; font-weight: 500; }
.acoes-proc .etq-op.etq-sub.on { font-weight: 700; color: var(--acc-tx); }
.acoes-proc .etq-ok { margin-left: auto; color: var(--acc-tx); }

/* formulário de nova etiqueta + gerência */
.etq-form { display: flex; flex-direction: column; gap: 14px; }
.etq-cores { display: flex; gap: 8px; flex-wrap: wrap; }
.etq-cores.mini { gap: 5px; }
.etq-cor { width: 26px; height: 26px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; padding: 0; }
.etq-cores.mini .etq-cor { width: 18px; height: 18px; }
.etq-cor.sel { border-color: var(--tx); box-shadow: 0 0 0 2px var(--panel-a) inset; }
.etq-ger { display: flex; flex-direction: column; gap: 10px; max-height: 60vh; overflow: auto; }
.etq-ger-lin { display: flex; align-items: center; gap: 10px; }
.etq-ger-nome { flex: 1; min-width: 90px; border: 1px solid var(--line-2); background: var(--field-bg); color: var(--tx); border-radius: 8px; padding: 6px 10px; font-size: 13px; }
.etq-ger-n { font-size: 11px; color: var(--tx-3); font-weight: 700; min-width: 18px; text-align: center; }
.etq-ger-del { border: none; background: transparent; cursor: pointer; font-size: 14px; opacity: .7; }
.etq-ger-del:hover { opacity: 1; }
/* PASTAS RESTRITAS (056): lista de acesso no "Nova pasta" (admin), botão 👥 no Gerenciar e nome
   somente-leitura para pasta que a pessoa vê mas não criou */
.ps-tit { display: block; font-size: 9.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--tx-3); margin-bottom: 4px; }
.ps-dica { font-size: 12px; color: var(--tx-2); line-height: 1.45; margin: 4px 0 8px; }
.ps-acessos { margin-top: 12px; }
.ps-lista { max-height: 38vh; overflow: auto; padding: 2px 0; }
.ps-susp { color: var(--tx-3); font-weight: 400; }
.ps-fs { border: none; margin: 0; padding: 0; min-width: 0; }
.etq-n { margin-left: auto; font-size: 10.5px; color: var(--tx-3); font-weight: 600; white-space: nowrap; }
/* FILTROS como menu compacto (06/10) + SANFONA dentro dos menus flutuantes (19 áreas) */
.filtros-menu { min-width: 250px; max-height: min(72vh, 600px); }
.etq-acc { width: 100%; }
.etq-acc .etq-caret { margin-left: 8px; width: 0; height: 0; flex: none; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid var(--tx-3); transition: transform .15s; }
.etq-acc[aria-expanded="true"] .etq-caret { transform: rotate(180deg); }
.etq-acc-corpo { display: flex; flex-direction: column; gap: 2px; margin-left: 10px; padding-left: 6px; border-left: 2px solid var(--line); }
.etq-acc-corpo[hidden] { display: none; }
.etq-op.etq-perigo { color: var(--err-tx); }
/* COMUNICADOS (059): banner da plataforma no topo do sistema + formulário no Console */
.comunicados-topo { z-index: 790; }
.cmn-banner { display: flex; align-items: center; gap: 14px; padding: 10px 16px 10px 14px; background: var(--panel-b); border-left: 4px solid var(--acc); border-bottom: 1px solid var(--line); color: var(--tx); font-size: 13px; }
.cmn-txt { flex: 1; min-width: 0; }
.cmn-txt strong { display: block; margin-bottom: 2px; font-size: 13.5px; }
.cmn-corpo p { margin: 0 0 4px; color: var(--tx-2); line-height: 1.45; }
.cmn-corpo a { color: var(--acc-tx); font-weight: 700; }
.cmn-corpo.recolhido > p:nth-child(n+3) { display: none; } /* recolhido = 2 primeiros parágrafos ("Olá!" + o aviso) */
.cmn-mais { border: none; background: transparent; color: var(--acc-tx); font: inherit; font-size: 12px; font-weight: 700; padding: 0; cursor: pointer; }
.cmn-btn { flex: none; font-size: 12px; font-weight: 700; color: #fff; background: var(--acc); border-radius: 7px; padding: 7px 13px; text-decoration: none; white-space: nowrap; }
.cmn-btn:hover { filter: brightness(1.08); }
.cmn-x { flex: none; border: none; background: transparent; color: var(--tx-3); font-size: 22px; line-height: 1; cursor: pointer; padding: 2px 6px; }
.cmn-x:hover { color: var(--tx); }
.cmn-form { display: grid; gap: 10px; min-width: min(640px, 90vw); }
.cmn-form textarea { width: 100%; min-height: 190px; font: inherit; font-size: 13px; line-height: 1.5; border: 1px solid var(--line-2); background: var(--field-bg); color: var(--tx); border-radius: 8px; padding: 8px 10px; resize: vertical; }
.cmn-modelo { display: flex; align-items: center; gap: 8px; }
.cmn-canais { display: flex; gap: 18px; flex-wrap: wrap; }
.cmn-previa { width: min(640px, 90vw); height: 560px; border: 1px solid var(--line-2); border-radius: 10px; background: #EDF0F3; }
@media (max-width: 640px) { .cmn-banner { flex-wrap: wrap; } .cmn-btn { order: 3; } }
.etq-ger-ro { flex: 1; min-width: 90px; font-size: 13px; color: var(--tx-2); padding: 6px 10px; }
.etq-ger-acc { border: 1px solid var(--line-2); background: transparent; color: var(--tx-2); border-radius: 8px;
  padding: 3px 8px; font-size: 11.5px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.etq-ger-acc:hover { color: var(--tx); border-color: var(--acc); }

/* Painel do processo — modal CENTRALIZADO e amplo */
.drawer-ov {
  position: fixed; inset: 0; z-index: 1600; background: var(--overlay);
  backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center;
  padding: 4vh 20px; opacity: 0; transition: opacity .2s;
}
.drawer-ov.aberto { opacity: 1; }
.drawer {
  width: min(720px, 94vw); max-height: 90vh; display: flex; flex-direction: column; overflow: hidden;
  background: linear-gradient(180deg, var(--modal-a), var(--modal-b));
  backdrop-filter: saturate(170%) blur(26px);
  border: 1px solid var(--line-2); border-radius: 20px; box-shadow: var(--shadow-2), 0 0 46px var(--acc-glow);
  transform: translateY(14px) scale(.99); transition: transform .25s cubic-bezier(.2, .8, .3, 1);
}
.drawer-ov.aberto .drawer { transform: none; }
.dw-head { flex: 0 0 auto; padding: 18px 26px 0; border-bottom: 1px solid var(--line); background: var(--modal-a); }
.dw-head-top { display: flex; align-items: center; gap: 10px; }
.dw-x { margin-left: auto; background: none; border: none; color: var(--tx-3); padding: 6px; border-radius: 8px; }
.dw-x:hover { color: var(--tx); background: var(--hover-acc); }
.dw-tipo { font-size: 19px; font-weight: 600; color: var(--tx); margin: 12px 0 6px; letter-spacing: .01em; }
.dw-proc { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--tx-2); margin-bottom: 12px; }
.dw-proc strong { color: var(--tx); font-variant-numeric: tabular-nums; letter-spacing: .01em; }
.dw-copy { background: none; border: none; color: var(--tx-3); padding: 2px; cursor: pointer; display: grid; place-items: center; }
.dw-copy:hover { color: var(--acc-tx); }
.dw-copy svg.i { width: 15px; height: 15px; }
.dw-org { color: var(--tx-3); font-size: 12px; }
.dw-abas { display: flex; gap: 2px; }
.dw-aba { background: none; border: none; border-bottom: 2px solid transparent; color: var(--tx-3); font-size: 13px; font-weight: 600; padding: 9px 15px; }
.dw-aba:hover { color: var(--acc-tx); }
.dw-aba.ativo { color: var(--acc-tx); border-bottom-color: var(--acc-2); }
.dw-body { flex: 1 1 auto; min-height: 0; padding: 22px 26px 44px; overflow-y: auto; }
.dw-tl-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 16px; }
.dw-tl-titulo { font-size: 10.5px; text-transform: uppercase; letter-spacing: .2em; color: var(--tx-3); font-weight: 700; }
.dw-dj-cab { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.dw-dj-meta { font-size: 12px; color: var(--tx-2); }
.dw-dj-sync { margin-left: auto; font-size: 10.5px; color: var(--tx-3); }
.dw-dj-assuntos { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 18px; }
.dw-loading, .dw-vazio { color: var(--tx-3); font-size: 13px; padding: 14px 2px; }
.teor-box.grande { max-height: none; font-size: 13.5px; line-height: 1.6; }

.tl { list-style: none; position: relative; margin: 0; padding: 2px 0 0 6px; }
.tl::before { content: ''; position: absolute; left: 4px; top: 6px; bottom: 6px; width: 2px; background: var(--line-2); }
.tl-item { position: relative; padding: 0 0 16px 20px; }
.tl-item::before { content: ''; position: absolute; left: 0; top: 5px; width: 9px; height: 9px; border-radius: 50%; background: var(--acc-2); border: 2px solid var(--badge-ring); box-sizing: content-box; margin-left: -0.5px; }
.tl-data { display: block; font-size: 11px; color: var(--tx-3); font-variant-numeric: tabular-nums; }
.tl-nome { display: block; font-size: 13.5px; color: var(--tx); margin-top: 1px; line-height: 1.4; }

@media (max-width: 640px) {
  .drawer-ov { padding: 2vh 10px; }
  .drawer { width: 96vw; max-height: 94vh; }
  .dw-head { padding: 14px 16px 0; }
  .dw-body { padding: 18px 16px 40px; }
}

@media (max-width: 640px) {
  .topo-user { display: none; }
  .vitrine-blocos { grid-template-columns: 1fr; }
  .pagina-titulo { font-size: 20px; }
}

/* ============================================================
   LAYOUT v4 — menu no topo + Painel (KPIs, tabela, áreas)
   ============================================================ */
.topnav { position: sticky; top: 0; z-index: 900; background: var(--topo-bg); border-bottom: 1px solid var(--line); backdrop-filter: var(--blur); }
.topnav-in { max-width: none; margin: 0; height: 58px; display: flex; align-items: center; gap: 16px; padding: 0 clamp(20px, 4vw, 140px); }
.topnav-brand { display: flex; align-items: center; gap: 9px; text-decoration: none; color: var(--tx); flex: none; }
.topnav-logo { width: 26px; height: 26px; display: grid; place-items: center; color: var(--acc-tx); }
.topnav-logo .logo-img { width: 26px; height: 26px; object-fit: contain; }
.topnav-logo svg.emblema { width: 24px; height: 24px; color: var(--acc-tx); }
.topnav-logo:has(img.logo-img) svg.emblema { display: none; }
.topnav-name { font-weight: 700; font-size: 16px; letter-spacing: .01em; }
.topnav-menu { display: flex; gap: 2px; }
.top-item { position: relative; font-size: 13px; font-weight: 600; color: var(--tx-2); background: none; border: none; padding: 7px 13px; border-radius: 8px; white-space: nowrap; flex: none; }
.top-item:hover { background: var(--field-bg); color: var(--tx); }
.top-item.ativo { background: var(--hover-acc); color: var(--tx); font-weight: 800; }
.topnav-spacer { flex: 1; }
.topnav-search { display: flex; align-items: center; gap: 8px; width: 230px; background: var(--field-bg); border: 1px solid var(--line); border-radius: 8px; padding: 6px 12px; color: var(--tx-3); }
.topnav-search svg.i { width: 14px; height: 14px; flex: none; }
.topnav-search input { flex: 1; min-width: 0; border: none; outline: none; background: transparent; font: inherit; font-size: 12.5px; color: var(--tx); }
.topo-btn.ic { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: none; border: 1px solid transparent; color: var(--tx-2); position: relative; padding: 0; }
.topo-btn.ic:hover { background: var(--field-bg); color: var(--tx); }
.topo-btn.ic svg.i { width: 19px; height: 19px; }
.plano-chip { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--tx-3); background: transparent; border: 1px solid var(--line-2); border-radius: 999px; padding: 4px 11px; white-space: nowrap; }
.topnav-user { display: flex; align-items: center; gap: 9px; flex: none; }
.topnav-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--field-bg); border: 1px solid var(--line-2); display: grid; place-items: center; font-size: 12px; font-weight: 800; color: var(--tx-2); }
.topnav-user-tx { display: flex; flex-direction: column; line-height: 1.2; max-width: 150px; }
.topnav-user-tx > #topo-user { font-size: 12.5px; font-weight: 700; color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topnav-esc { font-size: 11px; color: var(--tx-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topo-btn.sair { background: none; border: 1px solid var(--line-2); color: var(--tx-2); font-size: 12px; font-weight: 700; padding: 7px 12px; border-radius: 8px; }
.topo-btn.sair:hover { border-color: var(--err-vivid); color: var(--err-vivid); }
.topnav-burger { display: none; background: none; border: none; color: var(--tx-2); padding: 6px; }
.topnav-burger svg.i { width: 22px; height: 22px; }
.top-sair { display: none; }
/* vermelho/âmbar mais claros no tema escuro (contraste WCAG sobre o navy) */
html[data-tema="escuro"] { --v4-red: #E8746B; --v4-amber: #E6B85C; }

/* sino ancorado no topo à direita */
.sino-box { position: fixed; top: 62px; right: 20px; z-index: 950; }

/* Painel v4 */
.pnl-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.pnl-ola { font-size: 18px; font-weight: 700; letter-spacing: -.01em; color: var(--tx); }
.pnl-sub { font-size: 12.5px; color: var(--tx-3); margin-top: 3px; }
.pnl-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.v4btn { font-size: 12px; font-weight: 700; color: var(--tx-2); background: var(--panel-a); border: 1px solid var(--line-2); border-radius: 8px; padding: 8px 14px; white-space: nowrap; }
.v4btn:hover { border-color: var(--acc-hair); color: var(--tx); }
.v4btn.primary { color: #fff; background: var(--acc); border-color: var(--acc); }
.v4btn.primary:hover { filter: brightness(1.07); }

.card-v4 { background: var(--panel-a); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-1); }

.kpis { display: flex; background: var(--panel-a); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-1); margin-bottom: 16px; overflow: hidden; }
.kpi { flex: 1; padding: 15px 20px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.kpi:last-child { border-right: none; }
.kpi-lbl { font-size: 10px; font-weight: 700; letter-spacing: .1em; color: var(--tx-3); text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi-row { display: flex; align-items: baseline; gap: 7px; }
.kpi-val { font-size: 26px; font-weight: 700; line-height: 1; color: var(--tx); font-variant-numeric: tabular-nums; }
.kpi-sub { font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.kpi-red { color: var(--v4-red); } .kpi-amber { color: var(--v4-amber); } .kpi-green { color: var(--acc-tx); } .kpi-muted { color: var(--tx-3); }

/* cores de prazo (geradas por 'rp-'+cor no cockpit da área) */
.rp-red { color: var(--v4-red); } .rp-amber { color: var(--v4-amber); } .rp-green { color: var(--acc-tx); } .rp-muted { color: var(--tx-2); }

/* ---- Painel · Sala de Controle: radar vivo — SEGUE o tema dia/noite ---- */
/* v6: superfície metálica — degradê sólido + fio de luz na aresta. Igual nos dois temas
   (os tokens --met-* é que mudam); o brilho verde no canto saiu. */
.pnl.sala {
  border-radius: 16px;
  padding: 16px 18px 18px;
  color: var(--tx);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, var(--met-hi) 0%, var(--met-lo) 62%, var(--met-lo) 100%);
  box-shadow: inset 0 1px 0 var(--met-edge), var(--shadow-2);
}

.sc-link { font: inherit; font-size: 11.5px; font-weight: 700; color: var(--acc-tx); background: none; border: none; cursor: pointer; padding: 2px 5px; border-radius: 6px; }
.sc-link:hover { text-decoration: underline; }
.sc-link:focus-visible,
.pnl.sala .v4btn:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }

/* Próximos prazos · esteira "ao vivo": os cartões classificados pelo robô rolam pra cima
   em loop; pausa no hover/foco e para de vez com "movimento reduzido". */
/* altura fixa ~3 cartões (não estica p/ acompanhar o radar — evita caixa alta e vão ao lado) */
.sc-vazio { padding: 26px 10px; text-align: center; color: var(--tx-3); font-size: 12.5px; line-height: 1.55; }

.secao-v4 { display: flex; align-items: center; gap: 12px; margin: 4px 0 12px; }
.secao-v4 span { font-size: 11px; font-weight: 800; letter-spacing: .14em; color: var(--tx-3); text-transform: uppercase; white-space: nowrap; }
.secao-v4 i { flex: 1; height: 1px; background: var(--line); }


/* Faixa "Acessos": UMA fileira de botões compactos (Processos ativo + reservas).
   Substitui a antiga grade de áreas — mais baixa, tudo lado a lado no desktop. */


/* ===================== CLIENTES ===================== */
.cli-barra { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 4px 0 16px; }
.cli-busca { flex: 1; min-width: 200px; padding: 10px 14px; border-radius: 10px; border: 1px solid var(--line); background: var(--field-bg); color: var(--tx); font-size: 14px; }
.cli-busca:focus { outline: none; border-color: var(--acc); background: var(--field-bg-focus); }
.cli-filtros { display: flex; gap: 6px; }
.cli-vista { display: flex; gap: 4px; margin-left: auto; }
.cli-vbtn { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 9px; background: var(--panel-a); color: var(--tx-3); }
.cli-vbtn svg.i { width: 18px; height: 18px; }
.cli-vbtn.ativo { border-color: var(--acc-hair); background: var(--hover-acc); color: var(--acc-tx); }
.cli-tag { font-size: 9.5px; font-weight: 700; letter-spacing: .04em; padding: 2px 6px; border-radius: 5px; vertical-align: middle; }
.cli-tag-pf { background: var(--ok-bg); color: var(--ok-tx); }
.cli-tag-pj { background: color-mix(in srgb, var(--acc) 10%, transparent); color: var(--acc-tx); border: 1px solid var(--acc-soft); }

.cli-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 12px; }
.cli-card { display: flex; gap: 13px; align-items: center; text-align: left; background: var(--panel-a); border: 1px solid var(--line); border-radius: 12px; padding: 15px 16px; min-width: 0; transition: border-color .15s, box-shadow .15s, transform .15s; }
.cli-card:hover { border-color: var(--acc); box-shadow: 0 6px 16px color-mix(in srgb, var(--acc) 9%, transparent); transform: translateY(-2px); }
.cli-av { width: 44px; height: 44px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: 14px; font-weight: 700; color: var(--acc-tx); background: var(--acc-soft); }
.cli-card-b { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cli-nome { font-size: 14px; font-weight: 700; color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cli-meta { font-size: 12px; color: var(--tx-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cli-chips { display: flex; gap: 5px; margin-top: 3px; }
.cli-chip { font-size: 10px; font-weight: 700; color: var(--tx-2); background: var(--hover-acc); border-radius: 20px; padding: 2px 8px; }

.cli-tabelawrap { border: 1px solid var(--line); border-radius: var(--radius); overflow-x: auto; background: var(--panel-a); }
.cli-tabela { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.cli-tabela th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--tx-3); font-weight: 700; padding: 11px 14px; border-bottom: 1px solid var(--line); background: var(--thead-bg); }
.cli-tabela td { padding: 12px 14px; border-bottom: 1px solid var(--line); color: var(--tx-2); }
.cli-tabela tr:last-child td { border-bottom: none; }
.cli-tabela tbody tr { cursor: pointer; }
.cli-tabela tbody tr:hover { background: var(--hover-acc); }
.cli-tabela .r { text-align: right; }

.cli-abas { margin: 6px 0 16px; }
.cli-del-btn { color: var(--err-vivid); }
.cli-ficha-card { background: var(--panel-a); border: 1px solid var(--line); border-radius: var(--radius); padding: 6px 20px; }
.cli-kv { display: flex; gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.cli-kv:last-child { border-bottom: none; }
.cli-kv > span:first-child { flex: none; width: 128px; color: var(--tx-3); font-size: 12.5px; padding-top: 1px; }
.cli-kv > span:last-child { color: var(--tx); }
.cli-kv-obs > span:last-child { white-space: pre-wrap; line-height: 1.55; }

.cli-anexos-topo { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.cli-anexos-dica { flex: 1; min-width: 180px; font-size: 12.5px; color: var(--tx-3); }
.cli-link-form { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.cli-link-form input { flex: 1; min-width: 150px; padding: 10px 13px; border-radius: 10px; border: 1px solid var(--line); background: var(--field-bg); color: var(--tx); font-size: 14px; }
.cli-link-form input:focus { outline: none; border-color: var(--acc); background: var(--field-bg-focus); }

.cli-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 14px; }
.cli-form-grid .nf { margin: 0; }
.cli-form-grid .cf-full, .cli-form-grid .cf-tipo { grid-column: 1 / -1; }
.uiOverlay:has(.cli-form-grid) .uiModal { max-width: 620px; width: 94vw; }

@media (max-width: 620px) {
  .cli-form-grid { grid-template-columns: 1fr; }
  .cli-vista { margin-left: 0; }
}


/* responsivo do layout v4 */
@media (max-width: 900px) {
  .topnav-in { gap: 8px; }
  .topnav-menu { position: absolute; top: 58px; left: 0; right: 0; flex-direction: column; background: var(--topo-bg); border-bottom: 1px solid var(--line); padding: 8px; gap: 4px; display: none; box-shadow: var(--shadow-2); }
  .topnav.nav-aberta .topnav-menu { display: flex; }
  .top-item { width: 100%; text-align: left; }
  .topnav-search, .topnav-user-tx, .plano-chip, #btn-sair { display: none; }
  .top-sair { display: block; color: var(--err-vivid); }
  .topnav-burger { display: grid; place-items: center; }
}
@media (max-width: 760px) {
  .kpis { flex-wrap: wrap; }
  .kpi { flex: 1 1 42%; border-right: none; border-bottom: 1px solid var(--line); }
  .pnl-acoes { width: 100%; }
}

/* ============================================================
   CONSOLE DA PLATAFORMA — chrome navy (sala de controle do dono)
   ============================================================ */
:root { --nav: #111820; --nav-2: #0C1219; --nav-ink: #E7EAEE; --nav-ink-2: #93A0AC; --nav-line: rgba(255,255,255,.08); }
.topnav.console { background: linear-gradient(180deg, var(--nav), var(--nav-2)); border-bottom-color: var(--nav-line); }
.topnav.console .topnav-name { color: #fff; }
.topnav.console .con-badge { font-family: var(--mono, ui-monospace, monospace); font-size: 9px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--acc-2); border: 1px solid rgba(87,173,62,.4); border-radius: 5px; padding: 2px 6px; margin-left: 2px; }
.topnav.console .top-item { color: var(--nav-ink-2); }
.topnav.console .top-item:hover { color: #fff; background: rgba(255,255,255,.06); }
.topnav.console .top-item.ativo { color: #fff; background: rgba(255,255,255,.10); font-weight: 700; }
.topnav.console .topo-btn.ic { color: var(--nav-ink-2); }
.topnav.console .topo-btn.ic:hover { color: #fff; background: rgba(255,255,255,.06); }
.topnav.console .plano-chip { display: none; }
.topnav.console .topnav-search { display: none; } /* busca é do app do advogado, não do Console */
.topnav.console .topnav-avatar { background: #1D2A38; color: #CBD5E0; border-color: rgba(255,255,255,.14); }
.topnav.console .topnav-user-tx > #topo-user { color: var(--nav-ink); }
.topnav.console .topnav-esc { color: var(--nav-ink-2); }
.topnav.console .topo-btn.sair { color: var(--nav-ink-2); border-color: rgba(255,255,255,.16); }
.topnav.console .topo-btn.sair:hover { color: #fff; border-color: #fff; }
.top-item.con-switch { color: var(--acc-2); border: 1px solid rgba(87,173,62,.45); border-radius: 8px; margin-left: 8px; }
.top-item.con-switch:hover { background: rgba(87,173,62,.14); color: #fff; }
.top-item.con-back { color: var(--acc-tx); border: 1px solid var(--acc-soft); border-radius: 8px; }

/* banner "modo dono" (vendo o app do advogado) */
/* v6: a faixa vive ACIMA do shell (fora das colunas) — sem sticky, senão brigaria com o
   topnav, que é sticky top:0. Rola junto com a página; é aviso, não controle. */
.modo-dono { z-index: 800; display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; padding: 9px 16px; background: #10151B; color: var(--nav-ink); font-size: 12.5px; border-bottom: 1px solid var(--nav-line); }
.modo-dono strong { color: #fff; }
.modo-dono button { font: inherit; font-size: 12px; font-weight: 700; color: #fff; background: var(--acc); border: 0; border-radius: 7px; padding: 6px 13px; cursor: pointer; }
.modo-dono button:hover { filter: brightness(1.08); }

/* ===== Conteúdo do Console ===== */
.cview { display: none; }
.cview.on { display: block; }
.con-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.con-head h1 { font-size: 19px; font-weight: 700; letter-spacing: -.01em; color: var(--tx); }
.con-head p { font-size: 12.5px; color: var(--tx-3); margin-top: 2px; }

.con-kpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 16px; }
.con-kpi { background: var(--panel-a); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-1); padding: 13px 15px 11px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.con-kpi .lbl { font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--tx-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.con-kpi .val { font-size: 24px; font-weight: 700; line-height: 1; letter-spacing: -.02em; color: var(--tx); font-variant-numeric: tabular-nums; }
.con-kpi .val small { font-size: 13px; color: var(--tx-3); margin-right: 1px; }
.con-kpi .foot { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.con-delta { font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.con-delta.up { color: var(--acc-tx); } .con-delta.down { color: var(--v4-red); } .con-delta.flat { color: var(--tx-4, var(--tx-3)); }
.con-spark { display: block; width: 100%; height: 28px; margin: 1px 0; }

.con-grid2 { display: grid; grid-template-columns: 1.35fr 1fr; gap: 14px; margin-bottom: 14px; }
.con-card { background: var(--panel-a); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-1); }
.con-card-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px 6px; }
.con-card-h h3 { font-size: 13.5px; font-weight: 800; color: var(--tx); }
.con-card-h .hint { font-size: 11px; color: var(--tx-3); }
.con-kpi .val.seg-alerta { color: var(--err-vivid); }
#cv-seguranca .con-card-h { font-size: 13px; font-weight: 800; color: var(--tx); }
.con-card-b { padding: 8px 16px 16px; }


.con-dist { display: flex; flex-direction: column; gap: 11px; padding-top: 6px; }
.con-drow { display: grid; grid-template-columns: 90px 1fr 30px; align-items: center; gap: 10px; }
.con-drow .k { font-size: 12px; color: var(--tx-2); display: flex; align-items: center; gap: 7px; }
.con-drow .track { height: 8px; background: #EFEFEC; border-radius: 5px; overflow: hidden; }
.con-drow .fill { height: 100%; border-radius: 5px; }
.con-drow .n { font-size: 12px; font-weight: 700; text-align: right; color: var(--tx); font-variant-numeric: tabular-nums; }
.con-sw { width: 9px; height: 9px; border-radius: 2.5px; flex: none; }

.con-alerts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.con-alert { background: var(--panel-a); border: 1px solid var(--line); border-left: 3px solid var(--v4-amber); border-radius: 10px; box-shadow: var(--shadow-1); padding: 13px 15px; display: flex; flex-direction: column; gap: 6px; }
.con-alert.hot { border-left-color: var(--acc); } .con-alert.cold { border-left-color: var(--v4-red); }
.con-alert .t { font-size: 12.5px; font-weight: 700; color: var(--tx); }
.con-alert .d { font-size: 11.5px; color: var(--tx-3); flex: 1; }
.con-alert a { font-size: 11.5px; font-weight: 700; color: var(--acc-tx); text-decoration: none; }
.con-alert a:hover { text-decoration: underline; }

/* tabelas do console */
.con-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.con-tbl th { font-size: 9.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--tx-3); text-align: left; padding: 0 12px 8px; white-space: nowrap; }
.con-tbl td { padding: 11px 12px; border-top: 1px solid var(--line); vertical-align: middle; color: var(--tx-2); }
.con-tbl tr:hover td { background: var(--hover-acc); }
.con-tbl .r { text-align: right; } .con-tbl .c { text-align: center; }
.con-esc { display: flex; align-items: center; gap: 10px; }
.con-esc .sg { width: 30px; height: 30px; border-radius: 8px; background: var(--acc-soft); border: 1px solid rgba(63,155,47,.25); display: grid; place-items: center; font-size: 10px; font-weight: 800; color: var(--acc-tx); flex: none; }
.con-esc .nm { font-weight: 700; color: var(--tx); } .con-esc .sub { font-size: 10.5px; color: var(--tx-3); }
.con-num { font-variant-numeric: tabular-nums; }
.con-cons { display: flex; align-items: center; gap: 10px; }
.con-cons .track { flex: 1; height: 7px; background: #EFEFEC; border-radius: 5px; overflow: hidden; min-width: 54px; }
.con-cons .fill { height: 100%; background: linear-gradient(90deg, var(--acc), var(--acc-2)); border-radius: 5px; }
.con-cons .fill.cold { background: linear-gradient(90deg, var(--v4-amber), var(--v4-red)); }
.con-health { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.con-health i { width: 9px; height: 9px; border-radius: 50%; }
.con-h-g i { background: var(--acc); } .con-h-a i { background: var(--v4-amber); } .con-h-o i { background: #E07B3C; } .con-h-r i { background: var(--v4-red); }

.con-plano { font-size: 9.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; border-radius: 20px; padding: 3px 9px; display: inline-block; white-space: nowrap; }
.pl-pro { color: var(--info, #3B6FB0); background: var(--info-soft, rgba(59,111,176,.12)); }
.pl-trial { color: var(--v4-amber); background: rgba(214,154,63,.16); }
.pl-cortesia, .pl-essencial { color: var(--tx-2); background: #EEEEEB; }
.st-ativo { color: var(--acc-tx); background: var(--acc-soft); }
.st-suspenso { color: var(--v4-red); background: rgba(201,86,79,.12); }

.con-btn { font: inherit; font-size: 11px; font-weight: 700; border-radius: 7px; padding: 6px 11px; cursor: pointer; border: 1px solid var(--line-2); background: var(--panel-a); color: var(--tx-2); white-space: nowrap; }
.con-btn:hover { border-color: var(--acc); color: var(--acc-tx); }
.con-btn.p { background: var(--acc); border-color: var(--acc); color: #fff; }
.con-btn.p:hover { filter: brightness(1.06); color: #fff; }
.con-btn.g { border-color: var(--v4-red); color: var(--v4-red); }

.con-sys3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 14px; }
.con-gauge { background: var(--panel-a); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-1); padding: 15px 16px; }
.con-gauge .gl { font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--tx-3); }
.con-gauge .gv { font-size: 27px; font-weight: 700; letter-spacing: -.02em; margin: 4px 0 9px; color: var(--tx); font-variant-numeric: tabular-nums; }
.con-gauge .gt { height: 8px; background: #EFEFEC; border-radius: 5px; overflow: hidden; }
.con-gauge .gf { height: 100%; border-radius: 5px; }
.con-svc { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 12px; padding: 11px 4px; border-top: 1px solid var(--line); font-size: 12.5px; }
.con-svc:first-child { border-top: 0; }
.con-svc .s { display: flex; align-items: center; gap: 9px; font-weight: 600; color: var(--tx); }
.con-svc .s i { width: 8px; height: 8px; border-radius: 50%; background: var(--acc); }
.con-svc .m { font-size: 11.5px; color: var(--tx-3); font-variant-numeric: tabular-nums; }
.con-status { display: flex; align-items: center; gap: 12px; padding: 16px; }
.con-status .dot { width: 12px; height: 12px; border-radius: 50%; background: var(--acc); box-shadow: 0 0 0 4px var(--acc-soft); }
.con-status .lbl { font-size: 15px; font-weight: 700; color: var(--tx); }
.con-status .meta { margin-left: auto; font-size: 11.5px; color: var(--tx-3); font-variant-numeric: tabular-nums; }

.con-note { font-size: 11.5px; color: var(--tx-3); margin-top: 14px; padding: 10px 13px; background: var(--panel-b); border: 1px dashed var(--line-2); border-radius: 9px; }
.con-note.con-perigo { color: var(--err-tx); background: var(--err-bg); border: 1px solid var(--err-vivid); border-left-width: 3px; margin: 0 0 14px; }
.con-eu { font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--acc-tx); background: var(--hover-acc); border: 1px solid var(--acc-soft); border-radius: 5px; padding: 1px 5px; margin-left: 4px; vertical-align: 1px; }
.con-vazio { padding: 26px; text-align: center; color: var(--tx-3); font-size: 13px; }

/* ===== Ficha do escritório (Console — 06/08/2026) — classes cfe-* escopadas de propósito,
   mesma lição das telas anteriores (.ct-*, .eq-*): regras genéricas de .nf/.con-plano não
   podem vazar aqui nem o contrário. Reusa .con-card/.con-tbl/.con-btn/.det-linha/.drawer
   já existentes — só o que é realmente novo ganha classe própria. ===== */
.cfe-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.cfe-voltar { grid-column: 1 / -1; align-self: flex-start; background: none; border: none; color: var(--tx-2); font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; padding: 0 0 10px; }
.cfe-voltar:hover { color: var(--acc-tx); }
.cfe-titulo { display: flex; align-items: center; gap: 12px; }
.cfe-titulo .con-esc .sg { width: 42px; height: 42px; font-size: 13px; border-radius: 10px; }
.cfe-titulo h2 { font-size: 18px; font-weight: 800; color: var(--tx); margin: 0 0 4px; }
.cfe-badges { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cfe-badges .sub { font-size: 11.5px; color: var(--tx-3); }
.cfe-acoes { display: flex; gap: 8px; flex-wrap: wrap; }

.cfe-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--line); margin-bottom: 14px; }
.cfe-tab { background: none; border: none; border-bottom: 2px solid transparent; font: inherit; font-size: 13px; font-weight: 700; color: var(--tx-3); padding: 8px 4px; margin-right: 18px; cursor: pointer; }
.cfe-tab .sub { font-weight: 500; color: var(--tx-3); }
.cfe-tab:hover { color: var(--tx); }
.cfe-tab.ativa { color: var(--tx); border-bottom-color: var(--acc); }
.cfe-panel { display: none; }
.cfe-panel.ativo { display: block; }

.cfe-pessoa { display: flex; align-items: center; gap: 9px; background: none; border: none; padding: 0; font: inherit; font-size: 12.8px; font-weight: 700; color: var(--tx); cursor: pointer; text-align: left; }
.cfe-pessoa:hover { color: var(--acc-tx); text-decoration: underline; }
.cfe-ini { width: 26px; height: 26px; border-radius: 50%; background: var(--acc-soft); border: 1px solid rgba(63,155,47,.25); display: grid; place-items: center; font-size: 9.5px; font-weight: 800; color: var(--acc-tx); flex: none; }

.cfe-papel { font-size: 9.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; border-radius: 20px; padding: 3px 9px; display: inline-block; white-space: nowrap; }
.cfe-papel.pp-admin { color: var(--acc-tx); background: var(--acc-soft); }
.cfe-papel.pp-advogado { color: var(--info, #3B6FB0); background: var(--info-soft, rgba(59,111,176,.12)); }
.cfe-papel.pp-analista, .cfe-papel.pp-estagiario { color: #7A5FC2; background: rgba(122,95,194,.13); }
.cfe-papel.pp-secretario { color: var(--v4-amber); background: rgba(214,154,63,.16); }
.cfe-papel.pp-colaborador { color: var(--tx-2); background: #EEEEEB; }

.cfe-2fa { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--tx-3); }
.cfe-2fa i { width: 7px; height: 7px; border-radius: 50%; background: var(--v4-amber); }
.cfe-2fa.on { color: var(--acc-tx); }
.cfe-2fa.on i { background: var(--acc); }

.cfe-check { display: flex; align-items: flex-start; gap: 8px; font-size: 12.3px; color: var(--tx); background: var(--panel-b); border: 1px solid var(--line-2); border-radius: 9px; padding: 10px 12px; cursor: pointer; }
.cfe-check input { margin-top: 2px; }

@media (max-width: 1080px) { .con-kpis { grid-template-columns: repeat(3, 1fr); } .con-grid2 { grid-template-columns: 1fr; } .con-alerts, .con-sys3 { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .con-kpis { grid-template-columns: repeat(2, 1fr); } }

/* ===== Ficha do processo (Processos / Fatia 2) ===== */
.proc-card { cursor: pointer; }
.ficha-pubs { display: flex; flex-direction: column; gap: 8px; }
.ficha-pub { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; background: var(--panel-b); border: 1px solid var(--line); border-radius: 10px; }
.ficha-pub-ato { font-size: 13px; font-weight: 600; color: var(--tx); flex: 1; min-width: 120px; }
.ficha-pub-data { font-size: 11.5px; color: var(--tx-3); font-variant-numeric: tabular-nums; }
.ficha-coment-form { display: flex; flex-direction: column; gap: 8px; align-items: stretch; }
.ficha-coment-form textarea { flex: 1; resize: vertical; min-height: 44px; font: inherit; font-size: 13.5px; color: var(--tx); background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 10px; padding: 9px 12px; }
.ficha-coment-form textarea:focus { outline: none; border-color: var(--acc-hair); background: var(--field-bg-focus); }
.ficha-coment-form .btn { flex: none; white-space: nowrap; }

/* ficha do processo — cabeçalho de seção + observações */
.ficha-sec-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.ficha-sec-tit { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--tx-3); }
.ficha-obs { margin-top: 16px; padding: 12px 14px; background: var(--panel-b); border: 1px solid var(--line); border-left: 3px solid var(--acc-soft); border-radius: 10px; }
.ficha-obs-tit { display: block; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--tx-3); margin-bottom: 5px; }
.ficha-obs p { font-size: 13.5px; color: var(--tx); line-height: 1.55; }

/* PARTES do processo (14/08/2026) — viraram as PRIMEIRAS linhas de "Dados do processo" (antes
   eram um bloco .ficha-partes à parte, abaixo). Reaproveita .det-linha; só o valor pode trazer
   mais de um nome (um por linha, via <br>) e o selo de sigilo quando o tribunal publica o nome
   já abreviado. */
.det-linha.det-partes strong { line-height: 1.6; }
.det-sigilo { display: inline-block; font-size: 10px; font-weight: 800; letter-spacing: .04em; color: var(--tx-2); background: var(--panel-b); border: 1px solid var(--line-2); border-radius: 999px; padding: 1px 7px; margin-left: 4px; vertical-align: middle; }

/* form de edição da ficha (todos os campos) */
.ficha-form { display: flex; flex-direction: column; gap: 12px; }
.ff-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 14px; }
.ff-campo { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ff-campo > span { font-size: 11px; font-weight: 700; letter-spacing: .04em; color: var(--tx-3); text-transform: uppercase; }
.ff-campo input, .ff-campo select, .ff-campo textarea { font: inherit; font-size: 13.5px; color: var(--tx); background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 9px; padding: 8px 11px; width: 100%; box-sizing: border-box; }
.ff-campo textarea { resize: vertical; }
.ff-campo input:focus, .ff-campo select:focus, .ff-campo textarea:focus { outline: none; border-color: var(--acc-hair); background: var(--field-bg-focus); }
.ff-acoes { display: flex; justify-content: flex-end; gap: 10px; margin-top: 4px; }

/* composer de atividades + selos + timeline por tipo */
.ficha-coment-acoes { display: flex; align-items: center; gap: 14px; }
.ficha-tipo { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--tx-2); cursor: pointer; }
.ficha-coment-acoes .btn { margin-left: auto; }
.ev-badge { display: inline-block; font-size: 9.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; border-radius: 5px; padding: 1px 6px; margin-right: 6px; }
.ev-com { color: var(--acc-tx); background: var(--hover-acc); }
.ev-and { color: var(--v4-amber); background: rgba(214, 154, 63, .16); }
.ev-hist { color: var(--tx-3); background: var(--field-bg); }
.ev-anexo { color: var(--acc-tx); background: var(--hover-acc); }
.tl-item.tl-anexo::before { background: var(--acc); }

/* PUBLICAÇÃO DO DJEN NA ÁRVORE, com o teor integral (01/08/2026).
   Prefixo tl-pub-* para não esbarrar em .pub-* (cards do Radar) nem em .ficha-pub-* (bloco
   do Resumo) — três famílias diferentes desenham publicação neste app. */
.ev-pub { color: var(--acc-tx); background: var(--ok-bg); }
.tl-item.tl-pub::before { background: var(--acc-tx); }
.tl-pub .tl-nome { font-weight: 600; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tl-pub .prazo-badge { font-size: 10.5px; padding: 2px 8px; }
.tl-pub-fatal { font-size: 11px; font-weight: 700; color: var(--err-tx); }
.tl-pub-meta { display: block; font-size: 11.5px; color: var(--tx-3); margin-top: 3px; }
/* pre-wrap preserva a formatação do diário: a publicação vem com quebras que separam o
   despacho do fecho e da assinatura; num parágrafo corrido vira um bloco ilegível.
   max-height + overflow para uma intimação longa não empurrar a árvore inteira para baixo. */
.tl-teor { margin-top: 8px; padding: 11px 13px; border-radius: 10px; background: var(--field-bg);
  border: 1px solid var(--line-2); font-size: 12.5px; line-height: 1.6; color: var(--tx-2);
  white-space: pre-wrap; overflow-wrap: anywhere; max-height: 320px; overflow: auto; }
.tl-teor.vazio { color: var(--tx-3); font-style: italic; white-space: normal; }
.tl-pub-link { display: inline-block; margin-top: 7px; font-size: 11.5px; font-weight: 600; color: var(--acc-tx); }
.tl-aviso { margin-top: 6px; padding: 9px 12px; border-radius: 10px; background: var(--field-bg);
  border: 1px solid var(--line); font-size: 11.5px; color: var(--tx-3); line-height: 1.5; }
.ficha-pubs-dica { margin-left: 8px; font-size: 11px; font-weight: 500; color: var(--tx-3); text-transform: none; letter-spacing: 0; }

/* arquivos do processo (aba Arquivos) */
.arq-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.arq-add { cursor: pointer; }
.arq-add.ocupado { opacity: .6; pointer-events: none; }
.arq-dica { font-size: 11.5px; color: var(--tx-3); margin-bottom: 14px; }
.arq-lista { display: flex; flex-direction: column; gap: 8px; }
.arq-item { display: flex; align-items: center; gap: 11px; padding: 10px 12px; background: var(--panel-b); border: 1px solid var(--line); border-radius: 10px; }
.arq-ic { flex: none; width: 30px; height: 30px; display: grid; place-items: center; color: var(--acc-tx); }
.arq-ic svg.i { width: 20px; height: 20px; }
.arq-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.arq-nome { font-size: 13px; font-weight: 600; color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.arq-meta { font-size: 11px; color: var(--tx-3); font-variant-numeric: tabular-nums; }
.arq-del:hover { color: var(--err-tx); border-color: var(--err-vivid); }
.tl-item.tl-andamento::before { background: var(--v4-amber); }
.tl-item.tl-historico::before { background: var(--tx-3); }

/* filtro "Meus processos" na lista */

/* ---- Gerencial (login do dono) ---- */
.ger-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 14px 0; }
@media (max-width: 860px) { .ger-grid2 { grid-template-columns: 1fr; } }
.ger-card { padding: 16px 18px; margin-top: 14px; }
.ger-grid2 .ger-card { margin-top: 0; }
.ger-card-t { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--tx-3); margin-bottom: 12px; }
.ger-bars { display: flex; align-items: flex-end; gap: 10px; height: 130px; }
.ger-bar { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 4px; min-width: 0; }
.ger-bar i { display: block; width: 100%; max-width: 46px; background: var(--acc); border-radius: 5px 5px 0 0; }
.ger-bar span { font-size: 10px; color: var(--tx-3); }
.ger-risco-rows { display: flex; flex-direction: column; gap: 9px; }
.ger-risco-row { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--tx-2); }
.ger-risco-row b { margin-left: auto; color: var(--tx); font-variant-numeric: tabular-nums; }
.ger-nota { font-size: 11.5px; color: var(--tx-3); margin: 10px 0 0; }
.ger-aviso { background: rgba(214, 154, 63, .12); border: 1px solid var(--v4-amber); color: var(--tx); border-radius: 10px; padding: 10px 14px; font-size: 13px; margin-bottom: 12px; }
.ger-prazo { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line); font-size: 12.5px; }
.ger-prazo:first-of-type { border-top: none; }
.ger-prazo-pz { font-weight: 800; font-size: 11.5px; }
.ger-prazo-pz.prio-alta { color: var(--v4-red); }
.ger-prazo-pz.prio-media { color: var(--v4-amber); }
.ger-prazo-pz.prio-baixa { color: var(--acc-tx); }
.ger-prazo-tx { color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ger-prazo-resp { color: var(--tx-3); font-size: 11.5px; }
.ger-acoes { white-space: nowrap; }
.ger-rel-acoes { display: flex; justify-content: flex-end; margin-bottom: 12px; }
.ger-rel { padding: 26px 30px; max-width: 760px; }
.ger-rel-cab h2 { font-size: 20px; font-weight: 800; color: var(--tx); }
.ger-rel-cab p { color: var(--tx-3); font-size: 12.5px; margin-top: 4px; }
.ger-rel-sec { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--acc-tx); margin: 20px 0 8px; border-bottom: 1px solid var(--line); padding-bottom: 6px; }
.ger-rel-linha { display: flex; justify-content: space-between; gap: 14px; padding: 6px 0; font-size: 13.5px; color: var(--tx-2); border-bottom: 1px dashed var(--line); }
.ger-rel-linha b { color: var(--tx); font-variant-numeric: tabular-nums; text-align: right; }
.ger-rel-rodape { margin-top: 22px; font-size: 11px; color: var(--tx-3); font-style: italic; }
.ger-tbar-acoes { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ger-aud-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.ger-aud-topo select { font: inherit; font-size: 13px; color: var(--tx); background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 9px; padding: 7px 10px; }

/* impressão do relatório executivo: escopada por body.print-rel (o botão Imprimir liga e
   o afterprint desliga) — Ctrl+P nas demais telas do app continua normal */
@media print {
  body.print-rel .topnav, body.print-rel .modo-dono, body.print-rel .sino-box, body.print-rel .pagina-topo,
  body.print-rel .radar-filtros, body.print-rel .ger-rel-acoes, body.print-rel #ui-camada { display: none !important; }
  .sidenav { display: none !important; } /* menu lateral nunca sai no papel */
  .shell { display: block; }
  body.print-rel { background: #fff !important; }
  body.print-rel .conteudo { padding: 0 !important; }
  body.print-rel .ger-rel { border: none !important; box-shadow: none !important; max-width: none; }

  /* Ctrl+P no Radar (o botão do sistema gera o PDF de verdade, via pdf.js — não usa impressão).
     Se o usuário imprimir pelo navegador mesmo assim, ao menos sai limpo. */
  .rd-busca, .rd-hist, #rd-pdf { display: none !important; }
  .rd-proc { break-inside: avoid; page-break-inside: avoid; }
}

/* ============================================================
   RADAR — campo de consulta separado por tipo
   Cada tipo (CPF / CNPJ / Nome / OAB) tem rótulo e explicação próprios.
   ============================================================ */
.rd-campo { display: flex; flex-direction: column; gap: 4px; width: 100%; }
.rd-campo-linha { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.rd-campo-linha .rd-in { flex: 1 1 260px; min-width: 0; }
.rd-campo-linha .rd-uf { flex: 0 0 88px; }
.rd-ajuda { margin: 0; font-size: 11.5px; line-height: 1.45; color: var(--tx-3); max-width: 78ch; }

/* Botão de baixar a ficha: svg.i é display:block (empilharia sob o texto e faria o botão
   ficar com ~60px de altura). inline-flex + gap deixa ícone e rótulo lado a lado. */
#rd-pdf { display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px; white-space: nowrap; }
#rd-pdf svg.i { width: 16px; height: 16px; }

/* Resumo em palavras (contagem, sem IA) */
.rd-narrativa { margin: 9px 0 0; font-size: 13px; line-height: 1.55; color: var(--tx); max-width: 92ch; }
.rd-narrativa b { color: var(--acc-tx); }

/* Ficha do resumo: rótulo à esquerda, valores numa coluna — mesma lógica do PDF.
   O alinhamento vertical dos rótulos é o que faz ler como ficha, não como nuvem de tags. */
.rd-ficha { margin-top: 12px; display: flex; flex-direction: column; gap: 5px; }
.rd-lin { display: grid; grid-template-columns: 92px 1fr; gap: 10px; align-items: baseline; }
.rd-lin-t { font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--tx-3);
  font-weight: 700; text-align: right; padding-top: 3px; }
.rd-lin-v { display: flex; gap: 5px; flex-wrap: wrap; }
.rd-cont { display: inline-flex; align-items: baseline; gap: 4px; padding: 3px 9px; border-radius: 999px;
  background: var(--fundo-2); border: 1px solid var(--line); font-size: 11.5px; color: var(--tx-2); }
.rd-cont b { font-size: 13px; color: var(--tx); font-variant-numeric: tabular-nums; }
.rd-cont.alerta { border-color: var(--aviso, #C9A227); }
.rd-cont.alerta b { color: var(--aviso, #C9A227); }
@media (max-width: 640px) {
  .rd-lin { grid-template-columns: 1fr; gap: 2px; }
  .rd-lin-t { text-align: left; }
}

/* Linha enxuta do processo: número + selos; o resto abre no clique */
details.rd-proc { border: 1px solid var(--line); border-radius: 9px; background: var(--panel-a, var(--fundo-2)); margin-bottom: 6px; }
details.rd-proc > .rd-proc-h { cursor: pointer; list-style: none; padding: 9px 13px; display: flex; gap: 10px;
  align-items: center; justify-content: space-between; flex-wrap: wrap; }
details.rd-proc > .rd-proc-h::-webkit-details-marker { display: none; }
details.rd-proc > .rd-proc-h::before { content: '▸'; color: var(--tx-3); font-size: 11px; margin-right: 2px; }
details.rd-proc[open] > .rd-proc-h::before { content: '▾'; }
details.rd-proc[open] > .rd-proc-h { border-bottom: 1px solid var(--line); }
.rd-proc-n { font-variant-numeric: tabular-nums; font-size: 13px; letter-spacing: .01em; flex: 1 1 auto; }
.rd-proc-selos { display: flex; gap: 5px; flex-wrap: wrap; }
.rd-proc-b { padding: 10px 13px 12px; }
details.rd-proc > .rd-proc-h:focus-visible { outline: 2px solid var(--acc); outline-offset: -2px; border-radius: 9px; }
@media (max-width: 640px) {
  .rd-campo-linha .rd-buscar { flex: 1 1 100%; justify-content: center; }
}

/* anti-flash do codinome: nome só aparece quando a marca real é aplicada */
html:not(.marca-pronta) #login-brand, html:not(.marca-pronta) #vitrine-nome,
html:not(.marca-pronta) #brand-nome, html:not(.marca-pronta) .sidenav-name { visibility:hidden; }

/* ============================================================
   SHELL v5 — SIDEBAR (desktop) · aprovado pelo Geone em 17/07/2026
   No mobile (≤1080px) a sidebar some e vale o menu do topo de sempre.
   ============================================================ */
.shell-wrap { display: flex; flex-direction: column; min-height: 100vh; }
.shell { display: flex; align-items: stretch; flex: 1; min-height: 0; }
.shell-corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.sidenav { display: none; width: 244px; flex: none; position: sticky; top: 0;
  align-self: flex-start; height: calc(100vh - var(--dono-h, 0px) - var(--cmn-h, 0px)); max-height: 100vh;
  flex-direction: column; gap: 4px; padding: 0 12px 14px;
  background: var(--topo-bg); backdrop-filter: var(--blur); border-right: 1px solid var(--line); }
@media (min-width: 1081px) {
  .sidenav { display: flex; }
  .topnav-brand, .topnav .topnav-menu { display: none; }
  .topnav #btn-sair { display: none; } /* o Sair vive na sidebar no desktop (evita dois botões) */
}
.sidenav .top-sair { color: var(--err-vivid); margin-top: 4px; }
.sidenav .con-badge { font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: var(--acc-tx); border: 1px solid var(--acc-soft); border-radius: 6px; padding: 1px 6px; margin-left: 4px; }
.sidenav-brand { display: flex; align-items: center; gap: 10px; padding: 2px 8px 14px; color: var(--tx); font-weight: 600; font-size: 17px; }
.sidenav-logo { width: 30px; height: 30px; display: grid; place-items: center; }
.sidenav-logo .logo-img { width: 30px; height: 30px; display: block; }
.sidenav-logo .emblema { width: 25px; height: 25px; color: var(--acc-tx); }
.sidenav-logo:has(img.logo-img) .emblema { display: none; }
.sidenav-menu { display: flex; flex-direction: column; gap: 2px; overflow-y: auto; scrollbar-width: thin; }
.sidenav .top-item { display: flex; align-items: center; text-align: left; gap: 10px; width: 100%;
  font-size: 13.5px; padding: 9px 11px; border-radius: 10px; white-space: normal; }
.sidenav .top-item.ativo { color: var(--acc-tx); }
.sidenav-foot { margin-top: auto; display: flex; align-items: center; gap: 9px; padding: 10px 6px 0; border-top: 1px solid var(--line); }
.sidenav-avatar { width: 31px; height: 31px; flex: none; border-radius: 9px; background: var(--field-bg); border: 1px solid var(--line-2);
  display: grid; place-items: center; font-size: 12px; font-weight: 800; color: var(--tx-2); }
.sidenav-user-tx { display: flex; flex-direction: column; min-width: 0; }
.sidenav-user-tx #side-user { font-size: 12.5px; font-weight: 600; color: var(--tx); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidenav-esc { font-size: 11px; color: var(--tx-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ============================================================
   PAINEL v5 — layout aprovado (KPIs · esteira de prazos · Agenda
   com calendário → prazos do dia AO LADO · áreas · barra de status)
   ============================================================ */
.p5-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, .98fr); gap: 12px; margin-bottom: 18px; align-items: stretch; } /* Agenda (larga) à esquerda · esteira de prazos à direita */
@media (max-width: 1080px) { .p5-row { grid-template-columns: 1fr; } }
.p5-panel { background: var(--panel-a); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-1);
  display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.p5-ph { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 13px 15px 11px; border-bottom: 1px solid var(--line); }
.p5-pt { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 700; color: var(--tx); }



.nav-ic { display: grid; place-items: center; flex: none; }
.nav-ic .i { width: 17px; height: 17px; }
.p5-bgred { background: var(--err-vivid); }
.p5-bgamber { background: var(--v4-amber); }
.p5-bggreen { background: var(--acc); }

/* Agenda: calendário (esquerda) → prazos do dia clicado (direita) */
.p5-agenda { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.06fr); flex: 1; min-height: 0; }
@media (max-width: 760px) { .p5-agenda { grid-template-columns: 1fr; } .p5-cal { border-right: none !important; border-bottom: 1px solid var(--line); } }
.p5-cal { padding: 10px 12px 8px; border-right: 1px solid var(--line); display: flex; flex-direction: column; }
.p5-calnav { display: flex; align-items: center; justify-content: space-between; padding: 0 2px 8px; }
.p5-calnav b { font-size: 12.5px; font-weight: 700; color: var(--tx); }
.p5-calnav button { font: inherit; background: none; border: none; color: var(--tx-2); cursor: pointer; font-size: 15px; padding: 0 8px; border-radius: 6px; }
.p5-calnav button:hover { background: var(--hover-acc); color: var(--tx); }
.p5-calnav button:disabled { opacity: .3; cursor: default; background: none; }
.p5-calgrid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; flex: 1; }
.p5-calgrid .p5-wd { text-align: center; font-size: 9.5px; color: var(--tx-3); font-weight: 700; padding: 2px 0 4px; }
.p5-calgrid .p5-d { display: grid; place-items: center; min-height: 30px; font-size: 11.5px; border-radius: 7px; color: var(--tx-2);
  position: relative; font-variant-numeric: tabular-nums; background: none; border: none; font-family: inherit; }
.p5-calgrid .p5-d[data-dia] { cursor: pointer; }
.p5-calgrid .p5-d[data-dia]:hover { background: var(--hover-acc); }
.p5-calgrid .p5-d.p5-mut { color: var(--tx-3); opacity: .38; }
.p5-calgrid .p5-d.p5-hoje { background: var(--acc); color: #fff; font-weight: 800; }
.p5-calgrid .p5-d.p5-sel:not(.p5-hoje) { box-shadow: inset 0 0 0 1.6px var(--acc); color: var(--acc-tx); font-weight: 700; }
.p5-calgrid .p5-d .p5-pd { position: absolute; bottom: 2px; width: 4px; height: 4px; border-radius: 50%; }
.p5-calgrid .p5-d.p5-hoje .p5-pd { display: none; }
.p5-calleg { display: flex; gap: 11px; padding: 8px 2px 2px; flex-wrap: wrap; }
.p5-calleg span { font-size: 10px; color: var(--tx-2); display: flex; align-items: center; gap: 4px; }
.p5-calleg i { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.p5-tars { padding: 8px 10px; display: flex; flex-direction: column; min-width: 0; }
.p5-tars-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 3px 4px 6px; font-size: 12.5px; font-weight: 700; color: var(--tx); }
.p5-tars-h b { color: var(--acc-tx); font-weight: 700; }
.p5-tar-lista { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.p5-tar { display: flex; gap: 10px; padding: 9px 8px; border-bottom: 1px solid var(--line); align-items: flex-start; cursor: pointer; border-radius: 8px; }
.p5-tar:hover { background: var(--hover-acc); }
.p5-tar .p5-tchip { flex: none; font-size: 10px; font-weight: 800; letter-spacing: .04em; border-radius: 6px; padding: 2px 7px; margin-top: 1px;
  background: var(--hover-acc); color: var(--acc-tx); border: 1px solid var(--acc-soft); font-variant-numeric: tabular-nums; }
.p5-tar .p5-tchip.p5-tred { background: var(--err-bg); color: var(--err-vivid); border-color: rgba(201, 86, 79, .38); }
.p5-tar .p5-tchip.p5-tamber { background: rgba(214, 154, 63, .14); color: var(--v4-amber); border-color: rgba(214, 154, 63, .4); }
.p5-tar .p5-ttx { min-width: 0; }
.p5-tar .p5-ttx b { display: block; font-size: 12.5px; font-weight: 600; color: var(--tx); }
.p5-tar .p5-ttx span { display: block; font-size: 11px; color: var(--tx-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p5-tar-vazio { padding: 14px 10px; font-size: 11.5px; color: var(--tx-3); }

/* barra de status do robô */

/* compromissos no mini-calendário do Painel: BOLINHA VERMELHA no canto (pedido do Geone,
   17/08 — espelho da Agenda unificada; o pontinho dos prazos segue embaixo, separado).
   Vermelho PRÓPRIO com par por tema: a família --err-* da paleta grafite é neutra de
   propósito, então ela não serve aqui. */
:root { --p5-comp: #B4321F; }
html[data-tema="escuro"] { --p5-comp: #E8907F; }
.p5-calgrid .p5-d .p5-pd-ev { position: absolute; top: 2px; right: 2px; width: 6px; height: 6px; border-radius: 50%;
  background: var(--p5-comp); box-shadow: 0 0 0 1px rgba(255, 255, 255, .55); }
.p5-calgrid .p5-d.p5-hoje .p5-pd-ev { box-shadow: 0 0 0 1.3px #fff; }
.p5-calleg .p5-leg-comp { background: var(--p5-comp); }
.p5-tchip.p5-tev { background: var(--hover-acc); color: var(--acc-tx); border-color: var(--acc-soft); }
.p5-tar.p5-ev-done .p5-ttx b { color: var(--tx-3); text-decoration: line-through; font-weight: 500; }

/* ============================================================
   AGENDA EXPANDIDA (#/agenda) — compromissos do dia à esquerda + calendário grande
   ============================================================ */
.agx { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 330px); gap: 12px; align-items: stretch; }
@media (max-width: 980px) { .agx { grid-template-columns: 1fr; } }

/* Coluna do meio para o splitter — SÓ no container que tem um (#/agenda). A Agenda
   unificada (.agn) reusa .agx com dois filhos e sem splitter: sem este escopo o painel
   do dia caía na coluna de 4px e virava uma tira de 26px. */
.agx.agx-redim { grid-template-columns: minmax(0, 1fr) 4px var(--agx-col-dir, 320px); gap: 4px; }
@media (max-width: 980px) {
  /* até 980px volta à pilha: dividir largura só faz sentido com as duas colunas lado a lado */
  .agx.agx-redim { grid-template-columns: 1fr; gap: 12px; }
  .agx-splitter { display: none; }
}
/* O trilho tem 4px para nao roubar largura do conteudo, mas 4px sozinhos sao invisiveis
   (--line sobre o chao da pagina da 1,12:1 no tema claro, que e o padrao) e pequenos
   demais para mirar. Dai as duas pseudo-camadas: ::before amplia so a AREA DE CLIQUE
   para 24px (padrao dos controles da casa) sem mexer no espacamento, e ::after desenha
   a PEGA central, que e o que de fato comunica "isto se arrasta". */
.agx-splitter { position: relative; z-index: 2; background: var(--line); cursor: col-resize; user-select: none; touch-action: none; }
.agx-splitter::before { content: ""; position: absolute; inset: 0 -10px; }
.agx-splitter::after { content: ""; position: absolute; left: 1px; top: 50%; width: 2px; height: 28px;
  margin-top: -14px; border-radius: 2px; background: var(--tx-2); }
.agx-splitter:hover, .agx-splitter.arrastando { background: var(--acc); }
.agx-splitter:hover::after, .agx-splitter.arrastando::after { background: #fff; }
/* anel na cor do texto: --acc da so 2,08:1 sobre o chao claro (WCAG 1.4.11 pede 3:1) e,
   sendo a mesma cor do preenchimento, anel e barra se confundiriam */
.agx-splitter:focus-visible { outline: 2px solid var(--tx); outline-offset: 2px; background: var(--acc); }
.agx-splitter:focus-visible::after { background: #fff; }
/* enquanto arrasta, o cursor vale para a PAGINA toda: num arrasto rapido o ponteiro sai
   do trilho e voltar para a seta no meio do gesto le como "soltei sem querer" */
body.agx-arrastando { cursor: col-resize; }

.agx-dia { min-height: 420px; }
.agx-dia-lista { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; padding: 6px 8px 10px; }
.agx-ev { display: flex; gap: 10px; padding: 10px 8px; border-bottom: 1px solid var(--line); align-items: flex-start; border-radius: 9px; }
.agx-ev:hover { background: var(--hover-acc); }
.agx-chk { width: 19px; height: 19px; flex: none; margin-top: 2px; border-radius: 6px; border: 1.6px solid var(--line-2);
  background: none; cursor: pointer; position: relative; }
.agx-chk.on { background: var(--acc); border-color: var(--acc); }
.agx-chk.on::after { content: ""; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 9px;
  border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.agx-ev-tx { min-width: 0; flex: 1; }
.agx-ev-tx b { display: block; font-size: 13px; font-weight: 600; color: var(--tx); }
.agx-ev.done .agx-ev-tx b { color: var(--tx-3); text-decoration: line-through; font-weight: 500; }
.agx-ev-tx > span { display: block; font-size: 11.5px; color: var(--tx-3); }
.agx-ev-desc { margin-top: 3px; font-size: 11.5px; color: var(--tx-2); white-space: pre-wrap; }
.agx-ev-acoes { display: flex; gap: 4px; flex: none; }
.agx-mini { width: 24px; height: 24px; border-radius: 7px; border: 1px solid var(--line-2); background: none;
  color: var(--tx-2); cursor: pointer; font-size: 12px; line-height: 1; }
.agx-mini:hover { color: var(--tx); border-color: var(--acc-soft); }
.agx-mini-x:hover { color: var(--err-vivid); border-color: var(--err-vivid); }
.agx-prz { display: flex; gap: 10px; padding: 10px 8px; border-bottom: 1px solid var(--line); align-items: flex-start; border-radius: 9px; cursor: pointer; }
.agx-prz:hover { background: var(--hover-acc); }

.agx-cal { min-height: 420px; }
/* v6.7: chaveador "Minha agenda × Escritório" (delegação — cada um tem a sua agenda) */
.agx-escopo { display: inline-flex; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
/* 18/08 (pedido do Geone — SIMETRIA da barra do topo): botões do segmento
   Mês/Semana/Dia com o MESMO TAMANHO do "Filtrar por" (.ghbtn) — mesma
   padding, font-size e peso. Só o preenchimento verde marca o ativo. */
.agx-esc-bt { border: 0; background: var(--panel-b); color: var(--tx-2); font: inherit; font-size: 12.5px; font-weight: 600; padding: 8px 14px; cursor: pointer; }
.agx-esc-bt + .agx-esc-bt { border-left: 1px solid var(--line); }
.agx-esc-bt.on { background: var(--acc); color: #FFF; }
.agx-esc-bt:not(.on):hover { background: var(--hover-acc); color: var(--acc-tx); }
/* calnav (18/08, 2ª rodada — pedido do Geone): posições trocadas — Mês/Semana/Dia
   à esquerda (onde estava ‹ mês ›) e ‹ Agosto 2026 › à direita. Bloco do ‹ mês ›
   compacto, do tamanho de uma célula do grid. */
.agx-calnav { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.agx-calnav-per { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; }
.agx-calnav b { font-size: 12.5px; font-weight: 700; color: var(--tx); min-width: 0; padding: 0 8px; letter-spacing: .02em; }
/* setinhas menores (18/08): mesma altura do rótulo do mês, para o grupo
   ‹ Agosto 2026 › caber num bloco compacto do tamanho de uma célula do grid */
.agx-nav { font: inherit; font-size: 13px; background: none; border: 1px solid var(--line-2); border-radius: 7px;
  color: var(--tx-2); cursor: pointer; padding: 2px 8px; line-height: 1.2; }
.agx-nav:hover { background: var(--hover-acc); color: var(--tx); }
.agx-leg { margin-left: auto; display: flex; gap: 12px; flex-wrap: wrap; }
.agx-leg span { font-size: 10.5px; color: var(--tx-2); display: flex; align-items: center; gap: 5px; }
.agx-leg-ev { width: 7px; height: 7px; border-radius: 50%; border: 1.4px solid var(--acc-tx); display: inline-block; }
.agx-leg-p { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
/* minmax(0,1fr): sem o 0, um chip LONGO de publicação vira a largura mínima da coluna e as
   7 colunas estouram o painel — a tela cortava e "sobravam 3 dias" (achado do Geone, 11/08) */
.agx-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; padding: 8px 10px 12px; flex: 1; }
.agx-wd { text-align: center; font-size: 10px; color: var(--tx-3); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 4px 0; }
.agx-d { display: flex; flex-direction: column; gap: 2px; align-items: stretch; min-height: 86px; min-width: 0; padding: 4px;
  border: 1px solid var(--line); border-radius: 10px; background: none; font-family: inherit; text-align: left; position: relative; }
.agx-d .agx-chip { max-width: 100%; }
.agx-d[data-dia] { cursor: pointer; transition: border-color .12s, background .12s; }
.agx-d[data-dia]:hover { background: var(--hover-acc); border-color: var(--acc-soft); }
.agx-d.agx-mut { border-color: transparent; }
.agx-d.agx-hoje { border-color: var(--acc); }
.agx-d.agx-hoje .agx-num { background: var(--acc); color: #fff; }
.agx-d.agx-sel { box-shadow: inset 0 0 0 1.6px var(--acc); }
.agx-num { align-self: flex-start; min-width: 20px; height: 20px; display: grid; place-items: center; font-size: 11.5px;
  font-weight: 700; color: var(--tx-2); border-radius: 6px; padding: 0 4px; font-variant-numeric: tabular-nums; }
.agx-chip { font-size: 10px; font-weight: 600; color: var(--tx); border-radius: 5px; padding: 1.5px 5px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-left: 3px solid var(--acc); background: var(--hover-acc); }
.agx-chip.agx-chip-ev { border-left-color: var(--acc-tx); }
.agx-chip.agx-chip-ev.done { color: var(--tx-3); text-decoration: line-through; }
.agx-chip.agx-chip-red { border-left-color: var(--err-vivid); background: var(--err-bg); }
.agx-chip.agx-chip-amber { border-left-color: var(--v4-amber); background: rgba(214, 154, 63, .13); }
.agx-chip.agx-chip-green { border-left-color: var(--acc); }
.agx-mais { font-size: 9.5px; color: var(--tx-3); padding-left: 3px; }
.agf-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.agf-2col > span { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.agf-sigilo { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--tx-2); margin-top: 4px; cursor: pointer; }

/* ============================================================
   @MENÇÕES — digitar @ lista a equipe; escolhidos viram chips
   ============================================================ */
.menc-box { margin-top: 4px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--modal-a, var(--panel-a));
  box-shadow: var(--shadow-2); overflow: hidden; max-height: 190px; overflow-y: auto; }
.menc-op { display: block; width: 100%; text-align: left; font: inherit; font-size: 13px; padding: 8px 12px;
  background: none; border: none; color: var(--tx); cursor: pointer; }
.menc-op:hover, .menc-op:focus-visible { background: var(--hover-acc); color: var(--acc-tx); }
.menc-chips { margin-top: 6px; font-size: 11.5px; color: var(--tx-2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.menc-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--hover-acc); color: var(--acc-tx);
  border: 1px solid var(--acc-soft); border-radius: 999px; padding: 2px 4px 2px 9px; font-weight: 600; }
.menc-x { font: inherit; background: none; border: none; color: inherit; cursor: pointer; padding: 0 5px; border-radius: 999px; }
.menc-x:hover { color: var(--err-vivid); }

/* Console · aba Cupons */
.cup-form { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)) auto; gap: 10px; align-items: end; }
@media (max-width: 900px) { .cup-form { grid-template-columns: 1fr 1fr; } }
.cup-form label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--tx-2); font-weight: 600; min-width: 0; }
.cup-form input, .cup-form select { font: inherit; font-size: 13px; color: var(--tx); background: var(--field-bg);
  border: 1px solid var(--line-2); border-radius: 9px; padding: 8px 10px; min-width: 0; }
.cup-form .cup-lg { grid-column: span 2; }
.cup-h3 { font-size: 13px; font-weight: 700; color: var(--tx); margin-bottom: 8px; }
.cup-uso { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; padding: 6px 2px; border-bottom: 1px solid var(--line); }
.cup-uso span { color: var(--tx-3); }

/* Console · aba ANÁLISE (bloqueios) — 27/07/2026.
   A leitura é de UMA coisa: quanto tempo aquele bloqueio ainda dura. Por isso o prazo é o
   único elemento colorido da tabela — PERMANENTE em vermelho (não volta sozinho), prazo em
   âmbar (está correndo), liberado apagado. O resto é texto: sob ataque, ninguém quer uma
   tela festiva. */
.ban-sub { font-size: 11px; color: var(--tx-3); margin-top: 2px; }
.ban-perm { color: #D0574A; font-weight: 800; letter-spacing: .02em; }
.ban-temp { color: #C08A2E; font-weight: 700; }
.ban-lib { color: var(--tx-3); }
.ban-liberar { font: inherit; font-size: 12px; font-weight: 700; color: var(--tx);
  background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 8px;
  padding: 5px 12px; cursor: pointer; }
.ban-liberar:hover { background: var(--hover-acc, var(--panel-a)); border-color: var(--acc); }
.ban-liberar:disabled { opacity: .5; cursor: default; }
.ban-form { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(200px, 2fr) auto; gap: 10px; align-items: end; }
@media (max-width: 760px) { .ban-form { grid-template-columns: 1fr; } }
.ban-form label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--tx-2); font-weight: 600; min-width: 0; }
.ban-form input { font: inherit; font-size: 13px; color: var(--tx); background: var(--field-bg);
  border: 1px solid var(--line-2); border-radius: 9px; padding: 8px 10px; min-width: 0; }

/* ============================================================================
   PAINEL v6 (aprovado 26/07/2026) — os módulos saíram da home e foram para a
   lateral; a home ficou com 5 botões de indicador, o Financeiro enxuto, a
   Agenda mais alta e o Bloco de notas. Sem vermelho e sem amarelo: urgência é
   dita por TOM e PESO. Verde só nos títulos, nos ícones da lateral e na tutela.
   ============================================================================ */

/* ---- peso: letra e traço mais grossos, mais contraste ---- */
svg.i { stroke-width: 1.95; }
.pnl-ola { font-size: 18px; font-weight: 800; }
.pnl-ola b { color: var(--acc-tx); font-weight: 800; }   /* o nome de quem entrou */
.pnl-sub { color: var(--tx-2); font-weight: 500; }
.pnl-top { margin-bottom: 11px; }

/* ---- MENU LATERAL: cada módulo é um card com relevo ---- */
.sidenav { background: linear-gradient(180deg, var(--met-lo2) 0%, var(--met-fundo) 160%); }
/* A faixa da logo tem a MESMA altura da barra de cima (58px) e o mesmo fio embaixo: a linha
   atravessa a tela inteira. Com isso o primeiro item do menu nasce exatamente na altura em
   que o conteúdo começa (58 da barra + 20 do respiro = 78/79px), com ou sem a faixa de dono. */
.sidenav-brand { height: 58px; padding: 0 8px; margin-bottom: 17px;
  border-bottom: 1px solid var(--line); }
.sidenav-menu { gap: 5px; }
.sidenav .top-item {
  background: linear-gradient(180deg, var(--met-hi2) 0%, var(--met-lo2) 100%);
  border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px;
  font-weight: 700; color: var(--tx);
  box-shadow: inset 0 1px 0 var(--met-edge), var(--shadow-1);
  transition: transform .13s, border-color .13s, box-shadow .13s, background .13s;
}
.sidenav .top-item .nav-ic { color: var(--acc-tx); }
.sidenav .top-item:hover {
  background: linear-gradient(180deg, var(--met-hi2) 0%, var(--hover-acc) 130%);
  border-color: var(--acc-hair); transform: translateY(-1px);
  box-shadow: inset 0 1px 0 var(--met-edge), var(--shadow-2);
}
.sidenav .top-item.ativo {
  background: linear-gradient(180deg, var(--met-hi2) 0%, var(--hover-acc) 100%);
  color: var(--tx); border-color: var(--acc-hair);
  box-shadow: inset 3px 0 0 var(--acc-2), inset 0 1px 0 var(--met-edge), var(--shadow-1);
}
.sidenav .top-item.ativo .nav-ic { color: var(--acc-tx-2); }
html[data-tema="claro"] .sidenav .nav-ic { color: var(--acc-tx); }
html[data-tema="claro"] .sidenav .nav-ic .i { stroke-width: 2.1; }
html[data-tema="claro"] .sidenav .top-item.ativo .nav-ic { color: var(--acc-tx-2); }
/* itens ainda não construídos: presentes, porém apagados */
.sidenav .top-item.nav-breve { color: var(--tx-2); }
.sidenav .top-item.nav-breve .nav-ic { color: var(--tx-3); }
.nav-tag { margin-left: auto; font-size: 8.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: var(--tx-3); border: 1px solid var(--line-2); border-radius: 5px; padding: 1px 5px; }
.nav-badge { margin-left: auto; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  display: grid; place-items: center; font-size: 10.5px; font-weight: 800; color: #FFF; background: var(--acc); }
.nav-sep { height: 1px; background: var(--line); margin: 10px 6px; flex: none; }
/* Configurações e seus subitens */
.nav-seta { margin-left: auto; font-size: 10px; color: var(--tx-3); transition: transform .15s; }
.nav-pai[aria-expanded="false"] .nav-seta { transform: rotate(-90deg); }
.nav-sub { display: flex; flex-direction: column; gap: 1px; margin: 3px 0 0 18px;
  padding-left: 11px; border-left: 1px solid var(--line-2); }
.sidenav .top-item.nav-filho { background: none; border: none; box-shadow: none;
  font-size: 12.5px; font-weight: 600; color: var(--tx-2); padding: 6px 10px; }
.sidenav .top-item.nav-filho:hover { background: var(--field-bg); color: var(--tx); transform: none; box-shadow: none; }
.sidenav .top-item.nav-filho.ativo { background: var(--hover-acc); color: var(--tx);
  box-shadow: inset 2px 0 0 var(--acc-2); transform: none; }
.sidenav .top-sair { background: none; border: none; box-shadow: none; color: var(--tx-2); }
.sidenav .top-sair:hover { background: var(--field-bg); color: var(--tx); transform: none; box-shadow: none; }
.top-item.con-back { background: var(--panel-b); border-color: var(--line-2); color: var(--tx-2); }

/* ---- FAIXA DE CIMA: indicadores na largura da Agenda, Financeiro na do Bloco de notas ---- */
.p5-topo { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, .98fr);
  gap: 12px; margin-bottom: 12px; align-items: stretch; }
@media (max-width: 1080px) { .p5-topo { grid-template-columns: 1fr; } }
/* home compartimentada por módulo (28/07): só um bloco na faixa → coluna única */
.p5-topo.p5-topo-solo { grid-template-columns: 1fr; }
.p5-acesso-corpo { padding: 14px; font-size: 13px; color: var(--tx-2); line-height: 1.5; }
.p5-acesso-btns { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.p5-botoes { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; }
@media (max-width: 1240px) { .p5-botoes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 620px) { .p5-botoes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bt-ind { display: flex; flex-direction: column; gap: 5px; text-align: left; min-width: 0;
  background: linear-gradient(180deg, var(--met-hi2) 0%, var(--met-lo2) 100%);
  border: 1px solid var(--line-2); border-radius: 12px; padding: 10px 11px 11px; cursor: pointer;
  box-shadow: inset 0 1px 0 var(--met-edge), var(--shadow-1);
  transition: transform .13s, border-color .13s, box-shadow .13s, background .13s; }
.bt-ind:hover { transform: translateY(-2px); border-color: var(--acc-hair);
  background: linear-gradient(180deg, var(--met-hi2) 0%, var(--hover-acc) 130%);
  box-shadow: inset 0 1px 0 var(--met-edge), var(--shadow-2); }
.bt-ind:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.bt-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
/* símbolo SÓLIDO: bloco cheio, glifo branco — o lavado claro sumia no card */
.bt-ic { flex: none; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center;
  background: #39434C; border: 1px solid #39434C; color: #FFF;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14); }
html[data-tema="escuro"] .bt-ic { border-color: #4A5560; }
.bt-ic .i { width: 15px; height: 15px; color: #FFF; stroke-width: 2.05; }
.bt-num { font-size: 26px; font-weight: 600; line-height: 1; color: var(--tx);
  font-variant-numeric: tabular-nums; letter-spacing: -.6px; }
.bt-lab { font-size: 11.5px; font-weight: 700; color: var(--tx); line-height: 1.25; }
.bt-tag { font-size: 8.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--tx-3); }
/* tutela de urgência: prazo em horas e perda irreversível, aro verde PERMANENTE */
.bt-forte { border-color: var(--acc-hair);
  box-shadow: inset 0 0 0 1px var(--acc-soft), inset 0 1px 0 var(--met-edge), var(--shadow-1); }
.bt-forte .bt-ic { background: var(--acc); border-color: var(--acc); }
/* segredo de justiça: o robô não alcança, contorno vazado e nunca bloco cheio */
.bt-manual { border-style: dashed; }
.bt-manual .bt-ic { background: transparent; border: 1.5px dashed var(--line-2); box-shadow: none; color: var(--tx-2); }
.bt-manual .bt-ic .i { color: var(--tx-2); }
.bt-manual .bt-num { color: var(--tx-2); }

/* ---- FINANCEIRO enxuto (mesmas laterais do Bloco de notas) ---- */
.fin-mini .p5-ph { padding: 7px 13px 6px; }
.fin-mini .p5-pt { font-size: 12px; }
.fin-corpo { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fin-cel { display: flex; flex-direction: column; gap: 2px; text-align: left; min-width: 0;
  background: none; border: none; border-right: 1px solid var(--line); padding: 7px 12px 8px; cursor: pointer; }
.fin-cel:last-child { border-right: none; }
.fin-cel:hover { background: var(--hover-acc); }
.fin-lab { font-size: 9px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; color: var(--tx-3); }
.fin-val { font-size: 18px; font-weight: 700; color: var(--tx); line-height: 1.15;
  font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fin-sub { font-size: 10px; font-weight: 600; color: var(--tx-3); line-height: 1.3;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---- BLOCO DE NOTAS (no lugar do painel financeiro antigo) ---- */
.p5-notas { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 10px 11px; gap: 9px; }
/* LEMBRETES (026): criar é o "+" pequeno NA FAIXA escura do cartão (pedido 27/07) */
.nt-ph-dir { display: flex; align-items: center; gap: 9px; }
.nt-mais { flex: none; width: 24px; height: 24px; display: grid; place-items: center; padding: 0;
  font: inherit; font-size: 17px; font-weight: 800; line-height: 1; color: #FFF;
  background: var(--acc); border: 1px solid var(--acc); border-radius: 7px; cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2); }
.nt-mais:hover { background: var(--acc-2); }
/* caixinha de concluir dos "Prazos do dia" da home (compromissos e prazos do robô) */
.p5-chk { flex: none; width: 17px; height: 17px; border-radius: 50%; padding: 0; cursor: pointer;
  border: 1.5px solid var(--line-2); background: transparent; display: grid; place-items: center;
  font-size: 10px; line-height: 1; color: transparent; }
.p5-chk:hover { border-color: var(--acc-hair); }
.p5-chk.on { background: var(--acc); border-color: var(--acc); color: #FFF; }
.p5-chk.on::after { content: '✓'; }
.p5-ev-done .p5-ttx b { text-decoration: line-through; opacity: .6; }
.nt-data { color: var(--acc-tx); font-weight: 800; }
.nt-venc { color: #C24534; }
html[data-tema="escuro"] .nt-venc { color: #E8746B; }
.nt-urg-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--tx); margin-top: 8px; cursor: pointer; }
.nt-cont { font-size: 10.5px; color: var(--tx-2); font-weight: 600; }
.nt-cont-urg { color: var(--tx); font-weight: 800; }
.nt-lista { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin;
  display: flex; flex-direction: column; gap: 6px; padding-right: 2px; }
.nt-item { display: flex; align-items: flex-start; gap: 8px; background: var(--panel-b);
  border: 1px solid var(--line); border-radius: 10px; padding: 8px 9px;
  transition: transform .13s, border-color .13s, box-shadow .13s; }
.nt-item:hover { transform: translateY(-1px); border-color: var(--acc-hair); box-shadow: var(--shadow-1); }
/* urgente sem vermelho: faixa clara na lateral e rótulo em versalete */
.nt-item.nt-urgente { background: var(--field-bg); border-color: var(--line-2); box-shadow: inset 4px 0 0 var(--tx-2); }
.nt-item.nt-urgente .nt-tx b { font-weight: 700; }
.nt-item.nt-urgente .nt-meta { color: var(--tx-2); font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; font-size: 9px; }
.nt-check { flex: none; width: 16px; height: 16px; margin-top: 1px; border-radius: 5px;
  border: 2px solid var(--line-2); background: none; color: var(--acc-tx); font-size: 11px; font-weight: 800;
  line-height: 1; cursor: pointer; display: grid; place-items: center; }
.nt-check:hover { border-color: var(--acc-2); }
.nt-check.nt-ok { border-color: var(--acc-soft); background: var(--hover-acc); }
.nt-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.nt-tx b { font-size: 12.5px; font-weight: 600; color: var(--tx); line-height: 1.35; overflow-wrap: anywhere; }
.nt-meta { display: flex; align-items: center; gap: 5px; font-size: 10px; color: var(--tx-2); }
.nt-dot { width: 5px; height: 5px; border-radius: 1px; background: var(--tx-2); }
.nt-x { flex: none; font: inherit; font-size: 15px; line-height: 1; color: var(--tx-3); background: none;
  border: none; cursor: pointer; padding: 0 2px; border-radius: 5px; opacity: 0; }
.nt-item:hover .nt-x, .nt-x:focus-visible { opacity: 1; }
.nt-x:hover { color: var(--tx); }
@media (pointer: coarse) { .nt-x { opacity: 1; } }  /* sem hover no toque: o × precisa aparecer */
.nt-item.nt-feito { opacity: .55; }
.nt-item.nt-feito .nt-tx b { text-decoration: line-through; color: var(--tx-2); }
.nt-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px;
  border-top: 1px solid var(--line); padding-top: 7px; }
.nt-hint { font-size: 10px; color: var(--tx-3); }

/* ---- AGENDA mais alta, com a altura TRAVADA ----
   Fixa (não min-height): senão o Bloco de notas cresce com a quantidade de anotações e
   empurra a página. Com altura fixa, a lista rola por dentro do próprio card e o painel
   inteiro cabe na tela de um notebook. */
@media (min-width: 1081px) { .p5-row-alto { height: 336px; } }
.p5-row-alto { min-height: 336px; }
.p5-row-alto .p5-calgrid .p5-d { min-height: 22px; }
.p5-row-alto .p5-cal { padding: 8px 12px 6px; }
.p5-row-alto .p5-calleg { padding: 6px 2px 0; }

/* ---- títulos em verde e tinta mais forte nos rótulos ---- */
.p5-pt { color: var(--acc-tx); font-weight: 800; font-size: 13px; }
.p5-ph { background: linear-gradient(180deg, var(--met-hi2) 0%, var(--met-lo2) 100%);
  box-shadow: inset 0 1px 0 var(--met-edge); }
.p5-panel { border-color: var(--line-2);
  background: linear-gradient(180deg, var(--met-hi2) 0%, var(--met-lo2) 100%);
  box-shadow: inset 0 1px 0 var(--met-edge), var(--shadow-1); }
.p5-calnav b { color: var(--acc-tx); font-weight: 800; font-size: 13px; }
.p5-tars-h, .p5-tars-h b { color: var(--acc-tx); font-weight: 800; }
.p5-calgrid .p5-wd { font-weight: 800; color: var(--tx-2); font-size: 10px; }
.p5-calgrid .p5-d { font-weight: 600; color: var(--tx); font-size: 12px; }
.p5-calgrid .p5-d.p5-mut { color: var(--tx-3); }
.p5-calgrid .p5-d.p5-hoje { background: var(--acc); color: #FFF; font-weight: 800; box-shadow: var(--shadow-1); }
.p5-calleg span { color: var(--tx-2); font-weight: 600; }
.sc-link { font-weight: 800; }
/* urgência por TOM: cheio, médio, vazado (os tokens --v4-* já são neutros) */
.p5-bgred { background: var(--tx); }
.p5-bgamber { background: var(--tx-3); }
.p5-bggreen { background: transparent; box-shadow: inset 0 0 0 2px var(--tx-3); }

/* ---- botões com corpo ---- */
.v4btn { background: linear-gradient(180deg, var(--met-hi2) 0%, var(--met-lo2) 100%);
  border-color: var(--line-2); color: var(--tx); font-weight: 700; box-shadow: var(--shadow-1); }
.v4btn.primary { background: linear-gradient(180deg, var(--acc-2) 0%, var(--acc) 100%);
  border-color: var(--acc); color: #FFF; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), var(--shadow-1); }
.v4btn.primary:hover { filter: none; background: var(--acc-2); }
.topnav { box-shadow: var(--shadow-1); }
.topnav-avatar, .sidenav-avatar { background: var(--acc-soft); color: var(--acc-tx-2);
  border-color: var(--acc-hair); font-weight: 800; }
html[data-tema="claro"] .topnav-avatar, html[data-tema="claro"] .sidenav-avatar { color: var(--acc-tx); }

/* ---- chips de FOCO na aba Processos (os mesmos cinco recortes da home) ---- */
.proc-focos { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin: 0 0 10px; }
.proc-foco { font: inherit; font-size: 11.5px; font-weight: 700; color: var(--tx-2);
  background: var(--panel-b); border: 1px solid var(--line-2); border-radius: 999px;
  padding: 5px 12px; cursor: pointer; white-space: nowrap; }
.proc-foco:hover { color: var(--tx); border-color: var(--acc-hair); }
.proc-foco.on { color: #FFF; background: var(--acc); border-color: var(--acc); }
.proc-foco-n { font-variant-numeric: tabular-nums; opacity: .8; margin-left: 4px; }
/* selo de segredo de justiça na lista e na ficha */
.selo-sigilo { display: inline-flex; align-items: center; gap: 4px; font-size: 9px; font-weight: 800;
  letter-spacing: .08em; text-transform: uppercase; color: var(--tx-2);
  border: 1px dashed var(--line-2); border-radius: 5px; padding: 1px 5px; }

@media (prefers-reduced-motion: reduce) {
  .sidenav .top-item:hover, .bt-ind:hover, .nt-item:hover { transform: none; }
}

/* ---- Modal da EQUIPE (Novo/Editar usuário) — refeito 28/07 ----
   Regras EXPLÍCITAS em cada label: as regras genéricas de formulário (.nf label:
   maiúsculas + letter-spacing largo) vazavam para os itens de checkbox e bagunçavam
   o diálogo. Aqui cada peça tem o próprio estilo, nada herdado por acidente. */
.uiModal.eq-modal { width: min(640px, calc(100vw - 32px)); }
.eq-form .eq-g2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.eq-papel-desc { display: block; margin-top: 5px; font-size: 11.5px; color: var(--tx-3); line-height: 1.35; min-height: 15px; }
.eq-bloco { margin-bottom: 14px; }
.eq-bloco-tit {
  display: block; font-size: 10px; color: var(--tx-3); font-weight: 700;
  text-transform: uppercase; letter-spacing: .2em; margin-bottom: 7px;
}
.eq-bloco-dica { display: block; margin-top: 7px; font-size: 11px; color: var(--tx-3); line-height: 1.4; }
.eq-mods { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.eq-mod {
  display: flex; align-items: flex-start; gap: 9px; padding: 8px 10px;
  border: 1px solid var(--line-2); border-radius: 10px; background: var(--field-bg);
  cursor: pointer; text-transform: none; letter-spacing: 0;
  transition: border-color .18s, background .18s;
}
.eq-mod:hover { border-color: var(--acc-soft); background: var(--hover-acc); }
.eq-mod:has(input:checked) { border-color: var(--acc); }
.eq-mod input { accent-color: var(--acc); width: 15px; height: 15px; margin-top: 2px; padding: 0; flex: 0 0 auto; }

/* ---- Modal "Consultas avançadas" do Console (28/07) — mesmo princípio do modal da
   Equipe: classes próprias, FORA do .nf, para as regras genéricas de formulário
   (input 100% + padding de campo; label 10px caixa alta) não vazarem nos radios. */
.ct-grupo { margin-top: 10px; }
.ct-titulo {
  font-size: 10px; color: var(--tx-3); font-weight: 700;
  text-transform: uppercase; letter-spacing: .2em; margin-bottom: 3px;
}
.ct-op {
  display: flex; gap: 8px; align-items: center; margin-top: 7px; cursor: pointer;
  font-size: 13px; font-weight: 600; color: var(--tx); text-transform: none; letter-spacing: 0;
}
.ct-op input[type="radio"] { accent-color: var(--acc); width: 15px; height: 15px; padding: 0; margin: 0; flex: 0 0 auto; }
.ct-op .ct-valor {
  width: 110px; flex: 0 0 auto; padding: 6px 9px; font-size: 13px; color: var(--tx);
  border: 1px solid var(--line-2); border-radius: 8px; background: var(--field-bg);
}
.ct-op.ct-forte { font-weight: 800; }
/* (07/08) o mesmo bloco .ct-* passou a servir ao formulário ÚNICO de "Editar escritório",
   que tem opções de DUAS linhas (título + explicação) e uma lista de checkboxes de módulos.
   Só acrescenta: as regras acima continuam valendo para as opções de uma linha. */
.ct-op input[type="checkbox"] { accent-color: var(--acc); width: 15px; height: 15px; padding: 0; margin: 0; flex: 0 0 auto; }
.ct-op:has(small) { align-items: flex-start; }         /* opção com explicação: alinha pelo topo */
.ct-op small { display: block; font-size: 10.5px; font-weight: 500; color: var(--tx-3); line-height: 1.3; margin-top: 1px; }
.ct-op b { font-weight: 700; }
.ct-mods {                                              /* lista de módulos do escritório */
  margin: 6px 0 2px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--panel-a);
}
.ct-mods .ct-op { margin-top: 5px; }
.ct-mods .ct-op:first-child { margin-top: 0; }
.eq-mod-tx { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.eq-mod-tx b { font-size: 12.5px; font-weight: 700; color: var(--tx); line-height: 1.25; }
.eq-mod-tx small { font-size: 10.5px; color: var(--tx-3); line-height: 1.3; }
/* sub-bloco das ÁREAS (aparece quando "Processos" está marcado) — ocupa a linha inteira */
.eq-sub {
  grid-column: 1 / -1; margin: 0 0 2px; padding: 9px 12px;
  border-left: 2px solid var(--acc-soft); background: var(--panel-b);
  border-radius: 0 9px 9px 0; display: flex; flex-direction: column; gap: 6px;
}
.eq-sub-tit { font-size: 9.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--tx-3); }
.eq-sub-dica { font-size: 10.5px; color: var(--tx-3); line-height: 1.35; }
.eq-areas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 10px; }
.eq-area {
  display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--tx);
  text-transform: none; letter-spacing: 0; cursor: pointer;
}
.eq-area input { accent-color: var(--acc); width: 14px; height: 14px; padding: 0; flex: 0 0 auto; }
.eq-convite {
  font-size: 12px; color: var(--tx-2); line-height: 1.5; padding: 9px 12px;
  border: 1px solid var(--acc-soft); border-radius: 10px; background: var(--hover-acc);
  margin-bottom: 12px;
}
.eq-link {
  background: none; border: none; padding: 0; font: inherit; font-size: 11.5px;
  color: var(--acc-tx); text-decoration: underline; cursor: pointer;
}
.eq-convite.eq-aviso { border-color: var(--amber, #C9932F); background: var(--panel-b); }
/* Coluna "Acessos" da Equipe (31/07): um selo por módulo, EMPILHADOS (o Geone pediu um
   embaixo do outro), e as áreas de Processos numa linha discreta abaixo. */
.eq-acessos { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.eq-acesso-pill { font-size: 9.5px; padding: 2px 8px; }
.eq-acesso-areas { font-size: 10px; color: var(--tx-3); line-height: 1.4; margin-top: 2px; }
.eq-acesso-vazio { font-size: 11px; color: var(--err-tx); }
/* Carteira de processos por área (038) — escolha explícita entre todas x recortada.
   Classes `eq-cart-*` próprias: `.nf label` do modal põe CAIXA ALTA e letter-spacing
   largo, que já vazou para checkboxes da Equipe antes (regra registrada em 28/07). */
.eq-cart { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
.eq-cart .eq-cart-op { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; text-transform: none; letter-spacing: normal; font-size: 13px; }
.eq-cart .eq-cart-op input { margin-top: 3px; flex: none; accent-color: var(--acc); width: 15px; height: 15px; padding: 0; }
.eq-cart .eq-cart-op b { display: block; font-weight: 700; color: var(--tx); text-transform: none; letter-spacing: normal; }
.eq-cart .eq-cart-op small { display: block; font-size: 11.5px; color: var(--tx-3); line-height: 1.45; text-transform: none; letter-spacing: normal; }
/* OAB: número + UF na mesma linha */
.eq-oab .eq-oab-linha { display: flex; gap: 8px; }
.eq-oab .eq-oab-linha input { flex: 1; min-width: 0; }
.eq-oab .eq-oab-linha select { flex: none; width: 86px; }
/* aviso de que administrador acessa tudo (some a delegação) */
.eq-aviso-admin { margin-top: 10px; padding: 11px 14px; border-radius: 10px; background: var(--panel-b); border-left: 3px solid var(--acc); font-size: 12.5px; line-height: 1.55; color: var(--tx-2); }
.eq-aviso-admin b { color: var(--tx); }

/* módulo que o PLANO do escritório não inclui: visível, porém travado e com o motivo */
.eq-mod-off { opacity: .55; }
.eq-mod-off input { cursor: not-allowed; }
.eq-mod-off small { color: var(--err-tx); }
.eq-acoes { white-space: nowrap; }
.eq-acoes .ghbtn { margin-bottom: 2px; }
.eq-btn-perigo { color: var(--err-tx) !important; border-color: var(--err-vivid) !important; }
.eq-btn-perigo:hover { background: var(--err-bg) !important; }
.eq-excluir-lista { margin: 10px 0 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; line-height: 1.5; }
@media (max-width: 640px) {
  .eq-form .eq-g2, .eq-mods, .eq-areas { grid-template-columns: 1fr; }
  .eq-acoes { white-space: normal; }
}
/* chip "mover de área" na ficha do processo */
.etq-add.dw-area { font-weight: 700; }
.mv-txt { font-size: 12.5px; color: var(--tx-2); line-height: 1.5; margin-bottom: 10px; }

/* ============================================================================
   MODO DIA v6.3 — "Grafite Executivo + verde da logo" (aprovado pelo Geone em
   27/07/2026 via mockup standalone). As faixas dos cards deixam o verde-grafite
   (lia como "saúde") e viram GRAFITE puro; o verde CLARO da logo entra só como
   assinatura — links das faixas e acentos. Só no tema claro — a noite já está
   aprovada. Estrutura e layout intocados: apenas cor e profundidade.
   ============================================================================ */
html[data-tema="claro"] .p5-ph {
  /* v6.6.1 (11/08, Geone): as faixas dos cards da home ficam CLARAS — o preto sai do
     miolo e mora só na lateral (Modelo H/K); título e links voltam ao verde escuro */
  background: linear-gradient(180deg, #EDF1F4 0%, #DFE5EA 100%);
  border-bottom: 1px solid var(--line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
}
html[data-tema="claro"] .p5-ph .p5-pt { color: var(--acc-tx); }
html[data-tema="claro"] .p5-ph .sc-link { color: var(--acc-tx); }
html[data-tema="claro"] .p5-ph .sc-link:hover { color: var(--acc-tx-2); }
html[data-tema="claro"] .p5-ph .nt-cont { color: var(--tx-3); }
html[data-tema="claro"] .p5-ph .nt-cont-urg { color: var(--tx); }
/* topo e lateral um tom abaixo: a logo (imagem intacta) volta a ter contraste */
html[data-tema="claro"] .sidenav { background: linear-gradient(180deg, #C2CCD3 0%, var(--met-fundo) 170%); }
html[data-tema="claro"] .sidenav-brand { border-bottom-color: #AAB6BF; }
/* chips dos indicadores: mais escuros e com sombra própria — o "botão dentro do botão" */
html[data-tema="claro"] .bt-ic {
  background: linear-gradient(180deg, #46505A 0%, #2B343D 100%);
  border-color: #232B33;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 2px 4px rgba(15, 23, 30, .32);
}
html[data-tema="claro"] .bt-forte .bt-ic {
  background: linear-gradient(180deg, #3A3AD9 0%, #1D1D7C 100%);
  border-color: #1A1A6E;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .26), 0 2px 4px rgba(15, 23, 30, .32);
}
html[data-tema="claro"] .bt-manual .bt-ic { background: transparent; box-shadow: none; }
/* botões de indicador: borda firme e degrau visível sobre o cartão grande */
html[data-tema="claro"] .bt-ind { border-color: #7E8D99; }
html[data-tema="claro"] .bt-manual { border-color: #94A1AC; }
html[data-tema="claro"] .nt-item { border-color: #A5B1BA; }
html[data-tema="claro"] .sidenav .top-item:not(.nav-filho):not(.top-sair) { border-color: #97A4AF; }
/* v6.3: profundidade — as caixas descem um tom (nada de branco estourado) e ganham
   sombra real por baixo; o degradê escurece de cima p/ baixo como luz vinda do topo */
html[data-tema="claro"] .bt-ind {
  background: linear-gradient(180deg, #E6EAEE 0%, #D3DBE1 100%);
  box-shadow: inset 0 1px 0 var(--met-edge), 0 2px 4px rgba(15, 23, 30, .16), 0 10px 22px -8px rgba(15, 23, 30, .35);
}
html[data-tema="claro"] .bt-ind:hover {
  background: linear-gradient(180deg, #E6EAEE 0%, var(--hover-acc) 130%);
  box-shadow: inset 0 1px 0 var(--met-edge), 0 4px 8px rgba(15, 23, 30, .18), 0 16px 30px -10px rgba(15, 23, 30, .42);
}
/* o aro verde PERMANENTE da tutela de urgência sobrevive à sombra nova (especificidade) */
html[data-tema="claro"] .bt-forte {
  box-shadow: inset 0 0 0 1px var(--acc-soft), inset 0 1px 0 var(--met-edge), 0 2px 4px rgba(15, 23, 30, .16), 0 10px 22px -8px rgba(15, 23, 30, .35);
}
html[data-tema="claro"] .bt-forte:hover {
  box-shadow: inset 0 0 0 1px var(--acc-soft), inset 0 1px 0 var(--met-edge), 0 4px 8px rgba(15, 23, 30, .18), 0 16px 30px -10px rgba(15, 23, 30, .42);
}
/* foco por teclado legível sobre a faixa grafite */
html[data-tema="claro"] .p5-ph .sc-link:focus-visible { outline-color: var(--acc); }
/* v6.3.2 (27/07, ajuste do Geone — a placa isolada da v6.3.1 não agradou): a BARRA
   SUPERIOR INTEIRA vira grafite escuro em COR ÚNICA, de ponta a ponta, com a logo sobre
   ela. A faixa da marca na lateral usa o MESMO tom e sangra até as bordas do menu:
   os dois trechos se emendam e leem como UMA barra contínua. Geometria intocada. */
/* v6.6.2 (11/08, Geone via Modelo K — agora GLOBAL): o TOPO deixa o preto em TODAS as
   telas (painel, clientes, agenda, radar, configurações e Console): tom mais claro que o
   ambiente + sombra projetada sobre o conteúdo. O preto metálico fica SÓ na lateral. */
html[data-tema="claro"] .topnav {
  background: linear-gradient(180deg, #F2F5F7 0%, #E2E7EB 100%);
  border-bottom-color: rgba(15, 23, 30, .10);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 3px 6px rgba(15, 23, 30, .14), 0 12px 28px -8px rgba(15, 23, 30, .35);
}
html[data-tema="claro"] .topnav-search { background: rgba(255, 255, 255, .60); border-color: #B9C3CB; color: #66717B; }
html[data-tema="claro"] .topnav-search input { color: #1A2026; }
html[data-tema="claro"] .topnav-search input::placeholder { color: #7C8791; }
html[data-tema="claro"] .topnav .plano-chip { color: var(--acc-tx); border-color: var(--acc-soft); background: color-mix(in srgb, var(--acc) 7%, transparent); }
html[data-tema="claro"] .topnav .topo-btn.ic { color: #46505A; }
html[data-tema="claro"] .topnav .topo-btn.ic:hover { background: rgba(15, 23, 30, .08); color: #1A2026; }
html[data-tema="claro"] .topnav .topo-btn.sair { border-color: #97A4AF; color: #46505A; }
html[data-tema="claro"] .topnav .topo-btn.sair:hover { border-color: #C0564B; color: #C0564B; }
html[data-tema="claro"] .topnav-burger { color: #46505A; }
html[data-tema="claro"] .topnav-user-tx > #topo-user { color: #1A2026; }
html[data-tema="claro"] .topnav-esc { color: #66717B; }
html[data-tema="claro"] .topnav .top-item { color: #46505A; }
html[data-tema="claro"] .topnav .top-item:hover { background: rgba(15, 23, 30, .07); color: #1A2026; }
html[data-tema="claro"] .topnav .top-item.ativo { background: color-mix(in srgb, var(--acc) 14%, transparent); color: #1A2026; }
html[data-tema="claro"] .topnav :focus-visible { outline-color: var(--acc); }
/* marca na barra (mobile/tablet): sobre o fundo claro o texto volta à tinta */
html[data-tema="claro"] .topnav-brand { color: #1A2026; }
html[data-tema="claro"] .topnav-logo,
html[data-tema="claro"] .topnav-logo .logo-img { width: 32px; height: 32px; }
/* faixa da marca na lateral: mesmo grafite, sangrado até as bordas (emenda com a barra).
   Régua do Geone 27/07: marca ENCOSTADA no canto (13px) e nome em 34px. */
html[data-tema="claro"] .sidenav-brand {
  justify-content: flex-start;
  padding-left: 13px;
  font-size: 34px;
  margin-left: -12px; margin-right: -12px;
  background: linear-gradient(180deg, #15171A 0%, #0A0B0D 55%, #040506 100%); /* v6.5: mesmo metal da topnav — emenda contínua */
  border-bottom-color: #000;
  color: #EFF2F5;
  box-shadow: 1px 0 0 #0A0B0D; /* cobre o fio claro da divisa lateral no trecho da barra */
}
html[data-tema="claro"] .sidenav-brand:focus-visible { outline-color: var(--vivo); }
html[data-tema="claro"] .sidenav-logo,
html[data-tema="claro"] .sidenav-logo .logo-img { width: 38px; height: 38px; }
html[data-tema="claro"] .sidenav-brand .con-badge { color: var(--vivo); border-color: color-mix(in srgb, var(--vivo) 45%, transparent); }
/* v6.3.3 (27/07, Geone): sobre a barra preta da LATERAL, o globo fica MONOCROMÁTICO no
   verde da logo — a forma vem do próprio PNG oficial via mask (a imagem no disco segue
   intacta). v6.6.2: o topo agora é CLARO, então a logo do topo (mobile) volta ao PNG
   original, que foi desenhado para fundo claro — sem mask. */
html[data-tema="claro"] .sidenav-logo:has(img.logo-img) {
  background-color: var(--vivo);
  -webkit-mask: url("/img/logo-globo.png") center / contain no-repeat;
  mask: url("/img/logo-globo.png") center / contain no-repeat;
}
html[data-tema="claro"] .sidenav-logo .logo-img { opacity: 0; }
html[data-tema="claro"] .sidenav-name .marca-ai { color: var(--vivo); }
html[data-tema="claro"] .topnav-name .marca-ai { color: var(--acc-tx); }
/* v6.4.1 (27/07): "Jus" em EXPOENTE itálico ao lado do nome (como raiz quadrada) —
   a referência do sistema jurídico; herda a cor do nome, só muda peso/inclinação */
.sidenav-name .marca-jus, .topnav-name .marca-jus {
  font-style: italic; font-weight: 600; font-size: .57em; letter-spacing: .03em;
  display: inline-block; transform: translateY(-.55em); margin-left: 3px;
}
/* e a logo um pouco maior na faixa da marca (58px de altura comporta) */
html[data-tema="claro"] .sidenav-logo,
html[data-tema="claro"] .sidenav-logo .logo-img { width: 46px; height: 46px; }
html[data-tema="claro"] .topnav-logo,
html[data-tema="claro"] .topnav-logo .logo-img { width: 36px; height: 36px; }

/* ============================================================================
   v6.4 (aprovado 27/07) — MENU RECOLHÍVEL + LATERAL GRAFITE (Modelo C) +
   BARRA DE PROCESSOS EM SEGMENTOS/ABAS (Modelo B). Funções intactas.
   ============================================================================ */
/* ---- setinha no topo + estado recolhido: geometria vale nos DOIS temas ---- */
/* especificidade ≥ .topo-btn.ic — senão o display:grid de lá vence e a seta vaza no mobile */
.topo-btn.ic.btn-menu-lateral { display: none; }
@media (min-width: 1081px) {
  /* colada na linha que divide a coluna (o respiro da topnav chega a 140px — longe demais) */
  .topnav-in { position: relative; }
  .topo-btn.ic.btn-menu-lateral { display: grid; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); }
  .sidenav { transition: width .16s ease; }
  body.menu-mini .sidenav { width: 64px; padding-left: 8px; padding-right: 8px; }
  body.menu-mini .sidenav-brand { margin-left: -8px; margin-right: -8px; justify-content: center; padding-left: 0; }
  body.menu-mini .sidenav-name, body.menu-mini .sidenav-brand .con-badge { display: none; }
  body.menu-mini .sidenav .top-item { position: relative; justify-content: center; font-size: 0; gap: 0; padding: 11px 0; }
  body.menu-mini .sidenav .nav-tag, body.menu-mini .sidenav .nav-seta { display: none; }
  /* o contador de urgências do Radar não pode sumir: vira um ponto no canto do ícone */
  body.menu-mini .sidenav .nav-badge { position: absolute; top: 5px; right: 9px; margin: 0;
    min-width: 9px; width: 9px; height: 9px; padding: 0; border-radius: 50%; font-size: 0; }
  body.menu-mini .sidenav .nav-sub { display: none; }
  body.menu-mini .sidenav-user-tx { display: none; }
  body.menu-mini .sidenav-foot { justify-content: center; }
}
/* no Console a setinha não faz sentido (menu do dono fica sempre aberto) */
.topnav.console .topo-btn.ic.btn-menu-lateral { display: none; }
html[data-tema="claro"] .topnav .btn-menu-lateral { background: rgba(255, 255, 255, .65); border-color: #B9C3CB; }
html[data-tema="claro"] .topnav .btn-menu-lateral:hover { background: #FFFFFF; }

/* (v6.6.2: o bloco body.topo-claro por rota foi PROMOVIDO a padrão global lá em cima —
   o topo claro agora vale em todas as telas e o app.js não liga mais classe nenhuma) */

/* ---- Modelo C: a lateral inteira no grafite da marca (só tema claro) ---- */
html[data-tema="claro"] .sidenav { background: linear-gradient(180deg, #101215 0%, #07080A 60%, #030405 100%); border-right-color: #000; box-shadow: inset -1px 0 0 rgba(255, 255, 255, .04); } /* v6.5: preto metálico */
html[data-tema="claro"] .sidenav-brand { box-shadow: none; border-bottom-color: #1E2126; }
html[data-tema="claro"] .sidenav .top-item { background: none; border: none; box-shadow: none; color: #B9C1CA; font-weight: 600; }
html[data-tema="claro"] .sidenav .top-item:hover { background: rgba(255, 255, 255, .07); color: #FFFFFF; transform: none; box-shadow: none; }
html[data-tema="claro"] .sidenav .top-item.ativo { background: color-mix(in srgb, var(--vivo) 13%, transparent); color: #FFFFFF; font-weight: 800; box-shadow: inset 3px 0 0 var(--vivo); }
html[data-tema="claro"] .sidenav .nav-ic { color: #96A1AD; }
html[data-tema="claro"] .sidenav .top-item.ativo .nav-ic { color: var(--vivo); }
html[data-tema="claro"] .sidenav .top-item.nav-breve { color: #737E8A; }
html[data-tema="claro"] .sidenav .top-item.nav-breve .nav-ic { color: #5F6874; }
html[data-tema="claro"] .sidenav .nav-tag { color: #7A8590; border-color: #46525F; }
html[data-tema="claro"] .sidenav .nav-sep { background: #262B31; }
html[data-tema="claro"] .sidenav .nav-seta { color: #7A8590; }
html[data-tema="claro"] .sidenav .nav-sub { border-left-color: #46525F; }
html[data-tema="claro"] .sidenav .top-item.nav-filho { color: #96A1AD; }
html[data-tema="claro"] .sidenav .top-item.nav-filho:hover { background: rgba(255, 255, 255, .07); color: #FFFFFF; }
html[data-tema="claro"] .sidenav .top-item.nav-filho.ativo { background: color-mix(in srgb, var(--vivo) 13%, transparent); color: #FFFFFF; box-shadow: inset 2px 0 0 var(--vivo); }
html[data-tema="claro"] .sidenav .top-sair { color: #E8746B; }
html[data-tema="claro"] .sidenav .top-sair:hover { background: rgba(255, 255, 255, .07); color: #FF9A90; }
html[data-tema="claro"] .sidenav .top-item.con-back { background: none; border: none; color: #B9C1CA; }
html[data-tema="claro"] .sidenav-foot { border-top-color: #262B31; }
html[data-tema="claro"] .sidenav #side-user { color: #EFF2F5; }
html[data-tema="claro"] .sidenav .sidenav-esc { color: #96A1AD; }
html[data-tema="claro"] .sidenav :focus-visible { outline-color: var(--vivo); }

/* ---- Modelo B: filtros em SEGMENTOS retos e focos em ABAS SUBLINHADAS (só tema claro) ---- */
html[data-tema="claro"] .proc-tabs { gap: 0; padding: 0; border-radius: 9px; overflow: hidden; border-color: var(--line-2); }
html[data-tema="claro"] .proc-tab { border-radius: 0; border-right: 1px solid var(--line-2); padding: 9px 15px; }
html[data-tema="claro"] .proc-tab:last-child { border-right: none; }
html[data-tema="claro"] .proc-tab:hover:not(.ativo) { background: var(--panel-a); }
html[data-tema="claro"] .proc-tab.ativo { box-shadow: none; }
html[data-tema="claro"] .proc-focos { gap: 2px; border-bottom: 1px solid var(--line); padding: 0 2px; }
html[data-tema="claro"] .proc-foco { background: none; border: none; border-radius: 0; border-bottom: 3px solid transparent; padding: 8px 12px 7px; }
html[data-tema="claro"] .proc-foco:hover { border-bottom-color: var(--line-2); color: var(--tx); }
html[data-tema="claro"] .proc-foco.on { background: none; color: var(--tx); border-bottom-color: var(--acc-2); font-weight: 800; }
html[data-tema="claro"] .proc-foco .proc-foco-n { color: var(--acc-tx); opacity: 1; font-weight: 800; }
html[data-tema="claro"] .p5-panel {
  background: linear-gradient(180deg, #E7EBEF 0%, #D4DCE2 100%);
  box-shadow: inset 0 1px 0 var(--met-edge), 0 2px 5px rgba(15, 23, 30, .15), 0 12px 26px -10px rgba(15, 23, 30, .34);
}

/* ============================================================================
   RADAR · HISTÓRICO DE CONSULTAS (layout aprovado pelo Geone em 28/07/2026)
   Tabela permanente e numerada, individual por login. Mesma família visual das
   faixas do Painel v6: faixa GRAFITE no tema claro, abas retas sublinhadas em
   verde da logo, corpo com zebra discreta. Nada aqui exibe custo — preço vive
   no Console. Rola na horizontal quando a tela é estreita (a página nunca).
   ============================================================================ */
.rdh { padding: 0; }
.rdh-ph { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, var(--met-hi2) 0%, var(--met-lo2) 100%);
  box-shadow: inset 0 1px 0 var(--met-edge); }
.rdh-ph h2 { margin: 0; font-size: 15px; font-weight: 700; color: var(--tx); }
.rdh-sub { font-size: 11.5px; color: var(--tx-3); margin-top: 1px; }
.rdh-ic { width: 30px; height: 30px; flex: none; border-radius: 8px; display: grid; place-items: center;
  background: var(--hover-acc); color: var(--acc-tx); }
.rdh-ic .i { width: 17px; height: 17px; }
.rdh-esp { flex: 1 1 auto; }
.rdh-busca { display: flex; align-items: center; gap: 8px; min-width: 220px; flex: 0 1 300px;
  background: var(--field-bg); border: 1px solid var(--line-2); border-radius: 9px; padding: 6px 11px; }
.rdh-busca .i { width: 14px; height: 14px; flex: none; color: var(--tx-3); }
.rdh-busca input { font: inherit; font-size: 12.5px; color: var(--tx); background: none; border: 0; outline: 0; width: 100%; min-width: 0; }

.rdh-abas { display: flex; padding: 0 16px; border-bottom: 1px solid var(--line); }
.rdh-aba { font: inherit; font-size: 12.5px; color: var(--tx-2); background: none; border: 0;
  border-bottom: 2px solid transparent; padding: 9px 15px; cursor: pointer; }
.rdh-aba:hover { color: var(--tx); }
.rdh-aba.ativa { color: var(--tx); font-weight: 700; border-bottom-color: var(--acc); }
.rdh-aba:focus-visible { outline: 2px solid var(--acc); outline-offset: -2px; }

.rdh-rolo { overflow-x: auto; }
.rdh-tbl { width: 100%; border-collapse: collapse; }
.rdh-tbl th { text-align: left; font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--tx-3); font-weight: 700; padding: 10px 13px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.rdh-tbl th.r, .rdh-tbl td.rdh-acoes { text-align: right; }
.rdh-tbl td { padding: 11px 13px; vertical-align: top; border-bottom: 1px solid var(--line); font-size: 12.5px; color: var(--tx-2); }
.rdh-tbl tbody tr:hover { background: var(--hover-acc); }
.rdh-num { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--tx); white-space: nowrap; }
.rdh-nome { font-weight: 700; color: var(--tx); font-size: 13px; }
.rdh-tipo { display: inline-block; margin-top: 3px; font-size: 9.5px; font-weight: 800; letter-spacing: .06em;
  border-radius: 999px; padding: 1.5px 8px; background: var(--panel-b); border: 1px solid var(--line-2); color: var(--tx-2); }
.rdh-tipo.nm { background: var(--hover-acc); border-color: var(--acc-soft); color: var(--acc-tx); }
.rdh-doc { font-variant-numeric: tabular-nums; white-space: nowrap; }
.rdh-resumo { max-width: 380px; min-width: 220px; line-height: 1.4; }
.rdh-data { white-space: nowrap; font-variant-numeric: tabular-nums; }
.rdh-autor b { display: block; font-size: 12.5px; color: var(--tx); font-weight: 700; }
.rdh-autor span { display: block; font-size: 11px; color: var(--tx-3); }
.rdh-acoes { white-space: nowrap; }
.rdh-bt { font: inherit; font-size: 11.5px; font-weight: 700; border-radius: 7px; padding: 6px 11px; cursor: pointer;
  background: var(--field-bg); border: 1px solid var(--line-2); color: var(--tx); }
.rdh-bt:hover { border-color: var(--acc); }
.rdh-bt.pdf { margin-left: 6px; background: var(--acc); border-color: var(--acc); color: #FFF; }
.rdh-bt.pdf:hover { background: var(--acc-2, var(--acc)); }
.rdh-exp { display: inline-block; margin-left: 6px; font-size: 10.5px; color: var(--tx-3);
  border: 1px dashed var(--line-2); border-radius: 6px; padding: 4px 8px; }
.rdh-rodape { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px 15px; font-size: 12px; color: var(--tx-3); }
.rdh-nav { display: flex; gap: 4px; }
.rdh-pg { font: inherit; font-size: 12px; min-width: 28px; height: 28px; border-radius: 7px; cursor: pointer;
  background: none; border: 1px solid var(--line-2); color: var(--tx-2); }
.rdh-pg:hover:not(:disabled) { color: var(--tx); border-color: var(--acc); }
.rdh-pg:disabled { opacity: .35; cursor: default; }
.rdh-pg-on { background: var(--acc); border-color: var(--acc); color: #FFF; font-weight: 700; }
@media (max-width: 860px) { .rdh-m { display: none; } .rdh-resumo { max-width: none; min-width: 160px; } }

/* tema claro: a faixa do histórico é a MESMA placa das faixas do Painel v6 (CLARA desde v6.6.1) */
html[data-tema="claro"] .rdh-ph {
  background: linear-gradient(180deg, #EDF1F4 0%, #DFE5EA 100%);
  border-bottom: 1px solid var(--line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
}
html[data-tema="claro"] .rdh-ph h2 { color: var(--acc-tx); }
html[data-tema="claro"] .rdh-ph .rdh-sub { color: var(--tx-3); }
html[data-tema="claro"] .rdh-ic { background: color-mix(in srgb, var(--acc) 14%, transparent); color: var(--acc-tx); }
html[data-tema="claro"] .rdh-busca { background: var(--field-bg); border-color: var(--line); }
html[data-tema="claro"] .rdh-busca input { color: var(--tx); }
html[data-tema="claro"] .rdh-busca input::placeholder { color: var(--tx-3); }
html[data-tema="claro"] .rdh-busca .i { color: var(--tx-3); }
html[data-tema="claro"] .rdh-busca:focus-within { outline: 2px solid var(--acc); outline-offset: 1px; }

/* Gerencial -> aba Consultas + Console -> ficha/aba Consultas (27/08/2026):
   consumo da base paga por pessoa; numeros alinhados a direita, zero apagadinho */
.ger-con-num { text-align: right; font-variant-numeric: tabular-nums; }
.ger-con-num.zero { color: var(--tx-3); }
.ger-con-oab { font-size: 11.5px; color: var(--tx-3); font-weight: 400; }
.ger-con-inativo td { opacity: .55; }
.con-tbl .cfe-con-zero { color: var(--tx-3); } /* .con-tbl td venceria a classe solta */

/* ===== LOGIN COM FOTO AMPLA (28/08/2026, layout aprovado pelo Geone) =====
   As telas de autenticação ganham a fotografia como fundo e o cartão CLARO fixo
   (independe do tema — sobre a foto, o cartão branco é o desenho aprovado).
   Nenhum id/fluxo muda: 2FA, primeiro acesso, convite e portão seguem intactos. */
/* :not([hidden]): a foto (657KB) só baixa quando uma tela de auth está de fato na tela —
   usuário logado navegando no app não paga esse download */
.tela-auth:not([hidden]) { background: #0C1116 url('/img/site-foto-advogados.jpg') center 26% / cover no-repeat; }
.tela-auth::before { content: ''; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(7,10,14,.72) 0%, rgba(7,10,14,.38) 34%, rgba(7,10,14,.10) 55%, rgba(7,10,14,.30) 100%),
    linear-gradient(0deg, rgba(7,10,14,.78) 0%, rgba(7,10,14,.18) 34%, transparent 60%); }
.tela-auth > * { position: relative; z-index: 1; }
/* frase de impacto do login (decorativa; some em tela estreita) */
.auth-frase { position: absolute; left: 52px; bottom: 56px; max-width: 640px; }
.auth-frase h2 { margin: 0; font-size: clamp(26px, 3.2vw, 40px); line-height: 1.16; font-weight: 800;
  color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.45); }
.auth-frase .vd { color: var(--vivo); }
.auth-frase p { margin: 12px 0 0; font-size: 15.5px; color: #DAE2EA; max-width: 520px;
  text-shadow: 0 1px 10px rgba(0,0,0,.5); }
@media (max-width: 1100px) { .auth-frase { display: none; } }
/* cartão claro FIXO nos dois temas: re-declara os tokens do claro dentro da cerca.
   (No claro só clareia panel/field p/ o branco aprovado; no escuro troca o conjunto.) */
html[data-tema="claro"] .tela-auth {
  --panel-a: #FFFFFF; --panel-b: #F4F6F8; --line-2: #C6CFD8;
  --field-bg: #F5F7FA; --field-bg-focus: #FFFFFF;
}
html[data-tema="escuro"] .tela-auth {
  --tx: #1A2026; --tx-2: #46505A; --tx-3: #66717B; --acc-tx: #27279B; --acc-tx-2: #1D1D7C;
  --acc-soft: #B8B8E0; --acc-hair: #6E6ECF; --panel-a: #FFFFFF; --panel-b: #F4F6F8;
  --line: #8D9BA6; --line-2: #C6CFD8; --field-bg: #F5F7FA; --field-bg-focus: #FFFFFF;
  --err-tx: #3A4148; --err-vivid: #3A4148; --err-bg: #E7EBEF; --blur: none;
  --shadow-2: 0 24px 70px rgba(4, 8, 16, .55);
  /* revisão 28/08: sem estes, autofill do Chrome vira preto-no-preto no cartão branco,
     o "requisito atendido" da senha some e o hover dos botões do convite fica ilegível */
  --autofill: #E4E4F3; --ok-tx: #27279B; --ok-bg: #DEDEF3; --hover-acc: #D4D4EC;
}
html[data-tema="escuro"] .tela-auth .auth-card { box-shadow: var(--shadow-2), inset 0 1px 0 rgba(255,255,255,.35); }
html[data-tema="escuro"] .tela-auth .nf select option { background: #FFFFFF; color: #1A2026; }
/* marca nova no cartão: banda "Onlix" verde + Jus ANCORADO na pontinha da perna do x
   (regra do Geone, 28/08: X = 97,76% da largura, base do Jus em Y = 38,23% da banda) */
html[data-tema="claro"] .tela-auth .ox-lockup,
html[data-tema="escuro"] .tela-auth .ox-lockup { background-image: url('/img/onlix-jus-azul-banda.png'); }
.tela-auth .ox-lockup::before { display: none; }
.tela-auth .ox-lockup-auth { width: 150px; aspect-ratio: 1426 / 620; margin: 0 auto 4px; transform: translateX(-10px); }
.tela-auth .ox-lockup-auth::after { content: 'Jus'; position: absolute; left: 97.76%; top: 38.23%;
  transform: translateY(-100%); line-height: 1; font-style: italic; font-weight: 800;
  font-size: 15px; color: var(--acc); }
/* no login o nome/tagline em TEXTO saem de cena (a marca é a imagem) — ficam p/ leitor de tela */
#view-login #login-brand, #view-login #login-tagline {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; margin: 0; padding: 0;
}

/* cartão na LATERAL direita (como o modelo aprovado) e SEM o botão de tema nas
   telas de entrada — o alternador claro/noite só existe DENTRO do sistema */
.tela-auth { justify-content: flex-end; }
.tela-auth .auth-card { margin-right: 7vw; }
.tela-auth .tema-flutuante { display: none; }
@media (max-width: 900px) {
  .tela-auth { justify-content: center; }
  .tela-auth .auth-card { margin-right: 0; }
}

/* ===== PALETA VERDE (reserva, 06/10/2026) =====================================
   O Geone escolheu a paleta azul-royal/violeta, mas pediu o verde "em ressalva". Para
   VOLTAR ao verde: trocar data-paleta="violeta" por data-paleta="verde" no <html> de
   app.html e index.html (as logos verdes seguem no disco; o app.js troca o src sozinho
   quando o atributo é "verde"). Nada aqui é lido enquanto o atributo for "violeta". */
html[data-paleta="verde"] {
  --acc: #3E7A2C; --acc-2: #4A8C35; --vivo: #9FE060;
  --acc-tx: #2F6522; --acc-tx-2: #24501A; --acc-soft: #B4CCA5; --acc-hair: #6F9C58;
  --ok-tx: #2F6522; --ok-bg: #DCE6D4; --autofill: #E2EADC; --agn-tar: #3E7A2C;
}
html[data-paleta="verde"][data-tema="escuro"] {
  --acc: #4E8A3C; --acc-2: #63A44E; --vivo: #9FE060;
  --acc-tx: #9CCB7E; --acc-tx-2: #B7DD9B; --acc-soft: #35492C; --acc-hair: #5C9A48;
  --ok-tx: #9CCB7E; --ok-bg: #23301F; --autofill: #1D2731;
}
html[data-paleta="verde"][data-tema="escuro"] .tela-auth {
  --acc-tx: #2F6522; --acc-tx-2: #24501A; --acc-soft: #B4CCA5; --acc-hair: #6F9C58;
  --autofill: #E2EADC; --ok-tx: #2F6522; --ok-bg: #DCE6D4; --hover-acc: #D3DECA;
}
html[data-paleta="verde"] .btn.ouro { background: linear-gradient(160deg, #57AD3E 0%, #3F9B2F 52%, #357F27 100%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 8px 22px rgba(63, 155, 47, .28); }
html[data-paleta="verde"] .btn.ouro:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 12px 30px rgba(63, 155, 47, .4); }
html[data-paleta="verde"][data-tema="claro"] .topnav .plano-chip { background: rgba(62, 122, 44, .07); }
html[data-paleta="verde"][data-tema="claro"] .ox-lockup { background-image: url("/img/logo-lockup-claro.png"); }
html[data-paleta="verde"][data-tema="escuro"] .ox-lockup { background-image: url("/img/logo-lockup-escuro.png"); }
html[data-paleta="verde"][data-tema="claro"] .tela-auth .ox-lockup,
html[data-paleta="verde"][data-tema="escuro"] .tela-auth .ox-lockup { background-image: url('/img/onlix-jus-verde-banda.png'); }
html[data-paleta="verde"] .tela-auth .ox-lockup-auth::after { color: #3F9B2F; }
html[data-paleta="verde"] .chip.ativo { background: linear-gradient(160deg, #B3EC5E, #7ECC30); color: #16300A; }
html[data-paleta="verde"] .bt-forte .bt-ic { background: #3B7328; border-color: #3B7328; }
html[data-paleta="verde"][data-tema="claro"] .bt-forte .bt-ic { background: linear-gradient(180deg, #47822F 0%, #2C5820 100%); border-color: #254819; }
html[data-paleta="verde"][data-tema="escuro"] { --agn-tar: #8FD06F; }