:root {
  --ungrouped-token: Im Not Part of Any Group;
  --border-1: red dotted 2px;
  --breakpoint-large: var(--radius-large);
  --breakpoint-medium: 480px;
  --breakpoint-small: 330px;
  --breakpoint-xlarge: 992px;
  --breakpoint-xxlarge: 1240px;
  --breakpoint-xxxlarge: 1440px;
  --collections-density-spacing-large-compact: var(--spacing-scale-4);
  --collections-density-spacing-large-cozy: var(--spacing-scale-5);
  --collections-density-spacing-medium-compact: var(--spacing-scale-3);
  --collections-density-spacing-medium-cozy: var(--spacing-scale-4);
  --collections-density-spacing-small-compact: var(--spacing-scale-2);
  --collections-density-spacing-small-cozy: var(--spacing-scale-3);
  --collections-density-spacing-xlarge-compact: var(--spacing-scale-5);
  --collections-density-spacing-xlarge-cozy: var(--spacing-scale-6);
  --collections-density-spacing-xsmall-compact: var(--spacing-scale-1);
  --collections-density-spacing-xsmall-cozy: var(--spacing-scale-2);
  --collections-density-spacing-xxlarge-compact: var(--spacing-scale-7);
  --collections-density-spacing-xxlarge-cozy: var(--spacing-scale-8);
  --collections-density-spacing-xxxlarge-compact: var(--spacing-scale-8);
  --collections-density-spacing-xxxlarge-cozy: var(--spacing-scale-10);
  --collections-testing-a-boolean-brand-a-dark: false;
  --collections-testing-a-boolean-brand-a-light: true;
  --collections-testing-a-boolean-brand-b-dark: false;
  --collections-testing-a-boolean-brand-b-light: false;
  --collections-testing-a-color-a-brand-a-dark: #ff0000;
  --collections-testing-a-color-a-brand-a-light: #0a73bf;
  --collections-testing-a-color-a-brand-b-dark: #f4df85;
  --collections-testing-a-color-a-brand-b-light: #19d062;
  --collections-testing-a-color-b-brand-a-dark: #2bd7ef;
  --collections-testing-a-color-b-brand-a-light: #8ab335;
  --collections-testing-a-color-b-brand-b-dark: #f4901b;
  --collections-testing-a-color-b-brand-b-light: #c533d7;
  --collections-testing-a-dimension-brand-a-dark: 1rem;
  --collections-testing-a-dimension-brand-a-light: 1px;
  --collections-testing-a-dimension-brand-b-dark: 100%;
  --collections-testing-a-dimension-brand-b-light: 1em;
  --collections-testing-a-duration-brand-a-dark: 200ms;
  --collections-testing-a-duration-brand-a-light: 100ms;
  --collections-testing-a-duration-brand-b-dark: 400ms;
  --collections-testing-a-duration-brand-b-light: 300ms;
  --collections-testing-a-font-weight-brand-a-dark: 500;
  --collections-testing-a-font-weight-brand-a-light: 400;
  --collections-testing-a-font-weight-brand-b-dark: 700;
  --collections-testing-a-font-weight-brand-b-light: 600;
  --collections-testing-a-number-brand-a-dark: 2;
  --collections-testing-a-number-brand-a-light: 1;
  --collections-testing-a-number-brand-b-dark: 4;
  --collections-testing-a-number-brand-b-light: 3;
  --collections-testing-a-string-brand-a-dark: brandADark value;
  --collections-testing-a-string-brand-a-light: brandALight value;
  --collections-testing-a-string-brand-b-dark: brandBDark value;
  --collections-testing-a-string-brand-b-light: brandBLight value;
  --collections-testing-b-boolean-static: true;
  --collections-testing-b-boolean-token-ref: var(--misc-boolean);
  --collections-testing-b-color-static: #1df8ff;
  --collections-testing-b-color-token-ref: var(--misc-color);
  --collections-testing-b-dimension-static: 1rem;
  --collections-testing-b-dimension-token-ref: var(--misc-dimension);
  --collections-testing-b-duration-static: 100ms;
  --collections-testing-b-duration-token-ref: var(--misc-duration);
  --collections-testing-b-font-weight-static: 400;
  --collections-testing-b-font-weight-token-ref: var(--misc-font-weight);
  --collections-testing-b-number-static: 1;
  --collections-testing-b-number-token-ref: var(--misc-magic-number);
  --collections-testing-b-string-static: static value;
  --collections-testing-b-string-token-ref: var(--misc-some-text);
  --collections-testing-b-var-ref-var-ref-static: #000000;
  --collections-theme-action-text-arcadia-dark: var(--sandbox-color-white);
  --collections-theme-action-text-arcadia-light: var(--sandbox-color-white);
  --collections-theme-action-text-basis-dark: var(--sandbox-color-white);
  --collections-theme-action-text-basis-light: var(--sandbox-color-white);
  --collections-theme-background-content-arcadia-dark: #3b3644;
  --collections-theme-background-content-arcadia-light: #ffffff;
  --collections-theme-background-content-basis-dark: #3b3644;
  --collections-theme-background-content-basis-light: #ffffff;
  --collections-theme-background-page-arcadia-dark: #1f1c25;
  --collections-theme-background-page-arcadia-light: #fdfcfe;
  --collections-theme-background-page-basis-dark: #1f1c25;
  --collections-theme-background-page-basis-light: #fdfcfe;
  --collections-theme-brand-color-arcadia-dark: #7a34ed;
  --collections-theme-brand-color-arcadia-light: #7a34ed;
  --collections-theme-brand-color-basis-dark: #ed7734;
  --collections-theme-brand-color-basis-light: #ed7734;
  --collections-theme-brand-font-family-arcadia-dark: Inter;
  --collections-theme-brand-font-family-arcadia-light: Inter;
  --collections-theme-brand-font-family-basis-dark: Merriweather;
  --collections-theme-brand-font-family-basis-light: Merriweather;
  --collections-theme-brand-logo-arcadia-dark: url('https://knapsack.imgix.net/site/ks-sandbox/logo-arcadia-4id5a3sy3ysvg');
  --collections-theme-brand-logo-arcadia-light: url('https://knapsack.imgix.net/site/ks-sandbox/logo-arcadia-4id5a3sy3ysvg');
  --collections-theme-brand-logo-basis-dark: url('https://knapsack.imgix.net/site/ks-sandbox/logo-basis-34vzcamdqxpng');
  --collections-theme-brand-logo-basis-light: url('https://knapsack.imgix.net/site/ks-sandbox/logo-basis-34vzcamdqxpng');
  --collections-theme-text-base-arcadia-dark: #f6f8ff;
  --collections-theme-text-base-arcadia-light: #191f2c;
  --collections-theme-text-base-basis-dark: #f6f8ff;
  --collections-theme-text-base-basis-light: #191f2c;
  --collections-theme-text-subtle-arcadia-dark: #bec3d3;
  --collections-theme-text-subtle-arcadia-light: #6e7a82;
  --collections-theme-text-subtle-basis-dark: #bec3d3;
  --collections-theme-text-subtle-basis-light: #6e7a82;
  --color-black: var(--color-neutral-800);
  --color-error: #ff5c46;
  --color-success: #6bc313;
  --color-warning: #fab120;
  --color-white: #ffffff;
  --color-neutral-100: #fafafb;
  --color-neutral-200: #f6f6f7;
  --color-neutral-300: #edecef;
  --color-neutral-400: #dedce2;
  --color-neutral-500: #bfbdc6;
  --color-neutral-600: #acaab6;
  --color-neutral-700: #878496;
  --color-neutral-800: #191335;
  --color-pink-100: #ffdddb;
  --color-pink-200: #fcb6b8;
  --color-pink-300: #fa919f;
  --color-pink-400: #f37491;
  --color-pink-500: #ec487d;
  --color-pink-600: #ca3473;
  --color-pink-700: #aa2469;
  --color-pink-800: #710d55;
  --color-purple-100: #e5dbfe;
  --color-purple-200: #c9b8fe;
  --color-purple-300: #aa94f9;
  --color-purple-400: #9076f3;
  --color-purple-500: #6a4cec;
  --color-purple-600: #5036cb;
  --color-purple-700: #3925aa;
  --color-purple-800: #190f72;
  --color-text-default: var(--color-neutral-800);
  --color-text-disabled: var(--color-neutral-400);
  --color-text-muted: var(--color-neutral-600);
  --color-text-white: var(--color-white);
  --cypress-large: 1.5rem;
  --cypress-medium: 1rem;
  --cypress-small: 0.5rem;
  --media-query-large: screen and (min-width: var(--breakpoint-large));
  --media-query-medium: screen and (min-width: var(--breakpoint-medium));
  --media-query-small: screen and (min-width: var(--breakpoint-small));
  --misc-boolean: true;
  --misc-color: #000000;
  --misc-dimension: 1px;
  --misc-duration: 100ms;
  --misc-font-weight: 400;
  --misc-is-awesome: true;
  --misc-is-awesome2: var(--misc-is-awesome);
  --misc-magic-number: 42;
  --misc-shadow: 1px 1px 1px 1px #000000;
  --misc-some-text: Hello world;
  --radius-large: var(--cypress-large);
  --radius-medium: 8px;
  --radius-round: 160px;
  --radius-small: 4px;
  --sandbox-color-error: #ff5c46;
  --sandbox-color-success: #6bc313;
  --sandbox-color-warning: #fab120;
  --sandbox-color-white: #ffffff;
  --sandbox-radius-large: 16px;
  --sandbox-radius-medium: 8px;
  --sandbox-radius-small: 4px;
  --sandbox-radius-xlarge: 32px;
  --sandbox-radius-xsmall: 2px;
  --sandbox-width-narrow: 640px;
  --sandbox-width-wide: 1080px;
  --shadow-1: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  --shadow-2: 0px 10px 20px 0px #000000;
  --shadow-3: 0px 15px 25px 0px #000000;
  --shadow-4: 0px 20px 40px 0px #000000;
  --shadow-color: #000000;
  --spacing-scale-1: 2px;
  --spacing-scale-2: 4px;
  --spacing-scale-3: 8px;
  --spacing-scale-4: 12px;
  --spacing-scale-5: 16px;
  --spacing-scale-6: 24px;
  --spacing-scale-7: 32px;
  --spacing-scale-8: 40px;
  --spacing-scale-9: 48px;
  --spacing-scale-10: 64px;
  --spacing-scale-11: 80px;
  --spacing-scale-12: 96px;
  --spacing-scale-13: 160px;
  --transition-a: 250ms cubic-bezier(0, 0, 1, 1) 100ms;
  --transition-b: 500ms cubic-bezier(0.1, 1, 0.3, 1) 10ms;
}

