@moderneinc/design-system-tokens 6.0.0-next.02da4a

package/dist/semantic-colors.css

@@ -0,0 +1,581 @@
+:root {  --mod-icons-hover-border: rgba(62, 123, 246, 0.3);
+  --mod-icons-pressed-background: rgba(62, 123, 246, 0.1);
+  --mod-icons-inverse: #f1f0ea;
+  --mod-icons-hover: #1055e2;
+  --mod-icons-hover-background: rgba(62, 123, 246, 0.1);
+  --mod-icons-disabled: rgba(35, 35, 66, 0.08);
+  --mod-icons-placeholder: #62627a;
+  --mod-icons-pressed: #0046b5;
+  --mod-icons-utility: #62627a;
+  --mod-icons-default: #232342;
+  --mod-icons-active: #0046b5;
+  --mod-surfaces-highlight-background: rgba(62, 123, 246, 0.1);
+  --mod-surfaces-active-highlight: rgba(182, 191, 255, 0.4);
+  --mod-surfaces-data-grid-header: #f2efe7;
+  --mod-surfaces-data-grid-selected: rgba(62, 123, 246, 0.1);
+  --mod-surfaces-data-grid-selected-hover: rgba(62, 123, 246, 0.1);
+  --mod-surfaces-data-grid-hover: #f4f2eb;
+  --mod-surfaces-data-grid-default: #fbfaf6;
+  --mod-surfaces-data-grid-border: rgba(35, 35, 66, 0.12);
+  --mod-surfaces-data-grid-border-strong: rgba(35, 35, 66, 0.5);
+  --mod-surfaces-data-grid-stripe: #f4f2eb;
+  --mod-surfaces-data-grid-focused: rgba(62, 123, 246, 0.1);
+  --mod-surfaces-data-grid-pinned: #f2f0ea;
+  --mod-surfaces-data-grid-disabled: #edebe2;
+  --mod-surfaces-data-grid-background: #fbfaf6;
+  --mod-surfaces-toggle-knob: #fbfaf6;
+  --mod-surfaces-page: #f2f0ea;
+  --mod-surfaces-card: #fbfaf6;
+  --mod-surfaces-card-header: #f2efe7;
+  --mod-surfaces-tab-active: #fbfaf6;
+  --mod-surfaces-list-hover: #f4f2eb;
+  --mod-surfaces-shadow-neutral: rgba(31, 41, 55, 0.1);
+  --mod-surfaces-shadow-primary: rgba(47, 66, 255, 0.1);
+  --mod-surfaces-tooltip: #4b5563;
+  --mod-surfaces-scrim: rgba(31, 41, 55, 0.2);
+  --mod-surfaces-tab-secondary-background: #dfddd1;
+  --mod-surfaces-snackbar-dark-mode: #fbefed;
+  --mod-surfaces-snackbar-brand: #131e7a;
+  --mod-surfaces-snackbar-light-mode: #eaf6ec;
+  --mod-surfaces-white: #fbfaf6;
+  --mod-surfaces-black: #17171c;
+  --mod-typography-search-input-background: #ffffff;
+  --mod-typography-link-default-legacy: #0046b5;
+  --mod-typography-link-hover: #2637e6;
+  --mod-typography-navigation-search-highlight-text: #1055e2;
+  --mod-typography-navigation-search-highlight-background: rgba(47, 66, 255, 0);
+  --mod-typography-navigation-search-input-background: #f2f3ff;
+  --mod-typography-navigation-search-highlight-background-active: #dce0ff;
+  --mod-typography-navigation-default: #232342;
+  --mod-typography-link-white-legacy: #ffffff;
+  --mod-typography-link-white-hover: #ffffff;
+  --mod-typography-tab-disabled: #6b7280;
+  --mod-typography-tab-inactive: #232342;
+  --mod-typography-tab-active: #1055e2;
+  --mod-typography-tooltip-secondary: #62627a;
+  --mod-typography-tooltip-default: #ffffff;
+  --mod-typography-input-placeholder: #6b7280;
+  --mod-typography-input-default: #232342;
+  --mod-typography-input-label: #232342;
+  --mod-typography-input-helper: #62627a;
+  --mod-typography-code-primary: #232342;
+  --mod-typography-code-secondary: #62627a;
+  --mod-typography-button-disabled: #6b7280;
+  --mod-typography-link-primary: #0046b5;
+  --mod-typography-link-disabled: #b6bfff;
+  --mod-typography-link-default: #0046b5;
+  --mod-typography-link-white: #ffffff;
+  --mod-typography-error: #c9291c;
+  --mod-typography-success: #1d5937;
+  --mod-typography-warning: #935b00;
+  --mod-typography-legal: #9ca3af;
+  --mod-typography-body-secondary: #4d4d60;
+  --mod-typography-body: #232342;
+  --mod-border-overlay: rgba(255, 255, 255, 0);
+  --mod-border-subtle: rgba(35, 35, 66, 0.08);
+  --mod-border-strong: rgba(35, 35, 66, 0.5);
+  --mod-border-hairline: rgba(35, 35, 66, 0.12);
+  --mod-border-primary: rgba(35, 35, 66, 0.12);
+  --mod-border-secondary: rgba(35, 35, 66, 0.12);
+  --mod-border-focus: #1055e2;
+  --mod-status-active-dark: #5530a8;
+  --mod-status-active-default: #7048c8;
+  --mod-status-active-light: #ede8f8;
+  --mod-status-active-transparent: rgba(85, 48, 168, 0.5);
+  --mod-status-active-border: #c9bbea;
+  --mod-status-queued-dark: #7858c0;
+  --mod-status-queued-default: #9472d4;
+  --mod-status-queued-light: #f0ecf9;
+  --mod-status-queued-transparent: rgba(120, 88, 192, 0.5);
+  --mod-status-queued-border-nested: #d2c6ed;
+  --mod-status-canceled-dark: #5c5040;
+  --mod-status-canceled-default: #7a6e5c;
+  --mod-status-canceled-light: #f2efea;
+  --mod-status-canceled-transparent: rgba(92, 80, 64, 0.45);
+  --mod-status-canceled-border: #d5cec3;
+  --mod-status-success-border-nested: #bfe2c8;
+  --mod-status-success-light: #eef9f2;
+  --mod-status-success-default: #237341;
+  --mod-status-success-transparent: rgba(29, 89, 55, 0.55);
+  --mod-status-success-dark: #1d5937;
+  --mod-status-error-border-nested: #f0b4ac;
+  --mod-status-error-light: #fbefed;
+  --mod-status-error-default: #d43c2a;
+  --mod-status-error-transparent: rgba(201, 41, 28, 0.5);
+  --mod-status-error-dark: #c9291c;
+  --mod-status-warning-border-nested: #e6d9a8;
+  --mod-status-warning-light: #fff1e0;
+  --mod-status-warning-default: #b07210;
+  --mod-status-warning-transparent: rgba(147, 91, 0, 0.45);
+  --mod-status-warning-dark: #b68b12;
+  --mod-status-info-border: #c7d7f6;
+  --mod-status-info-dark: #1a4b8c;
+  --mod-status-info-default: #2668b5;
+  --mod-status-info-light: #e8f0fa;
+  --mod-status-info-transparent: rgba(26, 75, 140, 0.5);
+  --mod-status-neutral-border: #d1cfcb;
+  --mod-status-neutral-dark: #4a453e;
+  --mod-status-neutral-default: #706960;
+  --mod-status-neutral-light: #f0efed;
+  --mod-status-neutral-transparent: rgba(74, 69, 62, 0.45);
+  --mod-status-success-text: #1d5937;
+  --mod-status-success-tint: rgba(48, 242, 132, 0.15);
+  --mod-status-success-border: rgba(29, 89, 55, 0.65);
+  --mod-status-error-text: #c9291c;
+  --mod-status-error-tint: #fbefed;
+  --mod-status-error-border: #f0b4ac;
+  --mod-status-warning-text: #b68b12;
+  --mod-status-warning-tint: rgba(255, 168, 61, 0.16);
+  --mod-status-warning-border: rgba(147, 91, 0, 0.45);
+  --mod-status-queued-tint: rgba(157, 91, 232, 0.1);
+  --mod-status-queued-border: rgba(157, 91, 232, 0.35);
+  --mod-link-default: #1055e2;
+  --mod-link-hover: #1055e2;
+  --mod-link-tint: rgba(62, 123, 246, 0.1);
+  --mod-link-tint-border: rgba(62, 123, 246, 0.3);
+  --mod-control-border: rgba(35, 35, 66, 0.5);
+  --mod-control-border-selected: #1055e2;
+  --mod-control-glyph: #1055e2;
+  --mod-control-checked-bg: #1055e2;
+  --mod-control-checked-fg: #ffffff;
+  --mod-progress-track: rgba(62, 123, 246, 0.1);
+  --mod-progress-fill: #1055e2;
+  --mod-progress-label: #1055e2;
+  --mod-illustration-panel: #fbfaf6;
+  --mod-illustration-stroke: rgba(35, 35, 66, 0.5);
+  --mod-illustration-stroke-muted: #62627a;
+  --mod-illustration-inset: #edebe2;
+  --mod-illustration-accent: #3e5be8;
+  --mod-illustration-positive: #1d5937;
+  --mod-dataviz-categorical-coral: #ff6f61;
+  --mod-dataviz-categorical-orange: #ff8f52;
+  --mod-dataviz-categorical-tangerine: #ffa83d;
+  --mod-dataviz-categorical-gold: #ffd34d;
+  --mod-dataviz-categorical-green: #30f284;
+  --mod-dataviz-categorical-periwinkle: #3e5be8;
+  --mod-dataviz-categorical-teal: #25d0c0;
+  --mod-dataviz-categorical-lilac: #b39deb;
+  --mod-dataviz-categorical-magenta: #e6399b;
+  --mod-dataviz-categorical-lime: #c7e84b;
+  --mod-dataviz-boundary-coral: #a63325;
+  --mod-dataviz-boundary-orange: #a34e14;
+  --mod-dataviz-boundary-tangerine: #935b00;
+  --mod-dataviz-boundary-gold: #806a00;
+  --mod-dataviz-boundary-green: #1d5937;
+  --mod-dataviz-boundary-na: #82806f;
+  --mod-dataviz-boundary-periwinkle: #16306b;
+  --mod-dataviz-boundary-teal: #0e4a45;
+  --mod-dataviz-boundary-lilac: #3f1340;
+  --mod-dataviz-boundary-magenta: #7a1e52;
+  --mod-dataviz-boundary-lime: #4f5a12;
+  --mod-dataviz-na: #dedbd0;
+  --mod-dataviz-grid: rgba(35, 35, 66, 0.12);
+  --mod-toast-success-text: #1d5937;
+  --mod-toast-success-bg: #eaf6ec;
+  --mod-toast-success-border: #bfe2c8;
+  --mod-toast-warning-text: #8f6c0c;
+  --mod-toast-warning-bg: #faf4e1;
+  --mod-toast-warning-border: #e6d9a8;
+  --mod-toast-error-text: #c9291c;
+  --mod-toast-error-bg: #fbefed;
+  --mod-toast-error-border: #f0b4ac;
+  --mod-toast-info-text: #1055e2;
+  --mod-toast-info-bg: #eef3fc;
+  --mod-toast-info-border: #c7d7f6;
+  --mod-surface-canvas-chrome: #f2f0ea;
+  --mod-surface-canvas-content: #fbfaf6;
+  --mod-surface-field: #fbfaf6;
+  --mod-surface-sunken: #edebe2;
+  --mod-surface-sunken2: #e4e1d6;
+  --mod-surface-row-hover: #f4f2eb;
+  --mod-surface-scrim: rgba(35, 35, 66, 0.14);
+  --mod-surface-tooltip: #2d2d36;
+  --mod-surface-card-frosted: rgba(251, 250, 246, 0.78);
+  --mod-text-primary: #232342;
+  --mod-text-muted: #4d4d60;
+  --mod-text-link: #0046b5;
+  --mod-text-tab-active: #16306b;
+  --mod-text-on-primary: #fbfaf6;
+  --mod-text-code-primary: #1b2230;
+  --mod-text-code-secondary: #62627a;
+  --mod-text-input-placeholder: #62627a;
+  --mod-button-primary-bg: #232342;
+  --mod-button-primary-fg: #fbfaf6;
+  --mod-button-primary-bg-hover: #2c2c50;
+  --mod-button-destructive-bg: #c9291c;
+  --mod-button-destructive-bg-hover: #a63325;
+  --mod-data-periwinkle: #3e5be8;
+  --mod-data-teal: #25d0c0;
+  --mod-data-lilac: #b39deb;
+  --mod-data-coral: #ff6f61;
+  --mod-data-green: #30f284;
+  --mod-data-yellow: #ffd34d;
+  --mod-data-orange1: #ffa83d;
+  --mod-data-orange2: #ff8f52;
+  --mod-data-orange3: #ff6f61;
+  --mod-data-red1: #fa826f;
+  --mod-data-red2: #c9291c;
+  --mod-data-red3: #a63325;
+  --mod-skeleton-background: #e4e1d6;
+  --mod-skeleton-wave: rgba(255, 255, 255, 0.5);
+  --mod-accent-default: #1055e2;
+  --mod-accent-deep: #16306b;
+  --mod-accent-tint: rgba(62, 123, 246, 0.1);
+  --mod-accent-border: rgba(62, 123, 246, 0.3);
+  --mod-accent-primary-fg: #ffffff;
+  --mod-accent-glow: rgba(157, 91, 232, 0.13);
+  --mod-accent-glow-secondary: rgba(230, 57, 155, 0.16);
+  --mod-role-violet-border: rgba(157, 91, 232, 0.35);
+  --mod-role-magenta-tint: rgba(230, 57, 155, 0.14);
+  --mod-role-magenta-text: #e6399b;
+  --mod-role-magenta-border: rgba(230, 57, 155, 0.4);
+  --mod-role-teal-tint: rgba(14, 74, 69, 0.16);
+  --mod-role-teal-text: #0e4a45;
+  --mod-role-teal-border: rgba(14, 74, 69, 0.42);
+  --mod-role-violet-tint: rgba(157, 91, 232, 0.1);
+  --mod-role-violet-text: #9d5be8;
+  --mod-avatar-user-default-bg: #232342;
+  --mod-avatar-user-default-text: #fbfaf6;
+  --mod-avatar-initials-text1: #9d5be8;
+  --mod-avatar-initials-text2: #1d5937;
+  --mod-avatar-initials-text3: #935b00;
+  --mod-avatar-initials-text4: #e6399b;
+  --mod-avatar-initials-text5: #7a1e52;
+  --mod-avatar-initials-text6: #0e4a45;
+  --mod-avatar-initials-text7: #1055e2;
+  --mod-avatar-initials-border1: rgba(157, 91, 232, 0.35);
+  --mod-avatar-initials-border2: rgba(48, 242, 132, 0.35);
+  --mod-avatar-initials-border3: rgba(255, 168, 61, 0.35);
+  --mod-avatar-initials-border4: rgba(230, 57, 155, 0.4);
+  --mod-avatar-initials-border5: rgba(157, 91, 232, 0.35);
+  --mod-avatar-initials-border6: rgba(14, 74, 69, 0.42);
+  --mod-avatar-initials-border7: rgba(62, 123, 246, 0.35);
+  --mod-avatar-initials-background1: rgba(157, 91, 232, 0.1);
+  --mod-avatar-initials-background2: rgba(48, 242, 132, 0.1);
+  --mod-avatar-initials-background3: rgba(255, 168, 61, 0.1);
+  --mod-avatar-initials-background4: rgba(230, 57, 155, 0.14);
+  --mod-avatar-initials-background5: rgba(157, 91, 232, 0.1);
+  --mod-avatar-initials-background6: rgba(14, 74, 69, 0.16);
+  --mod-avatar-initials-background7: rgba(62, 123, 246, 0.1);
+  --mod-input-radio: #0046b5;
+  --mod-input-checkbox: #0046b5;
+  --mod-input-hover-background: #f2f0ea;
+  --mod-input-background: #fbfaf6;
+  --mod-input-disabled-background: #f9fafb;
+  --mod-buttons-primary-hover: #2c2c50;
+  --mod-buttons-primary-disabled: #f3f4f6;
+  --mod-buttons-primary-pressed: #2c2c50;
+  --mod-buttons-primary-default: #232342;
+  --mod-buttons-secondary-default-border: rgba(35, 35, 66, 0.5);
+  --mod-buttons-secondary-hover-background: #edebe2;
+  --mod-buttons-secondary-pressed-background: #e4e1d6;
+  --mod-buttons-secondary-disabled-background: #f4f2eb;
+  --mod-buttons-secondary-default-background: #fbfaf6;
+  --mod-buttons-secondary-default: #232342;
+  --mod-buttons-tertiary-default: #232342;
+  --mod-buttons-tertiary-hover: #232342;
+  --mod-buttons-tertiary-pressed: #232342;
+  --mod-buttons-tertiary-disabled: #6b7280;
+  --mod-buttons-destructive: #c9291c;
+  --mod-buttons-navigation-active: rgba(62, 123, 246, 0.1);
+  --mod-buttons-navigation-default-border: rgba(62, 123, 246, 0.3);
+  --mod-buttons-navigation-hover-background: rgba(62, 123, 246, 0.1);
+  --mod-buttons-navigation-pressed-background: rgba(62, 123, 246, 0.1);
+  --mod-buttons-navigation-active-border: #1055e2;
+  --mod-activity-recipe-run: #9d5be8;
+  --mod-activity-commit-job: #1055e2;
+  --mod-activity-visualization: #27aa88;
+  --mod-tab-secondary-background: #e5e7eb;
+  --mod-code-background: #edebe2;
+  --mod-brand: #1055e2;}
+
+[data-theme="dark"] {  --mod-icons-hover-border: rgba(127, 169, 249, 0.4);
+  --mod-icons-pressed-background: rgba(127, 169, 249, 0.16);
+  --mod-icons-inverse: #232342;
+  --mod-icons-hover: #7fa9f9;
+  --mod-icons-hover-background: rgba(127, 169, 249, 0.16);
+  --mod-icons-disabled: rgba(240, 240, 246, 0.08);
+  --mod-icons-placeholder: #9c9ca8;
+  --mod-icons-pressed: #73aaff;
+  --mod-icons-utility: #9c9ca8;
+  --mod-icons-default: #f1f0ea;
+  --mod-icons-active: #73aaff;
+  --mod-surfaces-highlight-background: rgba(127, 169, 249, 0.16);
+  --mod-surfaces-active-highlight: rgba(62, 123, 246, 0.1);
+  --mod-surfaces-data-grid-header: #2d2d36;
+  --mod-surfaces-data-grid-selected: rgba(127, 169, 249, 0.16);
+  --mod-surfaces-data-grid-selected-hover: rgba(127, 169, 249, 0.16);
+  --mod-surfaces-data-grid-hover: #2e2e38;
+  --mod-surfaces-data-grid-default: #26262e;
+  --mod-surfaces-data-grid-border: rgba(240, 240, 246, 0.12);
+  --mod-surfaces-data-grid-border-strong: rgba(240, 240, 246, 0.38);
+  --mod-surfaces-data-grid-stripe: #222229;
+  --mod-surfaces-data-grid-focused: rgba(127, 169, 249, 0.16);
+  --mod-surfaces-data-grid-pinned: #2a2a32;
+  --mod-surfaces-data-grid-disabled: #1b1b21;
+  --mod-surfaces-data-grid-background: #26262e;
+  --mod-surfaces-toggle-knob: #8c8c96;
+  --mod-surfaces-page: #141419;
+  --mod-surfaces-card: #26262e;
+  --mod-surfaces-card-header: #2d2d36;
+  --mod-surfaces-tab-active: #26262e;
+  --mod-surfaces-list-hover: #2e2e38;
+  --mod-surfaces-shadow-neutral: rgba(0, 0, 0, 0.6);
+  --mod-surfaces-shadow-primary: rgba(16, 24, 128, 0.4);
+  --mod-surfaces-tooltip: #f1f0ea;
+  --mod-surfaces-scrim: rgba(0, 0, 0, 0.5);
+  --mod-surfaces-tab-secondary-background: #2d2d35;
+  --mod-surfaces-snackbar-dark-mode: #f1f0ea;
+  --mod-surfaces-snackbar-brand: #131e7a;
+  --mod-surfaces-snackbar-light-mode: #33333d;
+  --mod-surfaces-white: #26262e;
+  --mod-surfaces-black: #17171c;
+  --mod-typography-search-input-background: #222229;
+  --mod-typography-link-default-legacy: #73aaff;
+  --mod-typography-link-hover: #f2f3ff;
+  --mod-typography-navigation-search-highlight-text: #7fa9f9;
+  --mod-typography-navigation-search-highlight-background: rgba(62, 123, 246, 0.16);
+  --mod-typography-navigation-search-input-background: #222229;
+  --mod-typography-navigation-search-highlight-background-active: rgba(62, 123, 246, 0.35);
+  --mod-typography-navigation-default: #f1f0ea;
+  --mod-typography-link-white-legacy: #ffffff;
+  --mod-typography-link-white-hover: #ffffff;
+  --mod-typography-tab-disabled: #9c9ca8;
+  --mod-typography-tab-inactive: #f1f0ea;
+  --mod-typography-tab-active: #7fa9f9;
+  --mod-typography-tooltip-secondary: #9c9ca8;
+  --mod-typography-tooltip-default: #232342;
+  --mod-typography-input-placeholder: #9c9ca8;
+  --mod-typography-input-default: #f1f0ea;
+  --mod-typography-input-label: #f1f0ea;
+  --mod-typography-input-helper: #9c9ca8;
+  --mod-typography-code-primary: #f1f0ea;
+  --mod-typography-code-secondary: #9c9ca8;
+  --mod-typography-button-disabled: #9c9ca8;
+  --mod-typography-link-primary: #73aaff;
+  --mod-typography-link-disabled: #75757f;
+  --mod-typography-link-default: #73aaff;
+  --mod-typography-link-white: #f9fafb;
+  --mod-typography-error: #fa826f;
+  --mod-typography-success: #30f284;
+  --mod-typography-warning: #ffa83d;
+  --mod-typography-legal: #9c9ca8;
+  --mod-typography-body-secondary: #b9b9c6;
+  --mod-typography-body: #f1f0ea;
+  --mod-border-overlay: rgba(240, 240, 246, 0.08);
+  --mod-border-subtle: rgba(240, 240, 246, 0.08);
+  --mod-border-strong: rgba(240, 240, 246, 0.38);
+  --mod-border-hairline: rgba(240, 240, 246, 0.12);
+  --mod-border-primary: rgba(240, 240, 246, 0.12);
+  --mod-border-secondary: rgba(240, 240, 246, 0.12);
+  --mod-border-focus: #7fa9f9;
+  --mod-status-active-dark: #9b73f0;
+  --mod-status-active-default: #825ae1;
+  --mod-status-active-light: #231d34;
+  --mod-status-active-transparent: rgba(125, 85, 220, 0.45);
+  --mod-status-active-border: #402e66;
+  --mod-status-queued-dark: #b99bf2;
+  --mod-status-queued-default: #a07deb;
+  --mod-status-queued-light: #28223a;
+  --mod-status-queued-transparent: rgba(145, 110, 230, 0.45);
+  --mod-status-queued-border-nested: #4d3b6b;
+  --mod-status-canceled-dark: #a59b8a;
+  --mod-status-canceled-default: #948876;
+  --mod-status-canceled-light: #232224;
+  --mod-status-canceled-transparent: rgba(148, 136, 118, 0.35);
+  --mod-status-canceled-border: #474033;
+  --mod-status-success-border-nested: #264d33;
+  --mod-status-success-light: #192f26;
+  --mod-status-success-default: #37c36e;
+  --mod-status-success-transparent: rgba(55, 195, 110, 0.45);
+  --mod-status-success-dark: #30f284;
+  --mod-status-error-border-nested: #612921;
+  --mod-status-error-light: #2e1b1b;
+  --mod-status-error-default: #eb4b2d;
+  --mod-status-error-transparent: rgba(235, 75, 45, 0.42);
+  --mod-status-error-dark: #fa826f;
+  --mod-status-warning-border-nested: #59451a;
+  --mod-status-warning-light: #34281d;
+  --mod-status-warning-default: #f0a028;
+  --mod-status-warning-transparent: rgba(240, 160, 40, 0.45);
+  --mod-status-warning-dark: #e8ba4c;
+  --mod-status-info-border: #263b61;
+  --mod-status-info-dark: #69aaf0;
+  --mod-status-info-default: #468ee4;
+  --mod-status-info-light: #1a2435;
+  --mod-status-info-transparent: rgba(65, 135, 225, 0.42);
+  --mod-status-neutral-border: #423d38;
+  --mod-status-neutral-dark: #aca598;
+  --mod-status-neutral-default: #9b9487;
+  --mod-status-neutral-light: #242326;
+  --mod-status-neutral-transparent: rgba(155, 148, 135, 0.38);
+  --mod-status-success-text: #30f284;
+  --mod-status-success-tint: rgba(48, 242, 132, 0.13);
+  --mod-status-success-border: rgba(48, 242, 132, 0.55);
+  --mod-status-error-text: #fa826f;
+  --mod-status-error-tint: rgba(252, 71, 50, 0.12);
+  --mod-status-error-border: rgba(252, 71, 50, 0.42);
+  --mod-status-warning-text: #e8ba4c;
+  --mod-status-warning-tint: rgba(255, 168, 61, 0.12);
+  --mod-status-warning-border: rgba(255, 168, 61, 0.5);
+  --mod-status-queued-tint: rgba(157, 91, 232, 0.16);
+  --mod-status-queued-border: rgba(157, 91, 232, 0.45);
+  --mod-link-default: #7fa9f9;
+  --mod-link-hover: #7fa9f9;
+  --mod-link-tint: rgba(127, 169, 249, 0.16);
+  --mod-link-tint-border: rgba(127, 169, 249, 0.4);
+  --mod-control-border: rgba(240, 240, 246, 0.38);
+  --mod-control-border-selected: #7fa9f9;
+  --mod-control-glyph: #7fa9f9;
+  --mod-control-checked-bg: #7fa9f9;
+  --mod-control-checked-fg: #0b1220;
+  --mod-progress-track: rgba(127, 169, 249, 0.16);
+  --mod-progress-fill: #7fa9f9;
+  --mod-progress-label: #7fa9f9;
+  --mod-illustration-panel: #26262e;
+  --mod-illustration-stroke: rgba(240, 240, 246, 0.38);
+  --mod-illustration-stroke-muted: #9c9ca8;
+  --mod-illustration-inset: #2a2a32;
+  --mod-illustration-accent: #8ca0f5;
+  --mod-illustration-positive: #30f284;
+  --mod-dataviz-categorical-coral: #ff6f61;
+  --mod-dataviz-categorical-orange: #ff8f52;
+  --mod-dataviz-categorical-tangerine: #ffa83d;
+  --mod-dataviz-categorical-gold: #ffd34d;
+  --mod-dataviz-categorical-green: #30f284;
+  --mod-dataviz-categorical-periwinkle: #8ca0f5;
+  --mod-dataviz-categorical-teal: #25d0c0;
+  --mod-dataviz-categorical-lilac: #b39deb;
+  --mod-dataviz-categorical-magenta: #e6399b;
+  --mod-dataviz-categorical-lime: #c7e84b;
+  --mod-dataviz-boundary-coral: #a63325;
+  --mod-dataviz-boundary-orange: #a34e14;
+  --mod-dataviz-boundary-tangerine: #935b00;
+  --mod-dataviz-boundary-gold: #806a00;
+  --mod-dataviz-boundary-green: #1d5937;
+  --mod-dataviz-boundary-na: #75757f;
+  --mod-dataviz-boundary-periwinkle: #16306b;
+  --mod-dataviz-boundary-teal: #0e4a45;
+  --mod-dataviz-boundary-lilac: #3f1340;
+  --mod-dataviz-boundary-magenta: #7a1e52;
+  --mod-dataviz-boundary-lime: #4f5a12;
+  --mod-dataviz-na: #75757f;
+  --mod-dataviz-grid: rgba(240, 240, 246, 0.12);
+  --mod-toast-success-text: #4ade80;
+  --mod-toast-success-bg: #0f2015;
+  --mod-toast-success-border: #1e3a28;
+  --mod-toast-warning-text: #e3b341;
+  --mod-toast-warning-bg: #211d0c;
+  --mod-toast-warning-border: #3a3316;
+  --mod-toast-error-text: #f76a62;
+  --mod-toast-error-bg: #2a1012;
+  --mod-toast-error-border: #4a1d1e;
+  --mod-toast-info-text: #7fa9f9;
+  --mod-toast-info-bg: #101a2e;
+  --mod-toast-info-border: #1e3a6b;
+  --mod-surface-canvas-chrome: #141419;
+  --mod-surface-canvas-content: #1b1b21;
+  --mod-surface-field: #222229;
+  --mod-surface-sunken: #2a2a32;
+  --mod-surface-sunken2: #33333d;
+  --mod-surface-row-hover: #2e2e38;
+  --mod-surface-scrim: rgba(15, 15, 20, 0.45);
+  --mod-surface-tooltip: #2d2d36;
+  --mod-surface-card-frosted: rgba(38, 38, 46, 0.78);
+  --mod-text-primary: #f1f0ea;
+  --mod-text-muted: #b9b9c6;
+  --mod-text-link: #73aaff;
+  --mod-text-tab-active: #7fa9f9;
+  --mod-text-on-primary: #17171c;
+  --mod-text-code-primary: #e9eaf2;
+  --mod-text-code-secondary: #9598ac;
+  --mod-text-input-placeholder: #9c9ca8;
+  --mod-button-primary-bg: #f1f0ea;
+  --mod-button-primary-fg: #17171c;
+  --mod-button-primary-bg-hover: #fbfaf6;
+  --mod-button-destructive-bg: #fa826f;
+  --mod-button-destructive-bg-hover: #f0b4ac;
+  --mod-data-periwinkle: #8ca0f5;
+  --mod-data-teal: #25d0c0;
+  --mod-data-lilac: #b39deb;
+  --mod-data-coral: #ff6f61;
+  --mod-data-green: #30f284;
+  --mod-data-yellow: #ffd34d;
+  --mod-data-orange1: #ffa83d;
+  --mod-data-orange2: #ff8f52;
+  --mod-data-orange3: #ff6f61;
+  --mod-data-red1: #fa826f;
+  --mod-data-red2: #c9291c;
+  --mod-data-red3: #a63325;
+  --mod-skeleton-background: #33333d;
+  --mod-skeleton-wave: rgba(255, 255, 255, 0.08);
+  --mod-accent-default: #7fa9f9;
+  --mod-accent-deep: #7fa9f9;
+  --mod-accent-tint: rgba(127, 169, 249, 0.16);
+  --mod-accent-border: rgba(127, 169, 249, 0.4);
+  --mod-accent-primary-fg: #ffffff;
+  --mod-accent-glow: rgba(62, 123, 246, 0.18);
+  --mod-accent-glow-secondary: rgba(157, 91, 232, 0.2);
+  --mod-role-violet-border: rgba(157, 91, 232, 0.45);
+  --mod-role-magenta-tint: rgba(230, 57, 155, 0.14);
+  --mod-role-magenta-text: #e6399b;
+  --mod-role-magenta-border: rgba(230, 57, 155, 0.4);
+  --mod-role-teal-tint: rgba(37, 208, 192, 0.16);
+  --mod-role-teal-text: #25d0c0;
+  --mod-role-teal-border: rgba(37, 208, 192, 0.42);
+  --mod-role-violet-tint: rgba(157, 91, 232, 0.16);
+  --mod-role-violet-text: #9d5be8;
+  --mod-avatar-user-default-bg: #30f284;
+  --mod-avatar-user-default-text: #1d5937;
+  --mod-avatar-initials-text1: #9d5be8;
+  --mod-avatar-initials-text2: #30f284;
+  --mod-avatar-initials-text3: #ffa83d;
+  --mod-avatar-initials-text4: #e6399b;
+  --mod-avatar-initials-text5: #9d5be8;
+  --mod-avatar-initials-text6: #25d0c0;
+  --mod-avatar-initials-text7: #3e7bf6;
+  --mod-avatar-initials-border1: rgba(157, 91, 232, 0.45);
+  --mod-avatar-initials-border2: rgba(48, 242, 132, 0.42);
+  --mod-avatar-initials-border3: rgba(255, 168, 61, 0.42);
+  --mod-avatar-initials-border4: rgba(230, 57, 155, 0.4);
+  --mod-avatar-initials-border5: rgba(157, 91, 232, 0.45);
+  --mod-avatar-initials-border6: rgba(37, 208, 192, 0.42);
+  --mod-avatar-initials-border7: rgba(62, 123, 246, 0.4);
+  --mod-avatar-initials-background1: rgba(157, 91, 232, 0.16);
+  --mod-avatar-initials-background2: rgba(48, 242, 132, 0.16);
+  --mod-avatar-initials-background3: rgba(255, 168, 61, 0.16);
+  --mod-avatar-initials-background4: rgba(230, 57, 155, 0.14);
+  --mod-avatar-initials-background5: rgba(157, 91, 232, 0.16);
+  --mod-avatar-initials-background6: rgba(37, 208, 192, 0.16);
+  --mod-avatar-initials-background7: rgba(62, 123, 246, 0.16);
+  --mod-input-radio: #73aaff;
+  --mod-input-checkbox: #73aaff;
+  --mod-input-hover-background: #222229;
+  --mod-input-background: #222229;
+  --mod-input-disabled-background: #222229;
+  --mod-buttons-primary-hover: #fbfaf6;
+  --mod-buttons-primary-disabled: #2d2d36;
+  --mod-buttons-primary-pressed: #fbfaf6;
+  --mod-buttons-primary-default: #f1f0ea;
+  --mod-buttons-secondary-default-border: rgba(240, 240, 246, 0.38);
+  --mod-buttons-secondary-hover-background: #2a2a32;
+  --mod-buttons-secondary-pressed-background: #33333d;
+  --mod-buttons-secondary-disabled-background: #222229;
+  --mod-buttons-secondary-default-background: #222229;
+  --mod-buttons-secondary-default: #f1f0ea;
+  --mod-buttons-tertiary-default: #f1f0ea;
+  --mod-buttons-tertiary-hover: #f1f0ea;
+  --mod-buttons-tertiary-pressed: #f1f0ea;
+  --mod-buttons-tertiary-disabled: #9c9ca8;
+  --mod-buttons-destructive: #fa826f;
+  --mod-buttons-navigation-active: rgba(127, 169, 249, 0.16);
+  --mod-buttons-navigation-default-border: rgba(127, 169, 249, 0.4);
+  --mod-buttons-navigation-hover-background: rgba(127, 169, 249, 0.16);
+  --mod-buttons-navigation-pressed-background: rgba(127, 169, 249, 0.16);
+  --mod-buttons-navigation-active-border: #7fa9f9;
+  --mod-activity-recipe-run: #9d5be8;
+  --mod-activity-commit-job: #7fa9f9;
+  --mod-activity-visualization: #25d0c0;
+  --mod-tab-secondary-background: #2d2d36;
+  --mod-code-background: #2a2a32;
+  --mod-brand: #7fa9f9;}