@property --docs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.125rem;
}
@property --Width {
  syntax: "<percentage>";
  inherits: true;
  initial-value: 0%;
}
@property --Red-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFEBEC;
}
@property --Sky-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EBF8FF;
}
@property --bg-sub {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --medium {
  syntax: "<number>";
  inherits: true;
  initial-value: 500;
}
@property --Blue-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EBF1FF;
}
@property --Pink-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFEBF4;
}
@property --Red-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD5D8;
}
@property --Red-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFC0C5;
}
@property --Red-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF97A0;
}
@property --Red-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF6875;
}
@property --Red-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FB3748;
}
@property --Red-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E93544;
}
@property --Red-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #D02533;
}
@property --Red-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #AD1F2B;
}
@property --Red-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #8B1822;
}
@property --Red-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #681219;
}
@property --Sky-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #D5F1FF;
}
@property --Sky-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C0EAFF;
}
@property --Sky-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #97DCFF;
}
@property --Sky-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #68CDFF;
}
@property --Sky-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #47C2FF;
}
@property --Sky-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #35ADE9;
}
@property --Sky-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2597D0;
}
@property --Sky-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F7EAD;
}
@property --Sky-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #18658B;
}
@property --Sky-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #124B68;
}
@property --Teal-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E4FBF8;
}
@property --bg-soft {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --bg-weak {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --label-l {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.125rem;
}
@property --label-m {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1rem;
}
@property --lead-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --regular {
  syntax: "<number>";
  inherits: true;
  initial-value: 400;
}
@property --Blue-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #D5E2FF;
}
@property --Blue-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C0D5FF;
}
@property --Blue-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #97BAFF;
}
@property --Blue-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6895FF;
}
@property --Blue-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #335CFF;
}
@property --Blue-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3559E9;
}
@property --Blue-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2547D0;
}
@property --Blue-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F3BAD;
}
@property --Blue-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #182F8B;
}
@property --Blue-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #122368;
}
@property --Green-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E0FAEC;
}
@property --Pink-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD5EA;
}
@property --Pink-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFC0DF;
}
@property --Pink-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF97CB;
}
@property --Pink-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF68B3;
}
@property --Pink-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FB4BA3;
}
@property --Pink-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E9358F;
}
@property --Pink-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #D0257A;
}
@property --Pink-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #AD1F66;
}
@property --Pink-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #8B1852;
}
@property --Pink-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #68123D;
}
@property --Teal-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #D0FBF5;
}
@property --Teal-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C2F5EE;
}
@property --Teal-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #84EBDD;
}
@property --Teal-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3FDEC9;
}
@property --Teal-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #22D3BB;
}
@property --Teal-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1DAF9C;
}
@property --Teal-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #178C7D;
}
@property --Teal-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1A7569;
}
@property --Teal-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #16645A;
}
@property --Teal-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0B463E;
}
@property --bg-white {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --guest-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --h1-title {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3.5rem;
}
@property --h2-title {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3rem;
}
@property --h3-title {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.5rem;
}
@property --h4-title {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2rem;
}
@property --h5-title {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --h6-title {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.25rem;
}
@property --icon-sub {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --label-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.875rem;
}
@property --label-xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --label-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.75rem;
}
@property --radius-0 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --radius-2 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2px;
}
@property --radius-4 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 4px;
}
@property --radius-6 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 6px;
}
@property --radius-8 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 8px;
}
@property --text-sub {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --Green-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #D0FBE9;
}
@property --Green-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C2F5DA;
}
@property --Green-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #84EBB4;
}
@property --Green-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3EE089;
}
@property --Green-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1FC16B;
}
@property --Green-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1DAF61;
}
@property --Green-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #178C4E;
}
@property --Green-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1A7544;
}
@property --Green-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #16643B;
}
@property --Green-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0B4627;
}
@property --Orange-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFF3EB;
}
@property --Purple-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EFEBFF;
}
@property --Yellow-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFFAEB;
}
@property --bg-strong {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --icon-soft {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --lead-text {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --neutral-0 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFFFFF;
}
@property --radius-10 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 10px;
}
@property --radius-12 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 12px;
}
@property --radius-16 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 16px;
}
@property --radius-20 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 20px;
}
@property --radius-24 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 24px;
}
@property --radius-28 {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 28px;
}
@property --text-soft {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --Orange-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFE6D5;
}
@property --Orange-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD9C0;
}
@property --Orange-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFC197;
}
@property --Orange-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFA468;
}
@property --Orange-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FA7319;
}
@property --Orange-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E16614;
}
@property --Orange-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #CE5E12;
}
@property --Orange-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B75310;
}
@property --Orange-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #96440D;
}
@property --Orange-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #71330A;
}
@property --Purple-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DCD5FF;
}
@property --Purple-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #CAC0FF;
}
@property --Purple-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #A897FF;
}
@property --Purple-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #8C71F6;
}
@property --Purple-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7D52F4;
}
@property --Purple-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #693EE0;
}
@property --Purple-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5B2CC9;
}
@property --Purple-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4C25A7;
}
@property --Purple-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3D1D86;
}
@property --Purple-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #351A75;
}
@property --Yellow-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFEFCC;
}
@property --Yellow-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFECC0;
}
@property --Yellow-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFE097;
}
@property --Yellow-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD268;
}
@property --Yellow-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F6B51E;
}
@property --Yellow-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E6A819;
}
@property --Yellow-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C99A2C;
}
@property --Yellow-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #A78025;
}
@property --Yellow-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #86661D;
}
@property --Yellow-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #624C18;
}
@property --bg-surface {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --error-base {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --error-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --guest-text {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --icon-white {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --neutral-50 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F5F7FA;
}
@property --stroke-sub {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --text-white {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --unknown-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --error-light {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFC0C5;
}
@property --icon-strong {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --neutral-100 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F2F5F8;
}
@property --neutral-200 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E1E4EA;
}
@property --neutral-300 {
  syntax: "<color>";
  inherits: true;
  initial-value: #CACFD8;
}
@property --neutral-400 {
  syntax: "<color>";
  inherits: true;
  initial-value: #99A0AE;
}
@property --neutral-500 {
  syntax: "<color>";
  inherits: true;
  initial-value: #717784;
}
@property --neutral-600 {
  syntax: "<color>";
  inherits: true;
  initial-value: #525866;
}
@property --neutral-700 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2B303B;
}
@property --neutral-800 {
  syntax: "<color>";
  inherits: true;
  initial-value: #222530;
}
@property --neutral-900 {
  syntax: "<color>";
  inherits: true;
  initial-value: #181B25;
}
@property --neutral-950 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0E121B;
}
@property --p1-bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff;
}
@property --p2-bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff;
}
@property --p3-bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff;
}
@property --paragraph-l {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.125rem;
}
@property --paragraph-m {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1rem;
}
@property --preview-url {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --radius-full {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 999px;
}
@property --stroke-soft {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --text-strong {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --non-guest-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --paragraph-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.875rem;
}
@property --paragraph-xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --paragraph-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.75rem;
}
@property --primary-base {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --primary-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --red-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fb37481a;
}
@property --red-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fb374829;
}
@property --red-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fb37483d;
}
@property --sky-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #47c2ff1a;
}
@property --sky-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #47c2ff29;
}
@property --sky-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #47c2ff3d;
}
@property --static-black {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --static-white {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stroke-white {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --subheading-l {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.125rem;
}
@property --subheading-m {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1rem;
}
@property --success-base {
  syntax: "<color>";
  inherits: true;
  initial-value: #1FC16B;
}
@property --success-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: #0B4627;
}
@property --unknown-text {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --warning-base {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --warning-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --blue-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #476cff1a;
}
@property --blue-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #476cff29;
}
@property --blue-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #476cff3d;
}
@property --error-lighter {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --icon-disabled {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --p1-text-color {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff;
}
@property --p2-text-color {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff;
}
@property --p3-text-color {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff;
}
@property --pink-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fb4ba31a;
}
@property --pink-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fb4ba329;
}
@property --pink-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fb4ba33d;
}
@property --shimmer-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stroke-strong {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --subheading-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.875rem;
}
@property --subheading-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.75rem;
}
@property --success-light {
  syntax: "<color>";
  inherits: true;
  initial-value: #1fc16b3d;
}
@property --teal-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #22d3bb1a;
}
@property --teal-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #22d3bb29;
}
@property --teal-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #22d3bb3d;
}
@property --text-disabled {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --warning-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --alphas-alpha-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --away-base-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --away-dark-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --black-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1717171a;
}
@property --black-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #17171729;
}
@property --black-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1717173d;
}
@property --green-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1fc16b1a;
}
@property --green-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1fc16b29;
}
@property --green-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1fc16b3d;
}
@property --non-guest-text {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --primary-darker {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --subheading-2xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1rem;
}
@property --white-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff3d;
}
@property --white-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff29;
}
@property --white-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff3d;
}
@property --alphas-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-40 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-56 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-64 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-72 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-80 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --alphas-alpha-88 {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --away-base-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --away-dark-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --away-light-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: #fbc64b3d;
}
@property --faded-base-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --faded-dark-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --orange-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fa73191a;
}
@property --orange-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fa731929;
}
@property --orange-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fa73193d;
}
@property --purple-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #784def1a;
}
@property --purple-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #784def29;
}
@property --purple-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #784def3d;
}
@property --success-lighter {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --warning-lighter {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --yellow-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fbc64b1a;
}
@property --yellow-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fbc64b29;
}
@property --yellow-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fbc64b3d;
}
@property --away-light-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --faded-base-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --faded-dark-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --faded-light-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --information-base {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --information-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --neutral-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #99a0ae1a;
}
@property --neutral-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: #99a0ae29;
}
@property --neutral-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: #99a0ae3d;
}
@property --primary-alpha-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --primary-alpha-16 {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --primary-alpha-24 {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stable-base-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stable-dark-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --away-lighter-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --faded-light-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --feature-base-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --feature-dark-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --information-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stable-base-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stable-dark-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stable-light-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --away-lighter-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --faded-lighter-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --feature-base-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --feature-dark-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --feature-light-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stable-light-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --verified-base-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --verified-dark-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --backgrounds-bg-base {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --borders-border-base {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 90%);
}
@property --faded-lighter-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --feature-light-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --foregrounds-fg-base {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --information-lighter {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --stable-lighter-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --template-card-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --verified-base-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --verified-dark-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --verified-light-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --backgrounds-bg-field {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 98%);
}
@property --borders-border-error {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(347 77% 50%);
}
@property --feature-lighter-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --foregrounds-fg-error {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(347 77% 50%);
}
@property --foregrounds-fg-muted {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 4% 46%);
}
@property --stable-lighter-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --tag-blue-tag-blue-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(214 95% 93%);
}
@property --tag-error-tag-red-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(356 100% 95%);
}
@property --verified-light-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --backgrounds-bg-subtle {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 98%);
}
@property --borders-border-danger {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(345 83% 41%);
}
@property --borders-border-strong {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 84%);
}
@property --buttons-button-danger {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(347 77% 50%);
}
@property --feature-lighter-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --foregrounds-fg-subtle {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 34%);
}
@property --highlighted-base-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --highlighted-dark-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --verified-lighter-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --backgrounds-bg-overlay {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --buttons-button-neutral {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --highlighted-base-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --highlighted-dark-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --highlighted-light-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --tag-blue-tag-blue-icon {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(217 91% 60%);
}
@property --tag-blue-tag-blue-text {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(226 71% 40%);
}
@property --tag-error-tag-red-icon {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(350 89% 60%);
}
@property --tag-error-tag-red-text {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(343 80% 35%);
}
@property --verified-lighter-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --backgrounds-bg-disabled {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 96%);
}
@property --borders-border-menu-bot {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --borders-border-menu-top {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 90%);
}
@property --buttons-button-inverted {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 4% 16%);
}
@property --foregrounds-fg-disabled {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 65%);
}
@property --foregrounds-fg-on-color {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --highlighted-light-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --backgrounds-bg-component {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 98%);
}
@property --backgrounds-bg-highlight {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(214 100% 97%);
}
@property --button-transparent-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --effects-buttons-inverted {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --highlighted-lighter-dark {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --tag-blue-tag-blue-border {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(212 96% 78%);
}
@property --tag-error-tag-red-border {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(353 96% 82%);
}
@property --tag-purple-tag-purple-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(251 91% 95%);
}
@property --tag-success-tag-green-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(149 80% 90%);
}
@property --backgrounds-bg-base-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 96%);
}
@property --backgrounds-bg-switch-off {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 90%);
}
@property --contrast-contrast-bg-base {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 4% 14%);
}
@property --highlighted-lighter-light {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --tag-warning-tag-orange-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(34 100% 92%);
}
@property --backgrounds-bg-field-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 96%);
}
@property --backgrounds-bg-interactive {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(217 91% 60%);
}
@property --borders-border-interactive {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(217 91% 60%);
}
@property --borders-border-transparent {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --buttons-button-transparent {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --foregrounds-fg-interactive {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(221 83% 53%);
}
@property --foregrounds-fg-on-inverted {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --tag-blue-tag-blue-bg-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(213 97% 87%);
}
@property --tag-error-tag-red-bg-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(353 96% 90%);
}
@property --tag-neutral-tag-neutral-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 96%);
}
@property --tag-purple-tag-purple-icon {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(258 90% 66%);
}
@property --tag-purple-tag-purple-text {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(263 69% 42%);
}
@property --tag-success-tag-green-icon {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(160 84% 39%);
}
@property --tag-success-tag-green-text {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(163 88% 20%);
}
@property --backgrounds-bg-base-pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 90%);
}
@property --backgrounds-bg-subtle-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 96%);
}
@property --buttons-button-danger-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(345 83% 41%);
}
@property --contrast-contrast-bg-subtle {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 4% 16%);
}
@property --tag-warning-tag-orange-icon {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(25 95% 53%);
}
@property --tag-warning-tag-orange-text {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(15 79% 34%);
}
@property --buttons-button-neutral-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 96%);
}
@property --contrast-contrast-border-bot {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --contrast-contrast-border-top {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --contrast-contrast-fg-primary {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --tag-neutral-tag-neutral-icon {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 4% 46%);
}
@property --tag-neutral-tag-neutral-text {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 34%);
}
@property --tag-purple-tag-purple-border {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(252 95% 85%);
}
@property --tag-success-tag-green-border {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(156 72% 67%);
}
@property --backgrounds-bg-subtle-pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 90%);
}
@property --buttons-button-danger-pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(343 80% 35%);
}
@property --buttons-button-inverted-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 26%);
}
@property --contrast-contrast-border-base {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --tag-warning-tag-orange-border {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(31 97% 72%);
}
@property --backgrounds-bg-component-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 96%);
}
@property --backgrounds-bg-field-component {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --backgrounds-bg-highlight-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(214 95% 93%);
}
@property --buttons-button-neutral-pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 90%);
}
@property --contrast-contrast-fg-secondary {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 100%);
}
@property --tag-neutral-tag-neutral-border {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 84%);
}
@property --tag-purple-tag-purple-bg-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(251 95% 92%);
}
@property --tag-success-tag-green-bg-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(152 76% 80%);
}
@property --backgrounds-bg-switch-off-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 84%);
}
@property --buttons-button-inverted-pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 34%);
}
@property --contrast-contrast-bg-base-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 4% 16%);
}
@property --tag-warning-tag-orange-bg-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(32 98% 83%);
}
@property --backgrounds-bg-component-pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 90%);
}
@property --buttons-button-transparent-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --foregrounds-fg-interactive-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(217 91% 60%);
}
@property --tag-neutral-tag-neutral-bg-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 90%);
}
@property --contrast-contrast-bg-base-pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 5% 26%);
}
@property --buttons-button-transparent-pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(240 6% 10%);
}
@property --backgrounds-bg-field-component-hover {
  syntax: "<color>";
  inherits: true;
  initial-value: hsl(0 0% 98%);
}

  :host, :root {
  --docs: 1.125rem;
  --Red-50: #FFEBEC;
  --Sky-50: #EBF8FF;
  --bg-sub: var(--neutral-300, #CACFD8);
  --medium: 500;
  --Blue-50: #EBF1FF;
  --Pink-50: #FFEBF4;
  --Red-100: #FFD5D8;
  --Red-200: #FFC0C5;
  --Red-300: #FF97A0;
  --Red-400: #FF6875;
  --Red-500: #FB3748;
  --Red-600: #E93544;
  --Red-700: #D02533;
  --Red-800: #AD1F2B;
  --Red-900: #8B1822;
  --Red-950: #681219;
  --Sky-100: #D5F1FF;
  --Sky-200: #C0EAFF;
  --Sky-300: #97DCFF;
  --Sky-400: #68CDFF;
  --Sky-500: #47C2FF;
  --Sky-600: #35ADE9;
  --Sky-700: #2597D0;
  --Sky-800: #1F7EAD;
  --Sky-900: #18658B;
  --Sky-950: #124B68;
  --Teal-50: #E4FBF8;
  --bg-soft: var(--neutral-200, #E1E4EA);
  --bg-weak: var(--neutral-50, #F5F7FA);
  --label-l: 1.125rem;
  --label-m: 1rem;
  --lead-bg: #335CFF;
  --regular: 400;
  --Blue-100: #D5E2FF;
  --Blue-200: #C0D5FF;
  --Blue-300: #97BAFF;
  --Blue-400: #6895FF;
  --Blue-500: #335CFF;
  --Blue-600: #3559E9;
  --Blue-700: #2547D0;
  --Blue-800: #1F3BAD;
  --Blue-900: #182F8B;
  --Blue-950: #122368;
  --Green-50: #E0FAEC;
  --Pink-100: #FFD5EA;
  --Pink-200: #FFC0DF;
  --Pink-300: #FF97CB;
  --Pink-400: #FF68B3;
  --Pink-500: #FB4BA3;
  --Pink-600: #E9358F;
  --Pink-700: #D0257A;
  --Pink-800: #AD1F66;
  --Pink-900: #8B1852;
  --Pink-950: #68123D;
  --Teal-100: #D0FBF5;
  --Teal-200: #C2F5EE;
  --Teal-300: #84EBDD;
  --Teal-400: #3FDEC9;
  --Teal-500: #22D3BB;
  --Teal-600: #1DAF9C;
  --Teal-700: #178C7D;
  --Teal-800: #1A7569;
  --Teal-900: #16645A;
  --Teal-950: #0B463E;
  --bg-white: var(--neutral-0, #FFFFFF);
  --guest-bg: #E4FBF8;
  --h1-title: 3.5rem;
  --h2-title: 3rem;
  --h3-title: 2.5rem;
  --h4-title: 2rem;
  --h5-title: 1.5rem;
  --h6-title: 1.25rem;
  --icon-sub: var(--neutral-600, #2B303B);
  --label-sm: 0.875rem;
  --label-xl: 1.5rem;
  --label-xs: 0.75rem;
  --radius-0: 0px;
  --radius-2: 2px;
  --radius-4: 4px;
  --radius-6: 6px;
  --radius-8: 8px;
  --text-sub: var(--neutral-600, #2B303B);
  --Green-100: #D0FBE9;
  --Green-200: #C2F5DA;
  --Green-300: #84EBB4;
  --Green-400: #3EE089;
  --Green-500: #1FC16B;
  --Green-600: #1DAF61;
  --Green-700: #178C4E;
  --Green-800: #1A7544;
  --Green-900: #16643B;
  --Green-950: #0B4627;
  --Orange-50: #FFF3EB;
  --Purple-50: #EFEBFF;
  --Yellow-50: #FFFAEB;
  --bg-strong: var(--neutral-950, #0E121B);
  --icon-soft: var(--neutral-400, #99A0AE);
  --lead-text: #335CFF;
  --neutral-0: #FFFFFF;
  --radius-10: 10px;
  --radius-12: 12px;
  --radius-16: 16px;
  --radius-20: 20px;
  --radius-24: 24px;
  --radius-28: 28px;
  --text-soft: var(--neutral-400, #99A0AE);
  --Orange-100: #FFE6D5;
  --Orange-200: #FFD9C0;
  --Orange-300: #FFC197;
  --Orange-400: #FFA468;
  --Orange-500: #FA7319;
  --Orange-600: #E16614;
  --Orange-700: #CE5E12;
  --Orange-800: #B75310;
  --Orange-900: #96440D;
  --Orange-950: #71330A;
  --Purple-100: #DCD5FF;
  --Purple-200: #CAC0FF;
  --Purple-300: #A897FF;
  --Purple-400: #8C71F6;
  --Purple-500: #7D52F4;
  --Purple-600: #693EE0;
  --Purple-700: #5B2CC9;
  --Purple-800: #4C25A7;
  --Purple-900: #3D1D86;
  --Purple-950: #351A75;
  --Yellow-100: #FFEFCC;
  --Yellow-200: #FFECC0;
  --Yellow-300: #FFE097;
  --Yellow-400: #FFD268;
  --Yellow-500: #F6B51E;
  --Yellow-600: #E6A819;
  --Yellow-700: #C99A2C;
  --Yellow-800: #A78025;
  --Yellow-900: #86661D;
  --Yellow-950: #624C18;
  --bg-surface: var(--neutral-800, #222530);
  --error-base: var(--Red-500, #FB3748);
  --error-dark: var(--Red-950, #681219);
  --guest-text: #22D3BB;
  --icon-white: var(--neutral-0, #FFFFFF);
  --neutral-50: #F5F7FA;
  --stroke-sub: var(--neutral-300, #CACFD8);
  --text-white: var(--neutral-0, #FFFFFF);
  --unknown-bg: #F5F5F5;
  --error-light: var(--Red-200);
  --icon-strong: var(--neutral-950, #0E121B);
  --neutral-100: #F2F5F8;
  --neutral-200: #E1E4EA;
  --neutral-300: #CACFD8;
  --neutral-400: #99A0AE;
  --neutral-500: #717784;
  --neutral-600: #525866;
  --neutral-700: #2B303B;
  --neutral-800: #222530;
  --neutral-900: #181B25;
  --neutral-950: #0E121B;
  --p1-bg-color: #FFEBEC;
  --p2-bg-color: #FFF3EB;
  --p3-bg-color: #EBF1FF;
  --paragraph-l: 1.125rem;
  --paragraph-m: 1rem;
  --radius-full: 999px;
  --stroke-soft: var(--neutral-200, #E1E4EA);
  --text-strong: var(--neutral-950, #0E121B);
  --non-guest-bg: #FFEBF4;
  --paragraph-sm: 0.875rem;
  --paragraph-xl: 1.5rem;
  --paragraph-xs: 0.75rem;
  --primary-base: var(--Pink-500, #FB4BA3);
  --primary-dark: var(--Pink-800, #AD1F66);
  --red-alpha-10: #fb37481a;
  --red-alpha-16: #fb374829;
  --red-alpha-24: #fb37483d;
  --sky-alpha-10: #47c2ff1a;
  --sky-alpha-16: #47c2ff29;
  --sky-alpha-24: #47c2ff3d;
  --static-black: var(--neutral-950, #0E121B);
  --static-white: var(--neutral-0, #FFFFFF);
  --stroke-white: var(--neutral-0, #FFFFFF);
  --subheading-l: 1.125rem;
  --subheading-m: 1rem;
  --success-base: var(--Green-500);
  --success-dark: var(--Green-950);
  --unknown-text: #7B7B7B;
  --warning-base: var(--Orange-500, #FA7319);
  --warning-dark: var(--Orange-950, #71330A);
  --blue-alpha-10: #476cff1a;
  --blue-alpha-16: #476cff29;
  --blue-alpha-24: #476cff3d;
  --error-lighter: var(--Red-50, #FFEBEC);
  --icon-disabled: var(--neutral-300, #CACFD8);
  --p1-text-color: #FB3748;
  --p2-text-color: #FA7319;
  --p3-text-color: #335CFF;
  --pink-alpha-10: #fb4ba31a;
  --pink-alpha-16: #fb4ba329;
  --pink-alpha-24: #fb4ba33d;
  --shimmer-color: #eaebeb85;
  --stroke-strong: var(--neutral-950, #0E121B);
  --subheading-sm: 0.875rem;
  --subheading-xs: 0.75rem;
  --success-light: var(--green-alpha-24);
  --teal-alpha-10: #22d3bb1a;
  --teal-alpha-16: #22d3bb29;
  --teal-alpha-24: #22d3bb3d;
  --text-disabled: var(--neutral-300, #CACFD8);
  --warning-light: var(--Orange-200, #FFD9C0);
  --alphas-alpha-2: hsl(240 6% 10%);
  --alphas-alpha-4: hsl(240 6% 10%);
  --alphas-alpha-6: hsl(240 6% 10%);
  --alphas-alpha-8: hsl(240 6% 10%);
  --away-base-dark: var(--Yellow-600, #E6A819);
  --away-dark-dark: var(--Yellow-400, #FFD268);
  --black-alpha-10: #1717171a;
  --black-alpha-16: #17171729;
  --black-alpha-24: #1717173d;
  --green-alpha-10: #1fc16b1a;
  --green-alpha-16: #1fc16b29;
  --green-alpha-24: #1fc16b3d;
  --non-guest-text: #FB4BA3;
  --primary-darker: var(--Pink-700, #D0257A);
  --subheading-2xs: 1rem;
  --white-alpha-10: #ffffff3d;
  --white-alpha-16: #ffffff29;
  --white-alpha-24: #ffffff3d;
  --alphas-alpha-10: hsl(240 6% 10%);
  --alphas-alpha-12: hsl(240 6% 10%);
  --alphas-alpha-16: hsl(240 6% 10%);
  --alphas-alpha-24: hsl(240 6% 10%);
  --alphas-alpha-40: hsl(240 6% 10%);
  --alphas-alpha-56: hsl(240 6% 10%);
  --alphas-alpha-64: hsl(240 6% 10%);
  --alphas-alpha-72: hsl(240 6% 10%);
  --alphas-alpha-80: hsl(240 6% 10%);
  --alphas-alpha-88: hsl(240 6% 10%);
  --away-base-light: var(--Yellow-500, #F6B51E);
  --away-dark-light: var(--Yellow-950, #624C18);
  --away-light-dark: var(--yellow-alpha-24);
  --faded-base-dark: var(--neutral-500, #717784);
  --faded-dark-dark: var(--neutral-300, #CACFD8);
  --orange-alpha-10: #fa73191a;
  --orange-alpha-16: #fa731929;
  --orange-alpha-24: #fa73193d;
  --purple-alpha-10: #784def1a;
  --purple-alpha-16: #784def29;
  --purple-alpha-24: #784def3d;
  --success-lighter: var(--Green-50, #E0FAEC);
  --warning-lighter: var(--Orange-50, #FFF3EB);
  --yellow-alpha-10: #fbc64b1a;
  --yellow-alpha-16: #fbc64b29;
  --yellow-alpha-24: #fbc64b3d;
  --away-light-light: var(--Yellow-200, #FFECC0);
  --faded-base-light: var(--neutral-500, #717784);
  --faded-dark-light: var(--neutral-800, #222530);
  --faded-light-dark: var(--neutral-alpha-24, #99a0ae3d);
  --information-base: var(--Blue-500, #335CFF);
  --information-dark: var(--Blue-400, #6895FF);
  --neutral-alpha-10: #99a0ae1a;
  --neutral-alpha-16: #99a0ae29;
  --neutral-alpha-24: #99a0ae3d;
  --primary-alpha-10: var(--pink-alpha-10, #fb4ba31a);
  --primary-alpha-16: var(--pink-alpha-16, #fb4ba329);
  --primary-alpha-24: var(--pink-alpha-24, #fb4ba33d);
  --stable-base-dark: var(--Teal-600, #1DAF9C);
  --stable-dark-dark: var(--Teal-400, #3FDEC9);
  --away-lighter-dark: var(--yellow-alpha-16, #fbc64b29);
  --faded-light-light: var(--neutral-200, #E1E4EA);
  --feature-base-dark: var(--Purple-500, #7D52F4);
  --feature-dark-dark: var(--Purple-400, #8C71F6);
  --information-light: var(--Blue-200, #C0D5FF);
  --stable-base-light: var(--Teal-500, #22D3BB);
  --stable-dark-light: var(--Teal-950, #0B463E);
  --stable-light-dark: var(--teal-alpha-24, #22d3bb3d);
  --away-lighter-light: var(--Yellow-50, #FFFAEB);
  --faded-lighter-dark: var(--neutral-alpha-16, #99a0ae29);
  --feature-base-light: var(--Purple-500, #7D52F4);
  --feature-dark-light: var(--Purple-950, #351A75);
  --feature-light-dark: var(--purple-alpha-24, #784def3d);
  --stable-light-light: var(--Teal-200, #C2F5EE);
  --verified-base-dark: var(--Sky-600, #35ADE9);
  --verified-dark-dark: var(--Sky-400, #68CDFF);
  --backgrounds-bg-base: hsl(0 0% 100%);
  --borders-border-base: #E4E4E7;
  --faded-lighter-light: var(--neutral-100, #F2F5F8);
  --feature-light-light: var(--Purple-200, #CAC0FF);
  --foregrounds-fg-base: hsl(240 6% 10%);
  --information-lighter: var(--Blue-50, #EBF1FF);
  --stable-lighter-dark: var(--teal-alpha-16, #22d3bb29);
  --template-card-hover: #0000000d;
  --verified-base-light: var(--Sky-500, #47C2FF);
  --verified-dark-light: var(--Sky-950, #124B68);
  --verified-light-dark: var(--sky-alpha-24, #47c2ff3d);
  --backgrounds-bg-field: hsl(0 0% 98%);
  --borders-border-error: hsl(347 77% 50%);
  --feature-lighter-dark: var(--purple-alpha-16, #784def29);
  --foregrounds-fg-error: hsl(347 77% 50%);
  --foregrounds-fg-muted: hsl(240 4% 46%);
  --stable-lighter-light: var(--Teal-50, #E4FBF8);
  --tag-blue-tag-blue-bg: hsl(214 95% 93%);
  --tag-error-tag-red-bg: hsl(356 100% 95%);
  --verified-light-light: var(--Sky-200, #C0EAFF);
  --backgrounds-bg-subtle: hsl(0 0% 98%);
  --borders-border-danger: hsl(345 83% 41%);
  --borders-border-strong: hsl(240 5% 84%);
  --buttons-button-danger: hsl(347 77% 50%);
  --feature-lighter-light: var(--Purple-50, #EFEBFF);
  --foregrounds-fg-subtle: hsl(240 5% 34%);
  --highlighted-base-dark: var(--Pink-600, #E9358F);
  --highlighted-dark-dark: var(--Pink-400, #FF68B3);
  --verified-lighter-dark: var(--sky-alpha-16, #47c2ff29);
  --backgrounds-bg-overlay: hsl(240 6% 10%);
  --buttons-button-neutral: hsl(0 0% 100%);
  --highlighted-base-light: var(--Pink-500, #FB4BA3);
  --highlighted-dark-light: var(--Pink-950, #68123D);
  --highlighted-light-dark: var(--pink-alpha-24, #fb4ba33d);
  --tag-blue-tag-blue-icon: hsl(217 91% 60%);
  --tag-blue-tag-blue-text: hsl(226 71% 40%);
  --tag-error-tag-red-icon: hsl(350 89% 60%);
  --tag-error-tag-red-text: hsl(343 80% 35%);
  --verified-lighter-light: var(--Sky-50, #EBF8FF);
  --backgrounds-bg-disabled: hsl(240 5% 96%);
  --borders-border-menu-bot: hsl(0 0% 100%);
  --borders-border-menu-top: hsl(240 6% 90%);
  --buttons-button-inverted: hsl(240 4% 16%);
  --foregrounds-fg-disabled: hsl(240 5% 65%);
  --foregrounds-fg-on-color: hsl(0 0% 100%);
  --highlighted-light-light: var(--Pink-200, #FFC0DF);
  --backgrounds-bg-component: hsl(0 0% 98%);
  --backgrounds-bg-highlight: hsl(214 100% 97%);
  --button-transparent-hover: rgba(24, 24, 27, 0.06);
  --effects-buttons-inverted: 0 0.75px 0 0 rgba(255, 255, 255, 0.20) inset, 0 1px 2px 0 rgba(0, 0, 0, 0.40), 0 0 0 1px #18181B;
  --highlighted-lighter-dark: var(--pink-alpha-16, #fb4ba329);
  --tag-blue-tag-blue-border: hsl(212 96% 78%);
  --tag-error-tag-red-border: hsl(353 96% 82%);
  --tag-purple-tag-purple-bg: hsl(251 91% 95%);
  --tag-success-tag-green-bg: hsl(149 80% 90%);
  --backgrounds-bg-base-hover: hsl(240 5% 96%);
  --backgrounds-bg-switch-off: hsl(240 6% 90%);
  --contrast-contrast-bg-base: hsl(240 4% 14%);
  --highlighted-lighter-light: var(--Pink-50, #FFEBF4);
  --tag-warning-tag-orange-bg: hsl(34 100% 92%);
  --backgrounds-bg-field-hover: hsl(240 5% 96%);
  --backgrounds-bg-interactive: hsl(217 91% 60%);
  --borders-border-interactive: hsl(217 91% 60%);
  --borders-border-transparent: hsl(0 0% 100%);
  --buttons-button-transparent: hsl(0 0% 100%);
  --foregrounds-fg-interactive: hsl(221 83% 53%);
  --foregrounds-fg-on-inverted: hsl(0 0% 100%);
  --tag-blue-tag-blue-bg-hover: hsl(213 97% 87%);
  --tag-error-tag-red-bg-hover: hsl(353 96% 90%);
  --tag-neutral-tag-neutral-bg: hsl(240 5% 96%);
  --tag-purple-tag-purple-icon: hsl(258 90% 66%);
  --tag-purple-tag-purple-text: hsl(263 69% 42%);
  --tag-success-tag-green-icon: hsl(160 84% 39%);
  --tag-success-tag-green-text: hsl(163 88% 20%);
  --backgrounds-bg-base-pressed: hsl(240 6% 90%);
  --backgrounds-bg-subtle-hover: hsl(240 5% 96%);
  --buttons-button-danger-hover: hsl(345 83% 41%);
  --contrast-contrast-bg-subtle: hsl(240 4% 16%);
  --tag-warning-tag-orange-icon: hsl(25 95% 53%);
  --tag-warning-tag-orange-text: hsl(15 79% 34%);
  --buttons-button-neutral-hover: hsl(240 5% 96%);
  --contrast-contrast-border-bot: hsl(0 0% 100%);
  --contrast-contrast-border-top: hsl(240 6% 10%);
  --contrast-contrast-fg-primary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-icon: hsl(240 4% 46%);
  --tag-neutral-tag-neutral-text: hsl(240 5% 34%);
  --tag-purple-tag-purple-border: hsl(252 95% 85%);
  --tag-success-tag-green-border: hsl(156 72% 67%);
  --backgrounds-bg-subtle-pressed: hsl(240 6% 90%);
  --buttons-button-danger-pressed: hsl(343 80% 35%);
  --buttons-button-inverted-hover: hsl(240 5% 26%);
  --contrast-contrast-border-base: hsl(0 0% 100%);
  --tag-warning-tag-orange-border: hsl(31 97% 72%);
  --backgrounds-bg-component-hover: hsl(240 5% 96%);
  --backgrounds-bg-field-component: hsl(0 0% 100%);
  --backgrounds-bg-highlight-hover: hsl(214 95% 93%);
  --buttons-button-neutral-pressed: hsl(240 6% 90%);
  --contrast-contrast-fg-secondary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-border: hsl(240 5% 84%);
  --tag-purple-tag-purple-bg-hover: hsl(251 95% 92%);
  --tag-success-tag-green-bg-hover: hsl(152 76% 80%);
  --backgrounds-bg-switch-off-hover: hsl(240 5% 84%);
  --buttons-button-inverted-pressed: hsl(240 5% 34%);
  --contrast-contrast-bg-base-hover: hsl(240 4% 16%);
  --tag-warning-tag-orange-bg-hover: hsl(32 98% 83%);
  --backgrounds-bg-component-pressed: hsl(240 6% 90%);
  --buttons-button-transparent-hover: hsl(240 6% 10%);
  --foregrounds-fg-interactive-hover: hsl(217 91% 60%);
  --tag-neutral-tag-neutral-bg-hover: hsl(240 6% 90%);
  --contrast-contrast-bg-base-pressed: hsl(240 5% 26%);
  --buttons-button-transparent-pressed: hsl(240 6% 10%);
  --backgrounds-bg-field-component-hover: hsl(0 0% 98%);
}
  @media (prefers-color-scheme: dark) {
      :host, :root {
  --lead-bg: #476cff29;
  --guest-bg: #22d3bb29;
  --lead-text: #EBF1FF;
  --guest-text: #1DAF9C;
  --unknown-bg: #99a0ae29;
  --p1-bg-color: #fb374829;
  --p2-bg-color: #fa731929;
  --p3-bg-color: #476cff29;
  --non-guest-bg: #fb4ba329;
  --unknown-text: #7B7B7B;
  --p1-text-color: #FB3748;
  --p2-text-color: #E16614;
  --p3-text-color: #335CFF;
  --shimmer-color: #333333;
  --alphas-alpha-2: hsl(0 0% 100%);
  --alphas-alpha-4: hsl(0 0% 100%);
  --alphas-alpha-6: hsl(0 0% 100%);
  --alphas-alpha-8: hsl(0 0% 100%);
  --non-guest-text: #E9358F;
  --alphas-alpha-10: hsl(0 0% 100%);
  --alphas-alpha-12: hsl(0 0% 100%);
  --alphas-alpha-16: hsl(0 0% 100%);
  --alphas-alpha-24: hsl(0 0% 100%);
  --alphas-alpha-40: hsl(0 0% 100%);
  --alphas-alpha-56: hsl(0 0% 100%);
  --alphas-alpha-64: hsl(0 0% 100%);
  --alphas-alpha-72: hsl(0 0% 100%);
  --alphas-alpha-80: hsl(0 0% 100%);
  --alphas-alpha-88: hsl(0 0% 100%);
  --backgrounds-bg-base: hsl(240 4% 14%);
  --borders-border-base: #ffffff1a;
  --foregrounds-fg-base: hsl(240 5% 96%);
  --template-card-hover: #ffffff0d;
  --backgrounds-bg-field: hsl(0 0% 100%);
  --borders-border-error: hsl(351 95% 71%);
  --foregrounds-fg-error: hsl(351 95% 71%);
  --foregrounds-fg-muted: hsl(240 4% 46%);
  --tag-blue-tag-blue-bg: hsl(226 57% 21%);
  --tag-error-tag-red-bg: hsl(343 88% 16%);
  --backgrounds-bg-subtle: hsl(240 6% 10%);
  --borders-border-danger: hsl(345 83% 41%);
  --borders-border-strong: hsl(0 0% 100%);
  --buttons-button-danger: hsl(343 80% 35%);
  --foregrounds-fg-subtle: hsl(240 5% 65%);
  --backgrounds-bg-overlay: hsl(240 6% 10%);
  --buttons-button-neutral: hsl(0 0% 100%);
  --tag-blue-tag-blue-icon: hsl(213 94% 68%);
  --tag-blue-tag-blue-text: hsl(212 96% 78%);
  --tag-error-tag-red-icon: hsl(351 95% 71%);
  --tag-error-tag-red-text: hsl(353 96% 82%);
  --backgrounds-bg-disabled: hsl(240 4% 16%);
  --borders-border-menu-bot: hsl(0 0% 100%);
  --borders-border-menu-top: hsl(240 4% 14%);
  --buttons-button-inverted: hsl(240 5% 34%);
  --foregrounds-fg-disabled: hsl(240 5% 34%);
  --foregrounds-fg-on-color: hsl(0 0% 100%);
  --backgrounds-bg-component: hsl(240 4% 16%);
  --backgrounds-bg-highlight: hsl(226 57% 21%);
  --button-transparent-hover: rgba(255, 255, 255, 0.08);
  --effects-buttons-inverted: 0 -1px 0 0 rgba(255, 255, 255, 0.12), 0 0 0 1px rgba(255, 255, 255, 0.10), 0 0 0 1px #52525B, 0 0 1px 1.5px rgba(0, 0, 0, 0.24), 0 2px 2px 0 rgba(0, 0, 0, 0.24);
  --tag-blue-tag-blue-border: hsl(224 64% 33%);
  --tag-error-tag-red-border: hsl(342 75% 30%);
  --tag-purple-tag-purple-bg: hsl(261 73% 23%);
  --tag-success-tag-green-bg: hsl(166 91% 9%);
  --backgrounds-bg-base-hover: hsl(240 4% 16%);
  --backgrounds-bg-switch-off: hsl(240 5% 26%);
  --contrast-contrast-bg-base: hsl(240 4% 16%);
  --tag-warning-tag-orange-bg: hsl(13 81% 15%);
  --backgrounds-bg-field-hover: hsl(0 0% 100%);
  --backgrounds-bg-interactive: hsl(213 94% 68%);
  --borders-border-interactive: hsl(213 94% 68%);
  --borders-border-transparent: hsl(0 0% 100%);
  --buttons-button-transparent: hsl(0 0% 100%);
  --foregrounds-fg-interactive: hsl(213 94% 68%);
  --foregrounds-fg-on-inverted: hsl(240 6% 10%);
  --tag-blue-tag-blue-bg-hover: hsl(224 64% 33%);
  --tag-error-tag-red-bg-hover: hsl(342 75% 30%);
  --tag-neutral-tag-neutral-bg: hsl(240 5% 26%);
  --tag-purple-tag-purple-icon: hsl(255 92% 76%);
  --tag-purple-tag-purple-text: hsl(252 95% 85%);
  --tag-success-tag-green-icon: hsl(160 84% 39%);
  --tag-success-tag-green-text: hsl(158 64% 52%);
  --backgrounds-bg-base-pressed: hsl(240 5% 26%);
  --backgrounds-bg-subtle-hover: hsl(240 4% 14%);
  --buttons-button-danger-hover: hsl(345 83% 41%);
  --contrast-contrast-bg-subtle: hsl(0 0% 100%);
  --tag-warning-tag-orange-icon: hsl(27 96% 61%);
  --tag-warning-tag-orange-text: hsl(31 97% 72%);
  --buttons-button-neutral-hover: hsl(0 0% 100%);
  --contrast-contrast-border-bot: hsl(0 0% 100%);
  --contrast-contrast-border-top: hsl(240 4% 14%);
  --contrast-contrast-fg-primary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-icon: hsl(240 5% 65%);
  --tag-neutral-tag-neutral-text: hsl(240 5% 84%);
  --tag-purple-tag-purple-border: hsl(263 69% 42%);
  --tag-success-tag-green-border: hsl(164 86% 16%);
  --backgrounds-bg-subtle-pressed: hsl(240 4% 16%);
  --buttons-button-danger-pressed: hsl(347 77% 50%);
  --buttons-button-inverted-hover: hsl(240 4% 46%);
  --contrast-contrast-border-base: hsl(0 0% 100%);
  --tag-warning-tag-orange-border: hsl(15 75% 28%);
  --backgrounds-bg-component-hover: hsl(0 0% 100%);
  --backgrounds-bg-field-component: hsl(240 4% 14%);
  --backgrounds-bg-highlight-hover: hsl(224 64% 33%);
  --buttons-button-neutral-pressed: hsl(0 0% 100%);
  --contrast-contrast-fg-secondary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-border: hsl(0 0% 100%);
  --tag-purple-tag-purple-bg-hover: hsl(263 69% 42%);
  --tag-success-tag-green-bg-hover: hsl(164 86% 16%);
  --backgrounds-bg-switch-off-hover: hsl(240 5% 34%);
  --buttons-button-inverted-pressed: hsl(240 5% 65%);
  --contrast-contrast-bg-base-hover: hsl(0 0% 100%);
  --tag-warning-tag-orange-bg-hover: hsl(15 75% 28%);
  --backgrounds-bg-component-pressed: hsl(0 0% 100%);
  --buttons-button-transparent-hover: hsl(0 0% 100%);
  --foregrounds-fg-interactive-hover: hsl(212 96% 78%);
  --tag-neutral-tag-neutral-bg-hover: hsl(240 5% 34%);
  --contrast-contrast-bg-base-pressed: hsl(0 0% 100%);
  --buttons-button-transparent-pressed: hsl(0 0% 100%);
  --backgrounds-bg-field-component-hover: hsl(240 4% 16%);
}
    }
  @media (prefers-color-scheme: light) {
      :host, :root {
  --docs: 1.125rem;
  --Red-50: #FFEBEC;
  --Sky-50: #EBF8FF;
  --bg-sub: var(--neutral-300, #CACFD8);
  --medium: 500;
  --Blue-50: #EBF1FF;
  --Pink-50: #FFEBF4;
  --Red-100: #FFD5D8;
  --Red-200: #FFC0C5;
  --Red-300: #FF97A0;
  --Red-400: #FF6875;
  --Red-500: #FB3748;
  --Red-600: #E93544;
  --Red-700: #D02533;
  --Red-800: #AD1F2B;
  --Red-900: #8B1822;
  --Red-950: #681219;
  --Sky-100: #D5F1FF;
  --Sky-200: #C0EAFF;
  --Sky-300: #97DCFF;
  --Sky-400: #68CDFF;
  --Sky-500: #47C2FF;
  --Sky-600: #35ADE9;
  --Sky-700: #2597D0;
  --Sky-800: #1F7EAD;
  --Sky-900: #18658B;
  --Sky-950: #124B68;
  --Teal-50: #E4FBF8;
  --bg-soft: var(--neutral-200, #E1E4EA);
  --bg-weak: var(--neutral-50, #F5F7FA);
  --label-l: 1.125rem;
  --label-m: 1rem;
  --lead-bg: #335CFF;
  --regular: 400;
  --Blue-100: #D5E2FF;
  --Blue-200: #C0D5FF;
  --Blue-300: #97BAFF;
  --Blue-400: #6895FF;
  --Blue-500: #335CFF;
  --Blue-600: #3559E9;
  --Blue-700: #2547D0;
  --Blue-800: #1F3BAD;
  --Blue-900: #182F8B;
  --Blue-950: #122368;
  --Green-50: #E0FAEC;
  --Pink-100: #FFD5EA;
  --Pink-200: #FFC0DF;
  --Pink-300: #FF97CB;
  --Pink-400: #FF68B3;
  --Pink-500: #FB4BA3;
  --Pink-600: #E9358F;
  --Pink-700: #D0257A;
  --Pink-800: #AD1F66;
  --Pink-900: #8B1852;
  --Pink-950: #68123D;
  --Teal-100: #D0FBF5;
  --Teal-200: #C2F5EE;
  --Teal-300: #84EBDD;
  --Teal-400: #3FDEC9;
  --Teal-500: #22D3BB;
  --Teal-600: #1DAF9C;
  --Teal-700: #178C7D;
  --Teal-800: #1A7569;
  --Teal-900: #16645A;
  --Teal-950: #0B463E;
  --bg-white: var(--neutral-0, #FFFFFF);
  --guest-bg: #E4FBF8;
  --h1-title: 3.5rem;
  --h2-title: 3rem;
  --h3-title: 2.5rem;
  --h4-title: 2rem;
  --h5-title: 1.5rem;
  --h6-title: 1.25rem;
  --icon-sub: var(--neutral-600, #2B303B);
  --label-sm: 0.875rem;
  --label-xl: 1.5rem;
  --label-xs: 0.75rem;
  --radius-0: 0px;
  --radius-2: 2px;
  --radius-4: 4px;
  --radius-6: 6px;
  --radius-8: 8px;
  --text-sub: var(--neutral-600, #2B303B);
  --Green-100: #D0FBE9;
  --Green-200: #C2F5DA;
  --Green-300: #84EBB4;
  --Green-400: #3EE089;
  --Green-500: #1FC16B;
  --Green-600: #1DAF61;
  --Green-700: #178C4E;
  --Green-800: #1A7544;
  --Green-900: #16643B;
  --Green-950: #0B4627;
  --Orange-50: #FFF3EB;
  --Purple-50: #EFEBFF;
  --Yellow-50: #FFFAEB;
  --bg-strong: var(--neutral-950, #0E121B);
  --icon-soft: var(--neutral-400, #99A0AE);
  --lead-text: #335CFF;
  --neutral-0: #FFFFFF;
  --radius-10: 10px;
  --radius-12: 12px;
  --radius-16: 16px;
  --radius-20: 20px;
  --radius-24: 24px;
  --radius-28: 28px;
  --text-soft: var(--neutral-400, #99A0AE);
  --Orange-100: #FFE6D5;
  --Orange-200: #FFD9C0;
  --Orange-300: #FFC197;
  --Orange-400: #FFA468;
  --Orange-500: #FA7319;
  --Orange-600: #E16614;
  --Orange-700: #CE5E12;
  --Orange-800: #B75310;
  --Orange-900: #96440D;
  --Orange-950: #71330A;
  --Purple-100: #DCD5FF;
  --Purple-200: #CAC0FF;
  --Purple-300: #A897FF;
  --Purple-400: #8C71F6;
  --Purple-500: #7D52F4;
  --Purple-600: #693EE0;
  --Purple-700: #5B2CC9;
  --Purple-800: #4C25A7;
  --Purple-900: #3D1D86;
  --Purple-950: #351A75;
  --Yellow-100: #FFEFCC;
  --Yellow-200: #FFECC0;
  --Yellow-300: #FFE097;
  --Yellow-400: #FFD268;
  --Yellow-500: #F6B51E;
  --Yellow-600: #E6A819;
  --Yellow-700: #C99A2C;
  --Yellow-800: #A78025;
  --Yellow-900: #86661D;
  --Yellow-950: #624C18;
  --bg-surface: var(--neutral-800, #222530);
  --error-base: var(--Red-500, #FB3748);
  --error-dark: var(--Red-950, #681219);
  --guest-text: #22D3BB;
  --icon-white: var(--neutral-0, #FFFFFF);
  --neutral-50: #F5F7FA;
  --stroke-sub: var(--neutral-300, #CACFD8);
  --text-white: var(--neutral-0, #FFFFFF);
  --unknown-bg: #F5F5F5;
  --error-light: var(--Red-200);
  --icon-strong: var(--neutral-950, #0E121B);
  --neutral-100: #F2F5F8;
  --neutral-200: #E1E4EA;
  --neutral-300: #CACFD8;
  --neutral-400: #99A0AE;
  --neutral-500: #717784;
  --neutral-600: #525866;
  --neutral-700: #2B303B;
  --neutral-800: #222530;
  --neutral-900: #181B25;
  --neutral-950: #0E121B;
  --p1-bg-color: #FFEBEC;
  --p2-bg-color: #FFF3EB;
  --p3-bg-color: #EBF1FF;
  --paragraph-l: 1.125rem;
  --paragraph-m: 1rem;
  --radius-full: 999px;
  --stroke-soft: var(--neutral-200, #E1E4EA);
  --text-strong: var(--neutral-950, #0E121B);
  --non-guest-bg: #FFEBF4;
  --paragraph-sm: 0.875rem;
  --paragraph-xl: 1.5rem;
  --paragraph-xs: 0.75rem;
  --primary-base: var(--Pink-500, #FB4BA3);
  --primary-dark: var(--Pink-800, #AD1F66);
  --red-alpha-10: #fb37481a;
  --red-alpha-16: #fb374829;
  --red-alpha-24: #fb37483d;
  --sky-alpha-10: #47c2ff1a;
  --sky-alpha-16: #47c2ff29;
  --sky-alpha-24: #47c2ff3d;
  --static-black: var(--neutral-950, #0E121B);
  --static-white: var(--neutral-0, #FFFFFF);
  --stroke-white: var(--neutral-0, #FFFFFF);
  --subheading-l: 1.125rem;
  --subheading-m: 1rem;
  --success-base: var(--Green-500);
  --success-dark: var(--Green-950);
  --unknown-text: #7B7B7B;
  --warning-base: var(--Orange-500, #FA7319);
  --warning-dark: var(--Orange-950, #71330A);
  --blue-alpha-10: #476cff1a;
  --blue-alpha-16: #476cff29;
  --blue-alpha-24: #476cff3d;
  --error-lighter: var(--Red-50, #FFEBEC);
  --icon-disabled: var(--neutral-300, #CACFD8);
  --p1-text-color: #FB3748;
  --p2-text-color: #FA7319;
  --p3-text-color: #335CFF;
  --pink-alpha-10: #fb4ba31a;
  --pink-alpha-16: #fb4ba329;
  --pink-alpha-24: #fb4ba33d;
  --shimmer-color: #eaebeb85;
  --stroke-strong: var(--neutral-950, #0E121B);
  --subheading-sm: 0.875rem;
  --subheading-xs: 0.75rem;
  --success-light: var(--green-alpha-24);
  --teal-alpha-10: #22d3bb1a;
  --teal-alpha-16: #22d3bb29;
  --teal-alpha-24: #22d3bb3d;
  --text-disabled: var(--neutral-300, #CACFD8);
  --warning-light: var(--Orange-200, #FFD9C0);
  --alphas-alpha-2: hsl(240 6% 10%);
  --alphas-alpha-4: hsl(240 6% 10%);
  --alphas-alpha-6: hsl(240 6% 10%);
  --alphas-alpha-8: hsl(240 6% 10%);
  --away-base-dark: var(--Yellow-600, #E6A819);
  --away-dark-dark: var(--Yellow-400, #FFD268);
  --black-alpha-10: #1717171a;
  --black-alpha-16: #17171729;
  --black-alpha-24: #1717173d;
  --green-alpha-10: #1fc16b1a;
  --green-alpha-16: #1fc16b29;
  --green-alpha-24: #1fc16b3d;
  --non-guest-text: #FB4BA3;
  --primary-darker: var(--Pink-700, #D0257A);
  --subheading-2xs: 1rem;
  --white-alpha-10: #ffffff3d;
  --white-alpha-16: #ffffff29;
  --white-alpha-24: #ffffff3d;
  --alphas-alpha-10: hsl(240 6% 10%);
  --alphas-alpha-12: hsl(240 6% 10%);
  --alphas-alpha-16: hsl(240 6% 10%);
  --alphas-alpha-24: hsl(240 6% 10%);
  --alphas-alpha-40: hsl(240 6% 10%);
  --alphas-alpha-56: hsl(240 6% 10%);
  --alphas-alpha-64: hsl(240 6% 10%);
  --alphas-alpha-72: hsl(240 6% 10%);
  --alphas-alpha-80: hsl(240 6% 10%);
  --alphas-alpha-88: hsl(240 6% 10%);
  --away-base-light: var(--Yellow-500, #F6B51E);
  --away-dark-light: var(--Yellow-950, #624C18);
  --away-light-dark: var(--yellow-alpha-24);
  --faded-base-dark: var(--neutral-500, #717784);
  --faded-dark-dark: var(--neutral-300, #CACFD8);
  --orange-alpha-10: #fa73191a;
  --orange-alpha-16: #fa731929;
  --orange-alpha-24: #fa73193d;
  --purple-alpha-10: #784def1a;
  --purple-alpha-16: #784def29;
  --purple-alpha-24: #784def3d;
  --success-lighter: var(--Green-50, #E0FAEC);
  --warning-lighter: var(--Orange-50, #FFF3EB);
  --yellow-alpha-10: #fbc64b1a;
  --yellow-alpha-16: #fbc64b29;
  --yellow-alpha-24: #fbc64b3d;
  --away-light-light: var(--Yellow-200, #FFECC0);
  --faded-base-light: var(--neutral-500, #717784);
  --faded-dark-light: var(--neutral-800, #222530);
  --faded-light-dark: var(--neutral-alpha-24, #99a0ae3d);
  --information-base: var(--Blue-500, #335CFF);
  --information-dark: var(--Blue-400, #6895FF);
  --neutral-alpha-10: #99a0ae1a;
  --neutral-alpha-16: #99a0ae29;
  --neutral-alpha-24: #99a0ae3d;
  --primary-alpha-10: var(--pink-alpha-10, #fb4ba31a);
  --primary-alpha-16: var(--pink-alpha-16, #fb4ba329);
  --primary-alpha-24: var(--pink-alpha-24, #fb4ba33d);
  --stable-base-dark: var(--Teal-600, #1DAF9C);
  --stable-dark-dark: var(--Teal-400, #3FDEC9);
  --away-lighter-dark: var(--yellow-alpha-16, #fbc64b29);
  --faded-light-light: var(--neutral-200, #E1E4EA);
  --feature-base-dark: var(--Purple-500, #7D52F4);
  --feature-dark-dark: var(--Purple-400, #8C71F6);
  --information-light: var(--Blue-200, #C0D5FF);
  --stable-base-light: var(--Teal-500, #22D3BB);
  --stable-dark-light: var(--Teal-950, #0B463E);
  --stable-light-dark: var(--teal-alpha-24, #22d3bb3d);
  --away-lighter-light: var(--Yellow-50, #FFFAEB);
  --faded-lighter-dark: var(--neutral-alpha-16, #99a0ae29);
  --feature-base-light: var(--Purple-500, #7D52F4);
  --feature-dark-light: var(--Purple-950, #351A75);
  --feature-light-dark: var(--purple-alpha-24, #784def3d);
  --stable-light-light: var(--Teal-200, #C2F5EE);
  --verified-base-dark: var(--Sky-600, #35ADE9);
  --verified-dark-dark: var(--Sky-400, #68CDFF);
  --backgrounds-bg-base: hsl(0 0% 100%);
  --borders-border-base: #E4E4E7;
  --faded-lighter-light: var(--neutral-100, #F2F5F8);
  --feature-light-light: var(--Purple-200, #CAC0FF);
  --foregrounds-fg-base: hsl(240 6% 10%);
  --information-lighter: var(--Blue-50, #EBF1FF);
  --stable-lighter-dark: var(--teal-alpha-16, #22d3bb29);
  --template-card-hover: #0000000d;
  --verified-base-light: var(--Sky-500, #47C2FF);
  --verified-dark-light: var(--Sky-950, #124B68);
  --verified-light-dark: var(--sky-alpha-24, #47c2ff3d);
  --backgrounds-bg-field: hsl(0 0% 98%);
  --borders-border-error: hsl(347 77% 50%);
  --feature-lighter-dark: var(--purple-alpha-16, #784def29);
  --foregrounds-fg-error: hsl(347 77% 50%);
  --foregrounds-fg-muted: hsl(240 4% 46%);
  --stable-lighter-light: var(--Teal-50, #E4FBF8);
  --tag-blue-tag-blue-bg: hsl(214 95% 93%);
  --tag-error-tag-red-bg: hsl(356 100% 95%);
  --verified-light-light: var(--Sky-200, #C0EAFF);
  --backgrounds-bg-subtle: hsl(0 0% 98%);
  --borders-border-danger: hsl(345 83% 41%);
  --borders-border-strong: hsl(240 5% 84%);
  --buttons-button-danger: hsl(347 77% 50%);
  --feature-lighter-light: var(--Purple-50, #EFEBFF);
  --foregrounds-fg-subtle: hsl(240 5% 34%);
  --highlighted-base-dark: var(--Pink-600, #E9358F);
  --highlighted-dark-dark: var(--Pink-400, #FF68B3);
  --verified-lighter-dark: var(--sky-alpha-16, #47c2ff29);
  --backgrounds-bg-overlay: hsl(240 6% 10%);
  --buttons-button-neutral: hsl(0 0% 100%);
  --highlighted-base-light: var(--Pink-500, #FB4BA3);
  --highlighted-dark-light: var(--Pink-950, #68123D);
  --highlighted-light-dark: var(--pink-alpha-24, #fb4ba33d);
  --tag-blue-tag-blue-icon: hsl(217 91% 60%);
  --tag-blue-tag-blue-text: hsl(226 71% 40%);
  --tag-error-tag-red-icon: hsl(350 89% 60%);
  --tag-error-tag-red-text: hsl(343 80% 35%);
  --verified-lighter-light: var(--Sky-50, #EBF8FF);
  --backgrounds-bg-disabled: hsl(240 5% 96%);
  --borders-border-menu-bot: hsl(0 0% 100%);
  --borders-border-menu-top: hsl(240 6% 90%);
  --buttons-button-inverted: hsl(240 4% 16%);
  --foregrounds-fg-disabled: hsl(240 5% 65%);
  --foregrounds-fg-on-color: hsl(0 0% 100%);
  --highlighted-light-light: var(--Pink-200, #FFC0DF);
  --backgrounds-bg-component: hsl(0 0% 98%);
  --backgrounds-bg-highlight: hsl(214 100% 97%);
  --button-transparent-hover: rgba(24, 24, 27, 0.06);
  --effects-buttons-inverted: 0 0.75px 0 0 rgba(255, 255, 255, 0.20) inset, 0 1px 2px 0 rgba(0, 0, 0, 0.40), 0 0 0 1px #18181B;
  --highlighted-lighter-dark: var(--pink-alpha-16, #fb4ba329);
  --tag-blue-tag-blue-border: hsl(212 96% 78%);
  --tag-error-tag-red-border: hsl(353 96% 82%);
  --tag-purple-tag-purple-bg: hsl(251 91% 95%);
  --tag-success-tag-green-bg: hsl(149 80% 90%);
  --backgrounds-bg-base-hover: hsl(240 5% 96%);
  --backgrounds-bg-switch-off: hsl(240 6% 90%);
  --contrast-contrast-bg-base: hsl(240 4% 14%);
  --highlighted-lighter-light: var(--Pink-50, #FFEBF4);
  --tag-warning-tag-orange-bg: hsl(34 100% 92%);
  --backgrounds-bg-field-hover: hsl(240 5% 96%);
  --backgrounds-bg-interactive: hsl(217 91% 60%);
  --borders-border-interactive: hsl(217 91% 60%);
  --borders-border-transparent: hsl(0 0% 100%);
  --buttons-button-transparent: hsl(0 0% 100%);
  --foregrounds-fg-interactive: hsl(221 83% 53%);
  --foregrounds-fg-on-inverted: hsl(0 0% 100%);
  --tag-blue-tag-blue-bg-hover: hsl(213 97% 87%);
  --tag-error-tag-red-bg-hover: hsl(353 96% 90%);
  --tag-neutral-tag-neutral-bg: hsl(240 5% 96%);
  --tag-purple-tag-purple-icon: hsl(258 90% 66%);
  --tag-purple-tag-purple-text: hsl(263 69% 42%);
  --tag-success-tag-green-icon: hsl(160 84% 39%);
  --tag-success-tag-green-text: hsl(163 88% 20%);
  --backgrounds-bg-base-pressed: hsl(240 6% 90%);
  --backgrounds-bg-subtle-hover: hsl(240 5% 96%);
  --buttons-button-danger-hover: hsl(345 83% 41%);
  --contrast-contrast-bg-subtle: hsl(240 4% 16%);
  --tag-warning-tag-orange-icon: hsl(25 95% 53%);
  --tag-warning-tag-orange-text: hsl(15 79% 34%);
  --buttons-button-neutral-hover: hsl(240 5% 96%);
  --contrast-contrast-border-bot: hsl(0 0% 100%);
  --contrast-contrast-border-top: hsl(240 6% 10%);
  --contrast-contrast-fg-primary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-icon: hsl(240 4% 46%);
  --tag-neutral-tag-neutral-text: hsl(240 5% 34%);
  --tag-purple-tag-purple-border: hsl(252 95% 85%);
  --tag-success-tag-green-border: hsl(156 72% 67%);
  --backgrounds-bg-subtle-pressed: hsl(240 6% 90%);
  --buttons-button-danger-pressed: hsl(343 80% 35%);
  --buttons-button-inverted-hover: hsl(240 5% 26%);
  --contrast-contrast-border-base: hsl(0 0% 100%);
  --tag-warning-tag-orange-border: hsl(31 97% 72%);
  --backgrounds-bg-component-hover: hsl(240 5% 96%);
  --backgrounds-bg-field-component: hsl(0 0% 100%);
  --backgrounds-bg-highlight-hover: hsl(214 95% 93%);
  --buttons-button-neutral-pressed: hsl(240 6% 90%);
  --contrast-contrast-fg-secondary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-border: hsl(240 5% 84%);
  --tag-purple-tag-purple-bg-hover: hsl(251 95% 92%);
  --tag-success-tag-green-bg-hover: hsl(152 76% 80%);
  --backgrounds-bg-switch-off-hover: hsl(240 5% 84%);
  --buttons-button-inverted-pressed: hsl(240 5% 34%);
  --contrast-contrast-bg-base-hover: hsl(240 4% 16%);
  --tag-warning-tag-orange-bg-hover: hsl(32 98% 83%);
  --backgrounds-bg-component-pressed: hsl(240 6% 90%);
  --buttons-button-transparent-hover: hsl(240 6% 10%);
  --foregrounds-fg-interactive-hover: hsl(217 91% 60%);
  --tag-neutral-tag-neutral-bg-hover: hsl(240 6% 90%);
  --contrast-contrast-bg-base-pressed: hsl(240 5% 26%);
  --buttons-button-transparent-pressed: hsl(240 6% 10%);
  --backgrounds-bg-field-component-hover: hsl(0 0% 98%);
}
    }
  [data-nc-theme~="Dark"] {
  --lead-bg: #476cff29;
  --guest-bg: #22d3bb29;
  --lead-text: #EBF1FF;
  --guest-text: #1DAF9C;
  --unknown-bg: #99a0ae29;
  --p1-bg-color: #fb374829;
  --p2-bg-color: #fa731929;
  --p3-bg-color: #476cff29;
  --non-guest-bg: #fb4ba329;
  --unknown-text: #7B7B7B;
  --p1-text-color: #FB3748;
  --p2-text-color: #E16614;
  --p3-text-color: #335CFF;
  --shimmer-color: #333333;
  --alphas-alpha-2: hsl(0 0% 100%);
  --alphas-alpha-4: hsl(0 0% 100%);
  --alphas-alpha-6: hsl(0 0% 100%);
  --alphas-alpha-8: hsl(0 0% 100%);
  --non-guest-text: #E9358F;
  --alphas-alpha-10: hsl(0 0% 100%);
  --alphas-alpha-12: hsl(0 0% 100%);
  --alphas-alpha-16: hsl(0 0% 100%);
  --alphas-alpha-24: hsl(0 0% 100%);
  --alphas-alpha-40: hsl(0 0% 100%);
  --alphas-alpha-56: hsl(0 0% 100%);
  --alphas-alpha-64: hsl(0 0% 100%);
  --alphas-alpha-72: hsl(0 0% 100%);
  --alphas-alpha-80: hsl(0 0% 100%);
  --alphas-alpha-88: hsl(0 0% 100%);
  --backgrounds-bg-base: hsl(240 4% 14%);
  --borders-border-base: #ffffff1a;
  --foregrounds-fg-base: hsl(240 5% 96%);
  --template-card-hover: #ffffff0d;
  --backgrounds-bg-field: hsl(0 0% 100%);
  --borders-border-error: hsl(351 95% 71%);
  --foregrounds-fg-error: hsl(351 95% 71%);
  --foregrounds-fg-muted: hsl(240 4% 46%);
  --tag-blue-tag-blue-bg: hsl(226 57% 21%);
  --tag-error-tag-red-bg: hsl(343 88% 16%);
  --backgrounds-bg-subtle: hsl(240 6% 10%);
  --borders-border-danger: hsl(345 83% 41%);
  --borders-border-strong: hsl(0 0% 100%);
  --buttons-button-danger: hsl(343 80% 35%);
  --foregrounds-fg-subtle: hsl(240 5% 65%);
  --backgrounds-bg-overlay: hsl(240 6% 10%);
  --buttons-button-neutral: hsl(0 0% 100%);
  --tag-blue-tag-blue-icon: hsl(213 94% 68%);
  --tag-blue-tag-blue-text: hsl(212 96% 78%);
  --tag-error-tag-red-icon: hsl(351 95% 71%);
  --tag-error-tag-red-text: hsl(353 96% 82%);
  --backgrounds-bg-disabled: hsl(240 4% 16%);
  --borders-border-menu-bot: hsl(0 0% 100%);
  --borders-border-menu-top: hsl(240 4% 14%);
  --buttons-button-inverted: hsl(240 5% 34%);
  --foregrounds-fg-disabled: hsl(240 5% 34%);
  --foregrounds-fg-on-color: hsl(0 0% 100%);
  --backgrounds-bg-component: hsl(240 4% 16%);
  --backgrounds-bg-highlight: hsl(226 57% 21%);
  --button-transparent-hover: rgba(255, 255, 255, 0.08);
  --effects-buttons-inverted: 0 -1px 0 0 rgba(255, 255, 255, 0.12), 0 0 0 1px rgba(255, 255, 255, 0.10), 0 0 0 1px #52525B, 0 0 1px 1.5px rgba(0, 0, 0, 0.24), 0 2px 2px 0 rgba(0, 0, 0, 0.24);
  --tag-blue-tag-blue-border: hsl(224 64% 33%);
  --tag-error-tag-red-border: hsl(342 75% 30%);
  --tag-purple-tag-purple-bg: hsl(261 73% 23%);
  --tag-success-tag-green-bg: hsl(166 91% 9%);
  --backgrounds-bg-base-hover: hsl(240 4% 16%);
  --backgrounds-bg-switch-off: hsl(240 5% 26%);
  --contrast-contrast-bg-base: hsl(240 4% 16%);
  --tag-warning-tag-orange-bg: hsl(13 81% 15%);
  --backgrounds-bg-field-hover: hsl(0 0% 100%);
  --backgrounds-bg-interactive: hsl(213 94% 68%);
  --borders-border-interactive: hsl(213 94% 68%);
  --borders-border-transparent: hsl(0 0% 100%);
  --buttons-button-transparent: hsl(0 0% 100%);
  --foregrounds-fg-interactive: hsl(213 94% 68%);
  --foregrounds-fg-on-inverted: hsl(240 6% 10%);
  --tag-blue-tag-blue-bg-hover: hsl(224 64% 33%);
  --tag-error-tag-red-bg-hover: hsl(342 75% 30%);
  --tag-neutral-tag-neutral-bg: hsl(240 5% 26%);
  --tag-purple-tag-purple-icon: hsl(255 92% 76%);
  --tag-purple-tag-purple-text: hsl(252 95% 85%);
  --tag-success-tag-green-icon: hsl(160 84% 39%);
  --tag-success-tag-green-text: hsl(158 64% 52%);
  --backgrounds-bg-base-pressed: hsl(240 5% 26%);
  --backgrounds-bg-subtle-hover: hsl(240 4% 14%);
  --buttons-button-danger-hover: hsl(345 83% 41%);
  --contrast-contrast-bg-subtle: hsl(0 0% 100%);
  --tag-warning-tag-orange-icon: hsl(27 96% 61%);
  --tag-warning-tag-orange-text: hsl(31 97% 72%);
  --buttons-button-neutral-hover: hsl(0 0% 100%);
  --contrast-contrast-border-bot: hsl(0 0% 100%);
  --contrast-contrast-border-top: hsl(240 4% 14%);
  --contrast-contrast-fg-primary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-icon: hsl(240 5% 65%);
  --tag-neutral-tag-neutral-text: hsl(240 5% 84%);
  --tag-purple-tag-purple-border: hsl(263 69% 42%);
  --tag-success-tag-green-border: hsl(164 86% 16%);
  --backgrounds-bg-subtle-pressed: hsl(240 4% 16%);
  --buttons-button-danger-pressed: hsl(347 77% 50%);
  --buttons-button-inverted-hover: hsl(240 4% 46%);
  --contrast-contrast-border-base: hsl(0 0% 100%);
  --tag-warning-tag-orange-border: hsl(15 75% 28%);
  --backgrounds-bg-component-hover: hsl(0 0% 100%);
  --backgrounds-bg-field-component: hsl(240 4% 14%);
  --backgrounds-bg-highlight-hover: hsl(224 64% 33%);
  --buttons-button-neutral-pressed: hsl(0 0% 100%);
  --contrast-contrast-fg-secondary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-border: hsl(0 0% 100%);
  --tag-purple-tag-purple-bg-hover: hsl(263 69% 42%);
  --tag-success-tag-green-bg-hover: hsl(164 86% 16%);
  --backgrounds-bg-switch-off-hover: hsl(240 5% 34%);
  --buttons-button-inverted-pressed: hsl(240 5% 65%);
  --contrast-contrast-bg-base-hover: hsl(0 0% 100%);
  --tag-warning-tag-orange-bg-hover: hsl(15 75% 28%);
  --backgrounds-bg-component-pressed: hsl(0 0% 100%);
  --buttons-button-transparent-hover: hsl(0 0% 100%);
  --foregrounds-fg-interactive-hover: hsl(212 96% 78%);
  --tag-neutral-tag-neutral-bg-hover: hsl(240 5% 34%);
  --contrast-contrast-bg-base-pressed: hsl(0 0% 100%);
  --buttons-button-transparent-pressed: hsl(0 0% 100%);
  --backgrounds-bg-field-component-hover: hsl(240 4% 16%);
}
[data-nc-theme~="Default"] {
  --docs: 1.125rem;
  --Red-50: #FFEBEC;
  --Sky-50: #EBF8FF;
  --bg-sub: var(--neutral-300, #CACFD8);
  --medium: 500;
  --Blue-50: #EBF1FF;
  --Pink-50: #FFEBF4;
  --Red-100: #FFD5D8;
  --Red-200: #FFC0C5;
  --Red-300: #FF97A0;
  --Red-400: #FF6875;
  --Red-500: #FB3748;
  --Red-600: #E93544;
  --Red-700: #D02533;
  --Red-800: #AD1F2B;
  --Red-900: #8B1822;
  --Red-950: #681219;
  --Sky-100: #D5F1FF;
  --Sky-200: #C0EAFF;
  --Sky-300: #97DCFF;
  --Sky-400: #68CDFF;
  --Sky-500: #47C2FF;
  --Sky-600: #35ADE9;
  --Sky-700: #2597D0;
  --Sky-800: #1F7EAD;
  --Sky-900: #18658B;
  --Sky-950: #124B68;
  --Teal-50: #E4FBF8;
  --bg-soft: var(--neutral-200, #E1E4EA);
  --bg-weak: var(--neutral-50, #F5F7FA);
  --label-l: 1.125rem;
  --label-m: 1rem;
  --lead-bg: #335CFF;
  --regular: 400;
  --Blue-100: #D5E2FF;
  --Blue-200: #C0D5FF;
  --Blue-300: #97BAFF;
  --Blue-400: #6895FF;
  --Blue-500: #335CFF;
  --Blue-600: #3559E9;
  --Blue-700: #2547D0;
  --Blue-800: #1F3BAD;
  --Blue-900: #182F8B;
  --Blue-950: #122368;
  --Green-50: #E0FAEC;
  --Pink-100: #FFD5EA;
  --Pink-200: #FFC0DF;
  --Pink-300: #FF97CB;
  --Pink-400: #FF68B3;
  --Pink-500: #FB4BA3;
  --Pink-600: #E9358F;
  --Pink-700: #D0257A;
  --Pink-800: #AD1F66;
  --Pink-900: #8B1852;
  --Pink-950: #68123D;
  --Teal-100: #D0FBF5;
  --Teal-200: #C2F5EE;
  --Teal-300: #84EBDD;
  --Teal-400: #3FDEC9;
  --Teal-500: #22D3BB;
  --Teal-600: #1DAF9C;
  --Teal-700: #178C7D;
  --Teal-800: #1A7569;
  --Teal-900: #16645A;
  --Teal-950: #0B463E;
  --bg-white: var(--neutral-0, #FFFFFF);
  --guest-bg: #E4FBF8;
  --h1-title: 3.5rem;
  --h2-title: 3rem;
  --h3-title: 2.5rem;
  --h4-title: 2rem;
  --h5-title: 1.5rem;
  --h6-title: 1.25rem;
  --icon-sub: var(--neutral-600, #2B303B);
  --label-sm: 0.875rem;
  --label-xl: 1.5rem;
  --label-xs: 0.75rem;
  --radius-0: 0px;
  --radius-2: 2px;
  --radius-4: 4px;
  --radius-6: 6px;
  --radius-8: 8px;
  --text-sub: var(--neutral-600, #2B303B);
  --Green-100: #D0FBE9;
  --Green-200: #C2F5DA;
  --Green-300: #84EBB4;
  --Green-400: #3EE089;
  --Green-500: #1FC16B;
  --Green-600: #1DAF61;
  --Green-700: #178C4E;
  --Green-800: #1A7544;
  --Green-900: #16643B;
  --Green-950: #0B4627;
  --Orange-50: #FFF3EB;
  --Purple-50: #EFEBFF;
  --Yellow-50: #FFFAEB;
  --bg-strong: var(--neutral-950, #0E121B);
  --icon-soft: var(--neutral-400, #99A0AE);
  --lead-text: #335CFF;
  --neutral-0: #FFFFFF;
  --radius-10: 10px;
  --radius-12: 12px;
  --radius-16: 16px;
  --radius-20: 20px;
  --radius-24: 24px;
  --radius-28: 28px;
  --text-soft: var(--neutral-400, #99A0AE);
  --Orange-100: #FFE6D5;
  --Orange-200: #FFD9C0;
  --Orange-300: #FFC197;
  --Orange-400: #FFA468;
  --Orange-500: #FA7319;
  --Orange-600: #E16614;
  --Orange-700: #CE5E12;
  --Orange-800: #B75310;
  --Orange-900: #96440D;
  --Orange-950: #71330A;
  --Purple-100: #DCD5FF;
  --Purple-200: #CAC0FF;
  --Purple-300: #A897FF;
  --Purple-400: #8C71F6;
  --Purple-500: #7D52F4;
  --Purple-600: #693EE0;
  --Purple-700: #5B2CC9;
  --Purple-800: #4C25A7;
  --Purple-900: #3D1D86;
  --Purple-950: #351A75;
  --Yellow-100: #FFEFCC;
  --Yellow-200: #FFECC0;
  --Yellow-300: #FFE097;
  --Yellow-400: #FFD268;
  --Yellow-500: #F6B51E;
  --Yellow-600: #E6A819;
  --Yellow-700: #C99A2C;
  --Yellow-800: #A78025;
  --Yellow-900: #86661D;
  --Yellow-950: #624C18;
  --bg-surface: var(--neutral-800, #222530);
  --error-base: var(--Red-500, #FB3748);
  --error-dark: var(--Red-950, #681219);
  --guest-text: #22D3BB;
  --icon-white: var(--neutral-0, #FFFFFF);
  --neutral-50: #F5F7FA;
  --stroke-sub: var(--neutral-300, #CACFD8);
  --text-white: var(--neutral-0, #FFFFFF);
  --unknown-bg: #F5F5F5;
  --error-light: var(--Red-200);
  --icon-strong: var(--neutral-950, #0E121B);
  --neutral-100: #F2F5F8;
  --neutral-200: #E1E4EA;
  --neutral-300: #CACFD8;
  --neutral-400: #99A0AE;
  --neutral-500: #717784;
  --neutral-600: #525866;
  --neutral-700: #2B303B;
  --neutral-800: #222530;
  --neutral-900: #181B25;
  --neutral-950: #0E121B;
  --p1-bg-color: #FFEBEC;
  --p2-bg-color: #FFF3EB;
  --p3-bg-color: #EBF1FF;
  --paragraph-l: 1.125rem;
  --paragraph-m: 1rem;
  --radius-full: 999px;
  --stroke-soft: var(--neutral-200, #E1E4EA);
  --text-strong: var(--neutral-950, #0E121B);
  --non-guest-bg: #FFEBF4;
  --paragraph-sm: 0.875rem;
  --paragraph-xl: 1.5rem;
  --paragraph-xs: 0.75rem;
  --primary-base: var(--Pink-500, #FB4BA3);
  --primary-dark: var(--Pink-800, #AD1F66);
  --red-alpha-10: #fb37481a;
  --red-alpha-16: #fb374829;
  --red-alpha-24: #fb37483d;
  --sky-alpha-10: #47c2ff1a;
  --sky-alpha-16: #47c2ff29;
  --sky-alpha-24: #47c2ff3d;
  --static-black: var(--neutral-950, #0E121B);
  --static-white: var(--neutral-0, #FFFFFF);
  --stroke-white: var(--neutral-0, #FFFFFF);
  --subheading-l: 1.125rem;
  --subheading-m: 1rem;
  --success-base: var(--Green-500);
  --success-dark: var(--Green-950);
  --unknown-text: #7B7B7B;
  --warning-base: var(--Orange-500, #FA7319);
  --warning-dark: var(--Orange-950, #71330A);
  --blue-alpha-10: #476cff1a;
  --blue-alpha-16: #476cff29;
  --blue-alpha-24: #476cff3d;
  --error-lighter: var(--Red-50, #FFEBEC);
  --icon-disabled: var(--neutral-300, #CACFD8);
  --p1-text-color: #FB3748;
  --p2-text-color: #FA7319;
  --p3-text-color: #335CFF;
  --pink-alpha-10: #fb4ba31a;
  --pink-alpha-16: #fb4ba329;
  --pink-alpha-24: #fb4ba33d;
  --shimmer-color: #eaebeb85;
  --stroke-strong: var(--neutral-950, #0E121B);
  --subheading-sm: 0.875rem;
  --subheading-xs: 0.75rem;
  --success-light: var(--green-alpha-24);
  --teal-alpha-10: #22d3bb1a;
  --teal-alpha-16: #22d3bb29;
  --teal-alpha-24: #22d3bb3d;
  --text-disabled: var(--neutral-300, #CACFD8);
  --warning-light: var(--Orange-200, #FFD9C0);
  --alphas-alpha-2: hsl(240 6% 10%);
  --alphas-alpha-4: hsl(240 6% 10%);
  --alphas-alpha-6: hsl(240 6% 10%);
  --alphas-alpha-8: hsl(240 6% 10%);
  --away-base-dark: var(--Yellow-600, #E6A819);
  --away-dark-dark: var(--Yellow-400, #FFD268);
  --black-alpha-10: #1717171a;
  --black-alpha-16: #17171729;
  --black-alpha-24: #1717173d;
  --green-alpha-10: #1fc16b1a;
  --green-alpha-16: #1fc16b29;
  --green-alpha-24: #1fc16b3d;
  --non-guest-text: #FB4BA3;
  --primary-darker: var(--Pink-700, #D0257A);
  --subheading-2xs: 1rem;
  --white-alpha-10: #ffffff3d;
  --white-alpha-16: #ffffff29;
  --white-alpha-24: #ffffff3d;
  --alphas-alpha-10: hsl(240 6% 10%);
  --alphas-alpha-12: hsl(240 6% 10%);
  --alphas-alpha-16: hsl(240 6% 10%);
  --alphas-alpha-24: hsl(240 6% 10%);
  --alphas-alpha-40: hsl(240 6% 10%);
  --alphas-alpha-56: hsl(240 6% 10%);
  --alphas-alpha-64: hsl(240 6% 10%);
  --alphas-alpha-72: hsl(240 6% 10%);
  --alphas-alpha-80: hsl(240 6% 10%);
  --alphas-alpha-88: hsl(240 6% 10%);
  --away-base-light: var(--Yellow-500, #F6B51E);
  --away-dark-light: var(--Yellow-950, #624C18);
  --away-light-dark: var(--yellow-alpha-24);
  --faded-base-dark: var(--neutral-500, #717784);
  --faded-dark-dark: var(--neutral-300, #CACFD8);
  --orange-alpha-10: #fa73191a;
  --orange-alpha-16: #fa731929;
  --orange-alpha-24: #fa73193d;
  --purple-alpha-10: #784def1a;
  --purple-alpha-16: #784def29;
  --purple-alpha-24: #784def3d;
  --success-lighter: var(--Green-50, #E0FAEC);
  --warning-lighter: var(--Orange-50, #FFF3EB);
  --yellow-alpha-10: #fbc64b1a;
  --yellow-alpha-16: #fbc64b29;
  --yellow-alpha-24: #fbc64b3d;
  --away-light-light: var(--Yellow-200, #FFECC0);
  --faded-base-light: var(--neutral-500, #717784);
  --faded-dark-light: var(--neutral-800, #222530);
  --faded-light-dark: var(--neutral-alpha-24, #99a0ae3d);
  --information-base: var(--Blue-500, #335CFF);
  --information-dark: var(--Blue-400, #6895FF);
  --neutral-alpha-10: #99a0ae1a;
  --neutral-alpha-16: #99a0ae29;
  --neutral-alpha-24: #99a0ae3d;
  --primary-alpha-10: var(--pink-alpha-10, #fb4ba31a);
  --primary-alpha-16: var(--pink-alpha-16, #fb4ba329);
  --primary-alpha-24: var(--pink-alpha-24, #fb4ba33d);
  --stable-base-dark: var(--Teal-600, #1DAF9C);
  --stable-dark-dark: var(--Teal-400, #3FDEC9);
  --away-lighter-dark: var(--yellow-alpha-16, #fbc64b29);
  --faded-light-light: var(--neutral-200, #E1E4EA);
  --feature-base-dark: var(--Purple-500, #7D52F4);
  --feature-dark-dark: var(--Purple-400, #8C71F6);
  --information-light: var(--Blue-200, #C0D5FF);
  --stable-base-light: var(--Teal-500, #22D3BB);
  --stable-dark-light: var(--Teal-950, #0B463E);
  --stable-light-dark: var(--teal-alpha-24, #22d3bb3d);
  --away-lighter-light: var(--Yellow-50, #FFFAEB);
  --faded-lighter-dark: var(--neutral-alpha-16, #99a0ae29);
  --feature-base-light: var(--Purple-500, #7D52F4);
  --feature-dark-light: var(--Purple-950, #351A75);
  --feature-light-dark: var(--purple-alpha-24, #784def3d);
  --stable-light-light: var(--Teal-200, #C2F5EE);
  --verified-base-dark: var(--Sky-600, #35ADE9);
  --verified-dark-dark: var(--Sky-400, #68CDFF);
  --backgrounds-bg-base: hsl(0 0% 100%);
  --borders-border-base: #E4E4E7;
  --faded-lighter-light: var(--neutral-100, #F2F5F8);
  --feature-light-light: var(--Purple-200, #CAC0FF);
  --foregrounds-fg-base: hsl(240 6% 10%);
  --information-lighter: var(--Blue-50, #EBF1FF);
  --stable-lighter-dark: var(--teal-alpha-16, #22d3bb29);
  --template-card-hover: #0000000d;
  --verified-base-light: var(--Sky-500, #47C2FF);
  --verified-dark-light: var(--Sky-950, #124B68);
  --verified-light-dark: var(--sky-alpha-24, #47c2ff3d);
  --backgrounds-bg-field: hsl(0 0% 98%);
  --borders-border-error: hsl(347 77% 50%);
  --feature-lighter-dark: var(--purple-alpha-16, #784def29);
  --foregrounds-fg-error: hsl(347 77% 50%);
  --foregrounds-fg-muted: hsl(240 4% 46%);
  --stable-lighter-light: var(--Teal-50, #E4FBF8);
  --tag-blue-tag-blue-bg: hsl(214 95% 93%);
  --tag-error-tag-red-bg: hsl(356 100% 95%);
  --verified-light-light: var(--Sky-200, #C0EAFF);
  --backgrounds-bg-subtle: hsl(0 0% 98%);
  --borders-border-danger: hsl(345 83% 41%);
  --borders-border-strong: hsl(240 5% 84%);
  --buttons-button-danger: hsl(347 77% 50%);
  --feature-lighter-light: var(--Purple-50, #EFEBFF);
  --foregrounds-fg-subtle: hsl(240 5% 34%);
  --highlighted-base-dark: var(--Pink-600, #E9358F);
  --highlighted-dark-dark: var(--Pink-400, #FF68B3);
  --verified-lighter-dark: var(--sky-alpha-16, #47c2ff29);
  --backgrounds-bg-overlay: hsl(240 6% 10%);
  --buttons-button-neutral: hsl(0 0% 100%);
  --highlighted-base-light: var(--Pink-500, #FB4BA3);
  --highlighted-dark-light: var(--Pink-950, #68123D);
  --highlighted-light-dark: var(--pink-alpha-24, #fb4ba33d);
  --tag-blue-tag-blue-icon: hsl(217 91% 60%);
  --tag-blue-tag-blue-text: hsl(226 71% 40%);
  --tag-error-tag-red-icon: hsl(350 89% 60%);
  --tag-error-tag-red-text: hsl(343 80% 35%);
  --verified-lighter-light: var(--Sky-50, #EBF8FF);
  --backgrounds-bg-disabled: hsl(240 5% 96%);
  --borders-border-menu-bot: hsl(0 0% 100%);
  --borders-border-menu-top: hsl(240 6% 90%);
  --buttons-button-inverted: hsl(240 4% 16%);
  --foregrounds-fg-disabled: hsl(240 5% 65%);
  --foregrounds-fg-on-color: hsl(0 0% 100%);
  --highlighted-light-light: var(--Pink-200, #FFC0DF);
  --backgrounds-bg-component: hsl(0 0% 98%);
  --backgrounds-bg-highlight: hsl(214 100% 97%);
  --button-transparent-hover: rgba(24, 24, 27, 0.06);
  --effects-buttons-inverted: 0 0.75px 0 0 rgba(255, 255, 255, 0.20) inset, 0 1px 2px 0 rgba(0, 0, 0, 0.40), 0 0 0 1px #18181B;
  --highlighted-lighter-dark: var(--pink-alpha-16, #fb4ba329);
  --tag-blue-tag-blue-border: hsl(212 96% 78%);
  --tag-error-tag-red-border: hsl(353 96% 82%);
  --tag-purple-tag-purple-bg: hsl(251 91% 95%);
  --tag-success-tag-green-bg: hsl(149 80% 90%);
  --backgrounds-bg-base-hover: hsl(240 5% 96%);
  --backgrounds-bg-switch-off: hsl(240 6% 90%);
  --contrast-contrast-bg-base: hsl(240 4% 14%);
  --highlighted-lighter-light: var(--Pink-50, #FFEBF4);
  --tag-warning-tag-orange-bg: hsl(34 100% 92%);
  --backgrounds-bg-field-hover: hsl(240 5% 96%);
  --backgrounds-bg-interactive: hsl(217 91% 60%);
  --borders-border-interactive: hsl(217 91% 60%);
  --borders-border-transparent: hsl(0 0% 100%);
  --buttons-button-transparent: hsl(0 0% 100%);
  --foregrounds-fg-interactive: hsl(221 83% 53%);
  --foregrounds-fg-on-inverted: hsl(0 0% 100%);
  --tag-blue-tag-blue-bg-hover: hsl(213 97% 87%);
  --tag-error-tag-red-bg-hover: hsl(353 96% 90%);
  --tag-neutral-tag-neutral-bg: hsl(240 5% 96%);
  --tag-purple-tag-purple-icon: hsl(258 90% 66%);
  --tag-purple-tag-purple-text: hsl(263 69% 42%);
  --tag-success-tag-green-icon: hsl(160 84% 39%);
  --tag-success-tag-green-text: hsl(163 88% 20%);
  --backgrounds-bg-base-pressed: hsl(240 6% 90%);
  --backgrounds-bg-subtle-hover: hsl(240 5% 96%);
  --buttons-button-danger-hover: hsl(345 83% 41%);
  --contrast-contrast-bg-subtle: hsl(240 4% 16%);
  --tag-warning-tag-orange-icon: hsl(25 95% 53%);
  --tag-warning-tag-orange-text: hsl(15 79% 34%);
  --buttons-button-neutral-hover: hsl(240 5% 96%);
  --contrast-contrast-border-bot: hsl(0 0% 100%);
  --contrast-contrast-border-top: hsl(240 6% 10%);
  --contrast-contrast-fg-primary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-icon: hsl(240 4% 46%);
  --tag-neutral-tag-neutral-text: hsl(240 5% 34%);
  --tag-purple-tag-purple-border: hsl(252 95% 85%);
  --tag-success-tag-green-border: hsl(156 72% 67%);
  --backgrounds-bg-subtle-pressed: hsl(240 6% 90%);
  --buttons-button-danger-pressed: hsl(343 80% 35%);
  --buttons-button-inverted-hover: hsl(240 5% 26%);
  --contrast-contrast-border-base: hsl(0 0% 100%);
  --tag-warning-tag-orange-border: hsl(31 97% 72%);
  --backgrounds-bg-component-hover: hsl(240 5% 96%);
  --backgrounds-bg-field-component: hsl(0 0% 100%);
  --backgrounds-bg-highlight-hover: hsl(214 95% 93%);
  --buttons-button-neutral-pressed: hsl(240 6% 90%);
  --contrast-contrast-fg-secondary: hsl(0 0% 100%);
  --tag-neutral-tag-neutral-border: hsl(240 5% 84%);
  --tag-purple-tag-purple-bg-hover: hsl(251 95% 92%);
  --tag-success-tag-green-bg-hover: hsl(152 76% 80%);
  --backgrounds-bg-switch-off-hover: hsl(240 5% 84%);
  --buttons-button-inverted-pressed: hsl(240 5% 34%);
  --contrast-contrast-bg-base-hover: hsl(240 4% 16%);
  --tag-warning-tag-orange-bg-hover: hsl(32 98% 83%);
  --backgrounds-bg-component-pressed: hsl(240 6% 90%);
  --buttons-button-transparent-hover: hsl(240 6% 10%);
  --foregrounds-fg-interactive-hover: hsl(217 91% 60%);
  --tag-neutral-tag-neutral-bg-hover: hsl(240 6% 90%);
  --contrast-contrast-bg-base-pressed: hsl(240 5% 26%);
  --buttons-button-transparent-pressed: hsl(240 6% 10%);
  --backgrounds-bg-field-component-hover: hsl(0 0% 98%);
}
    


@layer base {
  
  body, :host {
    /* Color */
    
    /* Fonts */
    --font-inter: 'Inter',sans-serif;
--font-geist: 'Geist',sans-serif;
--font-roboto: 'Roboto',sans-serif;
--font-geistmono: 'Geist Mono',monospace;
--font-dmmono: 'DM Mono',monospace;
--font-Slabo 13px: 'Slabo 13px',serif;
--font-Outfit: 'Outfit',sans-serif;
--font-B612: 'B612',sans-serif;

    /* Font size */
    
    /* Font weight */
    
    /* Shadows */
    
    /* Border radius */
    
    /* Spacing */
    
    /* Z-index */
    
  }
  @keyframes animation-spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  @keyframes animation-fade-in {
    from {
      opacity:0;
    }
    to {
      opacity:1;
    }
  }
  @keyframes animation-fade-out {
    from {
      opacity:1;
    }
    to {
      opacity:0;
    }
  }
}


    .feBXMD {
      width:100%;
      height:100%;
      display:flex;
      align-items:center;
      padding-top:4rem;
      padding-bottom:4rem;
      justify-content:flex-start;
    }

    .cJROXe {
      height:fit-content;
    }

    .dWOXfZ {
      width:fit-content;
      height:fit-content ;
    }

    .d-list-daypicker\:TaBG1Kf8scM9_TOXQYMx3 {
      width: ;
    }

    .test3\:d2RvtVNet9yeZ3nn34aoQ {
      width:30rem;
      height:20rem;
    }