/* Painel VOHAR · mesa de trabalho do perito.
   Papel e tinta: fundo de papel morno, texto em tinta azul-marinho, filetes finos no lugar de caixas.
   Azul da marca só para ação, seleção e referência (fls.). Vermelho só para o que bloqueia.
   Tipos: Geist (interface), Instrument Serif (títulos de página), Geist Mono só onde ajuda a conferir caractere por
   caractere (nº do processo, protocolo, folhas, códigos), Verdana na folha da minuta (é a fonte do laudo em Word).
   Escala de letras (S04, revisão de 20/10/2026): 14 · 16 · 18 · 24 · 36 px. Nada de rótulo em caixa-alta "de máquina";
   exceções: a folha da minuta e a prévia da petição imitam o Word (tamanhos do laudo) e o título grande do login (56). */
:root {
  --navy-950: #071528;
  --navy-900: #0a1f3c;
  --navy-800: #0f2b52;
  --azul-700: #1a4f9e;
  --azul-600: #1f5fbf;
  --azul-500: #2f74d8;
  --azul-200: #c3d4ee;
  --azul-100: #e4ebf6;
  --azul-50: #eff3f9;
  --laudo: #1f4e79;          /* azul dos títulos do laudo em Word */
  --verde-700: #1b6b49;
  --verde-500: #2f9e6e;
  --verde-50: #e8f2ec;
  --ambar-700: #8a4b00;
  --ambar-500: #c27d14;
  --ambar-200: #ead29e;
  --ambar-50: #fbf3e1;
  --critico-700: #9c1f17;
  --critico-500: #c8392f;
  --critico-200: #ecc2bc;
  --critico-50: #fbefec;

  --mesa: #f3f1eb;           /* fundo */
  --papel: #fbfaf6;          /* superfícies (folha, notas, cards do quadro) */
  --papel-branco: #fffefb;   /* campos de formulário */
  --papel-2: #ece9e0;        /* hover e realce neutro */
  --linha: #e0dcd1;
  --linha-forte: #c9c3b4;
  --tinta: #0d1b2e;
  --texto: #2a3545;
  --texto-2: #586270;        /* 5,4:1 sobre a mesa */
  --borda-campo: #8a8476;    /* S05: borda de campos e botões secundários, 3,69:1 sobre o campo e 3,29:1 sobre a mesa (mín. 3:1) */
  --borda-campo-hover: #6b6659;

  --raio: 4px;
  --raio-g: 6px;
  --sombra-flutua: 0 18px 48px rgba(13, 27, 46, .18), 0 2px 8px rgba(13, 27, 46, .08);
  --sans: Geist, system-ui, "Segoe UI", Roboto, sans-serif;
  --serif: "Instrument Serif", Georgia, "Times New Roman", serif;
  --mono: "Geist Mono", ui-monospace, Consolas, monospace;
  --doc: Verdana, Geneva, "DejaVu Sans", sans-serif;
  --topo: 56px;
  --ease: cubic-bezier(.22, 1, .36, 1);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--sans); font-size: 16px; line-height: 1.55; color: var(--texto); background: var(--mesa); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4 { color: var(--tinta); margin: 0; line-height: 1.25; font-weight: 600; }
