/* Tema: escuro por omissão ("sala de operações"); claro quando escolhido (data-theme="light"). */
:root {
  color-scheme: dark;
  --fundo: #0d1317; --cartao: #141c22; --cartao-2: #1a242b; --texto: #e3eaee; --suave: #8c9ba6; --linha: #26333c;
  --acento: #3fb7a6; --sobre-acento: #0b1a18; --acento-fraco: rgba(63, 183, 166, .14);
  --ativo: #5cb87a; --passivo: #e5645a; --erro: #e5645a; --aviso-cor: #d7a444;
  --letra: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --letra-titulo: "IBM Plex Sans Condensed", "IBM Plex Sans", "Arial Narrow", system-ui, sans-serif;
  --letra-dados: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
}
:root[data-theme="light"] {
  color-scheme: light;
  --fundo: #f3f6f7; --cartao: #ffffff; --cartao-2: #eef2f4; --texto: #15212a; --suave: #52616c; --linha: #d8e0e4;
  --acento: #16857a; --sobre-acento: #ffffff; --acento-fraco: rgba(22, 133, 122, .10);
  --ativo: #2f8a4f; --passivo: #c2412f; --erro: #c2412f; --aviso-cor: #a8740c;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fundo); color: var(--texto); font: 15px/1.5 var(--letra); }
h1, h2, h3, .marca { font-family: var(--letra-titulo); letter-spacing: .01em; text-wrap: balance; }
.num, .kpi-valor { font-family: var(--letra-dados); font-variant-numeric: tabular-nums; }
:focus-visible { outline: 2px solid var(--acento); outline-offset: 2px; }
a { color: var(--acento); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.6rem; margin: 0 0 1rem; }
h2 { font-size: 1.05rem; margin: 0 0 .75rem; }
h2.espaco { margin-top: 1.5rem; }
h3 { font-size: .95rem; margin: 1rem 0 .25rem; }
h3 small { color: var(--suave); font-weight: normal; }
main { max-width: 1200px; margin: 0 auto; padding: 1.5rem 16px 3rem; }

.topo { display: flex; align-items: center; gap: 1.5rem; padding: .75rem 16px; background: var(--cartao); border-bottom: 1px solid var(--linha); flex-wrap: wrap; }
.marca { font-weight: 700; font-size: 1.1rem; color: var(--texto); }
.topo nav { display: flex; gap: 1rem; flex: 1; }
.topo nav a { color: var(--suave); }
.topo nav a.ativo { color: var(--texto); font-weight: 600; }
.sair button { background: none; border: 0; color: var(--suave); cursor: pointer; font: inherit; }

.cartao { background: var(--cartao); border: 1px solid var(--linha); border-radius: 8px; padding: 1rem 1.25rem; }
.grelha { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 1rem; margin-bottom: 1rem; }
.kpi { display: flex; flex-direction: column; }
.kpi-valor { font-size: 2rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.kpi-rotulo { color: var(--suave); }

.tabela-wrap { overflow-x: auto; background: var(--cartao); border: 1px solid var(--linha); border-radius: 8px; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .55rem .75rem; border-bottom: 1px solid var(--linha); vertical-align: top; }
th { font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--suave); }
tbody tr:last-child td { border-bottom: 0; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.nowrap { white-space: nowrap; }
.contra { color: var(--suave); font-size: .85em; margin: 0 .25rem; }
.vazio, .meta { color: var(--suave); }

.filtros { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: 1rem; }
input, select, button { font: inherit; padding: .4rem .6rem; border: 1px solid var(--linha); border-radius: 6px; background: var(--cartao); color: var(--texto); }
.filtros input[type=search] { min-width: 220px; flex: 1; }
.filtros select { max-width: 260px; }
button[type=submit] { background: var(--acento); border-color: var(--acento); color: var(--sobre-acento); cursor: pointer; }
.paginacao { display: flex; gap: 1rem; justify-content: center; margin-top: 1rem; }

dl { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1rem; margin: 0; }
dt { color: var(--suave); }
dd { margin: 0; }
ul { padding-left: 1.1rem; margin: .25rem 0; }
.partes, .barras, .execucoes { list-style: none; padding: 0; }
.partes li, .barras li, .execucoes li { padding: .3rem 0; border-bottom: 1px solid var(--linha); }
.partes li:last-child, .barras li:last-child, .execucoes li:last-child { border-bottom: 0; }
.barras li { display: flex; justify-content: space-between; gap: 1rem; }
.papel { font-size: .8rem; font-weight: 600; margin-right: .35rem; }
.lado-ativo { color: var(--ativo); }
.lado-passivo { color: var(--passivo); }
.lado-outro { color: var(--suave); }
.etiqueta { display: inline-block; padding: .1rem .5rem; border-radius: 999px; background: var(--acento); color: var(--sobre-acento); font-size: .8rem; margin-right: .35rem; }
.estado { font-size: .8rem; font-weight: 600; }
.estado-sucesso { color: var(--ativo); }
.estado-erro { color: var(--erro); }
.estado-a_correr { color: var(--suave); }
.aviso { background: var(--cartao); border-left: 3px solid var(--acento); padding: .5rem .75rem; margin-bottom: 1rem; }
.erro { color: var(--erro); }

.entrar { max-width: 360px; margin: 4rem auto; }
.entrar form { display: flex; flex-direction: column; gap: .75rem; }
.entrar label { display: flex; flex-direction: column; gap: .25rem; color: var(--suave); }

.marca-agua { position: fixed; right: 14px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--suave); opacity: .6; pointer-events: none; z-index: 10; }
.anon { color: var(--suave); font-style: italic; }
.selo-consultar { display: inline-block; padding: .05rem .5rem; border-radius: 999px; background: var(--acento); color: var(--sobre-acento); font-size: .78rem; font-weight: 600; }
.selo-consultar:hover { text-decoration: none; filter: brightness(1.1); }
.consulta.sim { border-left: 3px solid var(--acento); }
.consulta h2 { display: flex; gap: .75rem; align-items: baseline; flex-wrap: wrap; }
.consulta .pontos { font-size: .85rem; color: var(--suave); font-weight: normal; }
.consulta ul { margin: .25rem 0 .5rem; }

[hidden] { display: none !important; }

/* Sino no topo */
.sino { position: relative; display: inline-flex; align-items: center; }
.sino b { position: absolute; top: -.35rem; right: -.55rem; min-width: 1.05rem; height: 1.05rem; padding: 0 .25rem; border-radius: 999px; background: var(--erro); color: #fff;
  font-size: .62rem; font-weight: 600; display: grid; place-items: center; font-family: var(--letra-dados); }