:root { --fundo:#faf7f5; --tinta:#2a2226; --suave:#6d6168; --linha:#e6dde0; --marca:#8a3b5c; --marca2:#6e2c48;
        --ok:#1f7a4d; --ambar:#a8650a; --verm:#b3261e; --card:#fff; }
@media (prefers-color-scheme: dark) { :root { --fundo:#1b1618; --tinta:#f1e9ec; --suave:#a99ca2; --linha:#3a2f34; --card:#251e21; --marca:#d98aae; --marca2:#e8a9c6; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--fundo); color:var(--tinta); font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
.topo { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid var(--linha); background:var(--card); }
.marca { font-weight:700; color:var(--marca); text-decoration:none; } .marca small { color:var(--suave); font-weight:400; }
main { max-width:920px; margin:0 auto; padding:16px; }
h1 { font-size:1.5rem; margin:.4rem 0 1rem; } h2 { font-size:1.15rem; margin-top:2rem; } h3 { margin:.3rem 0; font-size:1rem; word-break:break-all; }
a { color:var(--marca); }
.cartao { background:var(--card); border:1px solid var(--linha); border-radius:12px; padding:16px; margin-bottom:16px; }
.estreito { max-width:380px; margin:10vh auto 0; display:grid; gap:12px; }
label { display:grid; gap:4px; font-weight:600; }
input, select { font:inherit; padding:10px; border:1px solid var(--linha); border-radius:8px; background:var(--fundo); color:var(--tinta); width:100%; }
button { font:inherit; padding:10px 16px; border-radius:8px; border:1px solid var(--linha); background:var(--card); color:var(--tinta); cursor:pointer; min-height:44px; }
button.primario { background:var(--marca); color:#fff; border-color:var(--marca); font-weight:600; }
button.primario:hover:not(:disabled) { background:var(--marca2); } button:disabled { opacity:.5; cursor:not-allowed; }
button.perigo { color:var(--verm); border-color:var(--verm); } button.link { border:0; background:none; color:var(--suave); min-height:0; padding:4px; }
.zonas { display:grid; gap:12px; margin:14px 0; } @media (min-width:700px) { .zonas { grid-template-columns:1fr 1fr; } }
.zona { border:2px dashed var(--linha); border-radius:12px; padding:14px; font-weight:400; } .zona strong { font-size:1.05rem; } .zona span { color:var(--suave); font-size:.9rem; }
.zona.a { border-color:var(--marca); }
.dica { color:var(--suave); font-size:.9rem; }
.aviso { background:#fff4e0; color:#6b4300; border-left:4px solid var(--ambar); padding:8px 12px; border-radius:6px; margin:8px 0; font-size:.92rem; }
@media (prefers-color-scheme: dark) { .aviso { background:#3a2c14; color:#f3d9a8; } }
.aviso.erro { background:#fde7e5; color:#7a1710; border-color:var(--verm); }
@media (prefers-color-scheme: dark) { .aviso.erro { background:#3d1a18; color:#f6c7c3; } }
.lista { list-style:none; padding:0; display:grid; gap:8px; } .lista li { display:flex; justify-content:space-between; gap:8px; padding:10px 12px; background:var(--card); border:1px solid var(--linha); border-radius:8px; }
.etq { font-size:.78rem; padding:2px 8px; border-radius:99px; background:var(--linha); font-weight:600; }
.etq.pronto { background:#d7f0e2; color:#155c39; } .etq.erro { background:#fbd5d1; color:#7a1710; }
.arq header { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; } .arq header h3 { flex-basis:100%; }
.zona-tag { font-size:.78rem; color:var(--suave); }
table.resumo { width:100%; border-collapse:collapse; margin:8px 0; font-size:.93rem; }
table.resumo th { text-align:left; font-weight:500; color:var(--suave); padding:5px 10px 5px 0; vertical-align:top; width:42%; }
table.resumo td { padding:5px 0; font-variant-numeric:tabular-nums; } table.resumo tr+tr { border-top:1px solid var(--linha); }
.acoes { display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; }
form.inline { display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:.92rem; }
details.ocr { margin-top:10px; } .rev { border-top:1px solid var(--linha); padding:8px 0; } .rev code { font-size:.8rem; word-break:break-word; display:block; }
.rev img { max-width:100%; border:1px solid var(--linha); margin-top:6px; }
progress { width:100%; height:14px; accent-color:var(--marca); }

/* ---- conciliação ---- */
.topo a:not(.marca){margin-left:auto;margin-right:12px;color:var(--suave)}
.cab-conc{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px}
.botao{display:inline-block;padding:8px 14px;border:1px solid var(--marca);border-radius:8px;text-decoration:none;font-weight:600}
.abas{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 16px}
.abas a{padding:7px 12px;border-radius:99px;border:1px solid var(--linha);text-decoration:none;color:var(--tinta);background:var(--card);font-size:.92rem}
.abas a b{margin-left:4px;font-variant-numeric:tabular-nums}
.abas a.ativa{background:var(--marca);color:#fff;border-color:var(--marca)}
.abas a.sev-ok{border-left:4px solid var(--ok)}.abas a.sev-warn{border-left:4px solid var(--ambar)}.abas a.sev-crit{border-left:4px solid var(--verm)}.abas a.sev-info{border-left:4px solid #4a5d7a}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:12px 0}
.card{background:var(--card);border:1px solid var(--linha);border-radius:12px;padding:12px 14px;display:grid;gap:2px}
.card small{color:var(--suave)}.card b{font-size:1.35rem;font-variant-numeric:tabular-nums}.card span{font-size:.8rem;color:var(--suave)}
.card.ok{border-left:5px solid var(--ok)}.card.crit{border-left:5px solid var(--verm)}.card.info{border-left:5px solid #4a5d7a}
.rolagem{overflow-x:auto;border:1px solid var(--linha);border-radius:10px;background:var(--card)}
table.grade{border-collapse:collapse;width:100%;font-size:.88rem;font-variant-numeric:tabular-nums}
table.grade th{position:sticky;top:0;background:var(--card);text-align:left;padding:8px;border-bottom:2px solid var(--linha);white-space:nowrap}
table.grade th a{color:var(--tinta);text-decoration:none}
table.grade td{padding:6px 8px;border-bottom:1px solid var(--linha);vertical-align:top}
td.num{text-align:right;white-space:nowrap}
table.grade.sev-ok tr.clicavel{background:color-mix(in srgb,var(--ok) 8%,transparent)}
table.grade.sev-warn tr.clicavel{background:color-mix(in srgb,var(--ambar) 12%,transparent)}
table.grade.sev-crit tr.clicavel{background:color-mix(in srgb,var(--verm) 10%,transparent)}
table.grade.sev-info tr.clicavel{background:color-mix(in srgb,#4a5d7a 12%,transparent)}
tr.clicavel{cursor:pointer}tr.clicavel:hover{filter:brightness(.95)}
td.ok{color:var(--ok)}td.warn{color:var(--ambar)}td.crit{color:var(--verm)}
.nv{padding:1px 8px;border-radius:99px;font-size:.75rem;font-weight:600;background:var(--linha)}
.nv-Alta{background:#d7f0e2;color:#155c39}.nv-Média{background:#fff1d6;color:#7a4a00}.nv-Baixa{background:#fbd5d1;color:#7a1710}
.filtros{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px}.filtros input,.filtros select{width:auto;min-width:0}
.aviso.info{background:#e6ecf5;color:#243650;border-color:#4a5d7a}
@media (prefers-color-scheme: dark){.aviso.info{background:#1f2a3a;color:#c6d4ea}}
dialog{border:1px solid var(--linha);border-radius:14px;max-width:min(920px,96vw);width:100%;background:var(--card);color:var(--tinta);padding:16px}
dialog::backdrop{background:rgba(0,0,0,.45)}.fechar{float:right;min-height:0;padding:4px 10px}
.lados{display:grid;gap:12px;grid-template-columns:1fr}@media(min-width:700px){.lados{grid-template-columns:1fr 1fr}}
.lado{border:1px solid var(--linha);border-radius:10px;padding:8px 12px;margin-bottom:8px}.lado h4{margin:.2rem 0}
.acoes-det{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;align-items:center}
table.pequena{font-size:.82rem}.paginas{text-align:center}

table.grade td{white-space:nowrap;max-width:280px;overflow:hidden;text-overflow:ellipsis}
.filtros input[type=search]{min-width:230px;flex:1 1 230px}.filtros input[name=vmin],.filtros input[name=vmax]{width:110px}

.abas a.sev-vch{border-left:4px solid #7a4fa3}.card.vch{border-left:5px solid #7a4fa3}.abas.sub{margin-top:-6px}.abas.sub a{font-size:.85rem;padding:5px 10px}
td.longo{white-space:normal!important;min-width:420px;max-width:640px;font-size:.84rem}
.abas a.sev-ctn{border-left:4px solid #1a7f8e}
.aprofundar{border-left:5px solid var(--ambar)}.aprofundar h2{margin-top:0}

td.acao{white-space:normal!important;min-width:230px;max-width:260px}td.acao form{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}td.acao input{width:100%;padding:4px 6px;font-size:.8rem}td.acao button{min-height:0;padding:4px 8px;font-size:.78rem}
tr.conferida{opacity:.6}label.chk{display:inline-flex;gap:6px;align-items:center;font-weight:500}label.chk input{width:auto}
.aprofundar h3{margin:1rem 0 .4rem;font-size:1rem}.aprofundar p.destaque{border-left:4px solid var(--ambar);padding-left:10px;margin:10px 0}
.abas a.sev-din{border-left:4px solid #2e7d32}.abas a.sev-tax{border-left:4px solid #6d4c41}.abas a.sev-neg{border-left:4px solid #c62828}.abas a.sev-dup{border-left:4px solid #ef6c00}.abas a.sev-ile{border-left:4px solid #5d4037}

.topo a.sec{margin-left:0}
form.config fieldset{margin:0 0 14px;padding:12px 16px}form.config legend{font-weight:700;padding:0 6px;color:var(--marca)}
.campo{display:grid;gap:2px;margin:10px 0}.campo label{display:flex;justify-content:space-between;gap:10px;align-items:center;font-weight:600}
.campo label input[type=checkbox]{width:auto}.campo label input:not([type=checkbox]){max-width:210px}.campo small{color:var(--suave)}.campo .padrao{white-space:nowrap}
.campo.erro input{border-color:var(--verm)}.msg-erro{color:var(--verm)!important;font-weight:600}

/* ajuda, mapeador e telas pequenas */
dl.ajuda{margin:8px 0}dl.ajuda dt{font-weight:700;margin-top:12px}dl.ajuda dd{margin:2px 0 0;color:var(--tinta)}
.etq-sev{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;background:var(--linha)}
.etq-sev.ok{background:var(--ok)}.etq-sev.warn{background:var(--ambar)}.etq-sev.crit{background:var(--verm)}.etq-sev.info{background:#4a5d7a}
.tabela-rolavel{overflow-x:auto;border:1px solid var(--linha);border-radius:10px;background:var(--card);margin:10px 0}
table.amostra{border-collapse:collapse;font-size:.85rem;width:100%}table.amostra th,table.amostra td{padding:4px 8px;border-bottom:1px solid var(--linha);text-align:left;white-space:nowrap}
.dica-aba{margin:6px 0 10px}
.topo{flex-wrap:wrap;gap:6px 14px}.topo form{margin:0}
fieldset{min-width:0;max-width:100%}.cartao p{overflow-wrap:anywhere}
@media (max-width:600px){
  main{padding:12px}
  h1{font-size:1.3rem}
  .topo{padding:8px 12px}
  .filtros input,.filtros select{flex:1 1 140px}
  .filtros input[type=search]{flex-basis:100%}
  .campo label{flex-direction:column;align-items:stretch}.campo label input:not([type=checkbox]),.campo label select{max-width:none}
  .acoes{flex-direction:column;align-items:stretch}
  dialog{padding:10px}
}
