@scattered-light/loomiere-mojave 0.4.1 → 0.5.0

package/dist/tokens.css

@@ -2247,6 +2247,1664 @@
     --sl-popup-arrow-fill: var(--sl-popup-background); /** The arrow is part of the popup, so it takes the popup's fill. */
   }
 
+  /* Look: Classic (data-look='classic'). */
+  [data-look='classic'] {
+    --sl-radius-sm: 0.0938rem;
+    --sl-radius-base: 0.1875rem;
+    --sl-radius-md: 0.2813rem;
+    --sl-radius-lg: 0.375rem;
+    --sl-radius-xl: 0.5625rem;
+    --sl-radius-2xl: 0.75rem;
+    --sl-radius-3xl: 1.125rem;
+    --sl-font-family-display: Roboto, sans-serif;
+    --sl-font-family-body: Roboto, sans-serif;
+    --sl-color-neutral-50: #f3fcff;
+    --sl-color-neutral-100: #eefaff;
+    --sl-color-neutral-200: #def6ff;
+    --sl-color-neutral-300: #d1f3ff;
+    --sl-color-neutral-400: #b6dfee;
+    --sl-color-neutral-500: #a9d5e5;
+    --sl-color-neutral-600: #8fb6c5;
+    --sl-color-neutral-700: #7da1af;
+    --sl-color-neutral-800: #6b8d99;
+    --sl-color-neutral-900: #53737f;
+    --sl-color-neutral-1000: #3c5a66;
+    --sl-color-neutral-1100: #203d48;
+    --sl-color-neutral-1200: #03202a;
+    --sl-color-primary-50: #fffaf9;
+    --sl-color-primary-75: #fff2ef;
+    --sl-color-primary-100: #fedfd7;
+    --sl-color-primary-200: #f7c7bb;
+    --sl-color-primary-300: #e5927d;
+    --sl-color-primary-400: #c37c6a;
+    --sl-color-primary-500: #a36759;
+    --sl-color-primary-600: #875549;
+    --sl-color-primary-700: #70463c;
+    --sl-color-primary-800: #54352d;
+    --sl-color-primary-900: #3b241f;
+    --sl-color-primary-1000: #2b1a16;
+    --sl-color-secondary-50: #f9fcfd;
+    --sl-color-secondary-75: #eef6fa;
+    --sl-color-secondary-100: #deeff5;
+    --sl-color-secondary-200: #b0d8e7;
+    --sl-color-secondary-300: #8fbdce;
+    --sl-color-secondary-400: #6b9cae;
+    --sl-color-secondary-500: #487d91;
+    --sl-color-secondary-600: #32687c;
+    --sl-color-secondary-700: #285768;
+    --sl-color-secondary-800: #1d414f;
+    --sl-color-secondary-900: #122d37;
+    --sl-color-secondary-1000: #071920;
+    --sl-color-tertiary-50: #fffbed;
+    --sl-color-tertiary-75: #fef5d5;
+    --sl-color-tertiary-100: #f7ecc7;
+    --sl-color-tertiary-200: #e2d1a1;
+    --sl-color-tertiary-300: #c5b58c;
+    --sl-color-tertiary-400: #a19472;
+    --sl-color-tertiary-500: #80765a;
+    --sl-color-tertiary-600: #6a614a;
+    --sl-color-tertiary-700: #58503c;
+    --sl-color-tertiary-800: #423c2d;
+    --sl-color-tertiary-900: #2e291e;
+    --sl-color-tertiary-1000: #1a170f;
+    --sl-color-quaternary-50: #f3fef9;
+    --sl-color-quaternary-75: #defbef;
+    --sl-color-quaternary-100: #caf5e1;
+    --sl-color-quaternary-200: #93e3b6;
+    --sl-color-quaternary-300: #77c699;
+    --sl-color-quaternary-400: #5ba37a;
+    --sl-color-quaternary-500: #488261;
+    --sl-color-quaternary-600: #3a6c50;
+    --sl-color-quaternary-700: #2f5941;
+    --sl-color-quaternary-800: #224331;
+    --sl-color-quaternary-900: #162e20;
+    --sl-color-quaternary-1000: #0a1a11;
+    --sl-color-success-50: #fafcfb;
+    --sl-color-success-75: #f0f6f2;
+    --sl-color-success-100: #e3efe7;
+    --sl-color-success-200: #bcd9c7;
+    --sl-color-success-300: #92c1a4;
+    --sl-color-success-400: #5ca37a;
+    --sl-color-success-500: #488261;
+    --sl-color-success-600: #3a6c50;
+    --sl-color-success-700: #2f5941;
+    --sl-color-success-800: #224331;
+    --sl-color-success-900: #162e20;
+    --sl-color-success-1000: #0a1a11;
+    --sl-color-warning-50: #fefbf6;
+    --sl-color-warning-75: #fbf4e5;
+    --sl-color-warning-100: #f7ebcf;
+    --sl-color-warning-200: #edcf8a;
+    --sl-color-warning-300: #dfb029;
+    --sl-color-warning-400: #b78f1f;
+    --sl-color-warning-500: #937217;
+    --sl-color-warning-600: #7a5e11;
+    --sl-color-warning-700: #654e0d;
+    --sl-color-warning-800: #4d3a07;
+    --sl-color-warning-900: #352804;
+    --sl-color-warning-1000: #1f1601;
+    --sl-color-error-75: #fff2f0;
+    --sl-color-error-100: #ffe7e3;
+    --sl-color-error-200: #ffc4bb;
+    --sl-color-error-300: #fd9d8e;
+    --sl-color-error-400: #f46857;
+    --sl-color-error-500: #e72117;
+    --sl-color-error-600: #c70000;
+    --sl-color-error-700: #a70000;
+    --sl-color-error-800: #800000;
+    --sl-color-error-900: #5c0000;
+    --sl-color-error-1000: #380000;
+    --sl-color-info-75: #f0f5fe;
+    --sl-color-info-100: #e2edfd;
+    --sl-color-info-200: #bbd3fa;
+    --sl-color-info-300: #91b8f5;
+    --sl-color-info-400: #5e95ed;
+    --sl-color-info-500: #2973e3;
+    --sl-color-info-600: #145dc8;
+    --sl-color-info-700: #0f4da8;
+    --sl-color-info-800: #093a80;
+    --sl-color-info-900: #04275c;
+    --sl-color-info-1000: #021539;
+    --sl-color-data-blue: #346ea3;
+    --sl-color-data-orange: #f6844e;
+    --sl-color-data-green: #5ba37a;
+    --sl-color-data-gold: #f1c54b;
+    --sl-color-data-slate: #688d99;
+    --sl-color-data-red: #f24646;
+    --sl-color-data-taupe: #867775;
+    --sl-color-data-rose: #e15a6a;
+    --sl-color-data-magenta: #bb529e;
+    --sl-color-data-brown: #b97350;
+    --sl-color-data-sky: #70ace4;
+    --sl-color-data-peach: #feb794;
+    --sl-color-data-mint: #8be0af;
+    --sl-color-data-sand: #e8d5a1;
+    --sl-color-data-ice: #a9d5e5;
+    --sl-color-data-salmon: #ff9797;
+    --sl-color-data-stone: #bab5b4;
+    --sl-color-data-pink: #ffb9c6;
+    --sl-color-data-orchid: #f3a1dd;
+    --sl-color-data-tan: #f0c5af;
+    --sl-font-size-md: 0.875rem;
+    --sl-font-size-lg: clamp(0.875rem, 0.8167rem + 0.2917vw, 1.05rem);
+    --sl-font-size-xl: clamp(1.05rem, 0.98rem + 0.35vw, 1.26rem);
+    --sl-font-size-2xl: clamp(1.26rem, 1.176rem + 0.42vw, 1.512rem);
+    --sl-font-size-3xl: clamp(1.512rem, 1.4112rem + 0.504vw, 1.8144rem);
+    --sl-font-size-4xl: clamp(1.8144rem, 1.6934rem + 0.6048vw, 2.1773rem);
+    --sl-font-size-5xl: clamp(2.1773rem, 2.0321rem + 0.7258vw, 2.6127rem);
+    --sl-font-size-6xl: clamp(2.6127rem, 2.4386rem + 0.8709vw, 3.1353rem);
+    --sl-font-size-7xl: clamp(3.1353rem, 2.9263rem + 1.0451vw, 3.7623rem);
+    --sl-font-size-8xl: clamp(3.7623rem, 3.5115rem + 1.2541vw, 4.5148rem);
+    --sl-font-size-9xl: clamp(4.5148rem, 4.2138rem + 1.5049vw, 5.4178rem);
+    --sl-line-height-xxs: 1.4;
+    --sl-line-height-xs: 1.4;
+    --sl-line-height-sm: 1.4;
+    --sl-line-height-md: 1.352;
+    --sl-line-height-lg: 1.296;
+    --sl-line-height-xl: 1.239;
+    --sl-line-height-2xl: 1.183;
+    --sl-line-height-3xl: 1.126;
+    --sl-vision-deuteranopia-color-primary-50: #fefafd;
+    --sl-vision-deuteranopia-color-primary-75: #fdf2f9;
+    --sl-vision-deuteranopia-color-primary-100: #f8deef;
+    --sl-vision-deuteranopia-color-primary-200: #efc6e1;
+    --sl-vision-deuteranopia-color-primary-300: #d890c0;
+    --sl-vision-deuteranopia-color-primary-400: #b87aa3;
+    --sl-vision-deuteranopia-color-primary-500: #9b6689;
+    --sl-vision-deuteranopia-color-primary-600: #7f5471;
+    --sl-vision-deuteranopia-color-primary-700: #6a465e;
+    --sl-vision-deuteranopia-color-primary-800: #4f3446;
+    --sl-vision-deuteranopia-color-primary-900: #372430;
+    --sl-vision-deuteranopia-color-primary-1000: #281a23;
+    --sl-vision-deuteranopia-color-secondary-50: #f9fcfd;
+    --sl-vision-deuteranopia-color-secondary-75: #eef6fa;
+    --sl-vision-deuteranopia-color-secondary-100: #deeff5;
+    --sl-vision-deuteranopia-color-secondary-200: #b0d8e7;
+    --sl-vision-deuteranopia-color-secondary-300: #8fbdce;
+    --sl-vision-deuteranopia-color-secondary-400: #6b9cae;
+    --sl-vision-deuteranopia-color-secondary-500: #487d91;
+    --sl-vision-deuteranopia-color-secondary-600: #32687c;
+    --sl-vision-deuteranopia-color-secondary-700: #285768;
+    --sl-vision-deuteranopia-color-secondary-800: #1d414f;
+    --sl-vision-deuteranopia-color-secondary-900: #122d37;
+    --sl-vision-deuteranopia-color-secondary-1000: #071920;
+    --sl-vision-deuteranopia-color-tertiary-50: #fdfcef;
+    --sl-vision-deuteranopia-color-tertiary-75: #f8f7d5;
+    --sl-vision-deuteranopia-color-tertiary-100: #f1eec7;
+    --sl-vision-deuteranopia-color-tertiary-200: #dbd3a2;
+    --sl-vision-deuteranopia-color-tertiary-300: #beb78c;
+    --sl-vision-deuteranopia-color-tertiary-400: #9b9672;
+    --sl-vision-deuteranopia-color-tertiary-500: #7c775a;
+    --sl-vision-deuteranopia-color-tertiary-600: #66624a;
+    --sl-vision-deuteranopia-color-tertiary-700: #55513d;
+    --sl-vision-deuteranopia-color-tertiary-800: #403d2d;
+    --sl-vision-deuteranopia-color-tertiary-900: #2c2a1e;
+    --sl-vision-deuteranopia-color-quaternary-50: #f3fef9;
+    --sl-vision-deuteranopia-color-quaternary-75: #defbef;
+    --sl-vision-deuteranopia-color-quaternary-100: #caf5e1;
+    --sl-vision-deuteranopia-color-quaternary-200: #93e3b6;
+    --sl-vision-deuteranopia-color-quaternary-300: #77c699;
+    --sl-vision-deuteranopia-color-quaternary-400: #5ba37a;
+    --sl-vision-deuteranopia-color-quaternary-500: #488261;
+    --sl-vision-deuteranopia-color-quaternary-600: #3a6c50;
+    --sl-vision-deuteranopia-color-quaternary-700: #2f5941;
+    --sl-vision-deuteranopia-color-quaternary-800: #224331;
+    --sl-vision-deuteranopia-color-quaternary-900: #162e20;
+    --sl-vision-deuteranopia-color-quaternary-1000: #0a1a11;
+    --sl-vision-deuteranopia-color-success-50: #fafcfa;
+    --sl-vision-deuteranopia-color-success-75: #f1f6f2;
+    --sl-vision-deuteranopia-color-success-100: #e4efe6;
+    --sl-vision-deuteranopia-color-success-200: #bed8c4;
+    --sl-vision-deuteranopia-color-success-300: #96c0a0;
+    --sl-vision-deuteranopia-color-success-400: #62a275;
+    --sl-vision-deuteranopia-color-success-500: #4d825c;
+    --sl-vision-deuteranopia-color-success-600: #3f6b4c;
+    --sl-vision-deuteranopia-color-success-700: #33593e;
+    --sl-vision-deuteranopia-color-success-800: #25432e;
+    --sl-vision-deuteranopia-color-success-900: #182e1f;
+    --sl-vision-deuteranopia-color-success-1000: #0b1a10;
+    --sl-vision-deuteranopia-color-warning-75: #fbf4e5;
+    --sl-vision-deuteranopia-color-warning-100: #f7ebcf;
+    --sl-vision-deuteranopia-color-warning-200: #edcf8a;
+    --sl-vision-deuteranopia-color-warning-300: #dfb029;
+    --sl-vision-deuteranopia-color-warning-400: #b78f1f;
+    --sl-vision-deuteranopia-color-warning-500: #937217;
+    --sl-vision-deuteranopia-color-warning-600: #7a5e11;
+    --sl-vision-deuteranopia-color-warning-700: #654e0d;
+    --sl-vision-deuteranopia-color-warning-800: #4d3a07;
+    --sl-vision-deuteranopia-color-warning-900: #352804;
+    --sl-vision-deuteranopia-color-warning-1000: #1f1601;
+    --sl-vision-deuteranopia-color-error-75: #fff2f0;
+    --sl-vision-deuteranopia-color-error-100: #ffe7e3;
+    --sl-vision-deuteranopia-color-error-200: #ffc4bb;
+    --sl-vision-deuteranopia-color-error-300: #fd9d8e;
+    --sl-vision-deuteranopia-color-error-400: #f46857;
+    --sl-vision-deuteranopia-color-error-500: #e72117;
+    --sl-vision-deuteranopia-color-error-600: #c70000;
+    --sl-vision-deuteranopia-color-error-700: #a70000;
+    --sl-vision-deuteranopia-color-error-800: #800000;
+    --sl-vision-deuteranopia-color-error-900: #5c0000;
+    --sl-vision-deuteranopia-color-error-1000: #380000;
+    --sl-vision-deuteranopia-color-info-50: #f9fbff;
+    --sl-vision-deuteranopia-color-info-75: #f0f5fe;
+    --sl-vision-deuteranopia-color-info-100: #e2edfd;
+    --sl-vision-deuteranopia-color-info-200: #bbd3fa;
+    --sl-vision-deuteranopia-color-info-300: #91b8f5;
+    --sl-vision-deuteranopia-color-info-400: #5e95ed;
+    --sl-vision-deuteranopia-color-info-500: #2973e3;
+    --sl-vision-deuteranopia-color-info-600: #145dc8;
+    --sl-vision-deuteranopia-color-info-700: #0f4da8;
+    --sl-vision-deuteranopia-color-info-800: #093a80;
+    --sl-vision-deuteranopia-color-info-900: #04275c;
+    --sl-vision-deuteranopia-color-info-1000: #021539;
+    --sl-vision-deuteranopia-color-data-blue: #346ea3;
+    --sl-vision-deuteranopia-color-data-orange: #eb7a44;
+    --sl-vision-deuteranopia-color-data-green: #5ba37a;
+    --sl-vision-deuteranopia-color-data-gold: #f1c54b;
+    --sl-vision-deuteranopia-color-data-slate: #608b99;
+    --sl-vision-deuteranopia-color-data-red: #f51d2f;
+    --sl-vision-deuteranopia-color-data-taupe: #6e6266;
+    --sl-vision-deuteranopia-color-data-rose: #d00459;
+    --sl-vision-deuteranopia-color-data-magenta: #bb529e;
+    --sl-vision-deuteranopia-color-data-brown: #b97350;
+    --sl-vision-deuteranopia-color-data-sky: #70ace4;
+    --sl-vision-deuteranopia-color-data-peach: #ba848e;
+    --sl-vision-deuteranopia-color-data-mint: #6bb762;
+    --sl-vision-deuteranopia-color-data-sand: #7e7453;
+    --sl-vision-deuteranopia-color-data-ice: #a2d3e8;
+    --sl-vision-deuteranopia-color-data-salmon: #f5807a;
+    --sl-vision-deuteranopia-color-data-stone: #9b9798;
+    --sl-vision-deuteranopia-color-data-pink: #a878ae;
+    --sl-vision-deuteranopia-color-data-orchid: #f3a1dd;
+    --sl-vision-deuteranopia-color-data-tan: #f0c5af;
+    --sl-vision-protanopia-color-primary-50: #fffafb;
+    --sl-vision-protanopia-color-primary-75: #fff2f4;
+    --sl-vision-protanopia-color-primary-100: #fddde4;
+    --sl-vision-protanopia-color-primary-200: #f6c6d0;
+    --sl-vision-protanopia-color-primary-300: #e38ea2;
+    --sl-vision-protanopia-color-primary-400: #c17989;
+    --sl-vision-protanopia-color-primary-500: #a26573;
+    --sl-vision-protanopia-color-primary-600: #86535f;
+    --sl-vision-protanopia-color-primary-700: #70454f;
+    --sl-vision-protanopia-color-primary-800: #54343b;
+    --sl-vision-protanopia-color-primary-900: #3b2329;
+    --sl-vision-protanopia-color-primary-1000: #2b191d;
+    --sl-vision-protanopia-color-secondary-50: #f9fcfd;
+    --sl-vision-protanopia-color-secondary-75: #eef6fa;
+    --sl-vision-protanopia-color-secondary-100: #deeff5;
+    --sl-vision-protanopia-color-secondary-200: #b0d8e7;
+    --sl-vision-protanopia-color-secondary-300: #8fbdce;
+    --sl-vision-protanopia-color-secondary-400: #6b9cae;
+    --sl-vision-protanopia-color-secondary-500: #487d91;
+    --sl-vision-protanopia-color-secondary-600: #32687c;
+    --sl-vision-protanopia-color-secondary-700: #285768;
+    --sl-vision-protanopia-color-secondary-800: #1d414f;
+    --sl-vision-protanopia-color-secondary-900: #122d37;
+    --sl-vision-protanopia-color-secondary-1000: #071920;
+    --sl-vision-protanopia-color-tertiary-50: #f6fef0;
+    --sl-vision-protanopia-color-tertiary-75: #eafadc;
+    --sl-vision-protanopia-color-tertiary-100: #e0f2ce;
+    --sl-vision-protanopia-color-tertiary-200: #c6d8aa;
+    --sl-vision-protanopia-color-tertiary-300: #acbc94;
+    --sl-vision-protanopia-color-tertiary-400: #8c9978;
+    --sl-vision-protanopia-color-tertiary-500: #707a5f;
+    --sl-vision-protanopia-color-tertiary-600: #5c654e;
+    --sl-vision-protanopia-color-tertiary-700: #4c5440;
+    --sl-vision-protanopia-color-tertiary-800: #393f30;
+    --sl-vision-protanopia-color-tertiary-900: #272b20;
+    --sl-vision-protanopia-color-tertiary-1000: #151811;
+    --sl-vision-protanopia-color-quaternary-50: #f3fef9;
+    --sl-vision-protanopia-color-quaternary-75: #defbef;
+    --sl-vision-protanopia-color-quaternary-100: #caf5e1;
+    --sl-vision-protanopia-color-quaternary-200: #93e3b6;
+    --sl-vision-protanopia-color-quaternary-300: #77c699;
+    --sl-vision-protanopia-color-quaternary-400: #5ba37a;
+    --sl-vision-protanopia-color-quaternary-500: #488261;
+    --sl-vision-protanopia-color-quaternary-600: #3a6c50;
+    --sl-vision-protanopia-color-quaternary-700: #2f5941;
+    --sl-vision-protanopia-color-quaternary-800: #224331;
+    --sl-vision-protanopia-color-quaternary-900: #162e20;
+    --sl-vision-protanopia-color-quaternary-1000: #0a1a11;
+    --sl-vision-protanopia-color-success-50: #fafcfa;
+    --sl-vision-protanopia-color-success-75: #f2f6f1;
+    --sl-vision-protanopia-color-success-100: #e7eee4;
+    --sl-vision-protanopia-color-success-200: #c5d7be;
+    --sl-vision-protanopia-color-success-300: #a2be96;
+    --sl-vision-protanopia-color-success-400: #76a066;
+    --sl-vision-protanopia-color-success-500: #5d804f;
+    --sl-vision-protanopia-color-success-600: #4c6941;
+    --sl-vision-protanopia-color-success-700: #3f5735;
+    --sl-vision-protanopia-color-success-800: #2f4227;
+    --sl-vision-protanopia-color-success-900: #1f2d19;
+    --sl-vision-protanopia-color-success-1000: #10190c;
+    --sl-vision-protanopia-color-warning-50: #fafcf7;
+    --sl-vision-protanopia-color-warning-75: #f0f7e7;
+    --sl-vision-protanopia-color-warning-100: #e3f1d3;
+    --sl-vision-protanopia-color-warning-200: #bedc95;
+    --sl-vision-protanopia-color-warning-300: #99c456;
+    --sl-vision-protanopia-color-warning-400: #7da045;
+    --sl-vision-protanopia-color-warning-500: #637f35;
+    --sl-vision-protanopia-color-warning-600: #51692b;
+    --sl-vision-protanopia-color-warning-700: #435722;
+    --sl-vision-protanopia-color-warning-800: #324218;
+    --sl-vision-protanopia-color-warning-900: #212d0e;
+    --sl-vision-protanopia-color-warning-1000: #111906;
+    --sl-vision-protanopia-color-error-200: #ffc4bb;
+    --sl-vision-protanopia-color-error-300: #fd9d8e;
+    --sl-vision-protanopia-color-error-400: #f46857;
+    --sl-vision-protanopia-color-error-500: #e72117;
+    --sl-vision-protanopia-color-error-600: #c70000;
+    --sl-vision-protanopia-color-error-700: #a70000;
+    --sl-vision-protanopia-color-error-800: #800000;
+    --sl-vision-protanopia-color-error-900: #5c0000;
+    --sl-vision-protanopia-color-error-1000: #380000;
+    --sl-vision-protanopia-color-info-50: #f9fbff;
+    --sl-vision-protanopia-color-info-75: #f0f5fe;
+    --sl-vision-protanopia-color-info-100: #e2edfd;
+    --sl-vision-protanopia-color-info-200: #bbd3fa;
+    --sl-vision-protanopia-color-info-300: #91b8f5;
+    --sl-vision-protanopia-color-info-400: #5e95ed;
+    --sl-vision-protanopia-color-info-500: #2973e3;
+    --sl-vision-protanopia-color-info-600: #145dc8;
+    --sl-vision-protanopia-color-info-700: #0f4da8;
+    --sl-vision-protanopia-color-info-800: #093a80;
+    --sl-vision-protanopia-color-info-900: #04275c;
+    --sl-vision-protanopia-color-info-1000: #021539;
+    --sl-vision-protanopia-color-data-blue: #346ea3;
+    --sl-vision-protanopia-color-data-orange: #f5722e;
+    --sl-vision-protanopia-color-data-green: #5ba37a;
+    --sl-vision-protanopia-color-data-gold: #f1c54b;
+    --sl-vision-protanopia-color-data-slate: #628da3;
+    --sl-vision-protanopia-color-data-red: #fd2a36;
+    --sl-vision-protanopia-color-data-taupe: #32242c;
+    --sl-vision-protanopia-color-data-rose: #e15a6a;
+    --sl-vision-protanopia-color-data-magenta: #bb529e;
+    --sl-vision-protanopia-color-data-brown: #b97350;
+    --sl-vision-protanopia-color-data-sky: #70ace4;
+    --sl-vision-protanopia-color-data-peach: #e59c54;
+    --sl-vision-protanopia-color-data-mint: #53c4ae;
+    --sl-vision-protanopia-color-data-sand: #e8d5a1;
+    --sl-vision-protanopia-color-data-ice: #9ed3ee;
+    --sl-vision-protanopia-color-data-salmon: #fd787c;
+    --sl-vision-protanopia-color-data-stone: #686566;
+    --sl-vision-protanopia-color-data-pink: #c37c98;
+    --sl-vision-protanopia-color-data-orchid: #f3a1dd;
+    --sl-vision-protanopia-color-data-tan: #f0c5af;
+    --sl-vision-tritanopia-color-primary-50: #fffaf9;
+    --sl-vision-tritanopia-color-primary-75: #fff2ef;
+    --sl-vision-tritanopia-color-primary-100: #fedfd7;
+    --sl-vision-tritanopia-color-primary-200: #f7c7bb;
+    --sl-vision-tritanopia-color-primary-300: #e5927d;
+    --sl-vision-tritanopia-color-primary-400: #c37c6a;
+    --sl-vision-tritanopia-color-primary-500: #a36759;
+    --sl-vision-tritanopia-color-primary-600: #875549;
+    --sl-vision-tritanopia-color-primary-700: #70463c;
+    --sl-vision-tritanopia-color-primary-800: #54352d;
+    --sl-vision-tritanopia-color-primary-900: #3b241f;
+    --sl-vision-tritanopia-color-primary-1000: #2b1a16;
+    --sl-vision-tritanopia-color-secondary-50: #f9fcfd;
+    --sl-vision-tritanopia-color-secondary-75: #eef6fa;
+    --sl-vision-tritanopia-color-secondary-100: #deeef6;
+    --sl-vision-tritanopia-color-secondary-200: #b2d8e9;
+    --sl-vision-tritanopia-color-secondary-300: #91bcd0;
+    --sl-vision-tritanopia-color-secondary-400: #6d9bb1;
+    --sl-vision-tritanopia-color-secondary-500: #4c7d93;
+    --sl-vision-tritanopia-color-secondary-600: #35687f;
+    --sl-vision-tritanopia-color-secondary-700: #2b566a;
+    --sl-vision-tritanopia-color-secondary-800: #1f4150;
+    --sl-vision-tritanopia-color-secondary-900: #132d38;
+    --sl-vision-tritanopia-color-secondary-1000: #081921;
+    --sl-vision-tritanopia-color-tertiary-50: #fffbed;
+    --sl-vision-tritanopia-color-tertiary-75: #fef5d5;
+    --sl-vision-tritanopia-color-tertiary-100: #f7ecc7;
+    --sl-vision-tritanopia-color-tertiary-200: #e2d1a1;
+    --sl-vision-tritanopia-color-tertiary-300: #c5b58c;
+    --sl-vision-tritanopia-color-tertiary-400: #a19472;
+    --sl-vision-tritanopia-color-tertiary-500: #80765a;
+    --sl-vision-tritanopia-color-tertiary-600: #6a614a;
+    --sl-vision-tritanopia-color-tertiary-700: #58503c;
+    --sl-vision-tritanopia-color-tertiary-800: #423c2d;
+    --sl-vision-tritanopia-color-tertiary-900: #2e291e;
+    --sl-vision-tritanopia-color-tertiary-1000: #1a170f;
+    --sl-vision-tritanopia-color-quaternary-50: #f3fef9;
+    --sl-vision-tritanopia-color-quaternary-75: #defbef;
+    --sl-vision-tritanopia-color-quaternary-100: #caf5e1;
+    --sl-vision-tritanopia-color-quaternary-200: #93e3b6;
+    --sl-vision-tritanopia-color-quaternary-300: #77c699;
+    --sl-vision-tritanopia-color-quaternary-400: #5ba37a;
+    --sl-vision-tritanopia-color-quaternary-500: #488261;
+    --sl-vision-tritanopia-color-quaternary-600: #3a6c50;
+    --sl-vision-tritanopia-color-quaternary-700: #2f5941;
+    --sl-vision-tritanopia-color-quaternary-800: #224331;
+    --sl-vision-tritanopia-color-quaternary-900: #162e20;
+    --sl-vision-tritanopia-color-quaternary-1000: #0a1a11;
+    --sl-vision-tritanopia-color-success-50: #fbfbf9;
+    --sl-vision-tritanopia-color-success-75: #f3f6ef;
+    --sl-vision-tritanopia-color-success-100: #e9eee2;
+    --sl-vision-tritanopia-color-success-200: #ccd6ba;
+    --sl-vision-tritanopia-color-success-300: #aebc8f;
+    --sl-vision-tritanopia-color-success-400: #899c59;
+    --sl-vision-tritanopia-color-success-500: #6c7d45;
+    --sl-vision-tritanopia-color-success-600: #596738;
+    --sl-vision-tritanopia-color-success-700: #4a552d;
+    --sl-vision-tritanopia-color-success-800: #374021;
+    --sl-vision-tritanopia-color-success-900: #262c15;
+    --sl-vision-tritanopia-color-success-1000: #141909;
+    --sl-vision-tritanopia-color-warning-50: #fbfcf7;
+    --sl-vision-tritanopia-color-warning-75: #f3f7e6;
+    --sl-vision-tritanopia-color-warning-100: #e9efd1;
+    --sl-vision-tritanopia-color-warning-200: #cbd98f;
+    --sl-vision-tritanopia-color-warning-300: #adbf45;
+    --sl-vision-tritanopia-color-warning-400: #8d9c37;
+    --sl-vision-tritanopia-color-warning-500: #707d2a;
+    --sl-vision-tritanopia-color-warning-600: #5d6722;
+    --sl-vision-tritanopia-color-warning-700: #4c551a;
+    --sl-vision-tritanopia-color-warning-800: #394012;
+    --sl-vision-tritanopia-color-warning-900: #272c0a;
+    --sl-vision-tritanopia-color-warning-1000: #151904;
+    --sl-vision-tritanopia-color-error-50: #fffafa;
+    --sl-vision-tritanopia-color-error-75: #fff2f0;
+    --sl-vision-tritanopia-color-error-100: #ffe7e3;
+    --sl-vision-tritanopia-color-error-200: #ffc4bb;
+    --sl-vision-tritanopia-color-error-300: #fd9d8e;
+    --sl-vision-tritanopia-color-error-400: #f46857;
+    --sl-vision-tritanopia-color-error-500: #e72117;
+    --sl-vision-tritanopia-color-error-600: #c70000;
+    --sl-vision-tritanopia-color-error-700: #a70000;
+    --sl-vision-tritanopia-color-error-800: #800000;
+    --sl-vision-tritanopia-color-error-900: #5c0000;
+    --sl-vision-tritanopia-color-error-1000: #380000;
+    --sl-vision-tritanopia-color-info-75: #eff5fe;
+    --sl-vision-tritanopia-color-info-100: #e2edfd;
+    --sl-vision-tritanopia-color-info-200: #bad4f9;
+    --sl-vision-tritanopia-color-info-300: #8eb9f3;
+    --sl-vision-tritanopia-color-info-400: #5896eb;
+    --sl-vision-tritanopia-color-info-500: #1974e1;
+    --sl-vision-tritanopia-color-info-600: #005fc3;
+    --sl-vision-tritanopia-color-info-700: #004fa4;
+    --sl-vision-tritanopia-color-info-800: #003b7e;
+    --sl-vision-tritanopia-color-info-900: #00285a;
+    --sl-vision-tritanopia-color-info-1000: #001638;
+    --sl-vision-tritanopia-color-data-blue: #346ea3;
+    --sl-vision-tritanopia-color-data-orange: #f5722e;
+    --sl-vision-tritanopia-color-data-green: #8b996b;
+    --sl-vision-tritanopia-color-data-gold: #f1c54b;
+    --sl-vision-tritanopia-color-data-slate: #688d99;
+    --sl-vision-tritanopia-color-data-red: #b22429;
+    --sl-vision-tritanopia-color-data-taupe: #867775;
+    --sl-vision-tritanopia-color-data-rose: #f44224;
+    --sl-vision-tritanopia-color-data-magenta: #98498f;
+    --sl-vision-tritanopia-color-data-brown: #b97350;
+    --sl-vision-tritanopia-color-data-sky: #629ed5;
+    --sl-vision-tritanopia-color-data-peach: #faa684;
+    --sl-vision-tritanopia-color-data-mint: #c2d39c;
+    --sl-vision-tritanopia-color-data-sand: #e8d5a1;
+    --sl-vision-tritanopia-color-data-ice: #a9d5e5;
+    --sl-vision-tritanopia-color-data-salmon: #fd7974;
+    --sl-vision-tritanopia-color-data-stone: #bab5b4;
+    --sl-vision-tritanopia-color-data-pink: #ad8499;
+    --sl-vision-tritanopia-color-data-orchid: #f37dbb;
+    --sl-vision-tritanopia-color-data-tan: #f0c5af;
+    --sl-vision-achromatopsia-color-primary-50: #fcfbfb;
+    --sl-vision-achromatopsia-color-primary-75: #f6f4f4;
+    --sl-vision-achromatopsia-color-primary-100: #efebea;
+    --sl-vision-achromatopsia-color-primary-200: #d9d0ce;
+    --sl-vision-achromatopsia-color-primary-300: #c1b3b0;
+    --sl-vision-achromatopsia-color-primary-400: #a4908b;
+    --sl-vision-achromatopsia-color-primary-500: #8a716b;
+    --sl-vision-achromatopsia-color-primary-600: #7e645d;
+    --sl-vision-achromatopsia-color-primary-700: #744539;
+    --sl-vision-achromatopsia-color-primary-800: #631c0a;
+    --sl-vision-achromatopsia-color-primary-900: #531204;
+    --sl-vision-achromatopsia-color-primary-1000: #460900;
+    --sl-vision-achromatopsia-color-secondary-50: #f9fcfd;
+    --sl-vision-achromatopsia-color-secondary-75: #eef6fa;
+    --sl-vision-achromatopsia-color-secondary-100: #deeff5;
+    --sl-vision-achromatopsia-color-secondary-200: #b0d8e7;
+    --sl-vision-achromatopsia-color-secondary-300: #8fbdce;
+    --sl-vision-achromatopsia-color-secondary-400: #6b9cae;
+    --sl-vision-achromatopsia-color-secondary-500: #487d91;
+    --sl-vision-achromatopsia-color-secondary-600: #32687c;
+    --sl-vision-achromatopsia-color-secondary-700: #285768;
+    --sl-vision-achromatopsia-color-secondary-800: #1d414f;
+    --sl-vision-achromatopsia-color-secondary-900: #122d37;
+    --sl-vision-achromatopsia-color-secondary-1000: #071920;
+    --sl-vision-achromatopsia-color-tertiary-50: #fffbef;
+    --sl-vision-achromatopsia-color-tertiary-75: #fef5d6;
+    --sl-vision-achromatopsia-color-tertiary-100: #f7ecc7;
+    --sl-vision-achromatopsia-color-tertiary-200: #e2d1a1;
+    --sl-vision-achromatopsia-color-tertiary-300: #c5b58c;
+    --sl-vision-achromatopsia-color-tertiary-400: #a19472;
+    --sl-vision-achromatopsia-color-tertiary-500: #80765a;
+    --sl-vision-achromatopsia-color-tertiary-600: #6a614a;
+    --sl-vision-achromatopsia-color-tertiary-700: #58503c;
+    --sl-vision-achromatopsia-color-tertiary-800: #423c2d;
+    --sl-vision-achromatopsia-color-tertiary-900: #2e291e;
+    --sl-vision-achromatopsia-color-tertiary-1000: #1a170f;
+    --sl-vision-achromatopsia-color-quaternary-50: #fafcfb;
+    --sl-vision-achromatopsia-color-quaternary-75: #f2f6f4;
+    --sl-vision-achromatopsia-color-quaternary-100: #e6edea;
+    --sl-vision-achromatopsia-color-quaternary-200: #c5d6ce;
+    --sl-vision-achromatopsia-color-quaternary-300: #a2bcb1;
+    --sl-vision-achromatopsia-color-quaternary-400: #56a47a;
+    --sl-vision-achromatopsia-color-quaternary-500: #35855b;
+    --sl-vision-achromatopsia-color-quaternary-600: #226f48;
+    --sl-vision-achromatopsia-color-quaternary-700: #165c3a;
+    --sl-vision-achromatopsia-color-quaternary-800: #0f462b;
+    --sl-vision-achromatopsia-color-quaternary-900: #08301c;
+    --sl-vision-achromatopsia-color-quaternary-1000: #031b0e;
+    --sl-vision-achromatopsia-color-success-50: #fafcfb;
+    --sl-vision-achromatopsia-color-success-75: #f0f6f2;
+    --sl-vision-achromatopsia-color-success-100: #e3efe7;
+    --sl-vision-achromatopsia-color-success-200: #bdd8c7;
+    --sl-vision-achromatopsia-color-success-300: #95c0a5;
+    --sl-vision-achromatopsia-color-success-400: #5fa27b;
+    --sl-vision-achromatopsia-color-success-500: #468260;
+    --sl-vision-achromatopsia-color-success-600: #396c4f;
+    --sl-vision-achromatopsia-color-success-700: #2e5941;
+    --sl-vision-achromatopsia-color-success-800: #214330;
+    --sl-vision-achromatopsia-color-success-900: #152f20;
+    --sl-vision-achromatopsia-color-success-1000: #091a11;
+    --sl-vision-achromatopsia-color-warning-50: #fefbf6;
+    --sl-vision-achromatopsia-color-warning-75: #fbf4e5;
+    --sl-vision-achromatopsia-color-warning-100: #f7ebcf;
+    --sl-vision-achromatopsia-color-warning-200: #edcf8a;
+    --sl-vision-achromatopsia-color-warning-300: #dfb029;
+    --sl-vision-achromatopsia-color-warning-400: #b78f1f;
+    --sl-vision-achromatopsia-color-warning-500: #937217;
+    --sl-vision-achromatopsia-color-warning-600: #7a5e11;
+    --sl-vision-achromatopsia-color-warning-700: #654e0d;
+    --sl-vision-achromatopsia-color-warning-800: #4d3a07;
+    --sl-vision-achromatopsia-color-warning-900: #352804;
+    --sl-vision-achromatopsia-color-warning-1000: #1f1601;
+    --sl-vision-achromatopsia-color-error-50: #fdfbfb;
+    --sl-vision-achromatopsia-color-error-75: #f9f4f3;
+    --sl-vision-achromatopsia-color-error-100: #f3eae9;
+    --sl-vision-achromatopsia-color-error-200: #e1cdca;
+    --sl-vision-achromatopsia-color-error-300: #cfafaa;
+    --sl-vision-achromatopsia-color-error-400: #b78a83;
+    --sl-vision-achromatopsia-color-error-500: #9f6960;
+    --sl-vision-achromatopsia-color-error-600: #8f5148;
+    --sl-vision-achromatopsia-color-error-700: #803d34;
+    --sl-vision-achromatopsia-color-error-800: #6e231b;
+    --sl-vision-achromatopsia-color-error-900: #5b0301;
+    --sl-vision-achromatopsia-color-error-1000: #380000;
+    --sl-vision-achromatopsia-color-info-50: #f9fbfe;
+    --sl-vision-achromatopsia-color-info-75: #f0f5fd;
+    --sl-vision-achromatopsia-color-info-100: #e3edfc;
+    --sl-vision-achromatopsia-color-info-200: #bdd3f7;
+    --sl-vision-achromatopsia-color-info-300: #95b8f0;
+    --sl-vision-achromatopsia-color-info-400: #6295e6;
+    --sl-vision-achromatopsia-color-info-500: #3274db;
+    --sl-vision-achromatopsia-color-info-600: #035bd0;
+    --sl-vision-achromatopsia-color-info-700: #024cae;
+    --sl-vision-achromatopsia-color-info-800: #013986;
+    --sl-vision-achromatopsia-color-info-900: #012660;
+    --sl-vision-achromatopsia-color-info-1000: #00153c;
+    --sl-vision-achromatopsia-color-data-blue: #346ea3;
+    --sl-vision-achromatopsia-color-data-orange: #bf100e;
+    --sl-vision-achromatopsia-color-data-green: #5ba37a;
+    --sl-vision-achromatopsia-color-data-gold: #f1c54b;
+    --sl-vision-achromatopsia-color-data-slate: #164958;
+    --sl-vision-achromatopsia-color-data-red: #f24646;
+    --sl-vision-achromatopsia-color-data-taupe: #867775;
+    --sl-vision-achromatopsia-color-data-rose: #d60f46;
+    --sl-vision-achromatopsia-color-data-magenta: #bb529e;
+    --sl-vision-achromatopsia-color-data-brown: #b97350;
+    --sl-vision-achromatopsia-color-data-sky: #005181;
+    --sl-vision-achromatopsia-color-data-peach: #52020c;
+    --sl-vision-achromatopsia-color-data-mint: #01bd93;
+    --sl-vision-achromatopsia-color-data-sand: #766c3a;
+    --sl-vision-achromatopsia-color-data-ice: #064e5b;
+    --sl-vision-achromatopsia-color-data-salmon: #3a0101;
+    --sl-vision-achromatopsia-color-data-stone: #898584;
+    --sl-vision-achromatopsia-color-data-pink: #985057;
+    --sl-vision-achromatopsia-color-data-orchid: #8d1651;
+    --sl-vision-achromatopsia-color-data-tan: #f0c5af;
+    --sl-color-data-1: var(--sl-color-data-blue);
+    --sl-color-data-2: var(--sl-color-data-orange);
+    --sl-color-data-3: var(--sl-color-data-green);
+    --sl-color-data-4: var(--sl-color-data-gold);
+    --sl-color-data-5: var(--sl-color-data-slate);
+    --sl-color-data-6: var(--sl-color-data-red);
+    --sl-color-data-7: var(--sl-color-data-taupe);
+    --sl-color-data-8: var(--sl-color-data-rose);
+    --sl-color-data-9: var(--sl-color-data-magenta);
+    --sl-color-data-10: var(--sl-color-data-brown);
+    --sl-color-data-11: var(--sl-color-data-sky);
+    --sl-color-data-13: var(--sl-color-data-mint);
+    --sl-color-data-14: var(--sl-color-data-sand);
+    --sl-color-data-15: var(--sl-color-data-ice);
+    --sl-color-data-16: var(--sl-color-data-salmon);
+    --sl-color-data-17: var(--sl-color-data-stone);
+    --sl-color-data-18: var(--sl-color-data-pink);
+    --sl-color-data-19: var(--sl-color-data-orchid);
+    --sl-color-data-20: var(--sl-color-data-tan);
+    --sl-vision-deuteranopia-color-data-1: var(--sl-vision-deuteranopia-color-data-blue);
+    --sl-vision-deuteranopia-color-data-2: var(--sl-vision-deuteranopia-color-data-orange);
+    --sl-vision-deuteranopia-color-data-3: var(--sl-vision-deuteranopia-color-data-green);
+    --sl-vision-deuteranopia-color-data-4: var(--sl-vision-deuteranopia-color-data-gold);
+    --sl-vision-deuteranopia-color-data-5: var(--sl-vision-deuteranopia-color-data-slate);
+    --sl-vision-deuteranopia-color-data-6: var(--sl-vision-deuteranopia-color-data-red);
+    --sl-vision-deuteranopia-color-data-7: var(--sl-vision-deuteranopia-color-data-taupe);
+    --sl-vision-deuteranopia-color-data-8: var(--sl-vision-deuteranopia-color-data-rose);
+    --sl-vision-deuteranopia-color-data-9: var(--sl-vision-deuteranopia-color-data-magenta);
+    --sl-vision-deuteranopia-color-data-10: var(--sl-vision-deuteranopia-color-data-brown);
+    --sl-vision-deuteranopia-color-data-11: var(--sl-vision-deuteranopia-color-data-sky);
+    --sl-vision-deuteranopia-color-data-13: var(--sl-vision-deuteranopia-color-data-mint);
+    --sl-vision-deuteranopia-color-data-14: var(--sl-vision-deuteranopia-color-data-sand);
+    --sl-vision-deuteranopia-color-data-15: var(--sl-vision-deuteranopia-color-data-ice);
+    --sl-vision-deuteranopia-color-data-16: var(--sl-vision-deuteranopia-color-data-salmon);
+    --sl-vision-deuteranopia-color-data-17: var(--sl-vision-deuteranopia-color-data-stone);
+    --sl-vision-deuteranopia-color-data-18: var(--sl-vision-deuteranopia-color-data-pink);
+    --sl-vision-deuteranopia-color-data-19: var(--sl-vision-deuteranopia-color-data-orchid);
+    --sl-vision-deuteranopia-color-data-20: var(--sl-vision-deuteranopia-color-data-tan);
+    --sl-vision-protanopia-color-data-1: var(--sl-vision-protanopia-color-data-blue);
+    --sl-vision-protanopia-color-data-2: var(--sl-vision-protanopia-color-data-orange);
+    --sl-vision-protanopia-color-data-3: var(--sl-vision-protanopia-color-data-green);
+    --sl-vision-protanopia-color-data-4: var(--sl-vision-protanopia-color-data-gold);
+    --sl-vision-protanopia-color-data-5: var(--sl-vision-protanopia-color-data-slate);
+    --sl-vision-protanopia-color-data-6: var(--sl-vision-protanopia-color-data-red);
+    --sl-vision-protanopia-color-data-7: var(--sl-vision-protanopia-color-data-taupe);
+    --sl-vision-protanopia-color-data-8: var(--sl-vision-protanopia-color-data-rose);
+    --sl-vision-protanopia-color-data-9: var(--sl-vision-protanopia-color-data-magenta);
+    --sl-vision-protanopia-color-data-10: var(--sl-vision-protanopia-color-data-brown);
+    --sl-vision-protanopia-color-data-11: var(--sl-vision-protanopia-color-data-sky);
+    --sl-vision-protanopia-color-data-13: var(--sl-vision-protanopia-color-data-mint);
+    --sl-vision-protanopia-color-data-14: var(--sl-vision-protanopia-color-data-sand);
+    --sl-vision-protanopia-color-data-15: var(--sl-vision-protanopia-color-data-ice);
+    --sl-vision-protanopia-color-data-16: var(--sl-vision-protanopia-color-data-salmon);
+    --sl-vision-protanopia-color-data-17: var(--sl-vision-protanopia-color-data-stone);
+    --sl-vision-protanopia-color-data-18: var(--sl-vision-protanopia-color-data-pink);
+    --sl-vision-protanopia-color-data-19: var(--sl-vision-protanopia-color-data-orchid);
+    --sl-vision-protanopia-color-data-20: var(--sl-vision-protanopia-color-data-tan);
+    --sl-vision-tritanopia-color-data-1: var(--sl-vision-tritanopia-color-data-blue);
+    --sl-vision-tritanopia-color-data-2: var(--sl-vision-tritanopia-color-data-orange);
+    --sl-vision-tritanopia-color-data-3: var(--sl-vision-tritanopia-color-data-green);
+    --sl-vision-tritanopia-color-data-4: var(--sl-vision-tritanopia-color-data-gold);
+    --sl-vision-tritanopia-color-data-5: var(--sl-vision-tritanopia-color-data-slate);
+    --sl-vision-tritanopia-color-data-6: var(--sl-vision-tritanopia-color-data-red);
+    --sl-vision-tritanopia-color-data-7: var(--sl-vision-tritanopia-color-data-taupe);
+    --sl-vision-tritanopia-color-data-8: var(--sl-vision-tritanopia-color-data-rose);
+    --sl-vision-tritanopia-color-data-9: var(--sl-vision-tritanopia-color-data-magenta);
+    --sl-vision-tritanopia-color-data-10: var(--sl-vision-tritanopia-color-data-brown);
+    --sl-vision-tritanopia-color-data-11: var(--sl-vision-tritanopia-color-data-sky);
+    --sl-vision-tritanopia-color-data-13: var(--sl-vision-tritanopia-color-data-mint);
+    --sl-vision-tritanopia-color-data-14: var(--sl-vision-tritanopia-color-data-sand);
+    --sl-vision-tritanopia-color-data-15: var(--sl-vision-tritanopia-color-data-ice);
+    --sl-vision-tritanopia-color-data-16: var(--sl-vision-tritanopia-color-data-salmon);
+    --sl-vision-tritanopia-color-data-17: var(--sl-vision-tritanopia-color-data-stone);
+    --sl-vision-tritanopia-color-data-18: var(--sl-vision-tritanopia-color-data-pink);
+    --sl-vision-tritanopia-color-data-19: var(--sl-vision-tritanopia-color-data-orchid);
+    --sl-vision-tritanopia-color-data-20: var(--sl-vision-tritanopia-color-data-tan);
+    --sl-vision-achromatopsia-color-data-1: var(--sl-vision-achromatopsia-color-data-blue);
+    --sl-vision-achromatopsia-color-data-2: var(--sl-vision-achromatopsia-color-data-orange);
+    --sl-vision-achromatopsia-color-data-3: var(--sl-vision-achromatopsia-color-data-green);
+    --sl-vision-achromatopsia-color-data-4: var(--sl-vision-achromatopsia-color-data-gold);
+    --sl-vision-achromatopsia-color-data-5: var(--sl-vision-achromatopsia-color-data-slate);
+    --sl-vision-achromatopsia-color-data-6: var(--sl-vision-achromatopsia-color-data-red);
+    --sl-vision-achromatopsia-color-data-7: var(--sl-vision-achromatopsia-color-data-taupe);
+    --sl-vision-achromatopsia-color-data-8: var(--sl-vision-achromatopsia-color-data-rose);
+    --sl-vision-achromatopsia-color-data-9: var(--sl-vision-achromatopsia-color-data-magenta);
+    --sl-vision-achromatopsia-color-data-10: var(--sl-vision-achromatopsia-color-data-brown);
+    --sl-vision-achromatopsia-color-data-11: var(--sl-vision-achromatopsia-color-data-sky);
+    --sl-vision-achromatopsia-color-data-13: var(--sl-vision-achromatopsia-color-data-mint);
+    --sl-vision-achromatopsia-color-data-14: var(--sl-vision-achromatopsia-color-data-sand);
+    --sl-vision-achromatopsia-color-data-15: var(--sl-vision-achromatopsia-color-data-ice);
+    --sl-vision-achromatopsia-color-data-16: var(--sl-vision-achromatopsia-color-data-salmon);
+    --sl-vision-achromatopsia-color-data-17: var(--sl-vision-achromatopsia-color-data-stone);
+    --sl-vision-achromatopsia-color-data-18: var(--sl-vision-achromatopsia-color-data-pink);
+    --sl-vision-achromatopsia-color-data-19: var(--sl-vision-achromatopsia-color-data-orchid);
+    --sl-vision-achromatopsia-color-data-20: var(--sl-vision-achromatopsia-color-data-tan);
+    --sl-scope-accent-solid: var(--sl-color-primary-500);
+    --sl-scope-accent-solid-hover: var(--sl-color-primary-600);
+    --sl-scope-accent-solid-active: var(--sl-color-primary-700);
+    --sl-scope-accent-on-solid: var(--sl-color-white);
+    --sl-scope-accent-soft-active: var(--sl-color-primary-100);
+    --sl-scope-chrome-fg: var(--sl-color-neutral-1100);
+    --sl-button-radius: var(--sl-radius-control);
+  }
+
+  [data-theme='deuteranopia'][data-look='classic'] {
+    --sl-color-primary-50: var(--sl-vision-deuteranopia-color-primary-50);
+    --sl-color-primary-75: var(--sl-vision-deuteranopia-color-primary-75);
+    --sl-color-primary-100: var(--sl-vision-deuteranopia-color-primary-100);
+    --sl-color-primary-200: var(--sl-vision-deuteranopia-color-primary-200);
+    --sl-color-primary-300: var(--sl-vision-deuteranopia-color-primary-300);
+    --sl-color-primary-400: var(--sl-vision-deuteranopia-color-primary-400);
+    --sl-color-primary-500: var(--sl-vision-deuteranopia-color-primary-500);
+    --sl-color-primary-600: var(--sl-vision-deuteranopia-color-primary-600);
+    --sl-color-primary-700: var(--sl-vision-deuteranopia-color-primary-700);
+    --sl-color-primary-800: var(--sl-vision-deuteranopia-color-primary-800);
+    --sl-color-primary-900: var(--sl-vision-deuteranopia-color-primary-900);
+    --sl-color-primary-1000: var(--sl-vision-deuteranopia-color-primary-1000);
+    --sl-color-primary-on-50: var(--sl-vision-deuteranopia-color-primary-on-50);
+    --sl-color-primary-on-75: var(--sl-vision-deuteranopia-color-primary-on-75);
+    --sl-color-primary-on-100: var(--sl-vision-deuteranopia-color-primary-on-100);
+    --sl-color-primary-on-200: var(--sl-vision-deuteranopia-color-primary-on-200);
+    --sl-color-primary-on-300: var(--sl-vision-deuteranopia-color-primary-on-300);
+    --sl-color-primary-on-400: var(--sl-vision-deuteranopia-color-primary-on-400);
+    --sl-color-primary-on-500: var(--sl-vision-deuteranopia-color-primary-on-500);
+    --sl-color-primary-on-600: var(--sl-vision-deuteranopia-color-primary-on-600);
+    --sl-color-primary-on-700: var(--sl-vision-deuteranopia-color-primary-on-700);
+    --sl-color-primary-on-800: var(--sl-vision-deuteranopia-color-primary-on-800);
+    --sl-color-primary-on-900: var(--sl-vision-deuteranopia-color-primary-on-900);
+    --sl-color-primary-on-1000: var(--sl-vision-deuteranopia-color-primary-on-1000);
+    --sl-color-secondary-50: var(--sl-vision-deuteranopia-color-secondary-50);
+    --sl-color-secondary-75: var(--sl-vision-deuteranopia-color-secondary-75);
+    --sl-color-secondary-100: var(--sl-vision-deuteranopia-color-secondary-100);
+    --sl-color-secondary-200: var(--sl-vision-deuteranopia-color-secondary-200);
+    --sl-color-secondary-300: var(--sl-vision-deuteranopia-color-secondary-300);
+    --sl-color-secondary-400: var(--sl-vision-deuteranopia-color-secondary-400);
+    --sl-color-secondary-500: var(--sl-vision-deuteranopia-color-secondary-500);
+    --sl-color-secondary-600: var(--sl-vision-deuteranopia-color-secondary-600);
+    --sl-color-secondary-700: var(--sl-vision-deuteranopia-color-secondary-700);
+    --sl-color-secondary-800: var(--sl-vision-deuteranopia-color-secondary-800);
+    --sl-color-secondary-900: var(--sl-vision-deuteranopia-color-secondary-900);
+    --sl-color-secondary-1000: var(--sl-vision-deuteranopia-color-secondary-1000);
+    --sl-color-secondary-on-50: var(--sl-vision-deuteranopia-color-secondary-on-50);
+    --sl-color-secondary-on-75: var(--sl-vision-deuteranopia-color-secondary-on-75);
+    --sl-color-secondary-on-100: var(--sl-vision-deuteranopia-color-secondary-on-100);
+    --sl-color-secondary-on-200: var(--sl-vision-deuteranopia-color-secondary-on-200);
+    --sl-color-secondary-on-300: var(--sl-vision-deuteranopia-color-secondary-on-300);
+    --sl-color-secondary-on-400: var(--sl-vision-deuteranopia-color-secondary-on-400);
+    --sl-color-secondary-on-500: var(--sl-vision-deuteranopia-color-secondary-on-500);
+    --sl-color-secondary-on-600: var(--sl-vision-deuteranopia-color-secondary-on-600);
+    --sl-color-secondary-on-700: var(--sl-vision-deuteranopia-color-secondary-on-700);
+    --sl-color-secondary-on-800: var(--sl-vision-deuteranopia-color-secondary-on-800);
+    --sl-color-secondary-on-900: var(--sl-vision-deuteranopia-color-secondary-on-900);
+    --sl-color-secondary-on-1000: var(--sl-vision-deuteranopia-color-secondary-on-1000);
+    --sl-color-tertiary-50: var(--sl-vision-deuteranopia-color-tertiary-50);
+    --sl-color-tertiary-75: var(--sl-vision-deuteranopia-color-tertiary-75);
+    --sl-color-tertiary-100: var(--sl-vision-deuteranopia-color-tertiary-100);
+    --sl-color-tertiary-200: var(--sl-vision-deuteranopia-color-tertiary-200);
+    --sl-color-tertiary-300: var(--sl-vision-deuteranopia-color-tertiary-300);
+    --sl-color-tertiary-400: var(--sl-vision-deuteranopia-color-tertiary-400);
+    --sl-color-tertiary-500: var(--sl-vision-deuteranopia-color-tertiary-500);
+    --sl-color-tertiary-600: var(--sl-vision-deuteranopia-color-tertiary-600);
+    --sl-color-tertiary-700: var(--sl-vision-deuteranopia-color-tertiary-700);
+    --sl-color-tertiary-800: var(--sl-vision-deuteranopia-color-tertiary-800);
+    --sl-color-tertiary-900: var(--sl-vision-deuteranopia-color-tertiary-900);
+    --sl-color-tertiary-1000: var(--sl-vision-deuteranopia-color-tertiary-1000);
+    --sl-color-tertiary-on-50: var(--sl-vision-deuteranopia-color-tertiary-on-50);
+    --sl-color-tertiary-on-75: var(--sl-vision-deuteranopia-color-tertiary-on-75);
+    --sl-color-tertiary-on-100: var(--sl-vision-deuteranopia-color-tertiary-on-100);
+    --sl-color-tertiary-on-200: var(--sl-vision-deuteranopia-color-tertiary-on-200);
+    --sl-color-tertiary-on-300: var(--sl-vision-deuteranopia-color-tertiary-on-300);
+    --sl-color-tertiary-on-400: var(--sl-vision-deuteranopia-color-tertiary-on-400);
+    --sl-color-tertiary-on-500: var(--sl-vision-deuteranopia-color-tertiary-on-500);
+    --sl-color-tertiary-on-600: var(--sl-vision-deuteranopia-color-tertiary-on-600);
+    --sl-color-tertiary-on-700: var(--sl-vision-deuteranopia-color-tertiary-on-700);
+    --sl-color-tertiary-on-800: var(--sl-vision-deuteranopia-color-tertiary-on-800);
+    --sl-color-tertiary-on-900: var(--sl-vision-deuteranopia-color-tertiary-on-900);
+    --sl-color-tertiary-on-1000: var(--sl-vision-deuteranopia-color-tertiary-on-1000);
+    --sl-color-quaternary-50: var(--sl-vision-deuteranopia-color-quaternary-50);
+    --sl-color-quaternary-75: var(--sl-vision-deuteranopia-color-quaternary-75);
+    --sl-color-quaternary-100: var(--sl-vision-deuteranopia-color-quaternary-100);
+    --sl-color-quaternary-200: var(--sl-vision-deuteranopia-color-quaternary-200);
+    --sl-color-quaternary-300: var(--sl-vision-deuteranopia-color-quaternary-300);
+    --sl-color-quaternary-400: var(--sl-vision-deuteranopia-color-quaternary-400);
+    --sl-color-quaternary-500: var(--sl-vision-deuteranopia-color-quaternary-500);
+    --sl-color-quaternary-600: var(--sl-vision-deuteranopia-color-quaternary-600);
+    --sl-color-quaternary-700: var(--sl-vision-deuteranopia-color-quaternary-700);
+    --sl-color-quaternary-800: var(--sl-vision-deuteranopia-color-quaternary-800);
+    --sl-color-quaternary-900: var(--sl-vision-deuteranopia-color-quaternary-900);
+    --sl-color-quaternary-1000: var(--sl-vision-deuteranopia-color-quaternary-1000);
+    --sl-color-quaternary-on-50: var(--sl-vision-deuteranopia-color-quaternary-on-50);
+    --sl-color-quaternary-on-75: var(--sl-vision-deuteranopia-color-quaternary-on-75);
+    --sl-color-quaternary-on-100: var(--sl-vision-deuteranopia-color-quaternary-on-100);
+    --sl-color-quaternary-on-200: var(--sl-vision-deuteranopia-color-quaternary-on-200);
+    --sl-color-quaternary-on-300: var(--sl-vision-deuteranopia-color-quaternary-on-300);
+    --sl-color-quaternary-on-400: var(--sl-vision-deuteranopia-color-quaternary-on-400);
+    --sl-color-quaternary-on-500: var(--sl-vision-deuteranopia-color-quaternary-on-500);
+    --sl-color-quaternary-on-600: var(--sl-vision-deuteranopia-color-quaternary-on-600);
+    --sl-color-quaternary-on-700: var(--sl-vision-deuteranopia-color-quaternary-on-700);
+    --sl-color-quaternary-on-800: var(--sl-vision-deuteranopia-color-quaternary-on-800);
+    --sl-color-quaternary-on-900: var(--sl-vision-deuteranopia-color-quaternary-on-900);
+    --sl-color-quaternary-on-1000: var(--sl-vision-deuteranopia-color-quaternary-on-1000);
+    --sl-color-success-50: var(--sl-vision-deuteranopia-color-success-50);
+    --sl-color-success-75: var(--sl-vision-deuteranopia-color-success-75);
+    --sl-color-success-100: var(--sl-vision-deuteranopia-color-success-100);
+    --sl-color-success-200: var(--sl-vision-deuteranopia-color-success-200);
+    --sl-color-success-300: var(--sl-vision-deuteranopia-color-success-300);
+    --sl-color-success-400: var(--sl-vision-deuteranopia-color-success-400);
+    --sl-color-success-500: var(--sl-vision-deuteranopia-color-success-500);
+    --sl-color-success-600: var(--sl-vision-deuteranopia-color-success-600);
+    --sl-color-success-700: var(--sl-vision-deuteranopia-color-success-700);
+    --sl-color-success-800: var(--sl-vision-deuteranopia-color-success-800);
+    --sl-color-success-900: var(--sl-vision-deuteranopia-color-success-900);
+    --sl-color-success-1000: var(--sl-vision-deuteranopia-color-success-1000);
+    --sl-color-success-on-50: var(--sl-vision-deuteranopia-color-success-on-50);
+    --sl-color-success-on-75: var(--sl-vision-deuteranopia-color-success-on-75);
+    --sl-color-success-on-100: var(--sl-vision-deuteranopia-color-success-on-100);
+    --sl-color-success-on-200: var(--sl-vision-deuteranopia-color-success-on-200);
+    --sl-color-success-on-300: var(--sl-vision-deuteranopia-color-success-on-300);
+    --sl-color-success-on-400: var(--sl-vision-deuteranopia-color-success-on-400);
+    --sl-color-success-on-500: var(--sl-vision-deuteranopia-color-success-on-500);
+    --sl-color-success-on-600: var(--sl-vision-deuteranopia-color-success-on-600);
+    --sl-color-success-on-700: var(--sl-vision-deuteranopia-color-success-on-700);
+    --sl-color-success-on-800: var(--sl-vision-deuteranopia-color-success-on-800);
+    --sl-color-success-on-900: var(--sl-vision-deuteranopia-color-success-on-900);
+    --sl-color-success-on-1000: var(--sl-vision-deuteranopia-color-success-on-1000);
+    --sl-color-warning-50: var(--sl-vision-deuteranopia-color-warning-50);
+    --sl-color-warning-75: var(--sl-vision-deuteranopia-color-warning-75);
+    --sl-color-warning-100: var(--sl-vision-deuteranopia-color-warning-100);
+    --sl-color-warning-200: var(--sl-vision-deuteranopia-color-warning-200);
+    --sl-color-warning-300: var(--sl-vision-deuteranopia-color-warning-300);
+    --sl-color-warning-400: var(--sl-vision-deuteranopia-color-warning-400);
+    --sl-color-warning-500: var(--sl-vision-deuteranopia-color-warning-500);
+    --sl-color-warning-600: var(--sl-vision-deuteranopia-color-warning-600);
+    --sl-color-warning-700: var(--sl-vision-deuteranopia-color-warning-700);
+    --sl-color-warning-800: var(--sl-vision-deuteranopia-color-warning-800);
+    --sl-color-warning-900: var(--sl-vision-deuteranopia-color-warning-900);
+    --sl-color-warning-1000: var(--sl-vision-deuteranopia-color-warning-1000);
+    --sl-color-warning-on-50: var(--sl-vision-deuteranopia-color-warning-on-50);
+    --sl-color-warning-on-75: var(--sl-vision-deuteranopia-color-warning-on-75);
+    --sl-color-warning-on-100: var(--sl-vision-deuteranopia-color-warning-on-100);
+    --sl-color-warning-on-200: var(--sl-vision-deuteranopia-color-warning-on-200);
+    --sl-color-warning-on-300: var(--sl-vision-deuteranopia-color-warning-on-300);
+    --sl-color-warning-on-400: var(--sl-vision-deuteranopia-color-warning-on-400);
+    --sl-color-warning-on-500: var(--sl-vision-deuteranopia-color-warning-on-500);
+    --sl-color-warning-on-600: var(--sl-vision-deuteranopia-color-warning-on-600);
+    --sl-color-warning-on-700: var(--sl-vision-deuteranopia-color-warning-on-700);
+    --sl-color-warning-on-800: var(--sl-vision-deuteranopia-color-warning-on-800);
+    --sl-color-warning-on-900: var(--sl-vision-deuteranopia-color-warning-on-900);
+    --sl-color-warning-on-1000: var(--sl-vision-deuteranopia-color-warning-on-1000);
+    --sl-color-error-50: var(--sl-vision-deuteranopia-color-error-50);
+    --sl-color-error-75: var(--sl-vision-deuteranopia-color-error-75);
+    --sl-color-error-100: var(--sl-vision-deuteranopia-color-error-100);
+    --sl-color-error-200: var(--sl-vision-deuteranopia-color-error-200);
+    --sl-color-error-300: var(--sl-vision-deuteranopia-color-error-300);
+    --sl-color-error-400: var(--sl-vision-deuteranopia-color-error-400);
+    --sl-color-error-500: var(--sl-vision-deuteranopia-color-error-500);
+    --sl-color-error-600: var(--sl-vision-deuteranopia-color-error-600);
+    --sl-color-error-700: var(--sl-vision-deuteranopia-color-error-700);
+    --sl-color-error-800: var(--sl-vision-deuteranopia-color-error-800);
+    --sl-color-error-900: var(--sl-vision-deuteranopia-color-error-900);
+    --sl-color-error-1000: var(--sl-vision-deuteranopia-color-error-1000);
+    --sl-color-error-on-50: var(--sl-vision-deuteranopia-color-error-on-50);
+    --sl-color-error-on-75: var(--sl-vision-deuteranopia-color-error-on-75);
+    --sl-color-error-on-100: var(--sl-vision-deuteranopia-color-error-on-100);
+    --sl-color-error-on-200: var(--sl-vision-deuteranopia-color-error-on-200);
+    --sl-color-error-on-300: var(--sl-vision-deuteranopia-color-error-on-300);
+    --sl-color-error-on-400: var(--sl-vision-deuteranopia-color-error-on-400);
+    --sl-color-error-on-500: var(--sl-vision-deuteranopia-color-error-on-500);
+    --sl-color-error-on-600: var(--sl-vision-deuteranopia-color-error-on-600);
+    --sl-color-error-on-700: var(--sl-vision-deuteranopia-color-error-on-700);
+    --sl-color-error-on-800: var(--sl-vision-deuteranopia-color-error-on-800);
+    --sl-color-error-on-900: var(--sl-vision-deuteranopia-color-error-on-900);
+    --sl-color-error-on-1000: var(--sl-vision-deuteranopia-color-error-on-1000);
+    --sl-color-info-50: var(--sl-vision-deuteranopia-color-info-50);
+    --sl-color-info-75: var(--sl-vision-deuteranopia-color-info-75);
+    --sl-color-info-100: var(--sl-vision-deuteranopia-color-info-100);
+    --sl-color-info-200: var(--sl-vision-deuteranopia-color-info-200);
+    --sl-color-info-300: var(--sl-vision-deuteranopia-color-info-300);
+    --sl-color-info-400: var(--sl-vision-deuteranopia-color-info-400);
+    --sl-color-info-500: var(--sl-vision-deuteranopia-color-info-500);
+    --sl-color-info-600: var(--sl-vision-deuteranopia-color-info-600);
+    --sl-color-info-700: var(--sl-vision-deuteranopia-color-info-700);
+    --sl-color-info-800: var(--sl-vision-deuteranopia-color-info-800);
+    --sl-color-info-900: var(--sl-vision-deuteranopia-color-info-900);
+    --sl-color-info-1000: var(--sl-vision-deuteranopia-color-info-1000);
+    --sl-color-info-on-50: var(--sl-vision-deuteranopia-color-info-on-50);
+    --sl-color-info-on-75: var(--sl-vision-deuteranopia-color-info-on-75);
+    --sl-color-info-on-100: var(--sl-vision-deuteranopia-color-info-on-100);
+    --sl-color-info-on-200: var(--sl-vision-deuteranopia-color-info-on-200);
+    --sl-color-info-on-300: var(--sl-vision-deuteranopia-color-info-on-300);
+    --sl-color-info-on-400: var(--sl-vision-deuteranopia-color-info-on-400);
+    --sl-color-info-on-500: var(--sl-vision-deuteranopia-color-info-on-500);
+    --sl-color-info-on-600: var(--sl-vision-deuteranopia-color-info-on-600);
+    --sl-color-info-on-700: var(--sl-vision-deuteranopia-color-info-on-700);
+    --sl-color-info-on-800: var(--sl-vision-deuteranopia-color-info-on-800);
+    --sl-color-info-on-900: var(--sl-vision-deuteranopia-color-info-on-900);
+    --sl-color-info-on-1000: var(--sl-vision-deuteranopia-color-info-on-1000);
+    --sl-color-data-1: var(--sl-vision-deuteranopia-color-data-1);
+    --sl-color-data-2: var(--sl-vision-deuteranopia-color-data-2);
+    --sl-color-data-3: var(--sl-vision-deuteranopia-color-data-3);
+    --sl-color-data-4: var(--sl-vision-deuteranopia-color-data-4);
+    --sl-color-data-5: var(--sl-vision-deuteranopia-color-data-5);
+    --sl-color-data-6: var(--sl-vision-deuteranopia-color-data-6);
+    --sl-color-data-7: var(--sl-vision-deuteranopia-color-data-7);
+    --sl-color-data-8: var(--sl-vision-deuteranopia-color-data-8);
+    --sl-color-data-9: var(--sl-vision-deuteranopia-color-data-9);
+    --sl-color-data-10: var(--sl-vision-deuteranopia-color-data-10);
+    --sl-color-data-11: var(--sl-vision-deuteranopia-color-data-11);
+    --sl-color-data-12: var(--sl-vision-deuteranopia-color-data-12);
+    --sl-color-data-13: var(--sl-vision-deuteranopia-color-data-13);
+    --sl-color-data-14: var(--sl-vision-deuteranopia-color-data-14);
+    --sl-color-data-15: var(--sl-vision-deuteranopia-color-data-15);
+    --sl-color-data-16: var(--sl-vision-deuteranopia-color-data-16);
+    --sl-color-data-17: var(--sl-vision-deuteranopia-color-data-17);
+    --sl-color-data-18: var(--sl-vision-deuteranopia-color-data-18);
+    --sl-color-data-19: var(--sl-vision-deuteranopia-color-data-19);
+    --sl-color-data-20: var(--sl-vision-deuteranopia-color-data-20);
+    --sl-color-data-blue: var(--sl-vision-deuteranopia-color-data-blue);
+    --sl-color-data-orange: var(--sl-vision-deuteranopia-color-data-orange);
+    --sl-color-data-green: var(--sl-vision-deuteranopia-color-data-green);
+    --sl-color-data-gold: var(--sl-vision-deuteranopia-color-data-gold);
+    --sl-color-data-slate: var(--sl-vision-deuteranopia-color-data-slate);
+    --sl-color-data-red: var(--sl-vision-deuteranopia-color-data-red);
+    --sl-color-data-taupe: var(--sl-vision-deuteranopia-color-data-taupe);
+    --sl-color-data-rose: var(--sl-vision-deuteranopia-color-data-rose);
+    --sl-color-data-magenta: var(--sl-vision-deuteranopia-color-data-magenta);
+    --sl-color-data-brown: var(--sl-vision-deuteranopia-color-data-brown);
+    --sl-color-data-sky: var(--sl-vision-deuteranopia-color-data-sky);
+    --sl-color-data-peach: var(--sl-vision-deuteranopia-color-data-peach);
+    --sl-color-data-mint: var(--sl-vision-deuteranopia-color-data-mint);
+    --sl-color-data-sand: var(--sl-vision-deuteranopia-color-data-sand);
+    --sl-color-data-ice: var(--sl-vision-deuteranopia-color-data-ice);
+    --sl-color-data-salmon: var(--sl-vision-deuteranopia-color-data-salmon);
+    --sl-color-data-stone: var(--sl-vision-deuteranopia-color-data-stone);
+    --sl-color-data-pink: var(--sl-vision-deuteranopia-color-data-pink);
+    --sl-color-data-orchid: var(--sl-vision-deuteranopia-color-data-orchid);
+    --sl-color-data-tan: var(--sl-vision-deuteranopia-color-data-tan);
+  }
+
+  [data-theme='protanopia'][data-look='classic'] {
+    --sl-color-primary-50: var(--sl-vision-protanopia-color-primary-50);
+    --sl-color-primary-75: var(--sl-vision-protanopia-color-primary-75);
+    --sl-color-primary-100: var(--sl-vision-protanopia-color-primary-100);
+    --sl-color-primary-200: var(--sl-vision-protanopia-color-primary-200);
+    --sl-color-primary-300: var(--sl-vision-protanopia-color-primary-300);
+    --sl-color-primary-400: var(--sl-vision-protanopia-color-primary-400);
+    --sl-color-primary-500: var(--sl-vision-protanopia-color-primary-500);
+    --sl-color-primary-600: var(--sl-vision-protanopia-color-primary-600);
+    --sl-color-primary-700: var(--sl-vision-protanopia-color-primary-700);
+    --sl-color-primary-800: var(--sl-vision-protanopia-color-primary-800);
+    --sl-color-primary-900: var(--sl-vision-protanopia-color-primary-900);
+    --sl-color-primary-1000: var(--sl-vision-protanopia-color-primary-1000);
+    --sl-color-primary-on-50: var(--sl-vision-protanopia-color-primary-on-50);
+    --sl-color-primary-on-75: var(--sl-vision-protanopia-color-primary-on-75);
+    --sl-color-primary-on-100: var(--sl-vision-protanopia-color-primary-on-100);
+    --sl-color-primary-on-200: var(--sl-vision-protanopia-color-primary-on-200);
+    --sl-color-primary-on-300: var(--sl-vision-protanopia-color-primary-on-300);
+    --sl-color-primary-on-400: var(--sl-vision-protanopia-color-primary-on-400);
+    --sl-color-primary-on-500: var(--sl-vision-protanopia-color-primary-on-500);
+    --sl-color-primary-on-600: var(--sl-vision-protanopia-color-primary-on-600);
+    --sl-color-primary-on-700: var(--sl-vision-protanopia-color-primary-on-700);
+    --sl-color-primary-on-800: var(--sl-vision-protanopia-color-primary-on-800);
+    --sl-color-primary-on-900: var(--sl-vision-protanopia-color-primary-on-900);
+    --sl-color-primary-on-1000: var(--sl-vision-protanopia-color-primary-on-1000);
+    --sl-color-secondary-50: var(--sl-vision-protanopia-color-secondary-50);
+    --sl-color-secondary-75: var(--sl-vision-protanopia-color-secondary-75);
+    --sl-color-secondary-100: var(--sl-vision-protanopia-color-secondary-100);
+    --sl-color-secondary-200: var(--sl-vision-protanopia-color-secondary-200);
+    --sl-color-secondary-300: var(--sl-vision-protanopia-color-secondary-300);
+    --sl-color-secondary-400: var(--sl-vision-protanopia-color-secondary-400);
+    --sl-color-secondary-500: var(--sl-vision-protanopia-color-secondary-500);
+    --sl-color-secondary-600: var(--sl-vision-protanopia-color-secondary-600);
+    --sl-color-secondary-700: var(--sl-vision-protanopia-color-secondary-700);
+    --sl-color-secondary-800: var(--sl-vision-protanopia-color-secondary-800);
+    --sl-color-secondary-900: var(--sl-vision-protanopia-color-secondary-900);
+    --sl-color-secondary-1000: var(--sl-vision-protanopia-color-secondary-1000);
+    --sl-color-secondary-on-50: var(--sl-vision-protanopia-color-secondary-on-50);
+    --sl-color-secondary-on-75: var(--sl-vision-protanopia-color-secondary-on-75);
+    --sl-color-secondary-on-100: var(--sl-vision-protanopia-color-secondary-on-100);
+    --sl-color-secondary-on-200: var(--sl-vision-protanopia-color-secondary-on-200);
+    --sl-color-secondary-on-300: var(--sl-vision-protanopia-color-secondary-on-300);
+    --sl-color-secondary-on-400: var(--sl-vision-protanopia-color-secondary-on-400);
+    --sl-color-secondary-on-500: var(--sl-vision-protanopia-color-secondary-on-500);
+    --sl-color-secondary-on-600: var(--sl-vision-protanopia-color-secondary-on-600);
+    --sl-color-secondary-on-700: var(--sl-vision-protanopia-color-secondary-on-700);
+    --sl-color-secondary-on-800: var(--sl-vision-protanopia-color-secondary-on-800);
+    --sl-color-secondary-on-900: var(--sl-vision-protanopia-color-secondary-on-900);
+    --sl-color-secondary-on-1000: var(--sl-vision-protanopia-color-secondary-on-1000);
+    --sl-color-tertiary-50: var(--sl-vision-protanopia-color-tertiary-50);
+    --sl-color-tertiary-75: var(--sl-vision-protanopia-color-tertiary-75);
+    --sl-color-tertiary-100: var(--sl-vision-protanopia-color-tertiary-100);
+    --sl-color-tertiary-200: var(--sl-vision-protanopia-color-tertiary-200);
+    --sl-color-tertiary-300: var(--sl-vision-protanopia-color-tertiary-300);
+    --sl-color-tertiary-400: var(--sl-vision-protanopia-color-tertiary-400);
+    --sl-color-tertiary-500: var(--sl-vision-protanopia-color-tertiary-500);
+    --sl-color-tertiary-600: var(--sl-vision-protanopia-color-tertiary-600);
+    --sl-color-tertiary-700: var(--sl-vision-protanopia-color-tertiary-700);
+    --sl-color-tertiary-800: var(--sl-vision-protanopia-color-tertiary-800);
+    --sl-color-tertiary-900: var(--sl-vision-protanopia-color-tertiary-900);
+    --sl-color-tertiary-1000: var(--sl-vision-protanopia-color-tertiary-1000);
+    --sl-color-tertiary-on-50: var(--sl-vision-protanopia-color-tertiary-on-50);
+    --sl-color-tertiary-on-75: var(--sl-vision-protanopia-color-tertiary-on-75);
+    --sl-color-tertiary-on-100: var(--sl-vision-protanopia-color-tertiary-on-100);
+    --sl-color-tertiary-on-200: var(--sl-vision-protanopia-color-tertiary-on-200);
+    --sl-color-tertiary-on-300: var(--sl-vision-protanopia-color-tertiary-on-300);
+    --sl-color-tertiary-on-400: var(--sl-vision-protanopia-color-tertiary-on-400);
+    --sl-color-tertiary-on-500: var(--sl-vision-protanopia-color-tertiary-on-500);
+    --sl-color-tertiary-on-600: var(--sl-vision-protanopia-color-tertiary-on-600);
+    --sl-color-tertiary-on-700: var(--sl-vision-protanopia-color-tertiary-on-700);
+    --sl-color-tertiary-on-800: var(--sl-vision-protanopia-color-tertiary-on-800);
+    --sl-color-tertiary-on-900: var(--sl-vision-protanopia-color-tertiary-on-900);
+    --sl-color-tertiary-on-1000: var(--sl-vision-protanopia-color-tertiary-on-1000);
+    --sl-color-quaternary-50: var(--sl-vision-protanopia-color-quaternary-50);
+    --sl-color-quaternary-75: var(--sl-vision-protanopia-color-quaternary-75);
+    --sl-color-quaternary-100: var(--sl-vision-protanopia-color-quaternary-100);
+    --sl-color-quaternary-200: var(--sl-vision-protanopia-color-quaternary-200);
+    --sl-color-quaternary-300: var(--sl-vision-protanopia-color-quaternary-300);
+    --sl-color-quaternary-400: var(--sl-vision-protanopia-color-quaternary-400);
+    --sl-color-quaternary-500: var(--sl-vision-protanopia-color-quaternary-500);
+    --sl-color-quaternary-600: var(--sl-vision-protanopia-color-quaternary-600);
+    --sl-color-quaternary-700: var(--sl-vision-protanopia-color-quaternary-700);
+    --sl-color-quaternary-800: var(--sl-vision-protanopia-color-quaternary-800);
+    --sl-color-quaternary-900: var(--sl-vision-protanopia-color-quaternary-900);
+    --sl-color-quaternary-1000: var(--sl-vision-protanopia-color-quaternary-1000);
+    --sl-color-quaternary-on-50: var(--sl-vision-protanopia-color-quaternary-on-50);
+    --sl-color-quaternary-on-75: var(--sl-vision-protanopia-color-quaternary-on-75);
+    --sl-color-quaternary-on-100: var(--sl-vision-protanopia-color-quaternary-on-100);
+    --sl-color-quaternary-on-200: var(--sl-vision-protanopia-color-quaternary-on-200);
+    --sl-color-quaternary-on-300: var(--sl-vision-protanopia-color-quaternary-on-300);
+    --sl-color-quaternary-on-400: var(--sl-vision-protanopia-color-quaternary-on-400);
+    --sl-color-quaternary-on-500: var(--sl-vision-protanopia-color-quaternary-on-500);
+    --sl-color-quaternary-on-600: var(--sl-vision-protanopia-color-quaternary-on-600);
+    --sl-color-quaternary-on-700: var(--sl-vision-protanopia-color-quaternary-on-700);
+    --sl-color-quaternary-on-800: var(--sl-vision-protanopia-color-quaternary-on-800);
+    --sl-color-quaternary-on-900: var(--sl-vision-protanopia-color-quaternary-on-900);
+    --sl-color-quaternary-on-1000: var(--sl-vision-protanopia-color-quaternary-on-1000);
+    --sl-color-success-50: var(--sl-vision-protanopia-color-success-50);
+    --sl-color-success-75: var(--sl-vision-protanopia-color-success-75);
+    --sl-color-success-100: var(--sl-vision-protanopia-color-success-100);
+    --sl-color-success-200: var(--sl-vision-protanopia-color-success-200);
+    --sl-color-success-300: var(--sl-vision-protanopia-color-success-300);
+    --sl-color-success-400: var(--sl-vision-protanopia-color-success-400);
+    --sl-color-success-500: var(--sl-vision-protanopia-color-success-500);
+    --sl-color-success-600: var(--sl-vision-protanopia-color-success-600);
+    --sl-color-success-700: var(--sl-vision-protanopia-color-success-700);
+    --sl-color-success-800: var(--sl-vision-protanopia-color-success-800);
+    --sl-color-success-900: var(--sl-vision-protanopia-color-success-900);
+    --sl-color-success-1000: var(--sl-vision-protanopia-color-success-1000);
+    --sl-color-success-on-50: var(--sl-vision-protanopia-color-success-on-50);
+    --sl-color-success-on-75: var(--sl-vision-protanopia-color-success-on-75);
+    --sl-color-success-on-100: var(--sl-vision-protanopia-color-success-on-100);
+    --sl-color-success-on-200: var(--sl-vision-protanopia-color-success-on-200);
+    --sl-color-success-on-300: var(--sl-vision-protanopia-color-success-on-300);
+    --sl-color-success-on-400: var(--sl-vision-protanopia-color-success-on-400);
+    --sl-color-success-on-500: var(--sl-vision-protanopia-color-success-on-500);
+    --sl-color-success-on-600: var(--sl-vision-protanopia-color-success-on-600);
+    --sl-color-success-on-700: var(--sl-vision-protanopia-color-success-on-700);
+    --sl-color-success-on-800: var(--sl-vision-protanopia-color-success-on-800);
+    --sl-color-success-on-900: var(--sl-vision-protanopia-color-success-on-900);
+    --sl-color-success-on-1000: var(--sl-vision-protanopia-color-success-on-1000);
+    --sl-color-warning-50: var(--sl-vision-protanopia-color-warning-50);
+    --sl-color-warning-75: var(--sl-vision-protanopia-color-warning-75);
+    --sl-color-warning-100: var(--sl-vision-protanopia-color-warning-100);
+    --sl-color-warning-200: var(--sl-vision-protanopia-color-warning-200);
+    --sl-color-warning-300: var(--sl-vision-protanopia-color-warning-300);
+    --sl-color-warning-400: var(--sl-vision-protanopia-color-warning-400);
+    --sl-color-warning-500: var(--sl-vision-protanopia-color-warning-500);
+    --sl-color-warning-600: var(--sl-vision-protanopia-color-warning-600);
+    --sl-color-warning-700: var(--sl-vision-protanopia-color-warning-700);
+    --sl-color-warning-800: var(--sl-vision-protanopia-color-warning-800);
+    --sl-color-warning-900: var(--sl-vision-protanopia-color-warning-900);
+    --sl-color-warning-1000: var(--sl-vision-protanopia-color-warning-1000);
+    --sl-color-warning-on-50: var(--sl-vision-protanopia-color-warning-on-50);
+    --sl-color-warning-on-75: var(--sl-vision-protanopia-color-warning-on-75);
+    --sl-color-warning-on-100: var(--sl-vision-protanopia-color-warning-on-100);
+    --sl-color-warning-on-200: var(--sl-vision-protanopia-color-warning-on-200);
+    --sl-color-warning-on-300: var(--sl-vision-protanopia-color-warning-on-300);
+    --sl-color-warning-on-400: var(--sl-vision-protanopia-color-warning-on-400);
+    --sl-color-warning-on-500: var(--sl-vision-protanopia-color-warning-on-500);
+    --sl-color-warning-on-600: var(--sl-vision-protanopia-color-warning-on-600);
+    --sl-color-warning-on-700: var(--sl-vision-protanopia-color-warning-on-700);
+    --sl-color-warning-on-800: var(--sl-vision-protanopia-color-warning-on-800);
+    --sl-color-warning-on-900: var(--sl-vision-protanopia-color-warning-on-900);
+    --sl-color-warning-on-1000: var(--sl-vision-protanopia-color-warning-on-1000);
+    --sl-color-error-50: var(--sl-vision-protanopia-color-error-50);
+    --sl-color-error-75: var(--sl-vision-protanopia-color-error-75);
+    --sl-color-error-100: var(--sl-vision-protanopia-color-error-100);
+    --sl-color-error-200: var(--sl-vision-protanopia-color-error-200);
+    --sl-color-error-300: var(--sl-vision-protanopia-color-error-300);
+    --sl-color-error-400: var(--sl-vision-protanopia-color-error-400);
+    --sl-color-error-500: var(--sl-vision-protanopia-color-error-500);
+    --sl-color-error-600: var(--sl-vision-protanopia-color-error-600);
+    --sl-color-error-700: var(--sl-vision-protanopia-color-error-700);
+    --sl-color-error-800: var(--sl-vision-protanopia-color-error-800);
+    --sl-color-error-900: var(--sl-vision-protanopia-color-error-900);
+    --sl-color-error-1000: var(--sl-vision-protanopia-color-error-1000);
+    --sl-color-error-on-50: var(--sl-vision-protanopia-color-error-on-50);
+    --sl-color-error-on-75: var(--sl-vision-protanopia-color-error-on-75);
+    --sl-color-error-on-100: var(--sl-vision-protanopia-color-error-on-100);
+    --sl-color-error-on-200: var(--sl-vision-protanopia-color-error-on-200);
+    --sl-color-error-on-300: var(--sl-vision-protanopia-color-error-on-300);
+    --sl-color-error-on-400: var(--sl-vision-protanopia-color-error-on-400);
+    --sl-color-error-on-500: var(--sl-vision-protanopia-color-error-on-500);
+    --sl-color-error-on-600: var(--sl-vision-protanopia-color-error-on-600);
+    --sl-color-error-on-700: var(--sl-vision-protanopia-color-error-on-700);
+    --sl-color-error-on-800: var(--sl-vision-protanopia-color-error-on-800);
+    --sl-color-error-on-900: var(--sl-vision-protanopia-color-error-on-900);
+    --sl-color-error-on-1000: var(--sl-vision-protanopia-color-error-on-1000);
+    --sl-color-info-50: var(--sl-vision-protanopia-color-info-50);
+    --sl-color-info-75: var(--sl-vision-protanopia-color-info-75);
+    --sl-color-info-100: var(--sl-vision-protanopia-color-info-100);
+    --sl-color-info-200: var(--sl-vision-protanopia-color-info-200);
+    --sl-color-info-300: var(--sl-vision-protanopia-color-info-300);
+    --sl-color-info-400: var(--sl-vision-protanopia-color-info-400);
+    --sl-color-info-500: var(--sl-vision-protanopia-color-info-500);
+    --sl-color-info-600: var(--sl-vision-protanopia-color-info-600);
+    --sl-color-info-700: var(--sl-vision-protanopia-color-info-700);
+    --sl-color-info-800: var(--sl-vision-protanopia-color-info-800);
+    --sl-color-info-900: var(--sl-vision-protanopia-color-info-900);
+    --sl-color-info-1000: var(--sl-vision-protanopia-color-info-1000);
+    --sl-color-info-on-50: var(--sl-vision-protanopia-color-info-on-50);
+    --sl-color-info-on-75: var(--sl-vision-protanopia-color-info-on-75);
+    --sl-color-info-on-100: var(--sl-vision-protanopia-color-info-on-100);
+    --sl-color-info-on-200: var(--sl-vision-protanopia-color-info-on-200);
+    --sl-color-info-on-300: var(--sl-vision-protanopia-color-info-on-300);
+    --sl-color-info-on-400: var(--sl-vision-protanopia-color-info-on-400);
+    --sl-color-info-on-500: var(--sl-vision-protanopia-color-info-on-500);
+    --sl-color-info-on-600: var(--sl-vision-protanopia-color-info-on-600);
+    --sl-color-info-on-700: var(--sl-vision-protanopia-color-info-on-700);
+    --sl-color-info-on-800: var(--sl-vision-protanopia-color-info-on-800);
+    --sl-color-info-on-900: var(--sl-vision-protanopia-color-info-on-900);
+    --sl-color-info-on-1000: var(--sl-vision-protanopia-color-info-on-1000);
+    --sl-color-data-1: var(--sl-vision-protanopia-color-data-1);
+    --sl-color-data-2: var(--sl-vision-protanopia-color-data-2);
+    --sl-color-data-3: var(--sl-vision-protanopia-color-data-3);
+    --sl-color-data-4: var(--sl-vision-protanopia-color-data-4);
+    --sl-color-data-5: var(--sl-vision-protanopia-color-data-5);
+    --sl-color-data-6: var(--sl-vision-protanopia-color-data-6);
+    --sl-color-data-7: var(--sl-vision-protanopia-color-data-7);
+    --sl-color-data-8: var(--sl-vision-protanopia-color-data-8);
+    --sl-color-data-9: var(--sl-vision-protanopia-color-data-9);
+    --sl-color-data-10: var(--sl-vision-protanopia-color-data-10);
+    --sl-color-data-11: var(--sl-vision-protanopia-color-data-11);
+    --sl-color-data-12: var(--sl-vision-protanopia-color-data-12);
+    --sl-color-data-13: var(--sl-vision-protanopia-color-data-13);
+    --sl-color-data-14: var(--sl-vision-protanopia-color-data-14);
+    --sl-color-data-15: var(--sl-vision-protanopia-color-data-15);
+    --sl-color-data-16: var(--sl-vision-protanopia-color-data-16);
+    --sl-color-data-17: var(--sl-vision-protanopia-color-data-17);
+    --sl-color-data-18: var(--sl-vision-protanopia-color-data-18);
+    --sl-color-data-19: var(--sl-vision-protanopia-color-data-19);
+    --sl-color-data-20: var(--sl-vision-protanopia-color-data-20);
+    --sl-color-data-blue: var(--sl-vision-protanopia-color-data-blue);
+    --sl-color-data-orange: var(--sl-vision-protanopia-color-data-orange);
+    --sl-color-data-green: var(--sl-vision-protanopia-color-data-green);
+    --sl-color-data-gold: var(--sl-vision-protanopia-color-data-gold);
+    --sl-color-data-slate: var(--sl-vision-protanopia-color-data-slate);
+    --sl-color-data-red: var(--sl-vision-protanopia-color-data-red);
+    --sl-color-data-taupe: var(--sl-vision-protanopia-color-data-taupe);
+    --sl-color-data-rose: var(--sl-vision-protanopia-color-data-rose);
+    --sl-color-data-magenta: var(--sl-vision-protanopia-color-data-magenta);
+    --sl-color-data-brown: var(--sl-vision-protanopia-color-data-brown);
+    --sl-color-data-sky: var(--sl-vision-protanopia-color-data-sky);
+    --sl-color-data-peach: var(--sl-vision-protanopia-color-data-peach);
+    --sl-color-data-mint: var(--sl-vision-protanopia-color-data-mint);
+    --sl-color-data-sand: var(--sl-vision-protanopia-color-data-sand);
+    --sl-color-data-ice: var(--sl-vision-protanopia-color-data-ice);
+    --sl-color-data-salmon: var(--sl-vision-protanopia-color-data-salmon);
+    --sl-color-data-stone: var(--sl-vision-protanopia-color-data-stone);
+    --sl-color-data-pink: var(--sl-vision-protanopia-color-data-pink);
+    --sl-color-data-orchid: var(--sl-vision-protanopia-color-data-orchid);
+    --sl-color-data-tan: var(--sl-vision-protanopia-color-data-tan);
+  }
+
+  [data-theme='tritanopia'][data-look='classic'] {
+    --sl-color-primary-50: var(--sl-vision-tritanopia-color-primary-50);
+    --sl-color-primary-75: var(--sl-vision-tritanopia-color-primary-75);
+    --sl-color-primary-100: var(--sl-vision-tritanopia-color-primary-100);
+    --sl-color-primary-200: var(--sl-vision-tritanopia-color-primary-200);
+    --sl-color-primary-300: var(--sl-vision-tritanopia-color-primary-300);
+    --sl-color-primary-400: var(--sl-vision-tritanopia-color-primary-400);
+    --sl-color-primary-500: var(--sl-vision-tritanopia-color-primary-500);
+    --sl-color-primary-600: var(--sl-vision-tritanopia-color-primary-600);
+    --sl-color-primary-700: var(--sl-vision-tritanopia-color-primary-700);
+    --sl-color-primary-800: var(--sl-vision-tritanopia-color-primary-800);
+    --sl-color-primary-900: var(--sl-vision-tritanopia-color-primary-900);
+    --sl-color-primary-1000: var(--sl-vision-tritanopia-color-primary-1000);
+    --sl-color-primary-on-50: var(--sl-vision-tritanopia-color-primary-on-50);
+    --sl-color-primary-on-75: var(--sl-vision-tritanopia-color-primary-on-75);
+    --sl-color-primary-on-100: var(--sl-vision-tritanopia-color-primary-on-100);
+    --sl-color-primary-on-200: var(--sl-vision-tritanopia-color-primary-on-200);
+    --sl-color-primary-on-300: var(--sl-vision-tritanopia-color-primary-on-300);
+    --sl-color-primary-on-400: var(--sl-vision-tritanopia-color-primary-on-400);
+    --sl-color-primary-on-500: var(--sl-vision-tritanopia-color-primary-on-500);
+    --sl-color-primary-on-600: var(--sl-vision-tritanopia-color-primary-on-600);
+    --sl-color-primary-on-700: var(--sl-vision-tritanopia-color-primary-on-700);
+    --sl-color-primary-on-800: var(--sl-vision-tritanopia-color-primary-on-800);
+    --sl-color-primary-on-900: var(--sl-vision-tritanopia-color-primary-on-900);
+    --sl-color-primary-on-1000: var(--sl-vision-tritanopia-color-primary-on-1000);
+    --sl-color-secondary-50: var(--sl-vision-tritanopia-color-secondary-50);
+    --sl-color-secondary-75: var(--sl-vision-tritanopia-color-secondary-75);
+    --sl-color-secondary-100: var(--sl-vision-tritanopia-color-secondary-100);
+    --sl-color-secondary-200: var(--sl-vision-tritanopia-color-secondary-200);
+    --sl-color-secondary-300: var(--sl-vision-tritanopia-color-secondary-300);
+    --sl-color-secondary-400: var(--sl-vision-tritanopia-color-secondary-400);
+    --sl-color-secondary-500: var(--sl-vision-tritanopia-color-secondary-500);
+    --sl-color-secondary-600: var(--sl-vision-tritanopia-color-secondary-600);
+    --sl-color-secondary-700: var(--sl-vision-tritanopia-color-secondary-700);
+    --sl-color-secondary-800: var(--sl-vision-tritanopia-color-secondary-800);
+    --sl-color-secondary-900: var(--sl-vision-tritanopia-color-secondary-900);
+    --sl-color-secondary-1000: var(--sl-vision-tritanopia-color-secondary-1000);
+    --sl-color-secondary-on-50: var(--sl-vision-tritanopia-color-secondary-on-50);
+    --sl-color-secondary-on-75: var(--sl-vision-tritanopia-color-secondary-on-75);
+    --sl-color-secondary-on-100: var(--sl-vision-tritanopia-color-secondary-on-100);
+    --sl-color-secondary-on-200: var(--sl-vision-tritanopia-color-secondary-on-200);
+    --sl-color-secondary-on-300: var(--sl-vision-tritanopia-color-secondary-on-300);
+    --sl-color-secondary-on-400: var(--sl-vision-tritanopia-color-secondary-on-400);
+    --sl-color-secondary-on-500: var(--sl-vision-tritanopia-color-secondary-on-500);
+    --sl-color-secondary-on-600: var(--sl-vision-tritanopia-color-secondary-on-600);
+    --sl-color-secondary-on-700: var(--sl-vision-tritanopia-color-secondary-on-700);
+    --sl-color-secondary-on-800: var(--sl-vision-tritanopia-color-secondary-on-800);
+    --sl-color-secondary-on-900: var(--sl-vision-tritanopia-color-secondary-on-900);
+    --sl-color-secondary-on-1000: var(--sl-vision-tritanopia-color-secondary-on-1000);
+    --sl-color-tertiary-50: var(--sl-vision-tritanopia-color-tertiary-50);
+    --sl-color-tertiary-75: var(--sl-vision-tritanopia-color-tertiary-75);
+    --sl-color-tertiary-100: var(--sl-vision-tritanopia-color-tertiary-100);
+    --sl-color-tertiary-200: var(--sl-vision-tritanopia-color-tertiary-200);
+    --sl-color-tertiary-300: var(--sl-vision-tritanopia-color-tertiary-300);
+    --sl-color-tertiary-400: var(--sl-vision-tritanopia-color-tertiary-400);
+    --sl-color-tertiary-500: var(--sl-vision-tritanopia-color-tertiary-500);
+    --sl-color-tertiary-600: var(--sl-vision-tritanopia-color-tertiary-600);
+    --sl-color-tertiary-700: var(--sl-vision-tritanopia-color-tertiary-700);
+    --sl-color-tertiary-800: var(--sl-vision-tritanopia-color-tertiary-800);
+    --sl-color-tertiary-900: var(--sl-vision-tritanopia-color-tertiary-900);
+    --sl-color-tertiary-1000: var(--sl-vision-tritanopia-color-tertiary-1000);
+    --sl-color-tertiary-on-50: var(--sl-vision-tritanopia-color-tertiary-on-50);
+    --sl-color-tertiary-on-75: var(--sl-vision-tritanopia-color-tertiary-on-75);
+    --sl-color-tertiary-on-100: var(--sl-vision-tritanopia-color-tertiary-on-100);
+    --sl-color-tertiary-on-200: var(--sl-vision-tritanopia-color-tertiary-on-200);
+    --sl-color-tertiary-on-300: var(--sl-vision-tritanopia-color-tertiary-on-300);
+    --sl-color-tertiary-on-400: var(--sl-vision-tritanopia-color-tertiary-on-400);
+    --sl-color-tertiary-on-500: var(--sl-vision-tritanopia-color-tertiary-on-500);
+    --sl-color-tertiary-on-600: var(--sl-vision-tritanopia-color-tertiary-on-600);
+    --sl-color-tertiary-on-700: var(--sl-vision-tritanopia-color-tertiary-on-700);
+    --sl-color-tertiary-on-800: var(--sl-vision-tritanopia-color-tertiary-on-800);
+    --sl-color-tertiary-on-900: var(--sl-vision-tritanopia-color-tertiary-on-900);
+    --sl-color-tertiary-on-1000: var(--sl-vision-tritanopia-color-tertiary-on-1000);
+    --sl-color-quaternary-50: var(--sl-vision-tritanopia-color-quaternary-50);
+    --sl-color-quaternary-75: var(--sl-vision-tritanopia-color-quaternary-75);
+    --sl-color-quaternary-100: var(--sl-vision-tritanopia-color-quaternary-100);
+    --sl-color-quaternary-200: var(--sl-vision-tritanopia-color-quaternary-200);
+    --sl-color-quaternary-300: var(--sl-vision-tritanopia-color-quaternary-300);
+    --sl-color-quaternary-400: var(--sl-vision-tritanopia-color-quaternary-400);
+    --sl-color-quaternary-500: var(--sl-vision-tritanopia-color-quaternary-500);
+    --sl-color-quaternary-600: var(--sl-vision-tritanopia-color-quaternary-600);
+    --sl-color-quaternary-700: var(--sl-vision-tritanopia-color-quaternary-700);
+    --sl-color-quaternary-800: var(--sl-vision-tritanopia-color-quaternary-800);
+    --sl-color-quaternary-900: var(--sl-vision-tritanopia-color-quaternary-900);
+    --sl-color-quaternary-1000: var(--sl-vision-tritanopia-color-quaternary-1000);
+    --sl-color-quaternary-on-50: var(--sl-vision-tritanopia-color-quaternary-on-50);
+    --sl-color-quaternary-on-75: var(--sl-vision-tritanopia-color-quaternary-on-75);
+    --sl-color-quaternary-on-100: var(--sl-vision-tritanopia-color-quaternary-on-100);
+    --sl-color-quaternary-on-200: var(--sl-vision-tritanopia-color-quaternary-on-200);
+    --sl-color-quaternary-on-300: var(--sl-vision-tritanopia-color-quaternary-on-300);
+    --sl-color-quaternary-on-400: var(--sl-vision-tritanopia-color-quaternary-on-400);
+    --sl-color-quaternary-on-500: var(--sl-vision-tritanopia-color-quaternary-on-500);
+    --sl-color-quaternary-on-600: var(--sl-vision-tritanopia-color-quaternary-on-600);
+    --sl-color-quaternary-on-700: var(--sl-vision-tritanopia-color-quaternary-on-700);
+    --sl-color-quaternary-on-800: var(--sl-vision-tritanopia-color-quaternary-on-800);
+    --sl-color-quaternary-on-900: var(--sl-vision-tritanopia-color-quaternary-on-900);
+    --sl-color-quaternary-on-1000: var(--sl-vision-tritanopia-color-quaternary-on-1000);
+    --sl-color-success-50: var(--sl-vision-tritanopia-color-success-50);
+    --sl-color-success-75: var(--sl-vision-tritanopia-color-success-75);
+    --sl-color-success-100: var(--sl-vision-tritanopia-color-success-100);
+    --sl-color-success-200: var(--sl-vision-tritanopia-color-success-200);
+    --sl-color-success-300: var(--sl-vision-tritanopia-color-success-300);
+    --sl-color-success-400: var(--sl-vision-tritanopia-color-success-400);
+    --sl-color-success-500: var(--sl-vision-tritanopia-color-success-500);
+    --sl-color-success-600: var(--sl-vision-tritanopia-color-success-600);
+    --sl-color-success-700: var(--sl-vision-tritanopia-color-success-700);
+    --sl-color-success-800: var(--sl-vision-tritanopia-color-success-800);
+    --sl-color-success-900: var(--sl-vision-tritanopia-color-success-900);
+    --sl-color-success-1000: var(--sl-vision-tritanopia-color-success-1000);
+    --sl-color-success-on-50: var(--sl-vision-tritanopia-color-success-on-50);
+    --sl-color-success-on-75: var(--sl-vision-tritanopia-color-success-on-75);
+    --sl-color-success-on-100: var(--sl-vision-tritanopia-color-success-on-100);
+    --sl-color-success-on-200: var(--sl-vision-tritanopia-color-success-on-200);
+    --sl-color-success-on-300: var(--sl-vision-tritanopia-color-success-on-300);
+    --sl-color-success-on-400: var(--sl-vision-tritanopia-color-success-on-400);
+    --sl-color-success-on-500: var(--sl-vision-tritanopia-color-success-on-500);
+    --sl-color-success-on-600: var(--sl-vision-tritanopia-color-success-on-600);
+    --sl-color-success-on-700: var(--sl-vision-tritanopia-color-success-on-700);
+    --sl-color-success-on-800: var(--sl-vision-tritanopia-color-success-on-800);
+    --sl-color-success-on-900: var(--sl-vision-tritanopia-color-success-on-900);
+    --sl-color-success-on-1000: var(--sl-vision-tritanopia-color-success-on-1000);
+    --sl-color-warning-50: var(--sl-vision-tritanopia-color-warning-50);
+    --sl-color-warning-75: var(--sl-vision-tritanopia-color-warning-75);
+    --sl-color-warning-100: var(--sl-vision-tritanopia-color-warning-100);
+    --sl-color-warning-200: var(--sl-vision-tritanopia-color-warning-200);
+    --sl-color-warning-300: var(--sl-vision-tritanopia-color-warning-300);
+    --sl-color-warning-400: var(--sl-vision-tritanopia-color-warning-400);
+    --sl-color-warning-500: var(--sl-vision-tritanopia-color-warning-500);
+    --sl-color-warning-600: var(--sl-vision-tritanopia-color-warning-600);
+    --sl-color-warning-700: var(--sl-vision-tritanopia-color-warning-700);
+    --sl-color-warning-800: var(--sl-vision-tritanopia-color-warning-800);
+    --sl-color-warning-900: var(--sl-vision-tritanopia-color-warning-900);
+    --sl-color-warning-1000: var(--sl-vision-tritanopia-color-warning-1000);
+    --sl-color-warning-on-50: var(--sl-vision-tritanopia-color-warning-on-50);
+    --sl-color-warning-on-75: var(--sl-vision-tritanopia-color-warning-on-75);
+    --sl-color-warning-on-100: var(--sl-vision-tritanopia-color-warning-on-100);
+    --sl-color-warning-on-200: var(--sl-vision-tritanopia-color-warning-on-200);
+    --sl-color-warning-on-300: var(--sl-vision-tritanopia-color-warning-on-300);
+    --sl-color-warning-on-400: var(--sl-vision-tritanopia-color-warning-on-400);
+    --sl-color-warning-on-500: var(--sl-vision-tritanopia-color-warning-on-500);
+    --sl-color-warning-on-600: var(--sl-vision-tritanopia-color-warning-on-600);
+    --sl-color-warning-on-700: var(--sl-vision-tritanopia-color-warning-on-700);
+    --sl-color-warning-on-800: var(--sl-vision-tritanopia-color-warning-on-800);
+    --sl-color-warning-on-900: var(--sl-vision-tritanopia-color-warning-on-900);
+    --sl-color-warning-on-1000: var(--sl-vision-tritanopia-color-warning-on-1000);
+    --sl-color-error-50: var(--sl-vision-tritanopia-color-error-50);
+    --sl-color-error-75: var(--sl-vision-tritanopia-color-error-75);
+    --sl-color-error-100: var(--sl-vision-tritanopia-color-error-100);
+    --sl-color-error-200: var(--sl-vision-tritanopia-color-error-200);
+    --sl-color-error-300: var(--sl-vision-tritanopia-color-error-300);
+    --sl-color-error-400: var(--sl-vision-tritanopia-color-error-400);
+    --sl-color-error-500: var(--sl-vision-tritanopia-color-error-500);
+    --sl-color-error-600: var(--sl-vision-tritanopia-color-error-600);
+    --sl-color-error-700: var(--sl-vision-tritanopia-color-error-700);
+    --sl-color-error-800: var(--sl-vision-tritanopia-color-error-800);
+    --sl-color-error-900: var(--sl-vision-tritanopia-color-error-900);
+    --sl-color-error-1000: var(--sl-vision-tritanopia-color-error-1000);
+    --sl-color-error-on-50: var(--sl-vision-tritanopia-color-error-on-50);
+    --sl-color-error-on-75: var(--sl-vision-tritanopia-color-error-on-75);
+    --sl-color-error-on-100: var(--sl-vision-tritanopia-color-error-on-100);
+    --sl-color-error-on-200: var(--sl-vision-tritanopia-color-error-on-200);
+    --sl-color-error-on-300: var(--sl-vision-tritanopia-color-error-on-300);
+    --sl-color-error-on-400: var(--sl-vision-tritanopia-color-error-on-400);
+    --sl-color-error-on-500: var(--sl-vision-tritanopia-color-error-on-500);
+    --sl-color-error-on-600: var(--sl-vision-tritanopia-color-error-on-600);
+    --sl-color-error-on-700: var(--sl-vision-tritanopia-color-error-on-700);
+    --sl-color-error-on-800: var(--sl-vision-tritanopia-color-error-on-800);
+    --sl-color-error-on-900: var(--sl-vision-tritanopia-color-error-on-900);
+    --sl-color-error-on-1000: var(--sl-vision-tritanopia-color-error-on-1000);
+    --sl-color-info-50: var(--sl-vision-tritanopia-color-info-50);
+    --sl-color-info-75: var(--sl-vision-tritanopia-color-info-75);
+    --sl-color-info-100: var(--sl-vision-tritanopia-color-info-100);
+    --sl-color-info-200: var(--sl-vision-tritanopia-color-info-200);
+    --sl-color-info-300: var(--sl-vision-tritanopia-color-info-300);
+    --sl-color-info-400: var(--sl-vision-tritanopia-color-info-400);
+    --sl-color-info-500: var(--sl-vision-tritanopia-color-info-500);
+    --sl-color-info-600: var(--sl-vision-tritanopia-color-info-600);
+    --sl-color-info-700: var(--sl-vision-tritanopia-color-info-700);
+    --sl-color-info-800: var(--sl-vision-tritanopia-color-info-800);
+    --sl-color-info-900: var(--sl-vision-tritanopia-color-info-900);
+    --sl-color-info-1000: var(--sl-vision-tritanopia-color-info-1000);
+    --sl-color-info-on-50: var(--sl-vision-tritanopia-color-info-on-50);
+    --sl-color-info-on-75: var(--sl-vision-tritanopia-color-info-on-75);
+    --sl-color-info-on-100: var(--sl-vision-tritanopia-color-info-on-100);
+    --sl-color-info-on-200: var(--sl-vision-tritanopia-color-info-on-200);
+    --sl-color-info-on-300: var(--sl-vision-tritanopia-color-info-on-300);
+    --sl-color-info-on-400: var(--sl-vision-tritanopia-color-info-on-400);
+    --sl-color-info-on-500: var(--sl-vision-tritanopia-color-info-on-500);
+    --sl-color-info-on-600: var(--sl-vision-tritanopia-color-info-on-600);
+    --sl-color-info-on-700: var(--sl-vision-tritanopia-color-info-on-700);
+    --sl-color-info-on-800: var(--sl-vision-tritanopia-color-info-on-800);
+    --sl-color-info-on-900: var(--sl-vision-tritanopia-color-info-on-900);
+    --sl-color-info-on-1000: var(--sl-vision-tritanopia-color-info-on-1000);
+    --sl-color-data-1: var(--sl-vision-tritanopia-color-data-1);
+    --sl-color-data-2: var(--sl-vision-tritanopia-color-data-2);
+    --sl-color-data-3: var(--sl-vision-tritanopia-color-data-3);
+    --sl-color-data-4: var(--sl-vision-tritanopia-color-data-4);
+    --sl-color-data-5: var(--sl-vision-tritanopia-color-data-5);
+    --sl-color-data-6: var(--sl-vision-tritanopia-color-data-6);
+    --sl-color-data-7: var(--sl-vision-tritanopia-color-data-7);
+    --sl-color-data-8: var(--sl-vision-tritanopia-color-data-8);
+    --sl-color-data-9: var(--sl-vision-tritanopia-color-data-9);
+    --sl-color-data-10: var(--sl-vision-tritanopia-color-data-10);
+    --sl-color-data-11: var(--sl-vision-tritanopia-color-data-11);
+    --sl-color-data-12: var(--sl-vision-tritanopia-color-data-12);
+    --sl-color-data-13: var(--sl-vision-tritanopia-color-data-13);
+    --sl-color-data-14: var(--sl-vision-tritanopia-color-data-14);
+    --sl-color-data-15: var(--sl-vision-tritanopia-color-data-15);
+    --sl-color-data-16: var(--sl-vision-tritanopia-color-data-16);
+    --sl-color-data-17: var(--sl-vision-tritanopia-color-data-17);
+    --sl-color-data-18: var(--sl-vision-tritanopia-color-data-18);
+    --sl-color-data-19: var(--sl-vision-tritanopia-color-data-19);
+    --sl-color-data-20: var(--sl-vision-tritanopia-color-data-20);
+    --sl-color-data-blue: var(--sl-vision-tritanopia-color-data-blue);
+    --sl-color-data-orange: var(--sl-vision-tritanopia-color-data-orange);
+    --sl-color-data-green: var(--sl-vision-tritanopia-color-data-green);
+    --sl-color-data-gold: var(--sl-vision-tritanopia-color-data-gold);
+    --sl-color-data-slate: var(--sl-vision-tritanopia-color-data-slate);
+    --sl-color-data-red: var(--sl-vision-tritanopia-color-data-red);
+    --sl-color-data-taupe: var(--sl-vision-tritanopia-color-data-taupe);
+    --sl-color-data-rose: var(--sl-vision-tritanopia-color-data-rose);
+    --sl-color-data-magenta: var(--sl-vision-tritanopia-color-data-magenta);
+    --sl-color-data-brown: var(--sl-vision-tritanopia-color-data-brown);
+    --sl-color-data-sky: var(--sl-vision-tritanopia-color-data-sky);
+    --sl-color-data-peach: var(--sl-vision-tritanopia-color-data-peach);
+    --sl-color-data-mint: var(--sl-vision-tritanopia-color-data-mint);
+    --sl-color-data-sand: var(--sl-vision-tritanopia-color-data-sand);
+    --sl-color-data-ice: var(--sl-vision-tritanopia-color-data-ice);
+    --sl-color-data-salmon: var(--sl-vision-tritanopia-color-data-salmon);
+    --sl-color-data-stone: var(--sl-vision-tritanopia-color-data-stone);
+    --sl-color-data-pink: var(--sl-vision-tritanopia-color-data-pink);
+    --sl-color-data-orchid: var(--sl-vision-tritanopia-color-data-orchid);
+    --sl-color-data-tan: var(--sl-vision-tritanopia-color-data-tan);
+  }
+
+  [data-theme='achromatopsia'][data-look='classic'] {
+    --sl-color-primary-50: var(--sl-vision-achromatopsia-color-primary-50);
+    --sl-color-primary-75: var(--sl-vision-achromatopsia-color-primary-75);
+    --sl-color-primary-100: var(--sl-vision-achromatopsia-color-primary-100);
+    --sl-color-primary-200: var(--sl-vision-achromatopsia-color-primary-200);
+    --sl-color-primary-300: var(--sl-vision-achromatopsia-color-primary-300);
+    --sl-color-primary-400: var(--sl-vision-achromatopsia-color-primary-400);
+    --sl-color-primary-500: var(--sl-vision-achromatopsia-color-primary-500);
+    --sl-color-primary-600: var(--sl-vision-achromatopsia-color-primary-600);
+    --sl-color-primary-700: var(--sl-vision-achromatopsia-color-primary-700);
+    --sl-color-primary-800: var(--sl-vision-achromatopsia-color-primary-800);
+    --sl-color-primary-900: var(--sl-vision-achromatopsia-color-primary-900);
+    --sl-color-primary-1000: var(--sl-vision-achromatopsia-color-primary-1000);
+    --sl-color-primary-on-50: var(--sl-vision-achromatopsia-color-primary-on-50);
+    --sl-color-primary-on-75: var(--sl-vision-achromatopsia-color-primary-on-75);
+    --sl-color-primary-on-100: var(--sl-vision-achromatopsia-color-primary-on-100);
+    --sl-color-primary-on-200: var(--sl-vision-achromatopsia-color-primary-on-200);
+    --sl-color-primary-on-300: var(--sl-vision-achromatopsia-color-primary-on-300);
+    --sl-color-primary-on-400: var(--sl-vision-achromatopsia-color-primary-on-400);
+    --sl-color-primary-on-500: var(--sl-vision-achromatopsia-color-primary-on-500);
+    --sl-color-primary-on-600: var(--sl-vision-achromatopsia-color-primary-on-600);
+    --sl-color-primary-on-700: var(--sl-vision-achromatopsia-color-primary-on-700);
+    --sl-color-primary-on-800: var(--sl-vision-achromatopsia-color-primary-on-800);
+    --sl-color-primary-on-900: var(--sl-vision-achromatopsia-color-primary-on-900);
+    --sl-color-primary-on-1000: var(--sl-vision-achromatopsia-color-primary-on-1000);
+    --sl-color-secondary-50: var(--sl-vision-achromatopsia-color-secondary-50);
+    --sl-color-secondary-75: var(--sl-vision-achromatopsia-color-secondary-75);
+    --sl-color-secondary-100: var(--sl-vision-achromatopsia-color-secondary-100);
+    --sl-color-secondary-200: var(--sl-vision-achromatopsia-color-secondary-200);
+    --sl-color-secondary-300: var(--sl-vision-achromatopsia-color-secondary-300);
+    --sl-color-secondary-400: var(--sl-vision-achromatopsia-color-secondary-400);
+    --sl-color-secondary-500: var(--sl-vision-achromatopsia-color-secondary-500);
+    --sl-color-secondary-600: var(--sl-vision-achromatopsia-color-secondary-600);
+    --sl-color-secondary-700: var(--sl-vision-achromatopsia-color-secondary-700);
+    --sl-color-secondary-800: var(--sl-vision-achromatopsia-color-secondary-800);
+    --sl-color-secondary-900: var(--sl-vision-achromatopsia-color-secondary-900);
+    --sl-color-secondary-1000: var(--sl-vision-achromatopsia-color-secondary-1000);
+    --sl-color-secondary-on-50: var(--sl-vision-achromatopsia-color-secondary-on-50);
+    --sl-color-secondary-on-75: var(--sl-vision-achromatopsia-color-secondary-on-75);
+    --sl-color-secondary-on-100: var(--sl-vision-achromatopsia-color-secondary-on-100);
+    --sl-color-secondary-on-200: var(--sl-vision-achromatopsia-color-secondary-on-200);
+    --sl-color-secondary-on-300: var(--sl-vision-achromatopsia-color-secondary-on-300);
+    --sl-color-secondary-on-400: var(--sl-vision-achromatopsia-color-secondary-on-400);
+    --sl-color-secondary-on-500: var(--sl-vision-achromatopsia-color-secondary-on-500);
+    --sl-color-secondary-on-600: var(--sl-vision-achromatopsia-color-secondary-on-600);
+    --sl-color-secondary-on-700: var(--sl-vision-achromatopsia-color-secondary-on-700);
+    --sl-color-secondary-on-800: var(--sl-vision-achromatopsia-color-secondary-on-800);
+    --sl-color-secondary-on-900: var(--sl-vision-achromatopsia-color-secondary-on-900);
+    --sl-color-secondary-on-1000: var(--sl-vision-achromatopsia-color-secondary-on-1000);
+    --sl-color-tertiary-50: var(--sl-vision-achromatopsia-color-tertiary-50);
+    --sl-color-tertiary-75: var(--sl-vision-achromatopsia-color-tertiary-75);
+    --sl-color-tertiary-100: var(--sl-vision-achromatopsia-color-tertiary-100);
+    --sl-color-tertiary-200: var(--sl-vision-achromatopsia-color-tertiary-200);
+    --sl-color-tertiary-300: var(--sl-vision-achromatopsia-color-tertiary-300);
+    --sl-color-tertiary-400: var(--sl-vision-achromatopsia-color-tertiary-400);
+    --sl-color-tertiary-500: var(--sl-vision-achromatopsia-color-tertiary-500);
+    --sl-color-tertiary-600: var(--sl-vision-achromatopsia-color-tertiary-600);
+    --sl-color-tertiary-700: var(--sl-vision-achromatopsia-color-tertiary-700);
+    --sl-color-tertiary-800: var(--sl-vision-achromatopsia-color-tertiary-800);
+    --sl-color-tertiary-900: var(--sl-vision-achromatopsia-color-tertiary-900);
+    --sl-color-tertiary-1000: var(--sl-vision-achromatopsia-color-tertiary-1000);
+    --sl-color-tertiary-on-50: var(--sl-vision-achromatopsia-color-tertiary-on-50);
+    --sl-color-tertiary-on-75: var(--sl-vision-achromatopsia-color-tertiary-on-75);
+    --sl-color-tertiary-on-100: var(--sl-vision-achromatopsia-color-tertiary-on-100);
+    --sl-color-tertiary-on-200: var(--sl-vision-achromatopsia-color-tertiary-on-200);
+    --sl-color-tertiary-on-300: var(--sl-vision-achromatopsia-color-tertiary-on-300);
+    --sl-color-tertiary-on-400: var(--sl-vision-achromatopsia-color-tertiary-on-400);
+    --sl-color-tertiary-on-500: var(--sl-vision-achromatopsia-color-tertiary-on-500);
+    --sl-color-tertiary-on-600: var(--sl-vision-achromatopsia-color-tertiary-on-600);
+    --sl-color-tertiary-on-700: var(--sl-vision-achromatopsia-color-tertiary-on-700);
+    --sl-color-tertiary-on-800: var(--sl-vision-achromatopsia-color-tertiary-on-800);
+    --sl-color-tertiary-on-900: var(--sl-vision-achromatopsia-color-tertiary-on-900);
+    --sl-color-tertiary-on-1000: var(--sl-vision-achromatopsia-color-tertiary-on-1000);
+    --sl-color-quaternary-50: var(--sl-vision-achromatopsia-color-quaternary-50);
+    --sl-color-quaternary-75: var(--sl-vision-achromatopsia-color-quaternary-75);
+    --sl-color-quaternary-100: var(--sl-vision-achromatopsia-color-quaternary-100);
+    --sl-color-quaternary-200: var(--sl-vision-achromatopsia-color-quaternary-200);
+    --sl-color-quaternary-300: var(--sl-vision-achromatopsia-color-quaternary-300);
+    --sl-color-quaternary-400: var(--sl-vision-achromatopsia-color-quaternary-400);
+    --sl-color-quaternary-500: var(--sl-vision-achromatopsia-color-quaternary-500);
+    --sl-color-quaternary-600: var(--sl-vision-achromatopsia-color-quaternary-600);
+    --sl-color-quaternary-700: var(--sl-vision-achromatopsia-color-quaternary-700);
+    --sl-color-quaternary-800: var(--sl-vision-achromatopsia-color-quaternary-800);
+    --sl-color-quaternary-900: var(--sl-vision-achromatopsia-color-quaternary-900);
+    --sl-color-quaternary-1000: var(--sl-vision-achromatopsia-color-quaternary-1000);
+    --sl-color-quaternary-on-50: var(--sl-vision-achromatopsia-color-quaternary-on-50);
+    --sl-color-quaternary-on-75: var(--sl-vision-achromatopsia-color-quaternary-on-75);
+    --sl-color-quaternary-on-100: var(--sl-vision-achromatopsia-color-quaternary-on-100);
+    --sl-color-quaternary-on-200: var(--sl-vision-achromatopsia-color-quaternary-on-200);
+    --sl-color-quaternary-on-300: var(--sl-vision-achromatopsia-color-quaternary-on-300);
+    --sl-color-quaternary-on-400: var(--sl-vision-achromatopsia-color-quaternary-on-400);
+    --sl-color-quaternary-on-500: var(--sl-vision-achromatopsia-color-quaternary-on-500);
+    --sl-color-quaternary-on-600: var(--sl-vision-achromatopsia-color-quaternary-on-600);
+    --sl-color-quaternary-on-700: var(--sl-vision-achromatopsia-color-quaternary-on-700);
+    --sl-color-quaternary-on-800: var(--sl-vision-achromatopsia-color-quaternary-on-800);
+    --sl-color-quaternary-on-900: var(--sl-vision-achromatopsia-color-quaternary-on-900);
+    --sl-color-quaternary-on-1000: var(--sl-vision-achromatopsia-color-quaternary-on-1000);
+    --sl-color-success-50: var(--sl-vision-achromatopsia-color-success-50);
+    --sl-color-success-75: var(--sl-vision-achromatopsia-color-success-75);
+    --sl-color-success-100: var(--sl-vision-achromatopsia-color-success-100);
+    --sl-color-success-200: var(--sl-vision-achromatopsia-color-success-200);
+    --sl-color-success-300: var(--sl-vision-achromatopsia-color-success-300);
+    --sl-color-success-400: var(--sl-vision-achromatopsia-color-success-400);
+    --sl-color-success-500: var(--sl-vision-achromatopsia-color-success-500);
+    --sl-color-success-600: var(--sl-vision-achromatopsia-color-success-600);
+    --sl-color-success-700: var(--sl-vision-achromatopsia-color-success-700);
+    --sl-color-success-800: var(--sl-vision-achromatopsia-color-success-800);
+    --sl-color-success-900: var(--sl-vision-achromatopsia-color-success-900);
+    --sl-color-success-1000: var(--sl-vision-achromatopsia-color-success-1000);
+    --sl-color-success-on-50: var(--sl-vision-achromatopsia-color-success-on-50);
+    --sl-color-success-on-75: var(--sl-vision-achromatopsia-color-success-on-75);
+    --sl-color-success-on-100: var(--sl-vision-achromatopsia-color-success-on-100);
+    --sl-color-success-on-200: var(--sl-vision-achromatopsia-color-success-on-200);
+    --sl-color-success-on-300: var(--sl-vision-achromatopsia-color-success-on-300);
+    --sl-color-success-on-400: var(--sl-vision-achromatopsia-color-success-on-400);
+    --sl-color-success-on-500: var(--sl-vision-achromatopsia-color-success-on-500);
+    --sl-color-success-on-600: var(--sl-vision-achromatopsia-color-success-on-600);
+    --sl-color-success-on-700: var(--sl-vision-achromatopsia-color-success-on-700);
+    --sl-color-success-on-800: var(--sl-vision-achromatopsia-color-success-on-800);
+    --sl-color-success-on-900: var(--sl-vision-achromatopsia-color-success-on-900);
+    --sl-color-success-on-1000: var(--sl-vision-achromatopsia-color-success-on-1000);
+    --sl-color-warning-50: var(--sl-vision-achromatopsia-color-warning-50);
+    --sl-color-warning-75: var(--sl-vision-achromatopsia-color-warning-75);
+    --sl-color-warning-100: var(--sl-vision-achromatopsia-color-warning-100);
+    --sl-color-warning-200: var(--sl-vision-achromatopsia-color-warning-200);
+    --sl-color-warning-300: var(--sl-vision-achromatopsia-color-warning-300);
+    --sl-color-warning-400: var(--sl-vision-achromatopsia-color-warning-400);
+    --sl-color-warning-500: var(--sl-vision-achromatopsia-color-warning-500);
+    --sl-color-warning-600: var(--sl-vision-achromatopsia-color-warning-600);
+    --sl-color-warning-700: var(--sl-vision-achromatopsia-color-warning-700);
+    --sl-color-warning-800: var(--sl-vision-achromatopsia-color-warning-800);
+    --sl-color-warning-900: var(--sl-vision-achromatopsia-color-warning-900);
+    --sl-color-warning-1000: var(--sl-vision-achromatopsia-color-warning-1000);
+    --sl-color-warning-on-50: var(--sl-vision-achromatopsia-color-warning-on-50);
+    --sl-color-warning-on-75: var(--sl-vision-achromatopsia-color-warning-on-75);
+    --sl-color-warning-on-100: var(--sl-vision-achromatopsia-color-warning-on-100);
+    --sl-color-warning-on-200: var(--sl-vision-achromatopsia-color-warning-on-200);
+    --sl-color-warning-on-300: var(--sl-vision-achromatopsia-color-warning-on-300);
+    --sl-color-warning-on-400: var(--sl-vision-achromatopsia-color-warning-on-400);
+    --sl-color-warning-on-500: var(--sl-vision-achromatopsia-color-warning-on-500);
+    --sl-color-warning-on-600: var(--sl-vision-achromatopsia-color-warning-on-600);
+    --sl-color-warning-on-700: var(--sl-vision-achromatopsia-color-warning-on-700);
+    --sl-color-warning-on-800: var(--sl-vision-achromatopsia-color-warning-on-800);
+    --sl-color-warning-on-900: var(--sl-vision-achromatopsia-color-warning-on-900);
+    --sl-color-warning-on-1000: var(--sl-vision-achromatopsia-color-warning-on-1000);
+    --sl-color-error-50: var(--sl-vision-achromatopsia-color-error-50);
+    --sl-color-error-75: var(--sl-vision-achromatopsia-color-error-75);
+    --sl-color-error-100: var(--sl-vision-achromatopsia-color-error-100);
+    --sl-color-error-200: var(--sl-vision-achromatopsia-color-error-200);
+    --sl-color-error-300: var(--sl-vision-achromatopsia-color-error-300);
+    --sl-color-error-400: var(--sl-vision-achromatopsia-color-error-400);
+    --sl-color-error-500: var(--sl-vision-achromatopsia-color-error-500);
+    --sl-color-error-600: var(--sl-vision-achromatopsia-color-error-600);
+    --sl-color-error-700: var(--sl-vision-achromatopsia-color-error-700);
+    --sl-color-error-800: var(--sl-vision-achromatopsia-color-error-800);
+    --sl-color-error-900: var(--sl-vision-achromatopsia-color-error-900);
+    --sl-color-error-1000: var(--sl-vision-achromatopsia-color-error-1000);
+    --sl-color-error-on-50: var(--sl-vision-achromatopsia-color-error-on-50);
+    --sl-color-error-on-75: var(--sl-vision-achromatopsia-color-error-on-75);
+    --sl-color-error-on-100: var(--sl-vision-achromatopsia-color-error-on-100);
+    --sl-color-error-on-200: var(--sl-vision-achromatopsia-color-error-on-200);
+    --sl-color-error-on-300: var(--sl-vision-achromatopsia-color-error-on-300);
+    --sl-color-error-on-400: var(--sl-vision-achromatopsia-color-error-on-400);
+    --sl-color-error-on-500: var(--sl-vision-achromatopsia-color-error-on-500);
+    --sl-color-error-on-600: var(--sl-vision-achromatopsia-color-error-on-600);
+    --sl-color-error-on-700: var(--sl-vision-achromatopsia-color-error-on-700);
+    --sl-color-error-on-800: var(--sl-vision-achromatopsia-color-error-on-800);
+    --sl-color-error-on-900: var(--sl-vision-achromatopsia-color-error-on-900);
+    --sl-color-error-on-1000: var(--sl-vision-achromatopsia-color-error-on-1000);
+    --sl-color-info-50: var(--sl-vision-achromatopsia-color-info-50);
+    --sl-color-info-75: var(--sl-vision-achromatopsia-color-info-75);
+    --sl-color-info-100: var(--sl-vision-achromatopsia-color-info-100);
+    --sl-color-info-200: var(--sl-vision-achromatopsia-color-info-200);
+    --sl-color-info-300: var(--sl-vision-achromatopsia-color-info-300);
+    --sl-color-info-400: var(--sl-vision-achromatopsia-color-info-400);
+    --sl-color-info-500: var(--sl-vision-achromatopsia-color-info-500);
+    --sl-color-info-600: var(--sl-vision-achromatopsia-color-info-600);
+    --sl-color-info-700: var(--sl-vision-achromatopsia-color-info-700);
+    --sl-color-info-800: var(--sl-vision-achromatopsia-color-info-800);
+    --sl-color-info-900: var(--sl-vision-achromatopsia-color-info-900);
+    --sl-color-info-1000: var(--sl-vision-achromatopsia-color-info-1000);
+    --sl-color-info-on-50: var(--sl-vision-achromatopsia-color-info-on-50);
+    --sl-color-info-on-75: var(--sl-vision-achromatopsia-color-info-on-75);
+    --sl-color-info-on-100: var(--sl-vision-achromatopsia-color-info-on-100);
+    --sl-color-info-on-200: var(--sl-vision-achromatopsia-color-info-on-200);
+    --sl-color-info-on-300: var(--sl-vision-achromatopsia-color-info-on-300);
+    --sl-color-info-on-400: var(--sl-vision-achromatopsia-color-info-on-400);
+    --sl-color-info-on-500: var(--sl-vision-achromatopsia-color-info-on-500);
+    --sl-color-info-on-600: var(--sl-vision-achromatopsia-color-info-on-600);
+    --sl-color-info-on-700: var(--sl-vision-achromatopsia-color-info-on-700);
+    --sl-color-info-on-800: var(--sl-vision-achromatopsia-color-info-on-800);
+    --sl-color-info-on-900: var(--sl-vision-achromatopsia-color-info-on-900);
+    --sl-color-info-on-1000: var(--sl-vision-achromatopsia-color-info-on-1000);
+    --sl-color-data-1: var(--sl-vision-achromatopsia-color-data-1);
+    --sl-color-data-2: var(--sl-vision-achromatopsia-color-data-2);
+    --sl-color-data-3: var(--sl-vision-achromatopsia-color-data-3);
+    --sl-color-data-4: var(--sl-vision-achromatopsia-color-data-4);
+    --sl-color-data-5: var(--sl-vision-achromatopsia-color-data-5);
+    --sl-color-data-6: var(--sl-vision-achromatopsia-color-data-6);
+    --sl-color-data-7: var(--sl-vision-achromatopsia-color-data-7);
+    --sl-color-data-8: var(--sl-vision-achromatopsia-color-data-8);
+    --sl-color-data-9: var(--sl-vision-achromatopsia-color-data-9);
+    --sl-color-data-10: var(--sl-vision-achromatopsia-color-data-10);
+    --sl-color-data-11: var(--sl-vision-achromatopsia-color-data-11);
+    --sl-color-data-12: var(--sl-vision-achromatopsia-color-data-12);
+    --sl-color-data-13: var(--sl-vision-achromatopsia-color-data-13);
+    --sl-color-data-14: var(--sl-vision-achromatopsia-color-data-14);
+    --sl-color-data-15: var(--sl-vision-achromatopsia-color-data-15);
+    --sl-color-data-16: var(--sl-vision-achromatopsia-color-data-16);
+    --sl-color-data-17: var(--sl-vision-achromatopsia-color-data-17);
+    --sl-color-data-18: var(--sl-vision-achromatopsia-color-data-18);
+    --sl-color-data-19: var(--sl-vision-achromatopsia-color-data-19);
+    --sl-color-data-20: var(--sl-vision-achromatopsia-color-data-20);
+    --sl-color-data-blue: var(--sl-vision-achromatopsia-color-data-blue);
+    --sl-color-data-orange: var(--sl-vision-achromatopsia-color-data-orange);
+    --sl-color-data-green: var(--sl-vision-achromatopsia-color-data-green);
+    --sl-color-data-gold: var(--sl-vision-achromatopsia-color-data-gold);
+    --sl-color-data-slate: var(--sl-vision-achromatopsia-color-data-slate);
+    --sl-color-data-red: var(--sl-vision-achromatopsia-color-data-red);
+    --sl-color-data-taupe: var(--sl-vision-achromatopsia-color-data-taupe);
+    --sl-color-data-rose: var(--sl-vision-achromatopsia-color-data-rose);
+    --sl-color-data-magenta: var(--sl-vision-achromatopsia-color-data-magenta);
+    --sl-color-data-brown: var(--sl-vision-achromatopsia-color-data-brown);
+    --sl-color-data-sky: var(--sl-vision-achromatopsia-color-data-sky);
+    --sl-color-data-peach: var(--sl-vision-achromatopsia-color-data-peach);
+    --sl-color-data-mint: var(--sl-vision-achromatopsia-color-data-mint);
+    --sl-color-data-sand: var(--sl-vision-achromatopsia-color-data-sand);
+    --sl-color-data-ice: var(--sl-vision-achromatopsia-color-data-ice);
+    --sl-color-data-salmon: var(--sl-vision-achromatopsia-color-data-salmon);
+    --sl-color-data-stone: var(--sl-vision-achromatopsia-color-data-stone);
+    --sl-color-data-pink: var(--sl-vision-achromatopsia-color-data-pink);
+    --sl-color-data-orchid: var(--sl-vision-achromatopsia-color-data-orchid);
+    --sl-color-data-tan: var(--sl-vision-achromatopsia-color-data-tan);
+  }
+
   @media (prefers-color-scheme: dark) {
     :root:not([data-theme='light'], [data-theme='light-high-contrast'], [data-theme='deuteranopia'], [data-theme='protanopia'], [data-theme='tritanopia'], [data-theme='achromatopsia']) {
       --sl-color-scheme: dark;
@@ -3549,6 +5207,24 @@
     --sl-color-data-ivory: var(--sl-vision-achromatopsia-color-data-ivory);
   }
 
+  @media (prefers-color-scheme: dark) {
+    :root:not([data-theme='light'], [data-theme='light-high-contrast'], [data-theme='deuteranopia'], [data-theme='protanopia'], [data-theme='tritanopia'], [data-theme='achromatopsia'])[data-look='classic'] {
+      --sl-scope-accent-solid: var(--sl-color-primary-400);
+      --sl-scope-accent-solid-hover: var(--sl-color-primary-300);
+      --sl-scope-accent-solid-active: var(--sl-color-primary-200);
+      --sl-scope-accent-on-solid: var(--sl-color-primary-on-400);
+      --sl-scope-accent-soft-active: var(--sl-color-primary-800);
+    }
+  }
+
+  [data-theme='dark'][data-look='classic'], [data-theme='dark-high-contrast'][data-look='classic'] {
+    --sl-scope-accent-solid: var(--sl-color-primary-400);
+    --sl-scope-accent-solid-hover: var(--sl-color-primary-300);
+    --sl-scope-accent-solid-active: var(--sl-color-primary-200);
+    --sl-scope-accent-on-solid: var(--sl-color-primary-on-400);
+    --sl-scope-accent-soft-active: var(--sl-color-primary-800);
+  }
+
   :root {
     --sl-scope-solid: var(--sl-scope-accent-solid);
     --sl-scope-solid-hover: var(--sl-scope-accent-solid-hover);