@property --bold {
  syntax: "<number>";
  inherits: true;
  initial-value: 700;
}
@property --semi {
  syntax: "<number>";
  inherits: true;
  initial-value: 600;
}
@property --medium {
  syntax: "<number>";
  inherits: true;
  initial-value: 500;
}
@property --normal {
  syntax: "<number>";
  inherits: true;
  initial-value: 400;
}
@property --bg-main {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --brand-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #000;
}
@property --brand-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121212;
}
@property --brand-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F1F1F;
}
@property --brand-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #282828;
}
@property --brand-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #303030;
}
@property --brand-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3A3A3A;
}
@property --brand-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #474747;
}
@property --brand-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #606060;
}
@property --brand-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFF;
}
@property --text-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.125rem;
}
@property --text-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1rem;
}
@property --text-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.875rem;
}
@property --text-xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.25rem;
}
@property --text-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.75rem;
}
@property --brand-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F6F6F6;
}
@property --brand-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B3B3B3;
}
@property --brand-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EEE;
}
@property --text-2xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --text-3xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.875rem;
}
@property --text-4xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.25rem;
}
@property --text-5xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3rem;
}
@property --text-6xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3.75rem;
}
@property --border-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2px;
}
@property --border-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1px;
}
@property --neutral-0 {
  syntax: "<color>";
  inherits: true;
  initial-value: #000;
}
@property --neutral-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #000;
}
@property --neutral-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121212;
}
@property --neutral-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F1F1F;
}
@property --neutral-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #282828;
}
@property --neutral-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #303030;
}
@property --neutral-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3A3A3A;
}
@property --neutral-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #474747;
}
@property --neutral-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #606060;
}
@property --neutral-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6D6D6D;
}
@property --success-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0D1514;
}
@property --success-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #111C1B;
}
@property --success-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0D2D2A;
}
@property --success-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #023B37;
}
@property --success-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #084843;
}
@property --success-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #145750;
}
@property --success-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1C6961;
}
@property --success-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #207E73;
}
@property --success-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #12A594;
}
@property --warning-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #16120C;
}
@property --warning-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1D180F;
}
@property --warning-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #302008;
}
@property --warning-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3F2700;
}
@property --warning-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4D3000;
}
@property --warning-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5C3D05;
}
@property --warning-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #714F19;
}
@property --warning-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #8F6424;
}
@property --warning-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFC53D;
}
@property --critical-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #191113;
}
@property --critical-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1E1517;
}
@property --critical-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3A141E;
}
@property --critical-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4E1325;
}
@property --critical-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5E1A2E;
}
@property --critical-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6F2539;
}
@property --critical-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #883447;
}
@property --critical-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B3445A;
}
@property --critical-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E54666;
}
@property --neutral-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7A7A7A;
}
@property --neutral-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B3B3B3;
}
@property --neutral-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EEE;
}
@property --overlay-a1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff0d;
}
@property --overlay-a2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff1a;
}
@property --overlay-a3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff26;
}
@property --overlay-a4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff33;
}
@property --overlay-a5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff4d;
}
@property --overlay-a6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff66;
}
@property --overlay-a7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff80;
}
@property --overlay-a8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff99;
}
@property --overlay-a9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffffb3;
}
@property --success-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0EB39E;
}
@property --success-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0BD8B6;
}
@property --success-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ADF0DD;
}
@property --warning-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD60A;
}
@property --warning-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFCA16;
}
@property --warning-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFE7B3;
}
@property --border-none {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --critical-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EC5A72;
}
@property --critical-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF949D;
}
@property --critical-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FED2E1;
}
@property --overlay-a10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffffcc;
}
@property --overlay-a11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffffe6;
}
@property --overlay-a12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #fffffff2;
}
@property --rounding-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 8px;
}
@property --rounding-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 4px;
}
@property --rounding-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2px;
}
@property --badge-size-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2rem;
}
@property --badge-size-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2rem;
}
@property --badge-size-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --header-height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 4.5rem;
}
@property --rounding-full {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 9999px;
}
@property --rounding-none {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --avatar-size-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3rem;
}
@property --avatar-size-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2rem;
}
@property --avatar-size-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --line-height-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.75rem;
}
@property --line-height-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --line-height-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.25rem;
}
@property --line-height-xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.875rem;
}
@property --line-height-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.125rem;
}
@property --line-height-2xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2rem;
}
@property --line-height-3xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.375rem;
}
@property --line-height-4xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.75rem;
}
@property --line-height-5xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3.75rem;
}
@property --line-height-6xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 4.5rem;
}
@property --side-menu-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 240px;
}
@property --spinner-size-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.75rem;
}
@property --spinner-size-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --spinner-size-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.25rem;
}
@property --toggle-height-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --letter-spacing-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0rem;
}
@property --letter-spacing-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0rem;
}
@property --letter-spacing-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0rem;
}
@property --letter-spacing-xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0rem;
}
@property --letter-spacing-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0rem;
}
@property --letter-spacing-2xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0rem;
}
@property --letter-spacing-3xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0rem;
}
@property --letter-spacing-4xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: -0.045rem;
}
@property --letter-spacing-5xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: -0.0575rem;
}
@property --letter-spacing-6xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: -0.075rem;
}
@property --overlay-inverted-a1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0000000d;
}
@property --overlay-inverted-a2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0000001a;
}
@property --overlay-inverted-a3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000026;
}
@property --overlay-inverted-a4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000033;
}
@property --overlay-inverted-a5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0000004d;
}
@property --overlay-inverted-a6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000066;
}
@property --overlay-inverted-a7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000080;
}
@property --overlay-inverted-a8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000099;
}
@property --overlay-inverted-a9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #000000b3;
}
@property --overlay-inverted-a10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #000000cc;
}
@property --overlay-inverted-a11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #000000e6;
}
@property --overlay-inverted-a12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #000000f2;
}
@property --interactive-height-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3rem;
}
@property --interactive-height-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.5rem;
}
@property --interactive-height-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2rem;
}

  :host, :root {
  --bold: 700;
  --semi: 600;
  --medium: 500;
  --normal: 400;
  --bg-main: #fafafa;
  --brand-1: #000;
  --brand-2: #121212;
  --brand-3: #1F1F1F;
  --brand-4: #282828;
  --brand-5: #303030;
  --brand-6: #3A3A3A;
  --brand-7: #474747;
  --brand-8: #606060;
  --brand-9: #FFF;
  --text-lg: 1.125rem;
  --text-md: 1rem;
  --text-sm: 0.875rem;
  --text-xl: 1.25rem;
  --text-xs: 0.75rem;
  --brand-10: #F6F6F6;
  --brand-11: #B3B3B3;
  --brand-12: #EEE;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --border-lg: 2px;
  --border-md: 1px;
  --neutral-0: #000;
  --neutral-1: #000;
  --neutral-2: #121212;
  --neutral-3: #1F1F1F;
  --neutral-4: #282828;
  --neutral-5: #303030;
  --neutral-6: #3A3A3A;
  --neutral-7: #474747;
  --neutral-8: #606060;
  --neutral-9: #6D6D6D;
  --success-1: #0D1514;
  --success-2: #111C1B;
  --success-3: #0D2D2A;
  --success-4: #023B37;
  --success-5: #084843;
  --success-6: #145750;
  --success-7: #1C6961;
  --success-8: #207E73;
  --success-9: #12A594;
  --warning-1: #16120C;
  --warning-2: #1D180F;
  --warning-3: #302008;
  --warning-4: #3F2700;
  --warning-5: #4D3000;
  --warning-6: #5C3D05;
  --warning-7: #714F19;
  --warning-8: #8F6424;
  --warning-9: #FFC53D;
  --critical-1: #191113;
  --critical-2: #1E1517;
  --critical-3: #3A141E;
  --critical-4: #4E1325;
  --critical-5: #5E1A2E;
  --critical-6: #6F2539;
  --critical-7: #883447;
  --critical-8: #B3445A;
  --critical-9: #E54666;
  --neutral-10: #7A7A7A;
  --neutral-11: #B3B3B3;
  --neutral-12: #EEE;
  --overlay-a1: #ffffff0d;
  --overlay-a2: #ffffff1a;
  --overlay-a3: #ffffff26;
  --overlay-a4: #ffffff33;
  --overlay-a5: #ffffff4d;
  --overlay-a6: #ffffff66;
  --overlay-a7: #ffffff80;
  --overlay-a8: #ffffff99;
  --overlay-a9: #ffffffb3;
  --success-10: #0EB39E;
  --success-11: #0BD8B6;
  --success-12: #ADF0DD;
  --warning-10: #FFD60A;
  --warning-11: #FFCA16;
  --warning-12: #FFE7B3;
  --border-none: 0px;
  --critical-10: #EC5A72;
  --critical-11: #FF949D;
  --critical-12: #FED2E1;
  --overlay-a10: #ffffffcc;
  --overlay-a11: #ffffffe6;
  --overlay-a12: #fffffff2;
  --rounding-lg: 8px;
  --rounding-md: 4px;
  --rounding-sm: 2px;
  --badge-size-lg: 2rem;
  --badge-size-md: 2rem;
  --badge-size-sm: 1.5rem;
  --header-height: 4.5rem;
  --rounding-full: 9999px;
  --rounding-none: 0px;
  --avatar-size-lg: 3rem;
  --avatar-size-md: 2rem;
  --avatar-size-sm: 1.5rem;
  --line-height-lg: 1.75rem;
  --line-height-md: 1.5rem;
  --line-height-sm: 1.25rem;
  --line-height-xl: 1.875rem;
  --line-height-xs: 1.125rem;
  --line-height-2xl: 2rem;
  --line-height-3xl: 2.375rem;
  --line-height-4xl: 2.75rem;
  --line-height-5xl: 3.75rem;
  --line-height-6xl: 4.5rem;
  --side-menu-width: 240px;
  --spinner-size-lg: 1.75rem;
  --spinner-size-md: 1.5rem;
  --spinner-size-sm: 1.25rem;
  --toggle-height-md: 1.5rem;
  --letter-spacing-lg: 0rem;
  --letter-spacing-md: 0rem;
  --letter-spacing-sm: 0rem;
  --letter-spacing-xl: 0rem;
  --letter-spacing-xs: 0rem;
  --letter-spacing-2xl: 0rem;
  --letter-spacing-3xl: 0rem;
  --letter-spacing-4xl: -0.045rem;
  --letter-spacing-5xl: -0.0575rem;
  --letter-spacing-6xl: -0.075rem;
  --overlay-inverted-a1: #0000000d;
  --overlay-inverted-a2: #0000001a;
  --overlay-inverted-a3: #00000026;
  --overlay-inverted-a4: #00000033;
  --overlay-inverted-a5: #0000004d;
  --overlay-inverted-a6: #00000066;
  --overlay-inverted-a7: #00000080;
  --overlay-inverted-a8: #00000099;
  --overlay-inverted-a9: #000000b3;
  --overlay-inverted-a10: #000000cc;
  --overlay-inverted-a11: #000000e6;
  --overlay-inverted-a12: #000000f2;
  --interactive-height-lg: 3rem;
  --interactive-height-md: 2.5rem;
  --interactive-height-sm: 2rem;
}
  
  @media (prefers-color-scheme: light) {
      :host, :root {
  --bold: 700;
  --semi: 600;
  --medium: 500;
  --normal: 400;
  --bg-main: #fafafa;
  --brand-1: #000;
  --brand-2: #121212;
  --brand-3: #1F1F1F;
  --brand-4: #282828;
  --brand-5: #303030;
  --brand-6: #3A3A3A;
  --brand-7: #474747;
  --brand-8: #606060;
  --brand-9: #FFF;
  --text-lg: 1.125rem;
  --text-md: 1rem;
  --text-sm: 0.875rem;
  --text-xl: 1.25rem;
  --text-xs: 0.75rem;
  --brand-10: #F6F6F6;
  --brand-11: #B3B3B3;
  --brand-12: #EEE;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --border-lg: 2px;
  --border-md: 1px;
  --neutral-0: #000;
  --neutral-1: #000;
  --neutral-2: #121212;
  --neutral-3: #1F1F1F;
  --neutral-4: #282828;
  --neutral-5: #303030;
  --neutral-6: #3A3A3A;
  --neutral-7: #474747;
  --neutral-8: #606060;
  --neutral-9: #6D6D6D;
  --success-1: #0D1514;
  --success-2: #111C1B;
  --success-3: #0D2D2A;
  --success-4: #023B37;
  --success-5: #084843;
  --success-6: #145750;
  --success-7: #1C6961;
  --success-8: #207E73;
  --success-9: #12A594;
  --warning-1: #16120C;
  --warning-2: #1D180F;
  --warning-3: #302008;
  --warning-4: #3F2700;
  --warning-5: #4D3000;
  --warning-6: #5C3D05;
  --warning-7: #714F19;
  --warning-8: #8F6424;
  --warning-9: #FFC53D;
  --critical-1: #191113;
  --critical-2: #1E1517;
  --critical-3: #3A141E;
  --critical-4: #4E1325;
  --critical-5: #5E1A2E;
  --critical-6: #6F2539;
  --critical-7: #883447;
  --critical-8: #B3445A;
  --critical-9: #E54666;
  --neutral-10: #7A7A7A;
  --neutral-11: #B3B3B3;
  --neutral-12: #EEE;
  --overlay-a1: #ffffff0d;
  --overlay-a2: #ffffff1a;
  --overlay-a3: #ffffff26;
  --overlay-a4: #ffffff33;
  --overlay-a5: #ffffff4d;
  --overlay-a6: #ffffff66;
  --overlay-a7: #ffffff80;
  --overlay-a8: #ffffff99;
  --overlay-a9: #ffffffb3;
  --success-10: #0EB39E;
  --success-11: #0BD8B6;
  --success-12: #ADF0DD;
  --warning-10: #FFD60A;
  --warning-11: #FFCA16;
  --warning-12: #FFE7B3;
  --border-none: 0px;
  --critical-10: #EC5A72;
  --critical-11: #FF949D;
  --critical-12: #FED2E1;
  --overlay-a10: #ffffffcc;
  --overlay-a11: #ffffffe6;
  --overlay-a12: #fffffff2;
  --rounding-lg: 8px;
  --rounding-md: 4px;
  --rounding-sm: 2px;
  --badge-size-lg: 2rem;
  --badge-size-md: 2rem;
  --badge-size-sm: 1.5rem;
  --header-height: 4.5rem;
  --rounding-full: 9999px;
  --rounding-none: 0px;
  --avatar-size-lg: 3rem;
  --avatar-size-md: 2rem;
  --avatar-size-sm: 1.5rem;
  --line-height-lg: 1.75rem;
  --line-height-md: 1.5rem;
  --line-height-sm: 1.25rem;
  --line-height-xl: 1.875rem;
  --line-height-xs: 1.125rem;
  --line-height-2xl: 2rem;
  --line-height-3xl: 2.375rem;
  --line-height-4xl: 2.75rem;
  --line-height-5xl: 3.75rem;
  --line-height-6xl: 4.5rem;
  --side-menu-width: 240px;
  --spinner-size-lg: 1.75rem;
  --spinner-size-md: 1.5rem;
  --spinner-size-sm: 1.25rem;
  --toggle-height-md: 1.5rem;
  --letter-spacing-lg: 0rem;
  --letter-spacing-md: 0rem;
  --letter-spacing-sm: 0rem;
  --letter-spacing-xl: 0rem;
  --letter-spacing-xs: 0rem;
  --letter-spacing-2xl: 0rem;
  --letter-spacing-3xl: 0rem;
  --letter-spacing-4xl: -0.045rem;
  --letter-spacing-5xl: -0.0575rem;
  --letter-spacing-6xl: -0.075rem;
  --overlay-inverted-a1: #0000000d;
  --overlay-inverted-a2: #0000001a;
  --overlay-inverted-a3: #00000026;
  --overlay-inverted-a4: #00000033;
  --overlay-inverted-a5: #0000004d;
  --overlay-inverted-a6: #00000066;
  --overlay-inverted-a7: #00000080;
  --overlay-inverted-a8: #00000099;
  --overlay-inverted-a9: #000000b3;
  --overlay-inverted-a10: #000000cc;
  --overlay-inverted-a11: #000000e6;
  --overlay-inverted-a12: #000000f2;
  --interactive-height-lg: 3rem;
  --interactive-height-md: 2.5rem;
  --interactive-height-sm: 2rem;
}
    }
  [data-theme~="Default"] {
  --bold: 700;
  --semi: 600;
  --medium: 500;
  --normal: 400;
  --bg-main: #fafafa;
  --brand-1: #000;
  --brand-2: #121212;
  --brand-3: #1F1F1F;
  --brand-4: #282828;
  --brand-5: #303030;
  --brand-6: #3A3A3A;
  --brand-7: #474747;
  --brand-8: #606060;
  --brand-9: #FFF;
  --text-lg: 1.125rem;
  --text-md: 1rem;
  --text-sm: 0.875rem;
  --text-xl: 1.25rem;
  --text-xs: 0.75rem;
  --brand-10: #F6F6F6;
  --brand-11: #B3B3B3;
  --brand-12: #EEE;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --border-lg: 2px;
  --border-md: 1px;
  --neutral-0: #000;
  --neutral-1: #000;
  --neutral-2: #121212;
  --neutral-3: #1F1F1F;
  --neutral-4: #282828;
  --neutral-5: #303030;
  --neutral-6: #3A3A3A;
  --neutral-7: #474747;
  --neutral-8: #606060;
  --neutral-9: #6D6D6D;
  --success-1: #0D1514;
  --success-2: #111C1B;
  --success-3: #0D2D2A;
  --success-4: #023B37;
  --success-5: #084843;
  --success-6: #145750;
  --success-7: #1C6961;
  --success-8: #207E73;
  --success-9: #12A594;
  --warning-1: #16120C;
  --warning-2: #1D180F;
  --warning-3: #302008;
  --warning-4: #3F2700;
  --warning-5: #4D3000;
  --warning-6: #5C3D05;
  --warning-7: #714F19;
  --warning-8: #8F6424;
  --warning-9: #FFC53D;
  --critical-1: #191113;
  --critical-2: #1E1517;
  --critical-3: #3A141E;
  --critical-4: #4E1325;
  --critical-5: #5E1A2E;
  --critical-6: #6F2539;
  --critical-7: #883447;
  --critical-8: #B3445A;
  --critical-9: #E54666;
  --neutral-10: #7A7A7A;
  --neutral-11: #B3B3B3;
  --neutral-12: #EEE;
  --overlay-a1: #ffffff0d;
  --overlay-a2: #ffffff1a;
  --overlay-a3: #ffffff26;
  --overlay-a4: #ffffff33;
  --overlay-a5: #ffffff4d;
  --overlay-a6: #ffffff66;
  --overlay-a7: #ffffff80;
  --overlay-a8: #ffffff99;
  --overlay-a9: #ffffffb3;
  --success-10: #0EB39E;
  --success-11: #0BD8B6;
  --success-12: #ADF0DD;
  --warning-10: #FFD60A;
  --warning-11: #FFCA16;
  --warning-12: #FFE7B3;
  --border-none: 0px;
  --critical-10: #EC5A72;
  --critical-11: #FF949D;
  --critical-12: #FED2E1;
  --overlay-a10: #ffffffcc;
  --overlay-a11: #ffffffe6;
  --overlay-a12: #fffffff2;
  --rounding-lg: 8px;
  --rounding-md: 4px;
  --rounding-sm: 2px;
  --badge-size-lg: 2rem;
  --badge-size-md: 2rem;
  --badge-size-sm: 1.5rem;
  --header-height: 4.5rem;
  --rounding-full: 9999px;
  --rounding-none: 0px;
  --avatar-size-lg: 3rem;
  --avatar-size-md: 2rem;
  --avatar-size-sm: 1.5rem;
  --line-height-lg: 1.75rem;
  --line-height-md: 1.5rem;
  --line-height-sm: 1.25rem;
  --line-height-xl: 1.875rem;
  --line-height-xs: 1.125rem;
  --line-height-2xl: 2rem;
  --line-height-3xl: 2.375rem;
  --line-height-4xl: 2.75rem;
  --line-height-5xl: 3.75rem;
  --line-height-6xl: 4.5rem;
  --side-menu-width: 240px;
  --spinner-size-lg: 1.75rem;
  --spinner-size-md: 1.5rem;
  --spinner-size-sm: 1.25rem;
  --toggle-height-md: 1.5rem;
  --letter-spacing-lg: 0rem;
  --letter-spacing-md: 0rem;
  --letter-spacing-sm: 0rem;
  --letter-spacing-xl: 0rem;
  --letter-spacing-xs: 0rem;
  --letter-spacing-2xl: 0rem;
  --letter-spacing-3xl: 0rem;
  --letter-spacing-4xl: -0.045rem;
  --letter-spacing-5xl: -0.0575rem;
  --letter-spacing-6xl: -0.075rem;
  --overlay-inverted-a1: #0000000d;
  --overlay-inverted-a2: #0000001a;
  --overlay-inverted-a3: #00000026;
  --overlay-inverted-a4: #00000033;
  --overlay-inverted-a5: #0000004d;
  --overlay-inverted-a6: #00000066;
  --overlay-inverted-a7: #00000080;
  --overlay-inverted-a8: #00000099;
  --overlay-inverted-a9: #000000b3;
  --overlay-inverted-a10: #000000cc;
  --overlay-inverted-a11: #000000e6;
  --overlay-inverted-a12: #000000f2;
  --interactive-height-lg: 3rem;
  --interactive-height-md: 2.5rem;
  --interactive-height-sm: 2rem;
}
[data-theme~="Dark Theme"] {
  --bg-main: #09090b;
}


