/* Vitrine (versão neutra) do Sistema de Clientes: cores e fonte da Boito por cima das cores do app (seletor html:root, que ganha
   do :root do app mesmo carregando antes). Contrastes sobre branco: texto #1F1C18 15,9:1 · #4F4A42 8,6:1 · #655F56 6,2:1 ·
   dourado escuro #7F5F1C 5,9:1 · sobre o menu escuro #1F1C18: #F6F2EA 15,1:1 · #C9C2B4 9,6:1. */
@font-face { font-family: "Plus Jakarta Sans"; src: url(/marca/fonte-boito.woff2) format("woff2"); font-weight: 200 800; font-display: swap; }
html:root, html:root[data-theme="light"] {
  --bg: #F4F2EE; --surface: #FFFFFF; --surface-2: #F1EDE6; --ink: #1F1C18; --ink-2: #4F4A42; --muted: #655F56; --line: #E2DCD1;
  --brand: #7F5F1C; --brand-soft: #F3ECDD; --on-brand: #FFFFFF; --side: #1F1C18; --side-ink: #F6F2EA; --side-mut: #C9C2B4; --side-act: #3A332A;
  --nutri: #7F5F1C; --masso: #4F6B5A; --recov: #6E6553; --plano: #A88A4F; --neutral: #9C9384;
  --c1: #7F5F1C; --c2: #4F6B5A; --c3: #A88A4F; --c4: #3D3A35; --c5: #8C6E3A; --c6: #6E6553;
  --dof-d: #4F6B5A; --dof-o: #7F5F1C; --dof-f: #6E6553;
  --info-bg: #F3ECDD; --info-ink: #5E4614; --heat0: #F7F3EA; --heat1: #6A4F17;
  --f-display: "Plus Jakarta Sans", system-ui, sans-serif; --f-body: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
}
html:root[data-theme="dark"] {
  --bg: #100E0B; --surface: #1A1713; --surface-2: #221E19; --ink: #F6F2EA; --ink-2: #C9C2B4; --muted: #A39B8C; --line: #3A342C;
  --brand: #C19A4B; --brand-soft: #2A2318; --on-brand: #231C0E; --side: #0B0A08; --side-ink: #F6F2EA; --side-mut: #A39B8C; --side-act: #2B2620;
  --nutri: #C19A4B; --masso: #8FB09C; --recov: #A39B8C; --plano: #E2BF73; --neutral: #6E6553;
  --c1: #C19A4B; --c2: #8FB09C; --c3: #E2BF73; --c4: #C9C2B4; --c5: #B08A4A; --c6: #A39B8C;
  --info-bg: #2A2318; --info-ink: #E2BF73; --heat0: #1E1A15; --heat1: #E2BF73;
}
@media (prefers-color-scheme: dark) { html:root:not([data-theme="light"]) {
  --bg: #100E0B; --surface: #1A1713; --surface-2: #221E19; --ink: #F6F2EA; --ink-2: #C9C2B4; --muted: #A39B8C; --line: #3A342C;
  --brand: #C19A4B; --brand-soft: #2A2318; --on-brand: #231C0E; --side: #0B0A08; --side-ink: #F6F2EA; --side-mut: #A39B8C; --side-act: #2B2620;
  --nutri: #C19A4B; --masso: #8FB09C; --recov: #A39B8C; --plano: #E2BF73; --neutral: #6E6553;
  --c1: #C19A4B; --c2: #8FB09C; --c3: #E2BF73; --c4: #C9C2B4; --c5: #B08A4A; --c6: #A39B8C;
  --info-bg: #2A2318; --info-ink: #E2BF73; --heat0: #1E1A15; --heat1: #E2BF73;
} }
/* Entrada (entrar.html, tokens próprios) */
html:root body { --fundo-a: #1F1C18; --fundo-b: #2B2620; --titulo: #1F1C18; --foco: #7F5F1C; --botao: #1F1C18; --botao-hover: #3A332A;
  --info-fundo: #F3ECDD; --info-borda: #D9C49A; --info-texto: #5E4614; --contorno-hover: #F3ECDD; --olho-hover: #F3ECDD; --campo-borda: #8C857A; }
@media (prefers-color-scheme: dark) { html:root body { --fundo-a: #0B0A08; --fundo-b: #1A1713; --cartao: #1A1713; --titulo: #E2BF73; --texto: #F6F2EA; --suave: #C9C2B4;
  --linha: #3A342C; --aviso-fundo: #221E19; --campo-fundo: #100E0B; --foco: #E2BF73; --botao: #E2BF73; --botao-hover: #F0D493; --botao-texto: #1F1C18;
  --contorno-hover: #2B2620; --olho-hover: #2B2620; --info-fundo: #2A2318; --info-borda: #6A4F17; --info-texto: #E2BF73; } }
html:root body, html:root body button, html:root body input { font-family: "Plus Jakarta Sans", system-ui, sans-serif; }
html:root .marca h1 { font-family: "Plus Jakarta Sans", system-ui, sans-serif; letter-spacing: .04em; }
/* dourado com intenção, numa ideia por tela: o selo de dados ilustrativos */
.vt-dados { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; border-radius: 999px; border: 1px solid #D9C49A;
  background: #F3ECDD; color: #5E4614; font: 700 12px/1.4 "Plus Jakarta Sans", system-ui, sans-serif; letter-spacing: .02em; white-space: nowrap; }
html:root[data-theme="dark"] .vt-dados { background: #2A2318; color: #E2BF73; border-color: #6A4F17; }
@media (prefers-color-scheme: dark) { html:root:not([data-theme="light"]) .vt-dados { background: #2A2318; color: #E2BF73; border-color: #6A4F17; } }
.vt-dados-topo { margin: 0 0 0 auto; flex: 0 0 auto; }
/* "Como Funciona" dentro do app: no rodapé da entrada e no rodapé do menu lateral (nunca solto por cima da tela) */
.vt-como { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 16px; border-radius: 8px;
  background: linear-gradient(180deg, #CDA75A, #C19A4B); color: #231C0E; border: 1px solid #A47E33;
  font: 700 14px/1.2 "Plus Jakarta Sans", system-ui, sans-serif; text-decoration: none; white-space: nowrap; }
.vt-como:hover { filter: brightness(1.04); }
.vt-como:focus-visible { outline: 2px solid #F6F2EA; outline-offset: 3px; }
.vt-entrada { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; margin: 0 0 12px; }
.vt-menu { display: flex; margin: 0 0 8px; }
.vt-menu .vt-como { flex: 1 1 auto; min-height: 36px; padding: 6px 12px; font-size: 13px; }
@media print { .vt-como { display: none; } }
/* faixa de abertura (Início e Painel) e tela de carregamento: o escuro da Boito no lugar do azul do app */
html:root .banner, html:root .boot { background: linear-gradient(135deg, #2B2620, #1F1C18); }
html:root .banner .eyebrow { color: #E2BF73; }