/* one-variables.css */ @font-face { font-family: "MiSans-VF-for-Web-Bold"; src: url(../font/MiSansVFforWeb-Demibold.ttf) format("truetype"); font-variation-settings: 'wght' 700; font-style: normal; font-display: swap; } @font-face { font-family: "MiSans-VF-for-Web-Medium"; src: url(../font/MiSansVFforWeb-Medium.ttf) format("truetype"); font-variation-settings: 'wght' 500; font-style: normal; font-display: swap; } @font-face { font-family: "MiSans-VF-for-Web-Light"; src: url(../font/MiSansVFforWeb-Light.ttf) format("truetype"); font-variation-settings: 'wght' 300; font-style: normal; font-display: swap; } html, body { margin: 0; } body { margin: 0; position: relative; } #one-dom-container { --font-r: MiSans-VF-for-Web-Light, PingFang SC, Hiragino Sans GB, STHeiti, Microsoft YaHei, WenQuanYi Micro Hei, Helvetica Neue, Helvetica, Arial, sans-serif; --font-m: MiSans-VF-for-Web-Medium, PingFang SC, Hiragino Sans GB, STHeiti, Microsoft YaHei, WenQuanYi Micro Hei, Helvetica Neue, Helvetica, Arial, sans-serif; --font-b: MiSans-VF-for-Web-Bold, PingFang SC, Hiragino Sans GB, STHeiti, Microsoft YaHei, WenQuanYi Micro Hei, Helvetica Neue, Helvetica, Arial, sans-serif; } /* ≥1440(PC) */ @media screen and (min-width: 1440px) { #one-dom-container { /* typography tokens */ /* number */ --component-chapter-page-spacing-2: 3.2em; --component-chapter-page-spacing-1: 9.2em; --component-chapter-page-width: 72em; --component-toggle-control-01-spacing: 1em; --component-toggle-control-01-size: 2.4em; --component-toggle-control-02-outline: 0.075em; --component-toggle-control-02-spacing: 0.8em; --component-toggle-control-02-size: 1.4em; --component-toggle-control-05-size: 1.6em; --component-toggle-control-06-spacing: 0.4em; --component-toggle-control-06-spacing-2: 1em; --component-toggle-control-07-spacing: 0.4em; --component-toggle-control-07-spacing-2: 1em; --component-toggle-control-08-spacing: 0.2em; --component-toggle-control-08-spacing-2: 0.4em; --component-toggle-control-08-spacing-3: 0.6em; --semantic-corner-radius-level-3: 0.4em; --semantic-corner-radius-level-2: 0.6em; --semantic-corner-radius-level-1: 0.8em; --semantic-font-line-height-footnote-1: 166.667%; --semantic-font-line-height-body-3: 157.143%; --semantic-font-line-height-body-2: 150%; --semantic-font-line-height-body-1: 144.444%; --semantic-font-line-height-sub-head-3: 140%; --semantic-font-line-height-sub-head-2: 133.333%; --semantic-font-line-height-sub-head-1: 125%; --semantic-font-line-height-head-4: 128.571%; --semantic-font-line-height-head-3: 122.222%; --semantic-font-line-height-head-2: 119.048%; --semantic-font-line-height-head-1: 125%; --semantic-font-line-height-head-0: 150%; --semantic-font-size-footnote-1: 12px; --semantic-font-size-body-3: 14px; --semantic-font-size-body-2: 16px; --semantic-font-size-body-1: 18px; --semantic-font-size-sub-head-3: 20px; --semantic-font-size-sub-head-2: 24px; --semantic-font-size-sub-head-1: 32px; --semantic-font-size-head-2: 36px; --semantic-font-size-head-1: 48px; --semantic-font-size-head-0: 68px; --semantic-space-inset-level-7: 0.2em; --semantic-space-inset-level-6: 0.4em; --semantic-space-inset-level-5: 0.6em; --semantic-space-inset-level-4: 0.8em; --semantic-space-inset-level-3: 1em; --semantic-space-inset-level-2: 1.2em; --semantic-space-inset-level-1: 2.4em; --semantic-space-stack-level-2: 3.2em; --semantic-space-stack-level-1: 4em; /* string */ --component-button-arrow-on-card-port: pc; --component-ksp-layout: PC; } } /* ≥1024(PC) */ @media screen and (max-width: 1439px) and (min-width: 1024px) { #one-dom-container { /* typography tokens */ /* number */ --component-chapter-page-spacing-2: 3.2em; --component-chapter-page-spacing-1: 9.2em; --component-chapter-page-width: 72em; --component-toggle-control-01-spacing: 1em; --component-toggle-control-01-size: 2.4em; --component-toggle-control-02-outline: 0.075em; --component-toggle-control-02-spacing: 0.8em; --component-toggle-control-02-size: 1.4em; --component-toggle-control-05-size: 1.6em; --component-toggle-control-06-spacing: 0.4em; --component-toggle-control-06-spacing-2: 1em; --component-toggle-control-07-spacing: 0.4em; --component-toggle-control-07-spacing-2: 1em; --component-toggle-control-08-spacing: 0.2em; --component-toggle-control-08-spacing-2: 0.4em; --component-toggle-control-08-spacing-3: 0.6em; --semantic-corner-radius-level-3: 0.4em; --semantic-corner-radius-level-2: 0.6em; --semantic-corner-radius-level-1: 0.8em; --semantic-font-line-height-footnote-1: 166.667%; --semantic-font-line-height-body-3: 157.143%; --semantic-font-line-height-body-2: 150%; --semantic-font-line-height-body-1: 144.444%; --semantic-font-line-height-sub-head-3: 140%; --semantic-font-line-height-sub-head-2: 133.333%; --semantic-font-line-height-sub-head-1: 125%; --semantic-font-line-height-head-4: 128.571%; --semantic-font-line-height-head-3: 122.222%; --semantic-font-line-height-head-2: 119.048%; --semantic-font-line-height-head-1: 125%; --semantic-font-line-height-head-0: 150%; --semantic-font-size-footnote-1: 0.6em; --semantic-font-size-body-3: 0.7em; --semantic-font-size-body-2: 0.8em; --semantic-font-size-body-1: 0.9em; --semantic-font-size-sub-head-3: 1em; --semantic-font-size-sub-head-2: 1.2em; --semantic-font-size-sub-head-1: 1.6em; --semantic-font-size-head-2: 1.8em; --semantic-font-size-head-1: 2.4em; --semantic-font-size-head-0: 3.4em; --semantic-space-inset-level-7: 0.2em; --semantic-space-inset-level-6: 0.4em; --semantic-space-inset-level-5: 0.6em; --semantic-space-inset-level-4: 0.8em; --semantic-space-inset-level-3: 1em; --semantic-space-inset-level-2: 1.2em; --semantic-space-inset-level-1: 2.4em; --semantic-space-stack-level-2: 3.2em; --semantic-space-stack-level-1: 4em; /* string */ --component-button-arrow-on-card-port: pc; --component-ksp-layout: PC; } } /* 650(PAD) ≤ W < 1024 */ @media screen and (max-width: 1023px) and (min-width: 650px) { #one-dom-container { /* typography tokens */ /* number */ --component-chapter-page-spacing-2: 1.2em; --component-chapter-page-spacing-1: 7em; --component-chapter-page-width: 38.4em; --component-toggle-control-01-spacing: 1em; --component-toggle-control-01-size: 2em; --component-toggle-control-02-outline: 0.075em; --component-toggle-control-02-spacing: 0.8em; --component-toggle-control-02-size: 1.4em; --component-toggle-control-05-size: 1.6em; --component-toggle-control-06-spacing: 0.2em; --component-toggle-control-06-spacing-2: 0.8em; --component-toggle-control-07-spacing: 0.2em; --component-toggle-control-07-spacing-2: 0.8em; --component-toggle-control-08-spacing: 0.2em; --component-toggle-control-08-spacing-2: 0.2em; --component-toggle-control-08-spacing-3: 0.4em; --semantic-corner-radius-level-3: 0.2em; --semantic-corner-radius-level-2: 0.4em; --semantic-corner-radius-level-1: 0.6em; --semantic-font-line-height-footnote-1: 166.667%; --semantic-font-line-height-body-3: 166.667%; --semantic-font-line-height-body-2: 157.143%; --semantic-font-line-height-body-1: 150%; --semantic-font-line-height-sub-head-3: 150%; --semantic-font-line-height-sub-head-2: 140%; --semantic-font-line-height-sub-head-1: 133.333%; --semantic-font-line-height-head-4: 157.143%; --semantic-font-line-height-head-3: 128.571%; --semantic-font-line-height-head-2: 122.222%; --semantic-font-line-height-head-1: 126.667%; --semantic-font-line-height-head-0: 116.667%; --semantic-font-size-footnote-1: 12px; --semantic-font-size-body-3: 12px; --semantic-font-size-body-2: 14px; --semantic-font-size-body-1: 16px; --semantic-font-size-sub-head-3: 16px; --semantic-font-size-sub-head-2: 20px; --semantic-font-size-sub-head-1: 24px; --semantic-font-size-head-4: 14px; --semantic-font-size-head-3: 28px; --semantic-font-size-head-2: 28px; --semantic-font-size-head-1: 30px; --semantic-font-size-head-0: 48px; --semantic-space-inset-level-6: 0.2em; --semantic-space-inset-level-7: 0.2em; --semantic-space-inset-level-5: 0.4em; --semantic-space-inset-level-4: 0.6em; --semantic-space-inset-level-3: 0.8em; --semantic-space-inset-level-2: 0.9em; --semantic-space-inset-level-1: 1.2em; --semantic-space-stack-level-2: 1.2em; --semantic-space-stack-level-1: 2.4em; /* string */ --component-button-arrow-on-card-port: pad; --component-ksp-layout: Pad; } } /* 360(PHONE) ≤ W ≤ 650 */ @media screen and (max-width: 649px) { #one-dom-container { /* typography tokens */ /* number */ --component-chapter-page-spacing-2: 0.8em; --component-chapter-page-spacing-1: 4em; --component-chapter-page-width: 18em; --component-toggle-control-01-spacing: 0.8em; --component-toggle-control-01-size: 1.6em; --component-toggle-control-02-outline: 0.05em; --component-toggle-control-02-spacing: 0.6em; --component-toggle-control-02-size: 1em; --component-toggle-control-05-size: 1.2em; --component-toggle-control-06-spacing: 0.2em; --component-toggle-control-06-spacing-2: 0.8em; --component-toggle-control-07-spacing: 0.2em; --component-toggle-control-07-spacing-2: 0.8em; --component-toggle-control-08-spacing: 0.2em; --component-toggle-control-08-spacing-2: 0.2em; --component-toggle-control-08-spacing-3: 0.4em; --semantic-corner-radius-level-3: 0.2em; --semantic-corner-radius-level-2: 0.4em; --semantic-corner-radius-level-1: 0.6em; --semantic-font-line-height-footnote-1: 166.667%; --semantic-font-line-height-body-3: 166.667%; --semantic-font-line-height-body-2: 157.143%; --semantic-font-line-height-body-1: 150%; --semantic-font-line-height-sub-head-3: 150%; --semantic-font-line-height-sub-head-2: 140%; --semantic-font-line-height-sub-head-1: 133.333%; --semantic-font-line-height-head-4: 166.667%; --semantic-font-line-height-head-3: 128.571%; --semantic-font-line-height-head-2: 122.222%; --semantic-font-line-height-head-1: 126.667%; --semantic-font-line-height-head-0: 122.222%; --semantic-font-size-footnote-1: 12px; --semantic-font-size-body-3: 12px; --semantic-font-size-body-2: 14px; --semantic-font-size-body-1: 16px; --semantic-font-size-sub-head-3: 16px; --semantic-font-size-sub-head-2: 20px; --semantic-font-size-sub-head-1: 24px; --semantic-font-size-head-2: 28px; --semantic-font-size-head-1: 30px; --semantic-font-size-head-0: 48px; --semantic-space-inset-level-6: 0.2em; --semantic-space-inset-level-7: 0.2em; --semantic-space-inset-level-5: 0.4em; --semantic-space-inset-level-4: 0.6em; --semantic-space-inset-level-3: 0.8em; --semantic-space-inset-level-2: 0.9em; --semantic-space-inset-level-1: 1.2em; --semantic-space-stack-level-2: 0.8em; --semantic-space-stack-level-1: 2.4em; /* string */ --component-button-arrow-on-card-port: wap; --component-ksp-layout: Phone; } } /* Color Tokens */ /* light */ /* color */ #one-dom-container .wt { --component-button-bg-primary-black-default: var(--semantic-surface-primary-gray---l1---100); --component-button-bg-primary-black-disable: var(--semantic-surface-primary-fixed---l4---25); --component-button-bg-primary-black-overlay-hover: var(--primitives-neutral-white-25a); --component-button-bg-primary-brand-default: var(--semantic-surface-brand-fixed---green); --component-button-bg-primary-brand-disable: var(--semantic-surface-primary-fixed---l4---25); --component-button-bg-primary-brand-overlay-hover: var(--primitives-neutral-black-20a); --component-button-bg-primary-gray-default: var(--semantic-surface-primary-fixed---l7---08); --component-button-bg-primary-gray-disable: var(--semantic-surface-primary-fixed---l4---25); --component-button-bg-primary-gray-overlay-hover: var(--primitives-neutral-black-08a); --component-button-bg-primary-opa-high-default: var(--semantic-surface-primary-opacity---black-l5---25a); --component-button-bg-primary-opa-high-disable: var(--semantic-surface-primary-opacity---black-l8---08a); --component-button-bg-primary-opa-high-overlay-hover: var(--primitives-neutral-black-00a); --component-button-bg-primary-opa-low-default: var(--semantic-surface-primary-opacity---black-l8---08a); --component-button-bg-primary-opa-low-disable: var(--semantic-surface-primary-opacity---black-l10---02a); --component-button-bg-primary-opa-low-overlay-hover: var(--primitives-neutral-black-00a); --component-button-bg-secondary-black-default: var(--primitives-neutral-black-00a); --component-button-bg-secondary-black-disable: var(--primitives-neutral-black-00a); --component-button-bg-secondary-black-overlay-hover: var(--primitives-neutral-black-08a); --component-button-bg-secondary-gray-default: var(--primitives-neutral-black-00a); --component-button-bg-secondary-gray-disable: var(--primitives-neutral-black-00a); --component-button-bg-secondary-gray-overlay-hover: var(--primitives-neutral-black-08a); --component-button-border-secondary-black-default: var(--semantic-border-primary-black-l1---100); --component-button-border-secondary-black-disable: var(--semantic-border-primary-black-l3---20a); --component-button-border-secondary-black-hover: var(--semantic-border-primary-black-l1---100); --component-button-border-secondary-gray-default: var(--semantic-border-primary-black-l4---15a); --component-button-border-secondary-gray-disable: var(--semantic-border-primary-black-l3---20a); --component-button-border-secondary-gray-hover: var(--semantic-border-primary-black-l4---15a); --component-button-icon-primary-black-default: var(--semantic-text-primary-on-surface---white-l1---00); --component-button-icon-primary-black-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-icon-primary-black-hover: var(--semantic-text-primary-on-surface---white-l1---00); --component-button-icon-primary-brand-default: var(--semantic-text-primary-fixed---black-l1---100); --component-button-icon-primary-brand-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-icon-primary-brand-hover: var(--semantic-text-primary-fixed---black-l1---100); --component-button-icon-primary-gray-default: var(--semantic-text-primary-fixed---black-l1---100); --component-button-icon-primary-gray-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-icon-primary-gray-hover: var(--semantic-text-primary-fixed---black-l1---100); --component-button-icon-primary-opa-high-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-primary-opa-high-disable: var(--semantic-text-primary-opacity---black-l6---20a); --component-button-icon-primary-opa-high-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-primary-opa-low-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-primary-opa-low-disable: var(--semantic-text-primary-opacity---black-l5---30a); --component-button-icon-primary-opa-low-overlay-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-secondary-black-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-secondary-black-disable: var(--semantic-text-primary-opacity---black-l5---30a); --component-button-icon-secondary-black-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-secondary-gray-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-secondary-gray-disable: var(--semantic-text-primary-opacity---black-l5---30a); --component-button-icon-secondary-gray-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-primary-black-default: var(--semantic-text-primary-on-surface---white-l1---00); --component-button-text-primary-black-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-text-primary-black-hover: var(--semantic-text-primary-on-surface---white-l1---00); --component-button-text-primary-brand-default: var(--semantic-text-primary-fixed---black-l1---100); --component-button-text-primary-brand-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-text-primary-brand-hover: var(--semantic-text-primary-fixed---black-l1---100); --component-button-text-primary-gray-default: var(--semantic-text-primary-fixed---black-l1---100); --component-button-text-primary-gray-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-text-primary-gray-hover: var(--semantic-text-primary-fixed---black-l1---100); --component-button-text-primary-opa-high-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-primary-opa-high-disable: var(--semantic-text-primary-opacity---black-l6---20a); --component-button-text-primary-opa-high-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-primary-opa-low-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-primary-opa-low-disable: var(--semantic-text-primary-opacity---black-l5---30a); --component-button-text-primary-opa-low-overlay-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-secondary-black-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-secondary-black-disable: var(--semantic-text-primary-opacity---black-l5---30a); --component-button-text-secondary-black-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-secondary-gray-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-secondary-gray-disable: var(--semantic-text-primary-opacity---black-l5---30a); --component-button-text-secondary-gray-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-bg-primary-black-opa: var(--semantic-surface-primary-opacity---black-l9---04a); --component-card-info-bg-primary-black-opa-select: var(--semantic-surface-primary-opacity---black-l7---12a); --component-card-info-bg-primary-white: var(--semantic-surface-primary-gray---l9---02); --component-card-info-bg-primary-white-opa: var(--semantic-surface-primary-opacity---white-l4---45a); --component-card-info-bg-primary-white-opa-select: var(--semantic-surface-primary-gray---l10---00); --component-card-info-icon-primary-black-opa: var(--semantic-icon-primary-opacity---black-l1---100); --component-card-info-icon-primary-white: var(--semantic-icon-primary-opacity---black-l1---100); --component-card-info-icon-primary-white-opa: var(--semantic-icon-primary-opacity---black-l1---100); --component-card-info-icon-primary-white-opa-white-bg: var(--semantic-icon-primary-on-surface---white-l1---00); --component-card-info-text-primary-black-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-primary-black-opa-select-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-primary-black-opa-select-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-card-info-text-primary-white-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-primary-white-l2: var(--semantic-text-primary-opacity---black-l4---55a); --component-card-info-text-primary-white-opa: var(--semantic-text-primary-opacity---black-l4---55a); --component-card-info-text-primary-white-opa--select-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-primary-white-opa-select-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-card-info-text-primary-white-link: var(--semantic-text-state-link&tip); --component-card-info-text-secondary: var(--semantic-text-primary-opacity---black-l5---30a); --component-card-info-text-secondary-select-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-secondary-select-l2: var(--semantic-text-primary-opacity---black-l4---55a); --component-card-mark-bg-primary-black-opa: var(--semantic-surface-primary-opacity---black-l3---55a); --component-card-mark-bg-primary-gray-opa: var(--semantic-surface-primary-opacity---black-l8---08a); --component-card-mark-bg-primary-white: var(--semantic-surface-primary-gray---l10---00); --component-card-mark-border-secondary-black-opa: var(--semantic-border-primary-black-l2---50a); --component-card-mark-border-secondary-gray-opa: var(--primitives-neutral-black-10a); --component-card-mark-border-secondary-white: var(--semantic-border-primary-black-l1---100); --component-card-mark-divider-primary-gray-opa: var(--primitives-neutral-black-08a); --component-card-mark-icon-primary-black-opa: var(--semantic-text-primary-on-surface---white-l1---00); --component-card-mark-icon-primary-gray-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-icon-primary-white: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-icon-secondary-black-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-icon-secondary-gray-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-icon-secondary-white: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-primary-black-opa: var(--semantic-text-primary-on-surface---white-l1---00); --component-card-mark-text-primary-gray-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-primary-white: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-secondary-black-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-secondary-gray-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-secondary-white: var(--semantic-text-primary-opacity---black-l1---100); --component-card-tab-bar-bg-primary: var(--semantic-surface-primary-opacity---black-l9---04a); --component-card-tab-bar-bg-primary-select: var(--semantic-surface-primary-fixed---l10---00); --component-card-tab-bar-divider-primary: var(--primitives-neutral-black-04a); --component-card-tab-bar-text-primary: var(--semantic-surface-primary-gray---l1---100); --component-card-tab-bar-text-primary-select: var(--semantic-surface-primary-fixed---l1---100); --component-card-tab-bar-text-secondary: var(--semantic-surface-primary-opacity---black-l4---35a); --component-card-tab-bar-text-secondary-select: var(--semantic-surface-primary-gray---l1---100); --component-text-body-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-body-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-text-body-l3: var(--semantic-text-primary-opacity---black-l4---55a); --component-text-data-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-headine-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-remark-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-remark-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-text-remark-l2-2: var(--semantic-text-primary-opacity---black-l3---75a); --component-text-remark-l3: var(--semantic-text-primary-opacity---black-l4---55a); --component-text-remark-l3-2: var(--semantic-text-primary-opacity---black-l4---55a); --component-text-subtitle-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-subtitle-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-text-subtitle-l3: var(--semantic-text-primary-opacity---black-l4---55a); --primitives-brand-blue: #2660f5; --primitives-brand-brand-brown: #a07e6d; --primitives-brand-brand-gray02: #fafafa; --primitives-brand-brand-gray04: #f5f4f0; --primitives-brand-brand-gray08: #ebe8e3; --primitives-brand-brand-gray13: #ddd9d4; --primitives-brand-brand-gray23: #c3bfb9; --primitives-brand-brand-gray38: #9e9a94; --primitives-brand-brand-gray56: #706c66; --primitives-brand-brand-gray72: #484540; --primitives-brand-brand-gray87: #201f1c; --primitives-brand-brand-green: #2cff73; --primitives-brand-brand-light-green: #d7ffdb; --primitives-brand-brand-purple: #b995ff; --primitives-brand-brand-theme-green: #26c05d; --primitives-brand-light-blue: #e8f3ff; --primitives-brand-light-red: #fdefed; --primitives-brand-red: #e23220; --primitives-neutral-black-00a: #00000000; --primitives-neutral-black-02a: #00000005; --primitives-neutral-black-04a: #0000000a; --primitives-neutral-black-08a: #00000014; --primitives-neutral-black-10a: #0000001a; --primitives-neutral-black-12a: #0000001f; --primitives-neutral-black-15a: #00000026; --primitives-neutral-black-20a: #00000033; --primitives-neutral-black-25a: #00000040; --primitives-neutral-black-30a: #0000004d; --primitives-neutral-black-35a: #00000059; --primitives-neutral-black-50a: #00000080; --primitives-neutral-black-55a: #0000008c; --primitives-neutral-black-60a: #00000099; --primitives-neutral-black-70a: #000000b2; --primitives-neutral-black-75a: #000000bf; --primitives-neutral-black-80a: #000000cc; --primitives-neutral-black-84a: #000000d6; --primitives-neutral-black-90a: #000000e5; --primitives-neutral-black-95a: #000000f2; --primitives-neutral-gray-00: #ffffff; --primitives-neutral-gray-02: #fafafa; --primitives-neutral-gray-04: #f6f6f6; --primitives-neutral-gray-08: #ebebeb; --primitives-neutral-gray-10: #e6e6e6; --primitives-neutral-gray-100: #000000; --primitives-neutral-gray-12: #e0e0e0; --primitives-neutral-gray-15: #d9d9d9; --primitives-neutral-gray-20: #cccccc; --primitives-neutral-gray-25: #bfbfbf; --primitives-neutral-gray-30: #b3b3b3; --primitives-neutral-gray-35: #a6a6a6; --primitives-neutral-gray-50: #808080; --primitives-neutral-gray-55: #737373; --primitives-neutral-gray-60: #666666; --primitives-neutral-gray-70: #4d4d4d; --primitives-neutral-gray-75: #404040; --primitives-neutral-gray-80: #333333; --primitives-neutral-gray-84: #282828; --primitives-neutral-gray-90: #1a1a1a; --primitives-neutral-gray-95: #0d0d0d; --primitives-neutral-white-00a: #ffffff00; --primitives-neutral-white-05a: #ffffff0d; --primitives-neutral-white-10a: #ffffff1a; --primitives-neutral-white-16a: #ffffff29; --primitives-neutral-white-20a: #ffffff33; --primitives-neutral-white-25a: #ffffff40; --primitives-neutral-white-30a: #ffffff4d; --primitives-neutral-white-40a: #ffffff66; --primitives-neutral-white-45a: #ffffff73; --primitives-neutral-white-50a: #ffffff80; --primitives-neutral-white-65a: #ffffffa6; --primitives-neutral-white-70a: #ffffffb2; --primitives-neutral-white-75a: #ffffffbf; --primitives-neutral-white-80a: #ffffffcc; --primitives-neutral-white-85a: #ffffffd9; --primitives-neutral-white-88a: #ffffffe0; --primitives-neutral-white-90a: #ffffffe5; --primitives-neutral-white-92a: #ffffffeb; --primitives-neutral-white-96a: #fffffff5; --primitives-neutral-white-98a: #fffffffa; --semantic-background-primary-cold-gray--04: #f4f3f6; --semantic-background-primary-warm-gray---07: #eceae6; --semantic-background-primary-gray---l1---00: var(--primitives-neutral-gray-00); --semantic-background-primary-gray---l2--02: var(--primitives-neutral-gray-02); --semantic-background-primary-gray---l3---04: var(--primitives-neutral-gray-04); --semantic-background-primary-gray---l4---15: var(--primitives-neutral-gray-15); --semantic-border-primary-black-l1---100: var(--primitives-neutral-gray-100); --semantic-border-primary-black-l2---50a: var(--primitives-neutral-black-50a); --semantic-border-primary-black-l3---20a: var(--primitives-neutral-black-20a); --semantic-border-primary-black-l4---15a: var(--primitives-neutral-black-15a); --semantic-divider-primary-gray---l1---15: var(--primitives-neutral-gray-15); --semantic-divider-primary-gray---l2---04: var(--primitives-neutral-gray-04); --semantic-icon-miscellaneous-border-button---30a: var(--primitives-neutral-black-30a); --semantic-icon-primary-fixed---black-l1---100: var(--primitives-neutral-gray-100); --semantic-icon-primary-fixed---black-l2---95a: var(--primitives-neutral-black-95a); --semantic-icon-primary-fixed---black-l3---75a: var(--primitives-neutral-black-75a); --semantic-icon-primary-fixed---black-l4---55a: var(--primitives-neutral-black-55a); --semantic-icon-primary-fixed---black-l5---30a: var(--primitives-neutral-black-30a); --semantic-icon-primary-fixed---black-l6---20a: var(--primitives-neutral-black-20a); --semantic-icon-primary-fixed---black-l7---15a: var(--primitives-neutral-black-15a); --semantic-icon-primary-fixed---white-l1---00: var(--primitives-neutral-gray-00); --semantic-icon-primary-fixed---white-l2---98a: var(--primitives-neutral-white-98a); --semantic-icon-primary-fixed---white-l3---75a: var(--primitives-neutral-white-75a); --semantic-icon-primary-fixed---white-l4---50a: var(--primitives-neutral-white-50a); --semantic-icon-primary-fixed---white-l5---30a: var(--primitives-neutral-white-30a); --semantic-icon-primary-fixed---white-l6---20a: var(--primitives-neutral-white-20a); --semantic-icon-primary-fixed---white-l7---16a: var(--primitives-neutral-white-16a); --semantic-icon-primary-on-surface---white-l1---00: var(--primitives-neutral-gray-00); --semantic-icon-primary-on-surface---white-l2---98a: var(--primitives-neutral-white-98a); --semantic-icon-primary-on-surface---white-l3---75a: var(--primitives-neutral-white-75a); --semantic-icon-primary-on-surface---white-l4---50a: var(--primitives-neutral-white-50a); --semantic-icon-primary-on-surface---white-l5---30a: var(--primitives-neutral-white-30a); --semantic-icon-primary-on-surface---white-l6---20a: var(--primitives-neutral-white-20a); --semantic-icon-primary-on-surface---white-l7---16a: var(--primitives-neutral-white-16a); --semantic-icon-primary-opacity---black-l1---100: var(--primitives-neutral-gray-100); --semantic-icon-primary-opacity---black-l2---95a: var(--primitives-neutral-black-95a); --semantic-icon-primary-opacity---black-l3---75a: var(--primitives-neutral-black-75a); --semantic-icon-primary-opacity---black-l4---55a: var(--primitives-neutral-black-55a); --semantic-icon-primary-opacity---black-l5---30a: var(--primitives-neutral-black-30a); --semantic-icon-primary-opacity---black-l6---20a: var(--primitives-neutral-black-20a); --semantic-icon-primary-opacity---black-l7---15a: var(--primitives-neutral-black-15a); --semantic-icon-state-error: var(--primitives-brand-red); --semantic-icon-state-link-tip: var(--primitives-brand-blue); --semantic-overlay-black-fixed---l1---20a: var(--primitives-neutral-black-20a); --semantic-overlay-black-fixed---l2---12a: var(--primitives-neutral-black-12a); --semantic-overlay-black-fixed---l3---08a: var(--primitives-neutral-black-08a); --semantic-overlay-black-fixed---l4---04a: var(--primitives-neutral-black-04a); --semantic-overlay-white-fixed---l1---20a: var(--primitives-neutral-white-20a); --semantic-overlay-white-fixed---l2---12a: var(--primitives-neutral-white-16a); --semantic-overlay-white-fixed---l3---10a: var(--primitives-neutral-white-10a); --semantic-overlay-white-fixed---l4---05a: var(--primitives-neutral-white-05a); --semantic-surface-brand-fixed---brown: var(--primitives-brand-brand-brown); --semantic-surface-brand-fixed---gray-l1---87: var(--primitives-brand-brand-gray87); --semantic-surface-brand-fixed---gray-l2---72: var(--primitives-brand-brand-gray72); --semantic-surface-brand-fixed---gray-l3---56: var(--primitives-brand-brand-gray56); --semantic-surface-brand-fixed---gray-l4---38: var(--primitives-brand-brand-gray38); --semantic-surface-brand-fixed---gray-l5---23: var(--primitives-brand-brand-gray23); --semantic-surface-brand-fixed---gray-l6---13: var(--primitives-brand-brand-gray13); --semantic-surface-brand-fixed---gray-l7---08: var(--primitives-brand-brand-gray08); --semantic-surface-brand-fixed---gray-l8---04: var(--primitives-brand-brand-gray04); --semantic-surface-brand-fixed---gray-l9---02: var(--primitives-brand-brand-gray02); --semantic-surface-brand-fixed---green: var(--primitives-brand-brand-green); --semantic-surface-brand-fixed---light-green: var(--primitives-brand-brand-light-green); --semantic-surface-brand-fixed---purple: var(--primitives-brand-brand-purple); --semantic-surface-brand-fixed---theme-green: var(--primitives-brand-brand-theme-green); --semantic-surface-brand-gray---l1---13: var(--primitives-brand-brand-gray13); --semantic-surface-brand-gray---l2---13: var(--primitives-brand-brand-gray13); --semantic-surface-brand-gray---l3---04: var(--primitives-brand-brand-gray04); --semantic-surface-brand-gray---l4---02: var(--primitives-brand-brand-gray02); --semantic-surface-brand-gray---l5---02: var(--primitives-brand-brand-gray02); --semantic-surface-primary-fixed---l1---100: var(--primitives-neutral-gray-100); --semantic-surface-primary-fixed---l10---00: var(--primitives-neutral-gray-00); --semantic-surface-primary-fixed---l2---75: var(--primitives-neutral-gray-80); --semantic-surface-primary-fixed---l3---70: var(--primitives-neutral-gray-70); --semantic-surface-primary-fixed---l4---25: var(--primitives-neutral-gray-25); --semantic-surface-primary-fixed---l5---15: var(--primitives-neutral-gray-15); --semantic-surface-primary-fixed---l6---12: var(--primitives-neutral-gray-12); --semantic-surface-primary-fixed---l7---08: var(--primitives-neutral-gray-08); --semantic-surface-primary-fixed---l8---04: var(--primitives-neutral-gray-04); --semantic-surface-primary-fixed---l9---02: var(--primitives-neutral-gray-02); --semantic-surface-primary-gray---l1---100: var(--primitives-neutral-gray-100); --semantic-surface-primary-gray---l10---00: var(--primitives-neutral-gray-00); --semantic-surface-primary-gray---l2---80: var(--primitives-neutral-gray-80); --semantic-surface-primary-gray---l3---70: var(--primitives-neutral-gray-70); --semantic-surface-primary-gray---l4---25: var(--primitives-neutral-gray-25); --semantic-surface-primary-gray---l5---15: var(--primitives-neutral-gray-15); --semantic-surface-primary-gray---l6---12: var(--primitives-neutral-gray-12); --semantic-surface-primary-gray---l7---08: var(--primitives-neutral-gray-08); --semantic-surface-primary-gray---l8---04: var(--primitives-neutral-gray-04); --semantic-surface-primary-gray---l9---02: var(--primitives-neutral-gray-02); --semantic-surface-primary-opacity---black-l1---75a: var(--primitives-neutral-black-75a); --semantic-surface-primary-opacity---black-l10---02a: var(--primitives-neutral-black-02a); --semantic-surface-primary-opacity---black-l2---70a: var(--primitives-neutral-black-70a); --semantic-surface-primary-opacity---black-l3---55a: var(--primitives-neutral-black-55a); --semantic-surface-primary-opacity---black-l4---35a: var(--primitives-neutral-black-35a); --semantic-surface-primary-opacity---black-l5---25a: var(--primitives-neutral-black-25a); --semantic-surface-primary-opacity---black-l6---15a: var(--primitives-neutral-black-15a); --semantic-surface-primary-opacity---black-l7---12a: var(--primitives-neutral-black-12a); --semantic-surface-primary-opacity---black-l8---08a: var(--primitives-neutral-black-08a); --semantic-surface-primary-opacity---black-l9---04a: var(--primitives-neutral-black-04a); --semantic-surface-primary-opacity---white-l1---80a: var(--primitives-neutral-white-80a); --semantic-surface-primary-opacity---white-l10---05a: var(--primitives-neutral-white-05a); --semantic-surface-primary-opacity---white-l2---75a: var(--primitives-neutral-white-75a); --semantic-surface-primary-opacity---white-l3---65a: var(--primitives-neutral-white-65a); --semantic-surface-primary-opacity---white-l4---45a: var(--primitives-neutral-white-45a); --semantic-surface-primary-opacity---white-l5---30a: var(--primitives-neutral-white-30a); --semantic-surface-primary-opacity---white-l6---25a: var(--primitives-neutral-white-25a); --semantic-surface-primary-opacity---white-l7---20a: var(--primitives-neutral-white-20a); --semantic-surface-primary-opacity---white-l8---16a: var(--primitives-neutral-white-16a); --semantic-surface-primary-opacity---white-l9---10a: var(--primitives-neutral-white-10a); --semantic-surface-state-error: var(--primitives-brand-light-red); --semantic-surface-state-link-tip: var(--primitives-brand-light-blue); --semantic-surface-state-un-active---20: var(--primitives-neutral-gray-20); --semantic-text-primary-fixed---black-l1---100: var(--primitives-neutral-gray-100); --semantic-text-primary-fixed---black-l2---95a: var(--primitives-neutral-black-95a); --semantic-text-primary-fixed---black-l3---75a: var(--primitives-neutral-black-75a); --semantic-text-primary-fixed---black-l4---55a: var(--primitives-neutral-black-55a); --semantic-text-primary-fixed---black-l5---30a: var(--primitives-neutral-black-30a); --semantic-text-primary-fixed---black-l6---20a: var(--primitives-neutral-black-20a); --semantic-text-primary-fixed---black-l7---15a: var(--primitives-neutral-black-15a); --semantic-text-primary-fixed---white-l1---00: var(--primitives-neutral-gray-00); --semantic-text-primary-fixed---white-l2---98a: var(--primitives-neutral-white-98a); --semantic-text-primary-fixed---white-l3---75a: var(--primitives-neutral-white-75a); --semantic-text-primary-fixed---white-l4---50a: var(--primitives-neutral-white-50a); --semantic-text-primary-fixed---white-l5---30a: var(--primitives-neutral-white-30a); --semantic-text-primary-fixed---white-l6---20a: var(--primitives-neutral-white-20a); --semantic-text-primary-fixed---white-l7---16a: var(--primitives-neutral-white-16a); --semantic-text-primary-on-surface---white-l1---00: var(--primitives-neutral-gray-00); --semantic-text-primary-on-surface---white-l2---98a: var(--primitives-neutral-white-98a); --semantic-text-primary-on-surface---white-l3---75a: var(--primitives-neutral-white-75a); --semantic-text-primary-on-surface---white-l4---50a: var(--primitives-neutral-white-50a); --semantic-text-primary-on-surface---white-l5---30a: var(--primitives-neutral-white-30a); --semantic-text-primary-on-surface---white-l6---20a: var(--primitives-neutral-white-20a); --semantic-text-primary-on-surface---white-l7---16a: var(--primitives-neutral-white-16a); --semantic-text-primary-opacity---black-l1---100: var(--primitives-neutral-gray-100); --semantic-text-primary-opacity---black-l2---95a: var(--primitives-neutral-black-95a); --semantic-text-primary-opacity---black-l3---75a: var(--primitives-neutral-black-75a); --semantic-text-primary-opacity---black-l4---55a: var(--primitives-neutral-black-55a); --semantic-text-primary-opacity---black-l5---30a: var(--primitives-neutral-black-30a); --semantic-text-primary-opacity---black-l6---20a: var(--primitives-neutral-black-20a); --semantic-text-primary-opacity---black-l7---15a: var(--primitives-neutral-black-15a); --semantic-text-state-error: var(--primitives-brand-red); --semantic-text-state-link-tip: var(--primitives-brand-blue); } /* dark */ /* color */ #one-dom-container .bk { --component-button-bg-primary-black-default: var(--semantic-surface-primary-gray---l1---100); --component-button-bg-primary-black-disable: var(--semantic-surface-primary-fixed---l4---25); --component-button-bg-primary-black-overlay-hover: var(--primitives-neutral-black-15a); --component-button-bg-primary-brand-default: var(--semantic-surface-brand-fixed---green); --component-button-bg-primary-brand-disable: var(--semantic-surface-primary-fixed---l4---25); --component-button-bg-primary-brand-overlay-hover: var(--primitives-neutral-black-35a); --component-button-bg-primary-gray-default: var(--semantic-surface-primary-fixed---l7---08); --component-button-bg-primary-gray-disable: var(--semantic-surface-primary-fixed---l4---25); --component-button-bg-primary-gray-overlay-hover: var(--primitives-neutral-black-15a); --component-button-bg-primary-opa-high-default: var(--semantic-surface-primary-opacity---black-l5---25a); --component-button-bg-primary-opa-high-disable: var(--semantic-surface-primary-opacity---black-l8---08a); --component-button-bg-primary-opa-high-overlay-hover: var(--primitives-neutral-white-00a); --component-button-bg-primary-opa-low-default: var(--semantic-surface-primary-opacity---black-l8---08a); --component-button-bg-primary-opa-low-disable: var(--semantic-surface-primary-opacity---black-l10---02a); --component-button-bg-primary-opa-low-overlay-hover: var(--primitives-neutral-white-00a); --component-button-bg-secondary-black-default: var(--primitives-neutral-white-00a); --component-button-bg-secondary-black-disable: var(--primitives-neutral-white-00a); --component-button-bg-secondary-black-overlay-hover: var(--primitives-neutral-white-30a); --component-button-bg-secondary-gray-default: var(--primitives-neutral-white-00a); --component-button-bg-secondary-gray-disable: var(--primitives-neutral-white-00a); --component-button-bg-secondary-gray-overlay-hover: var(--primitives-neutral-white-30a); --component-button-border-secondary-black-default: var(--semantic-border-primary-black-l1---100); --component-button-border-secondary-black-disable: var(--semantic-border-primary-black-l2---50a); --component-button-border-secondary-black-hover: var(--semantic-border-primary-black-l1---100); --component-button-border-secondary-gray-default: var(--semantic-border-primary-black-l2---50a); --component-button-border-secondary-gray-disable: var(--semantic-border-primary-black-l2---50a); --component-button-border-secondary-gray-hover: var(--semantic-border-primary-black-l2---50a); --component-button-icon-primary-black-default: var(--semantic-text-primary-on-surface---white-l1---00); --component-button-icon-primary-black-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-icon-primary-black-hover: var(--semantic-text-primary-on-surface---white-l1---00); --component-button-icon-primary-brand-default: var(--semantic-text-primary-fixed---black-l1---100); --component-button-icon-primary-brand-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-icon-primary-brand-hover: var(--semantic-text-primary-fixed---black-l1---100); --component-button-icon-primary-gray-default: var(--semantic-text-primary-fixed---black-l1---100); --component-button-icon-primary-gray-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-icon-primary-gray-hover: var(--semantic-text-primary-fixed---black-l1---100); --component-button-icon-primary-opa-high-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-primary-opa-high-disable: var(--semantic-text-primary-opacity---black-l6---20a); --component-button-icon-primary-opa-high-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-primary-opa-low-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-primary-opa-low-disable: var(--semantic-text-primary-opacity---black-l5---30a); --component-button-icon-primary-opa-low-overlay-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-secondary-black-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-secondary-black-disable: var(--semantic-text-primary-opacity---black-l4---55a); --component-button-icon-secondary-black-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-secondary-gray-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-icon-secondary-gray-disable: var(--semantic-text-primary-opacity---black-l4---55a); --component-button-icon-secondary-gray-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-primary-black-default: var(--semantic-text-primary-on-surface---white-l1---00); --component-button-text-primary-black-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-text-primary-black-hover: var(--semantic-text-primary-on-surface---white-l1---00); --component-button-text-primary-brand-default: var(--semantic-text-primary-fixed---black-l1---100); --component-button-text-primary-brand-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-text-primary-brand-hover: var(--semantic-text-primary-fixed---black-l1---100); --component-button-text-primary-gray-default: var(--semantic-text-primary-fixed---black-l1---100); --component-button-text-primary-gray-disable: var(--semantic-text-primary-fixed---black-l5---30a); --component-button-text-primary-gray-hover: var(--semantic-text-primary-fixed---black-l1---100); --component-button-text-primary-opa-high-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-primary-opa-high-disable: var(--semantic-text-primary-opacity---black-l6---20a); --component-button-text-primary-opa-high-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-primary-opa-low-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-primary-opa-low-disable: var(--semantic-text-primary-opacity---black-l5---30a); --component-button-text-primary-opa-low-overlay-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-secondary-black-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-secondary-black-disable: var(--semantic-text-primary-opacity---black-l4---55a); --component-button-text-secondary-black-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-secondary-gray-default: var(--semantic-text-primary-opacity---black-l1---100); --component-button-text-secondary-gray-disable: var(--semantic-text-primary-opacity---black-l4---55a); --component-button-text-secondary-gray-hover: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-bg-primary-black-opa: var(--semantic-surface-primary-opacity---black-l9---04a); --component-card-info-bg-primary-black-opa-select: var(--semantic-surface-primary-opacity---black-l7---12a); --component-card-info-bg-primary-white: var(--semantic-surface-primary-gray---l9---02); --component-card-info-bg-primary-white-opa: var(--semantic-surface-primary-opacity---white-l4---45a); --component-card-info-bg-primary-white-opa-select: var(--semantic-surface-primary-gray---l10---00); --component-card-info-icon-primary-black-opa: var(--semantic-icon-primary-opacity---black-l1---100); --component-card-info-icon-primary-white: var(--semantic-icon-primary-opacity---black-l1---100); --component-card-info-icon-primary-white-opa: var(--semantic-icon-primary-opacity---black-l1---100); --component-card-info-icon-primary-white-opa-white-bg: var(--semantic-icon-primary-on-surface---white-l1---00); --component-card-info-text-primary-black-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-primary-black-opa-select-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-primary-black-opa-select-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-card-info-text-primary-white-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-primary-white-l2: var(--semantic-text-primary-opacity---black-l4---55a); --component-card-info-text-primary-white-opa: var(--semantic-text-primary-opacity---black-l4---55a); --component-card-info-text-primary-white-opa--select-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-primary-white-opa-select-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-card-info-text-primary-white-link: var(--semantic-text-state-link&tip); --component-card-info-text-secondary: var(--semantic-text-primary-opacity---black-l5---30a); --component-card-info-text-secondary-select-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-card-info-text-secondary-select-l2: var(--semantic-text-primary-opacity---black-l4---55a); --component-card-mark-bg-primary-black-opa: var(--semantic-surface-primary-opacity---black-l3---55a); --component-card-mark-bg-primary-gray-opa: var(--semantic-surface-primary-opacity---black-l8---08a); --component-card-mark-bg-primary-white: var(--semantic-surface-primary-gray---l10---00); --component-card-mark-border-secondary-black-opa: var(--semantic-border-primary-black-l2---50a); --component-card-mark-border-secondary-gray-opa: var(--primitives-neutral-white-10a); --component-card-mark-border-secondary-white: var(--semantic-border-primary-black-l1---100); --component-card-mark-divider-primary-gray-opa: var(--primitives-neutral-white-10a); --component-card-mark-icon-primary-black-opa: var(--semantic-text-primary-on-surface---white-l1---00); --component-card-mark-icon-primary-gray-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-icon-primary-white: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-icon-secondary-black-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-icon-secondary-gray-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-icon-secondary-white: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-primary-black-opa: var(--semantic-text-primary-on-surface---white-l1---00); --component-card-mark-text-primary-gray-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-primary-white: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-secondary-black-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-secondary-gray-opa: var(--semantic-text-primary-opacity---black-l1---100); --component-card-mark-text-secondary-white: var(--semantic-text-primary-opacity---black-l1---100); --component-card-tab-bar-bg-primary: var(--semantic-surface-primary-opacity---black-l9---04a); --component-card-tab-bar-bg-primary-select: var(--semantic-surface-primary-fixed---l10---00); --component-card-tab-bar-divider-primary: var(--primitives-neutral-white-05a); --component-card-tab-bar-text-primary: var(--semantic-surface-primary-gray---l1---100); --component-card-tab-bar-text-primary-select: var(--semantic-surface-primary-fixed---l1---100); --component-card-tab-bar-text-secondary: var(--semantic-surface-primary-opacity---black-l4---35a); --component-card-tab-bar-text-secondary-select: var(--semantic-surface-primary-gray---l1---100); --component-text-body-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-body-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-text-body-l3: var(--semantic-text-primary-opacity---black-l4---55a); --component-text-data-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-headine-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-remark-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-remark-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-text-remark-l2-2: var(--semantic-text-primary-opacity---black-l3---75a); --component-text-remark-l3: var(--semantic-text-primary-opacity---black-l4---55a); --component-text-remark-l3-2: var(--semantic-text-primary-opacity---black-l4---55a); --component-text-subtitle-l1: var(--semantic-text-primary-opacity---black-l1---100); --component-text-subtitle-l2: var(--semantic-text-primary-opacity---black-l3---75a); --component-text-subtitle-l3: var(--semantic-text-primary-opacity---black-l4---55a); --primitives-brand-blue: #2660f5; --primitives-brand-brand-brown: #a07e6d; --primitives-brand-brand-gray02: #fafafa; --primitives-brand-brand-gray04: #f5f4f0; --primitives-brand-brand-gray08: #ebe8e3; --primitives-brand-brand-gray13: #ddd9d4; --primitives-brand-brand-gray23: #c3bfb9; --primitives-brand-brand-gray38: #9e9a94; --primitives-brand-brand-gray56: #706c66; --primitives-brand-brand-gray72: #484540; --primitives-brand-brand-gray87: #201f1c; --primitives-brand-brand-green: #2cff73; --primitives-brand-brand-light-green: #d7ffdb; --primitives-brand-brand-purple: #b995ff; --primitives-brand-brand-theme-green: #26c05d; --primitives-brand-light-blue: #e8f3ff; --primitives-brand-light-red: #fdefed; --primitives-brand-red: #e23220; --primitives-neutral-black-00a: #00000000; --primitives-neutral-black-02a: #00000005; --primitives-neutral-black-04a: #0000000a; --primitives-neutral-black-08a: #00000014; --primitives-neutral-black-10a: #0000001a; --primitives-neutral-black-12a: #0000001f; --primitives-neutral-black-15a: #00000026; --primitives-neutral-black-20a: #00000033; --primitives-neutral-black-25a: #00000040; --primitives-neutral-black-30a: #0000004d; --primitives-neutral-black-35a: #00000059; --primitives-neutral-black-50a: #00000080; --primitives-neutral-black-55a: #0000008c; --primitives-neutral-black-60a: #00000099; --primitives-neutral-black-70a: #000000b2; --primitives-neutral-black-75a: #000000bf; --primitives-neutral-black-80a: #000000cc; --primitives-neutral-black-84a: #000000d6; --primitives-neutral-black-90a: #000000e5; --primitives-neutral-black-95a: #000000f2; --primitives-neutral-gray-00: #ffffff; --primitives-neutral-gray-02: #fafafa; --primitives-neutral-gray-04: #f6f6f6; --primitives-neutral-gray-08: #ebebeb; --primitives-neutral-gray-10: #e6e6e6; --primitives-neutral-gray-100: #000000; --primitives-neutral-gray-12: #e0e0e0; --primitives-neutral-gray-15: #d9d9d9; --primitives-neutral-gray-20: #cccccc; --primitives-neutral-gray-25: #bfbfbf; --primitives-neutral-gray-30: #b3b3b3; --primitives-neutral-gray-35: #a6a6a6; --primitives-neutral-gray-50: #808080; --primitives-neutral-gray-55: #737373; --primitives-neutral-gray-60: #666666; --primitives-neutral-gray-70: #4d4d4d; --primitives-neutral-gray-75: #404040; --primitives-neutral-gray-80: #333333; --primitives-neutral-gray-84: #282828; --primitives-neutral-gray-90: #1a1a1a; --primitives-neutral-gray-95: #0d0d0d; --primitives-neutral-white-00a: #ffffff00; --primitives-neutral-white-05a: #ffffff0d; --primitives-neutral-white-10a: #ffffff1a; --primitives-neutral-white-16a: #ffffff29; --primitives-neutral-white-20a: #ffffff33; --primitives-neutral-white-25a: #ffffff40; --primitives-neutral-white-30a: #ffffff4d; --primitives-neutral-white-40a: #ffffff66; --primitives-neutral-white-45a: #ffffff73; --primitives-neutral-white-50a: #ffffff80; --primitives-neutral-white-65a: #ffffffa6; --primitives-neutral-white-70a: #ffffffb2; --primitives-neutral-white-75a: #ffffffbf; --primitives-neutral-white-80a: #ffffffcc; --primitives-neutral-white-85a: #ffffffd9; --primitives-neutral-white-88a: #ffffffe0; --primitives-neutral-white-90a: #ffffffe5; --primitives-neutral-white-92a: #ffffffeb; --primitives-neutral-white-96a: #fffffff5; --primitives-neutral-white-98a: #fffffffa; --semantic-background-primary-cold-gray--04: var(--primitives-neutral-gray-90); --semantic-background-primary-warm-gray---07: var(--primitives-neutral-gray-90); --semantic-background-primary-gray---l1---00: var(--primitives-neutral-gray-100); --semantic-background-primary-gray---l2--02: var(--primitives-neutral-gray-95); --semantic-background-primary-gray---l3---04: var(--primitives-neutral-gray-90); --semantic-background-primary-gray---l4---15: var(--primitives-neutral-gray-84); --semantic-border-primary-black-l1---100: var(--primitives-neutral-gray-00); --semantic-border-primary-black-l2---50a: var(--primitives-neutral-white-50a); --semantic-border-primary-black-l3---20a: var(--primitives-neutral-white-30a); --semantic-border-primary-black-l4---15a: var(--primitives-neutral-white-25a); --semantic-divider-primary-gray---l1---15: var(--primitives-neutral-gray-84); --semantic-divider-primary-gray---l2---04: var(--primitives-neutral-gray-95); --semantic-icon-miscellaneous-border-button---30a: var(--primitives-neutral-white-50a); --semantic-icon-primary-fixed---black-l1---100: var(--primitives-neutral-gray-100); --semantic-icon-primary-fixed---black-l2---95a: var(--primitives-neutral-black-95a); --semantic-icon-primary-fixed---black-l3---75a: var(--primitives-neutral-black-75a); --semantic-icon-primary-fixed---black-l4---55a: var(--primitives-neutral-black-55a); --semantic-icon-primary-fixed---black-l5---30a: var(--primitives-neutral-black-30a); --semantic-icon-primary-fixed---black-l6---20a: var(--primitives-neutral-black-20a); --semantic-icon-primary-fixed---black-l7---15a: var(--primitives-neutral-black-15a); --semantic-icon-primary-fixed---white-l1---00: var(--primitives-neutral-gray-00); --semantic-icon-primary-fixed---white-l2---98a: var(--primitives-neutral-white-98a); --semantic-icon-primary-fixed---white-l3---75a: var(--primitives-neutral-white-75a); --semantic-icon-primary-fixed---white-l4---50a: var(--primitives-neutral-white-50a); --semantic-icon-primary-fixed---white-l5---30a: var(--primitives-neutral-white-30a); --semantic-icon-primary-fixed---white-l6---20a: var(--primitives-neutral-white-20a); --semantic-icon-primary-fixed---white-l7---16a: var(--primitives-neutral-white-16a); --semantic-icon-primary-on-surface---white-l1---00: var(--primitives-neutral-gray-100); --semantic-icon-primary-on-surface---white-l2---98a: var(--primitives-neutral-black-95a); --semantic-icon-primary-on-surface---white-l3---75a: var(--primitives-neutral-black-75a); --semantic-icon-primary-on-surface---white-l4---50a: var(--primitives-neutral-black-55a); --semantic-icon-primary-on-surface---white-l5---30a: var(--primitives-neutral-black-30a); --semantic-icon-primary-on-surface---white-l6---20a: var(--primitives-neutral-black-20a); --semantic-icon-primary-on-surface---white-l7---16a: var(--primitives-neutral-black-15a); --semantic-icon-primary-opacity---black-l1---100: var(--primitives-neutral-gray-00); --semantic-icon-primary-opacity---black-l2---95a: var(--primitives-neutral-white-98a); --semantic-icon-primary-opacity---black-l3---75a: var(--primitives-neutral-white-75a); --semantic-icon-primary-opacity---black-l4---55a: var(--primitives-neutral-white-50a); --semantic-icon-primary-opacity---black-l5---30a: var(--primitives-neutral-white-30a); --semantic-icon-primary-opacity---black-l6---20a: var(--primitives-neutral-white-20a); --semantic-icon-primary-opacity---black-l7---15a: var(--primitives-neutral-white-16a); --semantic-icon-state-error: var(--primitives-brand-red); --semantic-icon-state-link-tip: var(--primitives-brand-blue); --semantic-overlay-black-fixed---l1---20a: var(--primitives-neutral-black-20a); --semantic-overlay-black-fixed---l2---12a: var(--primitives-neutral-black-12a); --semantic-overlay-black-fixed---l3---08a: var(--primitives-neutral-black-08a); --semantic-overlay-black-fixed---l4---04a: var(--primitives-neutral-black-04a); --semantic-overlay-white-fixed---l1---20a: var(--primitives-neutral-white-20a); --semantic-overlay-white-fixed---l2---12a: var(--primitives-neutral-white-16a); --semantic-overlay-white-fixed---l3---10a: var(--primitives-neutral-white-10a); --semantic-overlay-white-fixed---l4---05a: var(--primitives-neutral-white-05a); --semantic-surface-brand-fixed---brown: var(--primitives-brand-brand-brown); --semantic-surface-brand-fixed---gray-l1---87: var(--primitives-brand-brand-gray87); --semantic-surface-brand-fixed---gray-l2---72: var(--primitives-brand-brand-gray72); --semantic-surface-brand-fixed---gray-l3---56: var(--primitives-brand-brand-gray56); --semantic-surface-brand-fixed---gray-l4---38: var(--primitives-brand-brand-gray38); --semantic-surface-brand-fixed---gray-l5---23: var(--primitives-brand-brand-gray23); --semantic-surface-brand-fixed---gray-l6---13: var(--primitives-brand-brand-gray13); --semantic-surface-brand-fixed---gray-l7---08: var(--primitives-brand-brand-gray08); --semantic-surface-brand-fixed---gray-l8---04: var(--primitives-brand-brand-gray04); --semantic-surface-brand-fixed---gray-l9---02: var(--primitives-brand-brand-gray02); --semantic-surface-brand-fixed---green: var(--primitives-brand-brand-green); --semantic-surface-brand-fixed---light-green: var(--primitives-brand-brand-light-green); --semantic-surface-brand-fixed---purple: var(--primitives-brand-brand-purple); --semantic-surface-brand-fixed---theme-green: var(--primitives-brand-brand-theme-green); --semantic-surface-brand-gray---l1---13: var(--primitives-neutral-gray-100); --semantic-surface-brand-gray---l2---13: var(--primitives-brand-brand-gray87); --semantic-surface-brand-gray---l3---04: var(--primitives-brand-brand-gray87); --semantic-surface-brand-gray---l4---02: var(--primitives-brand-brand-gray87); --semantic-surface-brand-gray---l5---02: var(--primitives-brand-brand-gray72); --semantic-surface-primary-fixed---l1---100: var(--primitives-neutral-gray-100); --semantic-surface-primary-fixed---l10---00: var(--primitives-neutral-gray-00); --semantic-surface-primary-fixed---l2---75: var(--primitives-neutral-gray-80); --semantic-surface-primary-fixed---l3---70: var(--primitives-neutral-gray-70); --semantic-surface-primary-fixed---l4---25: var(--primitives-neutral-gray-25); --semantic-surface-primary-fixed---l5---15: var(--primitives-neutral-gray-15); --semantic-surface-primary-fixed---l6---12: var(--primitives-neutral-gray-12); --semantic-surface-primary-fixed---l7---08: var(--primitives-neutral-gray-08); --semantic-surface-primary-fixed---l8---04: var(--primitives-neutral-gray-04); --semantic-surface-primary-fixed---l9---02: var(--primitives-neutral-gray-02); --semantic-surface-primary-gray---l1---100: var(--primitives-neutral-gray-00); --semantic-surface-primary-gray---l10---00: var(--primitives-neutral-gray-100); --semantic-surface-primary-gray---l2---80: var(--primitives-neutral-gray-15); --semantic-surface-primary-gray---l3---70: var(--primitives-neutral-gray-25); --semantic-surface-primary-gray---l4---25: var(--primitives-neutral-gray-70); --semantic-surface-primary-gray---l5---15: var(--primitives-neutral-gray-75); --semantic-surface-primary-gray---l6---12: var(--primitives-neutral-gray-80); --semantic-surface-primary-gray---l7---08: var(--primitives-neutral-gray-84); --semantic-surface-primary-gray---l8---04: var(--primitives-neutral-gray-90); --semantic-surface-primary-gray---l9---02: var(--primitives-neutral-gray-95); --semantic-surface-primary-opacity---black-l1---75a: var(--primitives-neutral-white-80a); --semantic-surface-primary-opacity---black-l10---02a: var(--primitives-neutral-white-05a); --semantic-surface-primary-opacity---black-l2---70a: var(--primitives-neutral-white-75a); --semantic-surface-primary-opacity---black-l3---55a: var(--primitives-neutral-white-65a); --semantic-surface-primary-opacity---black-l4---35a: var(--primitives-neutral-white-45a); --semantic-surface-primary-opacity---black-l5---25a: var(--primitives-neutral-white-30a); --semantic-surface-primary-opacity---black-l6---15a: var(--primitives-neutral-white-25a); --semantic-surface-primary-opacity---black-l7---12a: var(--primitives-neutral-white-20a); --semantic-surface-primary-opacity---black-l8---08a: var(--primitives-neutral-white-16a); --semantic-surface-primary-opacity---black-l9---04a: var(--primitives-neutral-white-10a); --semantic-surface-primary-opacity---white-l1---80a: var(--primitives-neutral-black-75a); --semantic-surface-primary-opacity---white-l10---05a: var(--primitives-neutral-black-02a); --semantic-surface-primary-opacity---white-l2---75a: var(--primitives-neutral-black-70a); --semantic-surface-primary-opacity---white-l3---65a: var(--primitives-neutral-black-55a); --semantic-surface-primary-opacity---white-l4---45a: var(--primitives-neutral-black-35a); --semantic-surface-primary-opacity---white-l5---30a: var(--primitives-neutral-black-08a); --semantic-surface-primary-opacity---white-l6---25a: var(--primitives-neutral-black-25a); --semantic-surface-primary-opacity---white-l7---20a: var(--primitives-neutral-black-15a); --semantic-surface-primary-opacity---white-l8---16a: var(--primitives-neutral-black-12a); --semantic-surface-primary-opacity---white-l9---10a: var(--primitives-neutral-black-04a); --semantic-surface-state-error: var(--primitives-brand-light-red); --semantic-surface-state-link-tip: var(--primitives-brand-light-blue); --semantic-surface-state-un-active---20: var(--primitives-neutral-gray-20); --semantic-text-primary-fixed---black-l1---100: var(--primitives-neutral-gray-100); --semantic-text-primary-fixed---black-l2---95a: var(--primitives-neutral-black-95a); --semantic-text-primary-fixed---black-l3---75a: var(--primitives-neutral-black-75a); --semantic-text-primary-fixed---black-l4---55a: var(--primitives-neutral-black-55a); --semantic-text-primary-fixed---black-l5---30a: var(--primitives-neutral-black-30a); --semantic-text-primary-fixed---black-l6---20a: var(--primitives-neutral-black-20a); --semantic-text-primary-fixed---black-l7---15a: var(--primitives-neutral-black-15a); --semantic-text-primary-fixed---white-l1---00: var(--primitives-neutral-gray-00); --semantic-text-primary-fixed---white-l2---98a: var(--primitives-neutral-white-98a); --semantic-text-primary-fixed---white-l3---75a: var(--primitives-neutral-white-75a); --semantic-text-primary-fixed---white-l4---50a: var(--primitives-neutral-white-50a); --semantic-text-primary-fixed---white-l5---30a: var(--primitives-neutral-white-30a); --semantic-text-primary-fixed---white-l6---20a: var(--primitives-neutral-white-20a); --semantic-text-primary-fixed---white-l7---16a: var(--primitives-neutral-white-16a); --semantic-text-primary-on-surface---white-l1---00: var(--primitives-neutral-gray-100); --semantic-text-primary-on-surface---white-l2---98a: var(--primitives-neutral-black-95a); --semantic-text-primary-on-surface---white-l3---75a: var(--primitives-neutral-black-75a); --semantic-text-primary-on-surface---white-l4---50a: var(--primitives-neutral-black-55a); --semantic-text-primary-on-surface---white-l5---30a: var(--primitives-neutral-black-30a); --semantic-text-primary-on-surface---white-l6---20a: var(--primitives-neutral-black-20a); --semantic-text-primary-on-surface---white-l7---16a: var(--primitives-neutral-black-15a); --semantic-text-primary-opacity---black-l1---100: var(--primitives-neutral-gray-00); --semantic-text-primary-opacity---black-l2---95a: var(--primitives-neutral-white-98a); --semantic-text-primary-opacity---black-l3---75a: var(--primitives-neutral-white-75a); --semantic-text-primary-opacity---black-l4---55a: var(--primitives-neutral-white-50a); --semantic-text-primary-opacity---black-l5---30a: var(--primitives-neutral-white-30a); --semantic-text-primary-opacity---black-l6---20a: var(--primitives-neutral-white-20a); --semantic-text-primary-opacity---black-l7---15a: var(--primitives-neutral-white-16a); --semantic-text-state-error: var(--primitives-brand-red); --semantic-text-state-link-tip: var(--primitives-brand-blue); }