:root {
  color-scheme: dark;

  --bg-abyss: #191b1f;
  --bg-rail: #1e1f22;
  --bg-sidebar: #2b2d31;
  --bg-canvas: #313338;
  --bg-raised: #383a40;
  --bg-sunken: #2b2d31;
  --bg-input: #1e1f22;
  --bg-overlay: rgb(9 10 12 / 0.78);

  --line-soft: #3a3c42;
  --line-strong: #4a4d55;

  --text-strong: #f2f3f5;
  --text-normal: #dbdee1;
  --text-muted: #a7adb6;
  --text-faint: #a0a7b1;
  --text-on-accent: #ffffff;

  --accent: #5865f2;
  --accent-hover: #4752c4;
  --accent-quiet: rgb(88 101 242 / 0.16);
  --selection: rgb(88 101 242 / 0.55);
  --accent-line: rgb(88 101 242 / 0.45);

  --positive: #2dc770;
  --positive-quiet: rgb(45 199 112 / 0.14);
  --caution: #f0b132;
  --caution-quiet: rgb(240 177 50 / 0.14);
  --danger: #f2555a;
  --danger-hover: #d63d42;
  --danger-quiet: rgb(242 85 90 / 0.14);
  --gold: #f5a623;

  --focus: #00a8fc;

  --font-sans: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  --step-0: 0.9375rem;
  --step--1: 0.8125rem;
  --step--2: 0.6875rem;
  --step-1: 1.125rem;
  --step-2: 1.375rem;
  --step-3: 1.75rem;
  --step-4: 2.25rem;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-pill: 999px;

  --shadow-low: 0 1px 2px rgb(6 6 7 / 0.3), 0 2px 6px rgb(6 6 7 / 0.24);
  --shadow-high: 0 8px 16px rgb(6 6 7 / 0.36), 0 2px 4px rgb(6 6 7 / 0.28);

  --text-on-selection: #ffffff;
  --gold-quiet: rgb(245 166 35 / 0.16);
  --chart-1: #7480f2;
  --chart-2: #00a68f;
  --chart-3: #bf8a1a;
  --accent-text: #c3c9ff;
  --danger-text: #ff9b9e;
  --caution-text: #f6cd7a;
  --positive-text: #6ee7a4;
  --gold-text: #ffcd7a;
  --link: #00a8fc;

  --danger-surface: #4a2326;
  --danger-surface-text: #ffc9cb;
  --positive-surface: #1e3b2b;
  --positive-surface-text: #a6efc6;
  --caution-surface: #45351a;
  --caution-surface-text: #f6cd7a;

  --wash-1: rgb(255 255 255 / 0.04);
  --wash-2: rgb(255 255 255 / 0.06);
  --wash-3: rgb(255 255 255 / 0.08);
  --wash-4: rgb(255 255 255 / 0.12);
  --wash-5: rgb(255 255 255 / 0.2);
  --ring-contrast: rgb(255 255 255 / 0.14);
  --ring-strong: rgb(255 255 255 / 0.3);

  --shadow-hairline: rgb(0 0 0 / 0.24);
  --shadow-topbar: rgb(0 0 0 / 0.2);
  --shadow-key: rgb(0 0 0 / 0.35);
  --shadow-card: rgb(0 0 0 / 0.35);
  --scrim: rgb(0 0 0 / 0.62);
  --glow: rgb(88 101 242 / 0.16);

  --button-secondary-hover: #43464e;
  --positive-hover: #1f8a4c;
  --switch-off: #72767d;
  --switch-knob: #ffffff;
  --scrollbar-thumb-hover: #16171a;

  --rail-width: 264px;
  --ease-out: cubic-bezier(0.2, 0.9, 0.25, 1);
}

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

  --bg-abyss: #dfe1e5;
  --bg-rail: #ebedef;
  --bg-sidebar: #f2f3f5;
  --bg-canvas: #ffffff;
  --bg-raised: #f7f8f9;
  --bg-sunken: #f0f1f3;
  --bg-input: #ffffff;
  --bg-overlay: rgb(28 30 34 / 0.45);

  --line-soft: #e0e2e6;
  --line-strong: #c6c9d0;

  --text-strong: #16171a;
  --text-normal: #2e3035;
  --text-muted: #55595f;
  --text-faint: #64686f;
  --text-on-accent: #ffffff;

  --accent: #4d59d8;
  --accent-hover: #3d47b8;
  --accent-quiet: rgb(77 89 216 / 0.1);
  --selection: rgb(77 89 216 / 0.26);
  --accent-line: rgb(77 89 216 / 0.38);

  --positive: #1a8245;
  --positive-quiet: rgb(26 130 69 / 0.11);
  --caution: #8a5a00;
  --caution-quiet: rgb(138 90 0 / 0.12);
  --danger: #c9232e;
  --danger-hover: #a8101a;
  --danger-quiet: rgb(201 35 46 / 0.09);
  --gold: #8a5a00;

  --focus: #0064c1;

  --shadow-low: 0 1px 2px rgb(16 18 22 / 0.08), 0 2px 6px rgb(16 18 22 / 0.06);
  --shadow-high: 0 8px 16px rgb(16 18 22 / 0.12), 0 2px 4px rgb(16 18 22 / 0.08);

  --text-on-selection: #16171a;
  --gold-quiet: rgb(138 90 0 / 0.13);
  --chart-1: #4650cf;
  --chart-2: #00786a;
  --chart-3: #8a6100;
  --accent-text: #3b45bd;
  --danger-text: #a8101a;
  --caution-text: #6f4800;
  --positive-text: #126239;
  --gold-text: #6f4800;
  --link: #0064c1;

  --danger-surface: #fce8e9;
  --danger-surface-text: #860d16;
  --positive-surface: #e2f4ea;
  --positive-surface-text: #0e4d2b;
  --caution-surface: #fbf0d8;
  --caution-surface-text: #634100;

  --wash-1: rgb(16 18 22 / 0.04);
  --wash-2: rgb(16 18 22 / 0.05);
  --wash-3: rgb(16 18 22 / 0.07);
  --wash-4: rgb(16 18 22 / 0.09);
  --wash-5: rgb(16 18 22 / 0.14);
  --ring-contrast: rgb(16 18 22 / 0.12);
  --ring-strong: rgb(16 18 22 / 0.26);

  --shadow-hairline: rgb(16 18 22 / 0.1);
  --shadow-topbar: rgb(16 18 22 / 0.08);
  --shadow-key: rgb(16 18 22 / 0.16);
  --shadow-card: rgb(16 18 22 / 0.16);
  --scrim: rgb(16 18 22 / 0.55);
  --glow: rgb(77 89 216 / 0.07);

  --button-secondary-hover: #e2e4e8;
  --positive-hover: #126239;
  --switch-off: #b4b8bf;
  --switch-knob: #ffffff;
  --scrollbar-thumb-hover: #a9aeb6;
}