/* Generated from Figma Variables. First mode = :root default.
   FLOAT tokens are unitless — multiply by 1px in calc() where a length is needed. */

:root {
  --2xl-2: 1536; /* @kind other */
  --2xl: 64; /* @kind spacing */
  --2xs: 4; /* @kind spacing */
  --3xl: 128; /* @kind spacing */
  --grey-dark-100: rgb(37,37,37); /* @kind color */
  --grey-dark-20: rgba(37,37,37,0.2); /* @kind color */
  --grey-dark-50: rgba(37,37,37,0.5); /* @kind color */
  --grey-dark-70: rgba(37,37,37,0.7); /* @kind color */
  --grey-light: rgb(249,249,249); /* @kind color */
  --grey-white: rgb(255,255,255); /* @kind color */
  --lg-2: 1024; /* @kind other */
  --lg: 24; /* @kind spacing */
  --md-2: 768; /* @kind other */
  --md: 16; /* @kind spacing */
  --orange-orange-light: rgb(255,242,237); /* @kind color */
  --orange-primary-100: rgb(255,145,80); /* @kind color */
  --orange-primary-20: rgba(255,145,80,0.2); /* @kind color */
  --orange-primary-50: rgba(255,145,80,0.5); /* @kind color */
  --orange-primary-70: rgba(255,145,80,0.7); /* @kind color */
  --radius-lg: 10;
  --radius-md: 5;
  --radius-none: 0;
  --radius-pill: 500;
  --radius-sm: 3;
  --radius-xl: 20;
  --semantic-danger-05: rgba(255,71,87,0.05); /* @kind color */
  --semantic-danger-100: rgb(255,71,87); /* @kind color */
  --semantic-danger-10: rgba(255,71,87,0.1); /* @kind color */
  --semantic-danger-50: rgba(255,71,87,0.5); /* @kind color */
  --semantic-danger-70: rgba(255,71,87,0.7); /* @kind color */
  --semantic-info-05: rgba(30,144,255,0.05); /* @kind color */
  --semantic-info-100: rgb(30,144,255); /* @kind color */
  --semantic-info-10: rgba(30,144,255,0.1); /* @kind color */
  --semantic-info-50: rgba(30,144,255,0.5); /* @kind color */
  --semantic-info-70: rgba(30,144,255,0.7); /* @kind color */
  --semantic-success-05: rgba(46,213,115,0.05); /* @kind color */
  --semantic-success-100: rgb(46,213,115); /* @kind color */
  --semantic-success-10: rgba(46,213,115,0.1); /* @kind color */
  --semantic-success-50: rgba(46,213,115,0.5); /* @kind color */
  --semantic-success-70: rgba(46,213,115,0.7); /* @kind color */
  --semantic-warning-05: rgba(255,165,2,0.05); /* @kind color */
  --semantic-warning-100: rgb(255,165,2); /* @kind color */
  --semantic-warning-10: rgba(255,165,2,0.1); /* @kind color */
  --semantic-warning-50: rgba(255,165,2,0.5); /* @kind color */
  --semantic-warning-70: rgba(255,165,2,0.7); /* @kind color */
  --size-2xl: 5;
  --size-3xl: 10;
  --size-h1: 44;
  --size-h2: 34;
  --size-h3: 26;
  --size-h4: 22;
  --size-h5: 16;
  --size-h6: 12;
  --size-lg: 3;
  --size-md: 2;
  --size-none: 0;
  --size-p: 16;
  --size-sm: 1;
  --size-xl: 4;
  --sm-2: 640; /* @kind other */
  --sm: 12; /* @kind spacing */
  --xl-2: 1280; /* @kind other */
  --xl: 32; /* @kind spacing */
  --xs: 8; /* @kind spacing */
}

:root[data-theme="dark"], .dark {
  --grey-dark-100: rgba(255,255,255,0.95); /* @kind color */
  --grey-dark-20: rgba(255,255,255,0.3); /* @kind color */
  --grey-dark-50: rgba(255,255,255,0.6); /* @kind color */
  --grey-dark-70: rgba(255,255,255,0.8); /* @kind color */
  --grey-light: rgb(255,255,255); /* @kind color */
  --grey-white: rgb(37,37,37); /* @kind color */
  --orange-orange-light: rgb(255,226,215); /* @kind color */
  --orange-primary-100: rgb(255,113,30); /* @kind color */
  --orange-primary-20: rgba(255,113,30,0.2); /* @kind color */
  --orange-primary-50: rgba(255,113,30,0.5); /* @kind color */
  --orange-primary-70: rgba(255,113,30,0.7); /* @kind color */
  --semantic-danger-05: rgba(255,61,77,0.05); /* @kind color */
  --semantic-danger-100: rgb(255,61,77); /* @kind color */
  --semantic-danger-10: rgba(255,61,77,0.1); /* @kind color */
  --semantic-danger-50: rgba(255,61,77,0.5); /* @kind color */
  --semantic-danger-70: rgba(255,61,77,0.7); /* @kind color */
  --semantic-info-05: rgba(56,157,255,0.05); /* @kind color */
  --semantic-info-100: rgb(56,157,255); /* @kind color */
  --semantic-info-10: rgba(56,157,255,0.1); /* @kind color */
  --semantic-info-50: rgba(56,157,255,0.5); /* @kind color */
  --semantic-info-70: rgba(56,157,255,0.7); /* @kind color */
  --semantic-success-05: rgba(48,233,124,0.05); /* @kind color */
  --semantic-success-100: rgb(48,233,124); /* @kind color */
  --semantic-success-10: rgba(48,233,124,0.1); /* @kind color */
  --semantic-success-50: rgba(48,233,124,0.5); /* @kind color */
  --semantic-success-70: rgba(48,233,124,0.7); /* @kind color */
  --semantic-warning-05: rgba(255,153,0,0.05); /* @kind color */
  --semantic-warning-100: rgb(255,153,0); /* @kind color */
  --semantic-warning-10: rgba(255,153,0,0.1); /* @kind color */
  --semantic-warning-50: rgba(255,153,0,0.5); /* @kind color */
  --semantic-warning-70: rgba(255,153,0,0.7); /* @kind color */
}

:root[data-mode="desktop"] {
  --size-h1: 40;
  --size-h2: 32;
  --size-h3: 24;
  --size-h4: 20;
  --size-h5: 14;
  --size-h6: 12;
  --size-p: 18;
}
