@font-face{font-family:'Bricolage Grotesque';src:url('bricolage-grotesque-latin.woff2') format('woff2');font-weight:300 800;font-display:swap}
@font-face{font-family:'Bricolage Grotesque';src:url('bricolage-grotesque-latin-ext.woff2') format('woff2');font-weight:300 800;font-display:swap;unicode-range:U+0100-02AF,U+1E00-1EFF}
:root{
  --petroleo:#123B47;--petroleo2:#0B2A33;--teal:#0FA895;--teal2:#0E8577;--aqua:#4FE3C1;--gelo:#E8F2F1;
  --tinta:#1E293B;--suave:#5B6B75;--linha:#DDE6E8;--fundo:#F4F7F8;--branco:#fff;
  --ok:#0E8577;--ok-f:#E3F6F1;--alerta:#8A6100;--alerta-f:#FFF4D6;--erro:#B42318;--erro-f:#FDECEA;--info:#1F4E8C;--info-f:#E8F0FB;--neutro-f:#EEF2F5;
  --raio:12px;--sombra:0 1px 2px rgba(16,34,42,.04),0 8px 24px -12px rgba(16,34,42,.12);
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:14px/1.55 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;color:var(--tinta);background:var(--fundo);-webkit-font-smoothing:antialiased}
a{color:var(--teal2);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3,.marca-nome{font-family:'Bricolage Grotesque',Inter,sans-serif;letter-spacing:-.015em;color:var(--petroleo)}
h1{font-size:26px;margin:0 0 4px}h2{font-size:18px;margin:0 0 12px}h3{font-size:15px;margin:18px 0 8px}
code{background:var(--fundo);border:1px solid var(--linha);border-radius:5px;padding:0 5px;font-size:12.5px}
.muted{color:var(--suave)}.mono{font-family:ui-monospace,Menlo,monospace;font-size:12px;word-break:break-all}

/* barra superior */
.topo{background:var(--petroleo);color:#fff;position:sticky;top:0;z-index:5}
.topo-in{max-width:1320px;margin:0 auto;padding:0 28px;height:60px;display:flex;align-items:center;gap:22px}
.marca{display:flex;align-items:center;gap:10px;color:#fff}.marca:hover{text-decoration:none}
.marca svg{width:30px;height:30px}.marca svg path,.marca svg circle:not(:last-child){stroke:#fff;fill:#fff}.marca svg path{fill:none}
.marca-nome{color:#fff;font-size:19px;font-weight:700}.marca-by{font-size:11.5px;opacity:.7;margin-left:2px}
.nav{display:flex;gap:4px;margin-left:12px}.nav a{color:#cfe1e4;padding:8px 12px;border-radius:8px;font-weight:500}
.nav a:hover{background:rgba(255,255,255,.08);color:#fff;text-decoration:none}.nav a.ativo{color:#fff;background:rgba(79,227,193,.14)}
.topo .dir{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:13px}
.empresa-chip{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:20px;padding:4px 12px;color:#e6f2f3}
.empresa-chip select{background:transparent;border:0;color:#fff;font:inherit;outline:0}.empresa-chip option{color:var(--tinta)}
.usuario{display:flex;align-items:center;gap:9px;color:#e6f2f3}.avatar{width:30px;height:30px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-weight:700;font-size:12px}
.linkbtn{background:none;border:0;color:#cfe1e4;cursor:pointer;font:inherit;padding:0}.linkbtn:hover{color:#fff;text-decoration:underline}
.faixa-local{background:#FFF4D6;color:#6B4D00;text-align:center;font-size:12.5px;padding:5px}

main{max-width:1320px;margin:0 auto;padding:28px 28px 70px}
.cab{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:22px;flex-wrap:wrap}
.cab .sub{color:var(--suave);margin:0}
.migalha{font-size:13px;color:var(--suave);margin-bottom:6px}.migalha a{color:var(--suave)}

.card{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:20px 22px;box-shadow:var(--sombra);margin-bottom:18px}
.card h2{display:flex;align-items:center;gap:8px}
.grade{display:grid;gap:18px}.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g-21{grid-template-columns:2fr 1fr}.g-12{grid-template-columns:1fr 1.15fr}
@media(max-width:980px){.g2,.g3,.g-21,.g-12{grid-template-columns:1fr}}

.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:18px}
.kpi{background:var(--branco);border:1px solid var(--linha);border-radius:var(--raio);padding:14px 16px;box-shadow:var(--sombra);position:relative;overflow:hidden}
.kpi b{display:block;font-family:'Bricolage Grotesque';font-size:28px;line-height:1.1;color:var(--petroleo);white-space:nowrap}
.kpi span{color:var(--suave);font-size:12.5px}.kpi.destaque{background:linear-gradient(135deg,var(--petroleo),#1B5563);border:0}
.kpi.destaque b,.kpi.destaque span{color:#fff}.kpi.destaque span{opacity:.8}
.kpi .barra{position:absolute;left:0;bottom:0;height:3px;background:var(--teal)}

.botao{display:inline-flex;align-items:center;gap:8px;background:var(--petroleo);color:#fff;border:0;border-radius:9px;padding:10px 18px;font:600 14px/1 Inter,sans-serif;cursor:pointer;text-decoration:none!important;white-space:nowrap}
.botao:hover{background:#0F4A59}.botao.teal{background:var(--teal)}.botao.teal:hover{background:var(--teal2)}
.botao.sec{background:#fff;color:var(--petroleo);border:1px solid var(--linha)}.botao.sec:hover{border-color:var(--petroleo)}
.botao.peq{padding:7px 12px;font-size:13px}.botoes{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

label{display:block;font-weight:600;margin:12px 0 5px;font-size:13.5px}.dica{color:var(--suave);font-size:12.5px;margin-top:4px}
input[type=text],input[type=email],input[type=password],select,textarea{width:100%;padding:10px 12px;border:1px solid var(--linha);border-radius:9px;font:inherit;background:#fff;color:var(--tinta)}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(15,168,149,.35);border-color:var(--teal)}
textarea{min-height:64px;resize:vertical}

.selo{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:20px;font-size:12px;font-weight:600;white-space:nowrap}
.s-ok{background:var(--ok-f);color:var(--ok)}.s-alerta{background:var(--alerta-f);color:var(--alerta)}.s-erro{background:var(--erro-f);color:var(--erro)}
.s-info{background:var(--info-f);color:var(--info)}.s-neutro{background:var(--neutro-f);color:var(--suave)}.s-marca{background:var(--gelo);color:var(--teal2)}
.g-bloqueia{background:var(--erro-f);color:var(--erro)}.g-corrigir{background:var(--alerta-f);color:var(--alerta)}.g-conferir{background:var(--info-f);color:var(--info)}.g-aguarda{background:var(--neutro-f);color:var(--suave)}

table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;color:var(--suave);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;border-bottom:1.5px solid var(--linha);padding:8px 10px;background:#fff;position:sticky;top:0}
td{border-bottom:1px solid #EDF2F3;padding:8px 10px;vertical-align:top}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}tr.bloco td{background:#F7FAFA}
tbody tr:hover td{background:#FAFCFC}
.rolagem{max-height:640px;overflow:auto;border:1px solid var(--linha);border-radius:10px}

.abas{display:flex;gap:2px;border-bottom:1px solid var(--linha);margin:-4px 0 18px;flex-wrap:wrap}
.abas a{color:var(--suave);padding:11px 14px;border-bottom:2px solid transparent;font-weight:600;font-size:13.5px}
.abas a:hover{color:var(--petroleo);text-decoration:none}.abas a.ativa{color:var(--petroleo);border-bottom-color:var(--teal)}
.abas .cont{display:inline-block;min-width:20px;text-align:center;background:var(--fundo);border-radius:10px;font-size:11.5px;padding:0 6px;margin-left:4px}

.aviso{padding:11px 14px;border-radius:10px;margin-bottom:16px;border:1px solid transparent}
.aviso.erro{background:var(--erro-f);color:var(--erro)}.aviso.ok{background:var(--ok-f);color:var(--ok)}.aviso.alerta{background:var(--alerta-f);color:#6B4D00;border-color:#F1DB9B}

/* pendências */
.pend{background:#fff;border:1px solid var(--linha);border-left:4px solid var(--suave);border-radius:10px;padding:14px 18px;margin-bottom:12px;box-shadow:var(--sombra)}
.pend.bloqueia{border-left-color:#C0392B}.pend.corrigir{border-left-color:#D99A06}.pend.conferir{border-left-color:#2E75B6}.pend.aguarda{border-left-color:#8A99A6}
.pend.justificada{opacity:.75}
.pend-cab{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.pend-cab b{font-size:15px;color:var(--petroleo)}.pend-cab .id{margin-left:auto;color:var(--suave);font-size:12px}
.pend .bloco-txt{margin-top:10px}.rot{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--teal2);margin-bottom:2px}
.pend .acao{background:var(--gelo);border-radius:8px;padding:10px 12px;margin-top:10px}
.ev{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}.ev div{background:var(--fundo);border:1px solid var(--linha);border-radius:8px;padding:5px 10px;font-size:12.5px}
.ev div span{color:var(--suave);margin-right:6px}
.pend .rodape{display:flex;gap:14px;flex-wrap:wrap;color:var(--suave);font-size:12.5px;border-top:1px dashed var(--linha);margin-top:12px;padding-top:9px}
details.justif summary{cursor:pointer;color:var(--teal2);font-weight:600;font-size:13px;margin-top:10px}
.filtros{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;align-items:center}
.filtros input[type=text]{flex:1 1 260px;width:auto}.filtros select{flex:0 1 220px;width:auto}.filtros a{padding:6px 12px;border-radius:20px;border:1px solid var(--linha);color:var(--suave);font-size:13px;background:#fff}
.filtros a.ativo{border-color:var(--petroleo);color:var(--petroleo);font-weight:600}

/* notas */
.nota-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}
.nota-card{background:#fff;border:1px solid var(--linha);border-radius:var(--raio);padding:16px;box-shadow:var(--sombra);color:var(--tinta);display:block}
.nota-card:hover{border-color:var(--teal);text-decoration:none}
.nota-card .num{font-family:'Bricolage Grotesque';font-size:20px;font-weight:700;color:var(--petroleo)}
.placar{display:flex;gap:4px;margin-top:10px}.placar i{height:8px;flex:1;border-radius:4px;background:var(--ok-f)}.placar i.x{background:#F3B7B0}.placar i.v{background:var(--teal)}.placar i.s{background:#E6EAED}
.conf-lista li{list-style:none;display:grid;grid-template-columns:22px 1fr 40%;gap:10px;padding:9px 0;border-bottom:1px solid #EDF2F3}
.conf-lista{padding:0;margin:0}.conf-lista .ic{font-size:16px;line-height:1.2}.ic.ok{color:var(--ok)}.ic.diverge{color:var(--erro)}.ic.sem_dado{color:#9AA7B1}
.conf-lista .fontes{font-size:12.5px;color:var(--suave);overflow-wrap:anywhere;min-width:0}.conf-lista .fontes b{color:var(--tinta);font-weight:600}
.pdf{width:100%;height:860px;border:1px solid var(--linha);border-radius:10px;background:#fff}
.kv{width:auto}.kv td{border:0;padding:3px 14px 3px 0}.kv td:first-child{color:var(--suave);white-space:nowrap}

/* progresso */
.progresso{height:10px;background:var(--gelo);border-radius:10px;overflow:hidden;margin:14px 0}
.progresso i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--aqua));transition:width .4s ease}
.etapas{list-style:none;padding:0;margin:14px 0 0}.etapas li{padding:6px 0;color:var(--suave);display:flex;gap:10px;align-items:center}
.etapas li.feita{color:var(--ok)}.etapas li.atual{color:var(--petroleo);font-weight:600}
.etapas li:before{content:'';width:14px;height:14px;border-radius:50%;border:2px solid #C9D3D7}
.etapas li.feita:before{background:var(--teal);border-color:var(--teal)}.etapas li.atual:before{border-color:var(--teal);border-top-color:transparent;animation:giro 1s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}

/* upload */
.zona{border:2px dashed #C9D6DA;border-radius:12px;padding:26px;text-align:center;background:#FAFCFC;cursor:pointer;transition:.15s}
.zona:hover,.zona.sobre{border-color:var(--teal);background:var(--gelo)}.zona b{color:var(--petroleo)}
.escolha{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px}
.escolha label{margin:0;border:1px solid var(--linha);border-radius:10px;padding:12px 14px;cursor:pointer;font-weight:500;background:#fff}
.escolha label:has(input:checked){border-color:var(--teal);background:var(--gelo);box-shadow:0 0 0 1px var(--teal)}
.escolha input{margin-right:8px;accent-color:var(--teal)}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:500;margin-top:14px}.check input{margin-top:4px;accent-color:var(--teal)}

/* entrar (padrão TenantAuthSplit do portfólio) */
.split{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}
@media(max-width:860px){.split{grid-template-columns:1fr}.split .marca-painel{min-height:240px}}
.marca-painel{background-color:var(--petroleo);background-image:radial-gradient(120% 90% at 8% 4%,#1B5563 0%,transparent 58%),linear-gradient(152deg,#123B47 0%,#0E2F39 42%,#08202A 100%);
  color:#fff;padding:48px 44px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.marca-painel:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:46px 46px;mask-image:radial-gradient(85% 75% at 26% 30%,#000 0%,transparent 78%);-webkit-mask-image:radial-gradient(85% 75% at 26% 30%,#000 0%,transparent 78%)}
.marca-painel .centro{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:22px;position:relative;z-index:1}
.marca-painel .simbolo svg{width:128px;height:128px}.marca-painel .simbolo svg path{stroke:#fff}.marca-painel .simbolo svg circle{fill:#fff}.marca-painel .simbolo svg circle:last-child{fill:var(--aqua)}
.marca-painel h1{color:#fff;font-size:44px;margin:0}.marca-painel .tag{color:rgba(255,255,255,.86);max-width:36ch;font-size:16px;line-height:1.5;margin:0}
.marca-painel .assinatura{position:relative;z-index:1;text-align:center;font-size:12px;color:rgba(255,255,255,.74)}
.marca-painel .assinatura b{color:#fff}.marca-painel .assinatura a{color:inherit}
.form-painel{display:flex;align-items:center;justify-content:center;padding:48px 28px}
.form-in{width:100%;max-width:380px}.form-in .eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:11.5px;font-weight:700;color:var(--teal2);margin:0 0 6px}
.form-in h2{font-size:28px;margin:0 0 6px}.form-in .botao{width:100%;justify-content:center;padding:13px;margin-top:20px;font-size:15px}
.form-in .pe{margin-top:22px;font-size:12.5px;color:var(--suave);border-top:1px solid var(--linha);padding-top:14px}

/* ---- acessibilidade ---- */
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.pular{position:absolute;left:-999px;top:8px;z-index:20;background:#fff;color:var(--petroleo);padding:8px 14px;border-radius:8px;font-weight:600}
.pular:focus{left:12px}
:focus-visible{outline:3px solid var(--aqua);outline-offset:2px;border-radius:4px}
abbr.termo{text-decoration:underline dotted var(--teal);text-underline-offset:3px;cursor:help}

/* ---- componentes novos ---- */
.paginacao{display:flex;gap:16px;align-items:center;justify-content:center;margin:16px 0;color:var(--suave);font-size:13.5px}
.paginacao a{border:1px solid var(--linha);background:#fff;border-radius:8px;padding:6px 12px}
details.guia summary{cursor:pointer;color:var(--petroleo)}details.guia ol{margin:10px 0 8px;padding-left:20px}details.guia li{margin:4px 0}
.pend-tit{font-size:15px;margin:0;color:var(--petroleo)}
.form-pend{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;margin-top:6px}.form-pend .largo{grid-column:1/-1}
.form-pend label{margin-top:6px}
.decisao .dec-cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.dec-cod{background:var(--petroleo);color:#fff;border-radius:8px;padding:3px 9px;font-weight:700;font-size:13px}
fieldset.opcoes{border:0;padding:0;margin:0;display:grid;gap:8px}
.opcao{display:flex;gap:10px;align-items:flex-start;font-weight:500;margin:0;border:1px solid var(--linha);border-radius:10px;padding:10px 12px;cursor:pointer}
.opcao:has(input:checked){border-color:var(--teal);background:var(--gelo)}.opcao input{margin-top:3px;accent-color:var(--teal)}
.linha{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
dl.glossario dt{font-weight:700;color:var(--petroleo);margin-top:12px}dl.glossario dd{margin:2px 0 0;color:var(--tinta)}
.delta-pos{color:var(--ok)}.delta-neg{color:var(--erro)}
h2 .cont{display:inline-block;min-width:22px;text-align:center;background:var(--fundo);border-radius:10px;font-size:12px;padding:1px 7px;margin-left:6px;color:var(--suave)}
.rolagem-x{overflow-x:auto}
.menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:8px;font-size:18px;padding:4px 10px;cursor:pointer}

/* ---- celular e tablet ---- */
@media (max-width: 900px){
  .topo-in{height:auto;min-height:56px;flex-wrap:wrap;padding:8px 16px;gap:10px}
  .menu-btn{display:block;order:3;margin-left:auto}
  .marca{order:1}.topo .dir{order:2;margin-left:0;font-size:12px}
  .nav{order:4;display:none;width:100%;flex-direction:column;margin:0 0 8px}.nav.aberta{display:flex}
  .usuario span:not(.avatar){display:none}
  main{padding:18px 16px 60px}
  h1{font-size:21px}.cab{align-items:flex-start}
  .kpis{grid-template-columns:repeat(2,1fr)}.kpi b{font-size:22px}
  .abas{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap}
  .card{padding:16px}
  .form-pend{grid-template-columns:1fr}
  .conf-lista li{grid-template-columns:22px 1fr}.conf-lista .fontes{grid-column:2}
  .pdf{height:520px}
  table{font-size:12.5px}td,th{padding:6px 7px}
  .rolagem{max-height:none}
  .paginacao{flex-wrap:wrap}
}
@media (max-width: 560px){ .kpis{grid-template-columns:1fr 1fr}.empresa-chip{display:none}.filtros input[type=text],.filtros select{flex:1 1 100%} }

.placar-notas{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.placar-notas a{border:1px solid var(--linha);background:#fff;border-radius:10px;padding:8px 14px;color:var(--tinta)}
.placar-notas a b{font-family:'Bricolage Grotesque';font-size:18px;margin-right:4px;color:var(--petroleo)}
.placar-notas a.div b{color:var(--erro)}.placar-notas a.ok b{color:var(--ok)}
.placar-notas a.ativo{border-color:var(--petroleo);box-shadow:0 0 0 1px var(--petroleo)}
.barra-notas{flex:1 1 160px;height:8px;background:#F3B7B0;border-radius:6px;overflow:hidden}.barra-notas i{display:block;height:100%;background:var(--teal)}