@layer base {
  
  body, :host {
    /* Color */
    --neutral-0: #F5FBEF;
--neutral-1: #F4F7F1;
--neutral-2: #EFF4E9;
--neutral-3: #E5EBDE;
--neutral-4: #DDE2D5;
--neutral-5: #D4DBCC;
--neutral-6: #CBD3C1;
--neutral-7: #C0C8B6;
--neutral-8: #ACB5A1;
--neutral-9: #7E8673;
--neutral-10: #747C69;
--neutral-11: #565E4C;
--neutral-12: #1C2213;
--neutral-overlay-dark: #1a1d16b3;
--neutral-overlay-deep: #c5cbbe0d;
--neutral-overlay-mid: #78866540;
--neutral-overlay-light: #f0f3ed75;
--brand-0: #f7f7f8;
--brand-1: #F5F6F7;
--brand-2: #EFF2F7;
--brand-3: #E4EAF6;
--brand-4: #D6E2F8;
--brand-5: #C6D7F8;
--brand-6: #B2C9F6;
--brand-7: #9BB6ED;
--brand-8: #7B9DE3;
--brand-9: #3668DD;
--brand-10: #2959CE;
--brand-11: #2A57BF;
--brand-12: #1A2F5C;
--brand-overlay-dark: #1a1f2a;
--brand-overlay-light: #d1e0ff80;
--success-0: #eef1ee;
--success-1: #F3F7F3;
--success-2: #ECF4ED;
--success-3: #D7F2DA;
--success-4: #C2EEC7;
--success-5: #ACE6B4;
--success-6: #93DA9E;
--success-7: #73CA83;
--success-8: #39B75B;
--success-9: #36DD68;
--success-10: #22D25D;
--success-11: #007B2B;
--success-12: #1A4223;
--success-overlay-dark: #13201682;
--success-overlay-light: #9cfcb280;
--warning-0: #fafaf9;
--warning-1: #F5F6F2;
--warning-2: #F3F4E7;
--warning-3: #EDF0C1;
--warning-4: #E6E9A4;
--warning-5: #DCE089;
--warning-6: #CDD17A;
--warning-7: #BCBF6B;
--warning-8: #A7A943;
--warning-9: #DDDF23;
--warning-10: #D2D529;
--warning-11: #6F7100;
--warning-12: #3D3E20;
--warning-overlay-dark: #1e1e16;
--warning-overlay-light: #f5f7b57d;
--critical-0: #F8F5F5;
--critical-1: #F8F5F5;
--critical-2: #F8F0F0;
--critical-3: #F7E2E2;
--critical-4: #FCD3D3;
--critical-5: #F9C5C5;
--critical-6: #F2B5B5;
--critical-7: #E9A1A2;
--critical-8: #DF8689;
--critical-9: #DD364F;
--critical-10: #CD2343;
--critical-11: #C2113A;
--critical-12: #661521;
--critical-overlay-dark: #231a1b;
--critical-overlay-light: #ffd1d88a;
--neutral-dark-0: #1B1E22;
--neutral-dark-1: #1B1D26;
--neutral-dark-2: #22242C;
--neutral-dark-3: #2E3342;
--neutral-dark-4: #2E3342;
--neutral-dark-5: #33394A;
--neutral-dark-6: #394055;
--neutral-dark-7: #444C66;
--neutral-dark-8: #596487;
--neutral-dark-9: #647096;
--neutral-dark-10: #707CA1;
--neutral-dark-11: #A9B3D2;
--neutral-dark-12: #EBEEF6;
--brand-dark-1: #1B202D;
--brand-dark-2: #1B202D;
--brand-dark-3: #212D4C;
--brand-dark-4: #273663;
--brand-dark-5: #2E3F72;
--brand-dark-6: #36497F;
--brand-dark-7: #3F5491;
--brand-dark-8: #4861A8;
--brand-dark-9: #496AD0;
--brand-dark-10: #4861A8;
--brand-dark-11: #99B4FB;
--brand-dark-12: #D7E2FB;
--success-dark-1: #192018;
--success-dark-2: #1D241C;
--success-dark-3: #243322;
--success-dark-4: #264222;
--success-dark-5: #2C4F28;
--success-dark-6: #335C2E;
--success-dark-7: #3A6B34;
--success-dark-8: #417C39;
--success-dark-9: #4AAE3D;
--success-dark-10: #3DA22F;
--success-dark-11: #72D266;
--success-dark-12: #BFF2B7;
--warning-dark-1: #1F1E19;
--warning-dark-2: #26241F;
--warning-dark-3: #302D23;
--warning-dark-4: #3A3625;
--warning-dark-5: #453E28;
--warning-dark-6: #52492B;
--warning-dark-7: #63572E;
--warning-dark-8: #7A6A32;
--warning-dark-9: #AE953D;
--warning-dark-10: #A28930;
--warning-dark-11: #D1BB72;
--warning-dark-12: #F1E3B6;
--critical-dark-1: #241B1C;
--critical-dark-2: #281E1F;
--critical-dark-3: #441C23;
--critical-dark-4: #571A27;
--critical-dark-5: #661F2E;
--critical-dark-6: #752938;
--critical-dark-7: #8D3647;
--critical-dark-8: #B7455B;
--critical-dark-9: #AE3D54;
--critical-dark-10: #933B4B;
--critical-dark-11: #FF8EA1;
--critical-dark-12: #FFD2D7;
    /* Fonts */
    --font-outfit: 'Outfit',sans-serif;
--font-ptmono: 'PT Mono',monospace;
--font-syncopate: 'Syncopate',sans-serif;

    /* Font size */
    --text-3xs: 0.6rem;
--text-2xs: 0.68rem;
--text-xs: 0.75rem;
--text-sm: 0.875rem;
--text-md: 1rem;
--text-lg: 1.125rem;
--text-xl: 1.25rem;
--text-2xl: 1.5rem;
--text-3xl: 1.875rem;
--text-4xl: 2.25rem;
--text-5xl: 3rem;
--text-6xl: 3.75rem;
    /* Font weight */
    --normal: 400;
--medium: 500;
--semi: 600;
--bold: 700;
    /* Shadows */
    --shadow-sm:  0 1px 2px 0 rgba(0, 0, 0, 0.25);
--shadow-base:  0 1px 3px 0 rgba(0, 0, 0, 0.25), 0 1px 2px 0 rgba(0, 0, 0, 0.25);
--shadow-md:  0 4px 6px -1px rgba(0, 0, 0, 0.25), 0 2px 4px -1px rgba(0, 0, 0, 0.25);
--shadow-lg:  0 10px 15px -3px rgba(0, 0, 0, 0.25), 0 4px 6px -2px rgba(0, 0, 0, 0.25);
--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.25), 0 10px 10px -5px rgba(0, 0, 0, 0.25);
--shadow-2xl:  0 25px 50px -12px rgba(0, 0, 0, 0.25);
    /* Border radius */
    
    /* Spacing */
    --rounding-none: 0px;
--rounding-xs: 0.125rem;
--rounding-sm: 0.25rem;
--rounding-md: 0.375rem;
--rounding-lg: 0.5rem;
--rounding-xl: 0.75rem;
--rounding-2xl: 1rem;
--rounding-3xl: 1.5rem;
--rounding-full: 9999px;
--border-none: 0px;
--border-xs: 0.087rem;
--border-sm: 0.125rem;
--border-md: 0.1875rem;
--border-lg: 0.25rem;
--border-focus: 0.2rem;
--line-height-xs: 1.125rem;
--line-height-sm: 1.25rem;
--line-height-md: 1.5rem;
--line-height-lg: 1.75rem;
--line-height-xl: 1.875rem;
--line-height-2xl: 2rem;
--line-height-3xl: 2.375rem;
--line-height-4xl: 2.75rem;
--line-height-5xl: 3.75rem;
--line-height-6xl: 4.5rem;
--letter-spacing-xs: 0rem;
--letter-spacing-sm: 0rem;
--letter-spacing-md: 0rem;
--letter-spacing-lg: 0rem;
--letter-spacing-xl: 0rem;
--letter-spacing-2xl: 0rem;
--letter-spacing-3xl: 0rem;
--letter-spacing-4xl: -0.045rem;
--letter-spacing-5xl: -0.0575rem;
--letter-spacing-6xl: -0.075rem;
--interactive-2xs: 1.72rem;
--interactive-xs: 2.1rem;
--interactive-sm: 2.35rem;
--interactive-md: 2.75rem;
--interactive-lg: 3.25rem;
--toggle-height-md: 1.5rem;
--spinner-size-sm: 1.25rem;
--spinner-size-md: 1.5rem;
--spinner-size-lg: 1.75rem;
--side-menu-width: 240px;
--header-height: 4rem;
--avatar-size-sm: 1.5rem;
--avatar-size-md: 2rem;
--avatar-size-lg: 3rem;
--badge-size-sm: 1.5rem;
--badge-size-md: 2rem;
--badge-size-lg: 2.5rem;
--4xs: 0.125rem;
--3xs: 0.25rem;
--2xs: 0.375rem;
--xs: 0.5rem;
--sm: 0.75rem;
--md: 1rem;
--lg: 1.5rem;
--xl: 2rem;
--2xl: 2.5rem;
--3xl: 3rem;
--4xl: 4rem;
--5xl: 6rem;
--6xl: 8rem;
--7xl: 10rem;
--none: 0rem;
--page: 75rem;
--modal-lg: 40rem;
--modal-md: 30rem;
--modal-sm: 22rem;
--menu-left: 15rem;
--menu-top: 5rem;
--menu-bottom: 4rem;
--menu-right: 12rem;
--font-family: Outfit;
--icon-size: 1.1rem;
--content-max-width: 44rem;
    /* Z-index */
    --side-menu: 1000;
--side-menu-backdrop: 990;
--toc-sidebar-mobile: 120;
--toc-sidebar: 100;
--swipe-prevent: 2000;
--app-header: 500;
--ask-ai: 1500;
--ask-ai-backdrop: 1490;
--ask-ai-button: 1;
--tooltip: 10;
  }
  @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;
    }
  }
}