
  

  
  @property --sky-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #05121D;
}
@property --sky-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #091B28;
}
@property --sky-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #002944;
}
@property --sky-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00375B;
}
@property --sky-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00446F;
}
@property --sky-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #005383;
}
@property --sky-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00659C;
}
@property --sky-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #007ABC;
}
@property --sky-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0284C7;
}
@property --blue-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0A111D;
}
@property --blue-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0F1727;
}
@property --blue-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #11244C;
}
@property --blue-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #142E67;
}
@property --blue-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1A397A;
}
@property --blue-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #22448B;
}
@property --blue-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2B509F;
}
@property --blue-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #325EBB;
}
@property --blue-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2563EB;
}
@property --pink-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #170E11;
}
@property --pink-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #201217;
}
@property --pink-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3A1421;
}
@property --pink-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #500F2A;
}
@property --pink-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5F1633;
}
@property --pink-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #702340;
}
@property --pink-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #893252;
}
@property --pink-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B2416B;
}
@property --pink-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DB2777;
}
@property --sky-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0077B9;
}
@property --sky-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6EC3FF;
}
@property --sky-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C6EEFF;
}
@property --blue-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #315DBA;
}
@property --blue-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #88B5FF;
}
@property --blue-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #D1E2FF;
}
@property --brand-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0F101B;
}
@property --brand-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #151625;
}
@property --brand-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #212247;
}
@property --brand-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2A2963;
}
@property --brand-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #333373;
}
@property --brand-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3D3E81;
}
@property --brand-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #494A95;
}
@property --brand-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5759B1;
}
@property --brand-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7C7EF3;
}
@property --green-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0E130C;
}
@property --green-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #151A13;
}
@property --green-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1E291A;
}
@property --green-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #25391D;
}
@property --green-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2E4724;
}
@property --green-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #37562B;
}
@property --green-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #426633;
}
@property --green-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4C773B;
}
@property --green-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6AB04C;
}
@property --pink-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #CB0B6A;
}
@property --pink-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF8AB4;
}
@property --pink-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD2DF;
}
@property --brand-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7171E5;
}
@property --brand-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #A6ACFF;
}
@property --brand-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DCE0FE;
}
@property --green-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5EA440;
}
@property --green-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #87CD6B;
}
@property --green-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C8EFBA;
}
@property --orange-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #16100D;
}
@property --orange-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F1510;
}
@property --orange-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #341C0F;
}
@property --orange-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4A1D02;
}
@property --orange-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #582606;
}
@property --orange-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #683417;
}
@property --orange-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7F4424;
}
@property --orange-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #A3582E;
}
@property --orange-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F97316;
}
@property --border-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2px;
}
@property --border-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1px;
}
@property --fuchsia-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #160D17;
}
@property --fuchsia-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #211123;
}
@property --fuchsia-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #38133C;
}
@property --fuchsia-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4A1051;
}
@property --fuchsia-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #57185F;
}
@property --fuchsia-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #64256D;
}
@property --fuchsia-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7C3485;
}
@property --fuchsia-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #9E44AA;
}
@property --fuchsia-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C026D3;
}
@property --neutral-0 {
  syntax: "<color>";
  inherits: true;
  initial-value: #131314;
}
@property --neutral-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #171719;
}
@property --neutral-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1E1E1F;
}
@property --neutral-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #262628;
}
@property --neutral-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2C2C2F;
}
@property --neutral-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #323236;
}
@property --neutral-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3B3B3F;
}
@property --neutral-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #48484E;
}
@property --neutral-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #606068;
}
@property --neutral-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6E6E77;
}
@property --orange-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EC6700;
}
@property --orange-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF9D62;
}
@property --orange-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFDDC9;
}
@property --success-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #111915;
}
@property --success-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #141E19;
}
@property --success-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #122F22;
}
@property --success-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0C3D29;
}
@property --success-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #104A33;
}
@property --success-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #18583E;
}
@property --success-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F694B;
}
@property --success-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #227D5A;
}
@property --success-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #10B981;
}
@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: #191111;
}
@property --critical-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #201314;
}
@property --critical-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3B1219;
}
@property --critical-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #500F1C;
}
@property --critical-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #611623;
}
@property --critical-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #72232D;
}
@property --critical-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #8C333A;
}
@property --critical-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B54548;
}
@property --critical-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E5484D;
}
@property --fuchsia-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B105C4;
}
@property --fuchsia-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F784FF;
}
@property --fuchsia-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F9D0FE;
}
@property --neutral-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7B7B84;
}
@property --neutral-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B3B3BB;
}
@property --neutral-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EEEEF0;
}
@property --neutral-a0 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000000;
}
@property --neutral-a1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000000;
}
@property --neutral-a2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F7F7F908;
}
@property --neutral-a3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E1E1FC13;
}
@property --neutral-a4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DDDDFA1B;
}
@property --neutral-a5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DCDCF923;
}
@property --neutral-a6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E8E8FF2C;
}
@property --neutral-a7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E4E4FD3D;
}
@property --neutral-a8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E6E6FD5A;
}
@property --neutral-a9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E9E9FE6A;
}
@property --overlay-a1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff0a;
}
@property --overlay-a2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff14;
}
@property --overlay-a3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff1f;
}
@property --overlay-a4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff2e;
}
@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: #00AD76;
}
@property --success-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #43D59B;
}
@property --success-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #A9F2CE;
}
@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: #EC5D5E;
}
@property --critical-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF9592;
}
@property --critical-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD1D9;
}
@property --neutral-a10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ECECFF78;
}
@property --neutral-a11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F3F3FEB5;
}
@property --neutral-a12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FDFDFFEF;
}
@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: 10px;
}
@property --rounding-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 6px;
}
@property --rounding-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 4px;
}
@property --rounding-xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 16px;
}
@property --rounding-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2px;
}
@property --font-size-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.125rem;
}
@property --font-size-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1rem;
}
@property --font-size-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.875rem;
}
@property --font-size-xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.25rem;
}
@property --font-size-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.75rem;
}
@property --button--scale {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --font-size-2xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --font-size-3xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.875rem;
}
@property --font-size-4xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.25rem;
}
@property --font-size-5xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3rem;
}
@property --font-size-6xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3.75rem;
}
@property --header-height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3.75rem;
}
@property --loader--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --rounding-full {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 9999px;
}
@property --rounding-none {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@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 --loader--size-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --loader--size-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --loader--size-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --font-family-sans {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --font-weight-bold {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --spacing-fixed-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --spacing-fixed-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --spacing-fixed-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --spacing-fixed-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --toggle-height-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.75rem;
}
@property --toggle-height-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --toggle-height-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.25rem;
}
@property --button--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--height-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--height-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--height-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@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 --spacing-fixed-2xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --spacing-fixed-3xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--padding-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--padding-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--padding-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--spacing-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--spacing-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--spacing-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --font-weight-medium {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@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 --button--font-family {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --button--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --font-weight-regular {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --overlay-inverted-a1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1212140d;
}
@property --overlay-inverted-a2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1212140d;
}
@property --overlay-inverted-a3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #12121426;
}
@property --overlay-inverted-a4 {
  syntax: "<color>";
  inherits: true;
  initial-value: a4: #12121433;
}
@property --overlay-inverted-a5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1212144d;
}
@property --overlay-inverted-a6 {
  syntax: "<color>";
  inherits: true;
  initial-value:  #12121466;
}
@property --overlay-inverted-a7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #12121480;
}
@property --overlay-inverted-a8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #12121499;
}
@property --overlay-inverted-a9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121214b3;
}
@property --signin-form-opacity {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --loader--stroke-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --overlay-inverted-a10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121214cc;
}
@property --overlay-inverted-a11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121214e6;
}
@property --overlay-inverted-a12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121214f2;
}
@property --button--icon--size-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--icon--size-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--icon--size-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--loader--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button--outline-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button--outline-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--scale_pressed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --button-primary--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --interactive-height-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3rem;
}
@property --interactive-height-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.75rem;
}
@property --interactive-height-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.25rem;
}
@property --loader--track-opacity {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --button--outline-offset {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-ghost--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-tertiary--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --transition-duration-sm {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --transition-duration-xs {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --button-secondary--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button--loader--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button--opacity_disabled {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --button-primary--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-tertiary--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --loader--animation-duration {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --button--transition-duration {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --button--transition-function {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --button-primary--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --transition-function-on-screen {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --button-secondary--border-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--border-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-tertiary--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-primary--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--color-critical {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-primary--bg-color-critical {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-tertiary--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button--transition-duration_pressed {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --button-secondary--bg-color-critical {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-primary--bg-color-critical_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--border-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--border-color-critical {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-primary--bg-color-critical_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--bg-color-critical_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--border-color-critical_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}

  :host, :root {
  --sky-1: #05121D;
  --sky-2: #091B28;
  --sky-3: #002944;
  --sky-4: #00375B;
  --sky-5: #00446F;
  --sky-6: #005383;
  --sky-7: #00659C;
  --sky-8: #007ABC;
  --sky-9: #0284C7;
  --blue-1: #0A111D;
  --blue-2: #0F1727;
  --blue-3: #11244C;
  --blue-4: #142E67;
  --blue-5: #1A397A;
  --blue-6: #22448B;
  --blue-7: #2B509F;
  --blue-8: #325EBB;
  --blue-9: #2563EB;
  --pink-1: #170E11;
  --pink-2: #201217;
  --pink-3: #3A1421;
  --pink-4: #500F2A;
  --pink-5: #5F1633;
  --pink-6: #702340;
  --pink-7: #893252;
  --pink-8: #B2416B;
  --pink-9: #DB2777;
  --sky-10: #0077B9;
  --sky-11: #6EC3FF;
  --sky-12: #C6EEFF;
  --blue-10: #315DBA;
  --blue-11: #88B5FF;
  --blue-12: #D1E2FF;
  --brand-1: #0F101B;
  --brand-2: #151625;
  --brand-3: #212247;
  --brand-4: #2A2963;
  --brand-5: #333373;
  --brand-6: #3D3E81;
  --brand-7: #494A95;
  --brand-8: #5759B1;
  --brand-9: #7C7EF3;
  --green-1: #0E130C;
  --green-2: #151A13;
  --green-3: #1E291A;
  --green-4: #25391D;
  --green-5: #2E4724;
  --green-6: #37562B;
  --green-7: #426633;
  --green-8: #4C773B;
  --green-9: #6AB04C;
  --pink-10: #CB0B6A;
  --pink-11: #FF8AB4;
  --pink-12: #FFD2DF;
  --brand-10: #7171E5;
  --brand-11: #A6ACFF;
  --brand-12: #DCE0FE;
  --green-10: #5EA440;
  --green-11: #87CD6B;
  --green-12: #C8EFBA;
  --orange-1: #16100D;
  --orange-2: #1F1510;
  --orange-3: #341C0F;
  --orange-4: #4A1D02;
  --orange-5: #582606;
  --orange-6: #683417;
  --orange-7: #7F4424;
  --orange-8: #A3582E;
  --orange-9: #F97316;
  --border-lg: 2px;
  --border-md: 1px;
  --fuchsia-1: #160D17;
  --fuchsia-2: #211123;
  --fuchsia-3: #38133C;
  --fuchsia-4: #4A1051;
  --fuchsia-5: #57185F;
  --fuchsia-6: #64256D;
  --fuchsia-7: #7C3485;
  --fuchsia-8: #9E44AA;
  --fuchsia-9: #C026D3;
  --neutral-0: #131314;
  --neutral-1: #171719;
  --neutral-2: #1E1E1F;
  --neutral-3: #262628;
  --neutral-4: #2C2C2F;
  --neutral-5: #323236;
  --neutral-6: #3B3B3F;
  --neutral-7: #48484E;
  --neutral-8: #606068;
  --neutral-9: #6E6E77;
  --orange-10: #EC6700;
  --orange-11: #FF9D62;
  --orange-12: #FFDDC9;
  --success-1: #111915;
  --success-2: #141E19;
  --success-3: #122F22;
  --success-4: #0C3D29;
  --success-5: #104A33;
  --success-6: #18583E;
  --success-7: #1F694B;
  --success-8: #227D5A;
  --success-9: #10B981;
  --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: #191111;
  --critical-2: #201314;
  --critical-3: #3B1219;
  --critical-4: #500F1C;
  --critical-5: #611623;
  --critical-6: #72232D;
  --critical-7: #8C333A;
  --critical-8: #B54548;
  --critical-9: #E5484D;
  --fuchsia-10: #B105C4;
  --fuchsia-11: #F784FF;
  --fuchsia-12: #F9D0FE;
  --neutral-10: #7B7B84;
  --neutral-11: #B3B3BB;
  --neutral-12: #EEEEF0;
  --neutral-a0: #00000000;
  --neutral-a1: #00000000;
  --neutral-a2: #F7F7F908;
  --neutral-a3: #E1E1FC13;
  --neutral-a4: #DDDDFA1B;
  --neutral-a5: #DCDCF923;
  --neutral-a6: #E8E8FF2C;
  --neutral-a7: #E4E4FD3D;
  --neutral-a8: #E6E6FD5A;
  --neutral-a9: #E9E9FE6A;
  --overlay-a1: #ffffff0a;
  --overlay-a2: #ffffff14;
  --overlay-a3: #ffffff1f;
  --overlay-a4: #ffffff2e;
  --overlay-a5: #ffffff4d;
  --overlay-a6: #ffffff66;
  --overlay-a7: #ffffff80;
  --overlay-a8: #ffffff99;
  --overlay-a9: #ffffffb3;
  --success-10: #00AD76;
  --success-11: #43D59B;
  --success-12: #A9F2CE;
  --warning-10: #FFD60A;
  --warning-11: #FFCA16;
  --warning-12: #FFE7B3;
  --border-none: 0px;
  --critical-10: #EC5D5E;
  --critical-11: #FF9592;
  --critical-12: #FFD1D9;
  --neutral-a10: #ECECFF78;
  --neutral-a11: #F3F3FEB5;
  --neutral-a12: #FDFDFFEF;
  --overlay-a10: #ffffffcc;
  --overlay-a11: #ffffffe6;
  --overlay-a12: #fffffff2;
  --rounding-lg: 10px;
  --rounding-md: 6px;
  --rounding-sm: 4px;
  --rounding-xl: 16px;
  --rounding-xs: 2px;
  --font-size-lg: 1.125rem;
  --font-size-md: 1rem;
  --font-size-sm: 0.875rem;
  --font-size-xl: 1.25rem;
  --font-size-xs: 0.75rem;
  --button--scale: 1;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-size-5xl: 3rem;
  --font-size-6xl: 3.75rem;
  --header-height: 3.75rem;
  --loader--color: var(--neutral-12);
  --rounding-full: 9999px;
  --rounding-none: 0px;
  --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;
  --loader--size-lg: calc(var(--interactive-height-lg) - 1.25rem);
  --loader--size-md: calc(var(--interactive-height-md) - 1rem);
  --loader--size-sm: calc(var(--interactive-height-sm) - 0.75rem);
  --button--rounding: var(--rounding-md);
  --font-family-sans: DM Sans;
  --font-weight-bold: 700;
  --spacing-fixed-lg: 20px;
  --spacing-fixed-md: 16px;
  --spacing-fixed-sm: 12px;
  --spacing-fixed-xs: 8px;
  --toggle-height-lg: 1.75rem;
  --toggle-height-md: 1.5rem;
  --toggle-height-sm: 1.25rem;
  --button--font-size: var(--font-size-md);
  --button--height-lg: var(--interactive-height-lg);
  --button--height-md: var(--interactive-height-md);
  --button--height-sm: var(--interactive-height-sm);
  --letter-spacing-lg: 0rem;
  --letter-spacing-md: 0rem;
  --letter-spacing-sm: 0rem;
  --letter-spacing-xl: 0rem;
  --letter-spacing-xs: 0rem;
  --spacing-fixed-2xs: 6px;
  --spacing-fixed-3xs: 4px;
  --button--padding-lg: var(--spacing-fixed-md);
  --button--padding-md: var(--spacing-fixed-sm);
  --button--padding-sm: var(--spacing-fixed-xs);
  --button--spacing-lg: var(--spacing-fixed-2xs);
  --button--spacing-md: var(--spacing-fixed-3xs);
  --button--spacing-sm: var(--spacing-fixed-3xs);
  --font-weight-medium: 500;
  --letter-spacing-2xl: 0rem;
  --letter-spacing-3xl: 0rem;
  --letter-spacing-4xl: -0.045rem;
  --letter-spacing-5xl: -0.0575rem;
  --letter-spacing-6xl: -0.075rem;
  --button--font-family: var(--font-family-sans);
  --button--font-weight: var(--font-weight-medium);
  --font-weight-regular: 400;
  --overlay-inverted-a1: #1212140d;
  --overlay-inverted-a2: #1212140d;
  --overlay-inverted-a3: #12121426;
  --overlay-inverted-a4: a4: #12121433;
  --overlay-inverted-a5: #1212144d;
  --overlay-inverted-a6:  #12121466;
  --overlay-inverted-a7: #12121480;
  --overlay-inverted-a8: #12121499;
  --overlay-inverted-a9: #121214b3;
  --loader--stroke-width: 0.25rem;
  --overlay-inverted-a10: #121214cc;
  --overlay-inverted-a11: #121214e6;
  --overlay-inverted-a12: #121214f2;
  --button--icon--size-lg: 1.25rem;
  --button--icon--size-md: 1.25rem;
  --button--icon--size-sm: 1rem;
  --button--loader--color: var(--neutral-12);
  --button--outline-color: var(--neutral-12);
  --button--outline-width: var(--border-lg);
  --button--scale_pressed: 0.99;
  --button-primary--color: var(--neutral-0);
  --interactive-height-lg: 3rem;
  --interactive-height-md: 2.75rem;
  --interactive-height-sm: 2.25rem;
  --loader--track-opacity: 0.3;
  --button--outline-offset: var(--border-none);
  --button-ghost--bg-color: var(--transparent);
  --button-tertiary--color: var(--neutral-12);
  --transition-duration-sm: 150ms;
  --transition-duration-xs: 25ms;
  --button-secondary--color: var(--neutral-12);
  --button--loader--bg-color: var(--neutral-0);
  --button--opacity_disabled: 0.6;
  --button-primary--bg-color: var(--brand-9);
  --button-tertiary--bg-color: var(--neutral-2);
  --button-secondary--bg-color: var(--neutral-3);
  --loader--animation-duration: 1000ms;
  --button--transition-duration: var(--transition-duration-sm);
  --button--transition-function: var(--transition-function-on-screen);
  --button-primary--bg-color_open: var(--brand-10);
  --transition-function-on-screen: ease;
  --button-secondary--border-color: var(--neutral-6);
  --button-secondary--border-width: var(--border-md);
  --button-tertiary--bg-color_open: var(--neutral-3);
  --button-secondary--bg-color_open: var(--neutral-2);
  --button-primary--bg-color_hovered: var(--brand-11);
  --button-secondary--color-critical: var(--critical-11);
  --button-primary--bg-color-critical: var(--critical-9);
  --button-tertiary--bg-color_hovered: var(--neutral-3);
  --button-secondary--bg-color_hovered: var(--neutral-2);
  --button--transition-duration_pressed: var(--transition-duration-xs);
  --button-secondary--bg-color-critical: var(--critical-2);
  --button-primary--bg-color-critical_open: var(--critical-10);
  --button-secondary--border-color_hovered: var(--neutral-7);
  --button-secondary--border-color-critical: var(--critical-6);
  --button-primary--bg-color-critical_hovered: var(--critical-11);
  --button-secondary--bg-color-critical_hovered: var(--critical-1);
  --button-secondary--border-color-critical_hovered: var(--critical-7);
}
  
  
  [data-nc-theme~="Default"] {
  --sky-1: #05121D;
  --sky-2: #091B28;
  --sky-3: #002944;
  --sky-4: #00375B;
  --sky-5: #00446F;
  --sky-6: #005383;
  --sky-7: #00659C;
  --sky-8: #007ABC;
  --sky-9: #0284C7;
  --blue-1: #0A111D;
  --blue-2: #0F1727;
  --blue-3: #11244C;
  --blue-4: #142E67;
  --blue-5: #1A397A;
  --blue-6: #22448B;
  --blue-7: #2B509F;
  --blue-8: #325EBB;
  --blue-9: #2563EB;
  --pink-1: #170E11;
  --pink-2: #201217;
  --pink-3: #3A1421;
  --pink-4: #500F2A;
  --pink-5: #5F1633;
  --pink-6: #702340;
  --pink-7: #893252;
  --pink-8: #B2416B;
  --pink-9: #DB2777;
  --sky-10: #0077B9;
  --sky-11: #6EC3FF;
  --sky-12: #C6EEFF;
  --blue-10: #315DBA;
  --blue-11: #88B5FF;
  --blue-12: #D1E2FF;
  --brand-1: #0F101B;
  --brand-2: #151625;
  --brand-3: #212247;
  --brand-4: #2A2963;
  --brand-5: #333373;
  --brand-6: #3D3E81;
  --brand-7: #494A95;
  --brand-8: #5759B1;
  --brand-9: #7C7EF3;
  --green-1: #0E130C;
  --green-2: #151A13;
  --green-3: #1E291A;
  --green-4: #25391D;
  --green-5: #2E4724;
  --green-6: #37562B;
  --green-7: #426633;
  --green-8: #4C773B;
  --green-9: #6AB04C;
  --pink-10: #CB0B6A;
  --pink-11: #FF8AB4;
  --pink-12: #FFD2DF;
  --brand-10: #7171E5;
  --brand-11: #A6ACFF;
  --brand-12: #DCE0FE;
  --green-10: #5EA440;
  --green-11: #87CD6B;
  --green-12: #C8EFBA;
  --orange-1: #16100D;
  --orange-2: #1F1510;
  --orange-3: #341C0F;
  --orange-4: #4A1D02;
  --orange-5: #582606;
  --orange-6: #683417;
  --orange-7: #7F4424;
  --orange-8: #A3582E;
  --orange-9: #F97316;
  --border-lg: 2px;
  --border-md: 1px;
  --fuchsia-1: #160D17;
  --fuchsia-2: #211123;
  --fuchsia-3: #38133C;
  --fuchsia-4: #4A1051;
  --fuchsia-5: #57185F;
  --fuchsia-6: #64256D;
  --fuchsia-7: #7C3485;
  --fuchsia-8: #9E44AA;
  --fuchsia-9: #C026D3;
  --neutral-0: #131314;
  --neutral-1: #171719;
  --neutral-2: #1E1E1F;
  --neutral-3: #262628;
  --neutral-4: #2C2C2F;
  --neutral-5: #323236;
  --neutral-6: #3B3B3F;
  --neutral-7: #48484E;
  --neutral-8: #606068;
  --neutral-9: #6E6E77;
  --orange-10: #EC6700;
  --orange-11: #FF9D62;
  --orange-12: #FFDDC9;
  --success-1: #111915;
  --success-2: #141E19;
  --success-3: #122F22;
  --success-4: #0C3D29;
  --success-5: #104A33;
  --success-6: #18583E;
  --success-7: #1F694B;
  --success-8: #227D5A;
  --success-9: #10B981;
  --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: #191111;
  --critical-2: #201314;
  --critical-3: #3B1219;
  --critical-4: #500F1C;
  --critical-5: #611623;
  --critical-6: #72232D;
  --critical-7: #8C333A;
  --critical-8: #B54548;
  --critical-9: #E5484D;
  --fuchsia-10: #B105C4;
  --fuchsia-11: #F784FF;
  --fuchsia-12: #F9D0FE;
  --neutral-10: #7B7B84;
  --neutral-11: #B3B3BB;
  --neutral-12: #EEEEF0;
  --neutral-a0: #00000000;
  --neutral-a1: #00000000;
  --neutral-a2: #F7F7F908;
  --neutral-a3: #E1E1FC13;
  --neutral-a4: #DDDDFA1B;
  --neutral-a5: #DCDCF923;
  --neutral-a6: #E8E8FF2C;
  --neutral-a7: #E4E4FD3D;
  --neutral-a8: #E6E6FD5A;
  --neutral-a9: #E9E9FE6A;
  --overlay-a1: #ffffff0a;
  --overlay-a2: #ffffff14;
  --overlay-a3: #ffffff1f;
  --overlay-a4: #ffffff2e;
  --overlay-a5: #ffffff4d;
  --overlay-a6: #ffffff66;
  --overlay-a7: #ffffff80;
  --overlay-a8: #ffffff99;
  --overlay-a9: #ffffffb3;
  --success-10: #00AD76;
  --success-11: #43D59B;
  --success-12: #A9F2CE;
  --warning-10: #FFD60A;
  --warning-11: #FFCA16;
  --warning-12: #FFE7B3;
  --border-none: 0px;
  --critical-10: #EC5D5E;
  --critical-11: #FF9592;
  --critical-12: #FFD1D9;
  --neutral-a10: #ECECFF78;
  --neutral-a11: #F3F3FEB5;
  --neutral-a12: #FDFDFFEF;
  --overlay-a10: #ffffffcc;
  --overlay-a11: #ffffffe6;
  --overlay-a12: #fffffff2;
  --rounding-lg: 10px;
  --rounding-md: 6px;
  --rounding-sm: 4px;
  --rounding-xl: 16px;
  --rounding-xs: 2px;
  --font-size-lg: 1.125rem;
  --font-size-md: 1rem;
  --font-size-sm: 0.875rem;
  --font-size-xl: 1.25rem;
  --font-size-xs: 0.75rem;
  --button--scale: 1;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-size-5xl: 3rem;
  --font-size-6xl: 3.75rem;
  --header-height: 3.75rem;
  --loader--color: var(--neutral-12);
  --rounding-full: 9999px;
  --rounding-none: 0px;
  --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;
  --loader--size-lg: calc(var(--interactive-height-lg) - 1.25rem);
  --loader--size-md: calc(var(--interactive-height-md) - 1rem);
  --loader--size-sm: calc(var(--interactive-height-sm) - 0.75rem);
  --button--rounding: var(--rounding-md);
  --font-family-sans: DM Sans;
  --font-weight-bold: 700;
  --spacing-fixed-lg: 20px;
  --spacing-fixed-md: 16px;
  --spacing-fixed-sm: 12px;
  --spacing-fixed-xs: 8px;
  --toggle-height-lg: 1.75rem;
  --toggle-height-md: 1.5rem;
  --toggle-height-sm: 1.25rem;
  --button--font-size: var(--font-size-md);
  --button--height-lg: var(--interactive-height-lg);
  --button--height-md: var(--interactive-height-md);
  --button--height-sm: var(--interactive-height-sm);
  --letter-spacing-lg: 0rem;
  --letter-spacing-md: 0rem;
  --letter-spacing-sm: 0rem;
  --letter-spacing-xl: 0rem;
  --letter-spacing-xs: 0rem;
  --spacing-fixed-2xs: 6px;
  --spacing-fixed-3xs: 4px;
  --button--padding-lg: var(--spacing-fixed-md);
  --button--padding-md: var(--spacing-fixed-sm);
  --button--padding-sm: var(--spacing-fixed-xs);
  --button--spacing-lg: var(--spacing-fixed-2xs);
  --button--spacing-md: var(--spacing-fixed-3xs);
  --button--spacing-sm: var(--spacing-fixed-3xs);
  --font-weight-medium: 500;
  --letter-spacing-2xl: 0rem;
  --letter-spacing-3xl: 0rem;
  --letter-spacing-4xl: -0.045rem;
  --letter-spacing-5xl: -0.0575rem;
  --letter-spacing-6xl: -0.075rem;
  --button--font-family: var(--font-family-sans);
  --button--font-weight: var(--font-weight-medium);
  --font-weight-regular: 400;
  --overlay-inverted-a1: #1212140d;
  --overlay-inverted-a2: #1212140d;
  --overlay-inverted-a3: #12121426;
  --overlay-inverted-a4: a4: #12121433;
  --overlay-inverted-a5: #1212144d;
  --overlay-inverted-a6:  #12121466;
  --overlay-inverted-a7: #12121480;
  --overlay-inverted-a8: #12121499;
  --overlay-inverted-a9: #121214b3;
  --loader--stroke-width: 0.25rem;
  --overlay-inverted-a10: #121214cc;
  --overlay-inverted-a11: #121214e6;
  --overlay-inverted-a12: #121214f2;
  --button--icon--size-lg: 1.25rem;
  --button--icon--size-md: 1.25rem;
  --button--icon--size-sm: 1rem;
  --button--loader--color: var(--neutral-12);
  --button--outline-color: var(--neutral-12);
  --button--outline-width: var(--border-lg);
  --button--scale_pressed: 0.99;
  --button-primary--color: var(--neutral-0);
  --interactive-height-lg: 3rem;
  --interactive-height-md: 2.75rem;
  --interactive-height-sm: 2.25rem;
  --loader--track-opacity: 0.3;
  --button--outline-offset: var(--border-none);
  --button-ghost--bg-color: var(--transparent);
  --button-tertiary--color: var(--neutral-12);
  --transition-duration-sm: 150ms;
  --transition-duration-xs: 25ms;
  --button-secondary--color: var(--neutral-12);
  --button--loader--bg-color: var(--neutral-0);
  --button--opacity_disabled: 0.6;
  --button-primary--bg-color: var(--brand-9);
  --button-tertiary--bg-color: var(--neutral-2);
  --button-secondary--bg-color: var(--neutral-3);
  --loader--animation-duration: 1000ms;
  --button--transition-duration: var(--transition-duration-sm);
  --button--transition-function: var(--transition-function-on-screen);
  --button-primary--bg-color_open: var(--brand-10);
  --transition-function-on-screen: ease;
  --button-secondary--border-color: var(--neutral-6);
  --button-secondary--border-width: var(--border-md);
  --button-tertiary--bg-color_open: var(--neutral-3);
  --button-secondary--bg-color_open: var(--neutral-2);
  --button-primary--bg-color_hovered: var(--brand-11);
  --button-secondary--color-critical: var(--critical-11);
  --button-primary--bg-color-critical: var(--critical-9);
  --button-tertiary--bg-color_hovered: var(--neutral-3);
  --button-secondary--bg-color_hovered: var(--neutral-2);
  --button--transition-duration_pressed: var(--transition-duration-xs);
  --button-secondary--bg-color-critical: var(--critical-2);
  --button-primary--bg-color-critical_open: var(--critical-10);
  --button-secondary--border-color_hovered: var(--neutral-7);
  --button-secondary--border-color-critical: var(--critical-6);
  --button-primary--bg-color-critical_hovered: var(--critical-11);
  --button-secondary--bg-color-critical_hovered: var(--critical-1);
  --button-secondary--border-color-critical_hovered: var(--critical-7);
}
    

  @property --sky-0 {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --sky-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #05121D;
}
@property --sky-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #091B28;
}
@property --sky-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #002944;
}
@property --sky-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00375B;
}
@property --sky-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00446F;
}
@property --sky-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #005383;
}
@property --sky-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00659C;
}
@property --sky-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #007ABC;
}
@property --sky-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0284C7;
}
@property --blue-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0A111D;
}
@property --blue-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0F1727;
}
@property --blue-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #11244C;
}
@property --blue-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #142E67;
}
@property --blue-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1A397A;
}
@property --blue-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #22448B;
}
@property --blue-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2B509F;
}
@property --blue-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #325EBB;
}
@property --blue-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2563EB;
}
@property --pink-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #170E11;
}
@property --pink-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #201217;
}
@property --pink-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3A1421;
}
@property --pink-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #500F2A;
}
@property --pink-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5F1633;
}
@property --pink-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #702340;
}
@property --pink-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #893252;
}
@property --pink-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B2416B;
}
@property --pink-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DB2777;
}
@property --sky-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0077B9;
}
@property --sky-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6EC3FF;
}
@property --sky-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C6EEFF;
}
@property --blue-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #315DBA;
}
@property --blue-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #88B5FF;
}
@property --blue-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #D1E2FF;
}
@property --brand-0 {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --brand-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0F101B;
}
@property --brand-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #151625;
}
@property --brand-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #212247;
}
@property --brand-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2A2963;
}
@property --brand-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #333373;
}
@property --brand-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3D3E81;
}
@property --brand-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #494A95;
}
@property --brand-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5759B1;
}
@property --brand-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7C7EF3;
}
@property --green-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0E130C;
}
@property --green-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #151A13;
}
@property --green-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1E291A;
}
@property --green-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #25391D;
}
@property --green-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2E4724;
}
@property --green-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #37562B;
}
@property --green-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #426633;
}
@property --green-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4C773B;
}
@property --green-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6AB04C;
}
@property --pink-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #CB0B6A;
}
@property --pink-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF8AB4;
}
@property --pink-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD2DF;
}
@property --brand-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7171E5;
}
@property --brand-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #A6ACFF;
}
@property --brand-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DCE0FE;
}
@property --green-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #5EA440;
}
@property --green-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #87CD6B;
}
@property --green-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C8EFBA;
}
@property --orange-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #16100D;
}
@property --orange-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F1510;
}
@property --orange-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #341C0F;
}
@property --orange-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4A1D02;
}
@property --orange-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #582606;
}
@property --orange-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #683417;
}
@property --orange-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7F4424;
}
@property --orange-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #A3582E;
}
@property --orange-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F97316;
}
@property --fuchsia-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #160D17;
}
@property --fuchsia-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #211123;
}
@property --fuchsia-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #38133C;
}
@property --fuchsia-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #4A1051;
}
@property --fuchsia-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #57185F;
}
@property --fuchsia-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #64256D;
}
@property --fuchsia-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7C3485;
}
@property --fuchsia-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #9E44AA;
}
@property --fuchsia-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #C026D3;
}
@property --grid--gap {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --neutral-0 {
  syntax: "<color>";
  inherits: true;
  initial-value: #131314;
}
@property --neutral-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #171719;
}
@property --neutral-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1E1E1F;
}
@property --neutral-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #262628;
}
@property --neutral-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #2C2C2F;
}
@property --neutral-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #323236;
}
@property --neutral-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3B3B3F;
}
@property --neutral-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #48484E;
}
@property --neutral-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #606068;
}
@property --neutral-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #6E6E77;
}
@property --orange-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EC6700;
}
@property --orange-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF9D62;
}
@property --orange-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFDDC9;
}
@property --shadow-lg {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --shadow-md {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --shadow-sm {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --success-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #111915;
}
@property --success-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #141E19;
}
@property --success-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #122F22;
}
@property --success-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #0C3D29;
}
@property --success-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #104A33;
}
@property --success-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #18583E;
}
@property --success-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F694B;
}
@property --success-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #227D5A;
}
@property --success-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #10B981;
}
@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: #191111;
}
@property --critical-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #201314;
}
@property --critical-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #3B1219;
}
@property --critical-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #500F1C;
}
@property --critical-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #611623;
}
@property --critical-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #72232D;
}
@property --critical-7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #8C333A;
}
@property --critical-8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B54548;
}
@property --critical-9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E5484D;
}
@property --fuchsia-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B105C4;
}
@property --fuchsia-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F784FF;
}
@property --fuchsia-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F9D0FE;
}
@property --neutral-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #7B7B84;
}
@property --neutral-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #B3B3BB;
}
@property --neutral-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EEEEF0;
}
@property --neutral-a0 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000000;
}
@property --neutral-a1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #00000000;
}
@property --neutral-a2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F7F7F908;
}
@property --neutral-a3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E1E1FC13;
}
@property --neutral-a4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DDDDFA1B;
}
@property --neutral-a5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #DCDCF923;
}
@property --neutral-a6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E8E8FF2C;
}
@property --neutral-a7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E4E4FD3D;
}
@property --neutral-a8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E6E6FD5A;
}
@property --neutral-a9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #E9E9FE6A;
}
@property --overlay-a1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff0a;
}
@property --overlay-a2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff14;
}
@property --overlay-a3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff1f;
}
@property --overlay-a4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ffffff2e;
}
@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: #00AD76;
}
@property --success-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #43D59B;
}
@property --success-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #A9F2CE;
}
@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 --critical-10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #EC5D5E;
}
@property --critical-11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FF9592;
}
@property --critical-12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FFD1D9;
}
@property --neutral-a10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ECECFF78;
}
@property --neutral-a11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #F3F3FEB5;
}
@property --neutral-a12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #FDFDFFEF;
}
@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 --avatar--size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --font-size-lg {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.125rem;
}
@property --font-size-md {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1rem;
}
@property --font-size-sm {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.875rem;
}
@property --font-size-xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.25rem;
}
@property --font-size-xs {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0.75rem;
}
@property --loader--size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --shadow-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --badge--height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--scale {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --font-size-2xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.5rem;
}
@property --font-size-3xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 1.875rem;
}
@property --font-size-4xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 2.25rem;
}
@property --font-size-5xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3rem;
}
@property --font-size-6xl {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 3.75rem;
}
@property --loader--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --badge--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --badge--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@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 --badge--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --badge--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --indicator--size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@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 --avatar--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --avatar--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --font-family-sans {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --font-weight-bold {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --badge--icon--size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@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 --badge--icon--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --badge--text--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button--icon--size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --font-weight-medium {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@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 --nav-group--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --nav-group--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--font-family {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --button--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --button-ghost--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--label--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --font-weight-regular {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --indicator--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --overlay-inverted-a1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1212140d;
}
@property --overlay-inverted-a2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1212140d;
}
@property --overlay-inverted-a3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #12121426;
}
@property --overlay-inverted-a4 {
  syntax: "<color>";
  inherits: true;
  initial-value: a4: #12121433;
}
@property --overlay-inverted-a5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #1212144d;
}
@property --overlay-inverted-a6 {
  syntax: "<color>";
  inherits: true;
  initial-value:  #12121466;
}
@property --overlay-inverted-a7 {
  syntax: "<color>";
  inherits: true;
  initial-value: #12121480;
}
@property --overlay-inverted-a8 {
  syntax: "<color>";
  inherits: true;
  initial-value: #12121499;
}
@property --overlay-inverted-a9 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121214b3;
}
@property --side-menu--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --avatar--border-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --avatar--border-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--loader--size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --loader--stroke-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --nav-group--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --overlay-inverted-a10 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121214cc;
}
@property --overlay-inverted-a11 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121214e6;
}
@property --overlay-inverted-a12 {
  syntax: "<color>";
  inherits: true;
  initial-value: #121214f2;
}
@property --button--outline-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button--outline-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--scale_pressed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --button-primary--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--hints--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --loader--track-opacity {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --badge--text--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--outline-offset {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-ghost--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-tertiary--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --nav-group--font-family {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --nav-group--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --side-menu--avatar-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --side-menu--button-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --side-menu--spacing-bar {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --avatar--initials--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--shadow {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --dialog--portal--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--label--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --nav-group--item--height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --side-menu--bg-color-bar {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --side-menu--border-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --side-menu--spacing-main {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --badge--text--font-family {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --badge--text--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --button--opacity_disabled {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --button-primary--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--container--height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--hints--margin-top {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --nav-group--item--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --select--content--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --select--content--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-tertiary--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--container--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--label--font-family {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --field--label--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --select--content--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --select--content--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --skeleton-loader--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--max-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--container--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --loader--animation-duration {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --side-menu--avatar-rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --avatar--initials--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--transition-duration {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --button--transition-function {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --button-ghost--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-ghost--scale_pressed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --dialog--content--scale_open {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field--label--color_focused {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--label--margin-bottom {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --select--content--scale_open {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --side-menu--border-color-bar {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --side-menu--border-width-bar {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--container--icon--size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--hints--message--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--label--color-critical {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --side-menu--border-color-logo {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --side-menu--border-width-logo {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --avatar--initials--font-family {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --avatar--initials--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --button-primary--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--border-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--border-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--opacity_open {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --dialog--content--scale_closed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field--container--icon--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field-secret--toggle--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field-title--input--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --select--content--border-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --select--content--opacity_open {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --select--content--scale_closed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --badge--icon--correction-offset {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-ghost--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-ghost--bg-color_pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-primary-critical--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--border-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--border-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-tertiary--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--body--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--scale_closing {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field--container--icon--margin {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--container--input--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field-number--buttons--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field-number--buttons--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field-secret--toggle--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--icon--correction-offset {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-secondary--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--opacity_closed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field--button--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field-number--buttons--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field-title--input--line-height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --select--content--opacity_closed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --side-menu--padding-vertical-bar {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-primary--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-primary--bg-color_pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary-critical--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--footer--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--footer--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--header--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--header--spacing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--container--input--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--hints--message--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --interaction-layer--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-primary-critical--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-tertiary--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-tertiary--bg-color_pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--translate-y_open {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--label--transition-duration {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --field--label--transition-function {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --side-menu--padding-horizontal-bar {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-ghost--bg-color_highlighted {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--bg-color_pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--body--text--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--portal--backdrop--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--container--bg-color_focused {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--container--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--container--input--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--hints--error-message--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--hints--message--font-family {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --field--hints--message--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field--hints--message--line-height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --sheet--content--translate-y_closed {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button--transition-duration_pressed {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --button-secondary-critical--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--footer--margin-top {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--translate-y_closed {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field-search--button-clear--padding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --interaction-layer--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --interaction-layer--bg-color_pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --select--content--translate-y_closed {
  syntax: "<percentage>";
  inherits: true;
  initial-value: 0%;
}
@property --dialog--content--translate-y_closing {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--button--outline-color_focused {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--button--outline-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--button--outline-width_focused {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--button--outline-width_hovered {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--container--input--font-family {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --field--container--input--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field-search--button-clear--rounding {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --select--content--transition-function {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --button-tertiary--bg-color_highlighted {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--header--button--size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--header--title--color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--container--outline-color-error {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--container--transition-duration {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --field--container--transition-function {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --button-primary-critical--bg-color_open {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--bg-color_highlighted {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary--border-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--portal--backdrop--opacity_open {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field--hints--error-message--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --interaction-layer--transition-duration {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --interaction-layer--transition-function {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --button-secondary-critical--border-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary-critical--border-width {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--container--outline-color_focused {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--container--outline-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --field--container--outline-width_focused {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field--container--outline-width_hovered {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --field-title--input--transition-duration {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --field-title--input--transition-function {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --dialog--portal--backdrop--opacity_closed {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field--hints--error-message--font-family {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --field--hints--error-message--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --field--hints--error-message--line-height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --button-primary-critical--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-primary-critical--bg-color_pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--header--button--bg-color {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--header--title--font-size {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--transition-duration_open {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --dialog--content--transition-function_open {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --select--content--transition-duration_open {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --button-secondary--border-color_highlighted {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --page-app--frame--bg-color-side-menu-mobile {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary-critical--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --button-secondary-critical--bg-color_pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--header--title--font-family {
  syntax: "<custom-ident> | <string>";
  inherits: true;
  initial-value: initial;
}
@property --dialog--content--header--title--font-weight {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --dialog--content--header--title--line-height {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --dialog--content--transition-duration_closed {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --dialog--content--transition-function_closed {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --select--content--transition-duration_closed {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --side-menu--button-space--bg-color-indicator {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --side-menu--button-space--rounding-indicator {
  syntax: "<length-percentage>";
  inherits: true;
  initial-value: 0px;
}
@property --interaction-layer--transition-duration_pressed {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --button-secondary-critical--border-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--header--button--bg-color_hovered {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--content--header--button--bg-color_pressed {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dialog--portal--backdrop--transition-duration_open {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --dialog--portal--backdrop--transition-function_open {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}
@property --dialog--portal--backdrop--transition-duration_closed {
  syntax: "<time>";
  inherits: true;
  initial-value: 0s;
}
@property --dialog--portal--backdrop--transition-function_closed {
  syntax: "*";
  inherits: true;
  initial-value: initial;
}

  :host, :root {
  --sky-0: oklch(13% 3% 236deg);
  --sky-1: oklch(17.8% 0.024 240.9);
  --sky-2: oklch(21.1% 0.0274 240.9);
  --sky-3: oklch(27.2% 0.0627 240.9);
  --sky-4: oklch(31.6% 0.0935 240.9);
  --sky-5: oklch(36.4% 0.1016 240.9);
  --sky-6: oklch(41.5% 0.1057 240.9);
  --sky-7: oklch(47.5% 0.1141 240.9);
  --sky-8: oklch(54.5% 0.1319 240.9);
  --sky-9: oklch(69% 0.1604 240.9);
  --blue-1: #0A111D;
  --blue-2: #0F1727;
  --blue-3: #11244C;
  --blue-4: #142E67;
  --blue-5: #1A397A;
  --blue-6: #22448B;
  --blue-7: #2B509F;
  --blue-8: #325EBB;
  --blue-9: #2563EB;
  --pink-1: #170E11;
  --pink-2: #201217;
  --pink-3: #3A1421;
  --pink-4: #500F2A;
  --pink-5: #5F1633;
  --pink-6: #702340;
  --pink-7: #893252;
  --pink-8: #B2416B;
  --pink-9: #DB2777;
  --sky-10: oklch(65.2% 0.1604 240.9);
  --sky-11: oklch(77.2% 0.1311 240.9);
  --sky-12: oklch(90.8% 0.0534 240.9);
  --blue-10: #315DBA;
  --blue-11: #88B5FF;
  --blue-12: #D1E2FF;
  --brand-0: var(--sky-0);
  --brand-1: var(--sky-1);
  --brand-2: var(--sky-2);
  --brand-3: var(--sky-3);
  --brand-4: var(--sky-4);
  --brand-5: var(--sky-5);
  --brand-6: var(--sky-6);
  --brand-7: var(--sky-7);
  --brand-8: var(--sky-8);
  --brand-9: var(--sky-9);
  --green-1: #0E130C;
  --green-2: #151A13;
  --green-3: #1E291A;
  --green-4: #25391D;
  --green-5: #2E4724;
  --green-6: #37562B;
  --green-7: #426633;
  --green-8: #4C773B;
  --green-9: #6AB04C;
  --pink-10: #CB0B6A;
  --pink-11: #FF8AB4;
  --pink-12: #FFD2DF;
  --brand-10: var(--sky-10);
  --brand-11: var(--sky-11);
  --brand-12: var(--sky-12);
  --green-10: #5EA440;
  --green-11: #87CD6B;
  --green-12: #C8EFBA;
  --orange-1: #16100D;
  --orange-2: #1F1510;
  --orange-3: #341C0F;
  --orange-4: #4A1D02;
  --orange-5: #582606;
  --orange-6: #683417;
  --orange-7: #7F4424;
  --orange-8: #A3582E;
  --orange-9: #F97316;
  --fuchsia-1: #160D17;
  --fuchsia-2: #211123;
  --fuchsia-3: #38133C;
  --fuchsia-4: #4A1051;
  --fuchsia-5: #57185F;
  --fuchsia-6: #64256D;
  --fuchsia-7: #7C3485;
  --fuchsia-8: #9E44AA;
  --fuchsia-9: #C026D3;
  --grid--gap: 16px;
  --neutral-0: oklch(11% 0% 283deg);
  --neutral-1: oklch(17.8% 0.003 286);
  --neutral-2: oklch(21.3% 0.003 286);
  --neutral-3: oklch(25.3% 0.0043 286);
  --neutral-4: oklch(28.3% 0.0055 286);
  --neutral-5: oklch(31.2% 0.0062 286);
  --neutral-6: oklch(34.6% 0.0074 286);
  --neutral-7: oklch(39.8% 0.0082 286);
  --neutral-8: oklch(49% 0.0082 286);
  --neutral-9: oklch(53.7% 0.0082 286);
  --orange-10: #EC6700;
  --orange-11: #FF9D62;
  --orange-12: #FFDDC9;
  --shadow-lg: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l c h / 0.37),   1.6px 3.1px 3.9px -0.4px oklch(from var(--shadow-color) l c h / 0.37),   2.9px 5.9px 7.4px -0.7px oklch(from var(--shadow-color) l c h / 0.37),   4.9px 9.7px 12.2px -1.1px oklch(from var(--shadow-color) l c h / 0.37),   7.8px 15.5px 19.5px -1.4px oklch(from var(--shadow-color) l c h / 0.37),   12.2px 24.3px 30.6px -1.8px oklch(from var(--shadow-color) l c h / 0.37),   18.5px 37px 46.5px -2.1px oklch(from var(--shadow-color) l c h / 0.37),   27.3px 54.5px 68.6px -2.5px oklch(from var(--shadow-color) l c h / 0.37);
  --shadow-md: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l c h / 0.39),   0.8px 1.7px 2.1px -0.8px oklch(from var(--shadow-color) l c h / 0.39),   2.1px 4.3px 5.4px -1.7px oklch(from var(--shadow-color) l c h / 0.39),   5.2px 10.5px 13.2px -2.5px oklch(from var(--shadow-color) l c h / 0.39);
  --shadow-sm: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l c h / 0.38),   0.4px 0.8px 1px -1.2px oklch(from var(--shadow-color) l c h / 0.38),   1px 2.1px 2.6px -2.5px oklch(from var(--shadow-color) l c h / 0.38);
  --success-1: #111915;
  --success-2: #141E19;
  --success-3: #122F22;
  --success-4: #0C3D29;
  --success-5: #104A33;
  --success-6: #18583E;
  --success-7: #1F694B;
  --success-8: #227D5A;
  --success-9: #10B981;
  --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: #191111;
  --critical-2: #201314;
  --critical-3: #3B1219;
  --critical-4: #500F1C;
  --critical-5: #611623;
  --critical-6: #72232D;
  --critical-7: #8C333A;
  --critical-8: #B54548;
  --critical-9: #E5484D;
  --fuchsia-10: #B105C4;
  --fuchsia-11: #F784FF;
  --fuchsia-12: #F9D0FE;
  --neutral-10: oklch(58.3% 0.0082 286);
  --neutral-11: oklch(76.8% 0.0078 286);
  --neutral-12: oklch(94.9% 0.0021 286);
  --neutral-a0: #00000000;
  --neutral-a1: #00000000;
  --neutral-a2: #F7F7F908;
  --neutral-a3: #E1E1FC13;
  --neutral-a4: #DDDDFA1B;
  --neutral-a5: #DCDCF923;
  --neutral-a6: #E8E8FF2C;
  --neutral-a7: #E4E4FD3D;
  --neutral-a8: #E6E6FD5A;
  --neutral-a9: #E9E9FE6A;
  --overlay-a1: #ffffff0a;
  --overlay-a2: #ffffff14;
  --overlay-a3: #ffffff1f;
  --overlay-a4: #ffffff2e;
  --overlay-a5: #ffffff4d;
  --overlay-a6: #ffffff66;
  --overlay-a7: #ffffff80;
  --overlay-a8: #ffffff99;
  --overlay-a9: #ffffffb3;
  --success-10: #00AD76;
  --success-11: #43D59B;
  --success-12: #A9F2CE;
  --warning-10: #FFD60A;
  --warning-11: #FFCA16;
  --warning-12: #FFE7B3;
  --critical-10: #EC5D5E;
  --critical-11: #FF9592;
  --critical-12: #FFD1D9;
  --neutral-a10: #ECECFF78;
  --neutral-a11: #F3F3FEB5;
  --neutral-a12: #FDFDFFEF;
  --overlay-a10: #ffffffcc;
  --overlay-a11: #ffffffe6;
  --overlay-a12: #fffffff2;
  --avatar--size: 2.5rem;
  --font-size-lg: 1.125rem;
  --font-size-md: 1rem;
  --font-size-sm: 0.875rem;
  --font-size-xl: 1.25rem;
  --font-size-xs: 0.75rem;
  --loader--size: 1.75rem;
  --shadow-color: var(--neutral-0);
  --badge--height: 1.75rem;
  --button--scale: 1;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-size-5xl: 3rem;
  --font-size-6xl: 3.75rem;
  --loader--color: var(--neutral-12);
  --badge--padding: 8px;
  --badge--spacing: 6px;
  --button--height: 2.75rem;
  --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;
  --badge--bg-color: var(--neutral-2);
  --badge--rounding: 4px;
  --button--padding: 12px;
  --button--spacing: 6px;
  --field--rounding: 6px;
  --indicator--size: 0.5rem;
  --line-height-2xl: 2rem;
  --line-height-3xl: 2.375rem;
  --line-height-4xl: 2.75rem;
  --line-height-5xl: 3.75rem;
  --line-height-6xl: 4.5rem;
  --avatar--bg-color: var(--neutral-2);
  --avatar--rounding: 4px;
  --button--rounding: 6px;
  --font-family-sans: DM Sans;
  --font-weight-bold: 600;
  --badge--icon--size: 1rem;
  --button--font-size: var(--font-size-md);
  --letter-spacing-lg: 0rem;
  --letter-spacing-md: 0rem;
  --letter-spacing-sm: 0rem;
  --letter-spacing-xl: 0rem;
  --letter-spacing-xs: 0rem;
  --badge--icon--color: var(--neutral-12);
  --badge--text--color: var(--neutral-12);
  --button--icon--size: 1.25rem;
  --font-weight-medium: 500;
  --letter-spacing-2xl: 0rem;
  --letter-spacing-3xl: 0rem;
  --letter-spacing-4xl: -0.045rem;
  --letter-spacing-5xl: -0.0575rem;
  --letter-spacing-6xl: -0.075rem;
  --nav-group--padding: 8px;
  --nav-group--spacing: 6px;
  --button--font-family: var(--font-family-sans);
  --button--font-weight: var(--font-weight-medium);
  --button-ghost--color: var(--neutral-12);
  --field--label--color: var(--neutral-11);
  --font-weight-regular: 400;
  --indicator--rounding: 9999px;
  --overlay-inverted-a1: #1212140d;
  --overlay-inverted-a2: #1212140d;
  --overlay-inverted-a3: #12121426;
  --overlay-inverted-a4: a4: #12121433;
  --overlay-inverted-a5: #1212144d;
  --overlay-inverted-a6:  #12121466;
  --overlay-inverted-a7: #12121480;
  --overlay-inverted-a8: #12121499;
  --overlay-inverted-a9: #121214b3;
  --side-menu--bg-color: var(--neutral-0);
  --avatar--border-color: var(--neutral-5);
  --avatar--border-width: 1px;
  --button--loader--size: 1.75rem;
  --loader--stroke-width: 0.25rem;
  --nav-group--font-size: var(--font-size-md);
  --overlay-inverted-a10: #121214cc;
  --overlay-inverted-a11: #121214e6;
  --overlay-inverted-a12: #121214f2;
  --button--outline-color: var(--neutral-12);
  --button--outline-width: 2px;
  --button--scale_pressed: 0.99;
  --button-primary--color: var(--neutral-0);
  --field--hints--spacing: 4px;
  --loader--track-opacity: 0.3;
  --badge--text--font-size: var(--font-size-sm);
  --button--outline-offset: 00px;
  --button-ghost--bg-color: #ffffff00;
  --button-tertiary--color: var(--neutral-12);
  --nav-group--font-family: var(--font-family-sans);
  --nav-group--font-weight: var(--font-weight-medium);
  --side-menu--avatar-size: 2.75rem;
  --side-menu--button-size: 2.75rem;
  --side-menu--spacing-bar: 8px;
  --avatar--initials--color: var(--neutral-11);
  --button-secondary--color: var(--neutral-12);
  --dialog--content--shadow: var(--shadow-md);
  --dialog--portal--padding: 20px;
  --field--label--font-size: var(--font-size-md);
  --nav-group--item--height: 2.25rem;
  --side-menu--bg-color-bar: var(--neutral-1);
  --side-menu--border-color: var(--neutral-5);
  --side-menu--spacing-main: 40px;
  --badge--text--font-family: var(--font-family-sans);
  --badge--text--font-weight: var(--font-weight-medium);
  --button--opacity_disabled: 0.6;
  --button-primary--bg-color: var(--brand-10);
  --field--container--height: 2.5rem;
  --field--hints--margin-top: 6px;
  --nav-group--item--padding: 8px;
  --select--content--padding: 8px;
  --select--content--spacing: 4px;
  --button-tertiary--bg-color: var(--neutral-3);
  --dialog--content--bg-color: var(--neutral-2);
  --dialog--content--rounding: 18px;
  --field--container--spacing: 2px;
  --field--label--font-family: var(--font-family-sans);
  --field--label--font-weight: var(--font-weight-medium);
  --select--content--bg-color: var(--neutral-2);
  --select--content--rounding: 6px;
  --skeleton-loader--bg-color: var(--neutral-3);
  --button-secondary--bg-color: var(--neutral-3);
  --dialog--content--max-width: 26rem;
  --field--container--bg-color: var(--neutral-3);
  --loader--animation-duration: 1000ms;
  --side-menu--avatar-rounding: 6px;
  --avatar--initials--font-size: var(--font-size-sm);
  --button--transition-duration: 150ms;
  --button--transition-function: ease;
  --button-ghost--bg-color_open: var(--overlay-a2);
  --button-ghost--scale_pressed: 1;
  --dialog--content--scale_open: 1;
  --field--label--color_focused: var(--neutral-12);
  --field--label--margin-bottom: 8px;
  --select--content--scale_open: 1;
  --side-menu--border-color-bar: var(--neutral-3);
  --side-menu--border-width-bar: 1px;
  --field--container--icon--size: 1.25rem;
  --field--hints--message--color: var(--neutral-10);
  --field--label--color-critical: var(--critical-9);
  --side-menu--border-color-logo: var(--neutral-5);
  --side-menu--border-width-logo: 1px;
  --avatar--initials--font-family: var(--font-family-sans);
  --avatar--initials--font-weight: var(--font-weight-medium);
  --button-primary--bg-color_open: var(--brand-9);
  --dialog--content--border-color: var(--neutral-6);
  --dialog--content--border-width: 1px;
  --dialog--content--opacity_open: 1;
  --dialog--content--scale_closed: 0.9;
  --field--container--icon--color: var(--neutral-12);
  --field-secret--toggle--padding: 6px;
  --field-title--input--font-size: var(--font-size-xl);
  --select--content--border-color: var(--neutral-6);
  --select--content--opacity_open: 1;
  --select--content--scale_closed: 0.95;
  --badge--icon--correction-offset: -1px;
  --button-ghost--bg-color_hovered: var(--overlay-a2);
  --button-ghost--bg-color_pressed: var(--overlay-a2);
  --button-primary-critical--color: var(--neutral-0);
  --button-secondary--border-color: var(--neutral-6);
  --button-secondary--border-width: 1px;
  --button-tertiary--bg-color_open: var(--neutral-4);
  --dialog--content--body--padding: 16px;
  --dialog--content--scale_closing: 1;
  --field--container--icon--margin: 10px;
  --field--container--input--color: var(--neutral-12);
  --field-number--buttons--padding: 6px;
  --field-number--buttons--spacing: 4px;
  --field-secret--toggle--rounding: 4px;
  --button--icon--correction-offset: -2px;
  --button-secondary--bg-color_open: var(--neutral-2);
  --dialog--content--opacity_closed: 0;
  --field--button--bg-color_hovered: var(--neutral-2);
  --field-number--buttons--rounding: 4px;
  --field-title--input--line-height: var(--line-height-xl);
  --select--content--opacity_closed: 0;
  --side-menu--padding-vertical-bar: 16px;
  --button-primary--bg-color_hovered: var(--brand-9);
  --button-primary--bg-color_pressed: var(--brand-9);
  --button-secondary-critical--color: var(--critical-11);
  --dialog--content--footer--padding: 16px;
  --dialog--content--footer--spacing: 8px;
  --dialog--content--header--padding: 16px;
  --dialog--content--header--spacing: 8px;
  --field--container--input--padding: 10px;
  --field--hints--message--font-size: var(--font-size-sm);
  --interaction-layer--bg-color_open: var(--overlay-a1);
  --button-primary-critical--bg-color: var(--critical-9);
  --button-tertiary--bg-color_hovered: var(--neutral-4);
  --button-tertiary--bg-color_pressed: var(--neutral-3);
  --dialog--content--translate-y_open: 0px;
  --field--label--transition-duration: 150ms;
  --field--label--transition-function: ease;
  --side-menu--padding-horizontal-bar: 8px;
  --button-ghost--bg-color_highlighted: var(--neutral-3);
  --button-secondary--bg-color_hovered: var(--neutral-2);
  --button-secondary--bg-color_pressed: var(--neutral-2);
  --dialog--content--body--text--color: var(--neutral-12);
  --dialog--portal--backdrop--bg-color: var(--neutral-1);
  --field--container--bg-color_focused: var(--neutral-2);
  --field--container--bg-color_hovered: var(--neutral-2);
  --field--container--input--font-size: var(--font-size-md);
  --field--hints--error-message--color: var(--critical-9);
  --field--hints--message--font-family: var(--font-family-sans);
  --field--hints--message--font-weight: var(--font-weight-regular);
  --field--hints--message--line-height: var(--line-height-sm);
  --sheet--content--translate-y_closed: 100%;
  --button--transition-duration_pressed: 20ms;
  --button-secondary-critical--bg-color: var(--critical-2);
  --dialog--content--footer--margin-top: 1rem;
  --dialog--content--translate-y_closed: 24px;
  --field-search--button-clear--padding: 6px;
  --interaction-layer--bg-color_hovered: var(--overlay-a1);
  --interaction-layer--bg-color_pressed: var(--overlay-a2);
  --select--content--translate-y_closed: 8px;
  --dialog--content--translate-y_closing: 0px;
  --field--button--outline-color_focused: var(--neutral-10);
  --field--button--outline-color_hovered: var(--neutral-6);
  --field--button--outline-width_focused: 2px;
  --field--button--outline-width_hovered: 1px;
  --field--container--input--font-family: var(--font-family-sans);
  --field--container--input--font-weight: var(--font-weight-regular);
  --field-search--button-clear--rounding: 4px;
  --select--content--transition-function: ease-out;
  --button-tertiary--bg-color_highlighted: var(--neutral-4);
  --dialog--content--header--button--size: 2rem;
  --dialog--content--header--title--color: var(--neutral-12);
  --field--container--outline-color-error: var(--critical-9);
  --field--container--transition-duration: 150ms;
  --field--container--transition-function: ease;
  --button-primary-critical--bg-color_open: var(--critical-10);
  --button-secondary--bg-color_highlighted: var(--neutral-2);
  --button-secondary--border-color_hovered: var(--neutral-7);
  --dialog--portal--backdrop--opacity_open: 0.7;
  --field--hints--error-message--font-size: var(--font-size-sm);
  --interaction-layer--transition-duration: 150ms;
  --interaction-layer--transition-function: ease;
  --button-secondary-critical--border-color: var(--critical-6);
  --button-secondary-critical--border-width: 1px;
  --field--container--outline-color_focused: var(--neutral-10);
  --field--container--outline-color_hovered: var(--neutral-6);
  --field--container--outline-width_focused: 2px;
  --field--container--outline-width_hovered: 1px;
  --field-title--input--transition-duration: 150ms;
  --field-title--input--transition-function: ease;
  --dialog--portal--backdrop--opacity_closed: 0;
  --field--hints--error-message--font-family: var(--font-family-sans);
  --field--hints--error-message--font-weight: var(--font-weight-regular);
  --field--hints--error-message--line-height: var(--line-height-sm);
  --button-primary-critical--bg-color_hovered: var(--critical-11);
  --button-primary-critical--bg-color_pressed: var(--critical-10);
  --dialog--content--header--button--bg-color: var(--neutral-1);
  --dialog--content--header--title--font-size: var(--font-size-xl);
  --dialog--content--transition-duration_open: 260ms;
  --dialog--content--transition-function_open: ease;
  --select--content--transition-duration_open: 200ms;
  --button-secondary--border-color_highlighted: var(--neutral-9);
  --page-app--frame--bg-color-side-menu-mobile: var(--neutral-1);
  --button-secondary-critical--bg-color_hovered: var(--critical-1);
  --button-secondary-critical--bg-color_pressed: var(--critical-2);
  --dialog--content--header--title--font-family: var(--font-family-sans);
  --dialog--content--header--title--font-weight: var(--font-weight-bold);
  --dialog--content--header--title--line-height: var(--line-height-xl);
  --dialog--content--transition-duration_closed: 200ms;
  --dialog--content--transition-function_closed: ease;
  --select--content--transition-duration_closed: 0ms;
  --side-menu--button-space--bg-color-indicator: var(--neutral-9);
  --side-menu--button-space--rounding-indicator: 2px;
  --interaction-layer--transition-duration_pressed: 20ms;
  --button-secondary-critical--border-color_hovered: var(--critical-7);
  --dialog--content--header--button--bg-color_hovered: var(--neutral-3);
  --dialog--content--header--button--bg-color_pressed: var(--neutral-1);
  --dialog--portal--backdrop--transition-duration_open: 340ms;
  --dialog--portal--backdrop--transition-function_open: ease;
  --dialog--portal--backdrop--transition-duration_closed: 300ms;
  --dialog--portal--backdrop--transition-function_closed: ease;
}
  
  
  [data-nc-theme~="Default"] {
  --sky-0: oklch(13% 3% 236deg);
  --sky-1: oklch(17.8% 0.024 240.9);
  --sky-2: oklch(21.1% 0.0274 240.9);
  --sky-3: oklch(27.2% 0.0627 240.9);
  --sky-4: oklch(31.6% 0.0935 240.9);
  --sky-5: oklch(36.4% 0.1016 240.9);
  --sky-6: oklch(41.5% 0.1057 240.9);
  --sky-7: oklch(47.5% 0.1141 240.9);
  --sky-8: oklch(54.5% 0.1319 240.9);
  --sky-9: oklch(69% 0.1604 240.9);
  --blue-1: #0A111D;
  --blue-2: #0F1727;
  --blue-3: #11244C;
  --blue-4: #142E67;
  --blue-5: #1A397A;
  --blue-6: #22448B;
  --blue-7: #2B509F;
  --blue-8: #325EBB;
  --blue-9: #2563EB;
  --pink-1: #170E11;
  --pink-2: #201217;
  --pink-3: #3A1421;
  --pink-4: #500F2A;
  --pink-5: #5F1633;
  --pink-6: #702340;
  --pink-7: #893252;
  --pink-8: #B2416B;
  --pink-9: #DB2777;
  --sky-10: oklch(65.2% 0.1604 240.9);
  --sky-11: oklch(77.2% 0.1311 240.9);
  --sky-12: oklch(90.8% 0.0534 240.9);
  --blue-10: #315DBA;
  --blue-11: #88B5FF;
  --blue-12: #D1E2FF;
  --brand-0: var(--sky-0);
  --brand-1: var(--sky-1);
  --brand-2: var(--sky-2);
  --brand-3: var(--sky-3);
  --brand-4: var(--sky-4);
  --brand-5: var(--sky-5);
  --brand-6: var(--sky-6);
  --brand-7: var(--sky-7);
  --brand-8: var(--sky-8);
  --brand-9: var(--sky-9);
  --green-1: #0E130C;
  --green-2: #151A13;
  --green-3: #1E291A;
  --green-4: #25391D;
  --green-5: #2E4724;
  --green-6: #37562B;
  --green-7: #426633;
  --green-8: #4C773B;
  --green-9: #6AB04C;
  --pink-10: #CB0B6A;
  --pink-11: #FF8AB4;
  --pink-12: #FFD2DF;
  --brand-10: var(--sky-10);
  --brand-11: var(--sky-11);
  --brand-12: var(--sky-12);
  --green-10: #5EA440;
  --green-11: #87CD6B;
  --green-12: #C8EFBA;
  --orange-1: #16100D;
  --orange-2: #1F1510;
  --orange-3: #341C0F;
  --orange-4: #4A1D02;
  --orange-5: #582606;
  --orange-6: #683417;
  --orange-7: #7F4424;
  --orange-8: #A3582E;
  --orange-9: #F97316;
  --fuchsia-1: #160D17;
  --fuchsia-2: #211123;
  --fuchsia-3: #38133C;
  --fuchsia-4: #4A1051;
  --fuchsia-5: #57185F;
  --fuchsia-6: #64256D;
  --fuchsia-7: #7C3485;
  --fuchsia-8: #9E44AA;
  --fuchsia-9: #C026D3;
  --grid--gap: 16px;
  --neutral-0: oklch(11% 0% 283deg);
  --neutral-1: oklch(17.8% 0.003 286);
  --neutral-2: oklch(21.3% 0.003 286);
  --neutral-3: oklch(25.3% 0.0043 286);
  --neutral-4: oklch(28.3% 0.0055 286);
  --neutral-5: oklch(31.2% 0.0062 286);
  --neutral-6: oklch(34.6% 0.0074 286);
  --neutral-7: oklch(39.8% 0.0082 286);
  --neutral-8: oklch(49% 0.0082 286);
  --neutral-9: oklch(53.7% 0.0082 286);
  --orange-10: #EC6700;
  --orange-11: #FF9D62;
  --orange-12: #FFDDC9;
  --shadow-lg: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l c h / 0.37),   1.6px 3.1px 3.9px -0.4px oklch(from var(--shadow-color) l c h / 0.37),   2.9px 5.9px 7.4px -0.7px oklch(from var(--shadow-color) l c h / 0.37),   4.9px 9.7px 12.2px -1.1px oklch(from var(--shadow-color) l c h / 0.37),   7.8px 15.5px 19.5px -1.4px oklch(from var(--shadow-color) l c h / 0.37),   12.2px 24.3px 30.6px -1.8px oklch(from var(--shadow-color) l c h / 0.37),   18.5px 37px 46.5px -2.1px oklch(from var(--shadow-color) l c h / 0.37),   27.3px 54.5px 68.6px -2.5px oklch(from var(--shadow-color) l c h / 0.37);
  --shadow-md: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l c h / 0.39),   0.8px 1.7px 2.1px -0.8px oklch(from var(--shadow-color) l c h / 0.39),   2.1px 4.3px 5.4px -1.7px oklch(from var(--shadow-color) l c h / 0.39),   5.2px 10.5px 13.2px -2.5px oklch(from var(--shadow-color) l c h / 0.39);
  --shadow-sm: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l c h / 0.38),   0.4px 0.8px 1px -1.2px oklch(from var(--shadow-color) l c h / 0.38),   1px 2.1px 2.6px -2.5px oklch(from var(--shadow-color) l c h / 0.38);
  --success-1: #111915;
  --success-2: #141E19;
  --success-3: #122F22;
  --success-4: #0C3D29;
  --success-5: #104A33;
  --success-6: #18583E;
  --success-7: #1F694B;
  --success-8: #227D5A;
  --success-9: #10B981;
  --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: #191111;
  --critical-2: #201314;
  --critical-3: #3B1219;
  --critical-4: #500F1C;
  --critical-5: #611623;
  --critical-6: #72232D;
  --critical-7: #8C333A;
  --critical-8: #B54548;
  --critical-9: #E5484D;
  --fuchsia-10: #B105C4;
  --fuchsia-11: #F784FF;
  --fuchsia-12: #F9D0FE;
  --neutral-10: oklch(58.3% 0.0082 286);
  --neutral-11: oklch(76.8% 0.0078 286);
  --neutral-12: oklch(94.9% 0.0021 286);
  --neutral-a0: #00000000;
  --neutral-a1: #00000000;
  --neutral-a2: #F7F7F908;
  --neutral-a3: #E1E1FC13;
  --neutral-a4: #DDDDFA1B;
  --neutral-a5: #DCDCF923;
  --neutral-a6: #E8E8FF2C;
  --neutral-a7: #E4E4FD3D;
  --neutral-a8: #E6E6FD5A;
  --neutral-a9: #E9E9FE6A;
  --overlay-a1: #ffffff0a;
  --overlay-a2: #ffffff14;
  --overlay-a3: #ffffff1f;
  --overlay-a4: #ffffff2e;
  --overlay-a5: #ffffff4d;
  --overlay-a6: #ffffff66;
  --overlay-a7: #ffffff80;
  --overlay-a8: #ffffff99;
  --overlay-a9: #ffffffb3;
  --success-10: #00AD76;
  --success-11: #43D59B;
  --success-12: #A9F2CE;
  --warning-10: #FFD60A;
  --warning-11: #FFCA16;
  --warning-12: #FFE7B3;
  --critical-10: #EC5D5E;
  --critical-11: #FF9592;
  --critical-12: #FFD1D9;
  --neutral-a10: #ECECFF78;
  --neutral-a11: #F3F3FEB5;
  --neutral-a12: #FDFDFFEF;
  --overlay-a10: #ffffffcc;
  --overlay-a11: #ffffffe6;
  --overlay-a12: #fffffff2;
  --avatar--size: 2.5rem;
  --font-size-lg: 1.125rem;
  --font-size-md: 1rem;
  --font-size-sm: 0.875rem;
  --font-size-xl: 1.25rem;
  --font-size-xs: 0.75rem;
  --loader--size: 1.75rem;
  --shadow-color: var(--neutral-0);
  --badge--height: 1.75rem;
  --button--scale: 1;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-size-5xl: 3rem;
  --font-size-6xl: 3.75rem;
  --loader--color: var(--neutral-12);
  --badge--padding: 8px;
  --badge--spacing: 6px;
  --button--height: 2.75rem;
  --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;
  --badge--bg-color: var(--neutral-2);
  --badge--rounding: 4px;
  --button--padding: 12px;
  --button--spacing: 6px;
  --field--rounding: 6px;
  --indicator--size: 0.5rem;
  --line-height-2xl: 2rem;
  --line-height-3xl: 2.375rem;
  --line-height-4xl: 2.75rem;
  --line-height-5xl: 3.75rem;
  --line-height-6xl: 4.5rem;
  --avatar--bg-color: var(--neutral-2);
  --avatar--rounding: 4px;
  --button--rounding: 6px;
  --font-family-sans: DM Sans;
  --font-weight-bold: 600;
  --badge--icon--size: 1rem;
  --button--font-size: var(--font-size-md);
  --letter-spacing-lg: 0rem;
  --letter-spacing-md: 0rem;
  --letter-spacing-sm: 0rem;
  --letter-spacing-xl: 0rem;
  --letter-spacing-xs: 0rem;
  --badge--icon--color: var(--neutral-12);
  --badge--text--color: var(--neutral-12);
  --button--icon--size: 1.25rem;
  --font-weight-medium: 500;
  --letter-spacing-2xl: 0rem;
  --letter-spacing-3xl: 0rem;
  --letter-spacing-4xl: -0.045rem;
  --letter-spacing-5xl: -0.0575rem;
  --letter-spacing-6xl: -0.075rem;
  --nav-group--padding: 8px;
  --nav-group--spacing: 6px;
  --button--font-family: var(--font-family-sans);
  --button--font-weight: var(--font-weight-medium);
  --button-ghost--color: var(--neutral-12);
  --field--label--color: var(--neutral-11);
  --font-weight-regular: 400;
  --indicator--rounding: 9999px;
  --overlay-inverted-a1: #1212140d;
  --overlay-inverted-a2: #1212140d;
  --overlay-inverted-a3: #12121426;
  --overlay-inverted-a4: a4: #12121433;
  --overlay-inverted-a5: #1212144d;
  --overlay-inverted-a6:  #12121466;
  --overlay-inverted-a7: #12121480;
  --overlay-inverted-a8: #12121499;
  --overlay-inverted-a9: #121214b3;
  --side-menu--bg-color: var(--neutral-0);
  --avatar--border-color: var(--neutral-5);
  --avatar--border-width: 1px;
  --button--loader--size: 1.75rem;
  --loader--stroke-width: 0.25rem;
  --nav-group--font-size: var(--font-size-md);
  --overlay-inverted-a10: #121214cc;
  --overlay-inverted-a11: #121214e6;
  --overlay-inverted-a12: #121214f2;
  --button--outline-color: var(--neutral-12);
  --button--outline-width: 2px;
  --button--scale_pressed: 0.99;
  --button-primary--color: var(--neutral-0);
  --field--hints--spacing: 4px;
  --loader--track-opacity: 0.3;
  --badge--text--font-size: var(--font-size-sm);
  --button--outline-offset: 00px;
  --button-ghost--bg-color: #ffffff00;
  --button-tertiary--color: var(--neutral-12);
  --nav-group--font-family: var(--font-family-sans);
  --nav-group--font-weight: var(--font-weight-medium);
  --side-menu--avatar-size: 2.75rem;
  --side-menu--button-size: 2.75rem;
  --side-menu--spacing-bar: 8px;
  --avatar--initials--color: var(--neutral-11);
  --button-secondary--color: var(--neutral-12);
  --dialog--content--shadow: var(--shadow-md);
  --dialog--portal--padding: 20px;
  --field--label--font-size: var(--font-size-md);
  --nav-group--item--height: 2.25rem;
  --side-menu--bg-color-bar: var(--neutral-1);
  --side-menu--border-color: var(--neutral-5);
  --side-menu--spacing-main: 40px;
  --badge--text--font-family: var(--font-family-sans);
  --badge--text--font-weight: var(--font-weight-medium);
  --button--opacity_disabled: 0.6;
  --button-primary--bg-color: var(--brand-10);
  --field--container--height: 2.5rem;
  --field--hints--margin-top: 6px;
  --nav-group--item--padding: 8px;
  --select--content--padding: 8px;
  --select--content--spacing: 4px;
  --button-tertiary--bg-color: var(--neutral-3);
  --dialog--content--bg-color: var(--neutral-2);
  --dialog--content--rounding: 18px;
  --field--container--spacing: 2px;
  --field--label--font-family: var(--font-family-sans);
  --field--label--font-weight: var(--font-weight-medium);
  --select--content--bg-color: var(--neutral-2);
  --select--content--rounding: 6px;
  --skeleton-loader--bg-color: var(--neutral-3);
  --button-secondary--bg-color: var(--neutral-3);
  --dialog--content--max-width: 26rem;
  --field--container--bg-color: var(--neutral-3);
  --loader--animation-duration: 1000ms;
  --side-menu--avatar-rounding: 6px;
  --avatar--initials--font-size: var(--font-size-sm);
  --button--transition-duration: 150ms;
  --button--transition-function: ease;
  --button-ghost--bg-color_open: var(--overlay-a2);
  --button-ghost--scale_pressed: 1;
  --dialog--content--scale_open: 1;
  --field--label--color_focused: var(--neutral-12);
  --field--label--margin-bottom: 8px;
  --select--content--scale_open: 1;
  --side-menu--border-color-bar: var(--neutral-3);
  --side-menu--border-width-bar: 1px;
  --field--container--icon--size: 1.25rem;
  --field--hints--message--color: var(--neutral-10);
  --field--label--color-critical: var(--critical-9);
  --side-menu--border-color-logo: var(--neutral-5);
  --side-menu--border-width-logo: 1px;
  --avatar--initials--font-family: var(--font-family-sans);
  --avatar--initials--font-weight: var(--font-weight-medium);
  --button-primary--bg-color_open: var(--brand-9);
  --dialog--content--border-color: var(--neutral-6);
  --dialog--content--border-width: 1px;
  --dialog--content--opacity_open: 1;
  --dialog--content--scale_closed: 0.9;
  --field--container--icon--color: var(--neutral-12);
  --field-secret--toggle--padding: 6px;
  --field-title--input--font-size: var(--font-size-xl);
  --select--content--border-color: var(--neutral-6);
  --select--content--opacity_open: 1;
  --select--content--scale_closed: 0.95;
  --badge--icon--correction-offset: -1px;
  --button-ghost--bg-color_hovered: var(--overlay-a2);
  --button-ghost--bg-color_pressed: var(--overlay-a2);
  --button-primary-critical--color: var(--neutral-0);
  --button-secondary--border-color: var(--neutral-6);
  --button-secondary--border-width: 1px;
  --button-tertiary--bg-color_open: var(--neutral-4);
  --dialog--content--body--padding: 16px;
  --dialog--content--scale_closing: 1;
  --field--container--icon--margin: 10px;
  --field--container--input--color: var(--neutral-12);
  --field-number--buttons--padding: 6px;
  --field-number--buttons--spacing: 4px;
  --field-secret--toggle--rounding: 4px;
  --button--icon--correction-offset: -2px;
  --button-secondary--bg-color_open: var(--neutral-2);
  --dialog--content--opacity_closed: 0;
  --field--button--bg-color_hovered: var(--neutral-2);
  --field-number--buttons--rounding: 4px;
  --field-title--input--line-height: var(--line-height-xl);
  --select--content--opacity_closed: 0;
  --side-menu--padding-vertical-bar: 16px;
  --button-primary--bg-color_hovered: var(--brand-9);
  --button-primary--bg-color_pressed: var(--brand-9);
  --button-secondary-critical--color: var(--critical-11);
  --dialog--content--footer--padding: 16px;
  --dialog--content--footer--spacing: 8px;
  --dialog--content--header--padding: 16px;
  --dialog--content--header--spacing: 8px;
  --field--container--input--padding: 10px;
  --field--hints--message--font-size: var(--font-size-sm);
  --interaction-layer--bg-color_open: var(--overlay-a1);
  --button-primary-critical--bg-color: var(--critical-9);
  --button-tertiary--bg-color_hovered: var(--neutral-4);
  --button-tertiary--bg-color_pressed: var(--neutral-3);
  --dialog--content--translate-y_open: 0px;
  --field--label--transition-duration: 150ms;
  --field--label--transition-function: ease;
  --side-menu--padding-horizontal-bar: 8px;
  --button-ghost--bg-color_highlighted: var(--neutral-3);
  --button-secondary--bg-color_hovered: var(--neutral-2);
  --button-secondary--bg-color_pressed: var(--neutral-2);
  --dialog--content--body--text--color: var(--neutral-12);
  --dialog--portal--backdrop--bg-color: var(--neutral-1);
  --field--container--bg-color_focused: var(--neutral-2);
  --field--container--bg-color_hovered: var(--neutral-2);
  --field--container--input--font-size: var(--font-size-md);
  --field--hints--error-message--color: var(--critical-9);
  --field--hints--message--font-family: var(--font-family-sans);
  --field--hints--message--font-weight: var(--font-weight-regular);
  --field--hints--message--line-height: var(--line-height-sm);
  --sheet--content--translate-y_closed: 100%;
  --button--transition-duration_pressed: 20ms;
  --button-secondary-critical--bg-color: var(--critical-2);
  --dialog--content--footer--margin-top: 1rem;
  --dialog--content--translate-y_closed: 24px;
  --field-search--button-clear--padding: 6px;
  --interaction-layer--bg-color_hovered: var(--overlay-a1);
  --interaction-layer--bg-color_pressed: var(--overlay-a2);
  --select--content--translate-y_closed: 8px;
  --dialog--content--translate-y_closing: 0px;
  --field--button--outline-color_focused: var(--neutral-10);
  --field--button--outline-color_hovered: var(--neutral-6);
  --field--button--outline-width_focused: 2px;
  --field--button--outline-width_hovered: 1px;
  --field--container--input--font-family: var(--font-family-sans);
  --field--container--input--font-weight: var(--font-weight-regular);
  --field-search--button-clear--rounding: 4px;
  --select--content--transition-function: ease-out;
  --button-tertiary--bg-color_highlighted: var(--neutral-4);
  --dialog--content--header--button--size: 2rem;
  --dialog--content--header--title--color: var(--neutral-12);
  --field--container--outline-color-error: var(--critical-9);
  --field--container--transition-duration: 150ms;
  --field--container--transition-function: ease;
  --button-primary-critical--bg-color_open: var(--critical-10);
  --button-secondary--bg-color_highlighted: var(--neutral-2);
  --button-secondary--border-color_hovered: var(--neutral-7);
  --dialog--portal--backdrop--opacity_open: 0.7;
  --field--hints--error-message--font-size: var(--font-size-sm);
  --interaction-layer--transition-duration: 150ms;
  --interaction-layer--transition-function: ease;
  --button-secondary-critical--border-color: var(--critical-6);
  --button-secondary-critical--border-width: 1px;
  --field--container--outline-color_focused: var(--neutral-10);
  --field--container--outline-color_hovered: var(--neutral-6);
  --field--container--outline-width_focused: 2px;
  --field--container--outline-width_hovered: 1px;
  --field-title--input--transition-duration: 150ms;
  --field-title--input--transition-function: ease;
  --dialog--portal--backdrop--opacity_closed: 0;
  --field--hints--error-message--font-family: var(--font-family-sans);
  --field--hints--error-message--font-weight: var(--font-weight-regular);
  --field--hints--error-message--line-height: var(--line-height-sm);
  --button-primary-critical--bg-color_hovered: var(--critical-11);
  --button-primary-critical--bg-color_pressed: var(--critical-10);
  --dialog--content--header--button--bg-color: var(--neutral-1);
  --dialog--content--header--title--font-size: var(--font-size-xl);
  --dialog--content--transition-duration_open: 260ms;
  --dialog--content--transition-function_open: ease;
  --select--content--transition-duration_open: 200ms;
  --button-secondary--border-color_highlighted: var(--neutral-9);
  --page-app--frame--bg-color-side-menu-mobile: var(--neutral-1);
  --button-secondary-critical--bg-color_hovered: var(--critical-1);
  --button-secondary-critical--bg-color_pressed: var(--critical-2);
  --dialog--content--header--title--font-family: var(--font-family-sans);
  --dialog--content--header--title--font-weight: var(--font-weight-bold);
  --dialog--content--header--title--line-height: var(--line-height-xl);
  --dialog--content--transition-duration_closed: 200ms;
  --dialog--content--transition-function_closed: ease;
  --select--content--transition-duration_closed: 0ms;
  --side-menu--button-space--bg-color-indicator: var(--neutral-9);
  --side-menu--button-space--rounding-indicator: 2px;
  --interaction-layer--transition-duration_pressed: 20ms;
  --button-secondary-critical--border-color_hovered: var(--critical-7);
  --dialog--content--header--button--bg-color_hovered: var(--neutral-3);
  --dialog--content--header--button--bg-color_pressed: var(--neutral-1);
  --dialog--portal--backdrop--transition-duration_open: 340ms;
  --dialog--portal--backdrop--transition-function_open: ease;
  --dialog--portal--backdrop--transition-duration_closed: 300ms;
  --dialog--portal--backdrop--transition-function_closed: ease;
}
    


@layer base {
  
  body, :host {
    /* Color */
    
    /* Fonts */
    --font-dmsans: 'DM Sans',sans-serif;
--font-dmmono: 'DM Mono',monospace;
--font-dmsans: 'DM Sans',sans-serif;
--font-dmmono: 'DM Mono',monospace;
--font-DM Sans: 'DM Sans',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;
    }
  }
}


    .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;
    }

    .toast\:root {
      gap:0.75rem;
      color:var(--neutral-12);
      width:fit-content;
      opacity:0;
      max-width:100%;
      translate:0 16px;
      background:var(--neutral-1);
      box-shadow:var(--shadow-md);
      padding-top:0.75rem;
      border-color:var(--neutral-5);
      border-style:solid;
      border-width:var(--border-md);
      padding-left:0.75rem;
      padding-right:0.75rem;
      padding-bottom:0.75rem;
      border-top-left-radius:var(--rounding-lg);
      border-top-right-radius:var(--rounding-lg);
      border-bottom-left-radius:var(--rounding-lg);
      border-bottom-right-radius:var(--rounding-lg);
    }

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

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

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

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

    .toast\:root.success {
      color:var(--success-12);
      background:var(--success-2);
      border-color:var(--success-8);
      border-style:solid;
      border-width:var(--border-md);
    }

    .toast\:root.warning {
      color:var(--warning-12);
      background:var(--warning-2);
      border-color:var(--warning-8);
      border-style:solid;
      border-width:var(--border-md);
    }

    .toast\:root.critical {
      color:var(--critical-12);
      background:var(--critical-2);
      border-color:var(--critical-8);
      border-style:solid;
      border-width:var(--border-md);
    }

    .damtoL {
      color:inherit;
      font-size:var(--font-size-base);
      font-family:DM Sans;
      font-weight:inherit;
      line-height:120%;
    }

    .dAayRI {
      width:var(--width);
      height:var(--height);
      position:fixed;
      overflow-x:hidden;
      overflow-y:hidden;
      align-items:start;
      pointer-events:none;
      justify-content:start;
    }

    .toast-wrapper\:b9c8dnbCjTNKFv-c3yIA5 {
      display:flex;
      align-items:center;
      padding-top:1.25rem;
      padding-left:1.25rem;
      padding-right:1.25rem;
      padding-bottom:1.25rem;
      justify-content:flex-start;
    }

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

    .eNqIEc::-webkit-scrollbar {
    width: 0;
    }

    .toast-wrapper\:dATODWrBGpcLI-k1B1W10 {
      width:100%;
      display:flex;
      position:relative;
      max-width:360px;
      transition:height 150ms ease 0ms normal;
      align-items:center;
      flex-direction:column;
      justify-content:flex-start;
    }