/* TrackStation — tokens de design (gerado a partir de docs/tokens.json; não edite à mão).
   Tema: defina data-theme="light" ou data-theme="dark" no <html>.
   Cores, sombras, espaços, raios e medidas viram variáveis CSS (var(--nome));
   cada estilo de texto vira uma classe (.title-lg, .body, .label, .caption…).
   As fontes estão em ../fonts — ajuste o caminho se a pasta mudar. */

@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter Display";
  src: url("../fonts/InterDisplay-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter Display";
  src: url("../fonts/InterDisplay-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root, [data-theme="light"] {
  --surface: #f4f6f9;
  --surface-raised: #ffffff;
  --surface-sunken: #ebeef2;
  --surface-hover: #f0f3f7;
  --line: #e3e6e9;
  --line-strong: #d1d6dc;
  --border: #7c848c;
  --ink: #101820;
  --ink-soft: #3d454e;
  --ink-muted: #5c646d;
  --ink-disabled: #989fa7;
  --brand: #0091d5;
  --accent: #0079b8;
  --accent-hover: #006aa2;
  --on-accent: #ffffff;
  --accent-ink: #006aa2;
  --accent-soft: #e6f4fb;
  --focus: var(--accent);
  --rail: #101820;
  --rail-raised: #1e2731;
  --rail-line: #252f39;
  --on-rail: #f0f4f8;
  --on-rail-muted: #989fa7;
  --cat-produtivo: var(--brand);
  --cat-neutro: #b2b8bf;
  --cat-distracao: #e46a00;
  --cat-ocioso: #989fa7;
  --success: #00764f;
  --success-soft: #e1f6ea;
  --warning: #845b00;
  --warning-soft: #fdf1d7;
  --warning-mark: #b07c00;
  --danger: #c2181d;
  --danger-soft: #fdecea;
  --on-danger: #ffffff;
  --scrim: #10182099;
  --shadow-sm: 0 1px 2px #1018200f;
  --shadow-md: 0 2px 4px -1px #10182014, 0 8px 20px -4px #1018201f;
  --shadow-lg: 0 8px 16px -8px #1018201f, 0 28px 56px -12px #10182047;
  --focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px #0079b8;
}
[data-theme="dark"] {
  --surface: #101820;
  --surface-raised: #19232c;
  --surface-sunken: #0b151e;
  --surface-hover: #222b35;
  --line: #252f39;
  --line-strong: #353e48;
  --border: #6d757e;
  --ink: #f0f4f8;
  --ink-soft: #c9ced4;
  --ink-muted: #989fa7;
  --ink-disabled: #5c646d;
  --brand: #0091d5;
  --accent: #3ea8e9;
  --accent-hover: #71c1f7;
  --on-accent: #101820;
  --accent-ink: #71c1f7;
  --accent-soft: #0c2a3d;
  --focus: var(--accent);
  --rail: #0b151e;
  --rail-raised: #19232c;
  --rail-line: #222b35;
  --on-rail: #f0f4f8;
  --on-rail-muted: #989fa7;
  --cat-produtivo: var(--brand);
  --cat-neutro: #505962;
  --cat-distracao: #e46a00;
  --cat-ocioso: #6d757e;
  --success: #51d39c;
  --success-soft: #0c2e22;
  --warning: #f3b01d;
  --warning-soft: #33260a;
  --warning-mark: #f3b01d;
  --danger: #ff7e72;
  --danger-soft: #3d1512;
  --on-danger: #101820;
  --scrim: #000000b3;
  --shadow-sm: 0 1px 2px #00000066;
  --shadow-md: 0 8px 20px -4px #000000b3;
  --shadow-lg: 0 28px 56px -12px #000000cc;
  --focus-ring: 0 0 0 2px #101820, 0 0 0 4px #3ea8e9;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  --control-sm: 28px;
  --control-md: 36px;
  --control-lg: 44px;
  --target-min: 24px;
  --rail-width: 232px;
  --rail-collapsed: 64px;
  --topbar-height: 56px;
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Inter Display", Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}
.display {
  font-family: var(--font-display);
  font-size: 40px;
  line-height: 44px;
  font-weight: 600;
  letter-spacing: -0.025em;
}
.title-lg {
  font-family: var(--font-display);
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.title-md {
  font-family: var(--font-display);
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  letter-spacing: -0.015em;
}
.figure-xl {
  font-family: var(--font-display);
  font-size: 44px;
  line-height: 48px;
  font-weight: 500;
  letter-spacing: -0.03em;
}
.figure-lg {
  font-family: var(--font-display);
  font-size: 28px;
  line-height: 32px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.figure-md {
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 24px;
  font-weight: 600;
  letter-spacing: -0.015em;
}
.title-sm {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.body {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 22px;
  font-weight: 400;
  letter-spacing: 0em;
}
.body-strong {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 22px;
  font-weight: 600;
  letter-spacing: -0.005em;
}
.label {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 20px;
  font-weight: 500;
  letter-spacing: 0em;
}
.data {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: 0em;
}
.caption {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  letter-spacing: 0.005em;
}
.micro {
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 14px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

:root, [data-theme="light"] { color-scheme: light; }
[data-theme="dark"] { color-scheme: dark; }