/* Tema André Hummel para o Raio-X da Reforma.
   Fonte: "AndréHummel® – ID Visual" (outubro de 2025). Paleta do manual: Azul Petróleo #0D2335,
   Azul Ártico #88A1B5 e Branco Gelo #EFEFEF. Tipografia do manual: Helvetica Neue (Roman e Medium);
   fonte comercial, por isso entra pela pilha do sistema, com Inter de reserva.
   Logotipo: versão branca "André Hummel Consultoria Técnica", sobre a barra petróleo.
   Carregado depois de laudo.css: só sobrescreve. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root, :root[data-theme="light"], :root:not([data-theme="light"]) {
  --paper: #EFEFEF; --sheet: #FFFFFF; --ink: #0D2335; --muted: #566B7D; --line: #D3DBE2;
  --accent: #0D2335; --accent-soft: #E7EDF2; --lock: #E7EDF2;
  --artico: #88A1B5; --petroleo-2: #17344D;
  --f-display: "Helvetica Neue", Helvetica, "Inter", Arial, sans-serif;
  --f-body: "Helvetica Neue", Helvetica, "Inter", Arial, sans-serif;
  color-scheme: light;
}
h1, h2, h3 { font-stretch: 100%; letter-spacing: -0.01em; }
h2 { font-weight: 500; }
h3 { font-weight: 500; }
.cover h1 { font-weight: 500; font-stretch: 100%; line-height: 1.02; letter-spacing: -0.02em; }

/* barra superior: petróleo com o logotipo branco, como o timbrado e o site do manual */
.topbar { background: var(--ink); color: #fff; }
.brand { display: inline-flex; align-items: center; gap: 16px; font-stretch: 100%; letter-spacing: 0; font-weight: 500; text-transform: none; font-size: 1rem; }
.brand img { height: 44px; display: block; padding-right: 16px; border-right: 1px solid rgba(255, 255, 255, 0.3); }
.topbar .meta { opacity: 0.8; }
.devbtn { color: #fff; }
.devbtn[aria-pressed="true"] { background: var(--artico); border-color: var(--artico); color: var(--ink); }

.sec { border-radius: 14px; }
.sec-n { border-top-color: var(--artico); }
.stamp .score, .stamp .lvl { font-stretch: 100%; font-weight: 500; }
.tile { border-radius: 10px; }
.tile .v { font-stretch: 100%; font-weight: 500; }
.actions li::before { font-weight: 500; border-radius: 6px; }
.bar.base { fill: var(--artico); }
.col-h { font-stretch: 100%; font-weight: 500; }
.phase, .path, .doc, .imp, .locked-list li { border-radius: 10px; }
.tab[aria-selected="true"] { border-bottom-color: var(--artico); }
.path .val { font-stretch: 100%; font-weight: 500; }

/* dinheiro na mesa: bloco petróleo com os destaques em ártico */
.sec.mesa { background: linear-gradient(135deg, var(--ink) 0%, var(--petroleo-2) 100%); color: #fff; border-color: var(--ink); }
.sec.mesa .sec-n, .mesa-k, .ext-row.total .v { color: var(--artico); }
.mesa-v { font-stretch: 100%; font-weight: 500; letter-spacing: -0.03em; }

/* chamada final: botão em pílula, como no site do manual */
.cta { border-width: 1px; border-radius: 14px; }
.cta h3 { font-stretch: 100%; font-weight: 500; }
.cta-anchor b { font-stretch: 100%; font-weight: 500; }
.btn { border-radius: 999px; padding-inline: 16px; }
.btn.accent { font-stretch: 100%; text-transform: none; letter-spacing: 0; font-weight: 500; border-radius: 999px; padding: 14px 28px; }
.btn.accent:hover { opacity: 1; background: var(--petroleo-2); }

/* rodapé com a linha institucional */
footer .marca-rodape { font-weight: 500; color: var(--ink); }
footer .marca-rodape a { color: var(--ink); text-decoration: none; }

/* formulário público */
.campo input, .campo select { border-radius: 10px; }
.campo input:focus, .campo select:focus { outline: 2px solid var(--artico); outline-offset: 1px; border-color: var(--ink); }
.check input, .aceite input { accent-color: var(--ink); }
