/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --quipu-color-fg-inverse: rgb(255, 255, 255); /** Text for high-emphasis surfaces (e.g., bg-main) */
  --quipu-color-fg-disabled: rgb(196, 196, 196); /** Disabled text and icons */
  --quipu-color-fg-subtle: rgb(108, 108, 108); /** Secondary text, meta, or hint text */
  --quipu-color-fg-strong: rgb(54, 54, 54); /** Text on subtle background for better contrast. In between default and subtle in strength */
  --quipu-color-fg-default: rgb(17, 17, 17); /** Neutral text for standard content */
  --quipu-color-fg-info-strong: rgb(8, 80, 152); /** info text that keeps contrast on bg-info-subtle */
  --quipu-color-fg-assistant-strong: rgb(94, 58, 142); /** Strong assistant text for use on subtle backgrounds. */
  --quipu-color-fg-assistant: rgb(132, 60, 213); /** Brighter assistant text */
  --quipu-color-fg-warning-strong: rgb(113, 70, 0); /** Stronger warning text. Keeps contrast on bg-warning-subtle */
  --quipu-color-fg-warning: rgb(150, 95, 0); /** Brighter warning text */
  --quipu-color-fg-error-strong: rgb(140, 39, 47); /** Stronger error text for use on eg. subtle backgrounds */
  --quipu-color-fg-error: rgb(203, 0, 50); /** Error text on light surfaces (e.g., menu text) */
  --quipu-color-fg-error-hover: rgb(140, 39, 47); /** Hover state for error foreground elements. */
  --quipu-color-fg-error-active: rgb(99, 21, 28); /** Active/pressed state of fg-error */
  --quipu-color-fg-success-strong: rgb(26, 97, 10); /** Stronger / darker success text. Keeps contrast on bg-success-subtle */
  --quipu-color-fg-success: rgb(30, 131, 0); /** Success text on light surfaces. */
  --quipu-color-fg-main: rgb(0, 127, 100); /** Primary action text color (e.g. links, outlined buttons, tertiary buttons). */
  --quipu-color-fg-main-hover: rgb(0, 95, 74); /** Hover state of fg-main */
  --quipu-color-fg-main-active: rgb(0, 65, 50); /** Active/pressed state of fg-main */
  --quipu-color-fg-supportive-strong: rgb(0, 58, 89); /** Strong supportive text. Keeps contrast on bg-subtle  */
  --quipu-color-fg-supportive: rgb(30, 115, 165); /** Supportive accent text on light surfaces.  */
  --quipu-color-fg-supportive-hover: rgb(0, 86, 129); /** Hover state of fg-supportive */
  --quipu-color-fg-supportive-active: rgb(0, 58, 89); /** Active/pressed state of fg-supportive */
  --quipu-color-bg-error-subtle: rgb(255, 231, 230); /** Subtle error background for low emphasis elements */
  --quipu-color-bg-error: rgb(203, 0, 50); /** High emphasis error bg */
  --quipu-color-bg-success: rgb(30, 131, 0); /** High emphasis success background */
  --quipu-color-bg-success-subtle: rgb(215, 249, 208); /** Subtle success backgroud for low emphasis elements */
  --quipu-color-bg-info: rgb(0, 106, 205); /** High emphasis info elements */
  --quipu-color-bg-info-subtle: rgb(227, 239, 255); /** Subtle info background for low emphasis elements */
  --quipu-color-bg-warning: rgb(191, 122, 0); /** Warning background for high-emphasis feedback. */
  --quipu-color-bg-warning-subtle: rgb(255, 234, 210); /** Subtle warning background. */
  --quipu-color-bg-supportive: rgb(30, 115, 165); /** Supportive accent background for navigation and state */
  --quipu-color-bg-neutral: rgb(108, 108, 108); /** Neutral background for low-emphasis surfaces. */
  --quipu-color-bg-neutral-strong: rgb(54, 54, 54); /** Strong neutral background requiring inverse foreground color. */
  --quipu-color-bg-neutral-subtle: rgb(237, 237, 237); /** Very subtle neutral background for soft grouping or emphasis. */
  --quipu-color-bg-main: rgb(0, 127, 100); /** High-emphasis surface/background */
  --quipu-color-bg-main-subtle: rgb(220, 244, 235); /** Subtle main action background for low-emphasis action containers */
  --quipu-color-bg-surface: rgb(255, 255, 255); /** The background color for elements such as card or widget. Containers sitting on the background */
  --quipu-color-bg-disabled: rgb(237, 237, 237); /** Background for disabled elements. */
  --quipu-color-bg-background: linear-gradient(-45deg, #F2F8FC 0%, #F4F8FA 18%, #F7F7F7 35%, #F7F7F7 68%, #F2F8FC 95% ); /** The default background color of the platform. Sits behind all page content. */
  --quipu-color-bg-assistant: rgb(132, 60, 213); /** High emphasis assistant background */
  --quipu-color-bg-assistant-subtle: rgb(240, 234, 255); /** Subtle emphasis background for low emphasis elements */
  --quipu-color-bg-appbar: lch(100 0 none / 0.1); /** Combine with blur to create appbar background */
  --quipu-color-bg-main-hover: rgb(0, 95, 74); /** Hover state of bg-main */
  --quipu-color-bg-main-subtle-hover: rgb(241, 249, 246); /** Hoverstate of bg-main-subtle */
  --quipu-color-bg-main-active: rgb(0, 65, 50); /** Active and pressed state for bg-main */
  --quipu-color-bg-main-subtle-active: rgb(220, 244, 235); /** Active/pressed state of bg-main-subtle */
  --quipu-color-bg-neutral-strong-hover: rgb(17, 17, 17); /** Hover state of bg-neutral-strong */
  --quipu-color-bg-neutral-hover: rgb(81, 81, 81); /** Hover state for bg-neutral */
  --quipu-color-bg-neutral-subtle-hover: rgb(247, 247, 247); /** Hover state of bg-neutral-subtle-hover */
  --quipu-color-bg-neutral-active: rgb(54, 54, 54); /** Active/pressed state for bg-neutral background */
  --quipu-color-bg-neutral-subtle-active: rgb(237, 237, 237); /** Active/Pressed state for bg-neutral-subtle */
  --quipu-color-bg-error-hover: rgb(140, 39, 47); /** Hover state of bg-error */
  --quipu-color-bg-error-subtle-hover: rgb(255, 244, 243); /** Hover state of bg-error-subtle */
  --quipu-color-bg-error-active: rgb(99, 21, 28); /** Active/Pressed state of bg-error-active */
  --quipu-color-bg-error-subtle-active: rgb(255, 231, 230); /** Active/pressed state of bg-error-subtle */
  --quipu-color-bg-supportive-subtle: rgb(222, 241, 255); /** Subtle supportive background for low-emphasis surfaces. */
  --quipu-color-bg-supportive-hover: rgb(0, 86, 129); /** Hover state of bg-supportive */
  --quipu-color-bg-supportive-subtle-hover: rgb(241, 248, 252); /** Hover state of bg-supportive-subtle */
  --quipu-color-bg-supportive-active: rgb(0, 58, 89); /** Active/pressed state of bg-supportive-active */
  --quipu-color-bg-supportive-subtle-active: rgb(222, 241, 255); /** Active/pressed sate of bg-supportive-subtle */
  --quipu-color-border-disabled: rgb(220, 220, 220); /** Border color for disabled components. */
  --quipu-color-border-subtle: rgb(237, 237, 237); /** Low-contrast border for soft separation used in eg. dividers */
  --quipu-color-border-inverse: rgb(255, 255, 255); /** Border color used on dark or high-emphasis surfaces. */
  --quipu-color-border-focus: rgb(21, 138, 255); /** Focus ring color used for all focus outlines */
  --quipu-color-border-error: rgb(203, 0, 50); /** Default border color for error elements */
  --quipu-color-border-success: rgb(30, 131, 0); /** Default border color for success elements */
  --quipu-color-border-warning: rgb(236, 152, 0); /** Default border color for warning elements */
  --quipu-color-border-main: rgb(0, 127, 100); /** Border color for primary interactive elements */
  --quipu-color-border-main-hover: rgb(0, 95, 74); /** Hover state for border-main */
  --quipu-color-border-main-active: rgb(0, 65, 50); /** Active/pressed state for border-main */
  --quipu-color-border-error-hover: rgb(140, 39, 47); /** Hover state for error borders. */
  --quipu-color-border-error-active: rgb(99, 21, 28); /** Active/pressed state for error borders. */
  --quipu-color-border-default: rgb(220, 220, 220); /** Default border color for neutral components */
  --quipu-color-border-hover: rgb(173, 173, 173); /** Hover state for default borders. */
  --quipu-color-border-active: rgb(54, 54, 54); /** Active/pressed state for default borders */
  --quipu-color-border-supportive: rgb(30, 115, 165); /** Supportive border color */
  --quipu-color-border-supportive-hover: rgb(0, 86, 129); /** Hover state for supportive borders. */
  --quipu-color-border-supportive-active: rgb(0, 58, 89); /** Active/pressed state for supportive borders. */
  --quipu-color-graphic-rating: rgb(244, 187, 21); /** For rating elements like star */
  --quipu-color-graphic-success: rgb(41, 167, 0); /** Bright success color for visual elements */
  --quipu-color-graphic-error: rgb(255, 21, 68); /** Bright error color for visual elements */
  --quipu-color-graphic-warning: rgb(236, 152, 0); /** Bright warning color for visual elements */
  --quipu-color-graphic-info: rgb(21, 138, 255); /** Bright main color for graphics - not suitable for text */
  --quipu-color-graphic-supportive: rgb(0, 148, 218); /** Bright supportive color for graphics - not suitable for text */
  --quipu-color-graphic-assistant: rgb(164, 92, 255); /** Bright assistant color for graphics - not suitable for text */
  --quipu-color-overlay-default: lch(0 0 none / 0.35); /** Default overlay for backdrops in modals and dialogs */
  --quipu-color-overlay-subtle: lch(0 0 none / 0.1); /** Subtle overlay for lightweight focus or emphasis. */
  --quipu-color-boxShadow-button-main-strong: rgb(0, 65, 50); /** playful shadows for primary learner buttons */
  --quipu-color-boxShadow-button-main: rgb(0, 95, 74); /** playful shadows for primary learner buttons */
  --quipu-color-boxShadow-button-main-subtle: rgb(188, 232, 216); /** playful shadows for primary learner buttons */
  --quipu-dimension-container-padding: 1.5rem;
  --quipu-dimension-negative-sm: -0.5rem;
  --quipu-fontSize-heading-xs: 1rem;
  --quipu-fontSize-heading-sm: 1.25rem;
  --quipu-fontSize-heading-md: 1.5rem;
  --quipu-fontSize-heading-lg: 1.75rem;
  --quipu-fontSize-heading-xl: 2rem;
  --quipu-fontSize-heading-2xl: 2.5rem;
  --quipu-fontSize-body-sm: 0.875rem;
  --quipu-fontSize-body-md: 1rem;
  --quipu-fontSize-body-lg: 1.125rem;
  --quipu-fontSize-label-xs: 0.625rem;
  --quipu-fontSize-label-sm: 0.75rem;
  --quipu-fontSize-label-md: 0.875rem;
  --quipu-fontSize-label-lg: 1rem;
  --quipu-lineHeight-body-sm: 1.125rem;
  --quipu-lineHeight-body-md: 1.6rem;
  --quipu-lineHeight-body-lg: 2rem;
  --quipu-lineHeight-label-sm: 1rem;
  --quipu-lineHeight-label-md: 1.125rem;
  --quipu-lineHeight-label-lg: 1.25rem;
  --quipu-lineHeight-heading-xs: 1.2rem;
  --quipu-lineHeight-heading-sm: 1.5rem;
  --quipu-lineHeight-heading-md: 1.8rem;
  --quipu-lineHeight-heading-lg: 2.1rem;
  --quipu-lineHeight-heading-xl: 2.4rem;
  --quipu-lineHeight-heading-2xl: 2.7rem;
  --quipu-letterSpacing-body-sm: 0rem;
  --quipu-letterSpacing-body-md: 0rem;
  --quipu-letterSpacing-body-lg: 0rem;
  --quipu-letterSpacing-label-sm: 0.0075rem;
  --quipu-letterSpacing-label-md: 0.01rem;
  --quipu-letterSpacing-label-lg: 0.0125rem;
  --quipu-letterSpacing-heading-xs: -0.025rem;
  --quipu-letterSpacing-heading-sm: -0.03rem;
  --quipu-letterSpacing-heading-md: -0.035rem;
  --quipu-letterSpacing-heading-lg: 0rem;
  --quipu-letterSpacing-heading-xl: 0rem;
  --quipu-letterSpacing-heading-2xl: 0rem;
  --quipu-fontWeight-label: 500;
  --quipu-fontWeight-labelEmphasis: 600;
  --quipu-fontWeight-labelSubtle: 400;
  --quipu-fontWeight-heading: 600;
  --quipu-fontWeight-title: 700;
  --quipu-fontWeight-body: 400;
  --quipu-paragraphSpacing-heading-sm: 3.6rem;
  --quipu-paragraphSpacing-heading-md: 4.5rem;
  --quipu-paragraphSpacing-heading-lg: 4.5rem;
  --quipu-paragraphSpacing-body-sm: 1.575rem;
  --quipu-paragraphSpacing-body-md: 1.8rem;
  --quipu-paragraphSpacing-body-lg: 2.025rem;
  --quipu-fontFamily-heading: 'Roboto Flex';
  --quipu-fontFamily-body: 'Roboto Flex';
  --quipu-appbar-backgroundBlur: 0.75rem; /** Blur amount applied to translucent app bar background */
  --quipu-card-color-bg-disabled: lch(100 0 none / 0.8); /** Background color for disabled card surfaces. */
  --quipu-gap-2xs: 0.125rem; /** 2px */
  --quipu-gap-xs: 0.25rem; /** 4px */
  --quipu-gap-sm: 0.375rem;
  --quipu-gap-md: 0.5rem; /** 8px */
  --quipu-gap-lg: 0.75rem;
  --quipu-gap-xl: 1rem; /** 16px */
  --quipu-gap-2xl: 1.5rem; /** 24px */
  --quipu-gap-3xl: 2rem; /** 32px */
  --quipu-padding-3xs: 0.125rem;
  --quipu-padding-2xs: 0.25rem;
  --quipu-padding-xs: 0.5rem;
  --quipu-padding-sm: 0.75rem;
  --quipu-padding-md: 1rem;
  --quipu-padding-lg: 1.25rem;
  --quipu-padding-xl: 1.5rem;
  --quipu-padding-2xl: 1.75rem;
  --quipu-padding-3xl: 2rem;
  --quipu-padding-static-xs: 0.125rem;
  --quipu-padding-static-3xl: 2.25rem;
  --quipu-size-sm: 0.5rem; /** 8px */
  --quipu-size-md: 0.75rem; /** 12px */
  --quipu-size-lg: 1rem; /** 16px */
  --quipu-size-xl: 1.25rem; /** 20px */
  --quipu-size-2xl: 1.5rem; /** 24px */
  --quipu-size-3xl: 1.75rem; /** 28px */
  --quipu-size-4xl: 2rem; /** 32px */
  --quipu-size-5xl: 2.25rem; /** 36px */
  --quipu-size-6xl: 2.5rem; /** 40px */
  --quipu-size-7xl: 3rem; /** 48px */
  --quipu-size-8xl: 4rem; /** 64px */
  --quipu-size-9xl: 5rem; /** 80px */
  --quipu-size-10xl: 6rem; /** 96px */
  --quipu-size-indicatorHeight: 0.125rem;
  --quipu-control-gap-2xs: 0.125rem;
  --quipu-control-gap-xs: 0.25rem;
  --quipu-control-gap-sm: 0.375rem;
  --quipu-control-gap-md: 0.5rem;
  --quipu-control-gap-lg: 0.625rem;
  --quipu-control-gap-xl: 1rem; /** 16px */
  --quipu-control-gap-2xl: 1.5rem; /** 24 px */
  --quipu-control-size-sm: 2rem;
  --quipu-control-size-md: 2.5rem;
  --quipu-control-size-lg: 3rem;
  --quipu-control-padding-edgetotext-3xs: 0.25rem;
  --quipu-control-padding-edgetotext-2xs: 0.375rem;
  --quipu-control-padding-edgetotext-xs: 0.5rem;
  --quipu-control-padding-edgetotext-sm: 0.75rem;
  --quipu-control-padding-edgetotext-md: 1rem;
  --quipu-control-padding-edgetotext-lg: 1.25rem;
  --quipu-control-padding-edgetoicon-3xs: 0.125rem;
  --quipu-control-padding-edgetoicon-2xs: 0.25rem;
  --quipu-control-padding-edgetoicon-xs: 0.375rem;
  --quipu-control-padding-edgetoicon-sm: 0.625rem;
  --quipu-control-padding-edgetoicon-md: 0.875rem;
  --quipu-control-padding-edgetoicon-lg: 1.125rem;
  --quipu-button-elevation-primary: 0px 0px 0 0 rgb(0, 65, 50);
  --quipu-button-elevation-primary-hover: 0px 0px 0 0 rgb(0, 65, 50);
  --quipu-button-elevation-secondary: 0px 0px 0 0 rgb(0, 95, 74);
  --quipu-button-elevation-secondary-hover: 0px 0px 0 0 rgb(0, 95, 74);
  --quipu-button-elevation-tertiary: 0px 0px 0 0 rgb(188, 232, 216);
  --quipu-button-elevation-tertiary-hover: 0px 0px 0 0 rgb(188, 232, 216);
  --quipu-button-borderRadius-sm: 0.25rem;
  --quipu-button-borderRadius-md: 0.25rem;
  --quipu-button-borderRadius-lg: 0.25rem;
  --quipu-elevation-level1: 0 1px 2px 1px rgba(0,0,0,0.06), 0 0 1px -2px rgba(0,0,0,0.08);
  --quipu-elevation-level2: 0 4px 6px 1px rgba(0,0,0,0.06), 0 0 2px 0 rgba(0,0,0,0.12);
  --quipu-elevation-level3: 0 6px 16px 2px rgba(0,0,0,0.07), 0 0 4px 0 rgba(0,0,0,0.12);
  --quipu-elevation-level4: 0 8px 24px 3px rgba(0,0,0,0.08), 0 6px 10px 1px rgba(0,0,0,0.04);
  --quipu-elevation-level5: 0 12px 36px 5px rgba(0,0,0,0.12), 0 12px 10px -5px rgba(0,0,0,0.05);
  --quipu-elevation-level5-inverse: 0 -6px 36px 5px rgba(0,0,0,0.12), 0 6px 10px -5px rgba(0,0,0,0.05);
  --quipu-shadow-xpos-xs: 0px;
  --quipu-shadow-ypos-xs-hover: 0px;
  --quipu-shadow-ypos-xs: 0px;
  --quipu-icon-size-sm: 0.9375rem;
  --quipu-icon-size-md: 1.25rem;
  --quipu-icon-size-lg: 1.5625rem;
  --quipu-icon-size-xl: 1.875rem;
  --quipu-icon-size-2xl: 2.1875rem;
  --quipu-icon-size-bodySm: 1.0938rem;
  --quipu-icon-size-bodyMd: 1.25rem;
  --quipu-icon-size-bodyLg: 1.4063rem;
  --quipu-icon-size-labelLg: 1.25rem;
  --quipu-icon-size-labelMd: 1.0938rem;
  --quipu-icon-size-labelSm: 0.9375rem;
  --quipu-icon-size-labelXs: 0.7813rem;
  --quipu-icon-size-playfulSm: 0.9375rem;
  --quipu-icon-size-playfulMd: 1.25rem;
  --quipu-icon-size-playfulLg: 1.5625rem;
  --quipu-icon-size-playfulXl: 1.875rem;
  --quipu-icon-size-playful2xl: 2.1875rem;
  --quipu-borderRadius-2xs: 0.125rem;
  --quipu-borderRadius-xs: 0.25rem;
  --quipu-borderRadius-sm: 0.375rem;
  --quipu-borderRadius-md: 0.5rem;
  --quipu-borderRadius-lg: 0.75rem;
  --quipu-borderRadius-pill: 999px;
  --quipu-borderWidth-thinnest: 0.5px;
  --quipu-borderWidth-thin: 1px;
  --quipu-borderWidth-thick: 2px;
  --quipu-borderWidth-thicker: 4px;
  --quipu-borderWidth-thickest: 8px;
  --quipu-borderWidth-circle-xs: 0.375rem;
  --quipu-borderWidth-circle-sm: 0.5rem;
  --quipu-borderWidth-circle-md: 10px;
  --quipu-borderWidth-circle-lg: 12px;
  --quipu-playful: false;
  --quipu-static-2xs: 0.125rem; /** 2px */
  --quipu-static-xs: 0.25rem; /** 4px */
  --quipu-static-6xl: 2.5rem;
  --quipu-media-height-xs: 80px;
  --quipu-media-height-sm: 120px;
  --quipu-media-height-md: 160px;
  --quipu-media-height-lg: 192px;
  --quipu-media-height-xl: 256px;
  --quipu-media-height-2xl: 320px;
  --quipu-Navigation: Expandable;
  --quipu-navRail-width-collapsed: 3.25rem;
  --quipu-navRail-width-fixed: 5.5rem;
  --quipu-navRail-width-expanded: 15rem;
  --quipu-aspectRatio-portrait: 1.5:1; /** Used for horizontal card media */
  --quipu-clasSwitcher: true;
  --quipu-heading-2xl: 600 2.5rem/2.7rem 'Roboto Flex';
  --quipu-heading-xl: 600 2rem/2.4rem 'Roboto Flex';
  --quipu-heading-lg: 600 1.75rem/2.1rem 'Roboto Flex';
  --quipu-heading-md: 600 1.5rem/1.8rem 'Roboto Flex';
  --quipu-heading-sm: 600 1.25rem/1.5rem 'Roboto Flex';
  --quipu-heading-xs: 600 1rem/1.2rem 'Roboto Flex';
  --quipu-body-sm: 400 0.875rem/1.125rem 'Roboto Flex';
  --quipu-body-md: 400 1rem/1.6rem 'Roboto Flex';
  --quipu-body-lg: 400 1.125rem/2rem 'Roboto Flex';
  --quipu-label-xs: 500 0.625rem/1rem 'Roboto Flex';
  --quipu-label-xs-emphasis: 700 0.625rem/1rem 'Roboto Flex';
  --quipu-label-sm: 500 0.75rem/1rem 'Roboto Flex';
  --quipu-label-sm-emphasis: 600 0.75rem/1rem 'Roboto Flex';
  --quipu-label-sm-subtle: 400 0.75rem/1rem 'Roboto Flex';
  --quipu-label-md: 500 0.875rem/1.125rem 'Roboto Flex';
  --quipu-label-md-emphasis: 600 0.875rem/1.125rem 'Roboto Flex';
  --quipu-label-md-subtle: 400 0.875rem/1.125rem 'Roboto Flex';
  --quipu-label-lg: 500 1rem/1.25rem 'Roboto Flex';
  --quipu-label-lg-emphasis: 600 1rem/1.25rem 'Roboto Flex';
  --quipu-label-lg-subtle: 400 1rem/1.25rem 'Roboto Flex';
}

@font-face {
  font-family: "Roboto Flex";
  font-weight: 100 1000;
  font-style: normal;

  font-display: auto;
  src:
    url("https://quipu.infinicloud.app/assets/fonts/roboto-flex-v2/roboto-flex_5.2.5_latin-wght-normal.woff2")
    format("woff2-variations"),
    local(sans-serif);
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* 
 * @supports block with OKLCH colors has been removed to allow theme overrides to work correctly.
 * RGB/hex colors above provide excellent browser support and proper theme inheritance.
 * If you need OKLCH support, theme-specific overrides should include their own @supports blocks.
 */

/* 
 * Theme class for explicit Quipu theme selection.
 * Inherits all tokens from :root above, no overrides needed.
 * Used for consistent theme switching with QuipuThemeProvider.
 */
.theme-quipu {
  /* All Quipu tokens are already defined in :root */
  /* This class exists for consistency with other theme classes */
}