@ecopages/radiant-themes 0.0.0-stage → 0.2.0

package/dist/tokens/roles/github.css

@@ -0,0 +1,150 @@
+:where(:root),
+:root[data-rui-theme='github'] {
+	--gray-50: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 4%);
+	--gray-100: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 9%);
+	--gray-200: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 18%);
+	--gray-300: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 32%);
+	--gray-400: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 48%);
+	--gray-500: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 62%);
+	--gray-600: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 72%);
+	--gray-700: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 80%);
+	--gray-800: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 88%);
+	--gray-900: color-mix(in oklab, var(--color-github-canvas), var(--color-github-fg) 94%);
+	--gray-950: var(--color-github-fg);
+
+	--primary: var(--color-github-green);
+	--on-primary: white;
+	--primary-light: color-mix(in oklab, var(--color-github-green), white 12%);
+	--primary-dark: color-mix(in oklab, var(--color-github-green), black 24%);
+	--primary-container: color-mix(in oklab, var(--color-github-green), white 90%);
+	--on-primary-container: color-mix(in oklab, var(--color-github-green), black 60%);
+	--secondary: var(--color-github-subtle);
+	--on-secondary: var(--color-github-fg);
+	--secondary-light: var(--color-github-white);
+	--secondary-dark: var(--color-github-muted);
+	--secondary-container: var(--color-github-muted);
+	--on-secondary-container: var(--color-github-fg);
+	--tertiary: var(--color-github-purple);
+	--on-tertiary: white;
+	--tertiary-container: color-mix(in oklab, var(--color-github-purple), white 90%);
+	--on-tertiary-container: color-mix(in oklab, var(--color-github-purple), black 60%);
+	--error: var(--color-github-red);
+	--on-error: white;
+	--error-light: color-mix(in oklab, var(--color-github-red), white 30%);
+	--error-dark: color-mix(in oklab, var(--color-github-red), black 30%);
+	--error-container: color-mix(in oklab, var(--color-github-red), white 91%);
+	--on-error-container: color-mix(in oklab, var(--color-github-red), black 60%);
+	--success: var(--color-github-green);
+	--on-success: white;
+	--success-light: color-mix(in oklab, var(--color-github-green), white 30%);
+	--success-dark: color-mix(in oklab, var(--color-github-green), black 30%);
+	--success-container: color-mix(in oklab, var(--color-github-green), white 90%);
+	--on-success-container: color-mix(in oklab, var(--color-github-green), black 60%);
+	--info: var(--color-github-blue);
+	--on-info: white;
+	--info-light: var(--color-github-blue-light);
+	--info-dark: color-mix(in oklab, var(--color-github-blue), black 45%);
+	--info-container: color-mix(in oklab, var(--color-github-blue), white 90%);
+	--on-info-container: color-mix(in oklab, var(--color-github-blue), black 60%);
+	--warning: var(--color-github-orange);
+	--on-warning: white;
+	--warning-light: color-mix(in oklab, var(--color-github-orange), white 30%);
+	--warning-dark: color-mix(in oklab, var(--color-github-orange), black 30%);
+	--warning-container: color-mix(in oklab, var(--color-github-orange), white 88%);
+	--on-warning-container: color-mix(in oklab, var(--color-github-orange), black 60%);
+	--neutral: var(--color-github-muted-fg);
+	--surface: var(--color-github-subtle);
+	--on-surface: var(--color-github-fg);
+	--surface-container-lowest: var(--color-github-canvas);
+	--on-surface-container-lowest: var(--color-github-fg);
+	--surface-container-low: var(--color-github-subtle);
+	--on-surface-container-low: var(--color-github-fg);
+	--surface-container: var(--color-github-muted);
+	--on-surface-container: var(--color-github-fg);
+	--surface-container-high: color-mix(in oklab, var(--color-github-muted), var(--color-github-border) 35%);
+	--on-surface-container-high: var(--color-github-fg);
+	--surface-container-highest: var(--color-github-border);
+	--on-surface-container-highest: var(--color-github-fg);
+	--background: var(--color-github-canvas);
+	--on-background: var(--color-github-fg);
+	--rui-border-color: var(--color-github-border);
+	--rui-control-border-color: color-mix(in srgb, var(--color-github-border-strong) 75%, var(--color-github-fg));
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--color-github-blue);
+	--on-focus-ring: white;
+	--link: var(--color-github-blue);
+	--overlay: oklch(0% 0 0 / 0.45);
+	--background-code: var(--color-github-subtle);
+	--on-background-code: var(--color-github-fg);
+}
+
+:where(.dark),
+:root.dark[data-rui-theme='github'] {
+	--gray-50: color-mix(in oklab, var(--color-github-canvas), white 96%);
+	--gray-100: color-mix(in oklab, var(--color-github-canvas), white 91%);
+	--gray-200: color-mix(in oklab, var(--color-github-canvas), white 82%);
+	--gray-300: color-mix(in oklab, var(--color-github-canvas), white 68%);
+	--gray-400: color-mix(in oklab, var(--color-github-canvas), white 52%);
+	--gray-500: color-mix(in oklab, var(--color-github-canvas), white 38%);
+	--gray-600: color-mix(in oklab, var(--color-github-canvas), white 28%);
+	--gray-700: color-mix(in oklab, var(--color-github-canvas), white 20%);
+	--gray-800: color-mix(in oklab, var(--color-github-canvas), white 12%);
+	--gray-900: color-mix(in oklab, var(--color-github-canvas), white 6%);
+	--gray-950: var(--color-github-canvas);
+	--primary: var(--color-github-green);
+	--on-primary: white;
+	--primary-light: #238636;
+	--primary-dark: #116329;
+	--primary-container: #0f3d1e;
+	--on-primary-container: #aff5b4;
+	--secondary: var(--color-github-muted);
+	--on-secondary: var(--color-github-fg);
+	--secondary-light: var(--color-github-border);
+	--secondary-dark: var(--color-github-subtle);
+	--secondary-container: var(--color-github-muted);
+	--on-secondary-container: var(--color-github-fg);
+	--tertiary: var(--color-github-purple);
+	--on-tertiary: #1b1031;
+	--tertiary-container: #35205c;
+	--on-tertiary-container: #e2d5ff;
+	--error: #ff7b72;
+	--on-error: #3d0b09;
+	--error-container: #5a1115;
+	--on-error-container: #ffdcd7;
+	--success: #3fb950;
+	--on-success: #071b0b;
+	--success-container: #0f3d1e;
+	--on-success-container: #aff5b4;
+	--info: var(--color-github-blue-light);
+	--on-info: #071d37;
+	--info-container: #0c2d6b;
+	--on-info-container: #d1e7ff;
+	--warning: #e3b341;
+	--on-warning: #211500;
+	--warning-container: #4d2d00;
+	--on-warning-container: #ffdf8b;
+	--neutral: var(--color-github-muted-fg);
+	--surface: var(--color-github-subtle);
+	--on-surface: var(--color-github-fg);
+	--surface-container-lowest: var(--color-github-canvas);
+	--on-surface-container-lowest: var(--color-github-fg);
+	--surface-container-low: var(--color-github-subtle);
+	--on-surface-container-low: var(--color-github-fg);
+	--surface-container: var(--color-github-muted);
+	--on-surface-container: var(--color-github-fg);
+	--surface-container-high: color-mix(in oklab, var(--color-github-muted), var(--color-github-border) 35%);
+	--on-surface-container-high: var(--color-github-fg);
+	--surface-container-highest: var(--color-github-border);
+	--on-surface-container-highest: var(--color-github-fg);
+	--background: var(--color-github-canvas);
+	--on-background: var(--color-github-fg);
+	--rui-border-color: var(--color-github-border);
+	--rui-control-border-color: color-mix(in srgb, var(--color-github-border-strong) 75%, var(--color-github-fg));
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--color-github-blue-light);
+	--on-focus-ring: #071d37;
+	--link: var(--color-github-blue-light);
+	--overlay: oklch(0% 0 0 / 0.7);
+	--background-code: var(--color-github-subtle);
+	--on-background-code: var(--color-github-fg);
+}

