:root {
  --primaryColor: #65536e;
  --primaryDarkModeColor: #dbc3e6;
  --secondaryColor: #b7e4e0;
  --secondaryColorDarkmode: #b7e4e0;
  --tertiaryColor: #b8e2f4;
  --tertiaryColorDarkmode: #b8e2f4;
  --accentColor: #d3d2d6;
  --accentColorDarkmode: #d3d2d6;
  --textColor: #545454;
  --textColorDarkMode: #f6f4f7;
  --textColorDarkModePrimary: #d3d2d6;
  --backgroundColor: #f8f6fa;
  --backgroundColorDarkMode: #242329;
  --cardBackgroundColor: #ffffff;
  --cardBackgroundColorDark: #302e36;
  --linkColor: #65536e;
  --hoverColor: #514158;
  --activeColor: #356864;
  --fontStack: 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --fontWeight: 400;
  --lineHeight: 1.6;
  --baseFontSize: 16px;
  --h1FontSize: 2em;
  --h2FontSize: 1.5em;
  --h1Color: #545454;
  --h2Color: #545454;
  --paragraphColor: #545454;
  --headingFontWeight: 600;
  --defaultPadding: 8px;
  --defaultMargin: 8px;
  --buttonBackgroundColor: #dbc3e6;
  --buttonBackgroundColorHover: #b7e4e0;
  --buttonTextColor: #101b15;
  --buttonBorderRadius: 8px;
  --inputBorderColor: #807786;
  --inputBorderRadius: 8px;
  --inputTextColor: #545454;
  --animationDuration: 0.18s;
  --boxShadowIntensity: 4px;
  --footerBackground: #f1f5f6;
  --headerBackground: #b7e4e0;
  --borderRadius: 12px;
  --boxShadow: 0px 4px 16px 0px rgba(0,0,0,0.08);
  --containerMaxWidthMobile: 100%;
  --containerMaxWidthTablet: 768px;
  --containerMaxWidthDesktop: 1200px;
  --containerPadding: 24px;
  --footerHeightDektop: 80px;
  --footerHeightTablet: 100px;
  --footerHeightMobile: 120px;
  --navBackgroundColor: #b7e4e0;
  --themeMode: system;
  --automaticButtonText: true;
  --automaticTextContrast: true;
  --navBackgroundColorDark: #302e36;
  --navTextColorDark: #f6f4f7;
  --inputBackgroundColor: #ffffff;
  --inputBackgroundColorDark: #302e36;
  --inputTextColorDark: #f6f4f7;
  --inputBorderColorDark: #a99aae;
  --h1ColorDark: #f6f4f7;
  --h2ColorDark: #f6f4f7;
  --paragraphColorDark: #f6f4f7;
  --navDropdownBackgroundDark: #302e36;
  --footerBackgroundDark: #302e36;
  --buttonBackgroundColorActive: #b8e2f4;
  --buttonBackgroundColorDisabled: #d3d2d6;
  --buttonBackgroundColorDark: #dbc3e6;
  --buttonBackgroundColorHoverDark: #b7e4e0;
  --buttonBackgroundColorActiveDark: #b8e2f4;
  --buttonBackgroundColorDisabledDark: #48464e;
  --buttonTextColorHover: #101b15;
  --buttonTextColorDisabled: #545454;
  --buttonTextColorDark: #101b15;
  --buttonTextColorHoverDark: #101b15;
  --buttonTextColorDisabledDark: #d3d2d6;
  --buttonFontSize: 16px;
  --buttonFontWeight: 600;
  --buttonTextTransform: none;
  --buttonBorderColor: #65536e;
  --buttonBorderColorHover: #356864;
  --buttonBorderColorDark: #dbc3e6;
  --buttonBorderColorHoverDark: #b7e4e0;
  --buttonBorderWidth: 0px;
  --buttonBorderStyle: solid;
  --buttonPadding: 12px 20px;
  --buttonPaddingHorizontal: 20px;
  --buttonPaddingVertical: 12px;
  --buttonMinWidth: 0px;
  --buttonHeight: 48px;
  --preferDarkMode: false;
  --darkModeTransitionDuration: 0.18s;
  --navTextColor: #545454;
  --navLinkColor: #65536e;
  --navLinkHoverColor: #514158;
  --navLinkActiveColor: #44364a;
  --navLinkColorDark: #dbc3e6;
  --navLinkHoverColorDark: #b7e4e0;
  --navLinkActiveColorDark: #b8e2f4;
  --navDropdownBackground: #ffffff;
  --navHeight: 72px;
  --navBorderBottom: 1px solid #d3d2d6;
  --theme-surface: var(--backgroundColor);
  --theme-card: var(--cardBackgroundColor);
  --theme-card-text: #545454;
  --theme-card-heading-1: #545454;
  --theme-card-heading-2: #545454;
  --theme-card-paragraph: #545454;
  --theme-card-muted: #101b15;
  --theme-card-link: #65536e;
  --theme-card-link-hover: #514158;
  --theme-card-accent-text: #65536e;
  --theme-surface-muted: color-mix(in srgb, var(--theme-surface) 92%, var(--theme-text-primary));
  --theme-text-primary: var(--textColor);
  --theme-text-muted: #101b15;
  --theme-accent-text: #65536e;
  --theme-accent: var(--primaryColor);
  --theme-accent-strong: var(--buttonBackgroundColorHover);
  --theme-accent-contrast: #ffffff;
  --theme-header-background: var(--headerBackground);
  --theme-secondary: var(--secondaryColor);
  --theme-link: #65536e;
  --theme-link-hover: #514158;
  --theme-info: var(--tertiaryColor);
  --theme-warning: var(--accentColor);
  --theme-success: var(--activeColor);
  --theme-button-bg: var(--buttonBackgroundColor);
  --theme-button-hover: var(--buttonBackgroundColorHover);
  --theme-button-active: var(--buttonBackgroundColorActive);
  --theme-button-disabled: var(--buttonBackgroundColorDisabled);
  --theme-button-text: var(--buttonTextColor);
  --theme-button-text-hover: var(--buttonTextColorHover);
  --theme-button-text-disabled: var(--buttonTextColorDisabled);
  --theme-button-border: var(--buttonBorderColor);
  --theme-button-border-hover: var(--buttonBorderColorHover);
  --theme-nav-bg: var(--navBackgroundColor);
  --theme-nav-text: var(--navTextColor);
  --theme-nav-link: var(--navLinkColor);
  --theme-nav-link-hover: var(--navLinkHoverColor);
  --theme-nav-link-active: var(--navLinkActiveColor);
  --theme-nav-dropdown: var(--navDropdownBackground);
  --theme-nav-dropdown-text: #545454;
  --theme-input-bg: var(--inputBackgroundColor);
  --theme-input-text: var(--inputTextColor);
  --theme-input-border: var(--inputBorderColor);
  --theme-heading-1: var(--h1Color);
  --theme-heading-2: var(--h2Color);
  --theme-paragraph: var(--paragraphColor);
  --theme-footer-bg: var(--footerBackground);
  --theme-footer-text: #545454;
  --primary-color: var(--theme-accent);
  --primary-color-dark: var(--theme-accent-strong);
  --primary-color-light: color-mix(in srgb, var(--theme-accent) 70%, white);
  --primaryColorHover: var(--theme-accent-strong);
  --color-primary: var(--theme-accent);
  --color-primary-hover: var(--theme-accent-strong);
  --color-secondary: var(--theme-secondary);
  --color-accent: var(--theme-warning);
  --color-background: var(--theme-surface);
  --color-background-alt: var(--theme-surface-muted);
  --color-text: var(--theme-text-primary);
  --color-text-muted: var(--theme-text-muted);
  --color-border: var(--theme-input-border);
  --color-success: var(--theme-success);
  --color-warning: var(--theme-warning);
  --color-error: #b42318;
  --typography-font-family: var(--fontStack);
  --typography-font-family-heading: var(--fontStack);
  --typography-font-size-base: var(--baseFontSize);
  --typography-font-size-h1: var(--h1FontSize);
  --typography-font-size-h2: var(--h2FontSize);
  --typography-font-size-h3: 1.25rem;
  --typography-font-size-small: 0.875rem;
  --typography-font-size-large: 1.125rem;
  --typography-font-weight-normal: var(--fontWeight);
  --typography-font-weight-medium: 500;
  --typography-font-weight-bold: var(--headingFontWeight);
  --typography-line-height: var(--lineHeight);
  --design-border-radius: var(--borderRadius);
  --design-border-radius-large: var(--borderRadius);
  --design-box-shadow: var(--boxShadow);
  --design-box-shadow-large: var(--boxShadow);
  --max-width-container: var(--containerMaxWidthDesktop);
  --max-width-content: var(--containerMaxWidthDesktop);
  --max-width-narrow: var(--containerMaxWidthTablet);
  --spacing-xs: var(--defaultPadding);
  --spacing-sm: var(--containerPadding);
  --spacing-md: var(--containerPadding);
  --spacing-lg: calc(var(--containerPadding) * 2);
  --spacing-xl: calc(var(--containerPadding) * 3);
  --spacing-xxl: calc(var(--containerPadding) * 4);
  --transition-fast: var(--animationDuration) ease;
  --transition-normal: var(--animationDuration) ease;
  --transition-slow: var(--darkModeTransitionDuration) ease;
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
  --theme-surface: var(--backgroundColorDarkMode);
  --theme-card: var(--cardBackgroundColorDark);
  --theme-card-text: #f6f4f7;
  --theme-card-heading-1: #f6f4f7;
  --theme-card-heading-2: #f6f4f7;
  --theme-card-paragraph: #f6f4f7;
  --theme-card-muted: #d3d2d6;
  --theme-card-link: #dbc3e6;
  --theme-card-link-hover: #b7e4e0;
  --theme-card-accent-text: #dbc3e6;
  --theme-surface-muted: color-mix(in srgb, var(--theme-surface) 92%, var(--theme-text-primary));
  --theme-text-primary: var(--textColorDarkMode);
  --theme-text-muted: #d3d2d6;
  --theme-accent-text: #dbc3e6;
  --theme-accent: var(--primaryDarkModeColor);
  --theme-accent-strong: var(--buttonBackgroundColorHoverDark);
  --theme-accent-contrast: #101b15;
  --theme-header-background: var(--navBackgroundColorDark);
  --theme-secondary: var(--secondaryColorDarkmode);
  --theme-link: #dbc3e6;
  --theme-link-hover: #b7e4e0;
  --theme-info: var(--tertiaryColorDarkmode);
  --theme-warning: var(--accentColorDarkmode);
  --theme-success: var(--activeColor);
  --theme-button-bg: var(--buttonBackgroundColorDark);
  --theme-button-hover: var(--buttonBackgroundColorHoverDark);
  --theme-button-active: var(--buttonBackgroundColorActiveDark);
  --theme-button-disabled: var(--buttonBackgroundColorDisabledDark);
  --theme-button-text: var(--buttonTextColorDark);
  --theme-button-text-hover: var(--buttonTextColorHoverDark);
  --theme-button-text-disabled: var(--buttonTextColorDisabledDark);
  --theme-button-border: var(--buttonBorderColorDark);
  --theme-button-border-hover: var(--buttonBorderColorHoverDark);
  --theme-nav-bg: var(--navBackgroundColorDark);
  --theme-nav-text: var(--navTextColorDark);
  --theme-nav-link: var(--navLinkColorDark);
  --theme-nav-link-hover: var(--navLinkHoverColorDark);
  --theme-nav-link-active: var(--navLinkActiveColorDark);
  --theme-nav-dropdown: var(--navDropdownBackgroundDark);
  --theme-nav-dropdown-text: #f6f4f7;
  --theme-input-bg: var(--inputBackgroundColorDark);
  --theme-input-text: var(--inputTextColorDark);
  --theme-input-border: var(--inputBorderColorDark);
  --theme-heading-1: var(--h1ColorDark);
  --theme-heading-2: var(--h2ColorDark);
  --theme-paragraph: var(--paragraphColorDark);
  --theme-footer-bg: var(--footerBackgroundDark);
  --theme-footer-text: #f6f4f7;
  --primary-color: var(--theme-accent);
  --primary-color-dark: var(--theme-accent-strong);
  --primary-color-light: color-mix(in srgb, var(--theme-accent) 70%, white);
  --primaryColorHover: var(--theme-accent-strong);
  --color-primary: var(--theme-accent);
  --color-primary-hover: var(--theme-accent-strong);
  --color-secondary: var(--theme-secondary);
  --color-accent: var(--theme-warning);
  --color-background: var(--theme-surface);
  --color-background-alt: var(--theme-surface-muted);
  --color-text: var(--theme-text-primary);
  --color-text-muted: var(--theme-text-muted);
  --color-border: var(--theme-input-border);
  --color-success: var(--theme-success);
  --color-warning: var(--theme-warning);
  --color-error: #b42318;
  --typography-font-family: var(--fontStack);
  --typography-font-family-heading: var(--fontStack);
  --typography-font-size-base: var(--baseFontSize);
  --typography-font-size-h1: var(--h1FontSize);
  --typography-font-size-h2: var(--h2FontSize);
  --typography-font-size-h3: 1.25rem;
  --typography-font-size-small: 0.875rem;
  --typography-font-size-large: 1.125rem;
  --typography-font-weight-normal: var(--fontWeight);
  --typography-font-weight-medium: 500;
  --typography-font-weight-bold: var(--headingFontWeight);
  --typography-line-height: var(--lineHeight);
  --design-border-radius: var(--borderRadius);
  --design-border-radius-large: var(--borderRadius);
  --design-box-shadow: var(--boxShadow);
  --design-box-shadow-large: var(--boxShadow);
  --max-width-container: var(--containerMaxWidthDesktop);
  --max-width-content: var(--containerMaxWidthDesktop);
  --max-width-narrow: var(--containerMaxWidthTablet);
  --spacing-xs: var(--defaultPadding);
  --spacing-sm: var(--containerPadding);
  --spacing-md: var(--containerPadding);
  --spacing-lg: calc(var(--containerPadding) * 2);
  --spacing-xl: calc(var(--containerPadding) * 3);
  --spacing-xxl: calc(var(--containerPadding) * 4);
  --transition-fast: var(--animationDuration) ease;
  --transition-normal: var(--animationDuration) ease;
  --transition-slow: var(--darkModeTransitionDuration) ease;
}
}
:root[data-theme="dark"] {
  --theme-surface: var(--backgroundColorDarkMode);
  --theme-card: var(--cardBackgroundColorDark);
  --theme-card-text: #f6f4f7;
  --theme-card-heading-1: #f6f4f7;
  --theme-card-heading-2: #f6f4f7;
  --theme-card-paragraph: #f6f4f7;
  --theme-card-muted: #d3d2d6;
  --theme-card-link: #dbc3e6;
  --theme-card-link-hover: #b7e4e0;
  --theme-card-accent-text: #dbc3e6;
  --theme-surface-muted: color-mix(in srgb, var(--theme-surface) 92%, var(--theme-text-primary));
  --theme-text-primary: var(--textColorDarkMode);
  --theme-text-muted: #d3d2d6;
  --theme-accent-text: #dbc3e6;
  --theme-accent: var(--primaryDarkModeColor);
  --theme-accent-strong: var(--buttonBackgroundColorHoverDark);
  --theme-accent-contrast: #101b15;
  --theme-header-background: var(--navBackgroundColorDark);
  --theme-secondary: var(--secondaryColorDarkmode);
  --theme-link: #dbc3e6;
  --theme-link-hover: #b7e4e0;
  --theme-info: var(--tertiaryColorDarkmode);
  --theme-warning: var(--accentColorDarkmode);
  --theme-success: var(--activeColor);
  --theme-button-bg: var(--buttonBackgroundColorDark);
  --theme-button-hover: var(--buttonBackgroundColorHoverDark);
  --theme-button-active: var(--buttonBackgroundColorActiveDark);
  --theme-button-disabled: var(--buttonBackgroundColorDisabledDark);
  --theme-button-text: var(--buttonTextColorDark);
  --theme-button-text-hover: var(--buttonTextColorHoverDark);
  --theme-button-text-disabled: var(--buttonTextColorDisabledDark);
  --theme-button-border: var(--buttonBorderColorDark);
  --theme-button-border-hover: var(--buttonBorderColorHoverDark);
  --theme-nav-bg: var(--navBackgroundColorDark);
  --theme-nav-text: var(--navTextColorDark);
  --theme-nav-link: var(--navLinkColorDark);
  --theme-nav-link-hover: var(--navLinkHoverColorDark);
  --theme-nav-link-active: var(--navLinkActiveColorDark);
  --theme-nav-dropdown: var(--navDropdownBackgroundDark);
  --theme-nav-dropdown-text: #f6f4f7;
  --theme-input-bg: var(--inputBackgroundColorDark);
  --theme-input-text: var(--inputTextColorDark);
  --theme-input-border: var(--inputBorderColorDark);
  --theme-heading-1: var(--h1ColorDark);
  --theme-heading-2: var(--h2ColorDark);
  --theme-paragraph: var(--paragraphColorDark);
  --theme-footer-bg: var(--footerBackgroundDark);
  --theme-footer-text: #f6f4f7;
  --primary-color: var(--theme-accent);
  --primary-color-dark: var(--theme-accent-strong);
  --primary-color-light: color-mix(in srgb, var(--theme-accent) 70%, white);
  --primaryColorHover: var(--theme-accent-strong);
  --color-primary: var(--theme-accent);
  --color-primary-hover: var(--theme-accent-strong);
  --color-secondary: var(--theme-secondary);
  --color-accent: var(--theme-warning);
  --color-background: var(--theme-surface);
  --color-background-alt: var(--theme-surface-muted);
  --color-text: var(--theme-text-primary);
  --color-text-muted: var(--theme-text-muted);
  --color-border: var(--theme-input-border);
  --color-success: var(--theme-success);
  --color-warning: var(--theme-warning);
  --color-error: #b42318;
  --typography-font-family: var(--fontStack);
  --typography-font-family-heading: var(--fontStack);
  --typography-font-size-base: var(--baseFontSize);
  --typography-font-size-h1: var(--h1FontSize);
  --typography-font-size-h2: var(--h2FontSize);
  --typography-font-size-h3: 1.25rem;
  --typography-font-size-small: 0.875rem;
  --typography-font-size-large: 1.125rem;
  --typography-font-weight-normal: var(--fontWeight);
  --typography-font-weight-medium: 500;
  --typography-font-weight-bold: var(--headingFontWeight);
  --typography-line-height: var(--lineHeight);
  --design-border-radius: var(--borderRadius);
  --design-border-radius-large: var(--borderRadius);
  --design-box-shadow: var(--boxShadow);
  --design-box-shadow-large: var(--boxShadow);
  --max-width-container: var(--containerMaxWidthDesktop);
  --max-width-content: var(--containerMaxWidthDesktop);
  --max-width-narrow: var(--containerMaxWidthTablet);
  --spacing-xs: var(--defaultPadding);
  --spacing-sm: var(--containerPadding);
  --spacing-md: var(--containerPadding);
  --spacing-lg: calc(var(--containerPadding) * 2);
  --spacing-xl: calc(var(--containerPadding) * 3);
  --spacing-xxl: calc(var(--containerPadding) * 4);
  --transition-fast: var(--animationDuration) ease;
  --transition-normal: var(--animationDuration) ease;
  --transition-slow: var(--darkModeTransitionDuration) ease;
}