@breadstone/mosaik-themes 0.0.173 → 0.0.175

package/Themes/___memphis-tokens.css

@@ -0,0 +1,392 @@
+:root {
+  --name: "memphis";
+  --font-family: Nunito, sans-serif;
+  --layout-radius: 0px;
+  --layout-space: 10px;
+  --layout-thickness: 3px;
+  --scheme-light-background: #eaeaea;
+  --scheme-light-foreground: #3c454f;
+  --scheme-light-highlight: #d1d1d1;
+  --scheme-light-middlelight: #8a8a8a;
+  --scheme-light-lowlight: #5c5c5c;
+  --scheme-light-transparent: rgba(255, 255, 255, 0);
+  --scheme-light-semi-transparent: rgba(255, 255, 255, 0.67);
+  --scheme-light-disabled: #686868;
+  --scheme-light-contrast: #333333;
+  --scheme-dark-background: #151515;
+  --scheme-dark-foreground: #c3bab0;
+  --scheme-dark-highlight: #2e2e2e;
+  --scheme-dark-middlelight: #757575;
+  --scheme-dark-lowlight: #a3a3a3;
+  --scheme-dark-transparent: rgba(255, 255, 255, 0);
+  --scheme-dark-semi-transparent: rgba(0, 0, 0, 0.67);
+  --scheme-dark-disabled: #474747;
+  --scheme-dark-contrast: #ffffff;
+  --color-light-primary-0: #ffffff;
+  --color-light-primary-50: #f9f9f9;
+  --color-light-primary-100: #f2f2f2;
+  --color-light-primary-200: #e8e8e8;
+  --color-light-primary-300: #d8d8d8;
+  --color-light-primary-400: #b4b4b4;
+  --color-light-primary-500: #949494;
+  --color-light-primary-600: #6c6c6c;
+  --color-light-primary-700: #595959;
+  --color-light-primary-800: #3a3a3a;
+  --color-light-primary-900: #1a1a1a;
+  --color-light-secondary-0: #ffffff;
+  --color-light-secondary-50: #e1f3ef;
+  --color-light-secondary-100: #b5e0d6;
+  --color-light-secondary-200: #85cdbc;
+  --color-light-secondary-300: #57b9a2;
+  --color-light-secondary-400: #38a990;
+  --color-light-secondary-500: #24997e;
+  --color-light-secondary-600: #208c71;
+  --color-light-secondary-700: #1b7c62;
+  --color-light-secondary-800: #166c54;
+  --color-light-secondary-900: #0d503a;
+  --color-light-info-0: #ffffff;
+  --color-light-info-50: #e8eaf9;
+  --color-light-info-100: #c6c9f1;
+  --color-light-info-200: #9fa7e7;
+  --color-light-info-300: #7884dd;
+  --color-light-info-400: #5968d6;
+  --color-light-info-500: #394dcd;
+  --color-light-info-600: #3344c2;
+  --color-light-info-700: #293ab6;
+  --color-light-info-800: #202faa;
+  --color-light-info-900: #0a1a97;
+  --color-light-warning-0: #ffffff;
+  --color-light-warning-50: #fcfce5;
+  --color-light-warning-100: #f7f6bf;
+  --color-light-warning-200: #f1f294;
+  --color-light-warning-300: #ebec67;
+  --color-light-warning-400: #e5e741;
+  --color-light-warning-500: #dfe300;
+  --color-light-warning-600: #d1d100;
+  --color-light-warning-700: #bfba00;
+  --color-light-warning-800: #aea300;
+  --color-light-warning-900: #927c00;
+  --color-light-danger-0: #ffffff;
+  --color-light-danger-50: #fcecef;
+  --color-light-danger-100: #f8d0d5;
+  --color-light-danger-200: #e69fa1;
+  --color-light-danger-300: #d97b7d;
+  --color-light-danger-400: #e35f5f;
+  --color-light-danger-500: #e8524a;
+  --color-light-danger-600: #d94a47;
+  --color-light-danger-700: #c74141;
+  --color-light-danger-800: #b93c3a;
+  --color-light-danger-900: #ab322f;
+  --color-light-success-0: #ffffff;
+  --color-light-success-50: #e1f3ef;
+  --color-light-success-100: #b5e0d6;
+  --color-light-success-200: #85cdbc;
+  --color-light-success-300: #57b9a2;
+  --color-light-success-400: #38a990;
+  --color-light-success-500: #24997e;
+  --color-light-success-600: #208c71;
+  --color-light-success-700: #1b7c62;
+  --color-light-success-800: #166c54;
+  --color-light-success-900: #0d503a;
+  --color-light-neutral-0: #ffffff;
+  --color-light-neutral-50: #f9f9f9;
+  --color-light-neutral-100: #f2f2f2;
+  --color-light-neutral-200: #e8e8e8;
+  --color-light-neutral-300: #d8d8d8;
+  --color-light-neutral-400: #b4b4b4;
+  --color-light-neutral-500: #949494;
+  --color-light-neutral-600: #6c6c6c;
+  --color-light-neutral-700: #595959;
+  --color-light-neutral-800: #3a3a3a;
+  --color-light-neutral-900: #1a1a1a;
+  --color-dark-primary-0: #000000;
+  --color-dark-primary-50: #1a1a1a;
+  --color-dark-primary-100: #3a3a3a;
+  --color-dark-primary-200: #595959;
+  --color-dark-primary-300: #6c6c6c;
+  --color-dark-primary-400: #949494;
+  --color-dark-primary-500: #b4b4b4;
+  --color-dark-primary-600: #d8d8d8;
+  --color-dark-primary-700: #e8e8e8;
+  --color-dark-primary-800: #f2f2f2;
+  --color-dark-primary-900: #f9f9f9;
+  --color-dark-secondary-0: #000000;
+  --color-dark-secondary-50: #0d503a;
+  --color-dark-secondary-100: #166c54;
+  --color-dark-secondary-200: #1b7c62;
+  --color-dark-secondary-300: #208c71;
+  --color-dark-secondary-400: #24997e;
+  --color-dark-secondary-500: #38a990;
+  --color-dark-secondary-600: #57b9a2;
+  --color-dark-secondary-700: #85cdbc;
+  --color-dark-secondary-800: #b5e0d6;
+  --color-dark-secondary-900: #e1f3ef;
+  --color-dark-info-0: #000000;
+  --color-dark-info-50: #0a1a97;
+  --color-dark-info-100: #202faa;
+  --color-dark-info-200: #293ab6;
+  --color-dark-info-300: #3344c2;
+  --color-dark-info-400: #394dcd;
+  --color-dark-info-500: #5968d6;
+  --color-dark-info-600: #7884dd;
+  --color-dark-info-700: #9fa7e7;
+  --color-dark-info-800: #c6c9f1;
+  --color-dark-info-900: #e8eaf9;
+  --color-dark-warning-0: #000000;
+  --color-dark-warning-50: #927c00;
+  --color-dark-warning-100: #aea300;
+  --color-dark-warning-200: #bfba00;
+  --color-dark-warning-300: #d1d100;
+  --color-dark-warning-400: #dfe300;
+  --color-dark-warning-500: #e5e741;
+  --color-dark-warning-600: #ebec67;
+  --color-dark-warning-700: #f1f294;
+  --color-dark-warning-800: #f7f6bf;
+  --color-dark-warning-900: #fcfce5;
+  --color-dark-danger-0: #000000;
+  --color-dark-danger-50: #ab322f;
+  --color-dark-danger-100: #b93c3a;
+  --color-dark-danger-200: #c74141;
+  --color-dark-danger-300: #d94a47;
+  --color-dark-danger-400: #e8524a;
+  --color-dark-danger-500: #e35f5f;
+  --color-dark-danger-600: #d97b7d;
+  --color-dark-danger-700: #e69fa1;
+  --color-dark-danger-800: #f8d0d5;
+  --color-dark-danger-900: #fcecef;
+  --color-dark-success-0: #000000;
+  --color-dark-success-50: #0d503a;
+  --color-dark-success-100: #166c54;
+  --color-dark-success-200: #1b7c62;
+  --color-dark-success-300: #208c71;
+  --color-dark-success-400: #24997e;
+  --color-dark-success-500: #38a990;
+  --color-dark-success-600: #57b9a2;
+  --color-dark-success-700: #85cdbc;
+  --color-dark-success-800: #b5e0d6;
+  --color-dark-success-900: #e1f3ef;
+  --color-dark-neutral-0: #000000;
+  --color-dark-neutral-50: #1a1a1a;
+  --color-dark-neutral-100: #3a3a3a;
+  --color-dark-neutral-200: #595959;
+  --color-dark-neutral-300: #6c6c6c;
+  --color-dark-neutral-400: #949494;
+  --color-dark-neutral-500: #b4b4b4;
+  --color-dark-neutral-600: #d8d8d8;
+  --color-dark-neutral-700: #e8e8e8;
+  --color-dark-neutral-800: #f2f2f2;
+  --color-dark-neutral-900: #f9f9f9;
+  --typography-headline1-font-size: 96px;
+  --typography-headline1-line-height: 100px;
+  --typography-headline1-font-weight: 300;
+  --typography-headline1-letter-spacing: -0.25px;
+  --typography-headline1-text-decoration: none;
+  --typography-headline1-text-transform: none;
+  --typography-headline2-font-size: 60px;
+  --typography-headline2-line-height: 64px;
+  --typography-headline2-font-weight: 300;
+  --typography-headline2-letter-spacing: -0.13333333333333333px;
+  --typography-headline2-text-decoration: none;
+  --typography-headline2-text-transform: none;
+  --typography-headline3-font-size: 48px;
+  --typography-headline3-line-height: 52px;
+  --typography-headline3-font-weight: 400;
+  --typography-headline3-letter-spacing: normal;
+  --typography-headline3-text-decoration: none;
+  --typography-headline3-text-transform: none;
+  --typography-headline4-font-size: 34px;
+  --typography-headline4-line-height: 38px;
+  --typography-headline4-font-weight: 400;
+  --typography-headline4-letter-spacing: 0.11764705882352941px;
+  --typography-headline4-text-decoration: none;
+  --typography-headline4-text-transform: none;
+  --typography-headline5-font-size: 24px;
+  --typography-headline5-line-height: 28px;
+  --typography-headline5-font-weight: 400;
+  --typography-headline5-letter-spacing: normal;
+  --typography-headline5-text-decoration: none;
+  --typography-headline5-text-transform: none;
+  --typography-headline6-font-size: 20px;
+  --typography-headline6-line-height: 24px;
+  --typography-headline6-font-weight: 500;
+  --typography-headline6-letter-spacing: 0.2px;
+  --typography-headline6-text-decoration: none;
+  --typography-headline6-text-transform: none;
+  --typography-subtitle1-font-size: 16px;
+  --typography-subtitle1-line-height: 20px;
+  --typography-subtitle1-font-weight: 400;
+  --typography-subtitle1-letter-spacing: 0.15px;
+  --typography-subtitle1-text-decoration: none;
+  --typography-subtitle1-text-transform: none;
+  --typography-subtitle2-font-size: 14px;
+  --typography-subtitle2-line-height: 18px;
+  --typography-subtitle2-font-weight: 500;
+  --typography-subtitle2-letter-spacing: 0.1142857142857143px;
+  --typography-subtitle2-text-decoration: none;
+  --typography-subtitle2-text-transform: none;
+  --typography-body1-font-size: 16px;
+  --typography-body1-line-height: 20px;
+  --typography-body1-font-weight: 400;
+  --typography-body1-letter-spacing: 0.5px;
+  --typography-body1-text-decoration: none;
+  --typography-body1-text-transform: none;
+  --typography-body2-font-size: 14px;
+  --typography-body2-line-height: 18px;
+  --typography-body2-font-weight: 400;
+  --typography-body2-letter-spacing: 0.2857142857142857px;
+  --typography-body2-text-decoration: none;
+  --typography-body2-text-transform: none;
+  --typography-caption-font-size: 12px;
+  --typography-caption-line-height: 16px;
+  --typography-caption-font-weight: 400;
+  --typography-caption-letter-spacing: 0.5333333333333333px;
+  --typography-caption-text-decoration: none;
+  --typography-caption-text-transform: none;
+  --typography-button-font-size: 14px;
+  --typography-button-line-height: 18px;
+  --typography-button-font-weight: 700;
+  --typography-button-letter-spacing: 1.4285714285714286px;
+  --typography-button-text-decoration: none;
+  --typography-button-text-transform: none;
+  --typography-overline-font-size: 12px;
+  --typography-overline-line-height: 16px;
+  --typography-overline-font-weight: 500;
+  --typography-overline-letter-spacing: 2.6666666666666665px;
+  --typography-overline-text-decoration: none;
+  --typography-overline-text-transform: none;
+  --elevation-none: none;
+  --elevation-light-light-offset-x-0: 2px;
+  --elevation-light-light-offset-y-0: 2px;
+  --elevation-light-light-blur-0: 0px;
+  --elevation-light-light-spread-0: 0px;
+  --elevation-light-semilight-offset-x-0: 3px;
+  --elevation-light-semilight-offset-y-0: 3px;
+  --elevation-light-semilight-blur-0: 0px;
+  --elevation-light-semilight-spread-0: 0px;
+  --elevation-light-regular-offset-x-0: 4px;
+  --elevation-light-regular-offset-y-0: 4px;
+  --elevation-light-regular-blur-0: 0px;
+  --elevation-light-regular-spread-0: 0px;
+  --elevation-light-semibold-offset-x-0: 5px;
+  --elevation-light-semibold-offset-y-0: 5px;
+  --elevation-light-semibold-blur-0: 0px;
+  --elevation-light-semibold-spread-0: 0px;
+  --elevation-light-bold-offset-x-0: 6px;
+  --elevation-light-bold-offset-y-0: 6px;
+  --elevation-light-bold-blur-0: 0px;
+  --elevation-light-bold-spread-0: 0px;
+  --elevation-light-extrabold-offset-x-0: 7px;
+  --elevation-light-extrabold-offset-y-0: 7px;
+  --elevation-light-extrabold-blur-0: 0px;
+  --elevation-light-extrabold-spread-0: 0px;
+  --elevation-dark-light-offset-x-0: 2px;
+  --elevation-dark-light-offset-y-0: 2px;
+  --elevation-dark-light-blur-0: 0px;
+  --elevation-dark-light-spread-0: 0px;
+  --elevation-dark-semilight-offset-x-0: 3px;
+  --elevation-dark-semilight-offset-y-0: 3px;
+  --elevation-dark-semilight-blur-0: 0px;
+  --elevation-dark-semilight-spread-0: 0px;
+  --elevation-dark-regular-offset-x-0: 4px;
+  --elevation-dark-regular-offset-y-0: 4px;
+  --elevation-dark-regular-blur-0: 0px;
+  --elevation-dark-regular-spread-0: 0px;
+  --elevation-dark-semibold-offset-x-0: 5px;
+  --elevation-dark-semibold-offset-y-0: 5px;
+  --elevation-dark-semibold-blur-0: 0px;
+  --elevation-dark-semibold-spread-0: 0px;
+  --elevation-dark-bold-offset-x-0: 6px;
+  --elevation-dark-bold-offset-y-0: 6px;
+  --elevation-dark-bold-blur-0: 0px;
+  --elevation-dark-bold-spread-0: 0px;
+  --elevation-dark-extrabold-offset-x-0: 7px;
+  --elevation-dark-extrabold-offset-y-0: 7px;
+  --elevation-dark-extrabold-blur-0: 0px;
+  --elevation-dark-extrabold-spread-0: 0px;
+  --size-tiny: 2px;
+  --size-small: 4px;
+  --size-medium: 8px;
+  --size-large: 16px;
+  --size-giant: 32px;
+  --size-key-tiny: "tiny";
+  --size-key-small: "small";
+  --size-key-medium: "medium";
+  --size-key-large: "large";
+  --size-key-giant: "giant";
+  --typography-key-headline1: "headline1";
+  --typography-key-headline2: "headline2";
+  --typography-key-headline3: "headline3";
+  --typography-key-headline4: "headline4";
+  --typography-key-headline5: "headline5";
+  --typography-key-headline6: "headline6";
+  --typography-key-subtitle1: "subtitle1";
+  --typography-key-subtitle2: "subtitle2";
+  --typography-key-body1: "body1";
+  --typography-key-body2: "body2";
+  --typography-key-caption: "caption";
+  --typography-key-button: "button";
+  --typography-key-overline: "overline";
+  --elevation-key-light: "light";
+  --elevation-key-semilight: "semilight";
+  --elevation-key-regular: "regular";
+  --elevation-key-semibold: "semibold";
+  --elevation-key-bold: "bold";
+  --elevation-key-extrabold: "extrabold";
+  --appearance-default: "default";
+  --appearance-outline: "outline";
+  --appearance-plain: "plain";
+  --appearance-soft: "soft";
+  --appearance-solid: "solid";
+  --variant-primary: "primary";
+  --variant-secondary: "secondary";
+  --variant-info: "info";
+  --variant-warning: "warning";
+  --variant-danger: "danger";
+  --variant-success: "success";
+  --variant-neutral: "neutral";
+  --duration-short: 200ms;
+  --duration-medium: 400ms;
+  --duration-long: 600ms;
+  --typography-headline1-font-family: var(--font-family);
+  --typography-headline2-font-family: var(--font-family);
+  --typography-headline3-font-family: var(--font-family);
+  --typography-headline4-font-family: var(--font-family);
+  --typography-headline5-font-family: var(--font-family);
+  --typography-headline6-font-family: var(--font-family);
+  --typography-subtitle1-font-family: var(--font-family);
+  --typography-subtitle2-font-family: var(--font-family);
+  --typography-body1-font-family: var(--font-family);
+  --typography-body2-font-family: var(--font-family);
+  --typography-caption-font-family: var(--font-family);
+  --typography-button-font-family: var(--font-family);
+  --typography-overline-font-family: var(--font-family);
+  --elevation-light-light: 2px 2px 0px 0px var(--scheme-light-contrast);
+  --elevation-light-light-color-0: var(--scheme-light-contrast);
+  --elevation-light-semilight: 3px 3px 0px 0px var(--scheme-light-contrast);
+  --elevation-light-semilight-color-0: var(--scheme-light-contrast);
+  --elevation-light-regular: 4px 4px 0px 0px var(--scheme-light-contrast);
+  --elevation-light-regular-color-0: var(--scheme-light-contrast);
+  --elevation-light-semibold: 5px 5px 0px 0px var(--scheme-light-contrast);
+  --elevation-light-semibold-color-0: var(--scheme-light-contrast);
+  --elevation-light-bold: 6px 6px 0px 0px var(--scheme-light-contrast);
+  --elevation-light-bold-color-0: var(--scheme-light-contrast);
+  --elevation-light-extrabold: 7px 7px 0px 0px var(--scheme-light-contrast);
+  --elevation-light-extrabold-color-0: var(--scheme-light-contrast);
+  --elevation-dark-light: 2px 2px 0px 0px var(--scheme-dark-contrast);
+  --elevation-dark-light-color-0: var(--scheme-dark-contrast);
+  --elevation-dark-semilight: 3px 3px 0px 0px var(--scheme-dark-contrast);
+  --elevation-dark-semilight-color-0: var(--scheme-dark-contrast);
+  --elevation-dark-regular: 4px 4px 0px 0px var(--scheme-dark-contrast);
+  --elevation-dark-regular-color-0: var(--scheme-dark-contrast);
+  --elevation-dark-semibold: 5px 5px 0px 0px var(--scheme-dark-contrast);
+  --elevation-dark-semibold-color-0: var(--scheme-dark-contrast);
+  --elevation-dark-bold: 6px 6px 0px 0px var(--scheme-dark-contrast);
+  --elevation-dark-bold-color-0: var(--scheme-dark-contrast);
+  --elevation-dark-extrabold: 7px 7px 0px 0px var(--scheme-dark-contrast);
+  --elevation-dark-extrabold-color-0: var(--scheme-dark-contrast);
+  --size-key: var(--size-key-tiny) var(--size-key-small) var(--size-key-medium) var(--size-key-large) var(--size-key-giant);
+  --elevation-key: var(--elevation-key-light) var(--elevation-key-semilight) var(--elevation-key-regular) var(--elevation-key-semibold) var(--elevation-key-bold) var(--elevation-key-extrabold);
+  --appearance: var(--appearance-default) var(--appearance-outline) var(--appearance-plain) var(--appearance-soft) var(--appearance-solid);
+  --variant: var(--variant-primary) var(--variant-secondary) var(--variant-info) var(--variant-warning) var(--variant-danger) var(--variant-success) var(--variant-neutral);
+  --duration: var(--duration-short) var(--duration-medium) var(--duration-long);
+}

