/* A forma do avalim. As cores vêm de temas.css (variáveis) — nenhuma cor fixa aqui. */
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font:14px/1.45 "Segoe UI",Calibri,Arial,sans-serif;color:var(--texto);background-color:var(--fundo);
  background-image:linear-gradient(var(--grade) 1px,transparent 1px),linear-gradient(90deg,var(--grade) 1px,transparent 1px);background-size:22px 22px}
button,input,select,textarea{font:inherit;color:inherit}
select,input,textarea{background:var(--card)}
h1,h2,h3{margin:0;color:var(--titulo);font-weight:600}
h2{font-size:17px} h3{font-size:14px;text-transform:uppercase;letter-spacing:.04em}
.oculto{display:none!important}

/* ---------- barra do topo ---------- */
.topo{display:flex;align-items:center;gap:14px;padding:8px 20px;background:var(--topo);color:var(--sobre-topo);border-bottom:1px solid var(--linha)}
.topo .logo{height:34px;width:auto;display:block}
.topo .marca{flex:none}
.topo .nome{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.95}
.topo .estado{font-size:12px;opacity:.85}
.topo .conta{display:flex;align-items:center;gap:8px;font-size:13px}
.topo button,.topo select{background:transparent;border:1px solid color-mix(in srgb,var(--sobre-topo) 45%,transparent);color:var(--sobre-topo);border-radius:6px;padding:5px 10px;cursor:pointer}
.topo select option{color:var(--texto);background:var(--card)}
.topo button:hover{background:color-mix(in srgb,var(--sobre-topo) 14%,transparent)}
.topo .marca{cursor:pointer}
/* abas dos modelos abertos */
.abas-modelos{display:flex;gap:3px;padding:6px 20px 0;background:var(--topo);border-bottom:1px solid var(--linha);overflow-x:auto}
.aba-modelo{display:flex;align-items:center;gap:6px;max-width:250px;padding:5px 6px 5px 12px;border:1px solid var(--linha);border-bottom:0;border-radius:7px 7px 0 0;
  background:var(--fundo2);color:var(--suave);font-size:13px;cursor:pointer;flex:none}
