:root {
  --color-bg: #f6f4ef; --color-panel: #ffffff; --color-fg: #1f1e1c; --color-fg-muted: #6b6760;
  --color-border-line: #e4e0d8; --color-ok: #2e7d4f; --color-warn: #b7791f; --color-bad: #c0392b;
  --cds-chart-reference: #c96442; --cds-chart-grid: #ece8e0; --cds-chart-axis: #9a958c; --cds-chart-muted: #bdb7ad;
  --cds-chart-status-critical: #c0392b; --cds-text-secondary: #6b6760; --cds-border: #e4e0d8;
  --cds-surface-popover: #ffffff; --cds-shadow-popover: 0 6px 24px rgba(0,0,0,.12); --cds-dur-slow: .4s;
  --cds-gap-xs: 4px; --cds-gap-sm: 8px; --cds-gap-md: 14px; --cds-gap-lg: 22px;
  --cds-pad-xs: 4px; --cds-pad-sm: 8px; --cds-pad-md: 12px; --cds-pad-lg: 18px; --cds-radius: 10px;
  --cds-font-size-caption: 12.5px; --cds-font-size-body: 14.5px; --cds-font-size-heading: 17px; --cds-font-size-title: 30px;
  --cds-font-weight-medium: 550;
  --font-anthropic-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-anthropic-serif: "Fraunces", Georgia, "Times New Roman", serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #171614; --color-panel: #211f1c; --color-fg: #eeebe4; --color-fg-muted: #a39e94;
    --color-border-line: #34312c; --cds-chart-grid: #2c2a26; --cds-chart-axis: #7d786f; --cds-chart-muted: #5a564f;
    --cds-text-secondary: #a39e94; --cds-border: #34312c; --cds-surface-popover: #2a2824;
  }
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--color-bg); color: var(--color-fg); font-family: var(--font-anthropic-sans); font-size: var(--cds-font-size-body); }
a { color: var(--cds-chart-reference); }
.topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-bottom: 1px solid var(--color-border-line); background: var(--color-panel); position: sticky; top: 0; z-index: 5; }
.topo .marca { display: flex; align-items: center; gap: 10px; font-family: var(--font-anthropic-serif); font-size: 20px; }
.topo .marca i { width: 26px; height: 26px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #f3b08f, var(--cds-chart-reference)); box-shadow: 0 0 14px rgba(201,100,66,.55); display: inline-block; }
.topo a.sair { color: var(--color-fg-muted); text-decoration: none; font-size: 13px; }
main.conteudo { max-width: 1240px; margin: 0 auto; padding: 22px 16px 60px; }
.caixa { max-width: 420px; margin: 8vh auto; background: var(--color-panel); border: 1px solid var(--color-border-line); border-radius: 14px; padding: 28px; }
.caixa h1 { font-family: var(--font-anthropic-serif); font-weight: 400; margin: 0 0 6px; }
.caixa p { color: var(--color-fg-muted); margin: 0 0 18px; line-height: 1.45; }
.caixa label { display: block; font-size: 13px; color: var(--color-fg-muted); margin: 12px 0 4px; }
.caixa input { width: 100%; font: inherit; padding: 10px 12px; border: 1px solid var(--color-border-line); border-radius: 8px; background: var(--color-bg); color: var(--color-fg); }
.caixa button { margin-top: 18px; width: 100%; font: inherit; font-weight: 600; padding: 11px; border: 0; border-radius: 8px; background: var(--cds-chart-reference); color: #fff; cursor: pointer; }
.caixa .qr { display: flex; justify-content: center; background: #fff; border-radius: 10px; padding: 10px; margin: 8px 0; }
.caixa code { display: block; text-align: center; font-size: 13px; letter-spacing: .05em; padding: 6px; background: var(--color-bg); border-radius: 6px; }
.erro { color: var(--color-bad) !important; font-weight: 600; }
.dash-select { font: inherit; padding: 6px 10px; border: 1px solid var(--color-border-line); border-radius: 8px; background: var(--color-panel); color: var(--color-fg); }
[hidden] { display: none !important; }