@layer base {
  
  body, :host {
    /* Color */
    
    /* Fonts */
    --font-geist: 'Geist',sans-serif;
--font-geistmono: 'Geist Mono',monospace;

    /* 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;
    }
  }
}

      
  .fzppFU {
    width:100%;
  min-height:100vh;
  align-items:start;
  justify-content:start;
  overflow-x:hidden;
  overflow-y:hidden;
  }
      

      
        
      
      
  .biHOeH {
    flex-grow:.75;
  background:#ffffff03;
  flex-basis:0%;
  flex-shrink:1;
  border-color:#18181b;
  border-style:solid;
  border-width:1px;
  border-top-left-radius:16px;
  border-top-right-radius:16px;
  border-bottom-left-radius:16px;
  border-bottom-right-radius:16px;
  }
      

      
        
      
      
  .cCHair {
    width:100%;
  height:100%;
  background:#09090b;
  padding-top:1rem;
  padding-left:1rem;
  padding-right:1rem;
  padding-bottom:1rem;
  }
      

      
        
      
      
  .RtJus {
    flex-grow:1;
  background:#ffffff03;
  flex-basis:0%;
  flex-shrink:1;
  border-color:#18181b;
  border-style:solid;
  border-width:1px;
  border-top-left-radius:16px;
  border-top-right-radius:16px;
  border-bottom-left-radius:16px;
  border-bottom-right-radius:16px;
  }
      

      
        
      
      
  .bJlkiz {
    flex:1;
  background:#ffffff03;
  border-color:#18181b;
  border-style:solid;
  border-width:1px;
  border-top-left-radius:16px;
  border-top-right-radius:16px;
  border-bottom-left-radius:16px;
  border-bottom-right-radius:16px;
  }
      

      
        
      
      
  .jdcUL {
    flex-grow:.5;
  background:url("/cdn-cgi/imagedelivery/ZIty0Vhmkm0nD-fBKJrTZQ/seundev:GeneratedImageOctober232025-1_42PM(1).jpg/public") no-repeat no-repeat center center / cover #ffffff03;
  flex-basis:0%;
  flex-shrink:1;
  border-color:#18181b;
  border-style:solid;
  border-width:1px;
  border-top-left-radius:16px;
  border-top-right-radius:16px;
  border-bottom-left-radius:16px;
  border-bottom-right-radius:16px;
  }
      

      
        
      
      
  .frXAYL {
    height:100%;
  padding-top:1rem;
  border-color:#18181b;
  border-style:solid;
  border-width:1px;
  padding-left:1rem;
  padding-right:1rem;
  padding-bottom:1rem;
  border-top-left-radius:24px;
  border-top-right-radius:24px;
  border-bottom-left-radius:24px;
  border-bottom-right-radius:24px;
  }
      

      
        
      
      
  .dfCoBA {
    flex:1;
  display:flex;
  row-gap:16px;
  column-gap:16px;
  flex-direction:row;
  }
      

      
        
      
      
  .dvgZTu {
    flex-grow:.5;
  background:#ffffff03;
  flex-basis:0%;
  flex-shrink:1;
  border-color:#18181b;
  border-style:solid;
  border-width:1px;
  border-top-left-radius:16px;
  border-top-right-radius:16px;
  border-bottom-left-radius:16px;
  border-bottom-right-radius:16px;
  }
      

      
        
      
      
  .ejzUYc {
    flex-grow:.25;
  background:#ffffff03;
  flex-basis:0%;
  flex-shrink:1;
  border-color:#18181b;
  border-style:solid;
  border-width:1px;
  border-top-left-radius:16px;
  border-top-right-radius:16px;
  border-bottom-left-radius:16px;
  border-bottom-right-radius:16px;
  }
      

      
        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  .cgGrpZ {
    height:var(--height);
  position:fixed;
  align-items:start;
  pointer-events:none;
  justify-content:start;
  }
      

      
        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  .so-toast-provider\:3HNY67eQbyTMKV7wPLZZf {
    width:100%;
  display:flex;
  position:relative;
  max-width:360px;
  transition:height 150ms ease 0ms normal;
  flex-direction:column;
  }
      

      
        
      
      
  .bHYIqa {
    top:var(--top);
  width:100%;
  position:absolute;
  pointer-events:all;
  }
      

      
  .bHYIqa.swipe-out-top {
    translate:0 -100%;
  }
      


  .bHYIqa.swipe-out-right {
    translate:100% 0px;
  }
      


  .bHYIqa.swipe-out-bottom {
    translate:0 100%;
  }
      


  .bHYIqa.swipe-out-left {
    translate:-100% 0px;
  }
      

        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  .so-toast\:root {
    gap:0.75rem;
  color:var(--neutral-11, #B5B2BC);
  width:100%;
  opacity:0;
  translate:0 16px;
  padding-top:1rem;
  border-color:var(--neutral-6, #3C393F);
  border-style:solid;
  border-width:1px;
  padding-left:1rem;
  border-radius:var(--rounding-lg);
  padding-right:1rem;
  padding-bottom:1rem;
  background-color:var(--neutral-0, #0b0a0b);
  }
      

      
  .so-toast\:root.open {
    opacity:1;
  translate:0 0px;
  transition:translate 250ms ease 0ms normal, top 150ms ease 0ms normal;
  }
      


  .so-toast\:root.closing {
    opacity:0;
  translate:0 -16px;
  }
      


  .so-toast\:root.open-transition {
    transition:all 250ms ease 0ms normal;
  }
      


  .so-toast\:root.close-transition {
    transition:all 150ms ease 0ms normal;
  }
      


  .so-toast\:root.success {
    color:var(--success-11, #0BD8B6);
  border-color:var(--success-6, #145750);
  border-style:solid;
  border-width:1px;
  background-color:var(--success-2, #111C1B);
  }
      


  .so-toast\:root.warning {
    color:var(--warning-11, #FFCA16);
  border-color:var(--warning-6, #5C3D05);
  border-style:solid;
  border-width:1px;
  background-color:var(--warning-2, #1D180F);
  }
      


  .so-toast\:root.critical {
    color:var(--critical-11, #FF949D);
  border-color:var(--critical-6, #6F2539);
  border-style:solid;
  border-width:1px;
  background-color:var(--critical-2, #1E1517);
  }
      

        
      
      
  .rKRcu {
    gap:0.5rem;
  flex-direction:row;
  }
      

      
        
      
      
  .bpWTwZ {
    color:var(--neutral-11, #B5B2BC);
  display:inline-block;
  font-size:var(--font-size);
  margin-top:var(--margin-top);
  font-family:'Geist';
  font-weight:inherit;
  line-height:var(--line-height);
  white-space:normal;
  margin-bottom:var(--margin-bottom);
  letter-spacing:var(--letter-spacing);
  }
      

      
  .bpWTwZ.truncated {
    overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  }
      


  .bpWTwZ.clamped {
    display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:var(--clamp-lines);
  }
      

        
      
      
  .so-toast\:FW2tKddjmqBb2S_WPmtMS {
    color:inherit;
  }
      

      
        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  .eTkKzJ {
    color:inherit;
  width:1.25rem;
  height:1.25rem;
  font-size:inherit;
  font-family:inherit;
  font-weight:inherit;
  }
      

      
        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  .hcnGD {
    color:var(--EEE, #EEEEF0);
  width:100%;
  font-size:var(--font-size);
  margin-top:var(--margin-top);
  font-family:'Geist';
  font-weight:var(--bold);
  line-height:var(--line-height);
  white-space:normal;
  margin-bottom:var(--margin-bottom);
  letter-spacing:-0.025em;
  }
      

      
  .hcnGD.truncated {
    overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  }
      


  .hcnGD.clamped {
    display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:var(--clamp-lines);
  }
      

        
      
      
  .so-toast\:gYVdDIDxaBXSrlkux9YPE {
    flex:1;
  color:inherit;
  }
      

      
        
      
      
  .bWpTnd {
    width:fit-content;
  height:auto;
  }
      

      
        
      
      
  .so-button-tertiary\:root {
    gap:0.5rem;
  color:var(--neutral-12, #EEEEF0);
  width:fit-content;
  cursor:default;
  height:var(--interactive-height-md);
  font-size:var(--text-sm);
  overflow-x:hidden;
  overflow-y:hidden;
  transition:background-color 200ms ease 0ms normal;
  align-items:center;
  font-family:'Geist';
  font-weight:var(--medium);
  user-select:none;
  padding-left:0.75rem;
  border-radius:var(--rounding-md);
  outline-color:transparent;
  outline-style:solid;
  outline-width:var(--border-lg);
  padding-right:0.75rem;
  flex-direction:row;
  outline-offset:var(--border-md);
  -ms-user-select:none;
  justify-content:center;
  -moz-user-select:none;
  background-color:var(--overlay-a1, #ffffff0d);
  -webkit-user-select:none;
  -webkit-tap-highlight-color:transparent;
  }
      

      
  .so-button-tertiary\:root:hover {
    background-color:var(--overlay-a2, #ffffff1a);
  }
      


  .so-button-tertiary\:root:active {
    transition:none;
  background-color:var(--overlay-a3, #ffffff26);
  }
      


  .so-button-tertiary\:root:focus-visible {
    outline-color:var(--brand-8, #6958AD);
  outline-style:solid;
  outline-width:var(--border-lg);
  outline-offset:var(--border-md);
  }
      


  .so-button-tertiary\:root.trigger-open {
    background-color:var(--overlay-a3, #ffffff26);
  }
      


  .so-button-tertiary\:root.disabled {
    opacity:0.5;
  background-color:var(--overlay-a1, #ffffff0d);
  }
      

        
      
      
  .so-toast\:qAcThqFGvMbu5lzhtPxSk {
    width:var(--text-lg);
  height:var(--text-lg);
  padding-top:0px;
  padding-left:0px;
  padding-right:0px;
  padding-bottom:0px;
  background-color:transparent;
  }
      

      
  .so-toast\:qAcThqFGvMbu5lzhtPxSk:hover {
    background-color:transparent;
  }
      


  .so-toast\:qAcThqFGvMbu5lzhtPxSk:active {
    background-color:transparent;
  }
      

        
      
      
  
      

      
        
      
      
  .ezeRiZ {
    width:var(--width);
  height:var(--height);
  position:fixed;
  align-items:start;
  pointer-events:none;
  justify-content:start;
  }
      

      
        
      
      
  
      

      
        
      
      
  .so-toast-provider\:jTe6cSAqqTerlGKuSJFnv {
    align-items:end;
  padding-top:1.25rem;
  padding-left:1.25rem;
  padding-right:1.25rem;
  padding-bottom:1.25rem;
  justify-content:start;
  }
      

      
          @media (max-width: 1024px) {
            
  .so-toast-provider\:jTe6cSAqqTerlGKuSJFnv {
    align-items:center;
  justify-content:start;
  }
      

          }
          
        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  
      

      
        
      
      
  .dFEgfB {
    display:flex;
  row-gap:16px;
  flex-grow:1;
  column-gap:16px;
  flex-basis:0%;
  flex-shrink:1;
  flex-direction:row;
  }
      

      
        
      
      
  .fokkYf {
    row-gap:16px;
  flex-grow:.5;
  column-gap:16px;
  flex-basis:0%;
  flex-shrink:1;
  }
      

      
        
      
      
  .zanGA {
    flex:1;
  display:flex;
  row-gap:16px;
  column-gap:16px;
  flex-direction:column;
  }
      

      
        
      
      
  .dpMOA {
    width:100%;
  height:100%;
  display:flex;
  row-gap:16px;
  column-gap:16px;
  align-items:stretch;
  flex-direction:row;
  justify-content:flex-start;
  border-top-left-radius:16px;
  border-top-right-radius:16px;
  border-bottom-left-radius:16px;
  border-bottom-right-radius:16px;
  }
      

      
        
      
      
  .eHmYD {
    display:flex;
  row-gap:16px;
  flex-grow:.25;
  column-gap:16px;
  flex-basis:0%;
  flex-shrink:1;
  flex-direction:column;
  }
      

      
        
      
      
  .eTTmdr {
    font-family:Geist;
  width:100%;
  height:100%;
  position:absolute;
  }