h1 { font-family: var(--serif); font-weight: 400; font-size: 36px; line-height: 1.08; letter-spacing: -0.01em; }
h2 { font-size: 18px; letter-spacing: -0.01em; }
h3 { font-size: 16px; }
p { margin: 0; }
a { color: var(--azul-700); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
button, input, select, textarea { font: inherit; color: inherit; }
img { max-width: 100%; display: block; }
::selection { background: #cfe0f7; }
:focus-visible { outline: 2px solid var(--azul-500); outline-offset: 2px; border-radius: 2px; }
.pular { position: absolute; left: -999px; top: 8px; background: var(--papel); padding: 8px 12px; z-index: 100; border-radius: var(--raio); }
.pular:focus { left: 8px; }
.oculto-leitor { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; } /* nenhum display de classe pode reexibir o que está escondido */
.carregando-pagina { padding: 48px; text-align: center; color: var(--texto-2); }
.mono { font-family: var(--mono); font-size: .9em; letter-spacing: -.01em; }
.fraco { color: var(--texto-2); }
.pequeno { font-size: 14px; }
.nowrap { white-space: nowrap; }
.num-tab { font-variant-numeric: tabular-nums; }
/* ícone solto: tamanho de texto, nunca o tamanho do contêiner */
svg { width: 18px; height: 18px; flex: none; }

/* ---------- Topo */
.topo { position: sticky; top: 0; z-index: 40; height: var(--topo); background: var(--navy-900); color: #f3f1eb; display: flex; align-items: center; gap: 28px; padding: 0 28px; }
.marca { display: inline-flex; align-items: center; gap: 10px; color: #f3f1eb; text-decoration: none; flex: none; }
.marca svg { width: 28px; height: 28px; fill: #f3f1eb; }
.marca svg .asa { fill: #7fb0f5; }
.marca b { font-size: 16px; letter-spacing: .2em; font-weight: 700; }
.marca small { display: block; font-size: 14px; letter-spacing: .06em; opacity: .72; font-weight: 400; }
.nav { display: flex; gap: 22px; height: 100%; }
.nav a { color: rgba(243, 241, 235, .74); text-decoration: none; font-weight: 500; font-size: 16px; display: inline-flex; align-items: center; height: 100%; border-bottom: 2px solid transparent; padding-top: 2px; }
.nav a:hover { color: #fff; }
.nav a[aria-current="page"] { color: #fff; border-bottom-color: #7fb0f5; }
.nav a:focus-visible { outline-color: #7fb0f5; }
.usuario { margin-left: auto; display: flex; align-items: center; gap: 14px; font-size: 14px; }
.usuario .quem { text-align: right; line-height: 1.25; }
.usuario .quem small { display: block; opacity: .72; font-size: 14px; }
.topo .botao--fantasma { color: #f3f1eb; border-color: rgba(243, 241, 235, .26); }
.topo .botao--fantasma:hover:not(:disabled) { background: rgba(255, 255, 255, .08); border-color: rgba(243, 241, 235, .4); }
.topo :focus-visible { outline-color: #7fb0f5; }
.topo .menu-celular { display: none; }

/* ---------- Página */
main { padding: 28px 32px 64px; max-width: 1560px; margin: 0 auto; }
main:focus { outline: none; }
.cabecalho-pagina { display: flex; align-items: flex-end; gap: 16px 24px; flex-wrap: wrap; margin-bottom: 22px; }
.cabecalho-pagina .titulos { flex: 1 1 320px; min-width: 0; }
.cabecalho-pagina .titulos > p { color: var(--texto-2); margin-top: 6px; max-width: 70ch; }
.sobretitulo { font-size: 14px; color: var(--texto-2); margin-bottom: 6px; display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; }
.sobretitulo a { color: var(--texto-2); }
.sobretitulo a:hover { color: var(--tinta); }
.sobretitulo .sep { color: var(--linha-forte); }
.migalha { font-size: 14px; margin-bottom: 6px; color: var(--texto-2); }
.migalha a { color: var(--texto-2); }
.acoes { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.linha-meta { display: flex; flex-wrap: wrap; gap: 4px 18px; align-items: baseline; margin-top: 10px; font-size: 14px; color: var(--texto-2); }

/* ---------- Botões */
.botao { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: var(--raio); border: 1px solid transparent;
  font-weight: 600; font-size: 16px; cursor: pointer; text-decoration: none; white-space: nowrap; background: none; color: var(--tinta);
  transition: background-color .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease); }
.botao svg { width: 17px; height: 17px; flex: none; }
.botao:disabled, .botao[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.botao--primario { background: var(--azul-600); color: #fbfaf6; }
.botao--primario:hover:not(:disabled) { background: var(--azul-700); }
.botao--primario:active:not(:disabled) { background: var(--navy-800); }
.botao--secundario { background: var(--papel); color: var(--tinta); border-color: var(--borda-campo); }
.botao--secundario:hover:not(:disabled) { border-color: var(--tinta); background: var(--papel-branco); }
.botao--fantasma { color: var(--texto); }
.botao--fantasma:hover:not(:disabled) { background: var(--papel-2); }
.botao--perigo { background: var(--critico-700); color: #fbfaf6; }
.botao--perigo:hover:not(:disabled) { background: #7d1811; }
.botao--verde { background: var(--verde-700); color: #fbfaf6; }
.botao--verde:hover:not(:disabled) { background: #14553a; }
.botao--p { min-height: 32px; padding: 0 10px; font-size: 14px; gap: 6px; }
.botao--p svg { width: 15px; height: 15px; }
.botao--icone { min-height: 34px; width: 34px; padding: 0; }
.botao[aria-busy="true"] { cursor: progress; }
.link { background: none; border: 0; padding: 0; color: var(--azul-700); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; cursor: pointer; font: inherit; }
.link:hover { text-decoration-thickness: 2px; }
/* ação textual (notas de margem, listas densas) */
.acao-txt { background: none; border: 0; padding: 4px 0; font: inherit; font-size: 14px; font-weight: 600; color: var(--azul-700); cursor: pointer; display: inline-flex; gap: 5px; align-items: center; }
.acao-txt:hover:not(:disabled) { color: var(--navy-900); text-decoration: underline; text-underline-offset: 3px; }
.acao-txt:disabled { color: var(--texto-2); opacity: .6; cursor: not-allowed; }
.acao-txt svg { width: 15px; height: 15px; }

/* ---------- Seções (no lugar de cartões): filete fino em cima, título, conteúdo */
.cartao { border-top: 1px solid var(--linha-forte); padding: 16px 0 26px; }
.cartao > h2, .cartao > h3, .cartao > .cartao-topo { margin-bottom: 12px; }
.cartao-topo { display: flex; align-items: baseline; gap: 6px 14px; flex-wrap: wrap; }
.cartao-topo h2, .cartao-topo h3 { flex: 0 1 auto; }
.cartao-topo > .botao, .cartao-topo > label.botao { margin-left: auto; align-self: center; }
.conta-secao { font-size: 16px; color: var(--texto-2); font-weight: 400; font-variant-numeric: tabular-nums; }
.item-topo > svg { color: var(--texto-2); }
.grade-ficha { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 0 48px; align-items: start; }
.grade-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.grade-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; }
.pilha > * + * { margin-top: 12px; }
.cartao > form + * { margin-top: 16px; }
.dados { display: grid; grid-template-columns: max-content 1fr; gap: 7px 18px; margin: 0; font-size: 16px; }
.dados dt { color: var(--texto-2); }
.dados dd { margin: 0; color: var(--tinta); overflow-wrap: anywhere; }
.vazio { padding: 22px 0; color: var(--texto-2); border-top: 1px dashed var(--linha-forte); border-bottom: 1px dashed var(--linha-forte); }

/* ---------- Marcadores de estado (texto com um pequeno quadrado, nunca "pílula") */
.selo { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; line-height: 1.4; white-space: nowrap; color: var(--texto-2); }
.selo::before { content: ""; width: 7px; height: 7px; border-radius: 1px; background: currentColor; flex: none; }
.selo:has(svg)::before { display: none; }
.selo svg { width: 14px; height: 14px; }
.selo--azul { color: var(--azul-700); }
.selo--verde { color: var(--verde-700); }
.selo--ambar { color: var(--ambar-700); }
.selo--critico { color: var(--critico-700); }
.selo--cinza { color: var(--texto-2); }
.selo--escuro { color: var(--tinta); }
.selo--contorno { color: var(--texto-2); }
.selo--contorno::before, .selo--cinza::before { background: var(--linha-forte); }
.selo--so-texto::before { display: none; }
.ia-nota { font-size: 14px; font-weight: 400; color: var(--texto-2); letter-spacing: .01em; }

/* ---------- Avisos */
.aviso { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 12px; align-items: start; padding: 12px 16px; border-radius: var(--raio); border: 1px solid; font-size: 16px; color: var(--texto); }
.aviso > svg { width: 20px; height: 20px; margin-top: 1px; }
.aviso strong { font-weight: 600; }
.aviso .corpo { min-width: 0; }
.aviso .corpo > * + * { margin-top: 5px; }
.aviso--info { background: var(--azul-50); border-color: var(--azul-200); }
.aviso--info > svg, .aviso--info strong { color: var(--azul-700); }
.aviso--ok { background: var(--verde-50); border-color: #bcd9c7; }
.aviso--ok > svg, .aviso--ok strong { color: var(--verde-700); }
.aviso--atencao { background: var(--ambar-50); border-color: var(--ambar-200); }
.aviso--atencao > svg, .aviso--atencao strong { color: var(--ambar-700); }
.aviso--critico, .aviso--critico-forte { background: var(--critico-50); border-color: var(--critico-200); }
.aviso--critico > svg, .aviso--critico strong, .aviso--critico-forte > svg, .aviso--critico-forte strong { color: var(--critico-700); }
.aviso--critico-forte { border-color: #e3a79f; }
.aviso .citacao { margin-top: 8px; }


/* ---------- Formulários */
.campo { display: flex; flex-direction: column; gap: 6px; }
.campo > span, .campo > label { font-weight: 600; color: var(--tinta); font-size: 14px; }
.campo small { color: var(--texto-2); font-size: 14px; }
.entrada, select.entrada, textarea.entrada { width: 100%; min-height: 42px; padding: 8px 12px; border: 1px solid var(--borda-campo); border-radius: var(--raio); background: var(--papel-branco); color: var(--tinta);
  transition: border-color .15s var(--ease), box-shadow .15s var(--ease); }
.entrada::placeholder { color: #6f747c; } /* 4,6:1 sobre o campo */
textarea.entrada { line-height: 1.55; resize: vertical; min-height: 84px; }
.entrada:hover { border-color: var(--borda-campo-hover); }
.entrada:focus { border-color: var(--azul-600); outline: none; box-shadow: 0 0 0 3px rgba(47, 116, 216, .18); }
.entrada--codigo { font-family: var(--mono); font-size: 24px; letter-spacing: .35em; text-align: center; max-width: 260px; }
.marcar { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.marcar input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--azul-600); flex: none; }
.form-linha { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
.form-linha > .campo { flex: 1 1 180px; }
.erro-campo { color: var(--critico-700); font-size: 14px; display: flex; gap: 8px; align-items: flex-start; font-weight: 500; }
.erro-campo svg { width: 16px; height: 16px; margin-top: 2px; }
.entrada[aria-invalid="true"] { border: 2px solid var(--critico-700); }
.entrada[aria-invalid="true"]:focus { border-color: var(--critico-700); box-shadow: 0 0 0 3px rgba(200, 57, 47, .16); }

/* ---------- Login */
.tela-login { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); background: var(--papel); }
.login-lado { background: var(--navy-900); color: #f3f1eb; padding: 52px 56px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; isolation: isolate; }
/* pauta de laudo, bem apagada, e o "V" da marca como marca-d'água */
.login-lado::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: repeating-linear-gradient(180deg, transparent 0 31px, rgba(127, 176, 245, .07) 31px 32px);
  mask-image: linear-gradient(90deg, transparent 0, #000 22%, #000 100%); }
.login-lado .marca-dagua { position: absolute; z-index: -1; right: -70px; bottom: -40px; width: 460px; height: 460px; fill: none; stroke: rgba(127, 176, 245, .2); stroke-width: .18; }
.login-lado .marca svg { width: 34px; height: 34px; }
.login-lado .marca b { font-size: 18px; }
.login-lado h1 { color: #fbfaf6; font-size: 56px; line-height: 1; max-width: 460px; margin-top: 72px; }
.login-lado h1 em { font-style: italic; color: #9cc1f3; }
.login-lado p { color: rgba(243, 241, 235, .72); max-width: 400px; margin-top: 18px; font-size: 16px; }
.login-lado .rodape { font-size: 14px; color: rgba(243, 241, 235, .72); margin: 0; max-width: none; }
.login-form { display: flex; align-items: center; justify-content: center; padding: 40px 28px; }
.login-caixa { width: min(420px, 100%); }
.login-caixa h2 { font-size: 24px; font-weight: 600; letter-spacing: -0.015em; }
.login-caixa h2 + p { margin-top: 6px; }
.login-caixa .passos { display: flex; gap: 14px; margin-bottom: 26px; font-size: 14px; color: var(--texto-2); }
.login-caixa .passos i { font-style: normal; display: inline-flex; gap: 6px; align-items: baseline; }
.login-caixa .passos i.feito { color: var(--tinta); }
.login-caixa .passos i.atual { color: var(--azul-700); text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }
.login-caixa form { margin-top: 22px; }
.login-caixa form > * + * { margin-top: 16px; }
.login-caixa .aviso { margin-top: 16px; }
.login-caixa .campo .erro-campo { margin-top: 2px; }
.login-caixa form > .pequeno { margin-top: 10px; }
.login-caixa .rodape-codigo { display: flex; flex-wrap: wrap; gap: 0 6px; align-items: baseline; }
.login-caixa .rodape-codigo .acao-txt { padding: 0; }
.login-caixa .acoes .acao-txt { font-size: 16px; }
.login-caixa .acao-txt { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.qr { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.qr canvas, .qr img { width: 184px; height: 184px; image-rendering: pixelated; border: 1px solid var(--linha); border-radius: var(--raio); padding: 8px; background: #fff; }
.segredo { font-family: var(--mono); font-size: 14px; background: var(--papel-2); padding: 8px 10px; border-radius: var(--raio); word-break: break-all; }
.codigos-rec { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 16px; font-family: var(--mono); font-size: 18px; background: var(--papel-branco); border: 1px dashed var(--linha-forte); padding: 14px 18px; border-radius: var(--raio); }

/* ---------- Quadro (kanban) */
.barra-quadro { display: flex; gap: 12px 18px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
.barra-quadro .busca { flex: 1 1 260px; max-width: 400px; }
.barra-quadro .dica { margin-left: auto; font-size: 14px; color: var(--texto-2); }
.barra-quadro kbd { font-family: var(--sans); font-size: 14px; border: 1px solid var(--linha-forte); border-bottom-width: 2px; border-radius: 3px; padding: 0 4px; background: var(--papel); }
.quadro { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(228px, 1fr); overflow-x: auto; padding-bottom: 12px; align-items: stretch; min-height: 60vh; border-top: 1.5px solid var(--tinta); }
.coluna { padding: 0 12px 16px; display: flex; flex-direction: column; gap: 8px; min-height: 160px; border-left: 1px solid var(--linha); transition: background-color .15s var(--ease); }
.coluna:first-child { border-left: 0; padding-left: 0; }
.coluna:last-child { padding-right: 0; }
.coluna.alvo { background: var(--azul-50); }
.coluna-topo { display: flex; align-items: baseline; gap: 8px; padding: 10px 0 6px; }
.coluna-topo h2 { font-size: 16px; flex: 1; }
.coluna-topo .conta { font-size: 14px; color: var(--texto-2); font-variant-numeric: tabular-nums; }
.coluna .nenhum { font-size: 14px; color: var(--texto-2); }
.coluna.vazia .coluna-topo .conta { display: none; }
.cards { display: flex; flex-direction: column; gap: 8px; min-height: 40px; }
.card { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 10px 12px 8px; cursor: grab; position: relative;
  transition: border-color .15s var(--ease), background-color .15s var(--ease); }
.card:hover { border-color: var(--linha-forte); background: var(--papel-branco); }
.card:focus-within { border-color: var(--azul-200); }
.card.arrastando { opacity: .45; }
.card.prioridade { box-shadow: inset 0 2px 0 var(--ambar-500); }
.card-tipo { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--texto-2); }
.card-tipo .ponto { width: 6px; height: 6px; border-radius: 1px; background: var(--azul-500); }
.card-tipo .ponto.caso { background: var(--verde-500); }
.card-tipo .flag { margin-left: auto; color: var(--ambar-700); display: inline-flex; align-items: center; gap: 3px; letter-spacing: .04em; }
.card-tipo .flag svg { width: 13px; height: 13px; }
.card h3 { font-size: 16px; margin: 4px 0 2px; line-height: 1.3; letter-spacing: -0.005em; }
.card h3 a { color: var(--tinta); text-decoration: none; }
.card h3 a::after { content: ""; position: absolute; inset: 0; }
.card h3 a:focus-visible { outline: none; }
.card h3 a:focus-visible::after { outline: 2px solid var(--azul-500); outline-offset: 2px; border-radius: var(--raio); }
.card .sub { font-size: 14px; color: var(--texto-2); font-family: var(--mono); letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card .selos { display: flex; gap: 2px 12px; flex-wrap: wrap; margin-top: 6px; }
.card .selos .selo { font-size: 14px; white-space: normal; }
.card .rodape-card { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; margin-top: 6px; font-size: 14px; color: var(--texto-2); }
.card .rodape-card > * { white-space: nowrap; }
.card .rodape-card .flag { color: var(--ambar-700); display: inline-flex; align-items: center; gap: 4px; font-weight: 500; }
.card .rodape-card svg { width: 13px; height: 13px; }
.card .rodape-card .mover { margin-left: auto; position: relative; z-index: 2; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.menu-mover { position: absolute; z-index: 30; background: var(--papel); border: 1px solid var(--linha-forte); border-radius: var(--raio-g); box-shadow: var(--sombra-flutua); padding: 6px; min-width: 210px; }
.menu-mover p { font-size: 14px; font-weight: 600; }
.menu-mover button { display: block; width: 100%; text-align: left; padding: 8px 12px; border: 0; background: none; border-radius: 3px; cursor: pointer; font-size: 16px; }
.menu-mover button:hover, .menu-mover button:focus { background: var(--papel-2); outline: none; }
.menu-mover button:focus-visible { box-shadow: inset 0 0 0 2px var(--azul-500); }
.menu-mover button[aria-current="true"] { color: var(--texto-2); }

/* ---------- Cabeçalho do caso */
.caso-cabeca { display: block; margin-bottom: 14px; }
.caso-cabeca h1 { overflow-wrap: anywhere; }

/* ---------- Abas */
.abas-moldura { position: relative; margin: 0 0 24px; }
.abas { position: relative; /* o texto só para leitor de tela das abas fica dentro da rolagem (antes alargava a página no celular) */ display: flex; gap: 26px; border-bottom: 1px solid var(--linha-forte); overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.abas::-webkit-scrollbar { display: none; }
.abas a { padding: 10px 0 9px; text-decoration: none; color: var(--texto-2); font-weight: 500; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; display: inline-flex; gap: 8px; align-items: baseline; scroll-snap-align: start; font-size: 16px; }
.abas a:hover { color: var(--tinta); }
.abas a[aria-current="page"] { color: var(--tinta); border-bottom-color: var(--tinta); font-weight: 600; }
.abas .contagem { font-size: 14px; font-weight: 600; color: var(--critico-700); font-variant-numeric: tabular-nums; }
.abas .andando { font-size: 14px; color: var(--texto-2); font-weight: 400; }

/* ---------- Tabelas */
.tabela { width: 100%; border-collapse: collapse; font-size: 16px; }
.tabela th { text-align: left; font-size: 14px; color: var(--tinta); font-weight: 600; padding: 8px 10px; border-bottom: 1px solid var(--tinta); }
.tabela td { padding: 10px; border-bottom: 1px solid var(--linha); vertical-align: top; }
.tabela tr:last-child td { border-bottom: 0; }
.tabela .num { text-align: right; font-variant-numeric: tabular-nums; }
.tabela td.num { font-variant-numeric: tabular-nums; }
.rolagem-x { overflow-x: auto; }

/* ---------- Progresso */
.progresso { height: 4px; border-radius: 2px; background: var(--papel-2); overflow: hidden; }
.progresso > i { display: block; height: 100%; background: var(--azul-600); border-radius: 2px; transition: width .3s var(--ease); }
.progresso.indeterminado > i { width: 35% !important; animation: vai 1.4s ease-in-out infinite; }
@keyframes vai { from { transform: translateX(-100%); } to { transform: translateX(300%); } }
.etapas { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.etapas li { display: grid; grid-template-columns: 32px 1fr auto; gap: 4px 12px; align-items: baseline; padding: 10px 0; border-top: 1px solid var(--linha); }
.etapas li:first-child { border-top: 0; }
.etapas .marca-etapa { font-size: 14px; color: var(--texto-2); font-variant-numeric: tabular-nums; }
.etapas li.feita .marca-etapa { color: var(--verde-700); }
.etapas li.atual .marca-etapa { color: var(--azul-700); font-weight: 500; }
.etapas li.atual { font-weight: 600; color: var(--tinta); }
.etapas li.pendente { color: var(--texto-2); }
.etapas .sub-progresso { grid-column: 2 / 4; margin-top: 4px; }

/* ---------- Análise */
.sumario-analise { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 28px; margin: 0 0 16px; padding: 14px 0 16px; border-top: 1.5px solid var(--tinta); border-bottom: 1px solid var(--linha-forte); }
.sumario-analise > div { min-width: 0; }
.sumario-analise dt { font-size: 14px; font-weight: 600; color: var(--texto-2); }
.sumario-analise dd { margin: 2px 0 0; font-size: 16px; color: var(--tinta); }
.sumario-analise dd b { display: block; font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
.sumario-analise dd .sub { display: block; color: var(--texto-2); font-size: 14px; margin-top: 2px; }
.sumario-analise dd .clamp { display: inline; }
.sumario-analise dd .alto { color: var(--critico-700); }
.nota-analise { font-size: 14px; color: var(--texto-2); margin-bottom: 26px; }

/* ---------- Manifestação de honorários (abaixo da ficha da análise): tabela de horas editável, conta e prévia */
.manifestacao { margin-bottom: 30px; }
.manifestacao > .cartao-topo > .selo { align-self: center; }
.manifestacao > .cartao-topo > .botao + .botao { margin-left: 0; }
.manifestacao .nota-analise { margin-bottom: 18px; }
.manifestacao h3 { margin-bottom: 4px; }
.tabela-horas td { padding: 8px 10px; }
.tabela-horas td .etapa { display: block; color: var(--tinta); font-weight: 500; }
.tabela-horas td .just { display: block; color: var(--texto-2); font-size: 14px; margin-top: 2px; }
.tabela-horas td.num { width: 112px; vertical-align: middle; }
.tabela-horas tr.mudou .entrada { border-color: var(--ambar-500); background: var(--ambar-50); }
.tabela-horas tfoot td { border-top: 1px solid var(--tinta); font-weight: 600; color: var(--tinta); }
.entrada--horas { width: 96px; min-height: 36px; padding: 4px 8px; text-align: right; font-size: 16px; font-variant-numeric: tabular-nums; }
.conta-honorarios { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: flex-end; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--linha); }
.conta-honorarios .campo { flex: 0 0 auto; }
.conta-honorarios .entrada--horas { width: 150px; min-height: 42px; }
.conta-honorarios .total { flex: 1 1 260px; display: flex; flex-direction: column; align-items: flex-end; text-align: right; gap: 1px; }
.conta-honorarios .total .rot { font-size: 14px; font-weight: 600; color: var(--texto-2); }
.conta-honorarios .total b { font-size: 24px; font-weight: 600; color: var(--tinta); letter-spacing: -.01em; }
.bloco-lado { margin-bottom: 18px; }
.bloco-lado .lista-itens > li { font-size: 16px; }
.texto-peticao { margin-top: 22px; border-top: 1px solid var(--linha); padding-top: 12px; }
.texto-peticao summary { cursor: pointer; font-weight: 600; color: var(--tinta); }
.previa-peticao { max-width: 760px; margin-top: 14px; padding: 30px 36px; background: var(--papel-branco); border: 1px solid var(--linha); font-family: var(--doc); font-size: 13.5px; line-height: 1.65; color: #1a1a1a; }
.previa-peticao > * + * { margin-top: 10px; }
.previa-peticao h4 { font-size: 13.5px; margin-top: 20px; color: #1a1a1a; }
.previa-peticao .enderecamento { font-weight: 700; white-space: pre-line; }
.previa-peticao .processo { margin: 22px 0; }
.previa-peticao ul { padding-left: 22px; margin-bottom: 0; }
.previa-peticao .tabela { width: auto; min-width: 60%; font-size: 13px; }
.previa-peticao .tabela td { padding: 4px 12px; border: 1px solid var(--linha-forte); }
.previa-peticao .fecho { text-align: center; }
.lista-itens { list-style: none; margin: 0; padding: 0; }
.lista-itens > li { padding: 11px 0; border-top: 1px solid var(--linha); }
.lista-itens > li:first-child { border-top: 0; padding-top: 2px; }
.item-topo { display: flex; gap: 4px 12px; align-items: baseline; flex-wrap: wrap; margin-bottom: 3px; }
.item-topo strong { color: var(--tinta); font-weight: 600; }
.item-topo .rot { font-size: 14px; color: var(--texto-2); }
.conferido { color: var(--verde-700); display: inline-flex; align-self: center; }
.conferido svg { width: 15px; height: 15px; }
.citacao { border-left: 1px solid var(--linha-forte); padding: 0 0 0 12px; color: var(--texto-2); margin-top: 6px; font-size: 16px; line-height: 1.55; }
.fls { font-family: var(--mono); font-size: 14px; color: var(--azul-700); background: none; border: 0; border-radius: 2px; padding: 0 2px; margin: 0 -2px; cursor: pointer; white-space: nowrap;
  text-decoration: underline dotted; text-decoration-thickness: 1px; text-underline-offset: 3px; transition: background-color .15s var(--ease); }
.fls:hover { background: var(--azul-100); text-decoration-style: solid; }
.fls.forte { font-weight: 500; }
.grupo-quesitos + .grupo-quesitos { margin-top: 20px; }
.grupo-quesitos h3 { font-size: 14px; font-weight: 600; color: var(--texto-2); margin-bottom: 6px; padding-bottom: 4px; }
.riscado { text-decoration: line-through; color: var(--texto-2); }
.zona-envio { border: 1px dashed var(--linha-forte); border-radius: var(--raio); background: var(--papel); padding: 32px 24px; text-align: center; transition: border-color .15s var(--ease), background-color .15s var(--ease); }
.zona-envio.sobre { border-color: var(--azul-600); background: var(--azul-50); }
.zona-envio input[type=file] { display: none; }
.zona-envio > svg { width: 30px; height: 30px; margin: 0 auto; color: var(--texto-2); }

/* ---------- Visualizador de PDF (gaveta ao lado) */
.com-gaveta { padding-right: min(46vw, 760px); }
.com-gaveta .grade-ficha, .com-gaveta .caso-cabeca { grid-template-columns: minmax(0, 1fr); }
.com-gaveta .sumario-analise { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gaveta { position: fixed; top: var(--topo); right: 0; bottom: 0; width: min(46vw, 760px); background: #4d545e; z-index: 35; display: flex; flex-direction: column; box-shadow: -10px 0 30px rgba(13, 27, 46, .22); }
.gaveta-topo { display: flex; align-items: center; gap: 6px; padding: 8px 12px; background: var(--navy-900); color: #f3f1eb; flex-wrap: wrap; }
.gaveta-topo strong { font-size: 14px; font-weight: 600; margin-right: auto; }
.gaveta-topo .botao { color: #f3f1eb; }
.gaveta-topo .botao:hover:not(:disabled) { background: rgba(255, 255, 255, .1); }
.gaveta-topo :focus-visible { outline-color: #7fb0f5; }
.gaveta-trecho { background: var(--ambar-50); color: var(--tinta); padding: 8px 14px; font-size: 14px; border-bottom: 1px solid var(--ambar-200); }
.gaveta-trecho strong { color: var(--ambar-700); font-weight: 600; }
.gaveta-corpo { overflow: auto; flex: 1; padding: 16px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.gaveta-corpo canvas { background: #fff; box-shadow: 0 2px 12px rgba(0, 0, 0, .35); max-width: none; }
.gaveta-corpo .rotulo-pagina { color: #e9e6dd; font-size: 14px; align-self: center; }

/* ---------- Vistoria */
.itens-vistoria { display: flex; flex-direction: column; gap: 8px; }
.item-vistoria { display: grid; grid-template-columns: 40px 1fr auto; gap: 10px; align-items: start; }
.item-vistoria .id { font-family: var(--mono); font-size: 14px; font-weight: 500; color: var(--texto-2); padding-top: 10px; }
.item-vistoria .campos { display: grid; gap: 8px; }
.item-vistoria .campos.medicao { grid-template-columns: 1.4fr 1.2fr .8fr .6fr 1fr; }
.fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px 20px; }
.foto { display: flex; flex-direction: column; }
.foto .img { aspect-ratio: 4 / 3; background: var(--papel-2); display: grid; place-items: center; color: var(--texto-2); font-size: 14px; border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; }
.foto .img img { width: 100%; height: 100%; object-fit: cover; }
.foto .corpo { padding: 10px 0 0; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.foto .item-topo { align-items: center; }
.foto .ordem { margin-left: auto; display: flex; gap: 2px; }
.foto .sugestao { font-size: 14px; color: var(--texto-2); }

/* ---------- Editor da minuta: folha de laudo + notas de margem */
.barra-minuta { position: sticky; top: var(--topo); z-index: 20; background: var(--mesa); padding: 10px 0; margin: -10px 0 18px; display: flex; gap: 10px 12px; align-items: center; flex-wrap: wrap; border-bottom: 1px solid var(--linha-forte); }
.barra-minuta .estado { margin-right: auto; display: flex; gap: 4px 16px; flex-wrap: wrap; align-items: baseline; min-width: 0; }
.barra-minuta .estado h2 { font-size: 18px; }
.barra-minuta .contadores { display: flex; gap: 4px 14px; flex-wrap: wrap; align-items: baseline; }
.barra-minuta .versao { font-size: 14px; color: var(--texto-2); }
.barra-minuta .versao.sujo { color: var(--ambar-700); }
.barra-minuta + div > .cartao:first-child { border-top: 0; padding-top: 6px; }
.revisao-andamento { display: flex; gap: 10px 14px; align-items: center; flex-wrap: wrap; padding: 10px 14px; margin: 0 0 16px; border: 1px solid var(--azul-200); background: var(--azul-50); border-radius: var(--raio); font-size: 14px; color: var(--tinta); }
.revisao-andamento .progresso { flex: 1 1 160px; max-width: 280px; background: var(--azul-100); }
.meta-minuta { font-size: 14px; color: var(--texto-2); margin-bottom: 14px; }

.editor { display: grid; grid-template-columns: 200px minmax(0, 760px) minmax(300px, 340px); gap: 32px; align-items: start; justify-content: center; }
.sumario { position: sticky; top: calc(var(--topo) + 72px); max-height: calc(100vh - var(--topo) - 96px); overflow: auto; padding-top: 2px; }
.sumario h3 { font-size: 14px; font-weight: 600; color: var(--texto-2); padding: 0 0 8px; border-bottom: 1px solid var(--linha-forte); margin-bottom: 4px; }
.sumario ol { list-style: none; padding: 0; margin: 0; }
.sumario a { display: grid; grid-template-columns: 22px 1fr auto; gap: 6px; padding: 6px 4px 6px 0; text-decoration: none; color: var(--texto); font-size: 14px; line-height: 1.3; border-bottom: 1px solid var(--linha); }
.sumario a:hover { color: var(--tinta); background: var(--papel-2); }
.sumario a .n { font-size: 14px; color: var(--texto-2); font-variant-numeric: tabular-nums; }
.sumario a .t { text-transform: lowercase; }
.sumario a .t::first-letter { text-transform: uppercase; }
.sumario a .qtd { font-size: 14px; font-weight: 600; color: var(--ambar-700); }
.sumario a .qtd.bloq { color: var(--critico-700); }

.folha { background: var(--papel); border: 1px solid var(--linha); border-radius: 2px; padding: 56px 64px 64px; position: relative;
  box-shadow: 5px 5px 0 -1px #e8e4da, 5px 5px 0 0 var(--linha), 10px 10px 0 -1px #e2ddd1, 10px 10px 0 0 #d8d2c4;
  font-family: var(--doc); font-size: 14.5px; line-height: 1.75; color: #1f2733; }
.folha .avisos-montagem { font-family: var(--sans); margin: -24px 0 28px; font-size: 14px; }
.folha .avisos-montagem summary { cursor: pointer; color: var(--texto-2); }
.capa-laudo { text-align: center; margin-bottom: 40px; padding-bottom: 24px; border-bottom: 3px double var(--linha-forte); }
.capa-laudo .enderecamento { font-size: 12.5px; letter-spacing: .02em; color: #4b5563; text-transform: uppercase; line-height: 1.6; }
.capa-laudo .titulo-laudo { font-family: var(--doc); font-size: 18px; font-weight: 700; color: var(--laudo); letter-spacing: .06em; margin-top: 18px; }
.capa-laudo .processo-laudo { font-family: var(--mono); font-size: 13px; color: #4b5563; margin-top: 4px; }
.secao-minuta { scroll-margin-top: calc(var(--topo) + 80px); position: relative; }
.secao-minuta + .secao-minuta { margin-top: 34px; }
.secao-topo { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.secao-topo h2 { font-family: var(--doc); font-size: 14.5px; font-weight: 700; color: var(--laudo); text-transform: uppercase; letter-spacing: .03em; flex: 1 1 auto; }
.secao-topo .editada { font-family: var(--sans); font-size: 14px; color: var(--azul-700); }
.secao-topo .acao-txt { font-family: var(--sans); font-size: 14px; font-weight: 500; color: var(--texto-2); opacity: 0; transition: opacity .15s var(--ease), color .15s var(--ease); }
.secao-minuta:hover .secao-topo .acao-txt, .secao-topo .acao-txt:focus-visible { opacity: 1; }
.secao-topo .acao-txt:hover:not(:disabled) { color: var(--azul-700); }
@media (hover: none) { .secao-topo .acao-txt { opacity: 1; } }
.bloco { position: relative; border-radius: 2px; padding: 3px 8px; margin: 0 -8px 6px; cursor: text; transition: background-color .15s var(--ease); }
.bloco:hover { background: rgba(31, 78, 121, .045); }
.bloco:focus-visible { outline-offset: 0; }
.bloco.foco { background: #fbefc9; }
.bloco.ligado { background: rgba(194, 125, 20, .09); }
.bloco.editado::before { content: ""; position: absolute; left: -22px; top: 12px; width: 6px; height: 6px; border-radius: 50%; background: var(--azul-500); }
.bloco .ref-nota { position: absolute; right: -52px; top: 4px; font-family: var(--sans); font-size: 14px; line-height: 1.3; display: flex; flex-direction: column; gap: 2px; }
.ref-nota button { border: 0; background: none; padding: 0 3px; font: inherit; cursor: pointer; border-radius: 2px; color: var(--ambar-700); }
.ref-nota button.bloqueante { color: var(--critico-700); font-weight: 500; }
.ref-nota button.info { color: var(--azul-700); }
.ref-nota button:hover { background: var(--papel-2); }
.bloco p { text-align: justify; hyphens: auto; }
.bloco p + p { margin-top: 6px; }
.bloco .subtitulo { font-weight: 700; color: #1f2733; }
.bloco ul { margin: 0; padding-left: 22px; }
.bloco table { border-collapse: collapse; width: 100%; font-size: 13px; line-height: 1.5; }
.bloco th, .bloco td { border: 1px solid #b9b3a5; padding: 4px 8px; text-align: left; }
.bloco th { background: #eceae3; }
.bloco figure { margin: 6px 0; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.bloco figure img { max-height: 240px; border: 1px solid var(--linha); }
.bloco figcaption { font-size: 12.5px; color: #4b5563; text-align: center; }
.bloco .quesito-pergunta { font-weight: 700; color: #1f2733; display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.bloco .quesito-pergunta .fls { font-weight: 400; }
.bloco .quesito-texto { color: #4b5563; font-style: italic; }
.bloco .quesito-resposta { margin-top: 4px; }
.bloco .quesito-resposta strong { color: var(--laudo); }
.bloco .para-completar { font-family: var(--sans); font-size: 14px; color: var(--critico-700); margin-top: 4px; }
.bloco textarea.entrada { min-height: 120px; font-family: var(--doc); font-size: 14.5px; line-height: 1.7; background: #fffefa; }
.bloco .dica-edicao { font-family: var(--sans); font-size: 14px; color: var(--texto-2); margin-top: 4px; }
.encerramento { margin-top: 40px; padding-top: 18px; border-top: 1px solid var(--linha); font-size: 13px; color: #4b5563; }
.marcador { background: var(--critico-50); color: var(--critico-700); font-weight: 700; border-radius: 2px; padding: 0 3px; font-family: var(--mono); font-size: .84em; box-shadow: inset 0 -1px 0 var(--critico-200); }
mark { background: #f6dc8c; color: inherit; border-radius: 2px; padding: 0 1px; }

/* margem: notas do revisor ligadas ao trecho */
.painel-apont { min-width: 0; }
.painel-apont .cabeca { padding: 0 0 12px; border-bottom: 1px solid var(--linha-forte); margin-bottom: 10px; }
.painel-apont .cabeca h2 { font-size: 16px; }
.painel-apont .cabeca .explica { font-size: 14px; color: var(--texto-2); margin-top: 4px; line-height: 1.45; }
.painel-apont .lista { position: relative; }
.painel-apont .gerais { margin-bottom: 10px; display: flex; flex-direction: column; gap: 8px; }
.painel-apont .gerais:empty { display: none; }
.painel-apont .vazia { font-size: 14px; color: var(--texto-2); padding: 8px 0; }
.filtros { display: flex; gap: 2px 14px; flex-wrap: wrap; margin-top: 10px; }
.filtro { border: 0; background: none; padding: 3px 0; font-size: 14px; font-weight: 500; cursor: pointer; color: var(--texto-2); display: inline-flex; gap: 6px; align-items: center; }
.filtro::before { content: ""; width: 9px; height: 9px; border-radius: 1px; border: 1.5px solid currentColor; flex: none; }
.filtro[aria-pressed="true"] { color: var(--tinta); }
.filtro[aria-pressed="true"]::before { background: currentColor; }
.filtro.g-bloqueante[aria-pressed="true"]::before { background: var(--critico-700); border-color: var(--critico-700); }
.filtro.g-atencao[aria-pressed="true"]::before { background: var(--ambar-500); border-color: var(--ambar-500); }
.filtro.g-info[aria-pressed="true"]::before { background: var(--azul-500); border-color: var(--azul-500); }
.filtros.situacao .filtro::before { display: none; }
.filtros.situacao .filtro { border-bottom: 1.5px solid transparent; border-radius: 0; }
.filtros.situacao .filtro[aria-pressed="true"] { border-bottom-color: var(--tinta); }
.filtro:hover { color: var(--tinta); }
.apont { background: var(--papel); border: 1px solid var(--linha); border-radius: 3px; padding: 9px 12px 7px; font-size: 14px; line-height: 1.45; transition: border-color .15s var(--ease), background-color .15s var(--ease), top .25s var(--ease); }
.lista.ancorada .apont { position: absolute; left: 0; right: 0; }
.apont:hover { border-color: var(--linha-forte); }
.apont.fechado { opacity: .66; }
.apont.ativo { border-color: var(--ambar-500); background: #fffaf0; }
.apont .topo-apont { display: flex; gap: 4px 8px; align-items: baseline; flex-wrap: wrap; margin-bottom: 3px; font-size: 14px; }
.apont .topo-apont .n { font-size: 14px; color: var(--texto-2); font-variant-numeric: tabular-nums; }
.apont .topo-apont .grav { font-weight: 600; display: inline-flex; gap: 6px; align-items: center; }
.apont .topo-apont .grav::before { content: ""; width: 7px; height: 7px; border-radius: 1px; background: currentColor; }
.apont.bloqueante .grav { color: var(--critico-700); }
.apont.atencao .grav { color: var(--ambar-700); }
.apont.info .grav { color: var(--azul-700); }
.apont .topo-apont .regra { color: var(--tinta); font-weight: 500; }
.apont .topo-apont .origem { margin-left: auto; font-size: 14px; color: var(--texto-2); }
.apont .msg { color: var(--texto); }
.apont .trecho { margin-top: 4px; font-size: 14px; color: var(--texto-2); border-left: 1px solid var(--linha-forte); padding-left: 8px; }
.apont .onde { font-size: 14px; margin-top: 3px; color: var(--texto-2); }
.apont .botoes { display: flex; gap: 0 14px; flex-wrap: wrap; margin-top: 4px; }
.apont .decisao { margin-top: 4px; font-size: 14px; color: var(--texto-2); }
.apont .aviso-trecho { font-size: 14px; color: var(--ambar-700); margin-top: 3px; }

.proposta { border: 1px solid var(--azul-200); background: #f6f8fb; border-radius: 3px; padding: 12px 14px; margin: 4px -8px 14px; font-family: var(--sans); }
.proposta .item-topo { font-size: 14px; }
.proposta .previa { background: var(--papel); border: 1px solid var(--linha); border-radius: 2px; padding: 10px 16px; max-height: 360px; overflow: auto; margin: 10px 0; font-family: var(--doc); font-size: 13.5px; line-height: 1.7; }
.proposta .rotulo-ia { font-weight: 600; color: var(--azul-700); }

/* ---------- Histórico */
.linha-tempo { list-style: none; padding: 0; margin: 0; }
.linha-tempo li { display: grid; grid-template-columns: 140px 1fr; gap: 14px; padding: 9px 0; border-top: 1px solid var(--linha); font-size: 16px; }
.linha-tempo li:first-child { border-top: 0; }
.linha-tempo time { color: var(--texto-2); font-size: 14px; padding-top: 2px; font-variant-numeric: tabular-nums; }

/* ---------- Uso de IA */
.livro-gasto { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1.5px solid var(--tinta); margin: 0 0 20px; }
.livro-gasto > div { padding: 14px 24px 16px; border-left: 1px solid var(--linha); }
.livro-gasto > div:first-child { border-left: 0; padding-left: 0; }
.livro-gasto dt { font-size: 14px; font-weight: 600; color: var(--texto-2); }
.livro-gasto dd { margin: 4px 0 0; }
.livro-gasto .valor { font-size: 24px; font-weight: 600; color: var(--tinta); font-variant-numeric: tabular-nums; }
.livro-gasto .medidor { margin: 8px 0 6px; }
.barras { display: flex; align-items: flex-end; gap: 3px; height: 150px; padding-top: 10px; border-bottom: 1px solid var(--tinta); }
.barras .b { flex: 1; background: var(--azul-600); border-radius: 1px 1px 0 0; min-height: 1px; position: relative; }
.barras .b:hover { background: var(--navy-900); }
.eixo { display: flex; gap: 3px; font-size: 14px; color: var(--texto-2); margin-top: 4px; font-variant-numeric: tabular-nums; }
.eixo span:nth-child(even) { visibility: hidden; } /* um dia sim, um não: cabe a letra de 14 px */
.eixo span { flex: 1; text-align: center; }
.medidor { height: 5px; border-radius: 2px; background: var(--linha); overflow: hidden; }
.medidor i { display: block; height: 100%; background: var(--verde-700); }
.medidor.alto i { background: var(--ambar-500); }

/* =====================================================================================================
   Revisão da interface (20/10/2026): componentes novos das sugestões S01–S14
   ===================================================================================================== */

/* ---------- Mostrar só no celular / só no computador */
.so-celular { display: none; }

/* ---------- Aviso em uma linha, com "ver detalhes" (S12) */
.aviso-linha { border: 1px solid; border-radius: var(--raio); padding: 10px 16px; font-size: 16px; color: var(--texto); }
.aviso-linha-topo { display: flex; gap: 10px; align-items: flex-start; }
.aviso-linha-topo > svg { width: 18px; height: 18px; margin-top: 3px; }
.aviso-linha-topo > p { flex: 1 1 auto; min-width: 0; }
.aviso-linha-topo b { font-weight: 600; color: var(--tinta); }
.aviso-linha-acoes { display: flex; gap: 4px 18px; flex-wrap: wrap; align-items: center; margin-left: auto; flex: none; }
.aviso-linha-acoes .acao-txt { font-size: 16px; padding: 0; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.aviso-linha-acoes .acao-txt svg { transition: transform .15s var(--ease); }
.aviso-linha-acoes .acao-txt[aria-expanded="true"] svg { transform: rotate(180deg); }
.aviso-linha-detalhe { margin: 8px 0 2px 28px; }
.aviso-linha-detalhe > * + * { margin-top: 6px; }
.aviso-linha--atencao { background: var(--ambar-50); border-color: var(--ambar-200); }
.aviso-linha--atencao .aviso-linha-topo > svg { color: var(--ambar-700); }
.aviso-linha--segredo { background: var(--critico-50); border-color: var(--critico-200); }
.aviso-linha--segredo .aviso-linha-topo > svg, .aviso-linha--segredo .aviso-linha-topo b { color: var(--critico-700); }
.aviso-linha--info { background: var(--azul-50); border-color: var(--azul-200); }
.aviso-linha--info .aviso-linha-topo > svg { color: var(--azul-700); }

/* ---------- Blocos que abrem e fecham (S01) */
.sanfonas { border-bottom: 1px solid var(--linha-forte); }
.sanfona { border-top: 1px solid var(--linha-forte); }
.sanfona > summary { list-style: none; display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 12px; padding: 14px 0; cursor: pointer; }
.sanfona > summary::-webkit-details-marker { display: none; }
.sanfona > summary .chevron { align-self: center; width: 16px; height: 16px; color: var(--tinta); transition: transform .15s var(--ease); }
.sanfona[open] > summary .chevron { transform: rotate(90deg); }
.sanfona > summary h2 { font-size: 18px; }
.sanfona > summary:hover h2 { color: var(--azul-700); }
.sanfona > summary:focus-visible { outline-offset: 0; }
.resumo-sanfona { margin-left: auto; font-size: 14px; color: var(--texto-2); text-align: right; }
.sanfona-corpo { padding: 0 0 22px 28px; }
.sanfona-corpo > * + * { margin-top: 14px; }
.tela-analise > .aviso-linha { margin-bottom: 16px; }
.tela-analise .nota-analise { margin-top: 12px; }
.quesitos-lista:not(.todos) li.a-mais { display: none; }
.mais-quesitos { margin-top: 8px; }
.mais-quesitos .acao-txt { font-size: 16px; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* ---------- Manifestação de honorários (S01): uma linha de ação; o resultado vira bloco */
.manifestacao-inicio { padding: 2px 0 18px; }
.linha-acao { display: flex; gap: 10px 16px; align-items: center; flex-wrap: wrap; }
.linha-acao > p { color: var(--texto-2); font-size: 14px; flex: 1 1 260px; }
.topo-manifestacao { margin-bottom: 12px; }
.topo-manifestacao > .botao + .botao { margin-left: 0; }
.sanfona-manifestacao { margin-bottom: 4px; }
.manifestacao .sanfona-manifestacao { border-bottom: 0; }

/* ---------- Menu de ações ("Mais", "Mover ou remover") */
.menu-acoes { position: relative; display: inline-flex; }
.menu-acoes-lista { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; display: flex; flex-direction: column; min-width: 230px; padding: 6px;
  background: var(--papel); border: 1px solid var(--linha-forte); border-radius: var(--raio-g); box-shadow: var(--sombra-flutua); animation: aparece .12s var(--ease); }
.menu-acoes-lista.esquerda { right: auto; left: 0; }
.menu-acoes-lista button { display: flex; gap: 8px; align-items: center; width: 100%; text-align: left; padding: 8px 12px; border: 0; background: none; border-radius: 3px; cursor: pointer; font-size: 16px; color: var(--tinta); white-space: nowrap; }
.menu-acoes-lista button:hover:not(:disabled), .menu-acoes-lista button:focus { background: var(--papel-2); outline: none; }
.menu-acoes-lista button:focus-visible { box-shadow: inset 0 0 0 2px var(--azul-500); }
.menu-acoes-lista button.perigo { color: var(--critico-700); }
.menu-acoes-lista button:disabled { opacity: .45; cursor: not-allowed; }
.menu-acoes-lista button svg { width: 16px; height: 16px; }

/* ---------- Cabeçalho do caso (S02 e S12): título, segredo de justiça em uma linha e a trilha do andamento */
.migalha .sep { color: var(--texto-2); }
.linha-titulo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; }
.linha-titulo h1 { min-width: 0; flex: 0 1 auto; }
.segredo-caso { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; font-size: 14px; color: var(--texto-2); }
.segredo-caso svg { width: 16px; height: 16px; }
.segredo-caso .estado-segredo { display: inline-flex; gap: 8px; align-items: center; }
.segredo-caso .estado-segredo b { color: var(--tinta); font-weight: 600; }
.selo-segredo { display: inline-flex; gap: 8px; align-items: center; padding: 6px 14px; border: 1px solid #e3a79f; background: var(--critico-50); color: var(--critico-700); font-weight: 600; font-size: 16px; border-radius: var(--raio); }
.segredo-caso .acao-txt { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.trilha { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; row-gap: 6px; font-size: 16px; }
.passo-trilha { display: flex; align-items: center; }
.passo-trilha + .passo-trilha::before { content: ""; width: 40px; height: 1px; background: var(--linha-forte); margin: 0 12px; flex: none; }
.passo-trilha a { display: inline-flex; gap: 7px; align-items: center; color: var(--texto-2); text-decoration: none; }
.passo-trilha a:hover span:not(.oculto-leitor) { text-decoration: underline; text-underline-offset: 3px; }
.passo-trilha svg { width: 16px; height: 16px; }
.passo-trilha.feito a { color: var(--verde-700); }
.passo-trilha.atual a, .passo-trilha.andamento a { color: var(--tinta); font-weight: 600; }
.bolinha { width: 11px; height: 11px; border-radius: 50%; border: 1.5px solid currentColor; flex: none; }
.passo-trilha.atual .bolinha, .passo-trilha.andamento .bolinha { background: var(--azul-600); border-color: var(--azul-600); }
.passo-trilha.andamento .bolinha { animation: pulsa 1.6s ease-in-out infinite; }
@keyframes pulsa { 50% { opacity: .35; } }

/* ---------- Visão geral: caminho do laudo com o próximo passo em destaque (S11) */
.caminho { list-style: none; margin: 0; padding: 0; }
.passo-caminho { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 4px 14px; align-items: start; padding: 14px 0; border-top: 1px solid var(--linha); }
.passo-caminho:first-child { border-top: 0; padding-top: 4px; }
.passo-caminho .n { font-size: 16px; color: var(--texto-2); font-variant-numeric: tabular-nums; padding-top: 1px; }
.passo-caminho .n svg { width: 16px; height: 16px; margin-top: 3px; }
.passo-caminho.feito .n { color: var(--verde-700); }
.passo-caminho.atual .n, .passo-caminho.andamento .n { color: var(--azul-700); font-weight: 600; }
.titulo-passo { display: flex; flex-wrap: wrap; gap: 2px 12px; align-items: baseline; }
.titulo-passo h3 { font-weight: 500; }
.passo-caminho.atual .titulo-passo h3, .passo-caminho.andamento .titulo-passo h3 { font-weight: 600; }
.passo-caminho .texto p { color: var(--texto); margin-top: 2px; }
.passo-caminho.pendente .texto p { color: var(--texto-2); }
.passo-caminho .acao { align-self: center; }
.passo-caminho .acao .acao-txt { font-size: 16px; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.acoes-entrega { display: inline-flex; gap: 4px 16px; flex-wrap: wrap; }

/* ---------- Quadro (S03): busca e filtros; "Mover para…" com texto */
.barra-quadro .campo-busca { display: flex; flex: 1 1 260px; max-width: 400px; }
.barra-quadro .campo-busca .busca { flex: 1; max-width: none; }
.barra-quadro .filtros-quadro { display: flex; gap: 12px 18px; flex-wrap: wrap; align-items: center; }
.barra-celular { gap: 8px; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
.barra-celular > .botao--primario { margin-left: auto; }
.coluna.vazia .cards { min-height: 0; }

/* ---------- Barra da minuta (S08): um número de pendências e "Ir para o próximo" */
.barra-minuta .estado { margin-right: 0; }
.pendencias-barra { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; padding: 5px 6px 5px 14px; background: var(--ambar-50); border: 1px solid var(--ambar-200); border-radius: var(--raio); color: var(--tinta); font-size: 16px; }
.pendencias-barra b { font-weight: 700; }
.pendencias-barra .botao { background: var(--papel-branco); }
.pendencias-barra.ok { padding: 6px 14px; gap: 8px; background: var(--verde-50); border-color: #bcd9c7; color: var(--verde-700); font-weight: 600; }
.pendencias-barra.ok svg { width: 16px; height: 16px; }
.acoes-barra { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-left: auto; }
.barra-vistoria .menu-acoes { margin-left: auto; }

/* ---------- Ajuste pela IA (S13): o que mudou antes de aceitar */
.resumo-diferenca { display: flex; gap: 4px 18px; flex-wrap: wrap; margin: 8px 0 2px; }
.previa-diferenca p + p { margin-top: 10px; }
.previa-diferenca ins { background: #d9efe1; color: inherit; text-decoration: underline; text-decoration-color: var(--verde-700); text-underline-offset: 3px; }
.previa-diferenca del { background: var(--critico-50); color: var(--critico-700); text-decoration: line-through; }
.proposta .acoes { align-items: center; }
.proposta .acoes .acao-txt { font-size: 16px; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.empurra { flex: 1 1 auto; }

/* ---------- Vistoria (S09 e S10): índice das seções, barra "Salvar" sempre à vista, fotos com campos nomeados */
.layout-vistoria { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 36px; align-items: start; }
.indice-vistoria { position: sticky; top: calc(var(--topo) + 76px); padding-top: 14px; }
.indice-vistoria .rot { font-size: 14px; font-weight: 600; color: var(--texto-2); margin-bottom: 6px; }
.indice-vistoria ol { list-style: none; margin: 0; padding: 0; }
.indice-vistoria a { display: flex; gap: 6px; align-items: center; padding: 5px 0; color: var(--texto); text-decoration: none; font-size: 16px; line-height: 1.35; }
.indice-vistoria a:hover { color: var(--azul-700); text-decoration: underline; text-underline-offset: 3px; }
.indice-vistoria a svg { width: 16px; height: 16px; color: var(--verde-700); }
.conteudo-vistoria { min-width: 0; }
.conteudo-vistoria section { scroll-margin-top: calc(var(--topo) + 76px); }
.conteudo-vistoria h2[tabindex="-1"]:focus { outline: none; }
.barra-salvar { position: sticky; bottom: 0; z-index: 25; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 18px; padding: 12px 20px;
  background: var(--navy-900); color: #f3f1eb; border-radius: var(--raio) var(--raio) 0 0; box-shadow: 0 -8px 24px rgba(13, 27, 46, .18); animation: sobe .2s var(--ease); }
.barra-salvar .ponto-sujo { width: 10px; height: 10px; border-radius: 50%; background: var(--ambar-500); flex: none; }
.barra-salvar .texto { flex: 1 1 auto; font-weight: 500; }
.barra-salvar .botao--fantasma { color: #f3f1eb; }
.barra-salvar .botao--fantasma:hover:not(:disabled) { background: rgba(255, 255, 255, .1); }
.barra-salvar .botao--primario { background: #fbfaf6; color: var(--navy-900); }
.barra-salvar .botao--primario:hover:not(:disabled) { background: #fff; }
.barra-salvar :focus-visible { outline-color: #7fb0f5; }
body:has(.barra-salvar:not([hidden])) .avisos { bottom: 92px; }
.foto .item-topo .menu-acoes { margin-left: auto; }
.foto .sugerir { margin-top: -4px; }
.foto .sugerir .acao-txt { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* ---------- Uso de IA (só quando religado): detalhes técnicos recolhidos */
.detalhes-tecnicos { margin-top: 16px; }
.detalhes-tecnicos > summary { cursor: pointer; font-weight: 600; color: var(--tinta); }
.detalhes-tecnicos > summary + * { margin-top: 10px; }

/* ---------- Modal e avisos flutuantes */
.fundo-modal { position: fixed; inset: 0; background: rgba(7, 21, 40, .42); z-index: 60; display: grid; place-items: center; padding: 16px; animation: aparece .18s var(--ease); }
.modal { background: var(--papel); border-radius: var(--raio-g); box-shadow: var(--sombra-flutua); width: min(560px, 100%); max-height: calc(100vh - 32px); overflow: auto; padding: 24px 26px; }
.modal h2 { margin-bottom: 10px; font-size: 18px; }
.modal .acoes { justify-content: flex-end; margin-top: 22px; }
.modal--largo { width: min(760px, 100%); }
.modal .custo { margin-top: 12px; font-size: 14px; padding: 10px 12px; background: var(--papel-2); border-radius: var(--raio); }
.modal .custo b { font-weight: 600; color: var(--tinta); }
@keyframes aparece { from { opacity: 0; } }
.avisos { position: fixed; bottom: 20px; right: 20px; z-index: 80; display: flex; flex-direction: column; gap: 8px; align-items: flex-end; pointer-events: none; }
.toast { background: var(--navy-900); color: #f3f1eb; padding: 10px 16px; border-radius: var(--raio); box-shadow: var(--sombra-flutua); font-size: 14px; max-width: min(440px, calc(100vw - 32px)); pointer-events: auto; animation: sobe .25s var(--ease); }
.toast.erro { background: var(--critico-700); }
.toast.ok::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 1px; background: #8fd3b0; margin-right: 9px; vertical-align: 1px; }
@keyframes sobe { from { opacity: 0; transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ---------- Responsivo */
@media (max-width: 1320px) {
  .editor { grid-template-columns: minmax(0, 760px) minmax(280px, 330px); }
  .sumario { display: none; }
}
@media (max-width: 1100px) {
  .grade-ficha { grid-template-columns: 1fr; }
  .editor { grid-template-columns: minmax(0, 1fr); }
  .painel-apont { order: 2; }
  .bloco .ref-nota { right: -6px; top: -14px; flex-direction: row; }
  .com-gaveta { padding-right: 32px; } /* a gaveta cobre a página: volta o respiro normal (com 0, a página ficava mais larga que o celular e a barra do visualizador saía da tela) */
  .gaveta { width: 100%; left: 0; }
  .livro-gasto { grid-template-columns: 1fr; }
  .livro-gasto > div { border-left: 0; padding-left: 0; border-top: 1px solid var(--linha); }
  .livro-gasto > div:first-child { border-top: 0; }
}
@media (max-width: 760px) {
  body { font-size: 16px; }
  main { padding: 18px 16px 48px; }
  .com-gaveta { padding-right: 16px; }
  h1 { font-size: 36px; }
  .topo { padding: 0 8px 0 16px; gap: 6px; }
  .marca small { display: none; }
  .nav { display: none; position: absolute; top: var(--topo); left: 0; right: 0; height: auto; background: var(--navy-900); flex-direction: column; gap: 0; padding: 4px 16px 12px; margin: 0; box-shadow: var(--sombra-flutua); }
  .nav.aberto { display: flex; }
  .nav a { padding: 12px 0; height: auto; border-bottom: 1px solid rgba(255, 255, 255, .08); }
  .nav a[aria-current="page"] { border-bottom-color: rgba(255, 255, 255, .08); color: #9cc1f3; }
  .topo .menu-celular { display: inline-flex; margin-left: auto; border-color: rgba(243, 241, 235, .4); }
  .usuario { margin-left: 0; }
  .usuario .quem { display: none; }
  .usuario .botao { border-color: transparent; padding: 0 10px; }
  .tela-login { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .login-form { align-items: flex-start; padding: 28px 20px 40px; }
  .login-lado { padding: 22px 20px 26px; }
  .login-lado h1 { font-size: 36px; margin-top: 26px; }
  .login-lado p { font-size: 16px; margin-top: 8px; }
  .login-lado .marca-dagua { width: 220px; height: 220px; right: -70px; bottom: -110px; stroke: rgba(127, 176, 245, .14); }
  .login-lado .rodape { display: none; }
  .cabecalho-pagina { margin-bottom: 16px; }
  .caso-cabeca { grid-template-columns: 1fr; gap: 12px; margin-bottom: 12px; }
  .abas-moldura::after { content: ""; position: absolute; right: 0; top: 0; bottom: 1px; width: 36px; background: linear-gradient(90deg, rgba(243, 241, 235, 0), var(--mesa)); pointer-events: none; }
  .abas-moldura { margin-left: -16px; margin-right: -16px; margin-bottom: 18px; }
  .abas { gap: 20px; padding: 0 16px; scroll-padding: 0 16px; }
  .abas a { font-size: 16px; }
  /* S03: no celular o quadro vira uma lista por etapa (rolando só para baixo); etapa vazia ocupa uma linha */
  .so-celular { display: flex; }
  .so-computador { display: none !important; }
  .barra-quadro:not(.mostrar-busca):not(.mostrar-filtros) { display: none; }
  .barra-quadro:not(.mostrar-busca) .campo-busca, .barra-quadro:not(.mostrar-filtros) .filtros-quadro { display: none; }
  .barra-quadro .campo-busca { flex: 1 1 100%; max-width: none; }
  .quadro { display: flex; flex-direction: column; overflow: visible; min-height: 0; padding-bottom: 0; border-top: 0; }
  .coluna, .coluna:first-child, .coluna:last-child { padding: 0 0 14px; border-left: 0; border-top: 1px solid var(--linha-forte); min-height: 0; gap: 8px; }
  .coluna.vazia { padding-bottom: 0; }
  .coluna-topo { padding: 12px 0 4px; }
  .coluna.vazia .coluna-topo { padding-bottom: 12px; }
  .card .rodape-card { flex-wrap: wrap; }
  .trilha { font-size: 14px; column-gap: 18px; }
  .passo-trilha + .passo-trilha::before { display: none; }
  .linha-titulo { align-items: flex-start; }
  .selo-segredo { font-size: 14px; padding: 4px 10px; }
  .passo-caminho { grid-template-columns: 24px minmax(0, 1fr); }
  .passo-caminho .acao { grid-column: 2; align-self: start; margin-top: 6px; }
  .sanfona-corpo { padding-left: 0; }
  .resumo-sanfona { margin-left: 28px; flex: 1 1 100%; text-align: left; }
  .aviso-linha-topo { flex-wrap: wrap; }
  .aviso-linha-acoes { margin-left: 28px; flex: 1 1 100%; }
  .aviso-linha-detalhe { margin-left: 0; }
  .sumario-analise { grid-template-columns: 1fr 1fr; gap: 12px 16px; }
  .layout-vistoria { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .barra-salvar { margin-left: -16px; margin-right: -16px; border-radius: 0; padding: 10px 16px; }
  .barra-salvar .texto { flex: 1 1 calc(100% - 40px); }
  .barra-salvar .botao { flex: 1 1 40%; }
  .pendencias-barra { flex: 1 1 100%; justify-content: space-between; }
  .acoes-barra { width: 100%; margin-left: 0; }
  .acoes-barra > * { flex: 1 1 40%; }
  .acoes-barra .menu-acoes > .botao { width: 100%; }
  .grade-2, .grade-3 { grid-template-columns: 1fr; }
  .conta-honorarios .total { align-items: flex-start; text-align: left; }
  .manifestacao > .cartao-topo > .botao { flex: 1 1 40%; }
  .manifestacao > .cartao-topo > .botao:first-of-type { margin-left: 0; }
  .previa-peticao { padding: 20px 16px; }
  .folha { padding: 26px 18px 30px; font-size: 14px; box-shadow: 4px 4px 0 -1px #e8e4da, 4px 4px 0 0 var(--linha); }
  .bloco.editado::before { left: -12px; }
  .capa-laudo { margin-bottom: 26px; }
  .item-vistoria { grid-template-columns: 1fr auto; }
  .item-vistoria .id { grid-column: 1 / -1; padding-top: 0; }
  .item-vistoria .campos { grid-column: 1; }
  .item-vistoria .campos.medicao { grid-template-columns: 1fr 1fr; }
  .linha-tempo li { grid-template-columns: 1fr; gap: 2px; }
  .dados { grid-template-columns: 1fr; gap: 0; }
  .dados dd { margin-bottom: 8px; }
  .codigos-rec { grid-template-columns: 1fr; }
  .barra-minuta { position: static; margin-top: 0; }
  .barra-minuta .acoes-barra .botao { padding: 0 10px; }
  .barra-minuta .estado { flex: 1 1 100%; }
  .barra-quadro .dica { display: none; }
  .esconder-celular { display: none !important; }
  .avisos { left: 16px; right: 16px; bottom: 16px; align-items: stretch; }
}

/* ---------- Impressão (códigos de recuperação) */
@media print {
  body { background: #fff; }
  .topo, .nao-imprimir, .avisos { display: none !important; }
  .tela-login { display: block; }
  .login-lado { display: none; }
  .codigos-rec { font-size: 15pt; }
}
