/* OLED True-Black · tokens · 26.11.13-Alpha · generated from tokens.json (design system "OLED True-Black").
   Violet is the design language's default (no attribute); [data-theme] blocks swap the accent tokens, on-button and the
   sequential ramp (every color follows the theme except black and the grays, status, focus, the rainbow, the chart
   series and the diverging ramp, and the app icon). The warm gradient's tokens were retired in 26.11.9. */
:root {
  /* color: surfaces and lines */
  --bg: #000000;
  --surface: #000000;
  --surface-raised: #1c1c1e;
  --surface-overlay: #2c2c2e;
  --track: #1c1c1e;
  --scrim: #000000b3;
  --line: #56565b;
  --border-input: #7a7a83;
  --border-hover: #9a9aa2;
  --border-danger: #bc5f6c;
  --border-disabled: #3a3a3c;
  /* color: text */
  --text-1: #ededef;
  --text-2: #cfcfd6;
  --text-3: #a1a1aa;
  --text-off: #83838c;
  --text-huge: #e4e4e7;
  --focus: #93c5fd;
  /* color: accent (Violet) */
  --accent-text: #d8c5fe;
  --brand-a: #9b4ef8;
  --brand-mid: #00a8ff;
  --brand-b: #19d9c8;
  --on-button: #ffffff;
  --button-a: #8f30f0;
  --button-mid: #624bfa;
  --button-b: #0661f3;
  --metric-a: #ccb1fe;
  --metric-mid: #84d3ff;
  --metric-b: #65ecdd;
  --selection: #860de9;
  /* color: rainbow, status, data */
  --rainbow-blue: #7f8bfd;
  --rainbow-light-blue: #7bd9fe;
  --rainbow-violet: #e392fe;
  --rainbow-red: #fd5b6a;
  --rainbow-orange: #fea164;
  --rainbow-yellow: #fde11a;
  --rainbow-green: #1cce24;
  --ok: #6ee7b7;
  --ok-bg: #0f201a;
  --warn: #fcd34d;
  --warn-bg: #231e0b;
  --err: #ffc2ca;
  --err-bg: #231719;
  --info: #acd3fd;
  --info-bg: #0f1a2b;
  --chart-1: #9b77fc;
  --chart-2: #0c8eae;
  --chart-3: #ca820d;
  --chart-4: #c3337a;
  --chart-5: #0fa84f;
  --chart-6: #4892fd;
  --chart-7: #cc3430;
  --chart-8: #aa930d;
  --chart-grid: #2c2c2e;
  --chart-axis: #56565b;
  --chart-good: #0ca30c;
  --chart-warning: #fab219;
  --chart-serious: #ec835a;
  --chart-critical: #d03b3b;
  --seq-100: #551ea9;
  --seq-200: #6b3dc6;
  --seq-300: #8359e3;
  --seq-400: #9b77fc;
  --seq-500: #b29cfd;
  --seq-600: #cbbffd;
  --seq-700: #e5e0fe;
  --div-neg-3: #92c1fd;
  --div-neg-2: #3f93f7;
  --div-neg-1: #0a67c5;
  --div-mid: #47474a;
  --div-pos-1: #905c09;
  --div-pos-2: #c78112;
  --div-pos-3: #fda934;
  /* type */
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  /* spacing */
  --space-0: 0px;
  --space-2: 2px;
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;
  --space-96: 96px;
  /* radius */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 28px;
  --radius-full: 9999px;
  /* shadow */
  --ring-raised: 0 0 0 1px #ffffff14;
  --shadow-overlay: 0 0 0 1px #ffffff14, 0 24px 64px #000000;
  /* size */
  --target-min: 24px;
  --target-touch: 44px;
  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;
  --control-xl: 56px;
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --navbar-height: 64px;
  --rail-width: 80px;
  --sidebar-width: 280px;
  --appbar-height: 64px;
  --measure: 34em;
  --content-max: 1600px;
  /* breakpoint */
  --bp-medium: 600px;
  --bp-expanded: 840px;
  --bp-large: 1200px;
  --bp-extra-large: 1600px;
  --bp-height-medium: 480px;
  --bp-height-expanded: 900px;
  /* duration */
  --dur-fast-effects: 140ms;
  --dur-default-effects: 220ms;
  --dur-slow-effects: 300ms;
  --dur-fast-spatial: 160ms;
  --dur-default-spatial: 220ms;
  --dur-slow-spatial: 340ms;
  /* easing */
  --spring-fast-effects: linear(0, 0.102, 0.293, 0.481, 0.635, 0.751, 0.833, 0.891, 0.929, 0.954, 0.971, 0.982, 0.988, 0.993, 0.996, 0.997, 1);
  --spring-default-effects: linear(0, 0.106, 0.301, 0.491, 0.645, 0.76, 0.841, 0.897, 0.934, 0.958, 0.973, 0.983, 0.99, 0.994, 0.996, 0.998, 1);
  --spring-slow-effects: linear(0, 0.1, 0.287, 0.472, 0.626, 0.742, 0.826, 0.885, 0.925, 0.951, 0.969, 0.98, 0.987, 0.992, 0.995, 0.997, 1);
  --spring-fast-spatial: linear(0, 0.056, 0.18, 0.325, 0.467, 0.594, 0.699, 0.783, 0.848, 0.896, 0.931, 0.956, 0.973, 0.984, 0.992, 0.996, 1);
  --spring-default-spatial: linear(0, 0.053, 0.172, 0.313, 0.452, 0.577, 0.683, 0.768, 0.835, 0.885, 0.922, 0.949, 0.968, 0.981, 0.989, 0.995, 1);
  --spring-slow-spatial: linear(0, 0.054, 0.175, 0.318, 0.459, 0.584, 0.689, 0.774, 0.84, 0.89, 0.926, 0.952, 0.97, 0.982, 0.99, 0.996, 1);
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-enter: cubic-bezier(0.05, 0.7, 0.1, 1);
  --ease-exit: cubic-bezier(0.3, 0, 0.8, 0.15);
}
/* Themes: the accent tokens, the button label and the sequential ramp. Violet is declared too, so a subtree (a swatch) can show it inside another theme. */
[data-theme="violet"] {
  --accent-text: #d8c5fe; --brand-a: #9b4ef8; --brand-mid: #00a8ff; --brand-b: #19d9c8; --on-button: #ffffff; --button-a: #8f30f0; --button-mid: #624bfa; --button-b: #0661f3; --metric-a: #ccb1fe; --metric-mid: #84d3ff; --metric-b: #65ecdd; --selection: #860de9;
  --seq-100: #551ea9; --seq-200: #6b3dc6; --seq-300: #8359e3; --seq-400: #9b77fc; --seq-500: #b29cfd; --seq-600: #cbbffd; --seq-700: #e5e0fe;
}
[data-theme="amethyst"] {
  --accent-text: #d3c7fe; --brand-a: #9154fd; --brand-mid: #c573fb; --brand-b: #f393f8; --on-button: #ffffff; --button-a: #8536f6; --button-mid: #a125e0; --button-b: #b80dc4; --metric-a: #c6b4fe; --metric-mid: #cbc0fe; --metric-b: #d1ccfe; --selection: #7e0ef3;
  --seq-100: #6b0b98; --seq-200: #8430b4; --seq-300: #9e4dd0; --seq-400: #b76ce9; --seq-500: #c994ef; --seq-600: #dabaf4; --seq-700: #eddef9;
}
[data-theme="sunset"] {
  --accent-text: #fec37d; --brand-a: #e01d96; --brand-mid: #ff6560; --brand-b: #fea658; --on-button: #ffffff; --button-a: #c80c84; --button-mid: #c90c81; --button-b: #ca0c7e; --metric-a: #fec787; --metric-mid: #fac97d; --metric-b: #f5cb73; --selection: #b40976;
  --seq-100: #860357; --seq-200: #ac0d71; --seq-300: #ca368b; --seq-400: #e558a4; --seq-500: #ee87ba; --seq-600: #f5b2d1; --seq-700: #fbdae8;
}
[data-theme="gold"] {
  --accent-text: #ded078; --brand-a: #d1580a; --brand-mid: #dd8a00; --brand-b: #d6be14; --on-button: #000000; --button-a: #ecd32b; --button-mid: #f6cf3f; --button-b: #fecc52; --metric-a: #feaa84; --metric-mid: #f9be71; --metric-b: #e5d573; --selection: #a44406;
  --seq-100: #694001; --seq-200: #895401; --seq-300: #aa6a05; --seq-400: #cd8008; --seq-500: #e79c3f; --seq-600: #efbf8c; --seq-700: #f7e0c8;
}
[data-theme="emerald"] {
  --accent-text: #d1d47d; --brand-a: #0d996f; --brand-mid: #6fb454; --brand-b: #c4c517; --on-button: #000000; --button-a: #28edaf; --button-mid: #95e774; --button-b: #d8d93a; --metric-a: #55ddab; --metric-mid: #a0de89; --metric-b: #d7da79; --selection: #077051;
  --seq-100: #02593f; --seq-200: #077453; --seq-300: #009068; --seq-400: #0bae7e; --seq-500: #3fc998; --seq-600: #92dcbb; --seq-700: #cceede;
}
[data-theme="graphite"] {
  --accent-text: #e2e2e5; --brand-a: #7a7a83; --brand-mid: #adaeb4; --brand-b: #e4e4e7; --on-button: #000000; --button-a: #e4e4e7; --button-mid: #ececee; --button-b: #f4f4f5; --metric-a: #b4b4bc; --metric-mid: #bcbcc4; --metric-b: #c5c5cc; --selection: #62626b;
  --seq-100: #4a4a4a; --seq-200: #626262; --seq-300: #7a7a7a; --seq-400: #949494; --seq-500: #aeaeae; --seq-600: #c9c9c9; --seq-700: #e4e4e4;
}
[data-theme="tide"] {
  --accent-text: #86d9fe; --brand-a: #0d9590; --brand-mid: #92c2bc; --brand-b: #f0eee9; --on-button: #ffffff; --button-a: #0874aa; --button-mid: #0876a3; --button-b: #09779b; --metric-a: #19ddd5; --metric-mid: #9fe2da; --metric-b: #e6e4de; --selection: #07689a;
  --seq-100: #045653; --seq-200: #05716d; --seq-300: #008d88; --seq-400: #03aaa4; --seq-500: #0cc7c1; --seq-600: #82dcd6; --seq-700: #c7eeeb;
}