:where(html) {
--ys-spacing-25: 0.125rem;
--ys-spacing-50: 0.25rem;
--ys-spacing-100: 0.5rem;
--ys-spacing-150: 0.75rem;
--ys-spacing-200: 1rem;
--ys-spacing-250: 1.25rem;
--ys-spacing-300: 1.5rem;
--ys-spacing-400: 2rem;
--ys-spacing-500: 2.5rem;
--ys-spacing-600: 3rem;
--ys-spacing-700: 3.5rem;
--ys-spacing-750: 3.75rem;
--ys-text-title0-fontFamily: 'Roboto';
--ys-text-title0-fontWeight: 700;
--ys-text-title0-lineHeight: 4rem;
--ys-text-title0-fontSize: 3.5625rem;
--ys-text-title0-letterSpacing: 0;
--ys-text-title1-fontFamily: 'Roboto';
--ys-text-title1-fontWeight: 700;
--ys-text-title1-lineHeight: 2.75rem;
--ys-text-title1-fontSize: 2.25rem;
--ys-text-title1-letterSpacing: 0;
--ys-text-title2-fontFamily: 'Roboto';
--ys-text-title2-fontWeight: 700;
--ys-text-title2-lineHeight: 2.5rem;
--ys-text-title2-fontSize: 2rem;
--ys-text-title2-letterSpacing: 0;
--ys-text-title3-fontFamily: 'Roboto';
--ys-text-title3-fontWeight: 700;
--ys-text-title3-lineHeight: 2rem;
--ys-text-title3-fontSize: 1.5rem;
--ys-text-title3-letterSpacing: 0;
--ys-text-title4-fontFamily: 'Roboto';
--ys-text-title4-fontWeight: 700;
--ys-text-title4-lineHeight: 1.5rem;
--ys-text-title4-fontSize: 1.125rem;
--ys-text-title4-letterSpacing: 0;
--ys-text-title5-fontFamily: 'Roboto';
--ys-text-title5-fontWeight: 700;
--ys-text-title5-lineHeight: 1.5rem;
--ys-text-title5-fontSize: 1rem;
--ys-text-title5-letterSpacing: 0;
--ys-text-title6-fontFamily: 'Roboto';
--ys-text-title6-fontWeight: 700;
--ys-text-title6-lineHeight: 1.25rem;
--ys-text-title6-fontSize: 0.875rem;
--ys-text-title6-letterSpacing: 0;
--ys-text-subtitle1-fontFamily: 'Roboto';
--ys-text-subtitle1-fontWeight: 400;
--ys-text-subtitle1-lineHeight: 1.75rem;
--ys-text-subtitle1-fontSize: 1.375rem;
--ys-text-subtitle1-letterSpacing: 0;
--ys-text-subtitle2-fontFamily: 'Roboto';
--ys-text-subtitle2-fontWeight: 500;
--ys-text-subtitle2-lineHeight: 1.25rem;
--ys-text-subtitle2-fontSize: 1rem;
--ys-text-subtitle2-letterSpacing: -0.0125rem;
--ys-text-subtitle3-fontFamily: 'Roboto';
--ys-text-subtitle3-fontWeight: 500;
--ys-text-subtitle3-lineHeight: 1.25rem;
--ys-text-subtitle3-fontSize: 0.875rem;
--ys-text-subtitle3-letterSpacing: 0;
--ys-text-subtitle4-fontFamily: 'Roboto';
--ys-text-subtitle4-fontWeight: 500;
--ys-text-subtitle4-lineHeight: 1rem;
--ys-text-subtitle4-fontSize: 0.75rem;
--ys-text-subtitle4-letterSpacing: -0.0125rem;
--ys-text-body0-fontFamily: 'Roboto';
--ys-text-body0-fontWeight: 400;
--ys-text-body0-lineHeight: 1.5rem;
--ys-text-body0-fontSize: 1rem;
--ys-text-body0-letterSpacing: 0;
--ys-text-body0-paragraphSpacing: 1.25rem;
--ys-text-body0-bold-fontFamily: 'Roboto';
--ys-text-body0-bold-fontWeight: 700;
--ys-text-body0-bold-lineHeight: 1.5rem;
--ys-text-body0-bold-fontSize: 1rem;
--ys-text-body0-bold-letterSpacing: 0;
--ys-text-body0-bold-paragraphSpacing: 1.25rem;
--ys-text-body1-fontFamily: 'Roboto';
--ys-text-body1-fontWeight: 400;
--ys-text-body1-lineHeight: 1.25rem;
--ys-text-body1-fontSize: 0.875rem;
--ys-text-body1-letterSpacing: 0;
--ys-text-body1-paragraphSpacing: 0.875rem;
--ys-text-body1-italic-fontFamily: 'Roboto';
--ys-text-body1-italic-font-style: italic;
--ys-text-body1-italic-lineHeight: 1.25rem;
--ys-text-body1-italic-fontSize: 0.875rem;
--ys-text-body1-italic-letterSpacing: 0;
--ys-text-body1-italic-paragraphSpacing: 0.875rem;
--ys-text-body1-medium-fontFamily: 'Roboto';
--ys-text-body1-medium-fontWeight: 500;
--ys-text-body1-medium-lineHeight: 1.25rem;
--ys-text-body1-medium-fontSize: 0.875rem;
--ys-text-body1-medium-letterSpacing: 0;
--ys-text-body1-medium-paragraphSpacing: 0.875rem;
--ys-text-body1-bold-fontFamily: 'Roboto';
--ys-text-body1-bold-fontWeight: 700;
--ys-text-body1-bold-lineHeight: 1.25rem;
--ys-text-body1-bold-fontSize: 0.875rem;
--ys-text-body1-bold-letterSpacing: 0;
--ys-text-body1-bold-paragraphSpacing: 0.875rem;
--ys-text-body2-fontFamily: 'Roboto';
--ys-text-body2-fontWeight: 400;
--ys-text-body2-lineHeight: 1rem;
--ys-text-body2-fontSize: 0.75rem;
--ys-text-body2-letterSpacing: 0;
--ys-text-body2-paragraphSpacing: 0.75rem;
--ys-text-body2-bold-fontFamily: 'Roboto';
--ys-text-body2-bold-fontWeight: 700;
--ys-text-body2-bold-lineHeight: 1rem;
--ys-text-body2-bold-fontSize: 0.75rem;
--ys-text-body2-bold-letterSpacing: 0;
--ys-text-body2-bold-paragraphSpacing: 0.75rem;
--ys-text-body2-italic-fontFamily: 'Roboto';
--ys-text-body2-italic-font-style: italic;
--ys-text-body2-italic-lineHeight: 1rem;
--ys-text-body2-italic-fontSize: 0.75rem;
--ys-text-body2-italic-letterSpacing: 0;
--ys-text-body2-italic-paragraphSpacing: 0.75rem;
--ys-text-metadata1-bold-fontFamily: 'Roboto';
--ys-text-metadata1-bold-fontWeight: 700;
--ys-text-metadata1-bold-lineHeight: 1rem;
--ys-text-metadata1-bold-fontSize: 0.6875rem;
--ys-text-metadata1-bold-letterSpacing: 0;
--ys-text-metadata1-medium-fontFamily: 'Roboto';
--ys-text-metadata1-medium-fontWeight: 500;
--ys-text-metadata1-medium-lineHeight: 1rem;
--ys-text-metadata1-medium-fontSize: 0.6875rem;
--ys-text-metadata1-medium-letterSpacing: 0;
--ys-text-metadata1-fontFamily: 'Roboto';
--ys-text-metadata1-fontWeight: 400;
--ys-text-metadata1-lineHeight: 1rem;
--ys-text-metadata1-fontSize: 0.6875rem;
--ys-text-metadata1-letterSpacing: 0;
--ys-text-metadata1-italic-fontFamily: 'Roboto';
--ys-text-metadata1-italic-font-style: italic;
--ys-text-metadata1-italic-lineHeight: 1rem;
--ys-text-metadata1-italic-fontSize: 0.6875rem;
--ys-text-metadata1-italic-letterSpacing: 0;
--ys-text-button1-fontFamily: 'Roboto';
--ys-text-button1-fontWeight: 900;
--ys-text-button1-lineHeight: 1.5rem;
--ys-text-button1-fontSize: 1rem;
--ys-text-button1-letterSpacing: 0;
--ys-text-button2-fontFamily: 'Roboto';
--ys-text-button2-fontWeight: 900;
--ys-text-button2-lineHeight: 1.25rem;
--ys-text-button2-fontSize: 0.875rem;
--ys-text-button2-letterSpacing: 0;
--ys-text-button3-fontFamily: 'Roboto';
--ys-text-button3-fontWeight: 900;
--ys-text-button3-lineHeight: 1rem;
--ys-text-button3-fontSize: 0.75rem;
--ys-text-button3-letterSpacing: 0;
--ys-text-link0-fontFamily: 'Roboto';
--ys-text-link0-fontWeight: 400;
--ys-text-link0-lineHeight: 1.5rem;
--ys-text-link0-fontSize: 1rem;
--ys-text-link0-letterSpacing: 0;
--ys-text-link0-textDecoration: underline;
--ys-text-link1-fontFamily: 'Roboto';
--ys-text-link1-fontWeight: 400;
--ys-text-link1-lineHeight: 1.25rem;
--ys-text-link1-fontSize: 0.875rem;
--ys-text-link1-letterSpacing: 0;
--ys-text-link1-textDecoration: underline;
--ys-text-link2-fontFamily: 'Roboto';
--ys-text-link2-fontWeight: 400;
--ys-text-link2-lineHeight: 1rem;
--ys-text-link2-fontSize: 0.75rem;
--ys-text-link2-letterSpacing: 0;
--ys-text-link2-textDecoration: underline;
--ys-text-numeric1-fontFamily: 'Roboto';
--ys-text-numeric1-fontWeight: 900;
--ys-text-numeric1-lineHeight: 3.75rem;
--ys-text-numeric1-fontSize: 3.5rem;
--ys-text-numeric1-letterSpacing: -0.0625rem;
--ys-radius-0: 0;
--ys-radius-25: 0.125rem;
--ys-radius-50: 0.25rem;
--ys-radius-100: 0.5rem;
--ys-radius-150: 0.75rem;
--ys-radius-200: 1rem;
--ys-radius-250: 1.25rem;
--ys-radius-300: 1.5rem;
--ys-radius-400: 2rem;
}
:where(html:not([data-mode="dark"])) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #333333ff;
--ys-color-button-surface-primary-hover: #292929ff;
--ys-color-button-surface-primary-active: #292929ff;
--ys-color-button-surface-primary-focus: #333333ff;
--ys-color-button-surface-primary-disabled: #33333380;
--ys-color-button-text-primary-rest: #ffffffff;
--ys-color-button-text-primary-hover: #ffffffff;
--ys-color-button-text-primary-active: #ffffffff;
--ys-color-button-text-primary-focus: #ffffffff;
--ys-color-button-text-primary-disabled: #ffffff80;
--ys-color-button-stroke-primary-focus: #333333ff;
--ys-color-button-icon-primary: #ffffffff;
--ys-color-button-icon-primary-disabled: #ffffff80;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-primary-active: #555555ff;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-brand-primary: #555555ff;
--ys-color-brand-secondary: #777777ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #333333ff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #ffffffff;
--ys-color-tag-icon-brand: #ffffffff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-mode="light"]) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #333333ff;
--ys-color-button-surface-primary-hover: #292929ff;
--ys-color-button-surface-primary-active: #292929ff;
--ys-color-button-surface-primary-focus: #333333ff;
--ys-color-button-surface-primary-disabled: #33333380;
--ys-color-button-text-primary-rest: #ffffffff;
--ys-color-button-text-primary-hover: #ffffffff;
--ys-color-button-text-primary-active: #ffffffff;
--ys-color-button-text-primary-focus: #ffffffff;
--ys-color-button-text-primary-disabled: #ffffff80;
--ys-color-button-stroke-primary-focus: #333333ff;
--ys-color-button-icon-primary: #ffffffff;
--ys-color-button-icon-primary-disabled: #ffffff80;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-primary-active: #555555ff;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-brand-primary: #555555ff;
--ys-color-brand-secondary: #777777ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #333333ff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #ffffffff;
--ys-color-tag-icon-brand: #ffffffff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-theme="backcountry"]:not([data-mode="dark"])) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #006df3ff;
--ys-color-button-surface-primary-hover: #006aebff;
--ys-color-button-surface-primary-active: #006aebff;
--ys-color-button-surface-primary-focus: #006df3ff;
--ys-color-button-surface-primary-disabled: #006df380;
--ys-color-button-text-primary-rest: #ffffffff;
--ys-color-button-text-primary-hover: #ffffffff;
--ys-color-button-text-primary-active: #ffffffff;
--ys-color-button-text-primary-focus: #ffffffff;
--ys-color-button-text-primary-disabled: #ffffff80;
--ys-color-button-stroke-primary-focus: #006df3ff;
--ys-color-button-icon-primary: #ffffffff;
--ys-color-button-icon-primary-disabled: #ffffff80;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-primary-active: #087bffff;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-brand-primary: #087bffff;
--ys-color-brand-secondary: #800080ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #0056bbff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #ffffffff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-brand: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-mode="light"][data-theme="backcountry"]) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #006df3ff;
--ys-color-button-surface-primary-hover: #006aebff;
--ys-color-button-surface-primary-active: #006aebff;
--ys-color-button-surface-primary-focus: #006df3ff;
--ys-color-button-surface-primary-disabled: #006df380;
--ys-color-button-text-primary-rest: #ffffffff;
--ys-color-button-text-primary-hover: #ffffffff;
--ys-color-button-text-primary-active: #ffffffff;
--ys-color-button-text-primary-focus: #ffffffff;
--ys-color-button-text-primary-disabled: #ffffff80;
--ys-color-button-stroke-primary-focus: #006df3ff;
--ys-color-button-icon-primary: #ffffffff;
--ys-color-button-icon-primary-disabled: #ffffff80;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-primary-active: #087bffff;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-brand-primary: #087bffff;
--ys-color-brand-secondary: #800080ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #0056bbff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #ffffffff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-brand: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-theme="fish"]:not([data-mode="dark"])) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #60811bff;
--ys-color-button-surface-primary-hover: #587619ff;
--ys-color-button-surface-primary-active: #587619ff;
--ys-color-button-surface-primary-focus: #60811bff;
--ys-color-button-surface-primary-disabled: #60811b80;
--ys-color-button-text-primary-rest: #ffffffff;
--ys-color-button-text-primary-hover: #ffffffff;
--ys-color-button-text-primary-active: #ffffffff;
--ys-color-button-text-primary-focus: #ffffffff;
--ys-color-button-text-primary-disabled: #ffffff80;
--ys-color-button-stroke-primary-focus: #60811bff;
--ys-color-button-icon-primary: #ffffffff;
--ys-color-button-icon-primary-disabled: #ffffff80;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-primary-active: #60811bff;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-brand-primary: #60811bff;
--ys-color-brand-secondary: #800080ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #60811bff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #ffffffff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-tag-icon-brand: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-mode="light"][data-theme="fish"]) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #60811bff;
--ys-color-button-surface-primary-hover: #587619ff;
--ys-color-button-surface-primary-active: #587619ff;
--ys-color-button-surface-primary-focus: #60811bff;
--ys-color-button-surface-primary-disabled: #60811b80;
--ys-color-button-text-primary-rest: #ffffffff;
--ys-color-button-text-primary-hover: #ffffffff;
--ys-color-button-text-primary-active: #ffffffff;
--ys-color-button-text-primary-focus: #ffffffff;
--ys-color-button-text-primary-disabled: #ffffff80;
--ys-color-button-stroke-primary-focus: #60811bff;
--ys-color-button-icon-primary: #ffffffff;
--ys-color-button-icon-primary-disabled: #ffffff80;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-primary-active: #60811bff;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-brand-primary: #60811bff;
--ys-color-brand-secondary: #800080ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #60811bff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #ffffffff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-tag-icon-brand: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-theme="hunt"]:not([data-mode="dark"])) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #ff3300ff;
--ys-color-button-surface-primary-hover: #c92800ff;
--ys-color-button-surface-primary-active: #c92800ff;
--ys-color-button-surface-primary-focus: #ff3300ff;
--ys-color-button-surface-primary-disabled: #ff330080;
--ys-color-button-text-primary-rest: #ffffffff;
--ys-color-button-text-primary-hover: #ffffffff;
--ys-color-button-text-primary-active: #ffffffff;
--ys-color-button-text-primary-focus: #ffffffff;
--ys-color-button-text-primary-disabled: #ffffff80;
--ys-color-button-stroke-primary-focus: #ff3300ff;
--ys-color-button-icon-primary: #ffffffff;
--ys-color-button-icon-primary-disabled: #ffffff80;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-stroke-primary-active: #ff3300ff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-brand-primary: #ff3300ff;
--ys-color-brand-secondary: #800080ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #ff3300ff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #ffffffff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-brand: #ffffffff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-mode="light"][data-theme="hunt"]) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #ff3300ff;
--ys-color-button-surface-primary-hover: #c92800ff;
--ys-color-button-surface-primary-active: #c92800ff;
--ys-color-button-surface-primary-focus: #ff3300ff;
--ys-color-button-surface-primary-disabled: #ff330080;
--ys-color-button-text-primary-rest: #ffffffff;
--ys-color-button-text-primary-hover: #ffffffff;
--ys-color-button-text-primary-active: #ffffffff;
--ys-color-button-text-primary-focus: #ffffffff;
--ys-color-button-text-primary-disabled: #ffffff80;
--ys-color-button-stroke-primary-focus: #ff3300ff;
--ys-color-button-icon-primary: #ffffffff;
--ys-color-button-icon-primary-disabled: #ffffff80;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-stroke-primary-active: #ff3300ff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-brand-primary: #ff3300ff;
--ys-color-brand-secondary: #800080ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #ff3300ff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #ffffffff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-brand: #ffffffff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-theme="offroad"]:not([data-mode="dark"])) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #ff9f0eff;
--ys-color-button-surface-primary-hover: #ff9a01ff;
--ys-color-button-surface-primary-active: #ff9a01ff;
--ys-color-button-surface-primary-focus: #ff9f0eff;
--ys-color-button-surface-primary-disabled: #ff9f0e80;
--ys-color-button-text-primary-rest: #333333ff;
--ys-color-button-text-primary-hover: #333333ff;
--ys-color-button-text-primary-active: #333333ff;
--ys-color-button-text-primary-focus: #333333ff;
--ys-color-button-text-primary-disabled: #33333380;
--ys-color-button-stroke-primary-focus: #ff9f0eff;
--ys-color-button-icon-primary: #333333ff;
--ys-color-button-icon-primary-disabled: #33333380;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-stroke-primary-active: #ff9f0eff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-brand-primary: #ff9f0eff;
--ys-color-brand-secondary: #800080ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #ff9f0eff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #333333ff;
--ys-color-tag-icon-brand: #333333ff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
:where([data-mode="light"][data-theme="offroad"]) {
color-scheme: light;
--ys-color-button-surface-primary-rest: #ff9f0eff;
--ys-color-button-surface-primary-hover: #ff9a01ff;
--ys-color-button-surface-primary-active: #ff9a01ff;
--ys-color-button-surface-primary-focus: #ff9f0eff;
--ys-color-button-surface-primary-disabled: #ff9f0e80;
--ys-color-button-text-primary-rest: #333333ff;
--ys-color-button-text-primary-hover: #333333ff;
--ys-color-button-text-primary-active: #333333ff;
--ys-color-button-text-primary-focus: #333333ff;
--ys-color-button-text-primary-disabled: #33333380;
--ys-color-button-stroke-primary-focus: #ff9f0eff;
--ys-color-button-icon-primary: #333333ff;
--ys-color-button-icon-primary-disabled: #33333380;
--ys-color-button-surface-secondary-rest: #ebebebff;
--ys-color-button-surface-secondary-hover: #e6e6e6ff;
--ys-color-button-surface-secondary-active: #e6e6e6ff;
--ys-color-button-surface-secondary-focus: #ebebebff;
--ys-color-button-surface-secondary-disabled: #ebebeb80;
--ys-color-button-text-secondary-rest: #333333ff;
--ys-color-button-text-secondary-hover: #333333ff;
--ys-color-button-text-secondary-active: #333333ff;
--ys-color-button-text-secondary-focus: #333333ff;
--ys-color-button-text-secondary-disabled: #33333380;
--ys-color-button-stroke-secondary-focus: #333333ff;
--ys-color-button-icon-secondary: #333333ff;
--ys-color-button-icon-secondary-disabled: #33333380;
--ys-color-button-surface-ghost-hover: #ebebebff;
--ys-color-button-surface-ghost-active: #ebebebff;
--ys-color-button-stroke-ghost-focus: #333333ff;
--ys-color-button-text-ghost: #333333ff;
--ys-color-button-text-ghost-disabled: #33333380;
--ys-color-button-icon-ghost: #333333ff;
--ys-color-button-icon-ghost-disabled: #33333380;
--ys-color-button-surface-floating-rest: #333333ff;
--ys-color-button-surface-floating-hover: #292929ff;
--ys-color-button-surface-floating-active: #292929ff;
--ys-color-button-surface-floating-focus: #333333ff;
--ys-color-button-surface-floating-disabled: #33333380;
--ys-color-button-stroke-floating-focus: #333333ff;
--ys-color-button-text-floating: #ffffffff;
--ys-color-button-text-floating-disabled: #ffffff80;
--ys-color-button-icon-floating: #ffffffff;
--ys-color-button-icon-floating-disabled: #ffffff80;
--ys-color-button-stroke-secondary-active: #e2e2e2ff;
--ys-color-button-stroke-primary-active: #ff9f0eff;
--ys-color-button-stroke-secondaryOutline-rest: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-stroke-secondaryOutline-active: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-focus: #a5a5a5ff;
--ys-color-button-stroke-secondaryOutline-disabled: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-hover: #f5f5f5ff;
--ys-color-button-surface-secondaryOutline-active: #f5f5f5ff;
--ys-color-button-text-secondaryOutline-rest: #333333ff;
--ys-color-button-text-secondaryOutline-hover: #222222ff;
--ys-color-button-text-secondaryOutline-active: #333333ff;
--ys-color-button-text-secondaryOutline-focus: #333333ff;
--ys-color-button-text-secondaryOutline-disabled: #a5a5a5ff;
--ys-color-brand-primary: #ff9f0eff;
--ys-color-brand-secondary: #800080ff;
--ys-color-surface-base: #ffffffff;
--ys-color-surface-primary: #f5f5f5ff;
--ys-color-surface-secondary: #e2e2e2ff;
--ys-color-surface-inset: #f5f5f5ff;
--ys-color-surface-tertiary: #bdbdbdff;
--ys-color-surface-reverse: #333333ff;
--ys-color-surface-disabled: #ebebebb2;
--ys-color-surface-constant: #ffffffff;
--ys-color-divider-base: #e2e2e2ff;
--ys-color-divider-primary: #bdbdbdff;
--ys-color-divider-secondary: #a5a5a5ff;
--ys-color-divider-tertiary: #8b8b8bff;
--ys-color-text-primary: #333333ff;
--ys-color-text-secondary: #464646ff;
--ys-color-text-tertiary: #555555ff;
--ys-color-text-dim: #777777ff;
--ys-color-text-reverse: #ffffffff;
--ys-color-text-disabled: #3333334d;
--ys-color-icon-primary: #333333ff;
--ys-color-icon-secondary: #8b8b8bff;
--ys-color-icon-reverse: #fafafaff;
--ys-color-icon-disabled: #3333334d;
--ys-color-icon-twotone-primary: #a5a5a5ff;
--ys-color-icon-twotone-secondary: #ffffffff;
--ys-color-alert-error: #db0000ff;
--ys-color-alert-warning: #f5a523ff;
--ys-color-alert-success: #65b604ff;
--ys-color-background-primary: #ffffffff;
--ys-color-background-secondary: #f5f5f5ff;
--ys-color-stroke-base: #a5a5a5ff;
--ys-color-stroke-primary: #e2e2e2ff;
--ys-color-stroke-secondary: #f5f5f5ff;
--ys-color-stroke-disabled: #ebebebcc;
--ys-color-stroke-reverse: #333333ff;
--ys-color-controls-stop: #db0000ff;
--ys-color-controls-pause: #f5a523ff;
--ys-color-controls-start: #7bcf17ff;
--ys-color-controls-default: #464646ff;
--ys-color-tag-surface-easy: #65b604ff;
--ys-color-tag-surface-moderate: #087bffff;
--ys-color-tag-surface-hard: #333333ff;
--ys-color-tag-surface-brand: #ff9f0eff;
--ys-color-tag-surface-primary: #333333ff;
--ys-color-tag-surface-secondary: #f5f5f5ff;
--ys-color-tag-text-easy: #ffffffff;
--ys-color-tag-text-moderate: #ffffffff;
--ys-color-tag-text-hard: #ffffffff;
--ys-color-tag-text-brand: #333333ff;
--ys-color-tag-icon-brand: #333333ff;
--ys-color-tag-text-primary: #ffffffff;
--ys-color-tag-text-secondary: #333333ff;
--ys-color-tag-icon-easy: #ffffffff;
--ys-color-tag-icon-moderate: #ffffffff;
--ys-color-tag-icon-hard: #ffffffff;
--ys-color-tag-icon-primary: #ffffffff;
--ys-color-tag-icon-secondary: #333333ff;
--ys-color-tag-surface-education: #29ae9fff;
--ys-color-tag-text-education: #ffffffff;
--ys-color-tag-icon-education: #ffffffff;
--ys-color-text-constant: #ffffffff;
--ys-color-tag-surface-extreme: #fe0000ff;
--ys-color-tag-text-extreme: #ffffffff;
--ys-color-tag-icon-extreme: #ffffffff;
--ys-color-text-message-error: #b53431ff;
--ys-color-surface-message-error: #fff3f3ff;
--ys-color-stroke-message-error: #ce5050ff;
--ys-color-icon-message-error: #ce5050ff;
--ys-color-text-message-warning: #ba4e00ff;
--ys-color-surface-message-warning: #fcf3ecff;
--ys-color-stroke-message-warning: #d96d1fff;
--ys-color-icon-message-warning: #d96d1fff;
--ys-color-text-message-success: #457f00ff;
--ys-color-surface-message-success: #f5fee9ff;
--ys-color-stroke-message-success: #559b00ff;
--ys-color-icon-message-success: #559b00ff;
--ys-color-text-message-info: #1c776dff;
--ys-color-surface-message-info: #eefcfaff;
--ys-color-stroke-message-info: #289d90ff;
--ys-color-icon-message-info: #289d90ff;
--ys-color-offline-primary: #db0000ff;
--ys-color-offline-secondary: #bc0000ff;
--ys-color-button-surface-danger-rest: #c43835ff;
--ys-color-button-surface-danger-hover: #b23330ff;
--ys-color-button-surface-danger-active: #b23330ff;
--ys-color-button-surface-danger-focus: #c43835ff;
--ys-color-button-surface-danger-loading: #c43835ff;
--ys-color-button-surface-danger-disabled: #c4383580;
--ys-color-button-text-danger: #ffffffff;
--ys-color-button-text-danger-disabled: #ffffff80;
--ys-color-button-stroke-danger-focus: #c43835ff;
--ys-color-button-icon-danger: #ffffffff;
--ys-color-button-icon-danger-disabled: #ffffff80;
--ys-color-tool-waypoint-black: #000000ff;
--ys-color-tool-line-black: #000000ff;
--ys-color-tool-area-grey: #505050ff;
--ys-color-tool-waypoint-brown: #8b4513ff;
--ys-color-tool-line-brown: #8b4513ff;
--ys-color-tool-area-brown: #715f2eff;
--ys-color-tool-waypoint-red: #ff0000ff;
--ys-color-tool-line-red: #ff0000ff;
--ys-color-tool-area-red: #c14c2eff;
--ys-color-tool-waypoint-orange: #ff3300ff;
--ys-color-tool-line-orange: #ff3300ff;
--ys-color-tool-area-orange: #d4532fff;
--ys-color-tool-waypoint-magenta: #ff00ffff;
--ys-color-tool-line-magenta: #ff00ffff;
--ys-color-tool-area-magenta: #e876ffff;
--ys-color-tool-waypoint-purple: #800080ff;
--ys-color-tool-line-purple: #800080ff;
--ys-color-tool-waypoint-yellow: #ffff00ff;
--ys-color-tool-line-yellow: #ffff00ff;
--ys-color-tool-area-yellow: #eeff7dff;
--ys-color-tool-waypoint-cyan: #00ffffff;
--ys-color-tool-line-cyan: #00ffffff;
--ys-color-tool-area-cyan: #99ffffff;
--ys-color-tool-waypoint-blue: #087affff;
--ys-color-tool-line-blue: #087affff;
--ys-color-tool-area-blue: #4a90e2ff;
--ys-color-tool-waypoint-green: #84d400ff;
--ys-color-tool-line-green: #84d400ff;
--ys-color-tool-area-green: #2a8b61ff;
--ys-color-tool-waypoint-white: #ffffffff;
--ys-color-tool-line-white: #ffffffff;
--ys-color-tool-area-white: #ffffffff;
}
.ys-text-title0 {
font-family: var(--ys-text-title0-fontFamily);
font-weight: var(--ys-text-title0-fontWeight);
line-height: var(--ys-text-title0-lineHeight);
font-size: var(--ys-text-title0-fontSize);
letter-spacing: var(--ys-text-title0-letterSpacing);
}
.ys-text-title1 {
font-family: var(--ys-text-title1-fontFamily);
font-weight: var(--ys-text-title1-fontWeight);
line-height: var(--ys-text-title1-lineHeight);
font-size: var(--ys-text-title1-fontSize);
letter-spacing: var(--ys-text-title1-letterSpacing);
}
.ys-text-title2 {
font-family: var(--ys-text-title2-fontFamily);
font-weight: var(--ys-text-title2-fontWeight);
line-height: var(--ys-text-title2-lineHeight);
font-size: var(--ys-text-title2-fontSize);
letter-spacing: var(--ys-text-title2-letterSpacing);
}
.ys-text-title3 {
font-family: var(--ys-text-title3-fontFamily);
font-weight: var(--ys-text-title3-fontWeight);
line-height: var(--ys-text-title3-lineHeight);
font-size: var(--ys-text-title3-fontSize);
letter-spacing: var(--ys-text-title3-letterSpacing);
}
.ys-text-title4 {
font-family: var(--ys-text-title4-fontFamily);
font-weight: var(--ys-text-title4-fontWeight);
line-height: var(--ys-text-title4-lineHeight);
font-size: var(--ys-text-title4-fontSize);
letter-spacing: var(--ys-text-title4-letterSpacing);
}
.ys-text-title5 {
font-family: var(--ys-text-title5-fontFamily);
font-weight: var(--ys-text-title5-fontWeight);
line-height: var(--ys-text-title5-lineHeight);
font-size: var(--ys-text-title5-fontSize);
letter-spacing: var(--ys-text-title5-letterSpacing);
}
.ys-text-title6 {
font-family: var(--ys-text-title6-fontFamily);
font-weight: var(--ys-text-title6-fontWeight);
line-height: var(--ys-text-title6-lineHeight);
font-size: var(--ys-text-title6-fontSize);
letter-spacing: var(--ys-text-title6-letterSpacing);
}
.ys-text-subtitle1 {
font-family: var(--ys-text-subtitle1-fontFamily);
font-weight: var(--ys-text-subtitle1-fontWeight);
line-height: var(--ys-text-subtitle1-lineHeight);
font-size: var(--ys-text-subtitle1-fontSize);
letter-spacing: var(--ys-text-subtitle1-letterSpacing);
}
.ys-text-subtitle2 {
font-family: var(--ys-text-subtitle2-fontFamily);
font-weight: var(--ys-text-subtitle2-fontWeight);
line-height: var(--ys-text-subtitle2-lineHeight);
font-size: var(--ys-text-subtitle2-fontSize);
letter-spacing: var(--ys-text-subtitle2-letterSpacing);
}
.ys-text-subtitle3 {
font-family: var(--ys-text-subtitle3-fontFamily);
font-weight: var(--ys-text-subtitle3-fontWeight);
line-height: var(--ys-text-subtitle3-lineHeight);
font-size: var(--ys-text-subtitle3-fontSize);
letter-spacing: var(--ys-text-subtitle3-letterSpacing);
}
.ys-text-subtitle4 {
font-family: var(--ys-text-subtitle4-fontFamily);
font-weight: var(--ys-text-subtitle4-fontWeight);
line-height: var(--ys-text-subtitle4-lineHeight);
font-size: var(--ys-text-subtitle4-fontSize);
letter-spacing: var(--ys-text-subtitle4-letterSpacing);
}
.ys-text-body0 {
font-family: var(--ys-text-body0-fontFamily);
font-weight: var(--ys-text-body0-fontWeight);
line-height: var(--ys-text-body0-lineHeight);
font-size: var(--ys-text-body0-fontSize);
letter-spacing: var(--ys-text-body0-letterSpacing);
}
p.ys-text-body0 + p.ys-text-body0 {
margin-top: var(--ys-text-body0-paragraphSpacing);
}
.ys-text-body0-bold {
font-family: var(--ys-text-body0-bold-fontFamily);
font-weight: var(--ys-text-body0-bold-fontWeight);
line-height: var(--ys-text-body0-bold-lineHeight);
font-size: var(--ys-text-body0-bold-fontSize);
letter-spacing: var(--ys-text-body0-bold-letterSpacing);
}
p.ys-text-body0-bold + p.ys-text-body0-bold {
margin-top: var(--ys-text-body0-bold-paragraphSpacing);
}
.ys-text-body1 {
font-family: var(--ys-text-body1-fontFamily);
font-weight: var(--ys-text-body1-fontWeight);
line-height: var(--ys-text-body1-lineHeight);
font-size: var(--ys-text-body1-fontSize);
letter-spacing: var(--ys-text-body1-letterSpacing);
}
p.ys-text-body1 + p.ys-text-body1 {
margin-top: var(--ys-text-body1-paragraphSpacing);
}
.ys-text-body1-italic {
font-family: var(--ys-text-body1-italic-fontFamily);
font-style: var(--ys-text-body1-italic-font-style);
line-height: var(--ys-text-body1-italic-lineHeight);
font-size: var(--ys-text-body1-italic-fontSize);
letter-spacing: var(--ys-text-body1-italic-letterSpacing);
}
p.ys-text-body1-italic + p.ys-text-body1-italic {
margin-top: var(--ys-text-body1-italic-paragraphSpacing);
}
.ys-text-body1-medium {
font-family: var(--ys-text-body1-medium-fontFamily);
font-weight: var(--ys-text-body1-medium-fontWeight);
line-height: var(--ys-text-body1-medium-lineHeight);
font-size: var(--ys-text-body1-medium-fontSize);
letter-spacing: var(--ys-text-body1-medium-letterSpacing);
}
p.ys-text-body1-medium + p.ys-text-body1-medium {
margin-top: var(--ys-text-body1-medium-paragraphSpacing);
}
.ys-text-body1-bold {
font-family: var(--ys-text-body1-bold-fontFamily);
font-weight: var(--ys-text-body1-bold-fontWeight);
line-height: var(--ys-text-body1-bold-lineHeight);
font-size: var(--ys-text-body1-bold-fontSize);
letter-spacing: var(--ys-text-body1-bold-letterSpacing);
}
p.ys-text-body1-bold + p.ys-text-body1-bold {
margin-top: var(--ys-text-body1-bold-paragraphSpacing);
}
.ys-text-body2 {
font-family: var(--ys-text-body2-fontFamily);
font-weight: var(--ys-text-body2-fontWeight);
line-height: var(--ys-text-body2-lineHeight);
font-size: var(--ys-text-body2-fontSize);
letter-spacing: var(--ys-text-body2-letterSpacing);
}
p.ys-text-body2 + p.ys-text-body2 {
margin-top: var(--ys-text-body2-paragraphSpacing);
}
.ys-text-body2-bold {
font-family: var(--ys-text-body2-bold-fontFamily);
font-weight: var(--ys-text-body2-bold-fontWeight);
line-height: var(--ys-text-body2-bold-lineHeight);
font-size: var(--ys-text-body2-bold-fontSize);
letter-spacing: var(--ys-text-body2-bold-letterSpacing);
}
p.ys-text-body2-bold + p.ys-text-body2-bold {
margin-top: var(--ys-text-body2-bold-paragraphSpacing);
}
.ys-text-body2-italic {
font-family: var(--ys-text-body2-italic-fontFamily);
font-style: var(--ys-text-body2-italic-font-style);
line-height: var(--ys-text-body2-italic-lineHeight);
font-size: var(--ys-text-body2-italic-fontSize);
letter-spacing: var(--ys-text-body2-italic-letterSpacing);
}
p.ys-text-body2-italic + p.ys-text-body2-italic {
margin-top: var(--ys-text-body2-italic-paragraphSpacing);
}
.ys-text-metadata1-bold {
font-family: var(--ys-text-metadata1-bold-fontFamily);
font-weight: var(--ys-text-metadata1-bold-fontWeight);
line-height: var(--ys-text-metadata1-bold-lineHeight);
font-size: var(--ys-text-metadata1-bold-fontSize);
letter-spacing: var(--ys-text-metadata1-bold-letterSpacing);
}
.ys-text-metadata1-medium {
font-family: var(--ys-text-metadata1-medium-fontFamily);
font-weight: var(--ys-text-metadata1-medium-fontWeight);
line-height: var(--ys-text-metadata1-medium-lineHeight);
font-size: var(--ys-text-metadata1-medium-fontSize);
letter-spacing: var(--ys-text-metadata1-medium-letterSpacing);
}
.ys-text-metadata1 {
font-family: var(--ys-text-metadata1-fontFamily);
font-weight: var(--ys-text-metadata1-fontWeight);
line-height: var(--ys-text-metadata1-lineHeight);
font-size: var(--ys-text-metadata1-fontSize);
letter-spacing: var(--ys-text-metadata1-letterSpacing);
}
.ys-text-metadata1-italic {
font-family: var(--ys-text-metadata1-italic-fontFamily);
font-style: var(--ys-text-metadata1-italic-font-style);
line-height: var(--ys-text-metadata1-italic-lineHeight);
font-size: var(--ys-text-metadata1-italic-fontSize);
letter-spacing: var(--ys-text-metadata1-italic-letterSpacing);
}
.ys-text-button1 {
font-family: var(--ys-text-button1-fontFamily);
font-weight: var(--ys-text-button1-fontWeight);
line-height: var(--ys-text-button1-lineHeight);
font-size: var(--ys-text-button1-fontSize);
letter-spacing: var(--ys-text-button1-letterSpacing);
}
.ys-text-button2 {
font-family: var(--ys-text-button2-fontFamily);
font-weight: var(--ys-text-button2-fontWeight);
line-height: var(--ys-text-button2-lineHeight);
font-size: var(--ys-text-button2-fontSize);
letter-spacing: var(--ys-text-button2-letterSpacing);
}
.ys-text-button3 {
font-family: var(--ys-text-button3-fontFamily);
font-weight: var(--ys-text-button3-fontWeight);
line-height: var(--ys-text-button3-lineHeight);
font-size: var(--ys-text-button3-fontSize);
letter-spacing: var(--ys-text-button3-letterSpacing);
}
.ys-text-link0 {
font-family: var(--ys-text-link0-fontFamily);
font-weight: var(--ys-text-link0-fontWeight);
line-height: var(--ys-text-link0-lineHeight);
font-size: var(--ys-text-link0-fontSize);
letter-spacing: var(--ys-text-link0-letterSpacing);
text-decoration: var(--ys-text-link0-textDecoration);
}
.ys-text-link1 {
font-family: var(--ys-text-link1-fontFamily);
font-weight: var(--ys-text-link1-fontWeight);
line-height: var(--ys-text-link1-lineHeight);
font-size: var(--ys-text-link1-fontSize);
letter-spacing: var(--ys-text-link1-letterSpacing);
text-decoration: var(--ys-text-link1-textDecoration);
}
.ys-text-link2 {
font-family: var(--ys-text-link2-fontFamily);
font-weight: var(--ys-text-link2-fontWeight);
line-height: var(--ys-text-link2-lineHeight);
font-size: var(--ys-text-link2-fontSize);
letter-spacing: var(--ys-text-link2-letterSpacing);
text-decoration: var(--ys-text-link2-textDecoration);
}
.ys-text-numeric1 {
font-family: var(--ys-text-numeric1-fontFamily);
font-weight: var(--ys-text-numeric1-fontWeight);
line-height: var(--ys-text-numeric1-lineHeight);
font-size: var(--ys-text-numeric1-fontSize);
letter-spacing: var(--ys-text-numeric1-letterSpacing);
}
#form-logo-fullscreen{background-color:#222;width:100vw;display:flex;align-items:center;justify-content:center}#form-logo-fullscreen img{height:50%}#form-logo{text-align:center}#form-logo svg{height:40px}
.purchase-flow-steps-menu{display:flex;text-transform:capitalize;margin-top:25px;text-align:center}.purchase-flow-steps-menu__step{cursor:pointer;flex-grow:1;border-top:3px solid;margin:0 2px;padding:10px;font-weight:900;font-size:.875rem}.purchase-flow-steps-menu__step--active{color:var(--ys-color-brand-primary)}.purchase-flow-steps-menu__step--inactive{color:var(--ys-color-text-dim);border-top-color:var(--ys-color-surface-tertiary)}.purchase-flow-steps-menu__step[aria-disabled=true]{color:var(--ys-color-text-dim);border-top-color:var(--ys-color-surface-tertiary);cursor:default;pointer-events:none}
.purchase-flow-image{display:flex;align-items:center;height:auto;margin:1rem auto}.purchase-flow-image img{object-fit:contain;object-position:50% 50%}
.purchase-flow-options .elite-select .product .product-title{margin-bottom:.25rem}
.purchase-flow-membership-options .elite-select .product .product-title{margin-bottom:.25rem}
.purchase-flow-billing__errors{text-align:center;padding:.5rem;width:100%}.purchase-flow-billing__errors a{text-decoration:underline}.purchase-flow-billing #terms-container{padding:5px 0}.purchase-flow-billing #terms-container #terms{font-weight:var(--ys-text-body1-fontWeight);line-height:var(--ys-text-body1-lineHeight);font-size:var(--ys-text-body1-fontSize);letter-spacing:var(--ys-text-body1-letterSpacing);min-height:20px;position:relative;display:inline-block;cursor:pointer}.purchase-flow-billing #terms-container .error-text{margin-top:5px;text-align:center}
.purchase-flow-checkbox{display:flex;flex-direction:column;position:relative;width:auto;margin:.625rem .625rem .625rem 0}.purchase-flow-checkbox__inner{display:inline-flex}.purchase-flow-checkbox__checkbox{position:absolute;opacity:0;width:0;height:0}.purchase-flow-checkbox__checkbox:focus+.purchase-flow-checkbox__checkbox__label::before{transition:border-color 250 ease-in-out;border-color:#555}.purchase-flow-checkbox__label{padding-left:var(--ys-spacing-300);display:inline-block;min-height:20px;position:relative;font-size:1rem;cursor:pointer}.purchase-flow-checkbox__label:hover::before{transition:border-color 250 ease-in-out;border-color:#555}.purchase-flow-checkbox__label::before{content:"";position:absolute;top:calc(50% - 8px);left:0;height:16px;width:16px;border-radius:2px;border:2px solid #d8d8d8;box-sizing:border-box}.purchase-flow-checkbox__label::after{position:absolute;content:none;display:inline-block;height:5px;width:8px;left:4px;top:calc(50% - 4px);border-left:2px solid;border-bottom:2px solid;color:#f5f5f5;transform:rotate(-45deg)}.purchase-flow-checkbox__checkbox:checked+.purchase-flow-checkbox__label::before{background-color:#555;border:none}.purchase-flow-checkbox__checkbox:checked+.purchase-flow-checkbox__label::after{content:""}.purchase-flow-checkbox__error{color:var(--ys-color-alert-error)}.purchase-flow-checkbox[data-error=true] .purchase-flow-checkbox__inner{border-radius:5px;padding:5px;margin-bottom:5px;border:1px solid var(--ys-color-alert-error)}
.purchase-flow-account form{margin-bottom:1rem}.purchase-flow-account__footer .terms{color:#777;font-size:14px;padding-bottom:10px}.purchase-flow-account__footer .social-logins .social-text{font-size:.75rem;color:#555;text-align:center}.purchase-flow-account__footer .social-logins .social-facebook-button{margin-top:20px}
.purchase-flow-user-info{background:var(--ys-color-surface-primary);border-radius:8px;padding:var(--ys-spacing-200);padding-bottom:var(--ys-spacing-250);margin-bottom:var(--ys-spacing-400)}.purchase-flow-user-info__meta{display:flex}.purchase-flow-user-info__meta-text{flex-grow:1;text-overflow:ellipsis;overflow:hidden;margin-right:.9375rem;font-size:.875rem}.purchase-flow-user-info__change{cursor:pointer;text-align:right;color:unset;text-decoration:underline;align-self:flex-start}
.purchase-flow-button{display:flex;align-items:center;flex-flow:row wrap;justify-content:center;border-radius:10px;line-height:1.5;font-weight:600;padding:.75rem 1.125rem;margin-bottom:10px;height:48px;width:100%;transition:background-color .25s ease;border:none;background-color:var(--ys-color-button-surface-primary-rest);color:var(--ys-color-button-text-primary-rest)}.purchase-flow-button:disabled{cursor:not-allowed;opacity:.5;background-color:var(--ys-color-button-surface-primary-disabled);color:var(--ys-color-button-text-primary-disabled)}.purchase-flow-button:hover{background-color:var(--ys-color-button-surface-primary-hover);color:var(--ys-color-button-text-primary-hover)}.purchase-flow-button:focus{background-color:var(--ys-color-button-surface-primary-focus);color:var(--ys-color-button-text-primary-focus)}
.loading-spinner{border-top:2px solid #222;margin:0 auto 15px;animation:spin 2s linear infinite;transform-origin:center center;border:3px solid #fff;width:22px;height:22px;border-radius:50%;border-right-color:var(--ys-color-brand-primary)}.loading-spinner::after{box-sizing:border-box;flex-grow:0;flex-shrink:0}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.purchase-flow-logged-in-form{text-align:center}.purchase-flow-logged-in-form h1{margin-bottom:.9375rem}.purchase-flow-logged-in-form button{margin-top:1.25rem;width:100%}.purchase-flow-logged-in-form__in-as{font-weight:var(--ys-text-body1-fontWeight);line-height:var(--ys-text-body1-lineHeight);font-size:var(--ys-text-body1-fontSize);letter-spacing:var(--ys-text-body1-letterSpacing)}.purchase-flow-logged-in-form__email{font-weight:var(--ys-text-body1-medium-fontWeight);line-height:var(--ys-text-body1-medium-lineHeight);font-size:var(--ys-text-body1-medium-fontSize);letter-spacing:var(--ys-text-body1-medium-letterSpacing)}.purchase-flow-logged-in-form__continue{cursor:pointer;color:var(--ys-color-brand-primary)}
.bulk-billing-success{display:flex;flex-direction:column;align-items:center;justify-content:space-around;min-height:500px;text-align:center}
.purchase-flow-check-membership__change-btn{color:var(--ys-color-brand-primary);cursor:pointer}.purchase-flow-check-membership h1{margin:0 0 20px}.purchase-flow-check-membership .membership-alert{padding:20px;margin-top:10px}.purchase-flow-check-membership button{width:100%;margin-top:15px}.purchase-flow-check-membership .section{margin-bottom:15px;font-size:.875rem}.purchase-flow-check-membership .section .meta{font-weight:700}.purchase-flow-check-membership .section span{font-size:.875rem;text-transform:capitalize}
.purchase-flow-bulk-purchase{display:flex;flex-direction:column;justify-content:space-between;flex-grow:2}
.contact-phone-number{display:flex;gap:var(--ys-spacing-100);justify-content:center}.contact-phone-number p{margin:0}
.input-container{margin-bottom:var(--ys-spacing-300);width:auto;position:relative}.input-container input{box-shadow:inset 0 1px 3px rgba(0,0,0,.0588235294);box-sizing:border-box;padding:10px;border:1px solid #a5a5a5;border-radius:4px;width:100%}.input-container input[data-error=true]{border-color:var(--ys-color-alert-error)}.input-container .password-display{position:absolute;top:9px;right:20px;cursor:pointer;font-size:1rem;color:#8b8b8b}
.purchase-flow-group-information--trial{margin-top:var(--ys-spacing-300)}.purchase-flow-group-information__form-wrapper{margin:var(--ys-spacing-300) 0;display:flex;flex-direction:column;gap:var(--ys-spacing-300)}.purchase-flow-group-information .select-input,.purchase-flow-group-information .input-container{margin:0}.purchase-flow-group-information .dropdown{appearance:none;background-size:15px;background-position:right 10px center;border-radius:5px;box-shadow:inset 0 1px 3px rgba(0,0,0,.06);box-sizing:border-box;padding:12px;width:100%;max-width:100%;cursor:pointer}.purchase-flow-group-information .dropdown:focus{box-shadow:inset 0 1px 3px rgba(0,0,0,.06),0 0 5px rgba(18,89,169,.7);outline:none}a.purchase-flow-link{color:var(--ys-color-text-primary);text-decoration:underline;display:flex;justify-content:center;font-size:var(--font-size-200);margin-top:var(--ys-spacing-400);text-align:center}
.select-input{position:relative;margin-bottom:var(--ys-spacing-200)}.select-input svg{position:absolute;right:1rem;top:50%;transform:translateY(-50%);height:15px;width:15px}.select-input__dropdown{appearance:none;background:#fff url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E") no-repeat right 5px top 55%;background-size:25px;background-position:right 10px center;border-radius:5px;border:1px solid #a5a5a5;box-shadow:inset 0 1px 3px rgba(0,0,0,.06);box-sizing:border-box;padding:10px;width:100%;cursor:pointer}.select-input__dropdown:focus{box-shadow:inset 0 1px 3px rgba(0,0,0,.06),0 0 5px rgba(18,89,169,.7);outline:none}.select-input__dropdown[data-active=false]{color:#8b8b8b}.select-input__dropdown[data-error=true]{border-color:var(--ys-color-alert-error)}.select-input__error{color:var(--ys-color-alert-error)}
.purchase-flow{height:100vh;max-height:100vh;display:flex;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);max-width:100vw;justify-content:center;align-items:center;flex-direction:column;color:var(--ys-color-text-primary)}.purchase-flow__inner{display:flex;justify-content:center;align-items:center;width:100%;height:100%;overflow:hidden}.purchase-flow a,.purchase-flow .highlight{color:var(--ys-color-brand-primary)}.purchase-flow a{cursor:pointer}.purchase-flow-button{display:flex;align-items:center;flex-flow:row wrap;justify-content:center;border-radius:10px;line-height:1.5;font-weight:600;padding:.75rem 1.125rem;margin-bottom:10px;height:48px;width:100%;transition:background-color .25s ease;border:none;background-color:var(--ys-color-button-surface-primary-rest);color:var(--ys-color-button-text-primary-rest)}.purchase-flow-button:disabled{cursor:not-allowed;opacity:.5;background-color:var(--ys-color-button-surface-primary-disabled);color:var(--ys-color-button-text-primary-disabled)}.purchase-flow-button:hover{background-color:var(--ys-color-button-surface-primary-hover);color:var(--ys-color-button-text-primary-hover)}.purchase-flow-button:focus{background-color:var(--ys-color-button-surface-primary-focus);color:var(--ys-color-button-text-primary-focus)}.purchase-flow-button-link-text{display:block;appearance:none;background:none;text-decoration:underline;font-size:.8rem;text-align:center;border:none;cursor:pointer}.purchase-flow-product[data-selected=true] .radio-container,.purchase-flow-elite-options__product[data-selected=true] .radio-container{background-color:var(--ys-color-brand-primary);border-color:var(--ys-color-brand-primary)}.purchase-flow .checkmark{color:var(--ys-color-brand-primary)}.purchase-flow .loading-spinner{border-right-color:var(--ys-color-brand-primary)}.purchase-flow .highlight{font-weight:bold}.purchase-flow .hidden{display:none}.purchase-flow .strikeout{color:#8b8b8b;font-weight:400;text-decoration:line-through}.purchase-flow #background{position:relative;display:flex;justify-content:center;align-items:center;flex-grow:1;width:60%;height:100%;overflow:hidden;background-position:center;background-size:cover;background-repeat:no-repeat;background-color:#d8d8d8}.purchase-flow #background img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center center;margin:0}@media(max-width: 1024px){.purchase-flow #background{display:none}}.purchase-flow-products-list__title{font-size:2.25rem;font-weight:900;margin-bottom:.625rem;letter-spacing:-0.0313rem;line-height:2.75rem;color:#333}.purchase-flow-product{position:relative;border:2px solid #e2e2e2;border-radius:5px;padding:1rem 1.25rem;margin:0 0 .625rem;cursor:pointer}.purchase-flow-product .tier-description{margin-bottom:12px;width:85%;display:flex}.purchase-flow-product .checkmark{margin-right:15px}.purchase-flow-product .radio-container{position:absolute;top:1rem;right:1.25rem;left:auto;height:24px;width:24px;min-width:20px;border:2px solid #bdbdbd;border-radius:50%;text-align:left}.purchase-flow-product .radio-container::before{content:" ";position:absolute;width:48px;height:48px;top:50%;left:50%;z-index:11;border-radius:50%;transform:translate(-50%, -50%)}.purchase-flow-product .radio-container::after{content:" ";position:absolute;border-radius:50%;transform:scale3d(0.3, 0.3, 1);border:10px solid #fff;opacity:1}.purchase-flow-product .radio-container input{position:absolute;left:-9999em}.purchase-flow-product__price-container{display:flex;flex-direction:column;max-width:280px}.purchase-flow-product__prices{display:flex;flex-flow:row nowrap}.purchase-flow-product__price{font-size:.875rem;line-height:1.4286;font-weight:500;letter-spacing:-0.25px}.purchase-flow-product__term{font-size:.875rem;line-height:1.4286;font-weight:700;letter-spacing:-0.5px}.purchase-flow-product__name{margin-top:0;margin-bottom:.75em;padding-right:2rem;font-size:1rem;line-height:1.25;font-weight:900}.purchase-flow-product__value-prop{font-size:.875rem}.purchase-flow-product[data-selected=true]{border-color:#555}.purchase-flow-product .or{padding:0 10px;font-size:.75rem}.purchase-flow #form-logo{text-align:center}.purchase-flow #form-logo svg{height:40px}.purchase-flow .sidebar{display:flex;flex-direction:column;max-width:initial;width:45%;height:100%;padding:3rem;overflow-y:auto;background-color:#fff}.purchase-flow .sidebar.hidden{display:none}@media(max-width: 1024px){.purchase-flow .sidebar{padding:2rem;width:100%}}.purchase-flow .text-input{width:auto;margin:10px 0;position:relative}.purchase-flow .text-input input,.purchase-flow .text-input textarea{box-sizing:border-box;margin-bottom:4px;padding:10px;border:1px solid #a5a5a5;border-radius:4px;width:100%}.purchase-flow .text-input input.icon,.purchase-flow .text-input textarea.icon{border-color:#e2e2e2;border-radius:0 10px 10px 0;border-left:0}.purchase-flow .text-input input.icon:focus,.purchase-flow .text-input textarea.icon:focus{outline:none;box-shadow:none}.purchase-flow .text-input .text-input-container{margin-top:20px;position:relative}.purchase-flow .text-input .text-input-container.icon{display:flex;flex-direction:row-reverse}.purchase-flow .text-input .text-input-container:focus{outline:none}.purchase-flow .text-input .text-input-label{margin-top:20px}.purchase-flow .text-input .text-input-label+.text-input-container{margin-top:0}.purchase-flow .text-input .error-message{margin-top:2px}.purchase-flow .text-input.ellipsis input{text-overflow:ellipsis}.purchase-flow .text-input.has-clear-btn input,.purchase-flow .text-input.has-clear-btn textarea{padding-right:36px}.purchase-flow .text-input .clear-btn{position:absolute;top:0;right:8px;bottom:0;width:30px;height:30px;margin:auto;padding:0;font-size:.8rem;background:rgba(0,0,0,0)}.purchase-flow .text-input.multiline .clear-btn{top:6px;right:20px;bottom:auto}.purchase-flow .text-input .character-counter{text-align:right}.purchase-flow .text-input.required label::after{position:absolute;top:2px;transform:translateX(calc(100% + 2px));content:"*";line-height:1em;vertical-align:top}.purchase-flow .info-row{border-bottom:1px solid #f5f5f5;padding-bottom:20px;margin:20px 0}.purchase-flow .info-row h4{text-transform:capitalize}.purchase-flow .info-row h5,.purchase-flow .info-row h6{margin-bottom:0}.purchase-flow .info-row .info-cols{display:flex}.purchase-flow .info-row .info-cols .info-col{flex-direction:row}.purchase-flow .info-row .info-cols .grow-1{flex-grow:1}.purchase-flow .info-row .align-right{text-align:right}.purchase-flow .info-row .strikeout{text-decoration:line-through;color:#8b8b8b}.purchase-flow textarea{box-sizing:border-box;margin-top:1.25rem;margin-bottom:0;padding:10px;border:1px solid #d8d8d8;border-radius:4px;width:100%;font-size:.875rem;line-height:1.4286;font-weight:400}.purchase-flow textarea[data-error=true]{border-color:var(--ys-color-alert-error)}.purchase-flow small{font-size:.6875rem}.purchase-flow .error-message{color:var(--ys-color-alert-error);margin-top:2px}.purchase-flow .form-errors{color:var(--ys-color-alert-error);text-align:center;margin:20px}.purchase-flow ::placeholder{color:#8b8b8b}.purchase-flow.ellipsis input{text-overflow:ellipsis}.grecaptcha-badge{visibility:hidden}.title{font-size:2rem;font-weight:900;color:var(--ys-color-text-primary);margin:var(--ys-spacing-400) 0}hr{color:var(--ys-color-surface-tertiary)}