:root {
	/* Fonts */
	--font-primary: "soffid";
	--weight-regular: 400;
	--weight-medium: 500;
	--weight-semi-bold: 600;
	--weight-bold: 700;
	--size-3xs: 8px;
	--size-2xs: 10px;
	--size-xs: 12px;
	--size-sm: 14px;
	--size-md: 16px;
	--size-lg: 18px;
	--size-xl: 20px;
	--size-2xl: 24px;
	--size-3xl: 30px;
	--size-4xl: 38px;
	--leading-3xs: 12;
	--leading-2xs: 16;
	--leading-xs: 18;
	--leading-sm: 22;
	--leading-md: 24;
	--leading-lg: 28;
	--leading-xl: 28;
	--leading-2xl: 32;
	--leading-3xl: 40;
	--leading-4xl: 50;
	--tracking-3xs: 0;
	--tracking-2xs: 0;
	--tracking-xs: 0;
	--tracking-sm: 0;
	--tracking-md: 0;
	--tracking-lg: 0;
	--tracking-xl: 0;
	--tracking-2xl: 0;
	--tracking-3xl: 0;
	--tracking-4xl: 0;
	--tracking-5xl: 0;
	--tracking-6xl: 0;
	--tracking-7xl: 0;
	--tracking-8xl: 0;
	--leading-5xl: 62;
	--leading-6xl: 78;
	--leading-7xl: 82;
	--leading-8xl: 140;
	--size-5xl: 48;
	--size-6xl: 60;
	--size-7xl: 74;
	--size-8xl: 128;
	/* Space
     ================================================================= */
	--space-base-unit: var(--base-unit);
	/* Spacing */
	--spacing-3xs: 4;
	--spacing-2xs: 8;
	--spacing-xs: 12;
	--spacing-sm: 16;
	--spacing-md: 24;
	--spacing-lg: 32;
	--number: 0;
	--spacing-xl: 48;
	--spacing-2xl: 64;
	/* Border Radius */
	--br-circ: 999px;
	--br-xl: 16px;
	--br-lg: 12px;
	--br-md: 8px;
	--br-sm: 8px;
	--br-xs: 6px;
	--br-none: 0;
	/* Color
     ================================================================= */
	--tertiary-50: #ffe5df;
	--tertiary-100: #fecabd;
	--tertiary-200: #fdaf9c;
	--tertiary-300: #fb937b;
	--tertiary-400: #fa7859;
	--tertiary-500: #f95d38;
	--tertiary-600: #bb462a;
	--tertiary-700: #7d2f1c;
	--tertiary-800: #3e170e;
	--tertiary-900: #1f0c07;
	--secondary-50: #e5fcff;
	--secondary-100: #c9f8fe;
	--secondary-200: #aef4fd;
	--secondary-300: #92f0fc;
	--secondary-400: #77ecfb;
	--secondary-500: #5be8fa;
	--secondary-600: #44aebc;
	--secondary-700: #2e747d;
	--secondary-800: #173a3f;
	--secondary-900: #0b1d1f;
	--primary-50: #d7e1e7;
	--primary-100: #aec2cd;
	--primary-200: #86a4b4;
	--primary-300: #5d859b;
	--primary-400: #346681;
	--primary-500: #0b4768;
	--primary-600: #08354e;
	--primary-700: #062434;
	--primary-800: #03121a;
	--primary-900: #01090d;
	--positive-50: #ECFDF5;
	--positive-100: #D1FAE5;
	--positive-200: #A7F3D0;
	--positive-300: #6EE7B7;
	--positive-400: #34D399;
	--positive-500: #10B981;
	--positive-600: #059669;
	--positive-700: #047857;
	--positive-800: #065F46;
	--positive-900: #064E3B;
	--positive-950: #024231;
	--warning-50: #FFFBEB;
	--warning-100: #FEF3C7;
	--warning-200: #FDE68A;
	--warning-300: #FCD34D;
	--warning-400: #FBBF24;
	--warning-500: #F59E0B;
	--warning-600: #D97706;
	--warning-700: #B45309;
	--warning-800: #92400E;
	--warning-900: #78350F;
	--warning-950: #451A03;
	--critical-50: #FEF2F2;
	--critical-100: #FEE2E2;
	--critical-200: #FECACA;
	--critical-300: #FCA5A5;
	--critical-400: #F87171;
	--critical-500: #EF4444;
	--critical-600: #DC2626;
	--critical-700: #B91C1C;
	--critical-800: #991B1B;
	--critical-900: #7F1D1D;
	--critical-950: #410606;
	--neutral-50: #FAFAFA;
	--neutral-100: #F5F5F5;
	--neutral-200: #E5E5E5;
	--neutral-300: #D4D4D8;
	--neutral-400: #A3A3A3;
	--neutral-500: #737373;
	--neutral-600: #525252;
	--neutral-700: #404040;
	--neutral-800: #262626;
	--neutral-900: #111111;
	--neutral-999: #000000;
	--alpha-bright-transparent: #FFFFFF00;
	--alpha-bright-3: #FFFFFF07;
	--alpha-bright-5: #FFFFFF0C;
	--alpha-bright-10: #FFFFFF19;
	--alpha-bright-15: #FFFFFF26;
	--alpha-bright-20: #FFFFFF33;
	--alpha-bright-30: #FFFFFF4C;
	--alpha-bright-50: #FFFFFF7F;
	--alpha-bright-75: #FFFFFFBF;
	--alpha-bright-100: #FFFFFF;
	--alpha-dark-transparent: #12121200;
	--alpha-dark-3: #12121207;
	--alpha-dark-5: #1212120C;
	--alpha-dark-10: #12121219;
	--alpha-dark-15: #12121226;
	--alpha-dark-20: #12121233;
	--alpha-dark-30: #12121259;
	--alpha-dark-50: #1212127F;
	--alpha-dark-75: #121212BF;
	--alpha-dark-100: #121212FF;
}