.aba-modelo.sel{background:var(--card);color:var(--texto);font-weight:600}
.aba-modelo span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aba-modelo button{border:0;background:none;color:var(--suave);font-size:16px;line-height:1;padding:0 3px;cursor:pointer;border-radius:4px}
.aba-modelo button:hover{color:var(--imp);background:var(--impbg)}
/* Meus dados: campo à esquerda, "incluir no laudo" à direita */
.grade-empresa{display:grid;grid-template-columns:1fr 170px;gap:6px 18px;align-items:end;margin-top:10px}
.grade-empresa>.opcao-linha{padding-bottom:9px}
.logo-empresa{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.logo-empresa img{height:44px;max-width:220px;object-fit:contain;background:var(--fundo2);border-radius:4px;padding:3px}

/* ---------- estrutura ---------- */
.pagina{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;padding:16px 20px;max-width:1700px;margin:0 auto}
.pagina.so{grid-template-columns:minmax(0,1fr)}
@media (max-width:1100px){.pagina{grid-template-columns:minmax(0,1fr)}}
.card{background:var(--card);border:1px solid var(--linha);border-radius:10px;padding:16px 18px}
.card + .card{margin-top:16px}
.abas{display:flex;gap:16px;align-items:flex-start;margin-bottom:12px}
.abas-metodos{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.linha-abas{display:flex;flex-wrap:wrap;gap:5px}
.linha-abas.metodos{gap:12px;margin-bottom:6px}
.linha-grupos{display:flex;flex-wrap:wrap;gap:8px 34px;align-items:flex-start}
.grupo-abas{display:flex;flex-direction:column;gap:6px;min-width:0}
/* título de cada grupo: letra pequena na cor da marca sobre um fio fino na cor dos títulos (o cabeçalho de relatório da identidade) */
.rotulo-abas{font-size:10.5px;font-weight:700;letter-spacing:.09em;color:var(--botao);border-bottom:1px solid var(--titulo);padding-bottom:3px}
/* lugar reservado à direita: Rascunhos em cima, LAUDO embaixo */
.abas-laterais{flex:none;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;gap:8px;min-height:104px}
.abas-estreita{display:none}
.abas button{border:1.5px solid var(--linha);background:var(--card);border-radius:8px;padding:7px 14px;cursor:pointer;color:var(--suave)}
.abas button:disabled{opacity:.4;cursor:default}
/* uma cor só, a da identidade: os métodos na cor da marca; as etapas, discretas; o que está aberto, em destaque */
.abas button.metodo{border:2px solid var(--botao);color:var(--botao);font-weight:700;letter-spacing:.05em;font-size:13px;padding:9px 20px}
.abas button.metodo.sel{background:var(--botao);color:var(--sobre-botao)}
/* INFORMAÇÕES › MODELO: fora dos métodos, na cor dos títulos (a mesma do LAUDO, que também vale para todos os métodos) */
.linha-topo-menu{display:flex;flex-wrap:wrap;gap:8px 34px;align-items:flex-start}
.abas button.info{border:2px solid var(--titulo);color:var(--titulo);font-weight:700;letter-spacing:.05em;font-size:13px;padding:9px 20px;background:color-mix(in srgb,var(--titulo) 6%,var(--card))}
.abas button.info.sel{background:var(--titulo);color:var(--card)}
.abas button.etapa{padding:4px 12px;font-size:13px;color:var(--texto)}
.abas button.etapa.sel{border-color:var(--titulo);color:var(--titulo);font-weight:700;background:color-mix(in srgb,var(--titulo) 12%,var(--card))}
.abas a.alternativa{font-size:13px;color:var(--texto);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:1px 0}
.abas a.alternativa.sel{color:var(--titulo);font-weight:700}
.abas button.rascunhos{border-style:dashed;border-width:2px}
.abas button.rascunhos.sel{color:var(--texto);font-weight:700;background:var(--fundo2)}
.abas button.laudo{border:2.5px solid var(--titulo);color:var(--titulo);background:color-mix(in srgb,var(--titulo) 6%,var(--card));padding:19px 34px;font-size:15.5px;font-weight:700;letter-spacing:.08em}
.abas button.laudo.sel{background:var(--titulo);color:var(--card)}
.abas .so-estreita{display:none}
@media (max-width:1500px){.abas button.metodo,.abas button.info{padding:7px 14px} .abas button.laudo{padding:14px 24px;font-size:14.5px} .abas-laterais{min-height:92px}}
/* tela estreita (celular, janela pequena): as etapas vão para um menu; ficam à vista o menu, anterior, próxima e o LAUDO */
@media (max-width:820px){
  .abas{flex-wrap:wrap;gap:8px;align-items:center}
  .abas-estreita{display:flex;flex:1 1 100%;flex-wrap:wrap;gap:6px;align-items:center}
  .abas-estreita .aba-atual{flex:1 1 100%;font-weight:700;color:var(--titulo)}
  .abas-metodos{display:none;flex:1 1 100%;border:1px solid var(--linha);border-radius:8px;padding:8px;background:var(--card)}
  .abas-metodos.aberto{display:flex}
  .abas .so-estreita{display:inline-block} .abas .so-larga{display:none}
  .abas-laterais{min-height:0;flex:1 1 100%} .abas button.laudo{padding:10px 20px}
}
.abas button small{font-weight:400;color:var(--suave)}
.linha-acoes{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:10px 0}
.bt{border:1px solid var(--botao);background:var(--botao);color:var(--sobre-botao);border-radius:6px;padding:7px 14px;cursor:pointer;text-decoration:none;display:inline-block}
.bt:hover{filter:brightness(1.12)}
.bt.sec{background:var(--card);color:var(--titulo);border-color:var(--titulo)}
.bt.sec:hover{background:var(--fundo2);filter:none}
.bt.mini{padding:3px 9px;font-size:12.5px}
.bt:disabled{opacity:.45;cursor:not-allowed}
.campo{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
.campo label{font-size:12px;color:var(--suave)}
.campo input,.campo select,.campo textarea{border:1px solid var(--linha);border-radius:6px;padding:7px 9px}
.obrig{color:var(--secundaria);font-weight:700;font-size:15px;line-height:1}
.obrig-txt{color:var(--imp);font-weight:700}
.campo textarea.falta,.campo input.falta{border-color:var(--imp);background:var(--impbg)}
.radios{display:flex;flex-direction:column;gap:5px;font-size:13.5px}
.radios label{font-size:13.5px;color:var(--texto);display:flex;align-items:center;gap:6px;cursor:pointer}
.radios input{margin:0}
.sugestao{display:flex;gap:7px;align-items:flex-start;padding:3px 6px;border-radius:6px;cursor:pointer;font-size:12.5px}
.sugestao:hover{background:var(--fundo2)}
.sugestao .ic{flex:none;width:15px;height:15px;margin-top:2px}
.nota-item{font-size:12px;color:var(--suave);margin-top:3px}
.nota-item.atencao{background:var(--atbg);border-left:3px solid var(--atborda);border-radius:4px;padding:4px 7px;color:var(--texto)}
.nota-item .ic{width:14px;height:14px}
.grade2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.grade3{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:0 14px}
.grade-laudo{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.grade-laudo .larga{grid-column:1 / -1}
.duas{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
@media (max-width:1250px){.duas{grid-template-columns:1fr}}
.dica{color:var(--suave);font-size:12.5px;margin:6px 0}
.titulo-linha{display:flex;align-items:center;gap:8px;margin:0 0 6px}
.amostra-cor{display:inline-block;width:22px;height:12px;border-radius:3px;border:1px solid var(--linha);vertical-align:middle;margin:0 2px}

/* ---------- tabelas ---------- */
.rolagem{overflow:auto;max-height:calc(100vh - 290px);border:1px solid var(--linha);border-radius:8px;background:var(--card);padding-bottom:14px}
table.t{border-collapse:separate;border-spacing:0;width:100%;font-size:13px}
table.t.fixa{table-layout:fixed;width:max-content}
table.t th{position:sticky;top:0;z-index:2;background:var(--cab-info);color:var(--sobre-cab-info);text-align:left;padding:5px 8px 6px 11px;
  border-bottom:1px solid color-mix(in srgb,var(--sobre-cab-info) 40%,transparent);white-space:nowrap;font-weight:600;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis}
table.t th.var{background:var(--cab-var);color:var(--sobre-cab-var)}
table.t th.centro,table.t td.centro{text-align:center}
table.t th.fora{opacity:.6}
table.t th .un{display:block;font-size:10.5px;font-weight:400;opacity:.8;line-height:1.1;min-height:12px}
table.t th .puxa{position:absolute;top:0;right:0;width:7px;height:100%;cursor:col-resize;user-select:none}
table.t th .puxa:hover,table.t th .puxa.ativo{background:color-mix(in srgb,var(--titulo) 35%,transparent)}
table.t th.compacta,table.t th.centro{padding-left:4px;padding-right:4px}
table.t th.compacta{text-align:center;cursor:pointer}
table.t td{border-bottom:1px solid var(--linha2);padding:0;overflow:hidden}
/* divisão fina entre as colunas (título e corpo), para achar a borda de arrastar */
table.t th,table.t td{border-right:1px solid color-mix(in srgb,var(--suave) 22%,transparent)}
table.t th:last-child,table.t td:last-child{border-right:0}
/* linha acima dos títulos: a chave que abrange as colunas de informação e o botão de compactar */
table.t thead tr.grupos th{top:0;height:34px;background:var(--card);border-bottom:0;border-right:0;padding:0 3px;overflow:visible;vertical-align:bottom}
table.t thead tr.grupos + tr th{top:34px}
table.t .chave{position:relative;height:9px;border:1.5px solid var(--suave);border-bottom:0;border-radius:6px 6px 0 0;margin:0 1px}
table.t .chave .bt{position:absolute;left:50%;top:-17px;transform:translateX(-50%);white-space:nowrap;padding:2px 9px;font-weight:400}
table.t td.fx{padding:4px 8px 4px 11px;white-space:nowrap;color:var(--suave)}
table.t td.num{text-align:right;font-variant-numeric:lining-nums tabular-nums}
table.t td.icone{text-align:center;cursor:pointer;padding:3px 0}
/* colunas congeladas na rolagem horizontal (a 2ª encosta na largura da 1ª; a página põe o "left") */
table.t td.fz1,table.t td.fz2{position:sticky;z-index:1;background:var(--card)}
table.t th.fz1,table.t th.fz2{z-index:4}
table.t .fz1{left:0} table.t .fz2{left:52px;box-shadow:1px 0 0 var(--linha)}
table.t thead tr.grupos th.fz1,table.t thead tr.grupos th.fz2{position:sticky}
/* linha fora do cálculo: cinza claro */
table.t tr.off td{background:var(--apagado)}
table.t tr.off input:not(.motivo),table.t tr.off select,table.t tr.off td.fx{color:var(--apagado-texto)}
table.t tr.off input.motivo{color:var(--texto)}
table.t tr.resumo td{background:var(--fundo2);color:var(--suave);font-size:12px;padding:3px 8px;white-space:nowrap;text-align:center}
table.t tr.resumo td.rotulo{text-align:right;font-weight:600;overflow:visible}
table.t tr.resumo td.rotulo .ic{width:14px;height:14px;margin-right:3px}
/* justificativa: guardada (item reativado) em cinza claro; botão de apagar ao fim da célula */
table.t td.motivo-cel{position:relative}
table.t td.motivo-cel input{padding-right:28px}
table.t input.motivo.guardado{color:var(--apagado-texto)}
table.t button.limpa{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:0;background:transparent;cursor:pointer;padding:0;line-height:0}
table.t button.limpa:hover .ic{color:var(--imp)}
table.t tr.marcado td{background:var(--marcado)}
table.t.cmp td.mudou{color:var(--titulo);font-weight:600}
table.t input,table.t select{border:0;background:transparent;padding:6px 8px 6px 11px;width:100%;min-width:0;outline:none;text-overflow:ellipsis}
table.t input.n,table.t input.centro,table.t select.centro{padding-left:8px}
table.t input.n{text-align:center;font-variant-numeric:lining-nums tabular-nums}
table.t input.centro,table.t select.centro{text-align:center;text-align-last:center}
table.t input:focus,table.t select:focus{background:var(--foco);box-shadow:inset 0 0 0 2px var(--foco-borda)}
table.t input.vazio{background:var(--impbg)}
table.t input.fora-limite{background:var(--atbg)}
table.t input[type=checkbox]{width:auto;min-width:0;margin:0 10px}
table.t select.dependente{color:var(--secundaria);font-weight:700}
table.t td.acao button{border:0;background:transparent;color:var(--suave);cursor:pointer;padding:4px 8px}
table.t td.acao button:hover{color:var(--imp)}
.bt-sinal{border:0;background:transparent;cursor:pointer;padding:3px 0;width:100%;display:flex;justify-content:center}

/* ---------- ícones (SVG em linha) ---------- */
.ic{width:18px;height:18px;display:inline-block;vertical-align:middle}
.ic.ok{color:var(--ok)} .ic.nao{color:var(--imp)} .ic.aviso{color:var(--atborda)} .ic.neutro{color:var(--suave)} .ic.info{color:var(--titulo);cursor:pointer}
.ic.sobe{color:var(--ok)} .ic.desce{color:var(--imp)} .ic.sobe.azul{color:var(--titulo)} .ic.limpar{color:var(--suave);width:16px;height:16px}

/* ---------- flutuantes: explicação ao passar o mouse, quadro de informação, editor de texto longo ---------- */
#flut{position:fixed;z-index:50;max-width:380px;background:var(--texto);color:var(--card);border-radius:6px;padding:7px 10px;font-size:12.5px;line-height:1.4;
  pointer-events:none;white-space:pre-line;box-shadow:0 6px 18px var(--sombra)}
#pop{position:fixed;z-index:60;width:min(520px,92vw);background:var(--card);color:var(--texto);border:1px solid var(--titulo);border-radius:10px;padding:14px 16px;
  box-shadow:0 10px 30px var(--sombra);font-size:13px}
#pop h4{margin:0 0 8px;color:var(--titulo);font-size:14px} #pop ul{margin:4px 0 0 18px;padding:0} #pop li{margin-bottom:6px} #pop p{margin:0 0 8px}
#pop .fechar{float:right;border:0;background:transparent;cursor:pointer;color:var(--suave);font-size:16px}
#editor{position:fixed;z-index:55;border:2px solid var(--foco-borda);border-radius:6px;background:var(--foco);color:var(--texto);padding:6px 8px;font:inherit;font-size:13px;
  resize:none;box-shadow:0 8px 22px var(--sombra);overflow:hidden}

/* ---------- painel lateral e avisos ---------- */
.lateral h3{margin-bottom:8px}
#painelExtra{margin-top:16px}
.nomenclatura{font-size:12.5px}
.nomenclatura h3{margin:14px 0 4px}
.nomenclatura details summary{font-weight:400;padding:3px 0}
.nomenclatura dl{margin:2px 0 8px;display:grid;grid-template-columns:auto 1fr;gap:2px 8px}
.nomenclatura dt{font-weight:600;color:var(--titulo)} .nomenclatura dd{margin:0}
.opcoes-norma{margin:2px 0 8px 16px;padding:0}
.opcoes-norma li{margin-bottom:5px}
.opcoes-norma li span{display:block;color:var(--suave);font-size:11.5px}
.placar{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.placar.seis{grid-template-columns:repeat(6,1fr)}
@media (max-width:1250px){.placar.seis{grid-template-columns:repeat(3,1fr)}}
.placar div{background:var(--fundo2);border-radius:8px;padding:8px;text-align:center}
.placar b{display:block;font-size:20px;color:var(--titulo)}
.placar span{font-size:11.5px;color:var(--suave)}
.minimos{font-size:12.5px;color:var(--suave);margin-bottom:10px}
.minimos b.tem{color:var(--ok)} .minimos b.falta{color:var(--imp)}
.alerta{border-left:4px solid;border-radius:6px;padding:7px 10px;margin-bottom:6px;font-size:13px}
.alerta.impede{border-color:var(--imp);background:var(--impbg)}
.alerta.atencao{border-color:var(--atborda);background:var(--atbg)}
.alerta.info,.alerta.ok{border-color:var(--ok);background:var(--okbg)}
.alerta ul{margin:4px 0 0 18px;padding:0}
.aviso-topo{background:var(--atbg);border:1px solid var(--atborda);border-radius:8px;padding:8px 12px;margin-bottom:12px}
.ok-topo{background:var(--okbg);border:1px solid var(--ok);color:var(--ok);border-radius:8px;padding:8px 12px;margin-bottom:12px}
/* quadro de entrada da versão web (Firebase) */
.entrada-pagina{max-width:400px;margin:48px auto}
.entrada{padding:24px 26px}
.entrada h2{text-align:center;margin:0 0 16px}
.entrada .campo{margin-bottom:12px}
.entrada .campo input{padding:9px 10px;font-size:15px}
.entrada .bt.largo{width:100%;padding:10px 14px;font-size:15px;margin-top:4px}
.entrada .lk{color:var(--titulo);font-size:13px;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.entrada .lk.direita{align-self:flex-end;margin-top:4px}
.entrada .ou{display:flex;align-items:center;gap:10px;color:var(--suave);font-size:12px;margin:16px 0 12px}
.entrada .ou::before,.entrada .ou::after{content:"";flex:1;border-top:1px solid var(--linha)}
.entrada .rodape{text-align:center;margin-top:18px;font-size:13px;color:var(--suave)}
.entrada .dica{margin:2px 0 12px}
.entrada .aceite{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--texto);margin:4px 0 10px;line-height:1.4}
.entrada .aceite input{margin-top:2px}
.entrada .aceite a{color:var(--titulo)}
.erro-topo{background:var(--impbg);border:1px solid var(--imp);color:var(--imp);border-radius:8px;padding:8px 12px;margin-bottom:12px}
.selo{display:inline-block;border-radius:999px;padding:1px 9px;font-size:11.5px;font-weight:600;text-transform:none;letter-spacing:0;vertical-align:middle}
.selo.ok{background:var(--okbg);color:var(--ok)} .selo.nao{background:var(--impbg);color:var(--imp)} .selo.neutro{background:var(--fundo2);color:var(--suave)}

/* ---------- tela inicial ---------- */
.lista-proj{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:10px}
.proj{border:1px solid var(--linha);border-radius:10px;padding:12px 14px;background:var(--card);cursor:pointer}
.proj:hover{border-color:var(--titulo);box-shadow:0 2px 8px var(--sombra)}
.proj b{color:var(--titulo);display:block;margin-bottom:2px}
.proj small{color:var(--suave)}

/* ---------- cálculo, diagnóstico e resultado ---------- */
.cartao{border:1px solid var(--linha);border-radius:10px;padding:12px 14px;background:var(--card);margin-top:12px}
.duas > .cartao{margin-top:0}
.cartao.bom{border-color:var(--ok);box-shadow:inset 4px 0 0 var(--ok)}
.cartao .modelo{font-family:Consolas,"Cascadia Mono",monospace;font-size:13px;margin:6px 0}
.cartao .sub{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--suave);margin:10px 0 4px}
.valor{display:flex;flex-direction:column;gap:1px;background:var(--fundo2);border-radius:8px;padding:8px 12px;margin:6px 0}
.valor.consulta{opacity:.72}
.valor small{color:var(--suave)} .valor > b{font-size:20px;color:var(--titulo)} .valor span{font-size:12.5px;color:var(--suave)} .valor span b{color:var(--texto)}
.valor.grande > b{font-size:26px}
.graus{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}
.graus div{background:var(--okbg);border-radius:8px;padding:8px 12px;display:flex;flex-direction:column}
.graus div.ruim{background:var(--impbg)} .graus small,.graus span{font-size:12px;color:var(--suave)} .graus b{font-size:17px;color:var(--titulo)}
.recomenda{border:2px solid var(--titulo);border-radius:10px;padding:12px 14px;margin-top:14px;background:var(--card)}
.saida-item{border:1px solid var(--linha);border-left:4px solid var(--titulo);border-radius:6px;padding:8px 12px;margin-bottom:6px;font-size:13px;background:var(--card)}
.saida-item span{color:var(--suave)}
.equacao{font-family:Consolas,"Cascadia Mono",monospace;font-size:13px;background:var(--fundo2);border:1px solid var(--linha2);border-radius:8px;padding:9px 12px;margin:8px 0;overflow-x:auto;white-space:nowrap}
svg.graf{width:100%;height:auto;border:1px solid var(--linha2);border-radius:8px;background:var(--fundo2)}
svg.graf rect.area{fill:var(--card);stroke:var(--linha)} svg.graf line.guia{stroke:var(--linha2)} svg.graf line.zero,svg.graf line.diag{stroke:var(--titulo)}
svg.graf line.limite{stroke:var(--imp);stroke-dasharray:5 4} svg.graf circle{fill:var(--titulo);fill-opacity:.8} svg.graf circle.ruim{fill:var(--imp)}
svg.graf text{font-size:10px;fill:var(--suave)} svg.graf text.rot{font-size:9px;fill:var(--texto)} svg.graf text.eixo{font-size:11px;fill:var(--titulo)}
details summary{cursor:pointer;color:var(--titulo);font-weight:600;padding:6px 0}
p.trilha{margin:0 0 8px;text-align:justify;font-size:13px}
input.adotado{font-size:16px;font-weight:600}
.opcao-padrao{display:flex;align-items:center;gap:8px;padding:4px 0}
.fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin:8px 0}
.foto{border:1px solid var(--linha);border-radius:8px;padding:8px;background:var(--card)}
.foto img{width:100%;height:150px;object-fit:cover;border-radius:5px;background:var(--fundo2);display:block;margin-bottom:6px}
.foto input{width:100%;border:1px solid var(--linha);border-radius:6px;padding:5px 7px;font-size:13px}
.foto input.falta{border-color:var(--imp);background:var(--impbg)}
.foto.aberta{grid-column:1/-1}
.incluir-pg{display:flex;flex-direction:column;gap:2px;margin:6px 0 0;font-size:12.5px}
/* documentos: uma linha por documento */
.docs{display:flex;flex-direction:column;gap:12px;margin:8px 0}
.doc{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:14px 20px;border:1px solid var(--linha);border-radius:10px;padding:12px;background:var(--card)}
.doc-esq{display:flex;flex-direction:column;gap:4px;min-width:0}
.doc-esq select{border:1px solid var(--linha);border-radius:6px;padding:5px 7px}
.doc .incluir-pg input[data-inc-pg]{margin-left:22px;width:140px;border:1px solid var(--linha);border-radius:5px;padding:3px 6px;font-size:12.5px}
.doc .incluir-pg input[data-inc-pg].falta{border-color:var(--imp);background:var(--impbg)}
.doc-arq{margin-top:auto} .doc-arq .dica{flex:1;min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-dir{display:flex;flex-direction:column;gap:8px;min-width:0}
.doc-linha{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.doc-modo{font-size:12.5px;font-weight:600;color:var(--titulo);display:flex;align-items:center;gap:5px;min-width:220px}
.doc-linha>input,.doc-nav input{flex:1;min-width:160px;border:1px solid var(--linha);border-radius:6px;padding:5px 8px;font-size:13px}
.doc-nav input:disabled{background:var(--apagado);color:var(--apagado-texto)}
.doc-nav{display:flex;align-items:center;gap:4px;flex:1;min-width:220px}
.doc-nav button{border:1px solid var(--linha);background:var(--card);border-radius:6px;width:28px;height:28px;font-size:16px;cursor:pointer;color:var(--titulo)}
.doc-nav button:disabled{opacity:.35;cursor:default}
.doc-vista{display:flex;align-items:center;justify-content:center;background:var(--fundo2);border-radius:8px;padding:10px;min-height:250px;overflow:hidden}
.doc-principal{height:260px;max-width:60%;object-fit:contain;background:var(--card);box-shadow:0 3px 10px var(--sombra);position:relative;z-index:4}
/* as páginas vizinhas atrás da principal: cada uma aparece numa faixa de 28 px (até 3 de cada lado) */
.doc-pilha{display:flex;align-items:center}
.doc-pilha img{height:200px;width:130px;object-fit:cover;object-position:top;background:var(--card);box-shadow:0 2px 6px var(--sombra);opacity:.8;position:relative}
.doc-pilha.esq img{margin-right:-102px}
.doc-pilha.dir img{margin-left:-102px}
.doc-pilha.dir img:nth-child(1){z-index:3} .doc-pilha.dir img:nth-child(2){z-index:2} .doc-pilha.dir img:nth-child(3){z-index:1}
@media (max-width:860px){.doc{grid-template-columns:1fr}}
.incluir-pg label{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.foto .incluir-pg input[data-inc-pg]{width:110px;padding:2px 6px;font-size:12.5px}
.foto.aberta>img{width:230px}
.pg-docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:8px 0 2px}
.pg-doc{border:1px solid var(--linha2);border-radius:6px;padding:6px}
.pg-doc img{width:100%;height:150px;object-fit:contain;background:var(--fundo2);border-radius:4px;display:block;margin-bottom:4px}
.lnk{background:none;border:0;padding:0;color:var(--titulo);text-decoration:underline;cursor:pointer;font-size:13px}
.lnk:hover{color:var(--botao)}
.opcao-padrao a{color:var(--titulo);cursor:pointer;text-decoration:underline dotted}
pre.saida{font:12.5px/1.5 Consolas,"Cascadia Mono",monospace;white-space:pre-wrap;background:var(--fundo2);border:1px solid var(--linha2);border-radius:8px;padding:12px;margin:0}

/* ---------- diálogo ---------- */
dialog{border:1px solid var(--linha);border-radius:12px;padding:0;max-width:min(560px,94vw);background:var(--card);color:var(--texto)}
dialog::backdrop{background:rgba(10,14,22,.5)}
dialog .cab{padding:14px 18px 0} dialog .corpo{padding:10px 18px 4px} dialog .corpo.texto{white-space:pre-line}
.sub-dlg{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--suave);margin:10px 0 4px}
.lista-opcoes{display:flex;flex-wrap:wrap;gap:6px} dialog .pe{display:flex;gap:8px;justify-content:flex-end;padding:12px 18px 16px}

/* método fora do pacote da conta (versão web) */
.abas button.fechada,.abas .chave.fechada{opacity:.5}

/* histograma da simulação de Monte Carlo */
svg.graf rect.barra{fill:var(--titulo);fill-opacity:.5}

/* regra da casa (Renato, 12/10/2026): algarismos sempre alinhados, em qualquer fonte de identidade (o "1" de texto de algumas fontes parece um "I") */
*,*::before,*::after{font-variant-numeric:lining-nums}
table.t td.num,table.t input.n,.valor b,.adotado{font-variant-numeric:lining-nums tabular-nums}

/* salvar: botão e chave "salvar automaticamente" acima de Rascunhos; confirmação temporária em itálico */
.salvar-linha{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.abas button.salvar{border:1.5px solid var(--botao);color:var(--botao);font-weight:700;padding:5px 14px;font-size:13px}
.abas button.salvar:not(:disabled):hover{background:var(--botao);color:var(--sobre-botao)}
.chave{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--suave);cursor:pointer;user-select:none}
.chave input{position:absolute;opacity:0;width:0;height:0}
.chave span{width:30px;height:16px;border-radius:999px;background:var(--linha);position:relative;transition:background .15s;flex:none}
.chave span::after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--card);transition:left .15s}
.chave input:checked + span{background:var(--titulo)} .chave input:checked + span::after{left:16px}
.chave input:focus-visible + span{outline:2px solid var(--titulo);outline-offset:2px}
.aviso-salvo{font-size:12px;color:var(--ok);min-height:15px;display:block}
.opcao-linha{display:inline-flex;align-items:center;gap:6px;margin-right:18px;cursor:pointer}