package/Themes/bootstrap-tokens.scss

@@ -0,0 +1,89 @@
+$name: "bootstrap";
+$font-family: 'Inter', Roboto, Helvetica, sans-serif;
+$layout-radius: 12px;
+$layout-space: 8px;
+$layout-thickness: 2px;
+$color-light-primary-100: #cfe2ff;
+$color-light-primary-200: #9ec5fe;
+$color-light-primary-300: #6ea8fe;
+$color-light-primary-400: #3d8bfd;
+$color-light-primary-500: #0d6efd;
+$color-light-primary-600: #0a58ca;
+$color-light-primary-700: #084298;
+$color-light-primary-800: #052c65;
+$color-light-primary-900: #031633;
+$color-light-secondary-100: #f8f9fa;
+$color-light-secondary-200: #e9ecef;
+$color-light-secondary-300: #dee2e6;
+$color-light-secondary-400: #ced4da;
+$color-light-secondary-500: #adb5bd;
+$color-light-secondary-600: #6c757d;
+$color-light-secondary-700: #495057;
+$color-light-secondary-800: #343a40;
+$color-light-secondary-900: #212529;
+$color-dark-primary-100: #cfe2ff;
+$color-dark-primary-200: #9ec5fe;
+$color-dark-primary-300: #6ea8fe;
+$color-dark-primary-400: #3d8bfd;
+$color-dark-primary-500: #0d6efd;
+$color-dark-primary-600: #0a58ca;
+$color-dark-primary-700: #084298;
+$color-dark-primary-800: #052c65;
+$color-dark-primary-900: #031633;
+$color-dark-secondary-100: #f8f9fa;
+$color-dark-secondary-200: #e9ecef;
+$color-dark-secondary-300: #dee2e6;
+$color-dark-secondary-400: #ced4da;
+$color-dark-secondary-500: #adb5bd;
+$color-dark-secondary-600: #6c757d;
+$color-dark-secondary-700: #495057;
+$color-dark-secondary-800: #343a40;
+$color-dark-secondary-900: #212529;
+$typography-headline1-font-size: 80px;
+$typography-headline1-line-height: 1.2;
+$typography-headline1-font-weight: 300;
+$typography-headline1-letter-spacing: 0;
+$typography-headline1-text-decoration: none;
+$typography-headline1-text-transform: none;
+$typography-headline2-font-size: 72px;
+$typography-headline2-line-height: 1.2;
+$typography-headline2-font-weight: 300;
+$typography-headline2-letter-spacing: 0;
+$typography-headline2-text-decoration: none;
+$typography-headline2-text-transform: none;
+$typography-headline3-font-size: 64px;
+$typography-headline3-line-height: 1.2;
+$typography-headline3-font-weight: 300;
+$typography-headline3-letter-spacing: 0;
+$typography-headline3-text-decoration: none;
+$typography-headline3-text-transform: none;
+$typography-headline4-font-size: 56px;
+$typography-headline4-line-height: 1.2;
+$typography-headline4-font-weight: 300;
+$typography-headline4-letter-spacing: 0;
+$typography-headline4-text-decoration: none;
+$typography-headline4-text-transform: none;
+$typography-headline5-font-size: 48px;
+$typography-headline5-line-height: 1.2;
+$typography-headline5-font-weight: 300;
+$typography-headline5-letter-spacing: 0;
+$typography-headline5-text-decoration: none;
+$typography-headline5-text-transform: none;
+$typography-headline6-font-size: 40px;
+$typography-headline6-line-height: 1.2;
+$typography-headline6-font-weight: 300;
+$typography-headline6-letter-spacing: 0;
+$typography-headline6-text-decoration: none;
+$typography-headline6-text-transform: none;
+$elevation-none: none;
+$size-tiny: 2px;
+$size-small: 4px;
+$size-medium: 8px;
+$size-large: 16px;
+$size-giant: 32px;
+$size-key-tiny: "tiny";
+$size-key-small: "small";
+$size-key-medium: "medium";
+$size-key-large: "large";
+$size-key-giant: "giant";
+$size-key: $size-key-tiny $size-key-small $size-key-medium $size-key-large $size-key-giant;

