/* ZBiotics subscription portal, replica styles. Generated from the live page (zbiotics.com/a/account, captured 2026-10-06): only the rules that touch the portal, in the live cascade order. Regenerate rather than hand-edit; hand-written fixes live in demo.css. */ @font-face { font-family: "Suisse Int'l"; src: url("../fonts/SuisseIntl-Regular-WebM.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: block; } @font-face { font-family: "Suisse Int'l"; src: url("../fonts/SuisseIntl-Medium-WebM.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: block; } /* ---- accelerated-checkout-backwards-compat.css ---- */ @keyframes shopify-rotator { 0% { transform: rotate(0deg); } 100% { transform: rotate(270deg); } } @keyframes shopify-dash { 0% { stroke-dashoffset: 280px; } 50% { stroke-dashoffset: 75px; transform: rotate(135deg); } 100% { stroke-dashoffset: 280px; transform: rotate(450deg); } } @keyframes acceleratedCheckoutLoadingSkeleton { 50% { opacity: var(--shopify-accelerated-checkout-skeleton-animation-opacity-start,1); } 75% { opacity: var(--shopify-accelerated-checkout-skeleton-animation-opacity-end,.5); } 100% { opacity: var(--shopify-accelerated-checkout-skeleton-animation-opacity-start,1); } } /* ---- inline ---- */ :root, .color-scheme-1 { --color-background: 255,255,255; --gradient-background: #ffffff; --color-foreground: 18,18,18; --color-background-contrast: 191,191,191; --color-shadow: 18,18,18; --color-button: 18,18,18; --color-button-text: 255,255,255; --color-secondary-button: 255,255,255; --color-secondary-button-text: 18,18,18; --color-link: 18,18,18; --color-badge-foreground: 18,18,18; --color-badge-background: 255,255,255; --color-badge-border: 18,18,18; --payment-terms-background-color: rgb(255 255 255); } body, .color-scheme-1, .color-scheme-2, .color-scheme-3, .color-scheme-4, .color-scheme-5, .color-primary, .color-secondary { color: rgba(var(--color-foreground), 0.75); background-color: rgb(var(--color-background)); } :root { --font-body-family: Assistant, sans-serif; --font-body-style: normal; --font-body-weight: 400; --font-body-weight-bold: 700; --font-heading-family: Assistant, sans-serif; --font-heading-style: normal; --font-heading-weight: 400; --font-body-scale: 1.0; --font-heading-scale: 1.0; --media-padding: px; --media-border-opacity: 0.05; --media-border-width: 1px; --media-radius: 0px; --media-shadow-opacity: 0.0; --media-shadow-horizontal-offset: 0px; --media-shadow-vertical-offset: 4px; --media-shadow-blur-radius: 5px; --media-shadow-visible: 0; --page-width: 120rem; --page-width-margin: 0rem; --product-card-image-padding: 0.0rem; --product-card-corner-radius: 0.0rem; --product-card-text-alignment: left; --product-card-border-width: 0.0rem; --product-card-border-opacity: 0.1; --product-card-shadow-opacity: 0.0; --product-card-shadow-visible: 0; --product-card-shadow-horizontal-offset: 0.0rem; --product-card-shadow-vertical-offset: 0.4rem; --product-card-shadow-blur-radius: 0.5rem; --collection-card-image-padding: 0.0rem; --collection-card-corner-radius: 0.0rem; --collection-card-text-alignment: left; --collection-card-border-width: 0.0rem; --collection-card-border-opacity: 0.1; --collection-card-shadow-opacity: 0.0; --collection-card-shadow-visible: 0; --collection-card-shadow-horizontal-offset: 0.0rem; --collection-card-shadow-vertical-offset: 0.4rem; --collection-card-shadow-blur-radius: 0.5rem; --blog-card-image-padding: 0.0rem; --blog-card-corner-radius: 0.0rem; --blog-card-text-alignment: left; --blog-card-border-width: 0.0rem; --blog-card-border-opacity: 0.1; --blog-card-shadow-opacity: 0.0; --blog-card-shadow-visible: 0; --blog-card-shadow-horizontal-offset: 0.0rem; --blog-card-shadow-vertical-offset: 0.4rem; --blog-card-shadow-blur-radius: 0.5rem; --badge-corner-radius: 4.0rem; --popup-border-width: 1px; --popup-border-opacity: 0.1; --popup-corner-radius: 0px; --popup-shadow-opacity: 0.05; --popup-shadow-horizontal-offset: 0px; --popup-shadow-vertical-offset: 4px; --popup-shadow-blur-radius: 5px; --drawer-border-width: 1px; --drawer-border-opacity: 0.1; --drawer-shadow-opacity: 0.0; --drawer-shadow-horizontal-offset: 0px; --drawer-shadow-vertical-offset: 4px; --drawer-shadow-blur-radius: 5px; --spacing-sections-desktop: 0px; --spacing-sections-mobile: 0px; --grid-desktop-vertical-spacing: 8px; --grid-desktop-horizontal-spacing: 8px; --grid-mobile-vertical-spacing: 4px; --grid-mobile-horizontal-spacing: 4px; --text-boxes-border-opacity: 0.1; --text-boxes-border-width: 0px; --text-boxes-radius: 0px; --text-boxes-shadow-opacity: 0.0; --text-boxes-shadow-visible: 0; --text-boxes-shadow-horizontal-offset: 0px; --text-boxes-shadow-vertical-offset: 4px; --text-boxes-shadow-blur-radius: 5px; --buttons-radius: 0px; --buttons-radius-outset: 0px; --buttons-border-width: 1px; --buttons-border-opacity: 1.0; --buttons-shadow-opacity: 0.0; --buttons-shadow-visible: 0; --buttons-shadow-horizontal-offset: 0px; --buttons-shadow-vertical-offset: 4px; --buttons-shadow-blur-radius: 5px; --buttons-border-offset: 0px; --inputs-radius: 0px; --inputs-border-width: 1px; --inputs-border-opacity: 0.55; --inputs-shadow-opacity: 0.0; --inputs-shadow-horizontal-offset: 0px; --inputs-margin-offset: 0px; --inputs-shadow-vertical-offset: 4px; --inputs-shadow-blur-radius: 5px; --inputs-radius-outset: 0px; --variant-pills-radius: 40px; --variant-pills-border-width: 1px; --variant-pills-border-opacity: 0.55; --variant-pills-shadow-opacity: 0.0; --variant-pills-shadow-horizontal-offset: 0px; --variant-pills-shadow-vertical-offset: 4px; --variant-pills-shadow-blur-radius: 5px; } *, ::before, ::after { box-sizing: inherit; } html { box-sizing: border-box; font-size: calc(var(--font-body-scale) * 62.5%); height: 100%; } body { display: grid; grid-template-rows: auto auto 1fr auto; grid-template-columns: 100%; min-height: 100%; margin: 0px; font-size: 1.5rem; letter-spacing: 0.06rem; line-height: calc(1 + 0.8 / var(--font-body-scale)); font-family: var(--font-body-family); font-style: var(--font-body-style); font-weight: var(--font-body-weight); } @media screen and (min-width: 750px) { body { font-size: 1.6rem; } } a { color: inherit; text-decoration: none; } /* ---- base.min.css ---- */ :root { --alpha-button-background: 1; --alpha-button-border: 1; --alpha-link: 0.85; --alpha-badge-border: 0.1; } .hidden { display: none !important; } .overflow-hidden { overflow: hidden; } ::selection { background-color: rgba(var(--color-foreground), 0.2); } .uppercase { text-transform: uppercase; } a:empty, ul:empty, dl:empty, div:empty, section:empty, article:empty, p:empty, h1:empty, h2:empty, h3:empty, h4:empty, h5:empty, h6:empty { display: none; } :root { --duration-short: 100ms; --duration-default: 200ms; --duration-announcement-bar: 250ms; --duration-medium: 300ms; --duration-long: 500ms; --duration-extra-long: 600ms; --duration-extra-longer: 750ms; --duration-extended: 3s; --ease-out-slow: cubic-bezier(0, 0, 0.3, 1); --transition-ease: cubic-bezier(0.25, 0.1, 0, 1); --animation-slide-in: slideIn var(--duration-extra-long) var(--ease-out-slow) forwards; --animation-fade-in: fadeIn var(--duration-extra-long) var(--ease-out-slow); } :focus { outline: 0px; box-shadow: none; } :focus-visible { outline: .2rem solid var(--bs-stone-900) !important; outline-offset: 0.3rem !important; } .focus-none { box-shadow: none !important; outline: 0px !important; } .grid { display: flex; flex-wrap: wrap; margin-bottom: 2rem; padding: 0px; list-style: none; column-gap: var(--grid-mobile-horizontal-spacing); row-gap: var(--grid-mobile-vertical-spacing); } @media screen and (min-width: 750px) { .grid { column-gap: var(--grid-desktop-horizontal-spacing); row-gap: var(--grid-desktop-vertical-spacing); } } .grid:last-child { margin-bottom: 0px; } .button:focus:not(:focus-visible):not(.focused), .shopify-payment-button__button--unbranded:focus:not(:focus-visible):not(.focused), .shopify-payment-button [role="button"]:focus:not(:focus-visible):not(.focused) { box-shadow: inherit; } .field:not(:focus-visible):not(.focused) + .share-button__copy:not(:focus-visible):not(.focused), .field:not(:focus-visible):not(.focused) + .share-button__close:not(:focus-visible):not(.focused) { background-color: inherit; } .share-button__message:not(:empty) { display: flex; align-items: center; width: 100%; height: 100%; padding: 0.8rem 0px 0.8rem 1.5rem; margin: var(--inputs-border-width); } .share-button__message:not(:empty):not(.hidden) ~ * { display: none; } .field__input:focus ~ .field__label, .field__input:not(:placeholder-shown) ~ .field__label, .field__input:-webkit-autofill ~ .field__label, .customer .field input:focus ~ label, .customer .field input:not(:placeholder-shown) ~ label, .customer .field input:-webkit-autofill ~ label { font-size: 1rem; top: calc(var(--inputs-border-width) + .5rem); left: calc(var(--inputs-border-width) + 2rem); letter-spacing: 0.04rem; } .field__input:focus, .field__input:not(:placeholder-shown), .field__input:-webkit-autofill, .customer .field input:focus, .customer .field input:not(:placeholder-shown), .customer .field input:-webkit-autofill { padding: 2.2rem 1.5rem 0.8rem 2rem; margin: var(--inputs-border-width); } @keyframes translateAnnouncementSlideIn { 0% { opacity: 0; transform: translateX(var(--announcement-translate-from)); } 100% { opacity: 1; transform: translateX(0px); } } @keyframes translateAnnouncementSlideOut { 0% { opacity: 1; transform: translateX(0px); } 100% { opacity: 0; transform: translateX(var(--announcement-translate-to)); } } @keyframes animateMenuOpen { 0% { opacity: 0; transform: translateY(-1.5rem); } 100% { opacity: 1; transform: translateY(0px); } } @supports not (inset: 10px) { .grid { margin-left: calc(-1*var(--grid-mobile-horizontal-spacing)); } @media screen and (min-width: 750px) { .grid { margin-left: calc(-1*var(--grid-desktop-horizontal-spacing)); } } } @media (prefers-reduced-motion: no-preference) { @keyframes animateAmbient { 0% { transform: rotate(0deg) translateX(1em) rotate(0deg) scale(1.2); } 100% { transform: rotate(360deg) translateX(1em) rotate(-360deg) scale(1.2); } } @keyframes slideIn { 0% { transform: translateY(2rem); opacity: 0.01; } 100% { transform: translateY(0px); opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0.01; } 100% { opacity: 1; } } } @media (prefers-reduced-motion: no-preference) and (hover: hover) { :root { --easter-egg: none; } } @keyframes rotator { 0% { transform: rotate(0deg); } 100% { transform: rotate(270deg); } } @keyframes dash { 0% { stroke-dashoffset: 280; } 50% { stroke-dashoffset: 75; transform: rotate(135deg); } 100% { stroke-dashoffset: 280; transform: rotate(450deg); } } @keyframes indeterminateAnimation { 0% { transform: translateX(-20%) scaleX(0); } 40% { transform: translateX(30%) scaleX(0.7); } 100% { transform: translateX(100%) scaleX(0); } } #skio-root form, #skio-portal form { margin-bottom: 1.2rem; } #skio-root .font-semibold, #skio-portal .font-semibold { font-weight: 500 !important; } #skio-root [data-skio-name="subscription-details-full-width-banner-container"], #skio-portal [data-skio-name="subscription-details-full-width-banner-container"] { order: -1 !important; margin-bottom: 5.4rem; } #skio-root [data-skio-name="subscription-details-full-width-banner-container"] > div, #skio-portal [data-skio-name="subscription-details-full-width-banner-container"] > div { padding: 0px !important; } #skio-root [data-skio-type="generic-action-button"], #skio-root [data-skio-name="more-actions-dropdown-trigger-button"], #skio-root [data-skio-name="variant-card-swap-button"], #skio-root [data-skio-name="variant-card-skip-button"], #skio-root [data-skio-name="products-card-add-product-button"], #skio-root [data-skio-name="billing-card-add-backup-button"], #skio-root [data-skio-name="quantity-selector"] button, #skio-root [data-skio-name="navbar-custom-button"], #skio-portal [data-skio-type="generic-action-button"], #skio-portal [data-skio-name="more-actions-dropdown-trigger-button"], #skio-portal [data-skio-name="variant-card-swap-button"], #skio-portal [data-skio-name="variant-card-skip-button"], #skio-portal [data-skio-name="products-card-add-product-button"], #skio-portal [data-skio-name="billing-card-add-backup-button"], #skio-portal [data-skio-name="quantity-selector"] button, #skio-portal [data-skio-name="navbar-custom-button"] { outline-offset: 0px; background-color: var(--bs-primary) !important; color: var(--bs-secondary) !important; font-weight: 500 !important; border-radius: 999rem !important; box-shadow: none !important; outline: rgba(0, 0, 0, 0) solid 0.1rem !important; } #skio-root [data-skio-type="generic-action-button"]:hover, #skio-root [data-skio-type="generic-action-button"]:focus, #skio-root [data-skio-type="generic-action-button"]:active, #skio-root [data-skio-name="more-actions-dropdown-trigger-button"]:hover, #skio-root [data-skio-name="more-actions-dropdown-trigger-button"]:focus, #skio-root [data-skio-name="more-actions-dropdown-trigger-button"]:active, #skio-root [data-skio-name="variant-card-swap-button"]:hover, #skio-root [data-skio-name="variant-card-swap-button"]:focus, #skio-root [data-skio-name="variant-card-swap-button"]:active, #skio-root [data-skio-name="variant-card-skip-button"]:hover, #skio-root [data-skio-name="variant-card-skip-button"]:focus, #skio-root [data-skio-name="variant-card-skip-button"]:active, #skio-root [data-skio-name="products-card-add-product-button"]:hover, #skio-root [data-skio-name="products-card-add-product-button"]:focus, #skio-root [data-skio-name="products-card-add-product-button"]:active, #skio-root [data-skio-name="billing-card-add-backup-button"]:hover, #skio-root [data-skio-name="billing-card-add-backup-button"]:focus, #skio-root [data-skio-name="billing-card-add-backup-button"]:active, #skio-root [data-skio-name="quantity-selector"] button:hover, #skio-root [data-skio-name="quantity-selector"] button:focus, #skio-root [data-skio-name="quantity-selector"] button:active, #skio-root [data-skio-name="navbar-custom-button"]:hover, #skio-root [data-skio-name="navbar-custom-button"]:focus, #skio-root [data-skio-name="navbar-custom-button"]:active, #skio-portal [data-skio-type="generic-action-button"]:hover, #skio-portal [data-skio-type="generic-action-button"]:focus, #skio-portal [data-skio-type="generic-action-button"]:active, #skio-portal [data-skio-name="more-actions-dropdown-trigger-button"]:hover, #skio-portal [data-skio-name="more-actions-dropdown-trigger-button"]:focus, #skio-portal [data-skio-name="more-actions-dropdown-trigger-button"]:active, #skio-portal [data-skio-name="variant-card-swap-button"]:hover, #skio-portal [data-skio-name="variant-card-swap-button"]:focus, #skio-portal [data-skio-name="variant-card-swap-button"]:active, #skio-portal [data-skio-name="variant-card-skip-button"]:hover, #skio-portal [data-skio-name="variant-card-skip-button"]:focus, #skio-portal [data-skio-name="variant-card-skip-button"]:active, #skio-portal [data-skio-name="products-card-add-product-button"]:hover, #skio-portal [data-skio-name="products-card-add-product-button"]:focus, #skio-portal [data-skio-name="products-card-add-product-button"]:active, #skio-portal [data-skio-name="billing-card-add-backup-button"]:hover, #skio-portal [data-skio-name="billing-card-add-backup-button"]:focus, #skio-portal [data-skio-name="billing-card-add-backup-button"]:active, #skio-portal [data-skio-name="quantity-selector"] button:hover, #skio-portal [data-skio-name="quantity-selector"] button:focus, #skio-portal [data-skio-name="quantity-selector"] button:active, #skio-portal [data-skio-name="navbar-custom-button"]:hover, #skio-portal [data-skio-name="navbar-custom-button"]:focus, #skio-portal [data-skio-name="navbar-custom-button"]:active { outline-offset: 0.4rem; outline-color: var(--bs-secondary) !important; } #skio-portal [data-skio-name="billing-card-add-backup-button"][data-demo-active], #skio-portal [data-skio-name="more-actions-dropdown-trigger-button"][data-demo-active], #skio-portal [data-skio-name="navbar-custom-button"][data-demo-active], #skio-portal [data-skio-name="products-card-add-product-button"][data-demo-active], #skio-portal [data-skio-name="quantity-selector"] button[data-demo-active], #skio-portal [data-skio-name="variant-card-skip-button"][data-demo-active], #skio-portal [data-skio-name="variant-card-swap-button"][data-demo-active], #skio-portal [data-skio-type="generic-action-button"][data-demo-active], #skio-root [data-skio-name="billing-card-add-backup-button"][data-demo-active], #skio-root [data-skio-name="more-actions-dropdown-trigger-button"][data-demo-active], #skio-root [data-skio-name="navbar-custom-button"][data-demo-active], #skio-root [data-skio-name="products-card-add-product-button"][data-demo-active], #skio-root [data-skio-name="quantity-selector"] button[data-demo-active], #skio-root [data-skio-name="variant-card-skip-button"][data-demo-active], #skio-root [data-skio-name="variant-card-swap-button"][data-demo-active], #skio-root [data-skio-type="generic-action-button"][data-demo-active] { outline-offset: 0.4rem; outline-color: var(--bs-secondary) !important; } #skio-root [data-skio-name="navbar-custom-button"], #skio-portal [data-skio-name="navbar-custom-button"] { width: 100% !important; justify-content: center !important; } #skio-root [data-skio-name="navbar-custom-button"].p-0\!, #skio-portal [data-skio-name="navbar-custom-button"].p-0\! { padding: 1rem 1.4rem !important; } #skio-root [data-skio-name="navbar-custom-button"] svg, #skio-portal [data-skio-name="navbar-custom-button"] svg { color: var(--bs-secondary) !important; } #skio-root [data-skio-name="quantity-selector"] button, #skio-portal [data-skio-name="quantity-selector"] button { padding: 0.8rem !important; background-color: var(--bs-white) !important; border: .1rem solid var(--color-border-primary, #E9EAEB) !important; } #skio-root [data-skio-name="variant-card-swap-button"], #skio-root [data-skio-name="variant-card-skip-button"], #skio-root [data-skio-name="products-card-add-product-button"], #skio-root [data-skio-name="billing-card-add-backup-button"], #skio-root [data-skio-name="navbar-custom-button"], #skio-portal [data-skio-name="variant-card-swap-button"], #skio-portal [data-skio-name="variant-card-skip-button"], #skio-portal [data-skio-name="products-card-add-product-button"], #skio-portal [data-skio-name="billing-card-add-backup-button"], #skio-portal [data-skio-name="navbar-custom-button"] { box-shadow: inset 0 0 0 .1rem var(--bs-stone-900) !important; background-color: rgba(0, 0, 0, 0) !important; color: var(--bs-secondary) !important; } #skio-root [data-skio-name="variant-card-swap-button"]:hover, #skio-root [data-skio-name="variant-card-swap-button"]:focus, #skio-root [data-skio-name="variant-card-swap-button"]:active, #skio-root [data-skio-name="variant-card-skip-button"]:hover, #skio-root [data-skio-name="variant-card-skip-button"]:focus, #skio-root [data-skio-name="variant-card-skip-button"]:active, #skio-root [data-skio-name="products-card-add-product-button"]:hover, #skio-root [data-skio-name="products-card-add-product-button"]:focus, #skio-root [data-skio-name="products-card-add-product-button"]:active, #skio-root [data-skio-name="billing-card-add-backup-button"]:hover, #skio-root [data-skio-name="billing-card-add-backup-button"]:focus, #skio-root [data-skio-name="billing-card-add-backup-button"]:active, #skio-root [data-skio-name="navbar-custom-button"]:hover, #skio-root [data-skio-name="navbar-custom-button"]:focus, #skio-root [data-skio-name="navbar-custom-button"]:active, #skio-portal [data-skio-name="variant-card-swap-button"]:hover, #skio-portal [data-skio-name="variant-card-swap-button"]:focus, #skio-portal [data-skio-name="variant-card-swap-button"]:active, #skio-portal [data-skio-name="variant-card-skip-button"]:hover, #skio-portal [data-skio-name="variant-card-skip-button"]:focus, #skio-portal [data-skio-name="variant-card-skip-button"]:active, #skio-portal [data-skio-name="products-card-add-product-button"]:hover, #skio-portal [data-skio-name="products-card-add-product-button"]:focus, #skio-portal [data-skio-name="products-card-add-product-button"]:active, #skio-portal [data-skio-name="billing-card-add-backup-button"]:hover, #skio-portal [data-skio-name="billing-card-add-backup-button"]:focus, #skio-portal [data-skio-name="billing-card-add-backup-button"]:active, #skio-portal [data-skio-name="navbar-custom-button"]:hover, #skio-portal [data-skio-name="navbar-custom-button"]:focus, #skio-portal [data-skio-name="navbar-custom-button"]:active { outline-color: var(--bs-stone-900) !important; background-color: var(--bs-stone-900) !important; } #skio-portal [data-skio-name="billing-card-add-backup-button"][data-demo-active], #skio-portal [data-skio-name="navbar-custom-button"][data-demo-active], #skio-portal [data-skio-name="products-card-add-product-button"][data-demo-active], #skio-portal [data-skio-name="variant-card-skip-button"][data-demo-active], #skio-portal [data-skio-name="variant-card-swap-button"][data-demo-active], #skio-root [data-skio-name="billing-card-add-backup-button"][data-demo-active], #skio-root [data-skio-name="navbar-custom-button"][data-demo-active], #skio-root [data-skio-name="products-card-add-product-button"][data-demo-active], #skio-root [data-skio-name="variant-card-skip-button"][data-demo-active], #skio-root [data-skio-name="variant-card-swap-button"][data-demo-active] { outline-color: var(--bs-stone-900) !important; background-color: var(--bs-stone-900) !important; } #skio-root [data-skio-name="variant-card-actions-container"], #skio-portal [data-skio-name="variant-card-actions-container"] { overflow: visible !important; } #skio-root [data-skio-name="subscription-details-page"], #skio-portal [data-skio-name="subscription-details-page"] { position: relative; } #skio-root [data-skio-name="subscription-details-layout-container"], #skio-portal [data-skio-name="subscription-details-layout-container"] { --skio-banner-height: 2.6rem; } @media screen and (min-width: 650px) { #skio-root [data-skio-name="subscription-details-layout-container"], #skio-portal [data-skio-name="subscription-details-layout-container"] { --skio-banner-height: 6.5rem; } } #skio-root [data-skio-name="subscription-details-layout-container"] div:has([data-skio-name="saved-by-sub"]), #skio-portal [data-skio-name="subscription-details-layout-container"] div:has([data-skio-name="saved-by-sub"]) { position: absolute; width: 100%; top: calc(var(--skio-banner-height) + 2rem + 1.6rem); left: 0px; } #skio-root [data-skio-name="product-selection-modal-search-input"] input, #skio-portal [data-skio-name="product-selection-modal-search-input"] input { padding-left: 4rem !important; } #skio-root [data-skio-name="navbar-orders-button"], #skio-root [data-skio-name="navbar-profile-button"], #skio-root [data-skio-name="navbar-logout-button"], #skio-portal [data-skio-name="navbar-orders-button"], #skio-portal [data-skio-name="navbar-profile-button"], #skio-portal [data-skio-name="navbar-logout-button"] { text-decoration: underline; text-underline-offset: 0.4rem; } /* ---- zbiotics.min.css ---- */ :root, [data-bs-theme="light"] { --bs-orange: #FF961B; --bs-green: #198754; --bs-black: #000; --bs-white: #fff; --bs-gray: #52534D; --bs-gray-dark: #212121; --bs-gray-100: #f8f9fa; --bs-gray-200: #e9ecef; --bs-gray-300: #dee2e6; --bs-gray-400: #ced4da; --bs-gray-500: #adb5bd; --bs-gray-600: #52534D; --bs-gray-700: #495057; --bs-gray-800: #212121; --bs-gray-900: #313131; --bs-primary: #FF961B; --bs-secondary: #212121; --bs-success: #198754; --bs-warning: #ffc107; --bs-danger: #dc3545; --bs-sky-blue: #6BC6EC; --bs-sky-blue-10: #E1F4FB; --bs-sky-blue-30: #B5E3F6; --bs-sky-blue-90: #40778E; --bs-dark-grey: #313131; --bs-dim-grey: #d6d9c8; --bs-dark-purple: #5433eb; --bs-stone-900: #ccceb7; --bs-stone-700: #f5efe2; --bs-stone-600: #ECEFDF; --bs-stone-500: #F7F9EE; --bs-stone-80: #8D8F7E; --bs-stone-30: #E4E6D5; --bs-orange-50: #FFB774; --bs-orange-10: #ffeddc; --bs-orange-90: #c67123; --bs-primary-rgb: 255, 150, 27; --bs-secondary-rgb: 33, 33, 33; --bs-success-rgb: 25, 135, 84; --bs-warning-rgb: 255, 193, 7; --bs-danger-rgb: 220, 53, 69; --bs-sky-blue-rgb: 107, 198, 236; --bs-sky-blue-10-rgb: 225, 244, 251; --bs-sky-blue-30-rgb: 181, 227, 246; --bs-sky-blue-90-rgb: 64, 119, 142; --bs-dark-grey-rgb: 49, 49, 49; --bs-dim-grey-rgb: 214, 217, 200; --bs-dark-purple-rgb: 84, 51, 235; --bs-stone-900-rgb: 204, 206, 183; --bs-stone-700-rgb: 245, 239, 226; --bs-stone-600-rgb: 236, 239, 223; --bs-stone-500-rgb: 247, 249, 238; --bs-stone-80-rgb: 141, 143, 126; --bs-stone-30-rgb: 228, 230, 213; --bs-orange-50-rgb: 255, 183, 116; --bs-orange-10-rgb: 255, 237, 220; --bs-orange-90-rgb: 198, 113, 35; --bs-primary-text-emphasis: #FF961B; --bs-secondary-text-emphasis: #212121; --bs-success-text-emphasis: #198754; --bs-warning-text-emphasis: #ffc107; --bs-danger-text-emphasis: #dc3545; --bs-sky-blue-text-emphasis: #6BC6EC; --bs-sky-blue-10-text-emphasis: #E1F4FB; --bs-sky-blue-30-text-emphasis: #B5E3F6; --bs-sky-blue-90-text-emphasis: #40778E; --bs-dark-grey-text-emphasis: #313131; --bs-dim-grey-text-emphasis: #d6d9c8; --bs-dark-purple-text-emphasis: #5433eb; --bs-stone-900-text-emphasis: #ccceb7; --bs-stone-700-text-emphasis: #f5efe2; --bs-stone-600-text-emphasis: #ECEFDF; --bs-stone-500-text-emphasis: #F7F9EE; --bs-stone-80-text-emphasis: #8D8F7E; --bs-stone-30-text-emphasis: #E4E6D5; --bs-orange-50-text-emphasis: #FFB774; --bs-orange-10-text-emphasis: #ffeddc; --bs-orange-90-text-emphasis: #c67123; --bs-primary-bg-subtle: #FF961B; --bs-secondary-bg-subtle: #212121; --bs-success-bg-subtle: #198754; --bs-warning-bg-subtle: #ffc107; --bs-danger-bg-subtle: #dc3545; --bs-sky-blue-bg-subtle: #6BC6EC; --bs-sky-blue-10-bg-subtle: #E1F4FB; --bs-sky-blue-30-bg-subtle: #B5E3F6; --bs-sky-blue-90-bg-subtle: #40778E; --bs-dark-grey-bg-subtle: #313131; --bs-dim-grey-bg-subtle: #d6d9c8; --bs-dark-purple-bg-subtle: #5433eb; --bs-stone-900-bg-subtle: #ccceb7; --bs-stone-700-bg-subtle: #f5efe2; --bs-stone-600-bg-subtle: #ECEFDF; --bs-stone-500-bg-subtle: #F7F9EE; --bs-stone-80-bg-subtle: #8D8F7E; --bs-stone-30-bg-subtle: #E4E6D5; --bs-orange-50-bg-subtle: #FFB774; --bs-orange-10-bg-subtle: #ffeddc; --bs-orange-90-bg-subtle: #c67123; --bs-primary-border-subtle: #FF961B; --bs-secondary-border-subtle: #212121; --bs-success-border-subtle: #198754; --bs-warning-border-subtle: #ffc107; --bs-danger-border-subtle: #dc3545; --bs-sky-blue-border-subtle: #6BC6EC; --bs-sky-blue-10-border-subtle: #E1F4FB; --bs-sky-blue-30-border-subtle: #B5E3F6; --bs-sky-blue-90-border-subtle: #40778E; --bs-dark-grey-border-subtle: #313131; --bs-dim-grey-border-subtle: #d6d9c8; --bs-dark-purple-border-subtle: #5433eb; --bs-stone-900-border-subtle: #ccceb7; --bs-stone-700-border-subtle: #f5efe2; --bs-stone-600-border-subtle: #ECEFDF; --bs-stone-500-border-subtle: #F7F9EE; --bs-stone-80-border-subtle: #8D8F7E; --bs-stone-30-border-subtle: #E4E6D5; --bs-orange-50-border-subtle: #FFB774; --bs-orange-10-border-subtle: #ffeddc; --bs-orange-90-border-subtle: #c67123; --bs-white-rgb: 255, 255, 255; --bs-black-rgb: 0, 0, 0; --bs-font-sans-serif: "Suisse Int'l", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); --bs-body-font-family: var(--bs-font-sans-serif); --bs-body-font-size: 1rem; --bs-body-font-weight: 400; --bs-body-line-height: 1.5; --bs-body-color: #212121; --bs-body-color-rgb: 33, 33, 33; --bs-body-bg: #fff; --bs-body-bg-rgb: 255, 255, 255; --bs-emphasis-color: #000; --bs-emphasis-color-rgb: 0, 0, 0; --bs-secondary-color: rgba(33, 33, 33, 0.75); --bs-secondary-color-rgb: 33, 33, 33; --bs-secondary-bg: #e9ecef; --bs-secondary-bg-rgb: 233, 236, 239; --bs-tertiary-color: rgba(33, 33, 33, 0.5); --bs-tertiary-color-rgb: 33, 33, 33; --bs-tertiary-bg: #f8f9fa; --bs-tertiary-bg-rgb: 248, 249, 250; --bs-heading-color: inherit; --bs-link-color: #FF961B; --bs-link-color-rgb: 255, 150, 27; --bs-link-decoration: underline; --bs-link-hover-color: #cc7816; --bs-link-hover-color-rgb: 204, 120, 22; --bs-code-color: #d63384; --bs-highlight-color: #212121; --bs-highlight-bg: #fff3cd; --bs-border-width: 1px; --bs-border-style: solid; --bs-border-color: #dee2e6; --bs-border-color-translucent: rgba(0, 0, 0, 0.175); --bs-border-radius: 0.375rem; --bs-border-radius-sm: 0.25rem; --bs-border-radius-lg: 0.5rem; --bs-border-radius-xl: 1rem; --bs-border-radius-xxl: 2rem; --bs-border-radius-2xl: var(--bs-border-radius-xxl); --bs-border-radius-pill: 50rem; --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175); --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075); --bs-focus-ring-width: 0.25rem; --bs-focus-ring-opacity: 0.25; --bs-focus-ring-color: rgba(255, 150, 27, 0.25); --bs-form-valid-color: #198754; --bs-form-valid-border-color: #198754; --bs-form-invalid-color: #dc3545; --bs-form-invalid-border-color: #dc3545; } *, ::before, ::after { box-sizing: border-box; } @media (prefers-reduced-motion: no-preference) { :root { scroll-behavior: smooth; } } body { margin: 0px; font-family: var(--bs-body-font-family); font-size: var(--bs-body-font-size); font-weight: var(--bs-body-font-weight); line-height: var(--bs-body-line-height); color: var(--bs-body-color); text-align: var(--bs-body-text-align); background-color: var(--bs-body-bg); text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .display-large, .h4--d, .h5--d, .pill, .team-pill, .switch-pack label, h6, .h6, h5, .h5, h4, .h4, .zb-article-template .article-template__content-wrapper blockquote p:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote blockquote:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) blockquote ul li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul blockquote li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote span:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul li, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ol:not(.article-template__bibliography__list) li, h3, .h3, h2, .h2, h1, .h1, .zb-article-template .article-template__content-wrapper blockquote p, .zb-article-template .article-template__content-wrapper blockquote h1, .zb-article-template .article-template__content-wrapper blockquote .h1, .zb-article-template .article-template__content-wrapper blockquote h2, .zb-article-template .article-template__content-wrapper blockquote .h2, .zb-article-template .article-template__content-wrapper blockquote h3, .zb-article-template .article-template__content-wrapper blockquote .h3, .zb-article-template .article-template__content-wrapper blockquote h4, .zb-article-template .article-template__content-wrapper blockquote .h4, .zb-article-template .article-template__content-wrapper blockquote h5, .zb-article-template .article-template__content-wrapper blockquote .h5, .zb-article-template .article-template__content-wrapper blockquote h6, .zb-article-template .article-template__content-wrapper blockquote .h6, .zb-article-template .article-template__content-wrapper blockquote span, .zb-article-template .article-template__content-wrapper blockquote { margin-top: 0px; margin-bottom: 2rem; font-weight: 500; line-height: 1.2; color: var(--bs-heading-color); } h2, .h2 { font-size: calc(1.325rem + 0.9vw); } @media (min-width: 1200px) { h2, .h2 { font-size: 2rem; } } h3, .h3 { font-size: calc(1.3rem + 0.6vw); } @media (min-width: 1200px) { h3, .h3 { font-size: 1.75rem; } } h4, .h4, .zb-article-template .article-template__content-wrapper blockquote p:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote blockquote:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) blockquote ul li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul blockquote li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote span:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul li, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ol:not(.article-template__bibliography__list) li { font-size: calc(1.275rem + 0.3vw); } @media (min-width: 1200px) { h4, .h4, .zb-article-template .article-template__content-wrapper blockquote p:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote blockquote:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) blockquote ul li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul blockquote li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote span:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul li, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ol:not(.article-template__bibliography__list) li { font-size: 1.5rem; } } p { margin-top: 0px; margin-bottom: 1rem; } ol, ul { padding-left: 2rem; } ol, ul, dl { margin-top: 0px; margin-bottom: 1rem; } a { color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1)); text-decoration: underline; } a:hover { --bs-link-color-rgb: var(--bs-link-hover-color-rgb); } img, svg { vertical-align: middle; } table { caption-side: bottom; border-collapse: collapse; } th { text-align: -webkit-match-parent; } thead, tbody, tfoot, tr, td, th { border-color: inherit; border-style: solid; border-width: 0px; } label { display: inline-block; } button { border-radius: 0px; } button:focus:not(:focus-visible) { outline: 0px; } input, button, select, optgroup, textarea { margin: 0px; font-family: inherit; font-size: inherit; line-height: inherit; } button, select { text-transform: none; } [role="button"] { cursor: pointer; } select { overflow-wrap: normal; } select:disabled { opacity: 1; } button, [type="button"], [type="reset"], [type="submit"] { appearance: button; } button:not(:disabled), [type="button"]:not(:disabled), [type="reset"]:not(:disabled), [type="submit"]:not(:disabled) { cursor: pointer; } ::-webkit-datetime-edit-fields-wrapper, ::-webkit-datetime-edit-text, ::-webkit-datetime-edit-minute, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-year-field { padding: 0px; } ::-webkit-inner-spin-button { height: auto; } ::-webkit-search-decoration { appearance: none; } ::-webkit-color-swatch-wrapper { padding: 0px; } ::file-selector-button { font: inherit; appearance: button; } iframe { border: 0px; } [hidden] { display: none !important; } :root { --bs-breakpoint-xs: 0; --bs-breakpoint-sm: 480px; --bs-breakpoint-md: 768px; --bs-breakpoint-lg: 1100px; --bs-breakpoint-xl: 1440px; } .form-control[type="file"]:not(:disabled):not([readonly]) { cursor: pointer; } .form-control:hover:not(:disabled):not([readonly])::file-selector-button { background-color: var(--bs-secondary-bg); } .form-control-color:not(:disabled):not([readonly]) { cursor: pointer; } .form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown), .form-floating > .form-control-plaintext:focus, .form-floating > .form-control-plaintext:not(:placeholder-shown) { padding-top: 1.625rem; padding-bottom: 0.625rem; } .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control-plaintext ~ label, .form-floating > .form-select ~ label { color: rgba(var(--bs-body-color-rgb), 0.65); transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); } .form-floating > .form-control:focus ~ label::after, .form-floating > .form-control:not(:placeholder-shown) ~ label::after, .form-floating > .form-control-plaintext ~ label::after, .form-floating > .form-select ~ label::after { position: absolute; inset: 1rem 0.375rem; z-index: -1; height: 1.5em; content: ""; background-color: var(--bs-body-bg); border-radius: var(--bs-border-radius); } .form-floating > :disabled ~ label, .form-floating > .form-control:disabled ~ label { color: rgb(82, 83, 77); } .form-floating > :disabled ~ label::after, .form-floating > .form-control:disabled ~ label::after { background-color: var(--bs-secondary-bg); } .was-validated .input-group > .form-control:not(:focus):valid, .input-group > .form-control:not(:focus).is-valid, .was-validated .input-group > .form-select:not(:focus):valid, .input-group > .form-select:not(:focus).is-valid, .was-validated .input-group > .form-floating:not(:focus-within):valid, .input-group > .form-floating:not(:focus-within).is-valid { z-index: 3; } .was-validated .input-group > .form-control:not(:focus):invalid, .input-group > .form-control:not(:focus).is-invalid, .was-validated .input-group > .form-select:not(:focus):invalid, .input-group > .form-select:not(:focus).is-invalid, .was-validated .input-group > .form-floating:not(:focus-within):invalid, .input-group > .form-floating:not(:focus-within).is-invalid { z-index: 4; } .visually-hidden, .visually-hidden-focusable:not(:focus):not(:focus-within) { width: 1px !important; height: 1px !important; padding: 0px !important; margin: -1px !important; overflow: hidden !important; clip: rect(0px, 0px, 0px, 0px) !important; white-space: nowrap !important; border: 0px !important; } .visually-hidden:not(caption), .visually-hidden-focusable:not(:focus):not(:focus-within):not(caption) { position: absolute !important; } .align-middle { vertical-align: middle !important; } .opacity-0 { opacity: 0 !important; } .opacity-50 { opacity: 0.5 !important; } .overflow-auto { overflow: auto !important; } .overflow-hidden, body.prevent-scrolling { overflow: hidden !important; } .overflow-y-auto { overflow-y: auto !important; } .shadow-lg { box-shadow: var(--bs-box-shadow-lg) !important; } .shadow-none { box-shadow: none !important; } .top-0 { top: 0px !important; } .border-0 { border: 0px !important; } .border-2 { border-width: 2px !important; } .w-auto { width: auto !important; } .mw-100, img { max-width: 100% !important; } .flex-row { flex-direction: row !important; } .flex-shrink-0 { flex-shrink: 0 !important; } .flex-wrap { flex-wrap: wrap !important; } .m-0 { margin: 0px !important; } .mx-auto { margin-right: auto !important; margin-left: auto !important; } .mt-1 { margin-top: 0.4rem !important; } .mt-5 { margin-top: 2rem !important; } .mt-auto { margin-top: auto !important; } .mb-0, p:last-child, ul:last-child, ol:last-child { margin-bottom: 0px !important; } .mb-2 { margin-bottom: 0.8rem !important; } .mb-5 { margin-bottom: 2rem !important; } .mb-8 { margin-bottom: 3.2rem !important; } .p-0 { padding: 0px !important; } .p-2 { padding: 0.8rem !important; } .p-3 { padding: 1.2rem !important; } .p-4 { padding: 1.6rem !important; } .p-5 { padding: 2rem !important; } .p-6 { padding: 2.4rem !important; } .px-0 { padding-right: 0px !important; padding-left: 0px !important; } .px-1 { padding-right: 0.4rem !important; padding-left: 0.4rem !important; } .px-2 { padding-right: 0.8rem !important; padding-left: 0.8rem !important; } .px-3 { padding-right: 1.2rem !important; padding-left: 1.2rem !important; } .px-4 { padding-right: 1.6rem !important; padding-left: 1.6rem !important; } .py-1 { padding-top: 0.4rem !important; padding-bottom: 0.4rem !important; } .py-2 { padding-top: 0.8rem !important; padding-bottom: 0.8rem !important; } .pt-1 { padding-top: 0.4rem !important; } .pt-4 { padding-top: 1.6rem !important; } .pt-5 { padding-top: 2rem !important; } .pb-0 { padding-bottom: 0px !important; } .pb-3 { padding-bottom: 1.2rem !important; } .pb-4 { padding-bottom: 1.6rem !important; } .pb-12 { padding-bottom: 4.8rem !important; } .gap-1 { gap: 0.4rem !important; } .gap-2 { gap: 0.8rem !important; } .gap-3 { gap: 1.2rem !important; } .gap-4 { gap: 1.6rem !important; } .gap-5 { gap: 2rem !important; } .gap-6 { gap: 2.4rem !important; } .gap-8 { gap: 3.2rem !important; } .text-center { text-align: center !important; } .text-secondary { --bs-text-opacity: 1; color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important; } .text-success { --bs-text-opacity: 1; color: rgba(var(--bs-success-rgb), var(--bs-text-opacity)) !important; } .text-white { --bs-text-opacity: 1; color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important; } .bg-stone-500 { --bs-bg-opacity: 1; background-color: rgba(var(--bs-stone-500-rgb), var(--bs-bg-opacity)) !important; } .bg-white { --bs-bg-opacity: 1; background-color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important; } .bg-transparent { --bs-bg-opacity: 1; background-color: rgba(0, 0, 0, 0) !important; } .rounded { border-radius: var(--bs-border-radius) !important; } .invisible { visibility: hidden !important; } .z-0 { z-index: 0 !important; } .transition-fast, button, .btn, a, .link-styled::after { transition: 0.3s ease-in-out !important; } @media (prefers-reduced-motion: reduce) { .transition-fast, button, .btn, a, .link-styled::after { transition: none; } } .opacity-0 { opacity: 0 !important; } .overflow-auto { overflow: auto !important; } .inset-0 { inset: 0px; } .display-large, .h4--d, .h5--d, .pill, .team-pill, .switch-pack label, h1, h2, h3, h4, h5, h6, .h1, .zb-article-template .article-template__content-wrapper blockquote p, .zb-article-template .article-template__content-wrapper blockquote h1, .zb-article-template .article-template__content-wrapper blockquote .h1, .zb-article-template .article-template__content-wrapper blockquote h2, .zb-article-template .article-template__content-wrapper blockquote .h2, .zb-article-template .article-template__content-wrapper blockquote h3, .zb-article-template .article-template__content-wrapper blockquote .h3, .zb-article-template .article-template__content-wrapper blockquote h4, .zb-article-template .article-template__content-wrapper blockquote .h4, .zb-article-template .article-template__content-wrapper blockquote .h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote blockquote:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) blockquote ul li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul blockquote li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h5, .zb-article-template .article-template__content-wrapper blockquote .h5, .zb-article-template .article-template__content-wrapper blockquote h6, .zb-article-template .article-template__content-wrapper blockquote .h6, .zb-article-template .article-template__content-wrapper blockquote span, .zb-article-template .article-template__content-wrapper blockquote, .h2, .h3, .h4, .zb-article-template .article-template__content-wrapper blockquote p:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote span:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul li, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ol:not(.article-template__bibliography__list) li, .h5, .h6 { font-family: "Suisse Int'l", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; color: inherit; margin-top: 0px; letter-spacing: -0.03em; font-weight: 500; } h2, .h2 { font-size: 2.8rem; line-height: 3.08rem; } @media (min-width: 1100px) { h2, .h2 { font-size: 4rem; line-height: 4.4rem; } } h3, .h3, .h3--all > * { font-size: 2rem; line-height: 2.2rem; } @media (min-width: 1100px) { h3, .h3, .h3--all > * { font-size: 3.2rem; line-height: 3.52rem; } } h4, .h4, .zb-article-template .article-template__content-wrapper blockquote p:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote blockquote:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) blockquote ul li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul blockquote li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote span:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul li, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ol:not(.article-template__bibliography__list) li, .accordion-button { font-size: 1.8rem; line-height: 1.98rem; } @media (min-width: 1100px) { h4, .h4, .zb-article-template .article-template__content-wrapper blockquote p:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h1:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote blockquote:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) blockquote ul li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul blockquote li:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote .h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h2:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h3:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h4:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h5:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote h6:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper blockquote span:not(:first-child):last-child, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ul li, .zb-article-template .article-template__content-wrapper:not(.article-template__content-wrapper--pledge) ol:not(.article-template__bibliography__list) li, .accordion-button { font-size: 2.4rem; line-height: 2.64rem; } } body, .text-regular, .text-regular--all > * { font-size: 1.4rem; line-height: 1.82rem; } @media (min-width: 1100px) { body, .text-regular, .text-regular--all > * { font-size: 1.6rem; line-height: 2.08rem; } } a { text-decoration: none; } html { scroll-behavior: smooth; } html, body { height: auto; font-size: 10px; position: relative; } body { letter-spacing: normal; -webkit-font-smoothing: antialiased; font-size: 1.4rem; line-height: 1.82rem; } @media (min-width: 1100px) { body { font-size: 1.6rem; line-height: 2.08rem; } } a { color: inherit; text-decoration: none; } a:hover, a:focus { color: inherit; text-decoration: none; } p, ul, ol { margin-bottom: 2.4rem; } ul, ol { padding-left: 2rem; } button, .btn, .btn-link { text-decoration: none; } button:hover, .btn:hover, .btn-link:hover { text-decoration: none; outline: none; } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { box-shadow: rgb(255, 255, 255) 0px 0px 0px 13rem inset !important; } .accordion-button.collapsed > ::before { width: 0px; } @keyframes infinite-spinning { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } .zb-headline > ::before { content: ""; position: absolute; top: 0px; left: 0px; width: 100%; height: 0.3rem; background-color: rgb(204, 206, 183); will-change: width; transition: 0.3s 0.3s !important; } @media (prefers-reduced-motion: reduce) { .zb-headline > ::before { transition: none; } } .zb-headline--primary > ::before { background-color: rgb(255, 150, 27); } .scroll-trigger:not(.scroll-trigger--offscreen).zb-headline-section.zb-headline--draw .zb-headline-title::before, .scroll-trigger:not(.scroll-trigger--offscreen).zb-headline.zb-headline--draw > ::before { animation: 750ms cubic-bezier(0, 0, 0.3, 1) 0s 1 normal forwards running zbHeadline; } @keyframes zbHeadline { 0% { width: 0px; } 100% { width: 100%; } } @keyframes slide-progress { 0% { transform: translateX(-98%); } 100% { transform: translateX(0px); } } /* ---- inline ---- */ @keyframes _consent_app-polaris-rotation-gkSNB { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes _toggle_row-slide-up-dI2ya { 0% { height: 0px; } 100% { height: var(--size-base); } } /* ---- skio-custom-css ---- */ #skio-root, #skio-portal { & #__next .EditInfoContainer--section button { width: 40px; display: flex; align-items: center; justify-content: center; } & #__next .SubscriptionCard .EditInfoContainer--section button, & #__next .SubscriptionCard .SubscriptionBody button { background-color: rgba(0, 0, 0, 0) !important; transition: unset !important; outline-color: transparent !important; } & #skio-root [data-skio-name="promo-banner"] { aspect-ratio: 1200 / 143 !important; } & #skio-root .font-semibold { font-weight: 500 !important; } & #skio-root [data-skio-name="subscription-details-full-width-banner-container"] { order: -1 !important; } & #skio-root [data-skio-name="subscription-details-full-width-banner-container"] > div { padding: 0px !important; } & #skio-root [data-skio-type="generic-action-button"] { border-radius: 999rem !important; } & #skio-root [data-skio-name="quantity-selector"] button { padding: 0.8rem !important; } } /* ---- inline ---- */ @keyframes _consent_app-polaris-rotation-gkSNB { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes _toggle_row-slide-up-dI2ya { 0% { height: 0px; } 100% { height: var(--size-base); } } /* ---- inline ---- */ @keyframes sf-pulse { 50% { opacity: 0.5; } } @keyframes sf-spin { 100% { transform: rotate(360deg); } } @keyframes enter { 0% { opacity: var(--tw-enter-opacity, 1); transform: translate3d(var(--tw-enter-translate-x, 0),var(--tw-enter-translate-y, 0),0) scale3d(var(--tw-enter-scale, 1),var(--tw-enter-scale, 1),var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0)); } } @keyframes exit { 100% { opacity: var(--tw-exit-opacity, 1); transform: translate3d(var(--tw-exit-translate-x, 0),var(--tw-exit-translate-y, 0),0) scale3d(var(--tw-exit-scale, 1),var(--tw-exit-scale, 1),var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0)); } } :root { --sf-z-index-program-widget-modal: 2147483000; } /* ---- 6029e4887b0e855d.css ---- */ @layer properties { @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) { *, ::backdrop, ::after, ::before { --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scale-z: 1; --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-scroll-snap-strictness: proximity; --tw-space-y-reverse: 0; --tw-space-x-reverse: 0; --tw-border-style: solid; --tw-gradient-position: initial; --tw-gradient-from: #0000; --tw-gradient-via: #0000; --tw-gradient-to: #0000; --tw-gradient-stops: initial; --tw-gradient-via-stops: initial; --tw-gradient-from-position: 0%; --tw-gradient-via-position: 50%; --tw-gradient-to-position: 100%; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial; --tw-ordinal: initial; --tw-slashed-zero: initial; --tw-numeric-figure: initial; --tw-numeric-spacing: initial; --tw-numeric-fraction: initial; --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-shadow-alpha: 100%; --tw-inset-shadow: 0 0 #0000; --tw-inset-shadow-color: initial; --tw-inset-shadow-alpha: 100%; --tw-ring-color: initial; --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-color: initial; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-inset: initial; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; --tw-backdrop-blur: initial; --tw-backdrop-brightness: initial; --tw-backdrop-contrast: initial; --tw-backdrop-grayscale: initial; --tw-backdrop-hue-rotate: initial; --tw-backdrop-invert: initial; --tw-backdrop-opacity: initial; --tw-backdrop-saturate: initial; --tw-backdrop-sepia: initial; --tw-duration: initial; --tw-ease: initial; --tw-text-shadow-color: initial; --tw-text-shadow-alpha: 100%; --tw-content: ""; --tw-mask-linear: linear-gradient(#fff,#fff); --tw-mask-radial: linear-gradient(#fff,#fff); --tw-mask-conic: linear-gradient(#fff,#fff); --tw-mask-left: linear-gradient(#fff,#fff); --tw-mask-right: linear-gradient(#fff,#fff); --tw-mask-bottom: linear-gradient(#fff,#fff); --tw-mask-top: linear-gradient(#fff,#fff); --tw-mask-bottom-from-position: 0%; --tw-mask-bottom-to-position: 100%; --tw-mask-bottom-from-color: black; --tw-mask-bottom-to-color: transparent; --tw-mask-linear-position: 0deg; --tw-mask-linear-from-position: 0%; --tw-mask-linear-to-position: 100%; --tw-mask-linear-from-color: black; --tw-mask-linear-to-color: transparent; } } } #skio-portal, #skio-root { all: unset; } :is(#skio-portal, #skio-root) *, :is(#skio-portal, #skio-root) ::backdrop, :is(#skio-portal, #skio-root) ::after, :is(#skio-portal, #skio-root) ::before { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; } :is(#skio-portal, #skio-root) ::file-selector-button { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; } :is(#skio-portal, #skio-root) h1, :is(#skio-portal, #skio-root) h2, :is(#skio-portal, #skio-root) h3, :is(#skio-portal, #skio-root) h4, :is(#skio-portal, #skio-root) h5, :is(#skio-portal, #skio-root) h6 { font-size: inherit; font-weight: inherit; } :is(#skio-portal, #skio-root) a { color: inherit; text-decoration: inherit; } :is(#skio-portal, #skio-root) table { text-indent: 0px; border-color: inherit; border-collapse: collapse; } :is(#skio-portal, #skio-root) menu, :is(#skio-portal, #skio-root) ol, :is(#skio-portal, #skio-root) ul { list-style: none; } :is(#skio-portal, #skio-root) audio, :is(#skio-portal, #skio-root) canvas, :is(#skio-portal, #skio-root) embed, :is(#skio-portal, #skio-root) iframe, :is(#skio-portal, #skio-root) img, :is(#skio-portal, #skio-root) object, :is(#skio-portal, #skio-root) svg, :is(#skio-portal, #skio-root) video { vertical-align: middle; display: block; } :is(#skio-portal, #skio-root) img, :is(#skio-portal, #skio-root) video { max-width: 100%; height: auto; } :is(#skio-portal, #skio-root) button, :is(#skio-portal, #skio-root) input, :is(#skio-portal, #skio-root) optgroup, :is(#skio-portal, #skio-root) select, :is(#skio-portal, #skio-root) textarea { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; } :is(#skio-portal, #skio-root) ::file-selector-button { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; } :is(#skio-portal, #skio-root) ::file-selector-button { margin-inline-end: 4px; } :is(#skio-portal, #skio-root) ::placeholder { opacity: 1; } @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) { :is(#skio-portal, #skio-root) ::placeholder { color: currentcolor; } @supports (color:color-mix(in lab,red,red)) { :is(#skio-portal, #skio-root) ::placeholder { color: color-mix(currentcolor, transparent); } } } :is(#skio-portal, #skio-root) ::-webkit-search-decoration { appearance: none; } :is(#skio-portal, #skio-root) ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit { display: inline-flex; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-fields-wrapper { padding: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-year-field { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-month-field { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-day-field { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-hour-field { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-minute-field { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-second-field { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-millisecond-field { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-datetime-edit-meridiem-field { padding-block: 0px; } :is(#skio-portal, #skio-root) ::-webkit-calendar-picker-indicator { line-height: 1; } :is(#skio-portal, #skio-root) button, :is(#skio-portal, #skio-root) input:where([type="button"], [type="reset"], [type="submit"]) { appearance: button; } :is(#skio-portal, #skio-root) ::file-selector-button { appearance: button; } :is(#skio-portal, #skio-root) ::-webkit-inner-spin-button { height: auto; } :is(#skio-portal, #skio-root) ::-webkit-outer-spin-button { height: auto; } :is(#skio-portal, #skio-root) [hidden]:where(:not([hidden="until-found"])) { display: none !important; } @layer theme; @layer base { *, ::backdrop, ::after, ::before { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; } ::file-selector-button { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; } :host, html { text-size-adjust: 100%; tab-size: 4; line-height: 1.5; font-family: var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings,normal); font-variation-settings: var(--default-font-variation-settings,normal); -webkit-tap-highlight-color: transparent; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; text-decoration: inherit; } table { text-indent: 0px; border-color: inherit; border-collapse: collapse; } menu, ol, ul { list-style: none; } audio, canvas, embed, iframe, img, object, svg, video { vertical-align: middle; display: block; } img, video { max-width: 100%; height: auto; } button, input, optgroup, select, textarea { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; } ::file-selector-button { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; } ::file-selector-button { margin-inline-end: 4px; } ::placeholder { opacity: 1; } @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) { ::placeholder { color: currentcolor; } @supports (color:color-mix(in lab,red,red)) { ::placeholder { color: color-mix(currentcolor, transparent); } } } ::-webkit-search-decoration { appearance: none; } ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; } ::-webkit-datetime-edit { display: inline-flex; } ::-webkit-datetime-edit-fields-wrapper { padding: 0px; } ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field { padding-block: 0px; } ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-month-field { padding-block: 0px; } ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field { padding-block: 0px; } ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-second-field { padding-block: 0px; } ::-webkit-datetime-edit-meridiem-field { padding-block: 0px; } ::-webkit-calendar-picker-indicator { line-height: 1; } button, input:where([type="button"], [type="reset"], [type="submit"]) { appearance: button; } ::file-selector-button { appearance: button; } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } [hidden]:where(:not([hidden="until-found"])) { display: none !important; } } @layer components, utilities; :host, :root { --font-sans: ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; --font-mono: ui-monospace,"Roboto Mono",SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; --color-red-500: oklch(63.7% .237 25.331); --color-red-600: oklch(57.7% .245 27.325); --color-orange-50: #fef6ee; --color-orange-100: #fdead7; --color-orange-200: #f9dbaf; --color-orange-300: #f7b27a; --color-orange-400: #f38744; --color-orange-500: #ef6820; --color-orange-600: #e04f16; --color-orange-700: #b93815; --color-yellow-50: #fefbe8; --color-yellow-100: #fef7c3; --color-yellow-200: #feee95; --color-yellow-300: #fde272; --color-yellow-400: #fac515; --color-yellow-500: #eaaa08; --color-yellow-600: #ca8504; --color-yellow-700: #a15c07; --color-green-50: #edfcf2; --color-green-100: #d3f8df; --color-green-200: #aaf0c4; --color-green-300: #73e2a3; --color-green-400: #3ccb7f; --color-green-500: #16b364; --color-green-600: #099250; --color-green-700: #087443; --color-blue-50: #eff8ff; --color-blue-100: #d1e9ff; --color-blue-200: #b2ddff; --color-blue-300: #84caff; --color-blue-400: #53b1fd; --color-blue-500: #2e90fa; --color-blue-600: #1570ef; --color-blue-700: #175cd3; --color-indigo-50: #eef4ff; --color-indigo-100: #e0eaff; --color-indigo-200: #c7d7fe; --color-indigo-300: #a4bcfd; --color-indigo-400: #8098f9; --color-indigo-500: #6172f3; --color-indigo-600: #444ce7; --color-indigo-700: #3538cd; --color-violet-400: #a48afb; --color-violet-700: #6927da; --color-purple-50: #f4f3ff; --color-purple-100: #ebe9fe; --color-purple-200: #d9d6fe; --color-purple-300: #bdb4fe; --color-purple-400: #9b8afb; --color-purple-500: #7a5af8; --color-purple-600: #6938ef; --color-purple-700: #5925dc; --color-fuchsia-50: #fdf4ff; --color-fuchsia-100: #fbe8ff; --color-fuchsia-200: #f6d0fe; --color-fuchsia-300: #eeaafd; --color-fuchsia-400: #e478fa; --color-fuchsia-500: #d444f1; --color-fuchsia-600: #ba24d5; --color-fuchsia-700: #9f1ab1; --color-pink-50: #fdf2fa; --color-pink-100: #fce7f6; --color-pink-200: #fcceee; --color-pink-300: #faa7e0; --color-pink-400: #f670c7; --color-pink-500: #ee46bc; --color-pink-600: #dd2590; --color-pink-700: #c11574; --color-gray-50: #fafafa; --color-gray-100: #f5f5f5; --color-gray-200: #e9eaeb; --color-gray-300: #d5d7da; --color-gray-400: #a4a7ae; --color-gray-500: #717680; --color-gray-600: #535862; --color-gray-700: #414651; --color-gray-800: #252b37; --color-gray-900: #181d27; --color-gray-950: #0a0d12; --color-black: #000; --color-white: #fff; --spacing: calc(var(--base-unit)*var(--scale)); --text-xs: calc(var(--base-font-size)*.75); --text-xs--line-height: calc(var(--spacing)*4.5); --text-sm: calc(var(--base-font-size)*.875); --text-sm--line-height: calc(var(--spacing)*5); --text-base: calc(var(--base-font-size)); --text-base--line-height: calc(1.5/1); --text-lg: calc(var(--base-font-size)*1.125); --text-lg--line-height: calc(var(--spacing)*7); --text-xl: calc(var(--base-font-size)*1.25); --text-xl--line-height: calc(var(--spacing)*7.5); --text-2xl: calc(var(--base-font-size)*1.5); --text-2xl--line-height: calc(2/1.5); --text-4xl: calc(var(--base-font-size)*2.25); --text-4xl--line-height: calc(2.5/2.25); --text-5xl: calc(var(--base-font-size)*3); --text-5xl--line-height: 1; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --tracking-tight: -.025em; --leading-tight: 1.25; --leading-snug: 1.375; --leading-relaxed: 1.625; --radius-xs: .25rem; --radius-sm: .125rem; --radius-md: .375rem; --radius-lg: .5rem; --radius-xl: .75rem; --radius-2xl: 1rem; --shadow-xs: 0px 1px 2px #0a0d120d; --ease-in: cubic-bezier(.4,0,1,1); --ease-out: cubic-bezier(0,0,.2,1); --ease-in-out: cubic-bezier(.4,0,.2,1); --animate-spin: spin 1s linear infinite; --animate-pulse: pulse 2s cubic-bezier(.4,0,.6,1)infinite; --animate-bounce: bounce 1s infinite; --blur-xs: 4px; --blur-sm: 8px; --blur-md: 12px; --blur-3xl: 64px; --aspect-video: 16/9; --default-transition-duration: .15s; --default-transition-timing-function: cubic-bezier(.4,0,.2,1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); --color-bg-primary: var(--color-white); --color-bg-secondary: var(--color-gray-50); --color-bg-tertiary: var(--color-gray-100); --color-border-primary: var(--color-gray-300); --color-text-general: #535862; --color-text-heading: #181d27; --color-text-link: #7f56d9; --color-text-link-contrast: var(--color-button-text-primary); --color-success: #16b364; --color-button-bg-primary: #200039; --color-button-text-primary: #fff; --color-button-bg-secondary: #f8f0ff; --color-button-text-secondary: #5d38a0; --color-focus-area: #5d38a0; --color-button-bg-primary_hover: #3c0061; --color-button-bg-secondary_hover: #ecd6ff; --color-button-bg-support: #fff; --color-button-text-support: #535862; --color-button-bg-support_hover: #f5f5f5; --border-width-cpv3: 2px; --radius-border-radius: 12px; --color-skeleton-bg: #0000001a; --spacing-xxs: calc(var(--spacing)*.5); --spacing-xs: var(--spacing); --spacing-sm: calc(var(--spacing)*1.5); --spacing-md: calc(var(--spacing)*2); --spacing-lg: calc(var(--spacing)*3); --spacing-xl: calc(var(--spacing)*4); --spacing-2xl: calc(var(--spacing)*5); --spacing-3xl: calc(var(--spacing)*6); --spacing-4xl: calc(var(--spacing)*8); --spacing-cpv3: var(--border-width-cpv3); --text-md: calc(var(--spacing)*4); --text-md--line-height: calc(var(--spacing)*6); --text-display-xs: calc(var(--spacing)*6); --text-display-xs--line-height: calc(var(--spacing)*8); --text-display-sm: calc(var(--spacing)*7.5); --text-display-sm--line-height: calc(var(--spacing)*9.5); --text-display-md: calc(var(--spacing)*9); --text-display-md--line-height: calc(var(--spacing)*11); --text-display-md--letter-spacing: -.72px; --text-display-lg: calc(var(--spacing)*12); --text-display-lg--line-height: calc(var(--spacing)*15); --text-display-lg--letter-spacing: -.96px; --text-display-xl: calc(var(--spacing)*15); --text-display-xl--line-height: calc(var(--spacing)*18); --text-display-xl--letter-spacing: -1.2px; --max-width-container: 1280px; --radius-none: 0px; --radius-full: 9999px; --shadow-skeumorphic: 0px 0px 0px 1px #0a0d122e inset,0px -2px 0px 0px #0a0d120d inset; --animate-caret-blink: caret-blink 1s infinite; --color-alpha-white: #fff; --color-alpha-black: #000; --color-brand-25: #fcfaff; --color-brand-50: #f9f5ff; --color-brand-100: #f4ebff; --color-brand-200: #e9d7fe; --color-brand-300: #d6bbfb; --color-brand-400: #b692f6; --color-brand-500: #9e77ed; --color-brand-600: #7f56d9; --color-brand-700: #6941c6; --color-brand-800: #53389e; --color-brand-900: #42307d; --color-error-50: #fef3f2; --color-error-100: #fee4e2; --color-error-200: #fecdca; --color-error-300: #fda29b; --color-error-400: #f97066; --color-error-500: #f04438; --color-error-600: #d92d20; --color-error-700: #b42318; --color-warning-50: #fffaeb; --color-warning-100: #fef0c7; --color-warning-200: #fedf89; --color-warning-300: #fec84b; --color-warning-400: #fdb022; --color-warning-500: #f79009; --color-warning-600: #dc6803; --color-warning-700: #b54708; --color-success-50: #ecfdf3; --color-success-100: #dcfae6; --color-success-200: #abefc6; --color-success-300: #75e0a7; --color-success-400: #47cd89; --color-success-500: #17b26a; --color-success-600: #079455; --color-success-700: #067647; --color-gray-25: #fdfdfd; --color-gray-blue-50: #f8f9fc; --color-gray-blue-100: #eaecf5; --color-gray-blue-200: #d5d9eb; --color-gray-blue-300: #b3b8db; --color-gray-blue-400: #717bbc; --color-gray-blue-500: #4e5ba6; --color-gray-blue-600: #3e4784; --color-gray-blue-700: #363f72; --color-blue-light-50: #f0f9ff; --color-blue-light-100: #e0f2fe; --color-blue-light-200: #b9e6fe; --color-blue-light-300: #7cd4fd; --color-blue-light-400: #36bffa; --color-blue-light-500: #0ba5ec; --color-blue-light-600: #0086c9; --color-blue-light-700: #026aa2; --color-blue-dark-50: #eff4ff; --color-blue-dark-100: #d1e0ff; --color-blue-dark-200: #b2ccff; --color-blue-dark-300: #84adff; --color-blue-dark-400: #528bff; --color-blue-dark-500: #2970ff; --color-blue-dark-600: #155eef; --color-blue-dark-700: #004eeb; --color-orange-dark-50: #fff4ed; --color-orange-dark-100: #ffe6d5; --color-orange-dark-200: #ffd6ae; --color-orange-dark-300: #ff9c66; --color-orange-dark-400: #ff692e; --color-orange-dark-500: #ff4405; --color-orange-dark-600: #e62e05; --color-orange-dark-700: #bc1b06; --color-utility-blue-50: var(--color-blue-50); --color-utility-blue-100: var(--color-blue-100); --color-utility-blue-200: var(--color-blue-200); --color-utility-blue-400: var(--color-blue-400); --color-utility-blue-500: var(--color-blue-500); --color-utility-blue-700: var(--color-blue-700); --color-utility-brand-50: var(--color-brand-50); --color-utility-brand-100: var(--color-brand-100); --color-utility-brand-200: var(--color-brand-200); --color-utility-brand-300: var(--color-brand-300); --color-utility-brand-400: var(--color-brand-400); --color-utility-brand-500: var(--color-brand-500); --color-utility-brand-600: var(--color-brand-600); --color-utility-brand-700: var(--color-brand-700); --color-utility-gray-50: var(--color-gray-50); --color-utility-gray-100: var(--color-gray-100); --color-utility-gray-200: var(--color-gray-200); --color-utility-gray-300: var(--color-gray-300); --color-utility-gray-400: var(--color-gray-400); --color-utility-gray-500: var(--color-gray-500); --color-utility-gray-600: var(--color-gray-600); --color-utility-gray-700: var(--color-gray-700); --color-utility-error-50: var(--color-error-50); --color-utility-error-100: var(--color-error-100); --color-utility-error-200: var(--color-error-200); --color-utility-error-400: var(--color-error-400); --color-utility-error-500: var(--color-error-500); --color-utility-error-700: var(--color-error-700); --color-utility-warning-50: var(--color-warning-50); --color-utility-warning-100: var(--color-warning-100); --color-utility-warning-200: var(--color-warning-200); --color-utility-warning-300: var(--color-warning-300); --color-utility-warning-400: var(--color-warning-400); --color-utility-warning-500: var(--color-warning-500); --color-utility-warning-600: var(--color-warning-600); --color-utility-warning-700: var(--color-warning-700); --color-utility-success-50: var(--color-success-50); --color-utility-success-100: var(--color-success-100); --color-utility-success-200: var(--color-success-200); --color-utility-success-400: var(--color-success-400); --color-utility-success-500: var(--color-success-500); --color-utility-orange-50: var(--color-orange-50); --color-utility-orange-100: var(--color-orange-100); --color-utility-orange-200: var(--color-orange-200); --color-utility-orange-400: var(--color-orange-400); --color-utility-orange-500: var(--color-orange-500); --color-utility-orange-700: var(--color-orange-700); --color-utility-indigo-50: var(--color-indigo-50); --color-utility-indigo-100: var(--color-indigo-100); --color-utility-indigo-200: var(--color-indigo-200); --color-utility-indigo-400: var(--color-indigo-400); --color-utility-indigo-500: var(--color-indigo-500); --color-utility-indigo-700: var(--color-indigo-700); --color-utility-pink-50: var(--color-pink-50); --color-utility-pink-100: var(--color-pink-100); --color-utility-pink-200: var(--color-pink-200); --color-utility-pink-400: var(--color-pink-400); --color-utility-pink-500: var(--color-pink-500); --color-utility-pink-700: var(--color-pink-700); --color-utility-purple-50: var(--color-purple-50); --color-utility-purple-100: var(--color-purple-100); --color-utility-purple-200: var(--color-purple-200); --color-utility-purple-400: var(--color-purple-400); --color-utility-purple-500: var(--color-purple-500); --color-utility-purple-700: var(--color-purple-700); --color-utility-orange-dark-400: var(--color-orange-dark-400); --color-utility-blue-light-50: var(--color-blue-light-50); --color-utility-blue-light-100: var(--color-blue-light-100); --color-utility-blue-light-200: var(--color-blue-light-200); --color-utility-blue-light-400: var(--color-blue-light-400); --color-utility-blue-light-500: var(--color-blue-light-500); --color-utility-blue-light-700: var(--color-blue-light-700); --color-utility-gray-blue-50: var(--color-gray-blue-50); --color-utility-gray-blue-100: var(--color-gray-blue-100); --color-utility-gray-blue-200: var(--color-gray-blue-200); --color-utility-gray-blue-400: var(--color-gray-blue-400); --color-utility-gray-blue-500: var(--color-gray-blue-500); --color-utility-gray-blue-700: var(--color-gray-blue-700); --color-utility-green-200: var(--color-green-200); --color-utility-green-500: var(--color-green-500); --color-utility-green-600: var(--color-green-600); --color-text-primary: var(--color-gray-900); --color-text-tertiary: var(--color-gray-600); --color-text-error-primary: var(--color-error-600); --color-text-warning-primary: var(--color-warning-600); --color-text-success-primary: var(--color-success-600); --color-text-white: var(--color-white); --color-text-secondary: var(--color-gray-700); --color-text-disabled: var(--color-gray-500); --color-text-secondary_hover: var(--color-gray-800); --color-text-tertiary_hover: var(--color-gray-700); --color-text-brand-secondary: var(--color-brand-700); --color-text-placeholder: var(--color-gray-500); --color-text-placeholder_subtle: var(--color-gray-300); --color-text-brand-tertiary: var(--color-brand-600); --color-text-quaternary: var(--color-gray-500); --color-text-brand-primary: var(--color-brand-900); --color-text-primary_on-brand: var(--color-white); --color-text-secondary_on-brand: var(--color-brand-200); --color-text-tertiary_on-brand: var(--color-brand-200); --color-text-quaternary_on-brand: var(--color-brand-300); --color-text-brand-tertiary_alt: var(--color-brand-600); --color-text-brand-secondary_hover: var(--color-brand-800); --color-text-error-primary_hover: var(--color-error-700); --color-border-secondary: var(--color-gray-200); --color-border-error_subtle: var(--color-error-300); --color-border-brand: var(--color-brand-500); --color-border-disabled: var(--color-gray-300); --color-border-error: var(--color-error-500); --color-border-disabled_subtle: var(--color-gray-200); --color-border-tertiary: var(--color-gray-100); --color-border-brand_alt: var(--color-brand-600); --color-border-secondary_alt: #00000014; --color-fg-secondary: var(--color-gray-700); --color-fg-warning-primary: var(--color-warning-600); --color-fg-success-primary: var(--color-success-600); --color-fg-white: var(--color-white); --color-fg-success-secondary: var(--color-success-500); --color-fg-disabled: var(--color-gray-400); --color-fg-brand-secondary: var(--color-brand-500); --color-fg-brand-primary: var(--color-brand-600); --color-fg-quaternary: var(--color-gray-400); --color-fg-quaternary_hover: var(--color-gray-500); --color-fg-error-primary: var(--color-error-600); --color-fg-disabled_subtle: var(--color-gray-300); --color-fg-error-secondary: var(--color-error-500); --color-fg-tertiary: var(--color-gray-600); --color-fg-brand-primary_alt: var(--color-fg-brand-primary); --color-bg-brand-primary: var(--color-brand-50); --color-bg-error-secondary: var(--color-error-100); --color-bg-warning-primary: var(--color-warning-50); --color-bg-warning-secondary: var(--color-warning-100); --color-bg-success-primary: var(--color-success-50); --color-bg-success-secondary: var(--color-success-100); --color-bg-brand-solid: var(--color-brand-600); --color-bg-secondary-solid: var(--color-gray-600); --color-bg-error-solid: var(--color-error-600); --color-bg-warning-solid: var(--color-warning-600); --color-bg-success-solid: var(--color-success-600); --color-bg-secondary_hover: var(--color-gray-100); --color-bg-primary_hover: var(--color-gray-50); --color-bg-disabled: var(--color-gray-100); --color-bg-active: var(--color-gray-50); --color-bg-brand-solid_hover: var(--color-brand-700); --color-bg-error-primary: var(--color-error-50); --color-bg-brand-secondary: var(--color-brand-100); --color-bg-disabled_subtle: var(--color-gray-50); --color-bg-quaternary: var(--color-gray-200); --color-bg-primary_alt: var(--color-white); --color-bg-brand-primary_alt: var(--color-brand-50); --color-bg-secondary_alt: var(--color-gray-50); --color-bg-overlay: var(--color-gray-950); --color-bg-secondary_subtle: var(--color-gray-25); --color-bg-brand-section: var(--color-brand-800); --color-bg-brand-section_subtle: var(--color-brand-700); --color-bg-primary-solid: var(--color-gray-950); --color-avatar-bg: var(--color-gray-100); --color-avatar-contrast-border: #00000014; --color-button-destructive-primary-icon: var(--color-error-300); --color-button-destructive-primary-icon_hover: var(--color-error-200); --color-featured-icon-light-fg-brand: var(--color-brand-600); --color-featured-icon-light-fg-error: var(--color-error-600); --color-featured-icon-light-fg-gray: var(--color-gray-500); --color-featured-icon-light-fg-success: var(--color-success-600); --color-featured-icon-light-fg-warning: var(--color-warning-600); --color-focus-ring: var(--color-focus-area); --color-slider-handle-bg: var(--color-white); --color-slider-handle-border: var(--color-brand-600); --color-tooltip-supporting-text: var(--color-gray-300); --background-color-quaternary: var(--color-bg-quaternary); --background-color-brand-solid: var(--color-bg-brand-solid); --background-color-disabled: var(--color-bg-disabled); --background-color-primary: var(--color-bg-primary); --background-color-primary-solid: var(--color-bg-primary-solid); --background-color-primary_alt: var(--color-bg-primary_alt); --background-color-primary_hover: var(--color-bg-primary_hover); --background-color-secondary: var(--color-bg-secondary); --background-color-secondary-solid: var(--color-bg-secondary-solid); --background-color-secondary_alt: var(--color-bg-secondary_alt); --background-color-secondary_hover: var(--color-bg-secondary_hover); --background-color-secondary_subtle: var(--color-bg-secondary_subtle); --background-color-tertiary: var(--color-bg-tertiary); --background-color-active: var(--color-bg-active); --background-color-disabled_subtle: var(--color-bg-disabled_subtle); --background-color-overlay: var(--color-bg-overlay); --background-color-brand-primary_alt: var(--color-bg-brand-primary_alt); --background-color-brand-secondary: var(--color-bg-brand-secondary); --background-color-brand-solid_hover: var(--color-bg-brand-solid_hover); --background-color-error-primary: var(--color-bg-error-primary); --background-color-error-secondary: var(--color-bg-error-secondary); --background-color-error-solid: var(--color-bg-error-solid); --background-color-warning-secondary: var(--color-bg-warning-secondary); --background-color-warning-solid: var(--color-bg-warning-solid); --background-color-success-secondary: var(--color-bg-success-secondary); --background-color-success-solid: var(--color-bg-success-solid); --text-color-secondary: var(--color-text-secondary); --text-color-secondary_hover: var(--color-text-secondary_hover); --text-color-tertiary: var(--color-text-tertiary); --text-color-tertiary_hover: var(--color-text-tertiary_hover); --text-color-quaternary: var(--color-text-quaternary); --text-color-disabled: var(--color-text-disabled); --text-color-placeholder: var(--color-text-placeholder); --text-color-placeholder_subtle: var(--color-text-placeholder_subtle); --text-color-brand-primary: var(--color-text-brand-primary); --text-color-brand-secondary: var(--color-text-brand-secondary); --text-color-brand-secondary_hover: var(--color-text-brand-secondary_hover); --text-color-brand-tertiary: var(--color-text-brand-tertiary); --text-color-brand-tertiary_alt: var(--color-text-brand-tertiary_alt); --text-color-error-primary: var(--color-text-error-primary); --text-color-error-primary_hover: var(--color-text-error-primary_hover); --text-color-success-primary: var(--color-text-success-primary); --text-color-tooltip-supporting-text: var(--color-tooltip-supporting-text); --border-color-primary: var(--color-border-primary); --border-color-secondary: var(--color-border-secondary); --border-color-disabled: var(--color-border-disabled); --border-color-brand: var(--color-border-brand); --border-color-error: var(--color-border-error); --border-color-error_subtle: var(--color-border-error_subtle); --ring-color-bg-brand-solid: var(--color-bg-brand-solid); --ring-color-primary: var(--color-border-primary); --ring-color-secondary: var(--color-border-secondary); --ring-color-secondary_alt: var(--color-border-secondary_alt); --ring-color-disabled: var(--color-border-disabled); --ring-color-brand: var(--color-border-brand); --ring-color-error: var(--color-border-error); --ring-color-disabled_subtle: var(--color-border-disabled_subtle); --ring-color-error_subtle: var(--color-border-error_subtle); --outline-color-brand: var(--color-border-brand); --outline-color-error: var(--color-border-error); --base-unit: 4px; --scale: 1; --base-font-size: calc(4*var(--base-unit)*var(--scale)); --max-skio-width: 1140px; } :is(#skio-root, #skio-portal) .pointer-events-none { pointer-events: none; } :is(#skio-root, #skio-portal) .invisible { visibility: hidden; } :is(#skio-root, #skio-portal) .absolute { position: absolute; } :is(#skio-root, #skio-portal) .fixed { position: fixed; } :is(#skio-root, #skio-portal) .relative { position: relative; } :is(#skio-root, #skio-portal) .inset-0 { inset: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .top-0 { top: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .top-2 { top: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .top-4 { top: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .right-0 { right: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .right-2 { right: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .right-3\.5 { right: calc(var(--spacing)*3.5); } :is(#skio-root, #skio-portal) .right-4 { right: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .bottom-16 { bottom: calc(var(--spacing)*16); } :is(#skio-root, #skio-portal) .bottom-\[2px\] { bottom: 2px; } :is(#skio-root, #skio-portal) .left-0 { left: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .left-1\/2 { left: 50%; } :is(#skio-root, #skio-portal) .left-3 { left: calc(var(--spacing)*3); } :is(#skio-root, #skio-portal) .z-0 { z-index: 0; } :is(#skio-root, #skio-portal) .z-10 { z-index: 10; } :is(#skio-root, #skio-portal) .z-\[9999\] { z-index: 9999; } :is(#skio-root, #skio-portal) .z-\[99999\] { z-index: 99999; } :is(#skio-root, #skio-portal) .col-start-1 { grid-column-start: 1; } :is(#skio-root, #skio-portal) .col-start-2 { grid-column-start: 2; } :is(#skio-root, #skio-portal) .col-end-2 { grid-column-end: 2; } :is(#skio-root, #skio-portal) .col-end-3 { grid-column-end: 3; } :is(#skio-root, #skio-portal) .row-start-1 { grid-row-start: 1; } :is(#skio-root, #skio-portal) .row-start-2 { grid-row-start: 2; } :is(#skio-root, #skio-portal) .row-end-2 { grid-row-end: 2; } :is(#skio-root, #skio-portal) .row-end-3 { grid-row-end: 3; } :is(#skio-root, #skio-portal) .m-0 { margin: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .mx-auto { margin-inline: auto; } :is(#skio-root, #skio-portal) .mt-0\.5 { margin-top: calc(var(--spacing)*.5); } :is(#skio-root, #skio-portal) .mt-1 { margin-top: calc(var(--spacing)*1); } :is(#skio-root, #skio-portal) .mt-5 { margin-top: calc(var(--spacing)*5); } :is(#skio-root, #skio-portal) .mt-auto { margin-top: auto; } :is(#skio-root, #skio-portal) .mb-2 { margin-bottom: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .mb-5 { margin-bottom: calc(var(--spacing)*5); } :is(#skio-root, #skio-portal) .mb-8 { margin-bottom: calc(var(--spacing)*8); } :is(#skio-root, #skio-portal) .ml-2 { margin-left: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .ml-auto { margin-left: auto; } :is(#skio-root, #skio-portal) .box-border { box-sizing: border-box; } :is(#skio-root, #skio-portal) .box-content { box-sizing: content-box; } :is(#skio-root, #skio-portal) .line-clamp-1 { -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } :is(#skio-root, #skio-portal) .line-clamp-2 { -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } :is(#skio-root, #skio-portal) .scrollbar-hide::-webkit-scrollbar { appearance: none; display: none; } :is(#skio-root, #skio-portal) .scrollbar-hide { scrollbar-width: none; } :is(#skio-root, #skio-portal) .block { display: block; } :is(#skio-root, #skio-portal) .flex { display: flex; } :is(#skio-root, #skio-portal) .grid { display: grid; } :is(#skio-root, #skio-portal) .hidden { display: none; } :is(#skio-root, #skio-portal) .inline-block { display: inline-block; } :is(#skio-root, #skio-portal) .inline-flex { display: inline-flex; } :is(#skio-root, #skio-portal) .aspect-square { aspect-ratio: 1 / 1; } :is(#skio-root, #skio-portal) .size-1\.25 { width: calc(var(--spacing)*1.25); height: calc(var(--spacing)*1.25); } :is(#skio-root, #skio-portal) .size-2 { width: calc(var(--spacing)*2); height: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .size-3 { width: calc(var(--spacing)*3); height: calc(var(--spacing)*3); } :is(#skio-root, #skio-portal) .size-4 { width: calc(var(--spacing)*4); height: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .size-5 { width: calc(var(--spacing)*5); height: calc(var(--spacing)*5); } :is(#skio-root, #skio-portal) .size-6 { width: calc(var(--spacing)*6); height: calc(var(--spacing)*6); } :is(#skio-root, #skio-portal) .size-8 { width: calc(var(--spacing)*8); height: calc(var(--spacing)*8); } :is(#skio-root, #skio-portal) .size-11 { width: calc(var(--spacing)*11); height: calc(var(--spacing)*11); } :is(#skio-root, #skio-portal) .size-full { width: 100%; height: 100%; } :is(#skio-root, #skio-portal) .size-max { width: max-content; height: max-content; } :is(#skio-root, #skio-portal) .h-5 { height: calc(var(--spacing)*5); } :is(#skio-root, #skio-portal) .h-6 { height: calc(var(--spacing)*6); } :is(#skio-root, #skio-portal) .h-8 { height: calc(var(--spacing)*8); } :is(#skio-root, #skio-portal) .h-10 { height: calc(var(--spacing)*10); } :is(#skio-root, #skio-portal) .h-14 { height: calc(var(--spacing)*14); } :is(#skio-root, #skio-portal) .h-\[80px\] { height: 80px; } :is(#skio-root, #skio-portal) .h-\[90px\] { height: 90px; } :is(#skio-root, #skio-portal) .h-\[100px\] { height: 100px; } :is(#skio-root, #skio-portal) .h-\[104px\] { height: 104px; } :is(#skio-root, #skio-portal) .h-\[calc\(100dvh-1rem\)\] { height: calc(100dvh - 1rem); } :is(#skio-root, #skio-portal) .h-full { height: 100%; } :is(#skio-root, #skio-portal) .h-max { height: max-content; } :is(#skio-root, #skio-portal) .h-min { height: min-content; } :is(#skio-root, #skio-portal) .max-h-\(--visual-viewport-height\) { max-height: var(--visual-viewport-height); } :is(#skio-root, #skio-portal) .max-h-64\! { max-height: calc(var(--spacing)*64) !important; } :is(#skio-root, #skio-portal) .max-h-\[2rem\] { max-height: 2rem; } :is(#skio-root, #skio-portal) .max-h-full { max-height: 100%; } :is(#skio-root, #skio-portal) .max-h-none { max-height: none; } :is(#skio-root, #skio-portal) .min-h-0 { min-height: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .min-h-dvh { min-height: 100dvh; } :is(#skio-root, #skio-portal) .min-h-full { min-height: 100%; } :is(#skio-root, #skio-portal) .w-0 { width: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .w-1\/3 { width: 33.3333%; } :is(#skio-root, #skio-portal) .w-5 { width: calc(var(--spacing)*5); } :is(#skio-root, #skio-portal) .w-6 { width: calc(var(--spacing)*6); } :is(#skio-root, #skio-portal) .w-10 { width: calc(var(--spacing)*10); } :is(#skio-root, #skio-portal) .w-11\.5 { width: calc(var(--spacing)*11.5); } :is(#skio-root, #skio-portal) .w-14 { width: calc(var(--spacing)*14); } :is(#skio-root, #skio-portal) .w-62 { width: calc(var(--spacing)*62); } :is(#skio-root, #skio-portal) .w-\[80px\] { width: 80px; } :is(#skio-root, #skio-portal) .w-\[90px\] { width: 90px; } :is(#skio-root, #skio-portal) .w-\[100px\] { width: 100px; } :is(#skio-root, #skio-portal) .w-\[114px\] { width: 114px; } :is(#skio-root, #skio-portal) .w-\[360px\] { width: 360px; } :is(#skio-root, #skio-portal) .w-auto { width: auto; } :is(#skio-root, #skio-portal) .w-fit { width: fit-content; } :is(#skio-root, #skio-portal) .w-full { width: 100%; } :is(#skio-root, #skio-portal) .w-max { width: max-content; } :is(#skio-root, #skio-portal) .max-w-\(--max-skio-width\) { max-width: var(--max-skio-width); } :is(#skio-root, #skio-portal) .max-w-0 { max-width: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .max-w-\[2rem\] { max-width: 2rem; } :is(#skio-root, #skio-portal) .max-w-\[350px\] { max-width: 350px; } :is(#skio-root, #skio-portal) .max-w-\[544px\] { max-width: 544px; } :is(#skio-root, #skio-portal) .max-w-\[min\(calc\(var\(--trigger-width\)\*2\)\,calc\(100vw-2rem\)\)\] { max-width: min(calc(var(--trigger-width)*2),calc(100vw - 2rem)); } :is(#skio-root, #skio-portal) .max-w-full { max-width: 100%; } :is(#skio-root, #skio-portal) .min-w-\(--trigger-width\) { min-width: var(--trigger-width); } :is(#skio-root, #skio-portal) .min-w-0 { min-width: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .flex-1 { flex: 1 1 0%; } :is(#skio-root, #skio-portal) .flex-shrink-0 { flex-shrink: 0; } :is(#skio-root, #skio-portal) .shrink-0 { flex-shrink: 0; } :is(#skio-root, #skio-portal) .flex-grow, :is(#skio-root, #skio-portal) .grow { flex-grow: 1; } :is(#skio-root, #skio-portal) .grow-0 { flex-grow: 0; } :is(#skio-root, #skio-portal) .basis-full { flex-basis: 100%; } :is(#skio-root, #skio-portal) .table-fixed { table-layout: fixed; } :is(#skio-root, #skio-portal) .origin-top-left { transform-origin: 0px 0px; } :is(#skio-root, #skio-portal) .-translate-x-1\/2 { --tw-translate-x: calc(calc(1/2*100%)*-1); translate: var(--tw-translate-x)var(--tw-translate-y); } :is(#skio-root, #skio-portal) .animate-spin { animation: var(--animate-spin); } :is(#skio-root, #skio-portal) .cursor-default { cursor: default; } :is(#skio-root, #skio-portal) .cursor-not-allowed { cursor: not-allowed; } :is(#skio-root, #skio-portal) .cursor-pointer { cursor: pointer; } :is(#skio-root, #skio-portal) .touch-manipulation { touch-action: manipulation; } :is(#skio-root, #skio-portal) .appearance-none { appearance: none; } :is(#skio-root, #skio-portal) .grid-cols-1 { grid-template-columns: repeat(1, minmax(0px, 1fr)); } :is(#skio-root, #skio-portal) .grid-cols-\[114px_1fr\] { grid-template-columns: 114px 1fr; } :is(#skio-root, #skio-portal) .flex-col { flex-direction: column; } :is(#skio-root, #skio-portal) .flex-col-reverse { flex-direction: column-reverse; } :is(#skio-root, #skio-portal) .flex-row { flex-direction: row; } :is(#skio-root, #skio-portal) .flex-wrap { flex-wrap: wrap; } :is(#skio-root, #skio-portal) .place-content-center { place-content: center; } :is(#skio-root, #skio-portal) .place-items-center { place-items: center; } :is(#skio-root, #skio-portal) .items-center { align-items: center; } :is(#skio-root, #skio-portal) .items-end { align-items: flex-end; } :is(#skio-root, #skio-portal) .items-start { align-items: flex-start; } :is(#skio-root, #skio-portal) .justify-between { justify-content: space-between; } :is(#skio-root, #skio-portal) .justify-center { justify-content: center; } :is(#skio-root, #skio-portal) .justify-end { justify-content: flex-end; } :is(#skio-root, #skio-portal) .justify-normal { justify-content: normal; } :is(#skio-root, #skio-portal) .justify-start { justify-content: flex-start; } :is(#skio-root, #skio-portal) .gap-0\.5 { gap: calc(var(--spacing)*.5); } :is(#skio-root, #skio-portal) .gap-1 { gap: calc(var(--spacing)*1); } :is(#skio-root, #skio-portal) .gap-1\.5 { gap: calc(var(--spacing)*1.5); } :is(#skio-root, #skio-portal) .gap-2 { gap: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .gap-3 { gap: calc(var(--spacing)*3); } :is(#skio-root, #skio-portal) .gap-4 { gap: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .gap-5 { gap: calc(var(--spacing)*5); } :is(#skio-root, #skio-portal) .gap-6 { gap: calc(var(--spacing)*6); } :is(#skio-root, #skio-portal) .gap-8 { gap: calc(var(--spacing)*8); } :is(#skio-root, #skio-portal) .gap-x-2 { column-gap: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .gap-x-4 { column-gap: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .gap-y-1 { row-gap: calc(var(--spacing)*1); } :is(#skio-root, #skio-portal) .gap-y-3 { row-gap: calc(var(--spacing)*3); } :is(#skio-root, #skio-portal) .truncate { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } :is(#skio-root, #skio-portal) .overflow-auto { overflow: auto; } :is(#skio-root, #skio-portal) .overflow-hidden { overflow: hidden; } :is(#skio-root, #skio-portal) .overflow-y-auto { overflow-y: auto; } :is(#skio-root, #skio-portal) .rounded { border-radius: 0.25rem; } :is(#skio-root, #skio-portal) .rounded-2xl { border-radius: var(--radius-2xl); } :is(#skio-root, #skio-portal) .rounded-\[14px\] { border-radius: 14px; } :is(#skio-root, #skio-portal) .rounded-border-radius { border-radius: var(--radius-border-radius); } :is(#skio-root, #skio-portal) .rounded-full { border-radius: var(--radius-full); } :is(#skio-root, #skio-portal) .rounded-lg { border-radius: var(--radius-lg); } :is(#skio-root, #skio-portal) .rounded-md { border-radius: var(--radius-md); } :is(#skio-root, #skio-portal) .rounded-l-full { border-top-left-radius: var(--radius-full); border-bottom-left-radius: var(--radius-full); } :is(#skio-root, #skio-portal) .rounded-r-full { border-top-right-radius: var(--radius-full); border-bottom-right-radius: var(--radius-full); } :is(#skio-root, #skio-portal) .rounded-b-none { border-bottom-right-radius: var(--radius-none); border-bottom-left-radius: var(--radius-none); } :is(#skio-root, #skio-portal) .border-0 { border-style: var(--tw-border-style); border-width: 0px; } :is(#skio-root, #skio-portal) .border-2 { border-style: var(--tw-border-style); border-width: 2px; } :is(#skio-root, #skio-portal) .border-\[1\.5px\] { border-style: var(--tw-border-style); border-width: 1.5px; } :is(#skio-root, #skio-portal) .border-cpv3 { border-style: var(--tw-border-style); border-width: var(--border-width-cpv3); } :is(#skio-root, #skio-portal) .border-t { border-top-style: var(--tw-border-style); border-top-width: 1px; } :is(#skio-root, #skio-portal) .border-b-0 { border-bottom-style: var(--tw-border-style); border-bottom-width: 0px; } :is(#skio-root, #skio-portal) .border-b-4 { border-bottom-style: var(--tw-border-style); border-bottom-width: 4px; } :is(#skio-root, #skio-portal) .border-dashed { --tw-border-style: dashed; border-style: dashed; } :is(#skio-root, #skio-portal) .border-bg-tertiary { border-color: var(--color-bg-tertiary); } :is(#skio-root, #skio-portal) .border-border-primary { border-color: var(--color-border-primary); } :is(#skio-root, #skio-portal) .border-border-secondary { border-color: var(--color-border-secondary); } :is(#skio-root, #skio-portal) .border-transparent { border-color: rgba(0, 0, 0, 0); } :is(#skio-root, #skio-portal) .border-utility-gray-600 { border-color: var(--color-utility-gray-600); } :is(#skio-root, #skio-portal) .bg-active { background-color: var(--background-color-active); } :is(#skio-root, #skio-portal) .bg-bg-primary { background-color: var(--color-bg-primary); } :is(#skio-root, #skio-portal) .bg-bg-primary_hover { background-color: var(--color-bg-primary_hover); } :is(#skio-root, #skio-portal) .bg-bg-secondary { background-color: var(--color-bg-secondary); } :is(#skio-root, #skio-portal) .bg-bg-tertiary { background-color: var(--color-bg-tertiary); } :is(#skio-root, #skio-portal) .bg-brand-solid { background-color: var(--background-color-brand-solid); } :is(#skio-root, #skio-portal) .bg-button-bg-primary { background-color: var(--color-button-bg-primary); } :is(#skio-root, #skio-portal) .bg-button-bg-secondary { background-color: var(--color-button-bg-secondary); } :is(#skio-root, #skio-portal) .bg-button-bg-support { background-color: var(--color-button-bg-support); } :is(#skio-root, #skio-portal) .bg-disabled { background-color: var(--background-color-disabled); } :is(#skio-root, #skio-portal) .bg-fg-brand-primary { background-color: var(--color-fg-brand-primary); } :is(#skio-root, #skio-portal) .bg-overlay\/70 { background-color: rgba(10, 13, 18, 0.7); } @supports (color:color-mix(in lab,red,red)) { :is(#skio-root, #skio-portal) .bg-overlay\/70 { background-color: color-mix(in oklab,var(--background-color-overlay)70%,transparent); } } :is(#skio-root, #skio-portal) .bg-transparent { background-color: rgba(0, 0, 0, 0); } :is(#skio-root, #skio-portal) .bg-utility-brand-50 { background-color: var(--color-utility-brand-50); } :is(#skio-root, #skio-portal) .bg-utility-error-50 { background-color: var(--color-utility-error-50); } :is(#skio-root, #skio-portal) .bg-utility-gray-50 { background-color: var(--color-utility-gray-50); } :is(#skio-root, #skio-portal) .bg-utility-success-50 { background-color: var(--color-utility-success-50); } :is(#skio-root, #skio-portal) .bg-white { background-color: var(--color-white); } :is(#skio-root, #skio-portal) .bg-gradient-to-br { --tw-gradient-position: to bottom right in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); } :is(#skio-root, #skio-portal) .from-purple-100 { --tw-gradient-from: var(--color-purple-100); --tw-gradient-stops: var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position)); } :is(#skio-root, #skio-portal) .to-purple-50 { --tw-gradient-to: var(--color-purple-50); --tw-gradient-stops: var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position)); } :is(#skio-root, #skio-portal) .fill-current { fill: currentcolor; } :is(#skio-root, #skio-portal) .stroke-fg-brand-primary { stroke: var(--color-fg-brand-primary); } :is(#skio-root, #skio-portal) .stroke-3 { stroke-width: 3px; } :is(#skio-root, #skio-portal) .stroke-\[2\.5px\] { stroke-width: 2.5px; } :is(#skio-root, #skio-portal) .object-contain { object-fit: contain; } :is(#skio-root, #skio-portal) .object-cover { object-fit: cover; } :is(#skio-root, #skio-portal) .p-0 { padding: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .p-0\! { padding: calc(var(--spacing)*0) !important; } :is(#skio-root, #skio-portal) .p-2 { padding: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .p-3 { padding: calc(var(--spacing)*3); } :is(#skio-root, #skio-portal) .p-4 { padding: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .p-5 { padding: calc(var(--spacing)*5); } :is(#skio-root, #skio-portal) .p-6 { padding: calc(var(--spacing)*6); } :is(#skio-root, #skio-portal) .p-\[10px\] { padding: 10px; } :is(#skio-root, #skio-portal) .px-0 { padding-inline: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .px-0\.5 { padding-inline: calc(var(--spacing)*.5); } :is(#skio-root, #skio-portal) .px-1 { padding-inline: calc(var(--spacing)*1); } :is(#skio-root, #skio-portal) .px-1\.5 { padding-inline: calc(var(--spacing)*1.5); } :is(#skio-root, #skio-portal) .px-2 { padding-inline: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .px-2\.5 { padding-inline: calc(var(--spacing)*2.5); } :is(#skio-root, #skio-portal) .px-3 { padding-inline: calc(var(--spacing)*3); } :is(#skio-root, #skio-portal) .px-3\.5 { padding-inline: calc(var(--spacing)*3.5); } :is(#skio-root, #skio-portal) .px-4 { padding-inline: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .py-0\.5 { padding-block: calc(var(--spacing)*.5); } :is(#skio-root, #skio-portal) .py-1 { padding-block: calc(var(--spacing)*1); } :is(#skio-root, #skio-portal) .py-2 { padding-block: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .py-2\.5 { padding-block: calc(var(--spacing)*2.5); } :is(#skio-root, #skio-portal) .py-px { padding-block: 1px; } :is(#skio-root, #skio-portal) .pt-1 { padding-top: calc(var(--spacing)*1); } :is(#skio-root, #skio-portal) .pt-4 { padding-top: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .pt-5 { padding-top: calc(var(--spacing)*5); } :is(#skio-root, #skio-portal) .pr-1\.5 { padding-right: calc(var(--spacing)*1.5); } :is(#skio-root, #skio-portal) .pr-2\.5 { padding-right: calc(var(--spacing)*2.5); } :is(#skio-root, #skio-portal) .pr-3 { padding-right: calc(var(--spacing)*3); } :is(#skio-root, #skio-portal) .pr-7 { padding-right: calc(var(--spacing)*7); } :is(#skio-root, #skio-portal) .pb-0 { padding-bottom: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .pb-3 { padding-bottom: calc(var(--spacing)*3); } :is(#skio-root, #skio-portal) .pb-4 { padding-bottom: calc(var(--spacing)*4); } :is(#skio-root, #skio-portal) .pb-12 { padding-bottom: calc(var(--spacing)*12); } :is(#skio-root, #skio-portal) .pl-2 { padding-left: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .pl-2\.5 { padding-left: calc(var(--spacing)*2.5); } :is(#skio-root, #skio-portal) .pl-10 { padding-left: calc(var(--spacing)*10); } :is(#skio-root, #skio-portal) .text-center { text-align: center; } :is(#skio-root, #skio-portal) .text-left { text-align: left; } :is(#skio-root, #skio-portal) .text-right { text-align: right; } :is(#skio-root, #skio-portal) .align-middle { vertical-align: middle; } :is(#skio-root, #skio-portal) .text-display-md { font-size: var(--text-display-md); line-height: var(--tw-leading,var(--text-display-md--line-height)); letter-spacing: var(--tw-tracking,var(--text-display-md--letter-spacing)); } :is(#skio-root, #skio-portal) .text-2xl { font-size: var(--text-2xl); line-height: var(--tw-leading,var(--text-2xl--line-height)); } :is(#skio-root, #skio-portal) .text-base { font-size: var(--text-base); line-height: var(--tw-leading,var(--text-base--line-height)); } :is(#skio-root, #skio-portal) .text-display-xs { font-size: var(--text-display-xs); line-height: var(--tw-leading,var(--text-display-xs--line-height)); } :is(#skio-root, #skio-portal) .text-lg { font-size: var(--text-lg); line-height: var(--tw-leading,var(--text-lg--line-height)); } :is(#skio-root, #skio-portal) .text-md { font-size: var(--text-md); line-height: var(--tw-leading,var(--text-md--line-height)); } :is(#skio-root, #skio-portal) .text-sm { font-size: var(--text-sm); line-height: var(--tw-leading,var(--text-sm--line-height)); } :is(#skio-root, #skio-portal) .text-xs { font-size: var(--text-xs); line-height: var(--tw-leading,var(--text-xs--line-height)); } :is(#skio-root, #skio-portal) .leading-\[18px\] { --tw-leading: 18px; line-height: 18px; } :is(#skio-root, #skio-portal) .leading-\[20px\] { --tw-leading: 20px; line-height: 20px; } :is(#skio-root, #skio-portal) .leading-\[24px\] { --tw-leading: 24px; line-height: 24px; } :is(#skio-root, #skio-portal) .leading-\[normal\] { --tw-leading: normal; line-height: normal; } :is(#skio-root, #skio-portal) .leading-none { --tw-leading: 1; line-height: 1; } :is(#skio-root, #skio-portal) .leading-snug { --tw-leading: var(--leading-snug); line-height: var(--leading-snug); } :is(#skio-root, #skio-portal) .leading-tight { --tw-leading: var(--leading-tight); line-height: var(--leading-tight); } :is(#skio-root, #skio-portal) .font-bold { --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } :is(#skio-root, #skio-portal) .font-medium { --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } :is(#skio-root, #skio-portal) .font-normal { --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); } :is(#skio-root, #skio-portal) .font-semibold { --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); } :is(#skio-root, #skio-portal) .tracking-\[0\.6px\] { --tw-tracking: .6px; letter-spacing: 0.6px; } :is(#skio-root, #skio-portal) .tracking-\[1px\] { --tw-tracking: 1px; letter-spacing: 1px; } :is(#skio-root, #skio-portal) .break-words { overflow-wrap: break-word; } :is(#skio-root, #skio-portal) .whitespace-nowrap { white-space: nowrap; } :is(#skio-root, #skio-portal) .whitespace-pre { white-space: pre; } :is(#skio-root, #skio-portal) .whitespace-pre-wrap { white-space: pre-wrap; } :is(#skio-root, #skio-portal) .text-bg-tertiary { color: var(--color-bg-tertiary); } :is(#skio-root, #skio-portal) .text-brand-500 { color: var(--color-brand-500); } :is(#skio-root, #skio-portal) .text-brand-secondary { color: var(--text-color-brand-secondary); } :is(#skio-root, #skio-portal) .text-brand-tertiary { color: var(--text-color-brand-tertiary); } :is(#skio-root, #skio-portal) .text-button-text-primary { color: var(--color-button-text-primary); } :is(#skio-root, #skio-portal) .text-button-text-secondary { color: var(--color-button-text-secondary); } :is(#skio-root, #skio-portal) .text-button-text-support { color: var(--color-button-text-support); } :is(#skio-root, #skio-portal) .text-disabled { color: var(--text-color-disabled); } :is(#skio-root, #skio-portal) .text-fg-brand-primary { color: var(--color-fg-brand-primary); } :is(#skio-root, #skio-portal) .text-fg-quaternary { color: var(--color-fg-quaternary); } :is(#skio-root, #skio-portal) .text-fg-secondary { color: var(--color-fg-secondary); } :is(#skio-root, #skio-portal) .text-gray-700 { color: var(--color-gray-700); } :is(#skio-root, #skio-portal) .text-placeholder { color: var(--text-color-placeholder); } :is(#skio-root, #skio-portal) .text-secondary { color: var(--text-color-secondary); } :is(#skio-root, #skio-portal) .text-secondary_hover { color: var(--text-color-secondary_hover); } :is(#skio-root, #skio-portal) .text-success { color: var(--color-success); } :is(#skio-root, #skio-portal) .text-tertiary { color: var(--text-color-tertiary); } :is(#skio-root, #skio-portal) .text-text-general { color: var(--color-text-general); } :is(#skio-root, #skio-portal) .text-text-heading { color: var(--color-text-heading); } :is(#skio-root, #skio-portal) .text-text-link { color: var(--color-text-link); } :is(#skio-root, #skio-portal) .text-text-tertiary { color: var(--color-text-tertiary); } :is(#skio-root, #skio-portal) .text-utility-brand-700 { color: var(--color-utility-brand-700); } :is(#skio-root, #skio-portal) .text-utility-error-700 { color: var(--color-utility-error-700); } :is(#skio-root, #skio-portal) .text-utility-gray-600 { color: var(--color-utility-gray-600); } :is(#skio-root, #skio-portal) .text-utility-gray-700 { color: var(--color-utility-gray-700); } :is(#skio-root, #skio-portal) .text-utility-success-500 { color: var(--color-utility-success-500); } :is(#skio-root, #skio-portal) .text-white { color: var(--color-white); } :is(#skio-root, #skio-portal) .uppercase { text-transform: uppercase; } :is(#skio-root, #skio-portal) .tabular-nums { --tw-numeric-spacing: tabular-nums; font-variant-numeric: var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,); } :is(#skio-root, #skio-portal) .line-through { text-decoration-line: line-through; } :is(#skio-root, #skio-portal) .underline { text-decoration-line: underline; } :is(#skio-root, #skio-portal) .decoration-dotted { text-decoration-style: dotted; } :is(#skio-root, #skio-portal) .decoration-from-font { text-decoration-thickness: from-font; } :is(#skio-root, #skio-portal) .underline-offset-6 { text-underline-offset: 6px; } :is(#skio-root, #skio-portal) .opacity-0 { opacity: 0; } :is(#skio-root, #skio-portal) .opacity-50 { opacity: 0.5; } :is(#skio-root, #skio-portal) .shadow-lg { --tw-shadow: 0px 12px 16px -4px var(--tw-shadow-color,#0a0d1214),0px 4px 6px -2px var(--tw-shadow-color,#0a0d1208),0px 2px 2px -1px var(--tw-shadow-color,#0a0d120a); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .shadow-none { --tw-shadow: 0 0 #0000; box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .shadow-xl { --tw-shadow: 0px 20px 24px -4px var(--tw-shadow-color,#0a0d1214),0px 8px 8px -4px var(--tw-shadow-color,#0a0d1208),0px 3px 3px -1.5px var(--tw-shadow-color,#0a0d120a); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .shadow-xs { --tw-shadow: 0px 1px 2px var(--tw-shadow-color,#0a0d120d); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .shadow-xs-skeumorphic { --tw-shadow: var(--shadow-skeumorphic),var(--shadow-xs); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .\!ring-0 { --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor) !important; box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow) !important; } :is(#skio-root, #skio-portal) .ring-0 { --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .ring-1 { --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .ring-2 { --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .ring-focus-area { --tw-ring-color: var(--color-focus-area); } :is(#skio-root, #skio-portal) .ring-primary { --tw-ring-color: var(--ring-color-primary); } :is(#skio-root, #skio-portal) .ring-secondary_alt { --tw-ring-color: var(--ring-color-secondary_alt); } :is(#skio-root, #skio-portal) .ring-transparent { --tw-ring-color: transparent; } :is(#skio-root, #skio-portal) .ring-utility-brand-200 { --tw-ring-color: var(--color-utility-brand-200); } :is(#skio-root, #skio-portal) .ring-utility-error-200 { --tw-ring-color: var(--color-utility-error-200); } :is(#skio-root, #skio-portal) .ring-utility-gray-200 { --tw-ring-color: var(--color-utility-gray-200); } :is(#skio-root, #skio-portal) .ring-utility-success-200 { --tw-ring-color: var(--color-utility-success-200); } :is(#skio-root, #skio-portal) .outline-hidden { --tw-outline-style: none; outline-style: none; } @media (forced-colors: active) { :is(#skio-root, #skio-portal) .outline-hidden { outline-offset: 2px; outline: rgba(0, 0, 0, 0) solid 2px; } } :is(#skio-root, #skio-portal) .outline-brand { outline-color: var(--outline-color-brand); } :is(#skio-root, #skio-portal) .outline-focus-ring { outline-color: var(--color-focus-ring); } :is(#skio-root, #skio-portal) .backdrop-blur-\[6px\] { --tw-backdrop-blur: blur(6px); backdrop-filter: var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,); } :is(#skio-root, #skio-portal) .transition { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); } :is(#skio-root, #skio-portal) .transition-\[color\,box-shadow\] { transition-property: color, box-shadow; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); } :is(#skio-root, #skio-portal) .transition-all { transition-property: all; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); } :is(#skio-root, #skio-portal) .transition-inherit-all { transition-property: inherit; transition-duration: inherit; transition-timing-function: inherit; } :is(#skio-root, #skio-portal) .transition-shadow { transition-property: box-shadow; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); } :is(#skio-root, #skio-portal) .duration-100 { --tw-duration: .1s; transition-duration: 0.1s; } :is(#skio-root, #skio-portal) .duration-200 { --tw-duration: .2s; transition-duration: 0.2s; } :is(#skio-root, #skio-portal) .ease-linear { --tw-ease: linear; transition-timing-function: linear; } :is(#skio-root, #skio-portal) .will-change-transform { will-change: transform; } :is(#skio-root, #skio-portal) .outline-none { --tw-outline-style: none; outline-style: none; } :is(#skio-root, #skio-portal) .select-none { user-select: none; } :is(#skio-root, #skio-portal) .duration-100 { animation-duration: 0.1s; } :is(#skio-root, #skio-portal) .duration-200 { animation-duration: 0.2s; } :is(#skio-root, #skio-portal) .ease-linear { animation-timing-function: linear; } :is(#skio-root, #skio-portal) .ring-inset { --tw-ring-inset: inset; } :is(#skio-root, #skio-portal) .group-required\:block:is(:where(.group):where(:not([data-rac])):required *), :is(#skio-root, #skio-portal) .group-required\:block:is(:where(.group):where([data-rac])[data-required] *) { display: block; } :is(#skio-root, #skio-portal) .group-invalid\:ring-error_subtle:is(:where(.group):where(:not([data-rac])):invalid *), :is(#skio-root, #skio-portal) .group-invalid\:ring-error_subtle:is(:where(.group):where([data-rac])[data-invalid] *) { --tw-ring-color: var(--ring-color-error_subtle); } :is(#skio-root, #skio-portal) .group-hover\:bg-bg-primary:is(:where(.group):where([data-rac])[data-hovered] *) { background-color: var(--color-bg-primary); } :is(#skio-root, #skio-portal) .group-disabled\:cursor-not-allowed:is(:where(.group):where(:not([data-rac])):disabled *), :is(#skio-root, #skio-portal) .group-disabled\:cursor-not-allowed:is(:where(.group):where([data-rac])[data-disabled] *) { cursor: not-allowed; } :is(#skio-root, #skio-portal) .group-disabled\:bg-disabled_subtle:is(:where(.group):where(:not([data-rac])):disabled *), :is(#skio-root, #skio-portal) .group-disabled\:bg-disabled_subtle:is(:where(.group):where([data-rac])[data-disabled] *) { background-color: var(--background-color-disabled_subtle); } :is(#skio-root, #skio-portal) .group-disabled\:ring-disabled:is(:where(.group):where(:not([data-rac])):disabled *), :is(#skio-root, #skio-portal) .group-disabled\:ring-disabled:is(:where(.group):where([data-rac])[data-disabled] *) { --tw-ring-color: var(--ring-color-disabled); } :is(#skio-root, #skio-portal) .placeholder\:text-fg-quaternary::placeholder { color: var(--color-fg-quaternary); } :is(#skio-root, #skio-portal) .placeholder\:text-placeholder::placeholder { color: var(--text-color-placeholder); } :is(#skio-root, #skio-portal) .before\:pointer-events-none::before { content: var(--tw-content); pointer-events: none; } :is(#skio-root, #skio-portal) .before\:absolute::before { content: var(--tw-content); position: absolute; } :is(#skio-root, #skio-portal) .before\:inset-0::before { content: var(--tw-content); inset: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .before\:inset-px::before { content: var(--tw-content); inset: 1px; } :is(#skio-root, #skio-portal) .before\:z-1::before { content: var(--tw-content); z-index: 1; } :is(#skio-root, #skio-portal) .before\:rounded-\[7px\]::before { content: var(--tw-content); border-radius: 7px; } :is(#skio-root, #skio-portal) .before\:rounded-\[inherit\]::before { content: var(--tw-content); border-radius: inherit; } :is(#skio-root, #skio-portal) .before\:border::before { content: var(--tw-content); border-style: var(--tw-border-style); border-width: 1px; } :is(#skio-root, #skio-portal) .before\:border-white\/12::before { content: var(--tw-content); border-color: rgba(255, 255, 255, 0.12); } @supports (color:color-mix(in lab,red,red)) { :is(#skio-root, #skio-portal) .before\:border-white\/12::before { border-color: color-mix(in oklab,var(--color-white)12%,transparent); } } :is(#skio-root, #skio-portal) .before\:mask-b-from-0\%::before { content: var(--tw-content); mask-image: var(--tw-mask-linear),var(--tw-mask-radial),var(--tw-mask-conic); --tw-mask-linear: var(--tw-mask-left),var(--tw-mask-right),var(--tw-mask-bottom),var(--tw-mask-top); --tw-mask-bottom: linear-gradient(to bottom,var(--tw-mask-bottom-from-color)var(--tw-mask-bottom-from-position),var(--tw-mask-bottom-to-color)var(--tw-mask-bottom-to-position)); --tw-mask-bottom-from-position: 0%; mask-composite: intersect; } :is(#skio-root, #skio-portal) .before\:mask-linear-135::before { content: var(--tw-content); mask-image: var(--tw-mask-linear),var(--tw-mask-radial),var(--tw-mask-conic); --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops,var(--tw-mask-linear-position))); --tw-mask-linear-position: calc(1deg*135); mask-composite: intersect; } :is(#skio-root, #skio-portal) .before\:mask-linear-to-white\/20::before { content: var(--tw-content); mask-image: var(--tw-mask-linear),var(--tw-mask-radial),var(--tw-mask-conic); --tw-mask-linear-stops: var(--tw-mask-linear-position),var(--tw-mask-linear-from-color)var(--tw-mask-linear-from-position),var(--tw-mask-linear-to-color)var(--tw-mask-linear-to-position); --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops)); --tw-mask-linear-to-color: #fff3; mask-composite: intersect; } @supports (color:color-mix(in lab,red,red)) { :is(#skio-root, #skio-portal) .before\:mask-linear-to-white\/20::before { --tw-mask-linear-to-color: color-mix(in oklab,var(--color-white)20%,transparent); } } :is(#skio-root, #skio-portal) .before\:ring-1::before { content: var(--tw-content); --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .before\:ring-black\/10::before { content: var(--tw-content); --tw-ring-color: #0000001a; } @supports (color:color-mix(in lab,red,red)) { :is(#skio-root, #skio-portal) .before\:ring-black\/10::before { --tw-ring-color: color-mix(in oklab,var(--color-black)10%,transparent); } } :is(#skio-root, #skio-portal) .before\:ring-inset::before { content: var(--tw-content); --tw-ring-inset: inset; } :is(#skio-root, #skio-portal) .autofill\:rounded-border-radius:autofill { border-radius: var(--radius-border-radius); } :is(#skio-root, #skio-portal) .autofill\:text-text-heading:autofill { color: var(--color-text-heading); } :is(#skio-root, #skio-portal) .empty\:hidden:where(:not([data-rac])):empty, :is(#skio-root, #skio-portal) .empty\:hidden:where([data-rac])[data-empty] { display: none; } @media (hover: hover) { :is(#skio-root, #skio-portal) .hover\:bg-brand-solid_hover:where(:not([data-rac])):hover { background-color: var(--background-color-brand-solid_hover); } } :is(#skio-root, #skio-portal) .hover\:bg-button-bg-primary\/90:where([data-rac])[data-hovered] { background-color: rgba(32, 0, 57, 0.9); } @supports (color:color-mix(in lab,red,red)) { :is(#skio-root, #skio-portal) .hover\:bg-button-bg-primary\/90:where([data-rac])[data-hovered] { background-color: color-mix(in oklab,var(--color-button-bg-primary)90%,transparent); } } :is(#skio-root, #skio-portal) .hover\:bg-button-bg-primary_hover:where([data-rac])[data-hovered] { background-color: var(--color-button-bg-primary_hover); } :is(#skio-root, #skio-portal) .hover\:bg-button-bg-secondary_hover:where([data-rac])[data-hovered] { background-color: var(--color-button-bg-secondary_hover); } :is(#skio-root, #skio-portal) .hover\:bg-button-bg-support_hover:where([data-rac])[data-hovered] { background-color: var(--color-button-bg-support_hover); } :is(#skio-root, #skio-portal) .hover\:bg-primary_hover:where([data-rac])[data-hovered] { background-color: var(--background-color-primary_hover); } @media (hover: hover) { :is(#skio-root, #skio-portal) .hover\:bg-primary_hover:where(:not([data-rac])):hover { background-color: var(--background-color-primary_hover); } } @media (hover: hover) { :is(#skio-root, #skio-portal) .hover\:bg-secondary_hover:where(:not([data-rac])):hover { background-color: var(--background-color-secondary_hover); } } @media (hover: hover) { :is(#skio-root, #skio-portal) .hover\:font-medium\!:where(:not([data-rac])):hover { --tw-font-weight: var(--font-weight-medium) !important; font-weight: var(--font-weight-medium) !important; } } :is(#skio-root, #skio-portal) .hover\:text-brand-secondary_hover:where([data-rac])[data-hovered] { color: var(--text-color-brand-secondary_hover); } :is(#skio-root, #skio-portal) .hover\:text-fg-quaternary_hover:where([data-rac])[data-hovered] { color: var(--color-fg-quaternary_hover); } @media (hover: hover) { :is(#skio-root, #skio-portal) .hover\:text-secondary_hover:where(:not([data-rac])):hover { color: var(--text-color-secondary_hover); } } :is(#skio-root, #skio-portal) .hover\:text-tertiary_hover:where([data-rac])[data-hovered] { color: var(--text-color-tertiary_hover); } @media (hover: hover) { :is(#skio-root, #skio-portal) .hover\:text-white:where(:not([data-rac])):hover { color: var(--color-white); } } @media (hover: hover) { :is(#skio-root, #skio-portal) .hover\:shadow-xs:where(:not([data-rac])):hover { --tw-shadow: 0px 1px 2px var(--tw-shadow-color,#0a0d120d); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } } :is(#skio-root, #skio-portal) .hover\:outline-none:where([data-rac])[data-hovered] { --tw-outline-style: none; outline-style: none; } :is(#skio-root, #skio-portal) .focus\:outline-none:where(:not([data-rac])):focus, :is(#skio-root, #skio-portal) .focus\:outline-none:where([data-rac])[data-focused] { --tw-outline-style: none; outline-style: none; } :is(#skio-root, #skio-portal) .focus-visible\:ring-2:where(:not([data-rac])):focus-visible, :is(#skio-root, #skio-portal) .focus-visible\:ring-2:where([data-rac])[data-focus-visible] { --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .focus-visible\:ring-\[3px\]:where(:not([data-rac])):focus-visible, :is(#skio-root, #skio-portal) .focus-visible\:ring-\[3px\]:where([data-rac])[data-focus-visible] { --tw-ring-shadow: var(--tw-ring-inset,)0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .focus-visible\:ring-brand:where(:not([data-rac])):focus-visible, :is(#skio-root, #skio-portal) .focus-visible\:ring-brand:where([data-rac])[data-focus-visible] { --tw-ring-color: var(--ring-color-brand); } :is(#skio-root, #skio-portal) .focus-visible\:outline-2:where(:not([data-rac])):focus-visible, :is(#skio-root, #skio-portal) .focus-visible\:outline-2:where([data-rac])[data-focus-visible] { outline-style: var(--tw-outline-style); outline-width: 2px; } :is(#skio-root, #skio-portal) .focus-visible\:outline-offset-2:where(:not([data-rac])):focus-visible, :is(#skio-root, #skio-portal) .focus-visible\:outline-offset-2:where([data-rac])[data-focus-visible] { outline-offset: 2px; } :is(#skio-root, #skio-portal) .focus-visible\:outline-none:where(:not([data-rac])):focus-visible, :is(#skio-root, #skio-portal) .focus-visible\:outline-none:where([data-rac])[data-focus-visible] { --tw-outline-style: none; outline-style: none; } :is(#skio-root, #skio-portal) .disabled\:cursor-not-allowed:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:cursor-not-allowed:where([data-rac])[data-disabled] { cursor: not-allowed; } :is(#skio-root, #skio-portal) .disabled\:bg-bg-disabled_subtle:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:bg-bg-disabled_subtle:where([data-rac])[data-disabled] { background-color: var(--color-bg-disabled_subtle); } :is(#skio-root, #skio-portal) .disabled\:bg-button-bg-primary\/40:where([data-rac])[data-disabled] { background-color: rgba(32, 0, 57, 0.4); } @supports (color:color-mix(in lab,red,red)) { :is(#skio-root, #skio-portal) .disabled\:bg-button-bg-primary\/40:where([data-rac])[data-disabled] { background-color: color-mix(in oklab,var(--color-button-bg-primary)40%,transparent); } } :is(#skio-root, #skio-portal) .disabled\:bg-disabled:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:bg-disabled:where([data-rac])[data-disabled] { background-color: var(--background-color-disabled); } :is(#skio-root, #skio-portal) .disabled\:bg-transparent:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:bg-transparent:where([data-rac])[data-disabled] { background-color: rgba(0, 0, 0, 0); } :is(#skio-root, #skio-portal) .disabled\:text-disabled:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:text-disabled:where([data-rac])[data-disabled] { color: var(--text-color-disabled); } :is(#skio-root, #skio-portal) .disabled\:text-fg-disabled:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:text-fg-disabled:where([data-rac])[data-disabled] { color: var(--color-fg-disabled); } :is(#skio-root, #skio-portal) .disabled\:opacity-50:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:opacity-50:where([data-rac])[data-disabled] { opacity: 0.5; } :is(#skio-root, #skio-portal) .disabled\:shadow-xs:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:shadow-xs:where([data-rac])[data-disabled] { --tw-shadow: 0px 1px 2px var(--tw-shadow-color,#0a0d120d); box-shadow: var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow); } :is(#skio-root, #skio-portal) .disabled\:ring-disabled_subtle:where(:not([data-rac])):disabled, :is(#skio-root, #skio-portal) .disabled\:ring-disabled_subtle:where([data-rac])[data-disabled] { --tw-ring-color: var(--ring-color-disabled_subtle); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:pointer-events-none > *)[data-icon] { pointer-events: none; } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:size-3\.5 > *)[data-icon] { width: calc(var(--spacing)*3.5); height: calc(var(--spacing)*3.5); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:size-5 > *)[data-icon] { width: calc(var(--spacing)*5); height: calc(var(--spacing)*5); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:shrink-0 > *)[data-icon] { flex-shrink: 0; } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:text-button-text-primary > *)[data-icon] { color: var(--color-button-text-primary); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:text-button-text-secondary > *)[data-icon] { color: var(--color-button-text-secondary); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:text-button-text-support > *)[data-icon] { color: var(--color-button-text-support); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:text-tertiary > *)[data-icon] { color: var(--text-color-tertiary); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:text-text-link > *)[data-icon] { color: var(--color-text-link); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:text-white > *)[data-icon] { color: var(--color-white); } :is(:is(#skio-root, #skio-portal) .\*\:data-icon\:transition-inherit-all > *)[data-icon] { transition-property: inherit; transition-duration: inherit; transition-timing-function: inherit; } :is(:is(#skio-root, #skio-portal) .hover\:\*\:data-icon\:text-brand-secondary_hover:where([data-rac])[data-hovered] > *)[data-icon] { color: var(--text-color-brand-secondary_hover); } :is(:is(#skio-root, #skio-portal) .hover\:\*\:data-icon\:text-tertiary_hover:where([data-rac])[data-hovered] > *)[data-icon] { color: var(--text-color-tertiary_hover); } :is(:is(#skio-root, #skio-portal) .disabled\:\*\:data-icon\:text-fg-disabled_subtle:where(:not([data-rac])):disabled > *)[data-icon], :is(:is(#skio-root, #skio-portal) .disabled\:\*\:data-icon\:text-fg-disabled_subtle:where([data-rac])[data-disabled] > *)[data-icon] { color: var(--color-fg-disabled_subtle); } :is(#skio-root, #skio-portal) .data-icon-only\:p-2[data-icon-only] { padding: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .data-loading\:bg-button-bg-primary_hover[data-loading] { background-color: var(--color-button-bg-primary_hover); } :is(#skio-root, #skio-portal) .data-loading\:bg-button-bg-secondary_hover[data-loading] { background-color: var(--color-button-bg-secondary_hover); } :is(#skio-root, #skio-portal) .data-loading\:bg-button-bg-support_hover[data-loading] { background-color: var(--color-button-bg-support_hover); } :is(#skio-root, #skio-portal) .data-loading\:bg-primary_hover[data-loading] { background-color: var(--background-color-primary_hover); } :is(:is(#skio-root, #skio-portal) .\*\:data-text\:no-underline > *)[data-text] { text-decoration-line: none; } :is(:is(#skio-root, #skio-portal) .focus-visible\:\*\:data-text\:underline:where(:not([data-rac])):focus-visible > *)[data-text], :is(:is(#skio-root, #skio-portal) .focus-visible\:\*\:data-text\:underline:where([data-rac])[data-focus-visible] > *)[data-text] { text-decoration-line: underline; } @media not all and (min-width: 40rem) { :is(#skio-root, #skio-portal) .max-sm\:overflow-y-auto { overflow-y: auto; } :is(#skio-root, #skio-portal) .max-sm\:rounded-xl { border-radius: var(--radius-xl); } :is(#skio-root, #skio-portal) .max-sm\:rounded-b-none { border-bottom-right-radius: var(--radius-none); border-bottom-left-radius: var(--radius-none); } } @media (min-width: 40rem) { :is(#skio-root, #skio-portal) .sm\:bottom-1 { bottom: calc(var(--spacing)*1); } :is(#skio-root, #skio-portal) .sm\:col-start-2 { grid-column-start: 2; } :is(#skio-root, #skio-portal) .sm\:col-end-3 { grid-column-end: 3; } :is(#skio-root, #skio-portal) .sm\:row-end-3 { grid-row-end: 3; } :is(#skio-root, #skio-portal) .sm\:block { display: block; } :is(#skio-root, #skio-portal) .sm\:grid { display: grid; } :is(#skio-root, #skio-portal) .sm\:h-\[90vh\] { height: 90vh; } :is(#skio-root, #skio-portal) .sm\:h-\[124px\] { height: 124px; } :is(#skio-root, #skio-portal) .sm\:max-h-\[2\.5rem\] { max-height: 2.5rem; } :is(#skio-root, #skio-portal) .sm\:max-h-\[90vh\] { max-height: 90vh; } :is(#skio-root, #skio-portal) .sm\:max-h-\[95vh\] { max-height: 95vh; } :is(#skio-root, #skio-portal) .sm\:min-h-\[350px\] { min-height: 350px; } :is(#skio-root, #skio-portal) .sm\:w-\[114px\] { width: 114px; } :is(#skio-root, #skio-portal) .sm\:max-w-\[2\.5rem\] { max-width: 2.5rem; } :is(#skio-root, #skio-portal) .sm\:max-w-\[600px\] { max-width: 600px; } :is(#skio-root, #skio-portal) .sm\:grid-cols-\[auto_1fr\] { grid-template-columns: auto 1fr; } :is(#skio-root, #skio-portal) .sm\:flex-row { flex-direction: row; } :is(#skio-root, #skio-portal) .sm\:items-center { align-items: center; } :is(#skio-root, #skio-portal) .sm\:items-start { align-items: flex-start; } :is(#skio-root, #skio-portal) .sm\:justify-between { justify-content: space-between; } :is(#skio-root, #skio-portal) .sm\:justify-center { justify-content: center; } :is(#skio-root, #skio-portal) .sm\:justify-end { justify-content: flex-end; } :is(#skio-root, #skio-portal) .sm\:gap-2 { gap: calc(var(--spacing)*2); } :is(#skio-root, #skio-portal) .sm\:p-8 { padding: calc(var(--spacing)*8); } } @media (min-width: 48rem) { :is(#skio-root, #skio-portal) .md\:grid { display: grid; } :is(#skio-root, #skio-portal) .md\:hidden { display: none; } :is(#skio-root, #skio-portal) .md\:grid-cols-\[minmax\(0\,3fr\)_minmax\(0\,2fr\)\] { grid-template-columns: minmax(0px, 3fr) minmax(0px, 2fr); } :is(#skio-root, #skio-portal) .md\:grid-rows-\[repeat\(var\(--skio-upsell-card-rows\)\,1fr\)\] { grid-template-rows: repeat(var(--skio-upsell-card-rows),1fr); } :is(#skio-root, #skio-portal) .md\:border-cpv3 { border-style: var(--tw-border-style); border-width: var(--border-width-cpv3); } :is(#skio-root, #skio-portal) .md\:border-border-primary { border-color: var(--color-border-primary); } } @media (min-width: 64rem) { :is(#skio-root, #skio-portal) .lg\:h-\[124px\] { height: 124px; } :is(#skio-root, #skio-portal) .lg\:w-\[114px\] { width: 114px; } :is(#skio-root, #skio-portal) .lg\:min-w-\[1000px\] { min-width: 1000px; } :is(#skio-root, #skio-portal) .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0px, 1fr)); } :is(#skio-root, #skio-portal) .lg\:text-base { font-size: var(--text-base); line-height: var(--tw-leading,var(--text-base--line-height)); } } :is(#skio-root, #skio-portal) .\[\&_p\]\:text-sm p { font-size: var(--text-sm); line-height: var(--tw-leading,var(--text-sm--line-height)); } :is(#skio-root, #skio-portal) .\[\&_p\]\:text-text-link p, :is(#skio-root, #skio-portal) .\[\&_svg\]\:text-text-link svg { color: var(--color-text-link); } :is(#skio-root, #skio-portal) .\[\&_td\]\:p-0 td { padding: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .\[\&_tr\]\:border-b-4 tr { border-bottom-style: var(--tw-border-style); border-bottom-width: 4px; } :is(#skio-root, #skio-portal) .\[\&_tr\]\:border-transparent tr { border-color: rgba(0, 0, 0, 0); } :is(#skio-root, #skio-portal) .\[\&_tr\:last-of-type\]\:border-none tr:last-of-type { --tw-border-style: none; border-style: none; } :is(#skio-root, #skio-portal) .\[\&\>span\]\:p-0 > span { padding: calc(var(--spacing)*0); } :is(#skio-root, #skio-portal) .\[\&\[data-focused\]_p\]\:underline[data-focused] p { text-decoration-line: underline; } #skio-root { margin: 0px; } body, html { -webkit-font-smoothing: antialiased; font-variant-ligatures: contextual; font-kerning: normal; color: var(--color-text-general); } input::-webkit-inner-spin-button, input::-webkit-outer-spin-button { appearance: none; margin: 0px; } html { scrollbar-gutter: stable; } #skio-root :empty { display: block; } #skio-root { justify-content: center; width: 100%; min-height: 100vh; display: flex; overflow-y: auto; } #skio-portal * [role="dialog"] { outline-offset: 0px; box-shadow: none; outline: none; } #skio-portal .grid, #skio-root .grid { grid-template-areas: none !important; display: grid !important; } [id="skio-portal"] .flex, [id="skio-root"] .flex { flex-flow: row; } #skio-portal img[loading="lazy"], #skio-root img[loading="lazy"] { opacity: 1; } @keyframes enter { 0% { opacity: var(--tw-enter-opacity,1); transform: translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0)); } } @keyframes exit { 100% { opacity: var(--tw-exit-opacity,1); transform: translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0)scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0)); } } @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-scale-x { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-scale-y { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-scale-z { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-rotate-x { syntax: "*"; inherits: false; } @property --tw-rotate-y { syntax: "*"; inherits: false; } @property --tw-rotate-z { syntax: "*"; inherits: false; } @property --tw-skew-x { syntax: "*"; inherits: false; } @property --tw-skew-y { syntax: "*"; inherits: false; } @property --tw-scroll-snap-strictness { syntax: "*"; inherits: false; initial-value: proximity; } @property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-gradient-position { syntax: "*"; inherits: false; } @property --tw-gradient-from { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-via { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-to { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-stops { syntax: "*"; inherits: false; } @property --tw-gradient-via-stops { syntax: "*"; inherits: false; } @property --tw-gradient-from-position { syntax: ""; inherits: false; initial-value: 0; } @property --tw-gradient-via-position { syntax: ""; inherits: false; initial-value: 50%; } @property --tw-gradient-to-position { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-leading { syntax: "*"; inherits: false; } @property --tw-font-weight { syntax: "*"; inherits: false; } @property --tw-tracking { syntax: "*"; inherits: false; } @property --tw-ordinal { syntax: "*"; inherits: false; } @property --tw-slashed-zero { syntax: "*"; inherits: false; } @property --tw-numeric-figure { syntax: "*"; inherits: false; } @property --tw-numeric-spacing { syntax: "*"; inherits: false; } @property --tw-numeric-fraction { syntax: "*"; inherits: false; } @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-shadow-color { syntax: "*"; inherits: false; } @property --tw-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-inset-shadow-color { syntax: "*"; inherits: false; } @property --tw-inset-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-ring-color { syntax: "*"; inherits: false; } @property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-inset-ring-color { syntax: "*"; inherits: false; } @property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-ring-inset { syntax: "*"; inherits: false; } @property --tw-ring-offset-width { syntax: ""; inherits: false; initial-value: 0; } @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; } @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-blur { syntax: "*"; inherits: false; } @property --tw-brightness { syntax: "*"; inherits: false; } @property --tw-contrast { syntax: "*"; inherits: false; } @property --tw-grayscale { syntax: "*"; inherits: false; } @property --tw-hue-rotate { syntax: "*"; inherits: false; } @property --tw-invert { syntax: "*"; inherits: false; } @property --tw-opacity { syntax: "*"; inherits: false; } @property --tw-saturate { syntax: "*"; inherits: false; } @property --tw-sepia { syntax: "*"; inherits: false; } @property --tw-drop-shadow { syntax: "*"; inherits: false; } @property --tw-drop-shadow-color { syntax: "*"; inherits: false; } @property --tw-drop-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-drop-shadow-size { syntax: "*"; inherits: false; } @property --tw-backdrop-blur { syntax: "*"; inherits: false; } @property --tw-backdrop-brightness { syntax: "*"; inherits: false; } @property --tw-backdrop-contrast { syntax: "*"; inherits: false; } @property --tw-backdrop-grayscale { syntax: "*"; inherits: false; } @property --tw-backdrop-hue-rotate { syntax: "*"; inherits: false; } @property --tw-backdrop-invert { syntax: "*"; inherits: false; } @property --tw-backdrop-opacity { syntax: "*"; inherits: false; } @property --tw-backdrop-saturate { syntax: "*"; inherits: false; } @property --tw-backdrop-sepia { syntax: "*"; inherits: false; } @property --tw-duration { syntax: "*"; inherits: false; } @property --tw-ease { syntax: "*"; inherits: false; } @property --tw-text-shadow-color { syntax: "*"; inherits: false; } @property --tw-text-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-content { syntax: "*"; inherits: false; initial-value: ""; } @property --tw-mask-linear { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff,#fff); } @property --tw-mask-radial { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff,#fff); } @property --tw-mask-conic { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff,#fff); } @property --tw-mask-left { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff,#fff); } @property --tw-mask-right { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff,#fff); } @property --tw-mask-bottom { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff,#fff); } @property --tw-mask-top { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff,#fff); } @property --tw-mask-bottom-from-position { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-mask-bottom-to-position { syntax: "*"; inherits: false; initial-value: 100%; } @property --tw-mask-bottom-from-color { syntax: "*"; inherits: false; initial-value: black; } @property --tw-mask-bottom-to-color { syntax: "*"; inherits: false; initial-value: transparent; } @property --tw-mask-linear-position { syntax: "*"; inherits: false; initial-value: 0deg; } @property --tw-mask-linear-from-position { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-mask-linear-to-position { syntax: "*"; inherits: false; initial-value: 100%; } @property --tw-mask-linear-from-color { syntax: "*"; inherits: false; initial-value: black; } @property --tw-mask-linear-to-color { syntax: "*"; inherits: false; initial-value: transparent; } @keyframes spin { 100% { transform: rotate(1turn); } } @keyframes pulse { 50% { opacity: 0.5; } } @keyframes bounce { 0%, 100% { animation-timing-function: cubic-bezier(0.8, 0, 1, 1); transform: translateY(-25%); } 50% { animation-timing-function: cubic-bezier(0, 0, 0.2, 1); transform: none; } } @keyframes caret-blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } } /* ---- run-time states (from Skio's stylesheet) ---- */ :is(#skio-root,#skio-portal) .ring-brand{--tw-ring-color:var(--ring-color-brand)} :is(#skio-root,#skio-portal) .ring-2{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)} :is(#skio-root,#skio-portal) .bg-utility-brand-50{background-color:var(--color-utility-brand-50)} :is(#skio-root,#skio-portal) .text-utility-brand-700{color:var(--color-utility-brand-700)} :is(#skio-root,#skio-portal) .ring-utility-brand-200{--tw-ring-color:var(--color-utility-brand-200)} :is(#skio-root,#skio-portal) .text-success{color:var(--color-success)} /* computed :root values on the live page */ :root { --animate-bounce: bounce 1s infinite; --animate-caret-blink: caret-blink 1s infinite; --animate-pulse: pulse 2s cubic-bezier(.4,0,.6,1)infinite; --animate-spin: spin 1s linear infinite; --aspect-video: 16/9; --background-color-active: hsl(0, 0%, 95%); --background-color-brand-secondary: hsl(37, 55%, 98%); --background-color-brand-solid: hsl(32, 100%, 55%); --background-color-disabled: #f5f5f5; --background-color-error-primary: #fef3f2; --background-color-error-secondary: #fee4e2; --background-color-error-solid: #d92d20; --background-color-overlay: #0a0d12; --background-color-primary: #f7f9ee; --background-color-primary-solid: #0a0d12; --background-color-quaternary: #e9eaeb; --background-color-secondary: #FFFFFF; --background-color-secondary-solid: #535862; --background-color-success-secondary: hsl(151, 59%, 87%); --background-color-success-solid: hsl(150, 78%, 39%); --background-color-tertiary: #F5F5F5; --background-color-warning-secondary: #fef0c7; --background-color-warning-solid: #dc6803; --base-font-size: calc(4*4px*1); --base-unit: 4px; --blur-3xl: 64px; --blur-md: 12px; --blur-sm: 8px; --blur-xs: 4px; --border-color-brand: hsl(32, 91%, 72%); --border-color-disabled: #d5d7da; --border-color-error: #f04438; --border-color-primary: #E9EAEB; --border-color-secondary: #e9eaeb; --border-width-cpv3: 1px; --color-alpha-black: #000; --color-alpha-white: #fff; --color-avatar-bg: #f5f5f5; --color-avatar-contrast-border: #00000014; --color-bg-active: hsl(0, 0%, 95%); --color-bg-brand-primary: hsl(37, 55%, 98%); --color-bg-brand-secondary: hsl(37, 55%, 98%); --color-bg-brand-section: hsl(32, 95%, 31%); --color-bg-brand-solid: hsl(32, 100%, 55%); --color-bg-disabled: #f5f5f5; --color-bg-error-primary: #fef3f2; --color-bg-error-secondary: #fee4e2; --color-bg-error-solid: #d92d20; --color-bg-overlay: #0a0d12; --color-bg-primary: #f7f9ee; --color-bg-primary-solid: #0a0d12; --color-bg-quaternary: #e9eaeb; --color-bg-secondary: #FFFFFF; --color-bg-secondary-solid: #535862; --color-bg-success-primary: hsl(152, 58%, 89%); --color-bg-success-secondary: hsl(151, 59%, 87%); --color-bg-success-solid: hsl(150, 78%, 39%); --color-bg-tertiary: #F5F5F5; --color-bg-warning-primary: #fffaeb; --color-bg-warning-secondary: #fef0c7; --color-bg-warning-solid: #dc6803; --color-black: #000; --color-blue-100: #d1e9ff; --color-blue-200: #b2ddff; --color-blue-300: #84caff; --color-blue-400: #53b1fd; --color-blue-50: #eff8ff; --color-blue-500: #2e90fa; --color-blue-600: #1570ef; --color-blue-700: #175cd3; --color-blue-dark-100: #d1e0ff; --color-blue-dark-200: #b2ccff; --color-blue-dark-300: #84adff; --color-blue-dark-400: #528bff; --color-blue-dark-50: #eff4ff; --color-blue-dark-500: #2970ff; --color-blue-dark-600: #155eef; --color-blue-dark-700: #004eeb; --color-blue-light-100: #e0f2fe; --color-blue-light-200: #b9e6fe; --color-blue-light-300: #7cd4fd; --color-blue-light-400: #36bffa; --color-blue-light-50: #f0f9ff; --color-blue-light-500: #0ba5ec; --color-blue-light-600: #0086c9; --color-blue-light-700: #026aa2; --color-border-brand: hsl(32, 91%, 72%); --color-border-disabled: #d5d7da; --color-border-error: #f04438; --color-border-primary: #E9EAEB; --color-border-secondary: #e9eaeb; --color-border-tertiary: #f5f5f5; --color-brand-100: hsl(37, 55%, 98%); --color-brand-200: hsl(37, 55%, 98%); --color-brand-25: hsl(37, 55%, 98%); --color-brand-300: hsl(37, 55%, 98%); --color-brand-400: hsl(34, 83%, 89%); --color-brand-50: hsl(37, 55%, 98%); --color-brand-500: hsl(32, 91%, 72%); --color-brand-600: hsl(32, 100%, 55%); --color-brand-700: hsl(32, 97%, 42%); --color-brand-800: hsl(32, 95%, 31%); --color-brand-900: hsl(32, 94%, 24%); --color-button-bg-primary: #FF961B; --color-button-bg-secondary: #FF961B; --color-button-bg-support: #FF961B; --color-button-destructive-primary-icon: #fda29b; --color-button-text-primary: #212121; --color-button-text-secondary: #212121; --color-button-text-support: #212121; --color-error-100: #fee4e2; --color-error-200: #fecdca; --color-error-300: #fda29b; --color-error-400: #f97066; --color-error-50: #fef3f2; --color-error-500: #f04438; --color-error-600: #d92d20; --color-error-700: #b42318; --color-featured-icon-light-fg-brand: hsl(32, 100%, 55%); --color-featured-icon-light-fg-error: #d92d20; --color-featured-icon-light-fg-gray: #717680; --color-featured-icon-light-fg-success: hsl(150, 78%, 39%); --color-featured-icon-light-fg-warning: #dc6803; --color-fg-brand-primary: hsl(32, 100%, 55%); --color-fg-brand-secondary: hsl(32, 91%, 72%); --color-fg-disabled: #a4a7ae; --color-fg-error-primary: #d92d20; --color-fg-error-secondary: #f04438; --color-fg-quaternary: #a4a7ae; --color-fg-secondary: #414651; --color-fg-success-primary: hsl(150, 78%, 39%); --color-fg-success-secondary: hsl(150, 73%, 51%); --color-fg-tertiary: #535862; --color-fg-warning-primary: #dc6803; --color-fg-white: #fff; --color-focus-area: #FF961B; --color-focus-ring: #FF961B; --color-fuchsia-100: #fbe8ff; --color-fuchsia-200: #f6d0fe; --color-fuchsia-300: #eeaafd; --color-fuchsia-400: #e478fa; --color-fuchsia-50: #fdf4ff; --color-fuchsia-500: #d444f1; --color-fuchsia-600: #ba24d5; --color-fuchsia-700: #9f1ab1; --color-gray-100: #f5f5f5; --color-gray-200: #e9eaeb; --color-gray-25: #fdfdfd; --color-gray-300: #d5d7da; --color-gray-400: #a4a7ae; --color-gray-50: #fafafa; --color-gray-500: #717680; --color-gray-600: #535862; --color-gray-700: #414651; --color-gray-800: #252b37; --color-gray-900: #181d27; --color-gray-950: #0a0d12; --color-gray-blue-100: #eaecf5; --color-gray-blue-200: #d5d9eb; --color-gray-blue-300: #b3b8db; --color-gray-blue-400: #717bbc; --color-gray-blue-50: #f8f9fc; --color-gray-blue-500: #4e5ba6; --color-gray-blue-600: #3e4784; --color-gray-blue-700: #363f72; --color-green-100: #d3f8df; --color-green-200: #aaf0c4; --color-green-300: #73e2a3; --color-green-400: #3ccb7f; --color-green-50: #edfcf2; --color-green-500: #16b364; --color-green-600: #099250; --color-green-700: #087443; --color-indigo-100: #e0eaff; --color-indigo-200: #c7d7fe; --color-indigo-300: #a4bcfd; --color-indigo-400: #8098f9; --color-indigo-50: #eef4ff; --color-indigo-500: #6172f3; --color-indigo-600: #444ce7; --color-indigo-700: #3538cd; --color-orange-100: #fdead7; --color-orange-200: #f9dbaf; --color-orange-300: #f7b27a; --color-orange-400: #f38744; --color-orange-50: #fef6ee; --color-orange-500: #ef6820; --color-orange-600: #e04f16; --color-orange-700: #b93815; --color-orange-dark-100: #ffe6d5; --color-orange-dark-200: #ffd6ae; --color-orange-dark-300: #ff9c66; --color-orange-dark-400: #ff692e; --color-orange-dark-50: #fff4ed; --color-orange-dark-500: #ff4405; --color-orange-dark-600: #e62e05; --color-orange-dark-700: #bc1b06; --color-pink-100: #fce7f6; --color-pink-200: #fcceee; --color-pink-300: #faa7e0; --color-pink-400: #f670c7; --color-pink-50: #fdf2fa; --color-pink-500: #ee46bc; --color-pink-600: #dd2590; --color-pink-700: #c11574; --color-purple-100: #ebe9fe; --color-purple-200: #d9d6fe; --color-purple-300: #bdb4fe; --color-purple-400: #9b8afb; --color-purple-50: #f4f3ff; --color-purple-500: #7a5af8; --color-purple-600: #6938ef; --color-purple-700: #5925dc; --color-red-500: oklch(63.7% .237 25.331); --color-red-600: oklch(57.7% .245 27.325); --color-skeleton-bg: #0000001a; --color-slider-handle-bg: #fff; --color-slider-handle-border: hsl(32, 100%, 55%); --color-success: #16B364; --color-success-100: hsl(151, 59%, 87%); --color-success-200: hsl(150, 61%, 82%); --color-success-300: hsl(150, 64%, 74%); --color-success-400: hsl(150, 69%, 63%); --color-success-50: hsl(152, 58%, 89%); --color-success-500: hsl(150, 73%, 51%); --color-success-600: hsl(150, 78%, 39%); --color-success-700: hsl(150, 77%, 30%); --color-text-brand-primary: hsl(32, 94%, 24%); --color-text-brand-secondary: hsl(32, 97%, 42%); --color-text-brand-tertiary: hsl(32, 100%, 55%); --color-text-disabled: #717680; --color-text-error-primary: #d92d20; --color-text-general: #535862; --color-text-heading: #212121; --color-text-link: #FF961B; --color-text-link-contrast: #212121; --color-text-placeholder: #717680; --color-text-primary: #181d27; --color-text-quaternary: #717680; --color-text-secondary: #414651; --color-text-success-primary: hsl(150, 78%, 39%); --color-text-tertiary: #717680; --color-text-warning-primary: #dc6803; --color-text-white: #fff; --color-tooltip-supporting-text: #d5d7da; --color-utility-blue-100: #d1e9ff; --color-utility-blue-200: #b2ddff; --color-utility-blue-400: #53b1fd; --color-utility-blue-50: #eff8ff; --color-utility-blue-500: #2e90fa; --color-utility-blue-700: #175cd3; --color-utility-blue-light-100: #e0f2fe; --color-utility-blue-light-200: #b9e6fe; --color-utility-blue-light-400: #36bffa; --color-utility-blue-light-50: #f0f9ff; --color-utility-blue-light-500: #0ba5ec; --color-utility-blue-light-700: #026aa2; --color-utility-brand-100: hsl(37, 55%, 98%); --color-utility-brand-200: hsl(37, 55%, 98%); --color-utility-brand-300: hsl(37, 55%, 98%); --color-utility-brand-400: hsl(34, 83%, 89%); --color-utility-brand-50: hsl(37, 55%, 98%); --color-utility-brand-500: hsl(32, 91%, 72%); --color-utility-brand-600: hsl(32, 100%, 55%); --color-utility-brand-700: hsl(32, 97%, 42%); --color-utility-error-100: #fee4e2; --color-utility-error-200: #fecdca; --color-utility-error-400: #f97066; --color-utility-error-50: #fef3f2; --color-utility-error-500: #f04438; --color-utility-error-700: #b42318; --color-utility-gray-100: #f5f5f5; --color-utility-gray-200: #e9eaeb; --color-utility-gray-300: #d5d7da; --color-utility-gray-400: #a4a7ae; --color-utility-gray-50: #fafafa; --color-utility-gray-500: #717680; --color-utility-gray-600: #535862; --color-utility-gray-700: #414651; --color-utility-gray-blue-100: #eaecf5; --color-utility-gray-blue-200: #d5d9eb; --color-utility-gray-blue-400: #717bbc; --color-utility-gray-blue-50: #f8f9fc; --color-utility-gray-blue-500: #4e5ba6; --color-utility-gray-blue-700: #363f72; --color-utility-green-200: #aaf0c4; --color-utility-green-500: #16b364; --color-utility-green-600: #099250; --color-utility-indigo-100: #e0eaff; --color-utility-indigo-200: #c7d7fe; --color-utility-indigo-400: #8098f9; --color-utility-indigo-50: #eef4ff; --color-utility-indigo-500: #6172f3; --color-utility-indigo-700: #3538cd; --color-utility-orange-100: #fdead7; --color-utility-orange-200: #f9dbaf; --color-utility-orange-400: #f38744; --color-utility-orange-50: #fef6ee; --color-utility-orange-500: #ef6820; --color-utility-orange-700: #b93815; --color-utility-orange-dark-400: #ff692e; --color-utility-pink-100: #fce7f6; --color-utility-pink-200: #fcceee; --color-utility-pink-400: #f670c7; --color-utility-pink-50: #fdf2fa; --color-utility-pink-500: #ee46bc; --color-utility-pink-700: #c11574; --color-utility-purple-100: #ebe9fe; --color-utility-purple-200: #d9d6fe; --color-utility-purple-400: #9b8afb; --color-utility-purple-50: #f4f3ff; --color-utility-purple-500: #7a5af8; --color-utility-purple-700: #5925dc; --color-utility-success-100: hsl(151, 59%, 87%); --color-utility-success-200: hsl(150, 61%, 82%); --color-utility-success-400: hsl(150, 69%, 63%); --color-utility-success-50: hsl(152, 58%, 89%); --color-utility-success-500: hsl(150, 73%, 51%); --color-utility-warning-100: #fef0c7; --color-utility-warning-200: #fedf89; --color-utility-warning-300: #fec84b; --color-utility-warning-400: #fdb022; --color-utility-warning-50: #fffaeb; --color-utility-warning-500: #f79009; --color-utility-warning-600: #dc6803; --color-utility-warning-700: #b54708; --color-violet-400: #a48afb; --color-violet-700: #6927da; --color-warning-100: #fef0c7; --color-warning-200: #fedf89; --color-warning-300: #fec84b; --color-warning-400: #fdb022; --color-warning-50: #fffaeb; --color-warning-500: #f79009; --color-warning-600: #dc6803; --color-warning-700: #b54708; --color-white: #fff; --color-yellow-100: #fef7c3; --color-yellow-200: #feee95; --color-yellow-300: #fde272; --color-yellow-400: #fac515; --color-yellow-50: #fefbe8; --color-yellow-500: #eaaa08; --color-yellow-600: #ca8504; --color-yellow-700: #a15c07; --default-font-family: ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; --default-mono-font-family: ui-monospace,"Roboto Mono",SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; --default-transition-duration: .15s; --default-transition-timing-function: cubic-bezier(.4,0,.2,1); --ease-in: cubic-bezier(.4,0,1,1); --ease-in-out: cubic-bezier(.4,0,.2,1); --ease-out: cubic-bezier(0,0,.2,1); --font-mono: ui-monospace,"Roboto Mono",SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; --font-sans: ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; --font-weight-bold: 700; --font-weight-medium: 500; --font-weight-normal: 400; --font-weight-semibold: 600; --leading-relaxed: 1.625; --leading-snug: 1.375; --leading-tight: 1.25; --max-skio-width: 1140px; --max-width-container: 1280px; --outline-color-brand: hsl(32, 91%, 72%); --outline-color-error: #f04438; --radius-2xl: 1rem; --radius-border-radius: 12px; --radius-full: 9999px; --radius-lg: .5rem; --radius-md: .375rem; --radius-none: 0px; --radius-sm: .125rem; --radius-xl: .75rem; --radius-xs: .25rem; --ring-color-bg-brand-solid: hsl(32, 100%, 55%); --ring-color-brand: hsl(32, 91%, 72%); --ring-color-disabled: #d5d7da; --ring-color-error: #f04438; --ring-color-primary: #E9EAEB; --ring-color-secondary: #e9eaeb; --scale: 1; --shadow-skeumorphic: 0px 0px 0px 1px #0a0d122e inset,0px -2px 0px 0px #0a0d120d inset; --shadow-xs: 0px 1px 2px #0a0d120d; --spacing: calc(4px*1); --spacing-2xl: calc(calc(4px*1)*5); --spacing-3xl: calc(calc(4px*1)*6); --spacing-4xl: calc(calc(4px*1)*8); --spacing-cpv3: 1px; --spacing-lg: calc(calc(4px*1)*3); --spacing-md: calc(calc(4px*1)*2); --spacing-sm: calc(calc(4px*1)*1.5); --spacing-xl: calc(calc(4px*1)*4); --spacing-xs: calc(4px*1); --spacing-xxs: calc(calc(4px*1)*.5); --text-2xl: calc(calc(4*4px*1)*1.5); --text-2xl--line-height: calc(2/1.5); --text-4xl: calc(calc(4*4px*1)*2.25); --text-4xl--line-height: calc(2.5/2.25); --text-5xl: calc(calc(4*4px*1)*3); --text-5xl--line-height: 1; --text-base: calc(calc(4*4px*1)); --text-base--line-height: calc(1.5/1); --text-color-brand-primary: hsl(32, 94%, 24%); --text-color-brand-secondary: hsl(32, 97%, 42%); --text-color-brand-tertiary: hsl(32, 100%, 55%); --text-color-disabled: #717680; --text-color-error-primary: #d92d20; --text-color-placeholder: #717680; --text-color-quaternary: #717680; --text-color-secondary: #414651; --text-color-success-primary: hsl(150, 78%, 39%); --text-color-tertiary: #717680; --text-color-tooltip-supporting-text: #d5d7da; --text-display-lg: calc(calc(4px*1)*12); --text-display-lg--letter-spacing: -.96px; --text-display-lg--line-height: calc(calc(4px*1)*15); --text-display-md: calc(calc(4px*1)*9); --text-display-md--letter-spacing: -.72px; --text-display-md--line-height: calc(calc(4px*1)*11); --text-display-sm: calc(calc(4px*1)*7.5); --text-display-sm--line-height: calc(calc(4px*1)*9.5); --text-display-xl: calc(calc(4px*1)*15); --text-display-xl--letter-spacing: -1.2px; --text-display-xl--line-height: calc(calc(4px*1)*18); --text-display-xs: calc(calc(4px*1)*6); --text-display-xs--line-height: calc(calc(4px*1)*8); --text-lg: calc(calc(4*4px*1)*1.125); --text-lg--line-height: calc(calc(4px*1)*7); --text-md: calc(calc(4px*1)*4); --text-md--line-height: calc(calc(4px*1)*6); --text-sm: calc(calc(4*4px*1)*.875); --text-sm--line-height: calc(calc(4px*1)*5); --text-xl: calc(calc(4*4px*1)*1.25); --text-xl--line-height: calc(calc(4px*1)*7.5); --text-xs: calc(calc(4*4px*1)*.75); --text-xs--line-height: calc(calc(4px*1)*4.5); --tracking-tight: -.025em; }