:root,
[data-collections-density='cozy'] {
  --spacing-large: var(--collections-density-spacing-large-cozy);
  --spacing-medium: var(--collections-density-spacing-medium-cozy);
  --spacing-small: var(--collections-density-spacing-small-cozy);
  --spacing-xlarge: var(--collections-density-spacing-xlarge-cozy);
  --spacing-xsmall: var(--collections-density-spacing-xsmall-cozy);
  --spacing-xxlarge: var(--collections-density-spacing-xxlarge-cozy);
  --spacing-xxxlarge: var(--collections-density-spacing-xxxlarge-cozy);
}

[data-collections-density='compact'] {
  --spacing-large: var(--collections-density-spacing-large-compact);
  --spacing-medium: var(--collections-density-spacing-medium-compact);
  --spacing-small: var(--collections-density-spacing-small-compact);
  --spacing-xlarge: var(--collections-density-spacing-xlarge-compact);
  --spacing-xsmall: var(--collections-density-spacing-xsmall-compact);
  --spacing-xxlarge: var(--collections-density-spacing-xxlarge-compact);
  --spacing-xxxlarge: var(--collections-density-spacing-xxxlarge-compact);
}

:root,
[data-collections-testing-a='brandALight'] {
  --boolean: var(--collections-testing-a-boolean-brand-a-light);
  --color-a: var(--collections-testing-a-color-a-brand-a-light);
  --color-b: var(--collections-testing-a-color-b-brand-a-light);
  --dimension: var(--collections-testing-a-dimension-brand-a-light);
  --duration: var(--collections-testing-a-duration-brand-a-light);
  --font-weight: var(--collections-testing-a-font-weight-brand-a-light);
  --number: var(--collections-testing-a-number-brand-a-light);
  --string: var(--collections-testing-a-string-brand-a-light);
  --var-ref: var(--color-b);
}