package/Themes/cosmopolitan-tokens.scss

@@ -0,0 +1,211 @@
+$name: "cosmopolitan";
+$font-family: 'Noto Sans', sans-serif;
+$layout-radius: 3px;
+$layout-space: 8px;
+$layout-thickness: 1px;
+$scheme-light-contrast: #ffffff;
+$scheme-light-background: #ffffff;
+$scheme-light-foreground: #000000;
+$scheme-light-highlight: #E2E2E2;
+$scheme-light-middlelight: #777777;
+$scheme-light-lowlight: #4D4D4D;
+$scheme-light-transparent: #FFFFFF00;
+$scheme-light-semi-transparent: #FFFFFFAA;
+$scheme-light-disabled: #B8B5B2;
+$scheme-dark-contrast: #ffffff;
+$scheme-dark-background: #2E2D2D;
+$scheme-dark-foreground: #ffffff;
+$scheme-dark-highlight: #333333;
+$scheme-dark-middlelight: #666666;
+$scheme-dark-lowlight: #999999;
+$scheme-dark-transparent: #17171700;
+$scheme-dark-semi-transparent: #171717aa;
+$scheme-dark-disabled: #5C5956;
+$color-light-primary-0: #ffffff;
+$color-light-primary-100: #fed7ea;
+$color-light-primary-500: #dc1884;
+$color-dark-primary-0: #000000;
+$color-dark-primary-100: #4b0225;
+$color-dark-primary-500: #dc1884;
+$typography-heading-font-size: 24px;
+$typography-heading-line-height: 28px;
+$typography-heading-font-weight: 300;
+$typography-heading-letter-spacing: -0.25px;
+$typography-heading-text-decoration: none;
+$typography-heading-text-transform: none;
+$typography-content-font-size: 16px;
+$typography-content-line-height: 20px;
+$typography-content-font-weight: 300;
+$typography-content-letter-spacing: -0.25px;
+$typography-content-text-decoration: none;
+$typography-content-text-transform: none;
+$typography-button-font-size: 16px;
+$typography-button-line-height: 20px;
+$typography-button-font-weight: 700;
+$typography-button-letter-spacing: -0.25px;
+$typography-button-text-decoration: none;
+$typography-button-text-transform: uppercase;
+$elevation-none: none;
+$elevation-light-light: 0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 2px 0px rgba(0, 0, 0, 0.14);
+$elevation-light-light-offset-x-0: 0px;
+$elevation-light-light-offset-x-1: 0px;
+$elevation-light-light-offset-y-0: 0px;
+$elevation-light-light-offset-y-1: 1px;
+$elevation-light-light-blur-0: 2px;
+$elevation-light-light-blur-1: 2px;
+$elevation-light-light-spread-0: 0px;
+$elevation-light-light-spread-1: 0px;
+$elevation-light-light-color-0: rgba(0, 0, 0, 0.12);
+$elevation-light-light-color-1: rgba(0, 0, 0, 0.14);
+$elevation-light-semilight: 0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 2px 4px 0px rgba(0, 0, 0, 0.14);
+$elevation-light-semilight-offset-x-0: 0px;
+$elevation-light-semilight-offset-x-1: 0px;
+$elevation-light-semilight-offset-y-0: 0px;
+$elevation-light-semilight-offset-y-1: 2px;
+$elevation-light-semilight-blur-0: 2px;
+$elevation-light-semilight-blur-1: 4px;
+$elevation-light-semilight-spread-0: 0px;
+$elevation-light-semilight-spread-1: 0px;
+$elevation-light-semilight-color-0: rgba(0, 0, 0, 0.12);
+$elevation-light-semilight-color-1: rgba(0, 0, 0, 0.14);
+$elevation-light-regular: 0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 4px 8px 0px rgba(0, 0, 0, 0.14);
+$elevation-light-regular-offset-x-0: 0px;
+$elevation-light-regular-offset-x-1: 0px;
+$elevation-light-regular-offset-y-0: 0px;
+$elevation-light-regular-offset-y-1: 4px;
+$elevation-light-regular-blur-0: 2px;
+$elevation-light-regular-blur-1: 8px;
+$elevation-light-regular-spread-0: 0px;
+$elevation-light-regular-spread-1: 0px;
+$elevation-light-regular-color-0: rgba(0, 0, 0, 0.12);
+$elevation-light-regular-color-1: rgba(0, 0, 0, 0.14);
+$elevation-light-semibold: 0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 8px 16px 0px rgba(0, 0, 0, 0.14);
+$elevation-light-semibold-offset-x-0: 0px;
+$elevation-light-semibold-offset-x-1: 0px;
+$elevation-light-semibold-offset-y-0: 0px;
+$elevation-light-semibold-offset-y-1: 8px;
+$elevation-light-semibold-blur-0: 2px;
+$elevation-light-semibold-blur-1: 16px;
+$elevation-light-semibold-spread-0: 0px;
+$elevation-light-semibold-spread-1: 0px;
+$elevation-light-semibold-color-0: rgba(0, 0, 0, 0.12);
+$elevation-light-semibold-color-1: rgba(0, 0, 0, 0.14);
+$elevation-light-bold: 0px 0px 8px 0px rgba(0, 0, 0, 0.12), 0px 14px 28px 0px rgba(0, 0, 0, 0.14);
+$elevation-light-bold-offset-x-0: 0px;
+$elevation-light-bold-offset-x-1: 0px;
+$elevation-light-bold-offset-y-0: 0px;
+$elevation-light-bold-offset-y-1: 14px;
+$elevation-light-bold-blur-0: 8px;
+$elevation-light-bold-blur-1: 28px;
+$elevation-light-bold-spread-0: 0px;
+$elevation-light-bold-spread-1: 0px;
+$elevation-light-bold-color-0: rgba(0, 0, 0, 0.12);
+$elevation-light-bold-color-1: rgba(0, 0, 0, 0.14);
+$elevation-light-extrabold: 0px 0px 8px 0px rgba(0, 0, 0, 0.12), 0px 32px 64px 0px rgba(0, 0, 0, 0.14);
+$elevation-light-extrabold-offset-x-0: 0px;
+$elevation-light-extrabold-offset-x-1: 0px;
+$elevation-light-extrabold-offset-y-0: 0px;
+$elevation-light-extrabold-offset-y-1: 32px;
+$elevation-light-extrabold-blur-0: 8px;
+$elevation-light-extrabold-blur-1: 64px;
+$elevation-light-extrabold-spread-0: 0px;
+$elevation-light-extrabold-spread-1: 0px;
+$elevation-light-extrabold-color-0: rgba(0, 0, 0, 0.12);
+$elevation-light-extrabold-color-1: rgba(0, 0, 0, 0.14);
+$elevation-dark-light: 0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 1px 2px 0px rgba(0, 0, 0, 0.28);
+$elevation-dark-light-offset-x-0: 0px;
+$elevation-dark-light-offset-x-1: 0px;
+$elevation-dark-light-offset-y-0: 0px;
+$elevation-dark-light-offset-y-1: 1px;
+$elevation-dark-light-blur-0: 2px;
+$elevation-dark-light-blur-1: 2px;
+$elevation-dark-light-spread-0: 0px;
+$elevation-dark-light-spread-1: 0px;
+$elevation-dark-light-color-0: rgba(0, 0, 0, 0.24);
+$elevation-dark-light-color-1: rgba(0, 0, 0, 0.28);
+$elevation-dark-semilight: 0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 2px 4px 0px rgba(0, 0, 0, 0.28);
+$elevation-dark-semilight-offset-x-0: 0px;
+$elevation-dark-semilight-offset-x-1: 0px;
+$elevation-dark-semilight-offset-y-0: 0px;
+$elevation-dark-semilight-offset-y-1: 2px;
+$elevation-dark-semilight-blur-0: 2px;
+$elevation-dark-semilight-blur-1: 4px;
+$elevation-dark-semilight-spread-0: 0px;
+$elevation-dark-semilight-spread-1: 0px;
+$elevation-dark-semilight-color-0: rgba(0, 0, 0, 0.24);
+$elevation-dark-semilight-color-1: rgba(0, 0, 0, 0.28);
+$elevation-dark-regular: 0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 4px 8px 0px rgba(0, 0, 0, 0.28);
+$elevation-dark-regular-offset-x-0: 0px;
+$elevation-dark-regular-offset-x-1: 0px;
+$elevation-dark-regular-offset-y-0: 0px;
+$elevation-dark-regular-offset-y-1: 4px;
+$elevation-dark-regular-blur-0: 2px;
+$elevation-dark-regular-blur-1: 8px;
+$elevation-dark-regular-spread-0: 0px;
+$elevation-dark-regular-spread-1: 0px;
+$elevation-dark-regular-color-0: rgba(0, 0, 0, 0.24);
+$elevation-dark-regular-color-1: rgba(0, 0, 0, 0.28);
+$elevation-dark-semibold: 0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 8px 16px 0px rgba(0, 0, 0, 0.28);
+$elevation-dark-semibold-offset-x-0: 0px;
+$elevation-dark-semibold-offset-x-1: 0px;
+$elevation-dark-semibold-offset-y-0: 0px;
+$elevation-dark-semibold-offset-y-1: 8px;
+$elevation-dark-semibold-blur-0: 2px;
+$elevation-dark-semibold-blur-1: 16px;
+$elevation-dark-semibold-spread-0: 0px;
+$elevation-dark-semibold-spread-1: 0px;
+$elevation-dark-semibold-color-0: rgba(0, 0, 0, 0.24);
+$elevation-dark-semibold-color-1: rgba(0, 0, 0, 0.28);
+$elevation-dark-bold: 0px 0px 8px 0px rgba(0, 0, 0, 0.24), 0px 14px 28px 0px rgba(0, 0, 0, 0.28);
+$elevation-dark-bold-offset-x-0: 0px;
+$elevation-dark-bold-offset-x-1: 0px;
+$elevation-dark-bold-offset-y-0: 0px;
+$elevation-dark-bold-offset-y-1: 14px;
+$elevation-dark-bold-blur-0: 8px;
+$elevation-dark-bold-blur-1: 28px;
+$elevation-dark-bold-spread-0: 0px;
+$elevation-dark-bold-spread-1: 0px;
+$elevation-dark-bold-color-0: rgba(0, 0, 0, 0.24);
+$elevation-dark-bold-color-1: rgba(0, 0, 0, 0.28);
+$elevation-dark-extrabold: 0px 0px 8px 0px rgba(0, 0, 0, 0.24), 0px 32px 64px 0px rgba(0, 0, 0, 0.28);
+$elevation-dark-extrabold-offset-x-0: 0px;
+$elevation-dark-extrabold-offset-x-1: 0px;
+$elevation-dark-extrabold-offset-y-0: 0px;
+$elevation-dark-extrabold-offset-y-1: 32px;
+$elevation-dark-extrabold-blur-0: 8px;
+$elevation-dark-extrabold-blur-1: 64px;
+$elevation-dark-extrabold-spread-0: 0px;
+$elevation-dark-extrabold-spread-1: 0px;
+$elevation-dark-extrabold-color-0: rgba(0, 0, 0, 0.24);
+$elevation-dark-extrabold-color-1: rgba(0, 0, 0, 0.28);
+$size-tiny: 2px;
+$size-small: 4px;
+$size-medium: 8px;
+$size-large: 16px;
+$size-giant: 32px;
+$size-key-tiny: "tiny";
+$size-key-small: "small";
+$size-key-medium: "medium";
+$size-key-large: "large";
+$size-key-giant: "giant";
+$typography-key-heading: "heading";
+$typography-key-content: "content";
+$typography-key-button: "button";
+$elevation-key-light: "light";
+$elevation-key-semilight: "semilight";
+$elevation-key-regular: "regular";
+$elevation-key-semibold: "semibold";
+$elevation-key-bold: "bold";
+$elevation-key-extrabold: "extrabold";
+$variant-primary: "primary";
+$variant-secondary: "secondary";
+$variant-tertiary: "tertiary";
+$duration-short: 200ms;
+$duration-medium: 400ms;
+$duration-long: 600ms;
+$typography-heading-font-family: $font-family;
+$typography-content-font-family: $font-family;
+$typography-button-font-family: $font-family;
+$size-key: $size-key-tiny $size-key-small $size-key-medium $size-key-large $size-key-giant;
+$elevation-key: $elevation-key-light $elevation-key-semilight $elevation-key-regular $elevation-key-semibold $elevation-key-bold $elevation-key-extrabold;
+$variant: $variant-primary;