package/dist/tokens/roles/high-contrast.css

@@ -0,0 +1,155 @@
+:where(:root), :root[data-rui-theme='high-contrast'] {
+	--gray-50: #ffffff;
+	--gray-100: #ffffff;
+	--gray-200: #f2f2f2;
+	--gray-300: #e6e6e6;
+	--gray-400: #cccccc;
+	--gray-500: #808080;
+	--gray-600: #595959;
+	--gray-700: #333333;
+	--gray-800: #1a1a1a;
+	--gray-900: #080808;
+	--gray-950: #000000;
+	--primary: var(--contrast-primary);
+	--on-primary: #ffffff;
+	--primary-light: #315cff;
+	--primary-dark: #00228a;
+	--primary-container: var(--contrast-primary-container);
+	--on-primary-container: #000000;
+	--secondary: var(--contrast-secondary);
+	--on-secondary: #ffffff;
+	--secondary-light: #007070;
+	--secondary-dark: #003b3b;
+	--secondary-container: var(--contrast-secondary-container);
+	--on-secondary-container: #000000;
+	--tertiary: var(--contrast-tertiary);
+	--on-tertiary: #ffffff;
+	--tertiary-container: #e6e6e6;
+	--on-tertiary-container: #000000;
+	--error: var(--contrast-error);
+	--on-error: #ffffff;
+	--error-light: #ad0000;
+	--error-dark: #500000;
+	--error-container: var(--contrast-error-container);
+	--on-error-container: #000000;
+	--success: var(--contrast-success);
+	--on-success: #ffffff;
+	--success-light: #007000;
+	--success-dark: #003800;
+	--success-container: var(--contrast-success-container);
+	--on-success-container: #000000;
+	--info: var(--contrast-info);
+	--on-info: #ffffff;
+	--info-light: #315cff;
+	--info-dark: #00228a;
+	--info-container: var(--contrast-info-container);
+	--on-info-container: #000000;
+	--warning: var(--contrast-warning);
+	--on-warning: #ffffff;
+	--warning-light: #755300;
+	--warning-dark: #302300;
+	--warning-container: var(--contrast-warning-container);
+	--on-warning-container: #000000;
+	--neutral: #333333;
+	--surface: var(--contrast-surface);
+	--on-surface: var(--contrast-text);
+	--surface-container-lowest: #ffffff;
+	--on-surface-container-lowest: #000000;
+	--surface-container-low: #ffffff;
+	--on-surface-container-low: #000000;
+	--surface-container: var(--contrast-container);
+	--on-surface-container: #000000;
+	--surface-container-high: #e6e6e6;
+	--on-surface-container-high: #000000;
+	--surface-container-highest: #cccccc;
+	--on-surface-container-highest: #000000;
+	--background: var(--contrast-canvas);
+	--on-background: var(--contrast-text);
+	--rui-border-color: #000000;
+	--rui-control-border-color: #000000;
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--contrast-focus);
+	--on-focus-ring: #ffffff;
+	--link: #0033cc;
+	--overlay: rgb(0 0 0 / 70%);
+	--background-code: #ffffff;
+	--on-background-code: #000000;
+}
+
+:where(.dark), :root.dark[data-rui-theme='high-contrast'] {
+	--gray-50: #ffffff;
+	--gray-100: #f2f2f2;
+	--gray-200: #d9d9d9;
+	--gray-300: #bfbfbf;
+	--gray-400: #999999;
+	--gray-500: #737373;
+	--gray-600: #4d4d4d;
+	--gray-700: #333333;
+	--gray-800: #1a1a1a;
+	--gray-900: #080808;
+	--gray-950: #000000;
+	--primary: var(--contrast-primary);
+	--on-primary: #000000;
+	--primary-light: #ffff80;
+	--primary-dark: #e6e600;
+	--primary-container: var(--contrast-primary-container);
+	--on-primary-container: #000000;
+	--secondary: var(--contrast-secondary);
+	--on-secondary: #000000;
+	--secondary-light: #80ffff;
+	--secondary-dark: #00cccc;
+	--secondary-container: var(--contrast-secondary-container);
+	--on-secondary-container: #000000;
+	--tertiary: var(--contrast-tertiary);
+	--on-tertiary: #000000;
+	--tertiary-container: #ffffff;
+	--on-tertiary-container: #000000;
+	--error: var(--contrast-error);
+	--on-error: #000000;
+	--error-light: #ffd1cc;
+	--error-dark: #ff756b;
+	--error-container: var(--contrast-error-container);
+	--on-error-container: #000000;
+	--success: var(--contrast-success);
+	--on-success: #000000;
+	--success-light: #c6ffb8;
+	--success-dark: #64e64e;
+	--success-container: var(--contrast-success-container);
+	--on-success-container: #000000;
+	--info: var(--contrast-info);
+	--on-info: #000000;
+	--info-light: #d1f5ff;
+	--info-dark: #52c8eb;
+	--info-container: var(--contrast-info-container);
+	--on-info-container: #000000;
+	--warning: var(--contrast-warning);
+	--on-warning: #000000;
+	--warning-light: #ffff80;
+	--warning-dark: #e6e600;
+	--warning-container: var(--contrast-warning-container);
+	--on-warning-container: #000000;
+	--neutral: #ffffff;
+	--surface: #000000;
+	--on-surface: #ffffff;
+	--surface-container-lowest: #000000;
+	--on-surface-container-lowest: #ffffff;
+	--surface-container-low: #000000;
+	--on-surface-container-low: #ffffff;
+	--surface-container: #1a1a1a;
+	--on-surface-container: #ffffff;
+	--surface-container-high: #1a1a1a;
+	--on-surface-container-high: #ffffff;
+	--surface-container-highest: #333333;
+	--on-surface-container-highest: #ffffff;
+	--background: var(--contrast-canvas);
+	--on-background: var(--contrast-text);
+	--rui-border-color: #ffffff;
+	--rui-control-border-color: #ffffff;
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--contrast-focus);
+	--on-focus-ring: #000000;
+	--link: #80dfff;
+	--overlay: rgb(0 0 0 / 70%);
+	--background-code: #000000;
+	--on-background-code: #ffffff;
+}

