/* Generated from tokens.json. Do not edit by hand. */

@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600&display=swap");

:root, [data-theme="dark"] {
  --surface-000: #0c0e12;
  --surface-100: #11141a;
  --surface-200: #161a21;
  --surface-300: #1d222b;
  --surface-400: #262d38;
  --border-subtle: #232932;
  --border: #303845;
  --border-strong: #414b5a;
  --border-control: #666f7e;
  --ink-100: #e8ecf2;
  --ink-200: #b3bcca;
  --ink-300: #7f8a9a;
  --ink-400: #5a6472;
  --accent: #4aa8ff;
  --accent-hover: #6fbaff;
  --accent-surface: #132436;
  --on-accent: #0a1420;
  --ok: #3ecf8e;
  --ok-surface: #14281e;
  --warn: #f2b13c;
  --warn-surface: #2b2214;
  --danger: #ff6b6b;
  --danger-surface: #2c1a1c;
  --idle: var(--ink-300);
  --idle-surface: #1d222b;
  --focus-ring: var(--accent);
  --overlay: rgba(4, 6, 10, 0.72);
  --series-1: #4aa8ff;
  --series-2: #3ecf8e;
  --series-3: #f2b13c;
  --series-4: #e07ad0;
  --series-5: #46cfd4;
  --grid-line: #252c37;
  --shadow-popover: 0 8px 24px rgba(0, 0, 0, 0.55);
  --shadow-modal: 0 24px 64px rgba(0, 0, 0, 0.65);
  --shadow-sticky: 0 1px 0 rgba(0, 0, 0, 0.5);
}

[data-theme="light"] {
  --surface-000: #eef1f5;
  --surface-100: #f7f9fb;
  --surface-200: #ffffff;
  --surface-300: #eff2f6;
  --surface-400: #e3e9f0;
  --border-subtle: #e6eaf0;
  --border: #d3dae3;
  --border-strong: #b4bfcd;
  --border-control: #767f8d;
  --ink-100: #131820;
  --ink-200: #414b59;
  --ink-300: #626d7c;
  --ink-400: #828c9a;
  --accent: #1466c4;
  --accent-hover: #0f56a8;
  --accent-surface: #e3eefb;
  --on-accent: #ffffff;
  --ok: #0f7a4d;
  --ok-surface: #e4f4eb;
  --warn: #9a5b00;
  --warn-surface: #fbeeda;
  --danger: #c0273a;
  --danger-surface: #fbe6e8;
  --idle: var(--ink-300);
  --idle-surface: #eff2f6;
  --focus-ring: var(--accent);
  --overlay: rgba(19, 24, 32, 0.45);
  --series-1: #1466c4;
  --series-2: #0f7a4d;
  --series-3: #9a5b00;
  --series-4: #9c2f8a;
  --series-5: #0f6f78;
  --grid-line: #e6eaf0;
  --shadow-popover: 0 8px 24px rgba(19, 24, 32, 0.12);
  --shadow-modal: 0 24px 64px rgba(19, 24, 32, 0.18);
  --shadow-sticky: 0 1px 0 rgba(19, 24, 32, 0.08);
}

: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;
  --radius-sm: 3px;
  --radius-md: 5px;
  --radius-lg: 8px;
  --radius-pill: 999px;
  --size-row: 36px;
  --size-row-head: 32px;
  --size-topbar: 48px;
  --size-control: 28px;
  --size-sidebar: 216px;
  --size-sidebar-collapsed: 48px;
  --size-page-max: 1600px;
  --size-dot: 7px;
  --z-sidebar: 10;
  --z-sticky: 20;
  --z-topbar: 30;
  --z-popover: 40;
  --z-modal: 60;
  --z-toast: 80;
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

.display-20 {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.title-15 {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 20px;
  font-weight: 600;
}

.body-13 {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
}

.body-strong-13 {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 18px;
  font-weight: 600;
}

.label-12 {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
}

.caption-11 {
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 14px;
  font-weight: 500;
  letter-spacing: 0.04em;
}

.micro-10 {
  font-family: var(--font-sans);
  font-size: 10px;
  line-height: 13px;
  font-weight: 500;
  letter-spacing: 0.03em;
}

.metric-28 {
  font-family: var(--font-mono);
  font-size: 28px;
  line-height: 32px;
  font-weight: 600;
  letter-spacing: -0.02em;
}

.metric-17 {
  font-family: var(--font-mono);
  font-size: 17px;
  line-height: 22px;
  font-weight: 600;
}

.num-13 {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
}

.num-strong-13 {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 18px;
  font-weight: 600;
}

.num-12 {
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
}

.code-12 {
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
}