:root {
	--bg-primary: var(--alpha-bright-100);
	--bg-secondary: var(--alpha-bright-100);
	--bg-critical: var(--critical-500);
	--fg-critical: var(--critical-500);
	--fg-neutral: var(--alpha-dark-100);
	--fg-neutral-faded: var(--neutral-500);
	--fg-primary: var(--primary-500);
	--fg-primary-disabled: var(--primary-200);
	--fg-primary-hover: var(--primary-600);
	--fg-secondary: var(--tertiary-500);
	--fg-secondary-disabled: var(--tertiary-200);
	--fg-secondary-hover: var(--tertiary-600);
	--bg-neutral: var(--alpha-dark-100);
	--bg-neutral-faded: var(--neutral-100);
	--bg-neutral-faded-disabled: var(--neutral-100);
	--bg-outlined-hover: var(--neutral-100);
	--bg-neutral-faded-hover: var(--neutral-200);
	--fg-disabled: var(--neutral-400);
	--bg-critical-hover: var(--critical-600);
	--bg-critical-disabled: var(--critical-300);
	--bg-critical-faded: var(--critical-50);
	--bg-critical-faded-hover: #var(--critical-50);
	--bg-tag-secondary-faded: var(--secondary-50);
	--bg-tag-secondary: var(--secondary-500);
	--bg-positive: var(--positive-500);
	--bg-positive-faded: var(--positive-50);
	--fg-positive: var(--positive-500);
	--bg-tertiary: var(--tertiary-500);
	--bg-tertiary-faded: var(--tertiary-50);
	--fg-tertiary: var(--tertiary-500);
	--bg-warning-faded: var(--warning-50);
	--fg-warning: var(--warning-500);
	--bg-warning: var(--warning-500);
	--fg-critical-faded-disabled: var(--critical-400);
	--bg-disabled-faded: var(--neutral-50);
	--bg-disabled: var(--neutral-50);
	--input-border-default: var(--neutral-200);
	--input-border-hover: var(--neutral-300);
	--input-border-active: var(--primary-500);
}