[data-collections-testing-a='brandADark'] {
  --boolean: var(--collections-testing-a-boolean-brand-a-dark);
  --color-a: var(--collections-testing-a-color-a-brand-a-dark);
  --color-b: var(--collections-testing-a-color-b-brand-a-dark);
  --dimension: var(--collections-testing-a-dimension-brand-a-dark);
  --duration: var(--collections-testing-a-duration-brand-a-dark);
  --font-weight: var(--collections-testing-a-font-weight-brand-a-dark);
  --number: var(--collections-testing-a-number-brand-a-dark);
  --string: var(--collections-testing-a-string-brand-a-dark);
  --var-ref: var(--color-b);
}

[data-collections-testing-a='brandBLight'] {
  --boolean: var(--collections-testing-a-boolean-brand-b-light);
  --color-a: var(--collections-testing-a-color-a-brand-b-light);
  --color-b: var(--collections-testing-a-color-b-brand-b-light);
  --dimension: var(--collections-testing-a-dimension-brand-b-light);
  --duration: var(--collections-testing-a-duration-brand-b-light);
  --font-weight: var(--collections-testing-a-font-weight-brand-b-light);
  --number: var(--collections-testing-a-number-brand-b-light);
  --string: var(--collections-testing-a-string-brand-b-light);
  --var-ref: var(--color-b);
}