/* chave do comparativo, ao lado do título do grupo (involutivo e renda) */
.rotulo-abas{display:flex;align-items:center;gap:14px}
.rotulo-abas .chave-grupo{font-weight:400;letter-spacing:0;font-size:11.5px;margin-left:auto}

/* textos padrão: quadro de acrescentar e tela de gerenciar */
dialog.dlg-tp{border:1px solid var(--linha);border-radius:12px;padding:18px 20px;background:var(--card);color:var(--texto);width:min(760px,94vw);max-height:86vh;overflow:auto}
dialog.dlg-tp::backdrop{background:var(--sombra)}
/* gerenciador de numeração de projetos */
dialog.dlg-num{width:min(980px,96vw);max-width:96vw}
.num-bloco{margin:12px 0;display:flex;flex-direction:column;gap:6px}
.num-exemplo{font-size:15px;font-weight:600;color:var(--titulo);font-variant-numeric:lining-nums tabular-nums}
/* formato do número: as peças numa caixa só (a sigla sendo formada), arrastáveis; campo de data em destaque (não é texto simples) */
.fmt-linha{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:6px 0}
.fmt-caixa{display:inline-flex;align-items:center;gap:4px;border:1.5px solid var(--titulo);border-radius:8px;padding:6px 8px;background:color-mix(in srgb,var(--titulo) 5%,var(--card));min-height:40px}
.fmt-peca{display:inline-flex;align-items:center;gap:4px;border-radius:5px;padding:3px 7px;font-size:12px;font-weight:700;letter-spacing:.05em;cursor:grab;user-select:none;white-space:nowrap}
.fmt-peca.fixa{border:1px solid var(--titulo);color:var(--titulo);background:var(--card)}
.fmt-peca.dt{background:var(--titulo);color:var(--card);padding-right:3px}
.fmt-peca.texto{padding:0}
.fmt-peca.arrastando{opacity:.45}
.fmt-peca select{border:1px solid var(--linha);border-radius:4px;font-size:11.5px;font-variant-numeric:lining-nums tabular-nums}
.fmt-peca input{width:6.5ch;border:1px solid var(--linha);border-radius:4px;padding:3px 4px;font-size:13px;text-align:center;overflow-x:auto}
/* o × de cada peça: um selo no canto de cima, fora do texto da sigla */
.fmt-peca{position:relative}
.fmt-peca .fmt-x{position:absolute;top:-9px;right:-8px;width:17px;height:17px;border-radius:50%;border:1px solid var(--linha);background:var(--card);color:var(--suave);
  font-size:12px;line-height:14px;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.fmt-peca .fmt-x:hover{color:var(--imp);border-color:var(--imp);background:var(--impbg)}
.fmt-caixa{padding-top:11px;padding-right:12px;gap:9px}
.fmt-mais{position:relative}
.fmt-menu{position:absolute;top:calc(100% + 4px);left:0;z-index:5;display:flex;flex-direction:column;min-width:260px;background:var(--card);border:1px solid var(--linha);border-radius:8px;box-shadow:0 6px 18px var(--sombra);padding:4px}
.fmt-menu.oculto{display:none}
.fmt-menu button{display:flex;gap:10px;align-items:baseline;text-align:left;border:0;background:none;padding:6px 8px;border-radius:5px;cursor:pointer;color:var(--texto)}
.fmt-menu button:hover{background:var(--fundo2)}
.fmt-menu b{min-width:62px;color:var(--titulo)} .fmt-menu small{color:var(--suave)}
.fmt-inicio{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--suave)}
.fmt-inicio input{width:8ch;border:1px solid var(--linha);border-radius:5px;padding:4px 6px;font-variant-numeric:lining-nums tabular-nums}
/* a regra geral dos quadros (campos com 100% de largura) não vale dentro do formato */
dialog.dlg-num .fmt-peca input:not([type]){width:6.5ch;flex:none}
dialog.dlg-num .fmt-inicio input:not([type]){width:8ch;flex:none}
dialog.dlg-num .fmt-caixa,dialog.dlg-num .fmt-peca{flex-wrap:nowrap;flex-shrink:0}
.fmt-inicio{white-space:nowrap}
.num-colunas{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:18px;margin-top:8px}
.num-prefixos{display:flex;flex-direction:column;gap:4px;margin:6px 0}
.num-prefixo{display:flex;align-items:center;gap:8px;border:1px solid var(--linha);border-radius:7px;padding:6px 8px;cursor:pointer}
.num-prefixo span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.num-prefixo.sel{border-color:var(--titulo);background:color-mix(in srgb,var(--titulo) 10%,var(--card))}
.num-prefixo small{color:var(--suave)}
.num-prefixo button,.num-lista button[data-num-x]{border:0;background:none;color:var(--suave);font-size:16px;cursor:pointer;padding:0 4px;border-radius:4px}
.num-prefixo button:hover,.num-lista button[data-num-x]:hover{color:var(--imp);background:var(--impbg)}
.num-novo{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.num-novo input{border:1px solid var(--linha);border-radius:6px;padding:5px 8px;font-size:13px;min-width:0;flex:1}
.num-novo #numSigla,.num-novo #numAno{flex:0 0 70px}
.num-lista{margin-top:6px} .num-lista td.acao{white-space:nowrap;display:flex;gap:10px;align-items:center;justify-content:flex-end}
.numero-projeto{display:flex;gap:22px;font-size:15px;margin:4px 0;font-variant-numeric:lining-nums tabular-nums}
.grade-numero{display:grid;grid-template-columns:1fr 1fr;gap:10px 28px;margin-top:8px}
.grade-numero select,.grade-numero input:not([type]){border:1px solid var(--linha);border-radius:6px;padding:6px 8px;font-size:13px}
.grade-numero input:not([type]){flex:1;min-width:0}
@media (max-width:760px){.grade-numero{grid-template-columns:1fr}}
@media (max-width:760px){.num-colunas{grid-template-columns:1fr}}
dialog.dlg-tp h3{margin:0 0 10px;color:var(--titulo)} dialog.dlg-tp textarea,dialog.dlg-tp input:not([type]){width:100%}
.abas-tp{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.abas-tp button{border:1.5px solid var(--linha);background:var(--card);color:var(--texto);border-radius:8px;padding:4px 12px;cursor:pointer;font-size:13px}
.abas-tp button.sel{border-color:var(--titulo);color:var(--titulo);font-weight:700}
.lista-tp{display:grid;gap:6px;max-height:48vh;overflow:auto;border:1px solid var(--linha2);border-radius:8px;padding:8px}
.item-tp{display:flex;gap:8px;align-items:flex-start;cursor:pointer;padding:4px 2px} .item-tp small{color:var(--suave)}