.dark-screen {
	--tertiary-900: #ffe5df;
	--tertiary-800: #fecabd;
	--tertiary-700: #fdaf9c;
	--tertiary-600: #fb937b;
	--tertiary-500: #fa7859;
	--tertiary-400: #f95d38;
	--tertiary-300: #bb462a;
	--tertiary-200: #7d2f1c;
	--tertiary-100: #3e170e;
	--tertiary-50: #1f0c07;
	--secondary-900: #e5fcff;
	--secondary-800: #c9f8fe;
	--secondary-700: #aef4fd;
	--secondary-600: #92f0fc;
	--secondary-500: #77ecfb;
	--secondary-400: #5be8fa;
	--secondary-300: #44aebc;
	--secondary-200: #2e747d;
	--secondary-100: #173a3f;
	--secondary-50: #0b1d1f;
	--primary-900: #d7e1e7;
	--primary-800: #aec2cd;
	--primary-700: #86a4b4;
	--primary-600: #5d859b;
	--primary-500: #346681;
	--primary-400: #0b4768;
	--primary-300: #08354e;
	--primary-200: #062434;
	--primary-100: #03121a;
	--primary-50: #01090d;
	--positive-900: #ECFDF5;
	--positive-800: #D1FAE5;
	--positive-700: #A7F3D0;
	--positive-600: #6EE7B7;
	--positive-500: #34D399;
	--positive-400: #10B981;
	--positive-300: #059669;
	--positive-200: #047857;
	--positive-100: #065F46;
	--positive-50: #064E3B;
	--positive-950: #024231;
	--warning-950: #FFFBEB;
	--warning-900: #FEF3C7;
	--warning-800: #FDE68A;
	--warning-700: #FCD34D;
	--warning-600: #FBBF24;
	--warning-500: #F59E0B;
	--warning-400: #D97706;
	--warning-300: #B45309;
	--warning-200: #92400E;
	--warning-100: #78350F;
	--warning-50: #451A03;
	--critical-950: #FEF2F2;
	--critical-900: #FEE2E2;
	--critical-800: #FECACA;
	--critical-700: #FCA5A5;
	--critical-600: #F87171;
	--critical-500: #EF4444;
	--critical-400: #DC2626;
	--critical-300: #B91C1C;
	--critical-200: #991B1B;
	--critical-100: #7F1D1D;
	--critical-50: #410606;
	--neutral-999: #FFFFFF;
	--neutral-900: #FAFAFA;
	--neutral-800: #F5F5F5;
	--neutral-700: #E5E5E5;
	--neutral-600: #D4D4D8;
	--neutral-500: #A3A3A3;
	--neutral-400: #737373;
	--neutral-300: #525252;
	--neutral-200: #404040;
	--neutral-100: #262626;
	--neutral-50: #111111;
	--alpha-dark-transparent: #FFFFFF00;
	--alpha-dark-3: #FFFFFF07;
	--alpha-dark-5: #FFFFFF0C;
	--alpha-dark-10: #FFFFFF19;
	--alpha-dark-15: #FFFFFF26;
	--alpha-dark-20: #FFFFFF33;
	--alpha-dark-30: #FFFFFF4C;
	--alpha-dark-50: #FFFFFF7F;
	--alpha-dark-75: #FFFFFFBF;
	--alpha-dark-100: #FFFFFF;
	--alpha-bright-transparent: #12121200;
	--alpha-bright-3: #12121207;
	--alpha-bright-5: #1212120C;
	--alpha-bright-10: #12121219;
	--alpha-bright-15: #12121226;
	--alpha-bright-20: #12121233;
	--alpha-bright-30: #12121259;
	--alpha-bright-50: #1212127F;
	--alpha-bright-75: #121212BF;
	--alpha-bright-100: #121212FF;
}

.dark-screen {
	--bg-primary: var(--alpha-bright-100);
	--bg-secondary: var(--alpha-bright-100);
	--bg-critical: var(--critical-500);
	--fg-critical: var(--critical-500);
	--fg-neutral: var(--alpha-dark-100);
	--fg-neutral-faded: var(--neutral-500);
	--fg-primary: var(--primary-500);
	--fg-primary-disabled: var(--primary-200);
	--fg-primary-hover: var(--primary-600);
	--fg-secondary: var(--tertiary-600);
	--fg-secondary-disabled: var(--tertiary-200);
	--fg-secondary-hover: var(--tertiary-500);
	--bg-neutral: var(--alpha-dark-100);
	--bg-neutral-faded: var(--neutral-100);
	--bg-neutral-faded-disabled: var(--neutral-100);
	--bg-outlined-hover: var(--neutral-100);
	--bg-neutral-faded-hover: var(--neutral-200);
	--fg-disabled: var(--neutral-400);
	--bg-critical-hover: var(--critical-600);
	--bg-critical-disabled: var(--critical-300);
	--bg-critical-faded: var(--critical-50);
	--bg-critical-faded-hover: #var(--critical-50);
	--bg-tag-secondary-faded: var(--secondary-50);
	--bg-tag-secondary: var(--secondary-500);
	--bg-positive: var(--positive-500);
	--bg-positive-faded: var(--positive-50);
	--fg-positive: var(--positive-500);
	--fg-tab-secondary: var(--secondary-500);
	--bg-tertiary: var(--tertiary-500);
	--bg-tertiary-faded: var(--tertiary-50);
	--fg-tertiary: var(--tertiary-500);
	--bg-warning-faded: var(--warning-50);
	--fg-warning: var(--warning-500);
	--bg-warning: var(--warning-500);
	--fg-critical-faded-disabled: var(--critical-400);
	--bg-disabled-faded: var(--neutral-50);
	--bg-disabled: var(--neutral-50);
	--input-border-default: var(--neutral-200);
	--input-border-hover: var(--neutral-300);
	--input-border-active: var(--primary-500);
}