:root { --text-regular-normal-font-family: "Roboto", Helvetica; --text-regular-normal-font-weight: 400; --text-regular-normal-font-size: 16px; --text-regular-normal-letter-spacing: 0px; --text-regular-normal-line-height: 150%; --text-regular-normal-font-style: normal; --text-regular-semi-bold-font-family: "Roboto", Helvetica; --text-regular-semi-bold-font-weight: 600; --text-regular-semi-bold-font-size: 16px; --text-regular-semi-bold-letter-spacing: 0px; --text-regular-semi-bold-line-height: 150%; --text-regular-semi-bold-font-style: normal; --text-small-normal-font-family: "Roboto", Helvetica; --text-small-normal-font-weight: 400; --text-small-normal-font-size: 14px; --text-small-normal-letter-spacing: 0px; --text-small-normal-line-height: 150%; --text-small-normal-font-style: normal; --text-small-link-font-family: "Roboto", Helvetica; --text-small-link-font-weight: 400; --text-small-link-font-size: 14px; --text-small-link-letter-spacing: 0px; --text-small-link-line-height: 150%; --text-small-link-font-style: normal; --heading-desktop-h2-font-family: "Roboto", Helvetica; --heading-desktop-h2-font-weight: 700; --heading-desktop-h2-font-size: 48px; --heading-desktop-h2-letter-spacing: 0px; --heading-desktop-h2-line-height: 120.00000476837158%; --heading-desktop-h2-font-style: normal; --text-medium-normal-font-family: "Roboto", Helvetica; --text-medium-normal-font-weight: 400; --text-medium-normal-font-size: 18px; --text-medium-normal-letter-spacing: 0px; --text-medium-normal-line-height: 150%; --text-medium-normal-font-style: normal; --heading-desktop-h4-font-family: "Roboto", Helvetica; --heading-desktop-h4-font-weight: 700; --heading-desktop-h4-font-size: 32px; --heading-desktop-h4-letter-spacing: 0px; --heading-desktop-h4-line-height: 129.99999523162842%; --heading-desktop-h4-font-style: normal; --text-tiny-normal-font-family: "Roboto", Helvetica; --text-tiny-normal-font-weight: 400; --text-tiny-normal-font-size: 12px; --text-tiny-normal-letter-spacing: 0px; --text-tiny-normal-line-height: 150%; --text-tiny-normal-font-style: normal; --text-tiny-link-font-family: "Roboto", Helvetica; --text-tiny-link-font-weight: 400; --text-tiny-link-font-size: 12px; --text-tiny-link-letter-spacing: 0px; --text-tiny-link-line-height: 150%; --text-tiny-link-font-style: normal; --color-schemes-color-scheme-1-text: var(--primitives-color-neutral-darkest); --color-schemes-color-scheme-1-background: var(--primitives-color-white); --system-colors-miscellaneous-floating-tab-pill-fill: rgba(255, 255, 255, 1); --primitives-color-white: rgba(255, 255, 255, 1); --primitives-color-neutral-darkest: rgba(0, 0, 0, 1); } /* To enable a theme in your HTML, simply add one of the following data attributes to an HTML element, like so: You can apply the theme on any DOM node, not just the `body` */ [data-system-colors-mode="light"] { --system-colors-miscellaneous-floating-tab-pill-fill: rgba(255, 255, 255, 1); } [data-system-colors-mode="dark"] { --system-colors-miscellaneous-floating-tab-pill-fill: rgba( 255, 255, 255, 0.07 ); } [data-system-colors-mode="dark-elevated"] { --system-colors-miscellaneous-floating-tab-pill-fill: rgba( 255, 255, 255, 0.07 ); } [data-system-colors-mode="IC-light"] { --system-colors-miscellaneous-floating-tab-pill-fill: rgba(255, 255, 255, 1); } [data-system-colors-mode="IC-dark"] { --system-colors-miscellaneous-floating-tab-pill-fill: rgba( 255, 255, 255, 0.22 ); } [data-system-colors-mode="IC-dark-elevated"] { --system-colors-miscellaneous-floating-tab-pill-fill: rgba( 255, 255, 255, 0.22 ); }