package/dist/tokens/roles/macos-classic.css

@@ -0,0 +1,142 @@
+:where(:root), :root[data-rui-theme='macos-classic'] {
+	--gray-50: #ffffff;
+	--gray-100: #eeeeee;
+	--gray-200: #dddddd;
+	--gray-300: #cccccc;
+	--gray-400: #aaaaaa;
+	--gray-500: #808080;
+	--gray-600: #666666;
+	--gray-700: #393939;
+	--gray-800: #202020;
+	--gray-900: #111111;
+	--gray-950: #000000;
+	--primary: var(--macos-classic-blue);
+	--on-primary: #ffffff;
+	--primary-light: var(--macos-classic-blue-light);
+	--primary-dark: #000088;
+	--primary-container: #ccccff;
+	--on-primary-container: #000055;
+	--secondary: var(--macos-classic-green);
+	--on-secondary: #ffffff;
+	--secondary-light: #218351;
+	--secondary-dark: #10462b;
+	--secondary-container: #dcefe4;
+	--on-secondary-container: #000000;
+	--tertiary: #393939;
+	--on-tertiary: #ffffff;
+	--tertiary-container: #dedede;
+	--on-tertiary-container: #000000;
+	--error: var(--macos-classic-red);
+	--on-error: #ffffff;
+	--error-light: #a92c2c;
+	--error-dark: #570e0e;
+	--error-container: #f3dddd;
+	--on-error-container: #000000;
+	--success: var(--macos-classic-green);
+	--on-success: #ffffff;
+	--success-light: color-mix(in oklab, var(--macos-classic-green), white 30%);
+	--success-dark: color-mix(in oklab, var(--macos-classic-green), black 30%);
+	--success-container: #dcefe4;
+	--on-success-container: #000000;
+	--info: var(--macos-classic-blue);
+	--on-info: #ffffff;
+	--info-light: var(--macos-classic-blue-light);
+	--info-dark: #000088;
+	--info-container: #ccccff;
+	--on-info-container: #000055;
+	--warning: var(--macos-classic-amber);
+	--on-warning: #ffffff;
+	--warning-light: color-mix(in oklab, var(--macos-classic-amber), white 30%);
+	--warning-dark: color-mix(in oklab, var(--macos-classic-amber), black 30%);
+	--warning-container: #fff0c4;
+	--on-warning-container: #000000;
+	--neutral: var(--macos-classic-muted);
+	--surface: var(--macos-classic-surface);
+	--on-surface: var(--macos-classic-text);
+	--surface-container-lowest: var(--macos-classic-surface);
+	--on-surface-container-lowest: #000000;
+	--surface-container-low: #eeeeee;
+	--on-surface-container-low: #000000;
+	--surface-container: var(--macos-classic-container);
+	--on-surface-container: #000000;
+	--surface-container-high: #aaaaaa;
+	--on-surface-container-high: #000000;
+	--surface-container-highest: #808080;
+	--on-surface-container-highest: #000000;
+	--background: var(--macos-classic-canvas);
+	--on-background: var(--macos-classic-text);
+	--rui-border-color: var(--macos-classic-shadow);
+	--rui-control-border-color: var(--macos-classic-dark);
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--macos-classic-blue-light);
+	--on-focus-ring: #ffffff;
+	--link: var(--macos-classic-blue);
+	--overlay: rgb(0 0 0 / 50%);
+	--background-code: #ffffff;
+	--on-background-code: #000000;
+}
+
+:where(.dark), :root.dark[data-rui-theme='macos-classic'] {
+	--gray-50: #ffffff;
+	--gray-100: #eeeeee;
+	--gray-200: #d0d0d0;
+	--gray-300: #b5b5b5;
+	--gray-400: #999999;
+	--gray-500: #777777;
+	--gray-600: #555555;
+	--gray-700: #383838;
+	--gray-800: #222222;
+	--gray-900: #111111;
+	--gray-950: #000000;
+	--primary: var(--macos-classic-blue);
+	--on-primary: #000000;
+	--primary-container: #244a9b;
+	--on-primary-container: #ffffff;
+	--secondary: var(--macos-classic-green);
+	--on-secondary: #000000;
+	--secondary-container: #21583a;
+	--on-secondary-container: #ffffff;
+	--tertiary: #dedede;
+	--on-tertiary: #000000;
+	--tertiary-container: #444444;
+	--on-tertiary-container: #ffffff;
+	--error: var(--macos-classic-red);
+	--on-error: #000000;
+	--error-container: #641d1d;
+	--on-error-container: #ffffff;
+	--success: var(--macos-classic-green);
+	--on-success: #000000;
+	--success-container: #21583a;
+	--on-success-container: #ffffff;
+	--info: var(--macos-classic-blue);
+	--on-info: #000000;
+	--info-container: #244a9b;
+	--on-info-container: #ffffff;
+	--warning: var(--macos-classic-amber);
+	--on-warning: #000000;
+	--warning-container: #624900;
+	--on-warning-container: #ffffff;
+	--neutral: var(--macos-classic-muted);
+	--surface: var(--macos-classic-surface);
+	--on-surface: var(--macos-classic-text);
+	--surface-container-lowest: #171717;
+	--on-surface-container-lowest: #ffffff;
+	--surface-container-low: #222222;
+	--on-surface-container-low: #ffffff;
+	--surface-container: var(--macos-classic-container);
+	--on-surface-container: #ffffff;
+	--surface-container-high: #444444;
+	--on-surface-container-high: #ffffff;
+	--surface-container-highest: #555555;
+	--on-surface-container-highest: #ffffff;
+	--background: var(--macos-classic-canvas);
+	--on-background: var(--macos-classic-text);
+	--rui-border-color: #888888;
+	--rui-control-border-color: #b0b0b0;
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--macos-classic-blue);
+	--on-focus-ring: #000000;
+	--link: #a9c5ff;
+	--background-code: #171717;
+	--on-background-code: #ffffff;
+}

