/* ==========================================================================
   KSI — tokens de design (cores, espaço, raio, tipografia).
   Fonte: design system "KSI". Telas novas usam só estes valores: nada de cor hex
   ou style="..." no template. Cores por marca (white-label) ficam em ksi-brands.css.
   Tema: atributo data-theme="light|dark" no <html> (o layout cuida disso).
   ========================================================================== */
:root, [data-theme="light"] {
  --brand-primary: #001e2e;
  --brand-accent: #ff2220;
  --surface-0: #f4f6f8;
  --surface-1: #ffffff;
  --surface-2: #eef2f5;
  --border: #d7dee4;
  --border-strong: #7e8e9b;
  --ink: #0b1b26;
  --ink-muted: #4f6170;
  --primary: var(--brand-primary);
  --primary-hover: #0a3046;
  --on-primary: #ffffff;
  --primary-subtle: #e3ecf2;
  --primary-text: var(--brand-primary);
  --accent-text: #c8151a;
  --link: #00507f;
  --focus-ring: var(--brand-accent);
  --success: #127a3d;
  --success-bg: #e6f4ec;
  --warning: #8a5a00;
  --warning-bg: #fff3d6;
  --danger: #b42318;
  --danger-bg: #fdecea;
  --danger-solid: #b42318;
  --on-danger: #ffffff;
  --info: #1f5f99;
  --info-bg: #e7f0f8;
  --overlay: rgba(0, 30, 46, 0.45);
  --risco-muito-baixo: #127a3d;
  --risco-baixo: #4e7a12;
  --risco-medio: #8a5a00;
  --risco-alto: #b5470b;
  --risco-muito-alto: #b42318;
  --shadow-1: 0 1px 2px rgba(0, 30, 46, 0.06), 0 1px 3px rgba(0, 30, 46, 0.08);
  --shadow-2: 0 8px 24px rgba(0, 30, 46, 0.14);
}

[data-theme="dark"] {
  --brand-primary: #001e2e;
  --brand-accent: #ff2220;
  --surface-0: #07131c;
  --surface-1: #0d1e2b;
  --surface-2: #13283a;
  --border: #23394b;
  --border-strong: #5b7286;
  --ink: #eef3f6;
  --ink-muted: #9fb2c1;
  --primary: #cfe0ec;
  --primary-hover: #b7ccdb;
  --on-primary: #001e2e;
  --primary-subtle: #16324a;
  --primary-text: #dce8f1;
  --accent-text: #ff6b66;
  --link: #7cc4ee;
  --focus-ring: var(--brand-accent);
  --success: #6bd49a;
  --success-bg: #0f2e20;
  --warning: #f5c451;
  --warning-bg: #33270a;
  --danger: #ff8a80;
  --danger-bg: #3a1412;
  --danger-solid: #b42318;
  --on-danger: #ffffff;
  --info: #8cc3f2;
  --info-bg: #10283d;
  --overlay: rgba(0, 0, 0, 0.6);
  --risco-muito-baixo: #6bd49a;
  --risco-baixo: #a7d46b;
  --risco-medio: #f5c451;
  --risco-alto: #ffa061;
  --risco-muito-alto: #ff8a80;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-2: 0 8px 24px rgba(0, 0, 0, 0.55);
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-pill: 999px;
  --sidebar-width: 248px;
  --topbar-height: 64px;
  --content-max: 1280px;
  --font-sans: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;
}

.t-display { font-family: var(--font-sans); font-size: 32px; line-height: 40px; font-weight: 800; letter-spacing: -0.02em; }
.t-h1 { font-family: var(--font-sans); font-size: 24px; line-height: 32px; font-weight: 700; letter-spacing: -0.01em; }
.t-h2 { font-family: var(--font-sans); font-size: 18px; line-height: 26px; font-weight: 700; }
.t-h3 { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 700; }
.t-body { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 400; }
.t-body-strong { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 600; }
.t-small { font-family: var(--font-sans); font-size: 12px; line-height: 18px; font-weight: 500; }
.t-overline { font-family: var(--font-sans); font-size: 11px; line-height: 16px; font-weight: 700; letter-spacing: 0.08em; }
.t-kpi { font-family: var(--font-sans); font-size: 28px; line-height: 34px; font-weight: 800; letter-spacing: -0.01em; }
.t-rating { font-family: var(--font-sans); font-size: 48px; line-height: 48px; font-weight: 800; letter-spacing: -0.02em; }
.t-num { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 600; }
.t-doc { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 500; }