/* Fence Watch 2.4.1 — tokens. Gerado por build-dist.py a partir de tokens.json; não edite à mão.
   Tema: data-theme="dark" (padrão) ou "light" no <html> ou em qualquer subárvore.
   --X-rgb: canais "R G B" de cada cor sólida, para rgb(var(--X-rgb) / .5). Cores com alfa próprio (watch-soft) não têm. */
:root, [data-theme="dark"] {
  color-scheme: dark;
  --surface-0: #0b1220;
  --surface-0-rgb: 11 18 32;
  --surface-1: #121b2c;
  --surface-1-rgb: 18 27 44;
  --surface-2: #1a2538;
  --surface-2-rgb: 26 37 56;
  --hairline: #26324a;
  --hairline-rgb: 38 50 74;
  --ink: #eef2f7;
  --ink-rgb: 238 242 247;
  --ink-muted: #9aa7ba;
  --ink-muted-rgb: 154 167 186;
  --brand: #2ee6a6;
  --brand-rgb: 46 230 166;
  --on-brand: #06120d;
  --on-brand-rgb: 6 18 13;
  --warning: #ffb020;
  --warning-rgb: 255 176 32;
  --on-warning: #1a1200;
  --on-warning-rgb: 26 18 0;
  --danger: #ff6b6b;
  --danger-rgb: 255 107 107;
  --on-danger: #1a0505;
  --on-danger-rgb: 26 5 5;
  --watch: #8fb4e8;
  --watch-rgb: 143 180 232;
  --on-watch: #0a1424;
  --on-watch-rgb: 10 20 36;
  --watch-soft: #8fb4e824;
  --cat-1: #af6dec;
  --cat-1-rgb: 175 109 236;
  --cat-2: #69a621;
  --cat-2-rgb: 105 166 33;
  --cat-3: #2da1c2;
  --cat-3-rgb: 45 161 194;
  --cat-4: #b25c0c;
  --cat-4-rgb: 178 92 12;
  --cat-5: #6a60e2;
  --cat-5-rgb: 106 96 226;
  --cat-6: #1fa89c;
  --cat-6-rgb: 31 168 156;
  --sev-critical: #ff5c8d;
  --sev-critical-rgb: 255 92 141;
  --on-sev-critical: #1a0510;
  --on-sev-critical-rgb: 26 5 16;
  --sev-high: var(--danger);
  --sev-high-rgb: var(--danger-rgb);
  --on-sev-high: var(--on-danger);
  --on-sev-high-rgb: var(--on-danger-rgb);
  --sev-medium: var(--warning);
  --sev-medium-rgb: var(--warning-rgb);
  --on-sev-medium: var(--on-warning);
  --on-sev-medium-rgb: var(--on-warning-rgb);
  --sev-low: #e3cf5a;
  --sev-low-rgb: 227 207 90;
  --on-sev-low: #1a1600;
  --on-sev-low-rgb: 26 22 0;
  --sev-info: var(--ink-muted);
  --sev-info-rgb: var(--ink-muted-rgb);
  --grade-a: var(--brand);
  --grade-a-rgb: var(--brand-rgb);
  --grade-b: var(--sev-low);
  --grade-b-rgb: var(--sev-low-rgb);
  --grade-c: var(--warning);
  --grade-c-rgb: var(--warning-rgb);
  --grade-d: var(--danger);
  --grade-d-rgb: var(--danger-rgb);
  --grade-e: var(--sev-critical);
  --grade-e-rgb: var(--sev-critical-rgb);
  --grade-f: var(--sev-critical);
  --grade-f-rgb: var(--sev-critical-rgb);
  --alt-farol: #58c4ff;
  --alt-farol-rgb: 88 196 255;
  --alt-cobalto: #5b9cff;
  --alt-cobalto-rgb: 91 156 255;
  --alt-ultravioleta: #a89bff;
  --alt-ultravioleta-rgb: 168 155 255;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.04);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.55), 0 2px 6px rgba(0,0,0,0.35);
  --shadow-lg: 0 24px 64px rgba(0,0,0,0.65), 0 8px 16px rgba(0,0,0,0.4);
}
[data-theme="light"] {
  color-scheme: light;
  --surface-0: #f6f7f9;
  --surface-0-rgb: 246 247 249;
  --surface-1: #ffffff;
  --surface-1-rgb: 255 255 255;
  --surface-2: #eef1f5;
  --surface-2-rgb: 238 241 245;
  --hairline: #d9dee7;
  --hairline-rgb: 217 222 231;
  --ink: #101827;
  --ink-rgb: 16 24 39;
  --ink-muted: #56637a;
  --ink-muted-rgb: 86 99 122;
  --brand: #0b7a56;
  --brand-rgb: 11 122 86;
  --on-brand: #ffffff;
  --on-brand-rgb: 255 255 255;
  --warning: #9a5b00;
  --warning-rgb: 154 91 0;
  --on-warning: #ffffff;
  --on-warning-rgb: 255 255 255;
  --danger: #b42318;
  --danger-rgb: 180 35 24;
  --on-danger: #ffffff;
  --on-danger-rgb: 255 255 255;
  --watch: #2d5a9e;
  --watch-rgb: 45 90 158;
  --on-watch: #ffffff;
  --on-watch-rgb: 255 255 255;
  --watch-soft: #2d5a9e14;
  --cat-1: #732ca9;
  --cat-1-rgb: 115 44 169;
  --cat-2: #4b781a;
  --cat-2-rgb: 75 120 26;
  --cat-3: #1f8fae;
  --cat-3-rgb: 31 143 174;
  --cat-4: #c4621a;
  --cat-4-rgb: 196 98 26;
  --cat-5: #6d64e5;
  --cat-5-rgb: 109 100 229;
  --cat-6: #00897c;
  --cat-6-rgb: 0 137 124;
  --sev-critical: #a3123f;
  --sev-critical-rgb: 163 18 63;
  --on-sev-critical: #ffffff;
  --on-sev-critical-rgb: 255 255 255;
  --sev-high: var(--danger);
  --sev-high-rgb: var(--danger-rgb);
  --on-sev-high: var(--on-danger);
  --on-sev-high-rgb: var(--on-danger-rgb);
  --sev-medium: var(--warning);
  --sev-medium-rgb: var(--warning-rgb);
  --on-sev-medium: var(--on-warning);
  --on-sev-medium-rgb: var(--on-warning-rgb);
  --sev-low: #6f6300;
  --sev-low-rgb: 111 99 0;
  --on-sev-low: #ffffff;
  --on-sev-low-rgb: 255 255 255;
  --sev-info: var(--ink-muted);
  --sev-info-rgb: var(--ink-muted-rgb);
  --grade-a: var(--brand);
  --grade-a-rgb: var(--brand-rgb);
  --grade-b: var(--sev-low);
  --grade-b-rgb: var(--sev-low-rgb);
  --grade-c: var(--warning);
  --grade-c-rgb: var(--warning-rgb);
  --grade-d: var(--danger);
  --grade-d-rgb: var(--danger-rgb);
  --grade-e: var(--sev-critical);
  --grade-e-rgb: var(--sev-critical-rgb);
  --grade-f: var(--sev-critical);
  --grade-f-rgb: var(--sev-critical-rgb);
  --alt-farol: #0868b5;
  --alt-farol-rgb: 8 104 181;
  --alt-cobalto: #1f5fd1;
  --alt-cobalto-rgb: 31 95 209;
  --alt-ultravioleta: #5b3fd6;
  --alt-ultravioleta-rgb: 91 63 214;
  --shadow-sm: 0 1px 2px rgba(16,24,39,0.08), 0 0 0 1px rgba(16,24,39,0.04);
  --shadow-md: 0 8px 24px rgba(16,24,39,0.12), 0 2px 6px rgba(16,24,39,0.06);
  --shadow-lg: 0 24px 64px rgba(16,24,39,0.18), 0 8px 16px rgba(16,24,39,0.08);
}
:root {
  --font-display: "Space Grotesk", "IBM Plex Sans", system-ui, sans-serif;
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
}
.display-xl { font-family: var(--font-display); font-size: 56px; line-height: 60px; font-weight: 700; letter-spacing: -0.02em; }
.heading-lg { font-family: var(--font-display); font-size: 32px; line-height: 38px; font-weight: 600; letter-spacing: -0.01em; }
.heading-md { font-family: var(--font-display); font-size: 22px; line-height: 28px; font-weight: 600; }
.body { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; }
.body-sm { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.06em; }
.mono { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 400; }
.score-xl { font-family: var(--font-display); font-size: 72px; line-height: 72px; font-weight: 700; letter-spacing: -0.03em; }
.grade-lg { font-family: var(--font-display); font-size: 40px; line-height: 40px; font-weight: 700; letter-spacing: -0.02em; }
.mono-lg { font-family: var(--font-mono); font-size: 15px; line-height: 22px; font-weight: 500; }