package/dist/tokens/roles/macos.css

@@ -0,0 +1,155 @@
+:where(:root), :root[data-rui-theme='macos'] {
+	--gray-50: #ffffff;
+	--gray-100: #f5f5f7;
+	--gray-200: #e9e9ed;
+	--gray-300: #d1d1d6;
+	--gray-400: #aeaeb2;
+	--gray-500: #8e8e93;
+	--gray-600: #6e6e73;
+	--gray-700: #55555b;
+	--gray-800: #363638;
+	--gray-900: #1d1d1f;
+	--gray-950: #000000;
+	--primary: var(--macos-blue);
+	--on-primary: #ffffff;
+	--primary-light: var(--macos-blue-light);
+	--primary-dark: #004591;
+	--primary-container: #dcecff;
+	--on-primary-container: #002f68;
+	--secondary: var(--macos-purple);
+	--on-secondary: #ffffff;
+	--secondary-light: #8154c5;
+	--secondary-dark: #4b277f;
+	--secondary-container: #eee5fb;
+	--on-secondary-container: #35204f;
+	--tertiary: #3a3a3c;
+	--on-tertiary: #ffffff;
+	--tertiary-container: #e9e9ed;
+	--on-tertiary-container: #1d1d1f;
+	--error: var(--macos-red);
+	--on-error: #ffffff;
+	--error-light: #c93141;
+	--error-dark: #6c101c;
+	--error-container: #fbe3e5;
+	--on-error-container: #5d1119;
+	--success: var(--macos-green);
+	--on-success: #ffffff;
+	--success-light: #238544;
+	--success-dark: #0e4823;
+	--success-container: #e0f3e5;
+	--on-success-container: #143b20;
+	--info: var(--macos-blue);
+	--on-info: #ffffff;
+	--info-light: var(--macos-blue-light);
+	--info-dark: #004591;
+	--info-container: #dcecff;
+	--on-info-container: #002f68;
+	--warning: var(--macos-amber);
+	--on-warning: #ffffff;
+	--warning-light: #895900;
+	--warning-dark: #493000;
+	--warning-container: #fff1d0;
+	--on-warning-container: #493000;
+	--neutral: var(--macos-muted);
+	--surface: var(--macos-surface);
+	--on-surface: var(--macos-text);
+	--surface-container-lowest: #ffffff;
+	--on-surface-container-lowest: #1d1d1f;
+	--surface-container-low: var(--macos-canvas);
+	--on-surface-container-low: #1d1d1f;
+	--surface-container: var(--macos-subtle);
+	--on-surface-container: #1d1d1f;
+	--surface-container-high: #d1d1d6;
+	--on-surface-container-high: #1d1d1f;
+	--surface-container-highest: #aeaeb2;
+	--on-surface-container-highest: #1d1d1f;
+	--background: var(--macos-canvas);
+	--on-background: var(--macos-text);
+	--rui-border-color: var(--macos-separator);
+	--rui-control-border-color: var(--macos-border);
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--macos-blue);
+	--on-focus-ring: #ffffff;
+	--link: #0053b4;
+	--overlay: rgb(0 0 0 / 45%);
+	--background-code: #e9e9ed;
+	--on-background-code: #1d1d1f;
+}
+
+:where(.dark), :root.dark[data-rui-theme='macos'] {
+	--gray-50: #ffffff;
+	--gray-100: #f5f5f7;
+	--gray-200: #d1d1d6;
+	--gray-300: #aeaeb2;
+	--gray-400: #8e8e93;
+	--gray-500: #6e6e73;
+	--gray-600: #55555b;
+	--gray-700: #3a3a3c;
+	--gray-800: #2c2c2e;
+	--gray-900: #1c1c1e;
+	--gray-950: #000000;
+	--primary: var(--macos-blue);
+	--on-primary: #000000;
+	--primary-light: var(--macos-blue-light);
+	--primary-dark: #1475d1;
+	--primary-container: #12375d;
+	--on-primary-container: #d5eaff;
+	--secondary: var(--macos-purple);
+	--on-secondary: #000000;
+	--secondary-light: #d9c0ff;
+	--secondary-dark: #9466d8;
+	--secondary-container: #47325f;
+	--on-secondary-container: #f0e4ff;
+	--tertiary: #d1d1d6;
+	--on-tertiary: #000000;
+	--tertiary-container: #3a3a3c;
+	--on-tertiary-container: #f5f5f7;
+	--error: var(--macos-red);
+	--on-error: #000000;
+	--error-light: #ffb9bd;
+	--error-dark: #ff939a;
+	--error-container: #61252b;
+	--on-error-container: #ffe7e9;
+	--success: var(--macos-green);
+	--on-success: #000000;
+	--success-light: #a0f4b5;
+	--success-dark: #43b864;
+	--success-container: #20472b;
+	--on-success-container: #d7ffe1;
+	--info: var(--macos-blue);
+	--on-info: #000000;
+	--info-light: var(--macos-blue-light);
+	--info-dark: #1475d1;
+	--info-container: #12375d;
+	--on-info-container: #d5eaff;
+	--warning: var(--macos-amber);
+	--on-warning: #000000;
+	--warning-light: #ffe09a;
+	--warning-dark: #edb94e;
+	--warning-container: #57431f;
+	--on-warning-container: #ffefc9;
+	--neutral: var(--macos-muted);
+	--surface: var(--macos-surface);
+	--on-surface: var(--macos-text);
+	--surface-container-lowest: #1c1c1e;
+	--on-surface-container-lowest: #f5f5f7;
+	--surface-container-low: #1c1c1e;
+	--on-surface-container-low: #f5f5f7;
+	--surface-container: var(--macos-subtle);
+	--on-surface-container: #f5f5f7;
+	--surface-container-high: #48484a;
+	--on-surface-container-high: #f5f5f7;
+	--surface-container-highest: #636366;
+	--on-surface-container-highest: #ffffff;
+	--background: var(--macos-canvas);
+	--on-background: var(--macos-text);
+	--rui-border-color: var(--macos-separator);
+	--rui-control-border-color: var(--macos-border);
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--macos-blue-light);
+	--on-focus-ring: #000000;
+	--link: #8cc2ff;
+	--overlay: rgb(0 0 0 / 60%);
+	--background-code: #2c2c2e;
+	--on-background-code: #f5f5f7;
+}