[data-collections-testing-a='brandBDark'] {
  --boolean: var(--collections-testing-a-boolean-brand-b-dark);
  --color-a: var(--collections-testing-a-color-a-brand-b-dark);
  --color-b: var(--collections-testing-a-color-b-brand-b-dark);
  --dimension: var(--collections-testing-a-dimension-brand-b-dark);
  --duration: var(--collections-testing-a-duration-brand-b-dark);
  --font-weight: var(--collections-testing-a-font-weight-brand-b-dark);
  --number: var(--collections-testing-a-number-brand-b-dark);
  --string: var(--collections-testing-a-string-brand-b-dark);
  --var-ref: var(--color-b);
}

:root,
[data-collections-testing-b='static'] {
  --boolean: var(--collections-testing-b-boolean-static);
  --color: var(--collections-testing-b-color-static);
  --dimension: var(--collections-testing-b-dimension-static);
  --duration: var(--collections-testing-b-duration-static);
  --font-weight: var(--collections-testing-b-font-weight-static);
  --number: var(--collections-testing-b-number-static);
  --string: var(--collections-testing-b-string-static);
  --var-ref-var-ref: var(--collections-testing-b-var-ref-var-ref-static);
}

[data-collections-testing-b='varRef'] {
  --boolean: var(--boolean);
  --color: var(--color-a);
  --dimension: var(--dimension);
  --duration: var(--duration);
  --font-weight: var(--font-weight);
  --number: var(--number);
  --string: var(--string);
  --var-ref-var-ref: var(--var-ref);
}

[data-collections-testing-b='tokenRef'] {
  --boolean: var(--collections-testing-b-boolean-token-ref);
  --color: var(--collections-testing-b-color-token-ref);
  --dimension: var(--collections-testing-b-dimension-token-ref);
  --duration: var(--collections-testing-b-duration-token-ref);
  --font-weight: var(--collections-testing-b-font-weight-token-ref);
  --number: var(--collections-testing-b-number-token-ref);
  --string: var(--collections-testing-b-string-token-ref);
  --var-ref-var-ref: var(--var-ref);
}

:root,
[data-collections-theme='arcadiaLight'] {
  --action-base: var(--brand-color);
  --action-text: var(--collections-theme-action-text-arcadia-light);
  --background-content: var(
    --collections-theme-background-content-arcadia-light
  );
  --background-page: var(--collections-theme-background-page-arcadia-light);
  --brand-color: var(--collections-theme-brand-color-arcadia-light);
  --brand-font-family: var(--collections-theme-brand-font-family-arcadia-light);
  --brand-logo: var(--collections-theme-brand-logo-arcadia-light);
  --text-base: var(--collections-theme-text-base-arcadia-light);
  --text-subtle: var(--collections-theme-text-subtle-arcadia-light);
}

[data-collections-theme='arcadiaDark'] {
  --action-base: var(--brand-color);
  --action-text: var(--collections-theme-action-text-arcadia-dark);
  --background-content: var(
    --collections-theme-background-content-arcadia-dark
  );
  --background-page: var(--collections-theme-background-page-arcadia-dark);
  --brand-color: var(--collections-theme-brand-color-arcadia-dark);
  --brand-font-family: var(--collections-theme-brand-font-family-arcadia-dark);
  --brand-logo: var(--collections-theme-brand-logo-arcadia-dark);
  --text-base: var(--collections-theme-text-base-arcadia-dark);
  --text-subtle: var(--collections-theme-text-subtle-arcadia-dark);
}

[data-collections-theme='basisLight'] {
  --action-base: var(--brand-color);
  --action-text: var(--collections-theme-action-text-basis-light);
  --background-content: var(--collections-theme-background-content-basis-light);
  --background-page: var(--collections-theme-background-page-basis-light);
  --brand-color: var(--collections-theme-brand-color-basis-light);
  --brand-font-family: var(--collections-theme-brand-font-family-basis-light);
  --brand-logo: var(--collections-theme-brand-logo-basis-light);
  --text-base: var(--collections-theme-text-base-basis-light);
  --text-subtle: var(--collections-theme-text-subtle-basis-light);
}

[data-collections-theme='basisDark'] {
  --action-base: var(--brand-color);
  --action-text: var(--collections-theme-action-text-basis-dark);
  --background-content: var(--collections-theme-background-content-basis-dark);
  --background-page: var(--collections-theme-background-page-basis-dark);
  --brand-color: var(--collections-theme-brand-color-basis-dark);
  --brand-font-family: var(--collections-theme-brand-font-family-basis-dark);
  --brand-logo: var(--collections-theme-brand-logo-basis-dark);
  --text-base: var(--collections-theme-text-base-basis-dark);
  --text-subtle: var(--collections-theme-text-subtle-basis-dark);
}