/** Shopify CDN: Minification failed Line 1904:2 Unexpected "{" Line 1904:3 Expected identifier but found "%" Line 1904:45 Expected identifier but found whitespace Line 1904:54 Unexpected "!" Line 1904:110 Expected identifier but found "%" **/ /* START_SNIPPET:ante-import-buttons (INDEX:103) */ body { --button-border-radius: var(--radius-medium); --button-font-size: var(--font-size-body-large); --button-font-weight: 800; --button-line-height: 150%; --button-font-family: var(--font); } .ante-button-row { display: flex; flex-wrap: wrap; gap: var(--spacing-small); } .ante-button { all: unset; white-space: pre-wrap; background-color: var(--color-button-surface) !important; border-radius: var(--button-border-radius) !important; padding: var(--micropad-xxx-large) var(--padding-small) !important; min-height: 70px !important; display: flex; justify-content: center; align-items: center; gap: var(--micropad-large); font-size: var(--button-font-size) !important; font-weight: var(--button-font-weight); line-height: var(--button-line-height); cursor: pointer; transition: transform .15s, box-shadow .15s, opacity .15s, background-color .15s !important; text-align: center; text-decoration: none !important; font-family: var(--font-heading) !important; letter-spacing: var(--letter-spacing-heading); position: relative !important; z-index: 1; overflow: hidden; user-select: none !important; min-width: 240px !important; color: var(--color-button-text) !important; box-shadow: var(--elevated-shadow) !important; transform: var(--elevated-translate); border: 1px solid var(--color-button-border) !important; text-transform: uppercase; } .ante-button::after, .ante-button::before, .ante-button * { color: inherit !important; } .ante-button.small { padding: var(--padding-small) var(--padding-medium) !important; min-height: 60px !important; max-height: 60px; } .ante-button.x-small { padding: var(--micropad-x-small) var(--micropad-x-large) !important; min-height: 33.5px !important; font-size: var(--font-size-body-small) !important; gap: var(--micropad-medium); border-radius: var(--radius-x-small) !important; } .ante-button.secondary { background-color: var(--color-button-secondary-surface) !important; color: var(--color-button-secondary-text) !important; border: 1px solid var(--color-button-secondary-border) !important; } .ante-button:not([loading]):not([disabled]):hover, .ante-button-activator:hover > .ante-button:not([loading]):not([disabled]) { background-color: var(--color-button-surface-hover) !important; color: var(--color-button-text-hover) !important; border: 1px solid var(--color-button-border-hover) !important; box-shadow: var(--elevated-shadow-hover) !important; transform: var(--elevated-translate-hover); } .ante-button:not([loading]):not([disabled]):hover.secondary, .ante-button-activator:hover > .ante-button:not([loading]):not([disabled]).secondary { background-color: var(--color-button-secondary-surface-hover) !important; color: var(--color-button-secondary-text-hover) !important; border: 1px solid var(--color-button-secondary-border-hover) !important; box-shadow: var(--elevated-shadow-hover) !important; transform: var(--elevated-translate-hover); } .ante-button:not([loading]):not([disabled]):active, .ante-button:not([loading]):not([disabled]):active.secondary, .ante-button-activator:active > .ante-button:not([loading]):not([disabled]), .ante-button-activator:active > .ante-button:not([loading]):not([disabled]).secondary { box-shadow: var(--elevated-shadow-active) !important; transform: var(--elevated-translate-active); } .ante-button[loading], .ante-button[disabled] { opacity: 0.5; cursor: not-allowed; box-shadow: var(--elevated-shadow-none) !important; transform: initial; } .ante-button[loading] { color: transparent !important; cursor: progress !important; } .ante-button[loading]::before, .ante-button[loading] * { visibility: hidden !important; } .ante-button[loading]::after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 32px; height: 32px; background: var(--color-button-text); mask-image: url('data:image/svg+xml,'); mask-size: 100% 100%; mask-repeat: no-repeat; animation: loadingspin 0.9s linear infinite; } .ante-button[loading].secondary::after { background: var(--color-button-secondary-text); } .ante-button-activator { text-decoration: none !important; } .ante-button .ante-buy-compare-price { color: inherit !important; } .ante-button .ante-buy-compare-price > span { opacity: 0.6; } .ante-button .ante-buy-compare-price::before { background-color: currentColor; } .ante-buy-button-dot { width: 8px; height: 8px; border-radius: 50%; background-color: currentColor; } @media (max-width: 1440px) { .ante-button { min-height: 64px !important; font-size: 18px !important; } .ante-button.small { min-height: 54px !important; max-height: 54px; } } @media (max-width: 600px) { .ante-button { min-height: 54px !important; font-size: 16px !important; } .ante-button.small { min-height: 40px !important; max-height: 40px; } .ante-button.x-small { min-height: 33.5px !important; font-size: var(--font-size-body-small) !important; } } @keyframes loadingspin { to { transform: translate(-50%, -50%) rotate(360deg); } } /* END_SNIPPET:ante-import-buttons */ /* START_SNIPPET:ante-import-colours (INDEX:104) */ @property --color-surface-background { syntax: ""; inherits: true; initial-value: #FFFFFF; } @property --color-surface-dark { syntax: ""; inherits: true; initial-value: #F4F4F5; } @property --color-surface-x-dark { syntax: ""; inherits: true; initial-value: #EFE9D9; } @property --color-surface-xx-dark { syntax: ""; inherits: true; initial-value: #DDD5C2; } @property --color-surface-xxx-dark { syntax: ""; inherits: true; initial-value: #BFB8A7; } @property --color-surface-accent { syntax: ""; inherits: true; initial-value: #F53D8A; } @property --color-surface-accent-inverse { syntax: ""; inherits: true; initial-value: #C31C62; } @property --color-surface-alpha-dark { syntax: ""; inherits: true; initial-value: #F4237B29; } @property --color-surface-alpha-x-dark { syntax: ""; inherits: true; initial-value: #F4237B3D; } @property --color-surface-input { syntax: ""; inherits: true; initial-value: #FFFFFF; } @property --color-text-default { syntax: ""; inherits: true; initial-value: #060808; } @property --color-text-muted { syntax: ""; inherits: true; initial-value: #2C2E2F; } @property --color-text-faint { syntax: ""; inherits: true; initial-value: #525556; } @property --color-text-alt { syntax: ""; inherits: true; initial-value: #F4237B; } @property --color-text-link { syntax: ""; inherits: true; initial-value: #C9CC0A; } @property --color-text-input { syntax: ""; inherits: true; initial-value: #060808; } @property --color-border-default { syntax: ""; inherits: true; initial-value: #060808; } @property --color-border-default-secondary { syntax: ""; inherits: true; initial-value: #3F4142; } @property --color-border-active { syntax: ""; inherits: true; initial-value: #F4237B; } @property --color-border-active-secondary { syntax: ""; inherits: true; initial-value: #92154A; } @property --color-border-alpha { syntax: ""; inherits: true; initial-value: #9D988A29; } @property --color-button-surface { syntax: ""; inherits: true; initial-value: #060808; } @property --color-button-surface-hover { syntax: ""; inherits: true; initial-value: #171819; } @property --color-button-text { syntax: ""; inherits: true; initial-value: #FFFFFF; } @property --color-button-text-hover { syntax: ""; inherits: true; initial-value: #FFFFFF; } @property --color-button-border { syntax: ""; inherits: true; initial-value: #060808; } @property --color-button-border-hover { syntax: ""; inherits: true; initial-value: #060808; } @property --color-button-secondary-surface { syntax: ""; inherits: true; initial-value: #13121200; } @property --color-button-secondary-surface-hover { syntax: ""; inherits: true; initial-value: #171819; } @property --color-button-secondary-text { syntax: ""; inherits: true; initial-value: #060808; } @property --color-button-secondary-text-hover { syntax: ""; inherits: true; initial-value: #FFFFFF; } @property --color-button-secondary-border { syntax: ""; inherits: true; initial-value: #060808; } @property --color-button-secondary-border-hover { syntax: ""; inherits: true; initial-value: #171819; } @property --color-content-accent-primary { syntax: ""; inherits: true; initial-value: #57544D; } @property --color-content-accent-inverse { syntax: ""; inherits: true; initial-value: #FFFFFF; } @property --color-true { syntax: ""; inherits: true; initial-value: #D90058; } @property --color-true-light { syntax: ""; inherits: true; initial-value: #FEDBE8; } @property --color-false { syntax: ""; inherits: true; initial-value: #C43231; } @property --color-false-light { syntax: ""; inherits: true; initial-value: #F7B4B3; } @property --color-rating-stars { syntax: ""; inherits: true; initial-value: #060808; } @property --color-toggle-thumb-surface { syntax: ""; inherits: true; initial-value: #FEF1F6; } @property --color-toggle-thumb-border-on { syntax: ""; inherits: true; initial-value: #A80044; } @property --color-toggle-thumb-border-off { syntax: ""; inherits: true; initial-value: #2C2E2F; } @property --color-toggle-surface-on { syntax: ""; inherits: true; initial-value: #FE5897; } @property --color-toggle-border-on { syntax: ""; inherits: true; initial-value: #D90058; } @property --color-toggle-surface-off { syntax: ""; inherits: true; initial-value: #D3D4D5; } @property --color-toggle-border-off { syntax: ""; inherits: true; initial-value: #525556; } /* Theme values */ :root, .ante-base { --base-color-surface-background: #FFFFFF; --base-color-surface-dark: #F4F4F5; --base-color-surface-x-dark: #EFE9D9; --base-color-surface-xx-dark: #DDD5C2; --base-color-surface-xxx-dark: #BFB8A7; --base-color-surface-accent: #FFC0E5; --base-color-surface-accent-inverse: #C31C62; --base-color-surface-alpha-dark: #FF099929; --base-color-surface-alpha-x-dark: #FF09993D; --base-color-surface-input: #FFFFFF; --base-color-text-default: #060808; --base-color-text-muted: #2C2E2F; --base-color-text-faint: #525556; --base-color-text-alt: #FF0999; --base-color-text-link: #C9CC0A; --base-color-text-input: #060808; --base-color-border-default: #060808; --base-color-border-default-secondary: #3F4142; --base-color-border-active: #FF0999; --base-color-border-active-secondary: #92154A; --base-color-border-alpha: #9D988A29; --base-color-button-surface: #060808; --base-color-button-surface-hover: #171819; --base-color-button-text: #FFFFFF; --base-color-button-text-hover: #FFFFFF; --base-color-button-border: #060808; --base-color-button-border-hover: #060808; --base-color-button-secondary-surface: #13121200; --base-color-button-secondary-surface-hover: #171819; --base-color-button-secondary-text: #060808; --base-color-button-secondary-text-hover: #FFFFFF; --base-color-button-secondary-border: #060808; --base-color-button-secondary-border-hover: #171819; --base-color-content-accent-primary: #57544D; --base-color-content-accent-inverse: #FFFFFF; --base-color-true: #FF0999; --base-color-true-light: #FEDBE8; --base-color-false: #C43231; --base-color-false-light: #F7B4B3; --base-color-rating-stars: #060808; --base-color-toggle-thumb-surface: #FEF1F6; --base-color-toggle-thumb-border-on: #A80044; --base-color-toggle-thumb-border-off: #2C2E2F; --base-color-toggle-surface-on: #FF50B7; --base-color-toggle-border-on: #D90058; --base-color-toggle-surface-off: #fde0f1; --base-color-toggle-border-off: #525556; --inverse-color-surface-background: #060808; --inverse-color-surface-dark: #171819; --inverse-color-surface-x-dark: #2C2E2F; --inverse-color-surface-xx-dark: #3F4142; --inverse-color-surface-xxx-dark: #525556; --inverse-color-surface-accent: #9D988A; --inverse-color-surface-accent-inverse: #F6F3EC; --inverse-color-surface-alpha-dark: #FFFFFF1F; --inverse-color-surface-alpha-x-dark: #FFFFFF3D; --inverse-color-surface-input: #FFFFFF; --inverse-color-text-default: #FFFFFF; --inverse-color-text-muted: #F4F4F5; --inverse-color-text-faint: #9EA0A1; --inverse-color-text-alt: #FCFDD0; --inverse-color-text-link: #FF0999; --inverse-color-text-input: #060808; --inverse-color-border-default: #57544D; --inverse-color-border-default-secondary: #7C786D; --inverse-color-border-active: #9D988A; --inverse-color-border-active-secondary: #FF0999; --inverse-color-border-alpha: #9D988A7A; --inverse-color-button-surface: #EFF422; --inverse-color-button-surface-hover: #F2F52E; --inverse-color-button-text: #323302; --inverse-color-button-text-hover: #646505; --inverse-color-button-border: #646505; --inverse-color-button-border-hover: #646505; --inverse-color-button-secondary-surface: #13121200; --inverse-color-button-secondary-surface-hover: #F4F4F5; --inverse-color-button-secondary-text: #FFFFFF; --inverse-color-button-secondary-text-hover: #060808; --inverse-color-button-secondary-border: #FFFFFF; --inverse-color-button-secondary-border-hover: #F4F4F5; --inverse-color-content-accent-primary: #FCFCFA; --inverse-color-content-accent-inverse: #1A1A18; --inverse-color-true: #FEC8DC; --inverse-color-true-light: #C1004B; --inverse-color-false: #F38F8F; --inverse-color-false-light: #7D3636; --inverse-color-rating-stars: #060808; --inverse-color-toggle-thumb-surface: #770D34; --inverse-color-toggle-thumb-border-on: #A80044; --inverse-color-toggle-thumb-border-off: #57544D; --inverse-color-toggle-surface-on: #FE5897; --inverse-color-toggle-border-on: #D90058; --inverse-color-toggle-surface-off: #F2EDE2; --inverse-color-toggle-border-off: #7C786D; --brand-color-surface-background: #FFFFFF; --brand-color-surface-dark: #FAF8F5; --brand-color-surface-x-dark: #EFE9D9; --brand-color-surface-xx-dark: #DDD5C2; --brand-color-surface-xxx-dark: #BFB8A7; --brand-color-surface-accent: #FF0999; --brand-color-surface-accent-inverse: #92154A; --brand-color-surface-alpha-dark: #FF099929; --brand-color-surface-alpha-x-dark: #FF09993D; --brand-color-surface-input: #FFFFFF; --brand-color-text-default: #060808; --brand-color-text-muted: #2C2E2F; --brand-color-text-faint: #525556; --brand-color-text-alt: #FF0999; --brand-color-text-link: #C9CC0A; --brand-color-text-input: #060808; --brand-color-border-default: #060808; --brand-color-border-default-secondary: #3F4142; --brand-color-border-active: #FF0999; --brand-color-border-active-secondary: #92154A; --brand-color-border-alpha: #9D988A29; --brand-color-button-surface: #060808; --brand-color-button-surface-hover: #171819; --brand-color-button-text: #FFFFFF; --brand-color-button-text-hover: #FFFFFF; --brand-color-button-border: #060808; --brand-color-button-border-hover: #060808; --brand-color-button-secondary-surface: #13121200; --brand-color-button-secondary-surface-hover: #171819; --brand-color-button-secondary-text: #060808; --brand-color-button-secondary-text-hover: #FFFFFF; --brand-color-button-secondary-border: #060808; --brand-color-button-secondary-border-hover: #171819; --brand-color-content-accent-primary: #57544D; --brand-color-content-accent-inverse: #FFFFFF; --brand-color-true: #D90058; --brand-color-true-light: #FEDBE8; --brand-color-false: #C43231; --brand-color-false-light: #F7B4B3; --brand-color-rating-stars: #060808; --brand-color-toggle-thumb-surface: #FEF1F6; --brand-color-toggle-thumb-border-on: #A80044; --brand-color-toggle-thumb-border-off: #3F4142; --brand-color-toggle-surface-on: #FE5897; --brand-color-toggle-border-on: #D90058; --brand-color-toggle-surface-off: #D3D4D5; --brand-color-toggle-border-off: #525556; --brand-inverse-color-surface-background: #060808; --brand-inverse-color-surface-dark: #171819; --brand-inverse-color-surface-x-dark: #2C2E2F; --brand-inverse-color-surface-xx-dark: #3F4142; --brand-inverse-color-surface-xxx-dark: #525556; --brand-inverse-color-surface-accent: #9D988A; --brand-inverse-color-surface-accent-inverse: #F6F3EC; --brand-inverse-color-surface-alpha-dark: #FFFFFF1F; --brand-inverse-color-surface-alpha-x-dark: #FFFFFF3D; --brand-inverse-color-surface-input: #FFFFFF; --brand-inverse-color-text-default: #FFFFFF; --brand-inverse-color-text-muted: #F4F4F5; --brand-inverse-color-text-faint: #9EA0A1; --brand-inverse-color-text-alt: #FCFDD0; --brand-inverse-color-text-link: #FF0999; --brand-inverse-color-text-input: #060808; --brand-inverse-color-border-default: #57544D; --brand-inverse-color-border-default-secondary: #7C786D; --brand-inverse-color-border-active: #9D988A; --brand-inverse-color-border-active-secondary: #FF0999; --brand-inverse-color-border-alpha: #9D988A7A; --brand-inverse-color-button-surface: #EFF422; --brand-inverse-color-button-surface-hover: #F2F52E; --brand-inverse-color-button-text: #323302; --brand-inverse-color-button-text-hover: #646505; --brand-inverse-color-button-border: #323302; --brand-inverse-color-button-border-hover: #FCFDD0; --brand-inverse-color-button-secondary-surface: #13121200; --brand-inverse-color-button-secondary-surface-hover: #FDFEE2; --brand-inverse-color-button-secondary-text: #FFFFFF; --brand-inverse-color-button-secondary-text-hover: #060808; --brand-inverse-color-button-secondary-border: #FFFFFF; --brand-inverse-color-button-secondary-border-hover: #FCFDD0; --brand-inverse-color-content-accent-primary: #FCFCFA; --brand-inverse-color-content-accent-inverse: #1A1A18; --brand-inverse-color-true: #FEC8DC; --brand-inverse-color-true-light: #C1004B; --brand-inverse-color-false: #F38F8F; --brand-inverse-color-false-light: #7D3636; --brand-inverse-color-rating-stars: #060808; --brand-inverse-color-toggle-thumb-surface: #770D34; --brand-inverse-color-toggle-thumb-border-on: #A80044; --brand-inverse-color-toggle-thumb-border-off: #57544D; --brand-inverse-color-toggle-surface-on: #FE5897; --brand-inverse-color-toggle-border-on: #D90058; --brand-inverse-color-toggle-surface-off: #F2EDE2; --brand-inverse-color-toggle-border-off: #7C786D; /* Active theme indirection */ --normal-color-surface-background: var(--base-color-surface-background); --normal-color-surface-dark: var(--base-color-surface-dark); --normal-color-surface-x-dark: var(--base-color-surface-x-dark); --normal-color-surface-xx-dark: var(--base-color-surface-xx-dark); --normal-color-surface-xxx-dark: var(--base-color-surface-xxx-dark); --normal-color-surface-accent: var(--base-color-surface-accent); --normal-color-surface-accent-inverse: var(--base-color-surface-accent-inverse); --normal-color-surface-alpha-dark: var(--base-color-surface-alpha-dark); --normal-color-surface-alpha-x-dark: var(--base-color-surface-alpha-x-dark); --normal-color-surface-input: var(--base-color-surface-input); --normal-color-text-default: var(--base-color-text-default); --normal-color-text-muted: var(--base-color-text-muted); --normal-color-text-faint: var(--base-color-text-faint); --normal-color-text-alt: var(--base-color-text-alt); --normal-color-text-link: var(--base-color-text-link); --normal-color-text-input: var(--base-color-text-input); --normal-color-border-default: var(--base-color-border-default); --normal-color-border-default-secondary: var(--base-color-border-default-secondary); --normal-color-border-active: var(--base-color-border-active); --normal-color-border-active-secondary: var(--base-color-border-active-secondary); --normal-color-border-alpha: var(--base-color-border-alpha); --normal-color-button-surface: var(--base-color-button-surface); --normal-color-button-surface-hover: var(--base-color-button-surface-hover); --normal-color-button-text: var(--base-color-button-text); --normal-color-button-text-hover: var(--base-color-button-text-hover); --normal-color-button-border: var(--base-color-button-border); --normal-color-button-border-hover: var(--base-color-button-border-hover); --normal-color-button-secondary-surface: var(--base-color-button-secondary-surface); --normal-color-button-secondary-surface-hover: var(--base-color-button-secondary-surface-hover); --normal-color-button-secondary-text: var(--base-color-button-secondary-text); --normal-color-button-secondary-text-hover: var(--base-color-button-secondary-text-hover); --normal-color-button-secondary-border: var(--base-color-button-secondary-border); --normal-color-button-secondary-border-hover: var(--base-color-button-secondary-border-hover); --normal-color-content-accent-primary: var(--base-color-content-accent-primary); --normal-color-content-accent-inverse: var(--base-color-content-accent-inverse); --normal-color-true: var(--base-color-true); --normal-color-true-light: var(--base-color-true-light); --normal-color-false: var(--base-color-false); --normal-color-false-light: var(--base-color-false-light); --normal-color-rating-stars: var(--base-color-rating-stars); --normal-color-toggle-thumb-surface: var(--base-color-toggle-thumb-surface); --normal-color-toggle-thumb-border-on: var(--base-color-toggle-thumb-border-on); --normal-color-toggle-thumb-border-off: var(--base-color-toggle-thumb-border-off); --normal-color-toggle-surface-on: var(--base-color-toggle-surface-on); --normal-color-toggle-border-on: var(--base-color-toggle-border-on); --normal-color-toggle-surface-off: var(--base-color-toggle-surface-off); --normal-color-toggle-border-off: var(--base-color-toggle-border-off); --invert-color-surface-background: var(--inverse-color-surface-background); --invert-color-surface-dark: var(--inverse-color-surface-dark); --invert-color-surface-x-dark: var(--inverse-color-surface-x-dark); --invert-color-surface-xx-dark: var(--inverse-color-surface-xx-dark); --invert-color-surface-xxx-dark: var(--inverse-color-surface-xxx-dark); --invert-color-surface-accent: var(--inverse-color-surface-accent); --invert-color-surface-accent-inverse: var(--inverse-color-surface-accent-inverse); --invert-color-surface-alpha-dark: var(--inverse-color-surface-alpha-dark); --invert-color-surface-alpha-x-dark: var(--inverse-color-surface-alpha-x-dark); --invert-color-surface-input: var(--inverse-color-surface-input); --invert-color-text-default: var(--inverse-color-text-default); --invert-color-text-muted: var(--inverse-color-text-muted); --invert-color-text-faint: var(--inverse-color-text-faint); --invert-color-text-alt: var(--inverse-color-text-alt); --invert-color-text-link: var(--inverse-color-text-link); --invert-color-text-input: var(--inverse-color-text-input); --invert-color-border-default: var(--inverse-color-border-default); --invert-color-border-default-secondary: var(--inverse-color-border-default-secondary); --invert-color-border-active: var(--inverse-color-border-active); --invert-color-border-active-secondary: var(--inverse-color-border-active-secondary); --invert-color-border-alpha: var(--inverse-color-border-alpha); --invert-color-button-surface: var(--inverse-color-button-surface); --invert-color-button-surface-hover: var(--inverse-color-button-surface-hover); --invert-color-button-text: var(--inverse-color-button-text); --invert-color-button-text-hover: var(--inverse-color-button-text-hover); --invert-color-button-border: var(--inverse-color-button-border); --invert-color-button-border-hover: var(--inverse-color-button-border-hover); --invert-color-button-secondary-surface: var(--inverse-color-button-secondary-surface); --invert-color-button-secondary-surface-hover: var(--inverse-color-button-secondary-surface-hover); --invert-color-button-secondary-text: var(--inverse-color-button-secondary-text); --invert-color-button-secondary-text-hover: var(--inverse-color-button-secondary-text-hover); --invert-color-button-secondary-border: var(--inverse-color-button-secondary-border); --invert-color-button-secondary-border-hover: var(--inverse-color-button-secondary-border-hover); --invert-color-content-accent-primary: var(--inverse-color-content-accent-primary); --invert-color-content-accent-inverse: var(--inverse-color-content-accent-inverse); --invert-color-true: var(--inverse-color-true); --invert-color-true-light: var(--inverse-color-true-light); --invert-color-false: var(--inverse-color-false); --invert-color-false-light: var(--inverse-color-false-light); --invert-color-rating-stars: var(--inverse-color-rating-stars); --invert-color-toggle-thumb-surface: var(--inverse-color-toggle-thumb-surface); --invert-color-toggle-thumb-border-on: var(--inverse-color-toggle-thumb-border-on); --invert-color-toggle-thumb-border-off: var(--inverse-color-toggle-thumb-border-off); --invert-color-toggle-surface-on: var(--inverse-color-toggle-surface-on); --invert-color-toggle-border-on: var(--inverse-color-toggle-border-on); --invert-color-toggle-surface-off: var(--inverse-color-toggle-surface-off); --invert-color-toggle-border-off: var(--inverse-color-toggle-border-off); --color-surface-background: var(--normal-color-surface-background); --color-surface-dark: var(--normal-color-surface-dark); --color-surface-x-dark: var(--normal-color-surface-x-dark); --color-surface-xx-dark: var(--normal-color-surface-xx-dark); --color-surface-xxx-dark: var(--normal-color-surface-xxx-dark); --color-surface-accent: var(--normal-color-surface-accent); --color-surface-accent-inverse: var(--normal-color-surface-accent-inverse); --color-surface-alpha-dark: var(--normal-color-surface-alpha-dark); --color-surface-alpha-x-dark: var(--normal-color-surface-alpha-x-dark); --color-surface-input: var(--normal-color-surface-input); --color-text-default: var(--normal-color-text-default); --color-text-muted: var(--normal-color-text-muted); --color-text-faint: var(--normal-color-text-faint); --color-text-alt: var(--normal-color-text-alt); --color-text-link: var(--normal-color-text-link); --color-text-input: var(--normal-color-text-input); --color-border-default: var(--normal-color-border-default); --color-border-default-secondary: var(--normal-color-border-default-secondary); --color-border-active: var(--normal-color-border-active); --color-border-active-secondary: var(--normal-color-border-active-secondary); --color-border-alpha: var(--normal-color-border-alpha); --color-button-surface: var(--normal-color-button-surface); --color-button-surface-hover: var(--normal-color-button-surface-hover); --color-button-text: var(--normal-color-button-text); --color-button-text-hover: var(--normal-color-button-text-hover); --color-button-border: var(--normal-color-button-border); --color-button-border-hover: var(--normal-color-button-border-hover); --color-button-secondary-surface: var(--normal-color-button-secondary-surface); --color-button-secondary-surface-hover: var(--normal-color-button-secondary-surface-hover); --color-button-secondary-text: var(--normal-color-button-secondary-text); --color-button-secondary-text-hover: var(--normal-color-button-secondary-text-hover); --color-button-secondary-border: var(--normal-color-button-secondary-border); --color-button-secondary-border-hover: var(--normal-color-button-secondary-border-hover); --color-content-accent-primary: var(--normal-color-content-accent-primary); --color-content-accent-inverse: var(--normal-color-content-accent-inverse); --color-true: var(--normal-color-true); --color-true-light: var(--normal-color-true-light); --color-false: var(--normal-color-false); --color-false-light: var(--normal-color-false-light); --color-rating-stars: var(--normal-color-rating-stars); --color-toggle-thumb-surface: var(--normal-color-toggle-thumb-surface); --color-toggle-thumb-border-on: var(--normal-color-toggle-thumb-border-on); --color-toggle-thumb-border-off: var(--normal-color-toggle-thumb-border-off); --color-toggle-surface-on: var(--normal-color-toggle-surface-on); --color-toggle-border-on: var(--normal-color-toggle-border-on); --color-toggle-surface-off: var(--normal-color-toggle-surface-off); --color-toggle-border-off: var(--normal-color-toggle-border-off); color: var(--color-text-default); } .ante-brand, .ante-brand .ante-brand .ante-brand { --normal-color-surface-background: var(--brand-color-surface-background); --normal-color-surface-dark: var(--brand-color-surface-dark); --normal-color-surface-x-dark: var(--brand-color-surface-x-dark); --normal-color-surface-xx-dark: var(--brand-color-surface-xx-dark); --normal-color-surface-xxx-dark: var(--brand-color-surface-xxx-dark); --normal-color-surface-accent: var(--brand-color-surface-accent); --normal-color-surface-accent-inverse: var(--brand-color-surface-accent-inverse); --normal-color-surface-alpha-dark: var(--brand-color-surface-alpha-dark); --normal-color-surface-alpha-x-dark: var(--brand-color-surface-alpha-x-dark); --normal-color-surface-input: var(--brand-color-surface-input); --normal-color-text-default: var(--brand-color-text-default); --normal-color-text-muted: var(--brand-color-text-muted); --normal-color-text-faint: var(--brand-color-text-faint); --normal-color-text-alt: var(--brand-color-text-alt); --normal-color-text-link: var(--brand-color-text-link); --normal-color-text-input: var(--brand-color-text-input); --normal-color-border-default: var(--brand-color-border-default); --normal-color-border-default-secondary: var(--brand-color-border-default-secondary); --normal-color-border-active: var(--brand-color-border-active); --normal-color-border-active-secondary: var(--brand-color-border-active-secondary); --normal-color-border-alpha: var(--brand-color-border-alpha); --normal-color-button-surface: var(--brand-color-button-surface); --normal-color-button-surface-hover: var(--brand-color-button-surface-hover); --normal-color-button-text: var(--brand-color-button-text); --normal-color-button-text-hover: var(--brand-color-button-text-hover); --normal-color-button-border: var(--brand-color-button-border); --normal-color-button-border-hover: var(--brand-color-button-border-hover); --normal-color-button-secondary-surface: var(--brand-color-button-secondary-surface); --normal-color-button-secondary-surface-hover: var(--brand-color-button-secondary-surface-hover); --normal-color-button-secondary-text: var(--brand-color-button-secondary-text); --normal-color-button-secondary-text-hover: var(--brand-color-button-secondary-text-hover); --normal-color-button-secondary-border: var(--brand-color-button-secondary-border); --normal-color-button-secondary-border-hover: var(--brand-color-button-secondary-border-hover); --normal-color-content-accent-primary: var(--brand-color-content-accent-primary); --normal-color-content-accent-inverse: var(--brand-color-content-accent-inverse); --normal-color-true: var(--brand-color-true); --normal-color-true-light: var(--brand-color-true-light); --normal-color-false: var(--brand-color-false); --normal-color-false-light: var(--brand-color-false-light); --normal-color-rating-stars: var(--brand-color-rating-stars); --normal-color-toggle-thumb-surface: var(--brand-color-toggle-thumb-surface); --normal-color-toggle-thumb-border-on: var(--brand-color-toggle-thumb-border-on); --normal-color-toggle-thumb-border-off: var(--brand-color-toggle-thumb-border-off); --normal-color-toggle-surface-on: var(--brand-color-toggle-surface-on); --normal-color-toggle-border-on: var(--brand-color-toggle-border-on); --normal-color-toggle-surface-off: var(--brand-color-toggle-surface-off); --normal-color-toggle-border-off: var(--brand-color-toggle-border-off); --invert-color-surface-background: var(--brand-inverse-color-surface-background); --invert-color-surface-dark: var(--brand-inverse-color-surface-dark); --invert-color-surface-x-dark: var(--brand-inverse-color-surface-x-dark); --invert-color-surface-xx-dark: var(--brand-inverse-color-surface-xx-dark); --invert-color-surface-xxx-dark: var(--brand-inverse-color-surface-xxx-dark); --invert-color-surface-accent: var(--brand-inverse-color-surface-accent); --invert-color-surface-accent-inverse: var(--brand-inverse-color-surface-accent-inverse); --invert-color-surface-alpha-dark: var(--brand-inverse-color-surface-alpha-dark); --invert-color-surface-alpha-x-dark: var(--brand-inverse-color-surface-alpha-x-dark); --invert-color-surface-input: var(--brand-inverse-color-surface-input); --invert-color-text-default: var(--brand-inverse-color-text-default); --invert-color-text-muted: var(--brand-inverse-color-text-muted); --invert-color-text-faint: var(--brand-inverse-color-text-faint); --invert-color-text-alt: var(--brand-inverse-color-text-alt); --invert-color-text-link: var(--brand-inverse-color-text-link); --invert-color-text-input: var(--brand-inverse-color-text-input); --invert-color-border-default: var(--brand-inverse-color-border-default); --invert-color-border-default-secondary: var(--brand-inverse-color-border-default-secondary); --invert-color-border-active: var(--brand-inverse-color-border-active); --invert-color-border-active-secondary: var(--brand-inverse-color-border-active-secondary); --invert-color-border-alpha: var(--brand-inverse-color-border-alpha); --invert-color-button-surface: var(--brand-inverse-color-button-surface); --invert-color-button-surface-hover: var(--brand-inverse-color-button-surface-hover); --invert-color-button-text: var(--brand-inverse-color-button-text); --invert-color-button-text-hover: var(--brand-inverse-color-button-text-hover); --invert-color-button-border: var(--brand-inverse-color-button-border); --invert-color-button-border-hover: var(--brand-inverse-color-button-border-hover); --invert-color-button-secondary-surface: var(--brand-inverse-color-button-secondary-surface); --invert-color-button-secondary-surface-hover: var(--brand-inverse-color-button-secondary-surface-hover); --invert-color-button-secondary-text: var(--brand-inverse-color-button-secondary-text); --invert-color-button-secondary-text-hover: var(--brand-inverse-color-button-secondary-text-hover); --invert-color-button-secondary-border: var(--brand-inverse-color-button-secondary-border); --invert-color-button-secondary-border-hover: var(--brand-inverse-color-button-secondary-border-hover); --invert-color-content-accent-primary: var(--brand-inverse-color-content-accent-primary); --invert-color-content-accent-inverse: var(--brand-inverse-color-content-accent-inverse); --invert-color-true: var(--brand-inverse-color-true); --invert-color-true-light: var(--brand-inverse-color-true-light); --invert-color-false: var(--brand-inverse-color-false); --invert-color-false-light: var(--brand-inverse-color-false-light); --invert-color-rating-stars: var(--brand-inverse-color-rating-stars); --invert-color-toggle-thumb-surface: var(--brand-inverse-color-toggle-thumb-surface); --invert-color-toggle-thumb-border-on: var(--brand-inverse-color-toggle-thumb-border-on); --invert-color-toggle-thumb-border-off: var(--brand-inverse-color-toggle-thumb-border-off); --invert-color-toggle-surface-on: var(--brand-inverse-color-toggle-surface-on); --invert-color-toggle-border-on: var(--brand-inverse-color-toggle-border-on); --invert-color-toggle-surface-off: var(--brand-inverse-color-toggle-surface-off); --invert-color-toggle-border-off: var(--brand-inverse-color-toggle-border-off); --color-surface-background: var(--normal-color-surface-background); --color-surface-dark: var(--normal-color-surface-dark); --color-surface-x-dark: var(--normal-color-surface-x-dark); --color-surface-xx-dark: var(--normal-color-surface-xx-dark); --color-surface-xxx-dark: var(--normal-color-surface-xxx-dark); --color-surface-accent: var(--normal-color-surface-accent); --color-surface-accent-inverse: var(--normal-color-surface-accent-inverse); --color-surface-alpha-dark: var(--normal-color-surface-alpha-dark); --color-surface-alpha-x-dark: var(--normal-color-surface-alpha-x-dark); --color-surface-input: var(--normal-color-surface-input); --color-text-default: var(--normal-color-text-default); --color-text-muted: var(--normal-color-text-muted); --color-text-faint: var(--normal-color-text-faint); --color-text-alt: var(--normal-color-text-alt); --color-text-link: var(--normal-color-text-link); --color-text-input: var(--normal-color-text-input); --color-border-default: var(--normal-color-border-default); --color-border-default-secondary: var(--normal-color-border-default-secondary); --color-border-active: var(--normal-color-border-active); --color-border-active-secondary: var(--normal-color-border-active-secondary); --color-border-alpha: var(--normal-color-border-alpha); --color-button-surface: var(--normal-color-button-surface); --color-button-surface-hover: var(--normal-color-button-surface-hover); --color-button-text: var(--normal-color-button-text); --color-button-text-hover: var(--normal-color-button-text-hover); --color-button-border: var(--normal-color-button-border); --color-button-border-hover: var(--normal-color-button-border-hover); --color-button-secondary-surface: var(--normal-color-button-secondary-surface); --color-button-secondary-surface-hover: var(--normal-color-button-secondary-surface-hover); --color-button-secondary-text: var(--normal-color-button-secondary-text); --color-button-secondary-text-hover: var(--normal-color-button-secondary-text-hover); --color-button-secondary-border: var(--normal-color-button-secondary-border); --color-button-secondary-border-hover: var(--normal-color-button-secondary-border-hover); --color-content-accent-primary: var(--normal-color-content-accent-primary); --color-content-accent-inverse: var(--normal-color-content-accent-inverse); --color-true: var(--normal-color-true); --color-true-light: var(--normal-color-true-light); --color-false: var(--normal-color-false); --color-false-light: var(--normal-color-false-light); --color-rating-stars: var(--normal-color-rating-stars); --color-toggle-thumb-surface: var(--normal-color-toggle-thumb-surface); --color-toggle-thumb-border-on: var(--normal-color-toggle-thumb-border-on); --color-toggle-thumb-border-off: var(--normal-color-toggle-thumb-border-off); --color-toggle-surface-on: var(--normal-color-toggle-surface-on); --color-toggle-border-on: var(--normal-color-toggle-border-on); --color-toggle-surface-off: var(--normal-color-toggle-surface-off); --color-toggle-border-off: var(--normal-color-toggle-border-off); color: var(--color-text-default); } .ante-brand .ante-brand, .ante-brand .ante-brand .ante-brand .ante-brand { --normal-color-surface-background: var(--base-color-surface-background); --normal-color-surface-dark: var(--base-color-surface-dark); --normal-color-surface-x-dark: var(--base-color-surface-x-dark); --normal-color-surface-xx-dark: var(--base-color-surface-xx-dark); --normal-color-surface-xxx-dark: var(--base-color-surface-xxx-dark); --normal-color-surface-accent: var(--base-color-surface-accent); --normal-color-surface-accent-inverse: var(--base-color-surface-accent-inverse); --normal-color-surface-alpha-dark: var(--base-color-surface-alpha-dark); --normal-color-surface-alpha-x-dark: var(--base-color-surface-alpha-x-dark); --normal-color-surface-input: var(--base-color-surface-input); --normal-color-text-default: var(--base-color-text-default); --normal-color-text-muted: var(--base-color-text-muted); --normal-color-text-faint: var(--base-color-text-faint); --normal-color-text-alt: var(--base-color-text-alt); --normal-color-text-link: var(--base-color-text-link); --normal-color-text-input: var(--base-color-text-input); --normal-color-border-default: var(--base-color-border-default); --normal-color-border-default-secondary: var(--base-color-border-default-secondary); --normal-color-border-active: var(--base-color-border-active); --normal-color-border-active-secondary: var(--base-color-border-active-secondary); --normal-color-border-alpha: var(--base-color-border-alpha); --normal-color-button-surface: var(--base-color-button-surface); --normal-color-button-surface-hover: var(--base-color-button-surface-hover); --normal-color-button-text: var(--base-color-button-text); --normal-color-button-text-hover: var(--base-color-button-text-hover); --normal-color-button-border: var(--base-color-button-border); --normal-color-button-border-hover: var(--base-color-button-border-hover); --normal-color-button-secondary-surface: var(--base-color-button-secondary-surface); --normal-color-button-secondary-surface-hover: var(--base-color-button-secondary-surface-hover); --normal-color-button-secondary-text: var(--base-color-button-secondary-text); --normal-color-button-secondary-text-hover: var(--base-color-button-secondary-text-hover); --normal-color-button-secondary-border: var(--base-color-button-secondary-border); --normal-color-button-secondary-border-hover: var(--base-color-button-secondary-border-hover); --normal-color-content-accent-primary: var(--base-color-content-accent-primary); --normal-color-content-accent-inverse: var(--base-color-content-accent-inverse); --normal-color-true: var(--base-color-true); --normal-color-true-light: var(--base-color-true-light); --normal-color-false: var(--base-color-false); --normal-color-false-light: var(--base-color-false-light); --normal-color-rating-stars: var(--base-color-rating-stars); --normal-color-toggle-thumb-surface: var(--base-color-toggle-thumb-surface); --normal-color-toggle-thumb-border-on: var(--base-color-toggle-thumb-border-on); --normal-color-toggle-thumb-border-off: var(--base-color-toggle-thumb-border-off); --normal-color-toggle-surface-on: var(--base-color-toggle-surface-on); --normal-color-toggle-border-on: var(--base-color-toggle-border-on); --normal-color-toggle-surface-off: var(--base-color-toggle-surface-off); --normal-color-toggle-border-off: var(--base-color-toggle-border-off); --invert-color-surface-background: var(--inverse-color-surface-background); --invert-color-surface-dark: var(--inverse-color-surface-dark); --invert-color-surface-x-dark: var(--inverse-color-surface-x-dark); --invert-color-surface-xx-dark: var(--inverse-color-surface-xx-dark); --invert-color-surface-xxx-dark: var(--inverse-color-surface-xxx-dark); --invert-color-surface-accent: var(--inverse-color-surface-accent); --invert-color-surface-accent-inverse: var(--inverse-color-surface-accent-inverse); --invert-color-surface-alpha-dark: var(--inverse-color-surface-alpha-dark); --invert-color-surface-alpha-x-dark: var(--inverse-color-surface-alpha-x-dark); --invert-color-surface-input: var(--inverse-color-surface-input); --invert-color-text-default: var(--inverse-color-text-default); --invert-color-text-muted: var(--inverse-color-text-muted); --invert-color-text-faint: var(--inverse-color-text-faint); --invert-color-text-alt: var(--inverse-color-text-alt); --invert-color-text-link: var(--inverse-color-text-link); --invert-color-text-input: var(--inverse-color-text-input); --invert-color-border-default: var(--inverse-color-border-default); --invert-color-border-default-secondary: var(--inverse-color-border-default-secondary); --invert-color-border-active: var(--inverse-color-border-active); --invert-color-border-active-secondary: var(--inverse-color-border-active-secondary); --invert-color-border-alpha: var(--inverse-color-border-alpha); --invert-color-button-surface: var(--inverse-color-button-surface); --invert-color-button-surface-hover: var(--inverse-color-button-surface-hover); --invert-color-button-text: var(--inverse-color-button-text); --invert-color-button-text-hover: var(--inverse-color-button-text-hover); --invert-color-button-border: var(--inverse-color-button-border); --invert-color-button-border-hover: var(--inverse-color-button-border-hover); --invert-color-button-secondary-surface: var(--inverse-color-button-secondary-surface); --invert-color-button-secondary-surface-hover: var(--inverse-color-button-secondary-surface-hover); --invert-color-button-secondary-text: var(--inverse-color-button-secondary-text); --invert-color-button-secondary-text-hover: var(--inverse-color-button-secondary-text-hover); --invert-color-button-secondary-border: var(--inverse-color-button-secondary-border); --invert-color-button-secondary-border-hover: var(--inverse-color-button-secondary-border-hover); --invert-color-content-accent-primary: var(--inverse-color-content-accent-primary); --invert-color-content-accent-inverse: var(--inverse-color-content-accent-inverse); --invert-color-true: var(--inverse-color-true); --invert-color-true-light: var(--inverse-color-true-light); --invert-color-false: var(--inverse-color-false); --invert-color-false-light: var(--inverse-color-false-light); --invert-color-rating-stars: var(--inverse-color-rating-stars); --invert-color-toggle-thumb-surface: var(--inverse-color-toggle-thumb-surface); --invert-color-toggle-thumb-border-on: var(--inverse-color-toggle-thumb-border-on); --invert-color-toggle-thumb-border-off: var(--inverse-color-toggle-thumb-border-off); --invert-color-toggle-surface-on: var(--inverse-color-toggle-surface-on); --invert-color-toggle-border-on: var(--inverse-color-toggle-border-on); --invert-color-toggle-surface-off: var(--inverse-color-toggle-surface-off); --invert-color-toggle-border-off: var(--inverse-color-toggle-border-off); --color-surface-background: var(--normal-color-surface-background); --color-surface-dark: var(--normal-color-surface-dark); --color-surface-x-dark: var(--normal-color-surface-x-dark); --color-surface-xx-dark: var(--normal-color-surface-xx-dark); --color-surface-xxx-dark: var(--normal-color-surface-xxx-dark); --color-surface-accent: var(--normal-color-surface-accent); --color-surface-accent-inverse: var(--normal-color-surface-accent-inverse); --color-surface-alpha-dark: var(--normal-color-surface-alpha-dark); --color-surface-alpha-x-dark: var(--normal-color-surface-alpha-x-dark); --color-surface-input: var(--normal-color-surface-input); --color-text-default: var(--normal-color-text-default); --color-text-muted: var(--normal-color-text-muted); --color-text-faint: var(--normal-color-text-faint); --color-text-alt: var(--normal-color-text-alt); --color-text-link: var(--normal-color-text-link); --color-text-input: var(--normal-color-text-input); --color-border-default: var(--normal-color-border-default); --color-border-default-secondary: var(--normal-color-border-default-secondary); --color-border-active: var(--normal-color-border-active); --color-border-active-secondary: var(--normal-color-border-active-secondary); --color-border-alpha: var(--normal-color-border-alpha); --color-button-surface: var(--normal-color-button-surface); --color-button-surface-hover: var(--normal-color-button-surface-hover); --color-button-text: var(--normal-color-button-text); --color-button-text-hover: var(--normal-color-button-text-hover); --color-button-border: var(--normal-color-button-border); --color-button-border-hover: var(--normal-color-button-border-hover); --color-button-secondary-surface: var(--normal-color-button-secondary-surface); --color-button-secondary-surface-hover: var(--normal-color-button-secondary-surface-hover); --color-button-secondary-text: var(--normal-color-button-secondary-text); --color-button-secondary-text-hover: var(--normal-color-button-secondary-text-hover); --color-button-secondary-border: var(--normal-color-button-secondary-border); --color-button-secondary-border-hover: var(--normal-color-button-secondary-border-hover); --color-content-accent-primary: var(--normal-color-content-accent-primary); --color-content-accent-inverse: var(--normal-color-content-accent-inverse); --color-true: var(--normal-color-true); --color-true-light: var(--normal-color-true-light); --color-false: var(--normal-color-false); --color-false-light: var(--normal-color-false-light); --color-rating-stars: var(--normal-color-rating-stars); --color-toggle-thumb-surface: var(--normal-color-toggle-thumb-surface); --color-toggle-thumb-border-on: var(--normal-color-toggle-thumb-border-on); --color-toggle-thumb-border-off: var(--normal-color-toggle-thumb-border-off); --color-toggle-surface-on: var(--normal-color-toggle-surface-on); --color-toggle-border-on: var(--normal-color-toggle-border-on); --color-toggle-surface-off: var(--normal-color-toggle-surface-off); --color-toggle-border-off: var(--normal-color-toggle-border-off); color: var(--color-text-default); } .ante-inverse, .ante-inverse .ante-inverse .ante-inverse { --color-surface-background: var(--invert-color-surface-background); --color-surface-dark: var(--invert-color-surface-dark); --color-surface-x-dark: var(--invert-color-surface-x-dark); --color-surface-xx-dark: var(--invert-color-surface-xx-dark); --color-surface-xxx-dark: var(--invert-color-surface-xxx-dark); --color-surface-accent: var(--invert-color-surface-accent); --color-surface-accent-inverse: var(--invert-color-surface-accent-inverse); --color-surface-alpha-dark: var(--invert-color-surface-alpha-dark); --color-surface-alpha-x-dark: var(--invert-color-surface-alpha-x-dark); --color-surface-input: var(--invert-color-surface-input); --color-text-default: var(--invert-color-text-default); --color-text-muted: var(--invert-color-text-muted); --color-text-faint: var(--invert-color-text-faint); --color-text-alt: var(--invert-color-text-alt); --color-text-link: var(--invert-color-text-link); --color-text-input: var(--invert-color-text-input); --color-border-default: var(--invert-color-border-default); --color-border-default-secondary: var(--invert-color-border-default-secondary); --color-border-active: var(--invert-color-border-active); --color-border-active-secondary: var(--invert-color-border-active-secondary); --color-border-alpha: var(--invert-color-border-alpha); --color-button-surface: var(--invert-color-button-surface); --color-button-surface-hover: var(--invert-color-button-surface-hover); --color-button-text: var(--invert-color-button-text); --color-button-text-hover: var(--invert-color-button-text-hover); --color-button-border: var(--invert-color-button-border); --color-button-border-hover: var(--invert-color-button-border-hover); --color-button-secondary-surface: var(--invert-color-button-secondary-surface); --color-button-secondary-surface-hover: var(--invert-color-button-secondary-surface-hover); --color-button-secondary-text: var(--invert-color-button-secondary-text); --color-button-secondary-text-hover: var(--invert-color-button-secondary-text-hover); --color-button-secondary-border: var(--invert-color-button-secondary-border); --color-button-secondary-border-hover: var(--invert-color-button-secondary-border-hover); --color-content-accent-primary: var(--invert-color-content-accent-primary); --color-content-accent-inverse: var(--invert-color-content-accent-inverse); --color-true: var(--invert-color-true); --color-true-light: var(--invert-color-true-light); --color-false: var(--invert-color-false); --color-false-light: var(--invert-color-false-light); --color-rating-stars: var(--invert-color-rating-stars); --color-toggle-thumb-surface: var(--invert-color-toggle-thumb-surface); --color-toggle-thumb-border-on: var(--invert-color-toggle-thumb-border-on); --color-toggle-thumb-border-off: var(--invert-color-toggle-thumb-border-off); --color-toggle-surface-on: var(--invert-color-toggle-surface-on); --color-toggle-border-on: var(--invert-color-toggle-border-on); --color-toggle-surface-off: var(--invert-color-toggle-surface-off); --color-toggle-border-off: var(--invert-color-toggle-border-off); color: var(--color-text-default); } .ante-inverse .ante-inverse, .ante-inverse .ante-inverse .ante-inverse .ante-inverse { --color-surface-background: var(--normal-color-surface-background); --color-surface-dark: var(--normal-color-surface-dark); --color-surface-x-dark: var(--normal-color-surface-x-dark); --color-surface-xx-dark: var(--normal-color-surface-xx-dark); --color-surface-xxx-dark: var(--normal-color-surface-xxx-dark); --color-surface-accent: var(--normal-color-surface-accent); --color-surface-accent-inverse: var(--normal-color-surface-accent-inverse); --color-surface-alpha-dark: var(--normal-color-surface-alpha-dark); --color-surface-alpha-x-dark: var(--normal-color-surface-alpha-x-dark); --color-surface-input: var(--normal-color-surface-input); --color-text-default: var(--normal-color-text-default); --color-text-muted: var(--normal-color-text-muted); --color-text-faint: var(--normal-color-text-faint); --color-text-alt: var(--normal-color-text-alt); --color-text-link: var(--normal-color-text-link); --color-text-input: var(--normal-color-text-input); --color-border-default: var(--normal-color-border-default); --color-border-default-secondary: var(--normal-color-border-default-secondary); --color-border-active: var(--normal-color-border-active); --color-border-active-secondary: var(--normal-color-border-active-secondary); --color-border-alpha: var(--normal-color-border-alpha); --color-button-surface: var(--normal-color-button-surface); --color-button-surface-hover: var(--normal-color-button-surface-hover); --color-button-text: var(--normal-color-button-text); --color-button-text-hover: var(--normal-color-button-text-hover); --color-button-border: var(--normal-color-button-border); --color-button-border-hover: var(--normal-color-button-border-hover); --color-button-secondary-surface: var(--normal-color-button-secondary-surface); --color-button-secondary-surface-hover: var(--normal-color-button-secondary-surface-hover); --color-button-secondary-text: var(--normal-color-button-secondary-text); --color-button-secondary-text-hover: var(--normal-color-button-secondary-text-hover); --color-button-secondary-border: var(--normal-color-button-secondary-border); --color-button-secondary-border-hover: var(--normal-color-button-secondary-border-hover); --color-content-accent-primary: var(--normal-color-content-accent-primary); --color-content-accent-inverse: var(--normal-color-content-accent-inverse); --color-true: var(--normal-color-true); --color-true-light: var(--normal-color-true-light); --color-false: var(--normal-color-false); --color-false-light: var(--normal-color-false-light); --color-rating-stars: var(--normal-color-rating-stars); --color-toggle-thumb-surface: var(--normal-color-toggle-thumb-surface); --color-toggle-thumb-border-on: var(--normal-color-toggle-thumb-border-on); --color-toggle-thumb-border-off: var(--normal-color-toggle-thumb-border-off); --color-toggle-surface-on: var(--normal-color-toggle-surface-on); --color-toggle-border-on: var(--normal-color-toggle-border-on); --color-toggle-surface-off: var(--normal-color-toggle-surface-off); --color-toggle-border-off: var(--normal-color-toggle-border-off); color: var(--color-text-default); } /* END_SNIPPET:ante-import-colours */ /* START_SNIPPET:ante-import-custom-select (INDEX:105) */ custom-select:not(.initialised) { display: none; } custom-select { --color-custom-select-background: var(--color-surface-dark); --color-custom-select-background-active: var(--color-surface-dark); --color-custom-select-text: var(--color-text-default); --color-custom-select-text-active: var(--color-text-default); position: relative; z-index: 10; display: block; font-size: var(--font-size-body-small); box-shadow: var(--elevated-shadow); transform: var(--elevated-translate); transition: box-shadow .15s, transform .15s; font-family: var(--font-caption); } custom-select span { font-family: var(--font-caption) !important; } custom-select:hover { box-shadow: var(--elevated-shadow-hover); transform: var(--elevated-translate-hover); } custom-select:active { box-shadow: var(--elevated-shadow-active); transform: var(--elevated-translate-active); } custom-select[disabled] .select-button { /* the button covers the whole control and sets its own cursor, so the host's would never reach the pointer */ cursor: not-allowed; } custom-select[disabled] { opacity: 0.5; cursor: not-allowed; box-shadow: var(--elevated-shadow-none); transform: initial; } custom-select .select-button, custom-select .select-drop > div { display: flex; justify-content: space-between; border: 1px solid var(--color-border-active); align-items: center; cursor: pointer; user-select: none; color: var(--color-custom-select-text); transition: color .15s, background-color .15s, border .15s; padding: 0; background: #FBEEF4 !important; border-radius: var(--radius-medium); } custom-select[disabled] .select-button, custom-select[disabled] .select-drop > div { background-color: transparent !important; border: 1px solid var(--color-border-default); } custom-select .select-drop > div { padding: var(--micropad-large) var(--padding-medium); gap: var(--micropad-x-large); background-color: var(--color-custom-select-background); } custom-select .select-button > .select-icon { color: var(--color-custom-select-text); display: flex; align-items: center; justify-content: center; padding-right: var(--micropad-x-large); } custom-select .select-button > .select-icon svg { stroke: currentColor; width: 18px; height: 18px; } custom-select .select-button:hover, custom-select .select-button:hover *, custom-select .select-drop > div:hover, custom-select .select-drop > div:hover * { color: var(--color-custom-select-text-active); } custom-select .select-drop > div:hover { background-color: var(--color-custom-select-background-active); } custom-select .select-button.active > .select-icon svg { rotate: 180deg; } custom-select .select-drop { position: absolute; bottom: 0; transform: translateY(calc(100% + 5px)); left: 0; right: 0; border: 1px solid var(--color-border-default-secondary); border-radius: calc(1lh / 2 + var(--micropad-large)); z-index: 99; overflow: hidden; box-shadow: 0 4px 16px #0002; } custom-select .select-drop.drop-up { bottom: auto; top: 0; transform: translateY(calc(-100% - 5px)); } custom-select .select-drop > div { border: none; border-radius: 0; border-top: 1px solid var(--color-border-default-secondary); justify-content: flex-start; } custom-select .select-drop > div:first-child { border: none; } custom-select .select-label { display: grid; padding: var(--micropad-large) var(--micropad-x-large); width: 100%; } custom-select .select-label > span { grid-area: 1 / 1; visibility: hidden; display: flex; gap: var(--micropad-x-large); align-items: center; } custom-select .select-label > span.active { visibility: visible; } custom-select .ante-image { height: 44px; width: auto; min-width: 0; flex-shrink: 0; } custom-select .ante-image img { width: auto; height: 100%; } @media (max-width: 600px) { custom-select .ante-image { height: 32px; min-width: 32px; } } /* END_SNIPPET:ante-import-custom-select */ /* START_SNIPPET:ante-import-icons (INDEX:108) */ :root { --icon-padding-small: var(--micropad-small); --icon-padding-base: var(--micropad-medium); --icon-padding-large: var(--micropad-large); --icon-padding-x-large: var(--micropad-x-large); --icon-padding-xx-large: var(--micropad-xx-large); --icon-padding-xxx-large: var(--micropad-xxx-large); } .icon-small, .icon-base, .icon-large, .icon-x-large, .icon-xx-large, .icon-xxx-large, .icon-circle, .icon-tile, .icon-ghost { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: var(--icon-size, var(--icon-base)) !important; height: var(--icon-size, var(--icon-base)) !important; font-size: var(--icon-size, var(--icon-base)); color: var(--color-content-accent-primary); } .icon-small > *, .icon-base > *, .icon-large > *, .icon-x-large > *, .icon-xx-large > *, .icon-xxx-large > *, .icon-circle > *, .icon-tile > *, .icon-ghost > * { width: 100% !important; height: 100% !important; object-fit: contain !important; } i.icon-small, .icon-small > i, i.icon-base, .icon-base > i, i.icon-large, .icon-large > i, i.icon-x-large, .icon-x-large > i, i.icon-xx-large, .icon-xx-large > i, i.icon-xxx-large, .icon-xxx-large > i, .icon-circle > i, .icon-tile > i, .icon-ghost > i { transform: scale(0.8); } .icon-small.icon-small, .icon-base.icon-base, .icon-large.icon-large, .icon-x-large.icon-x-large, .icon-xx-large.icon-xx-large, .icon-xxx-large.icon-xxx-large, .icon-circle.icon-circle, .icon-tile.icon-tile, .icon-ghost.icon-ghost { box-sizing: content-box !important; } .icon-small { --icon-size: var(--icon-small); --icon-padding: var(--icon-padding-small); } .icon-base { --icon-size: var(--icon-base); --icon-padding: var(--icon-padding-base); } .icon-large { --icon-size: var(--icon-large); --icon-padding: var(--icon-padding-large); } .icon-x-large { --icon-size: var(--icon-x-large); --icon-padding: var(--icon-padding-x-large); } .icon-xx-large { --icon-size: var(--icon-xx-large); --icon-padding: var(--icon-padding-xx-large); } .icon-xxx-large { --icon-size: var(--icon-xxx-large); --icon-padding: var(--icon-padding-xxx-large); } .icon-circle, .icon-tile, .icon-ghost { padding: var(--icon-padding, var(--micropad-medium)); } .icon-circle, .icon-tile { background: var(--color-surface-accent-inverse); color: var(--color-content-accent-inverse); } .icon-circle { border-radius: 50%; } .icon-tile { border-radius: var(--radius-large); } .icon-ghost { border: 1px solid currentColor; border-radius: 50%; } /* END_SNIPPET:ante-import-icons */ /* START_SNIPPET:ante-import-main (INDEX:109) */ html { scrollbar-gutter: stable; } body { --font: "General Sans", helvetica; --font-heading: "Druk Text Wide H", helvetica; --font-caption: "Space Mono", monospace; --font-display: "General Sans", helvetica; --font-callout: "General Sans", helvetica; --sticky-top: 90px; --ante-page-start: calc(var(--ante-header-height, 0px) + var(--ante-announcement-height, 0px)); interpolate-size: allow-keywords; background: var(--color-surface-background); display: flex; flex-direction: column; margin: 0; overflow-x: clip; min-height: 100svh; box-sizing: border-box; letter-spacing: var(--letter-spacing); } *, *::before, *::after { box-sizing: inherit; } body:has(.ante-section) { background: var(--color-surface-background); } body #MainContent { flex: 1; } body:has(.ante-section) #MainContent { max-width: var(--ante-page-width); } body:has(.ante-section) #MainContent > * { width: 100%; display: block; z-index: 1; } [hidden], style, script { display: none !important; } .ante-inverse { color: var(--color-text-default); } .spacer { flex: 1; } /* Tooltips */ #easy-tooltips { font-family: var(--font); font-size: var(--font-size-body-small); font-weight: var(--font-weight-base); letter-spacing: var(--letter-spacing); line-height: 145%; } .easy-tooltip-text { padding: var(--micropad-large) !important; text-align: left !important; } /* END_SNIPPET:ante-import-main */ /* START_SNIPPET:ante-import-marquee (INDEX:110) */ .fluid-marquee { max-width: 100%; min-width: 100%; display: flex; align-items: center; justify-content: safe center; overflow: hidden; position: relative; } .fluid-marquee-item { padding: 0 16px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } /* END_SNIPPET:ante-import-marquee */ /* START_SNIPPET:ante-import-modals (INDEX:111) */ body:has(.modal-container:is(.open, .opening, .closing)) { overflow-y: hidden; } #modals { z-index: 9999; } .modal { display: none; } .modal-container { --modal-transition-duration: 150ms; position: fixed; inset: 0; display: flex; justify-content: center; align-items: center; transition: background-color var(--modal-transition-duration), backdrop-filter var(--modal-transition-duration); pointer-events: none; } .modal-container.open { background-color: rgba(0, 0, 0, 0.40); backdrop-filter: blur(4px); pointer-events: initial; } .modal-element { --modal-max-width: min(var(--content-width), 100svw - var(--page-gutter) * 2); --modal-width-cap: 99999px; --modal-min-width: min(var(--width-3), 100svw - var(--page-gutter) * 2); --modal-max-height: calc(100svh - var(--section-spacer-small) * 2 - 52px); --modal-height-cap: 99999px; margin: auto; background-color: var(--color-surface-background); border-radius: var(--radius-medium); overflow: hidden; max-width: min(var(--modal-max-width), var(--modal-width-cap)); min-width: var(--modal-min-width); transition: opacity var(--modal-transition-duration), transform var(--modal-transition-duration); opacity: 0; position: relative; } .modal-container.open .modal-element { opacity: 1; } .modal-title-row { display: flex; gap: var(--spacing-medium); justify-content: space-between; background-color: var(--color-surface-x-dark); align-items: center; padding: var(--padding-medium) var(--padding-large); } .modal-title { color: var(--color-text-default); font-size: var(--font-size-h5); font-weight: var(--font-weight-h5); line-height: var(--line-height-h5); letter-spacing: var(--letter-spacing-heading); font-family: var(--font-heading); } .modal-title-row > .modal-close { all: unset; display: flex; cursor: pointer; justify-content: center; align-items: center; transition: color .15s; } .modal-title-row > .modal-close i { font-size: var(--font-size-h5); } .modal-title-row > .modal-close:hover { color: var(--color-button-surface-hover); } .modal-contents, .ante-section.modal-contents { --modal-content-padding-x: var(--padding-large); --modal-content-padding-y: var(--padding-large); max-height: min(var(--modal-max-height), var(--modal-height-cap)); overflow: auto; padding: var(--modal-content-padding-y) var(--modal-content-padding-x); display: block; background: initial; font-family: var(--font); } .modal-contents img { max-width: 100%; } @media (max-width: 1440px) { .modal-element { --modal-min-width: min(var(--width-4), 100svw - var(--page-gutter) * 2); --modal-max-height: min(465px, calc(100svh - var(--section-spacer-small) * 2 - 52px)); } } @media (max-width: 600px) { .modal-element { --modal-min-width: min(var(--width-5), 100svw - var(--page-gutter) * 2); --modal-max-height: calc(100svh - var(--section-spacer-small) * 2 - 52px); } } .modal-type-slideout { --modal-transition-duration: 250ms; } .modal-type-slideout .modal-element { --modal-max-width: calc(100svw - var(--page-gutter)); position: fixed; top: 0; right: 0; bottom: 0; border-radius: 0; transform: translateX(100%); opacity: 1; display: flex; flex-direction: column; } .modal-type-slideout.open .modal-element { transform: initial; } .modal-type-slideout .modal-title-row { background-color: initial; gap: var(--spacing-small); padding: var(--padding-medium); flex: none; border-bottom: 1px solid var(--color-border-default); touch-action: none; } .modal-type-slideout .modal-contents { --modal-content-padding-x: var(--padding-medium); --modal-content-padding-y: var(--padding-medium); flex: 1; min-height: 0; max-height: none; } @media (max-width: 768px) { .modal-type-slideout .modal-element { --modal-min-width: 100svw; max-height: 90svh; position: fixed; top: initial; left: 0; transform: translateY(100%); border-radius: var(--radius-large) var(--radius-large) 0 0; } } @media (max-width: 600px) { .modal-type-slideout .modal-title-row { padding-left: var(--page-gutter); padding-right: var(--page-gutter); } .modal-type-slideout .modal-contents { --modal-content-padding-x: var(--page-gutter); } } /* END_SNIPPET:ante-import-modals */ /* START_SNIPPET:ante-import-prices (INDEX:112) */ .ante-price { display: flex; align-items: center; gap: var(--micropad-x-small) var(--micropad-medium); font-family: var(--font) !important; } .ante-price-symbol { display: inline-block !important; } .ante-price * { font-family: var(--font) !important; } .ante-buy-price { min-width: max-content; } .ante-buy-compare-price { position: relative !important; min-width: max-content; display: flex; align-items: center; color: var(--color-text-faint); } .ante-buy-compare-price { color: var(--color-text-faint) !important; } .ante-buy-compare-price::before { content: ""; position: absolute; opacity: .5; background-color: var(--color-text-faint); height: .15em; left: -.1em; right: -.1em; top: calc(50%); transform: translateY(-50%); z-index: 1; } .ante-buy-label { margin-left: calc(var(--micropad-medium) * -1 + var(--micropad-x-small)); } @media (max-width: 600px) { .ante-buy-button .ante-buy-label { display: none; } } /* END_SNIPPET:ante-import-prices */ /* START_SNIPPET:ante-import-sizes (INDEX:113) */ :root { --ante-fluid-progress: 0; } @media (min-width: 620px) { :root { --ante-fluid-progress: 0.025062; } } @media (min-width: 640px) { :root { --ante-fluid-progress: 0.049911; } } @media (min-width: 660px) { :root { --ante-fluid-progress: 0.074545; } } @media (min-width: 680px) { :root { --ante-fluid-progress: 0.098963; } } @media (min-width: 700px) { :root { --ante-fluid-progress: 0.123162; } } @media (min-width: 720px) { :root { --ante-fluid-progress: 0.14714; } } @media (min-width: 740px) { :root { --ante-fluid-progress: 0.170896; } } @media (min-width: 760px) { :root { --ante-fluid-progress: 0.194427; } } @media (min-width: 780px) { :root { --ante-fluid-progress: 0.217731; } } @media (min-width: 800px) { :root { --ante-fluid-progress: 0.240805; } } @media (min-width: 820px) { :root { --ante-fluid-progress: 0.263649; } } @media (min-width: 840px) { :root { --ante-fluid-progress: 0.286258; } } @media (min-width: 860px) { :root { --ante-fluid-progress: 0.308632; } } @media (min-width: 880px) { :root { --ante-fluid-progress: 0.330766; } } @media (min-width: 900px) { :root { --ante-fluid-progress: 0.352659; } } @media (min-width: 920px) { :root { --ante-fluid-progress: 0.374308; } } @media (min-width: 940px) { :root { --ante-fluid-progress: 0.395711; } } @media (min-width: 960px) { :root { --ante-fluid-progress: 0.416863; } } @media (min-width: 980px) { :root { --ante-fluid-progress: 0.437763; } } @media (min-width: 1000px) { :root { --ante-fluid-progress: 0.458407; } } @media (min-width: 1020px) { :root { --ante-fluid-progress: 0.478791; } } @media (min-width: 1040px) { :root { --ante-fluid-progress: 0.498914; } } @media (min-width: 1060px) { :root { --ante-fluid-progress: 0.518771; } } @media (min-width: 1080px) { :root { --ante-fluid-progress: 0.538358; } } @media (min-width: 1100px) { :root { --ante-fluid-progress: 0.557672; } } @media (min-width: 1120px) { :root { --ante-fluid-progress: 0.576709; } } @media (min-width: 1140px) { :root { --ante-fluid-progress: 0.595464; } } @media (min-width: 1160px) { :root { --ante-fluid-progress: 0.613934; } } @media (min-width: 1180px) { :root { --ante-fluid-progress: 0.632114; } } @media (min-width: 1200px) { :root { --ante-fluid-progress: 0.65; } } @media (min-width: 1220px) { :root { --ante-fluid-progress: 0.667586; } } @media (min-width: 1240px) { :root { --ante-fluid-progress: 0.684867; } } @media (min-width: 1260px) { :root { --ante-fluid-progress: 0.701837; } } @media (min-width: 1280px) { :root { --ante-fluid-progress: 0.718492; } } @media (min-width: 1300px) { :root { --ante-fluid-progress: 0.734825; } } @media (min-width: 1320px) { :root { --ante-fluid-progress: 0.750828; } } @media (min-width: 1340px) { :root { --ante-fluid-progress: 0.766497; } } @media (min-width: 1360px) { :root { --ante-fluid-progress: 0.781822; } } @media (min-width: 1380px) { :root { --ante-fluid-progress: 0.796796; } } @media (min-width: 1400px) { :root { --ante-fluid-progress: 0.811412; } } @media (min-width: 1420px) { :root { --ante-fluid-progress: 0.825659; } } @media (min-width: 1440px) { :root { --ante-fluid-progress: 0.839528; } } @media (min-width: 1460px) { :root { --ante-fluid-progress: 0.853008; } } @media (min-width: 1480px) { :root { --ante-fluid-progress: 0.866089; } } @media (min-width: 1500px) { :root { --ante-fluid-progress: 0.878756; } } @media (min-width: 1520px) { :root { --ante-fluid-progress: 0.890997; } } @media (min-width: 1540px) { :root { --ante-fluid-progress: 0.902795; } } @media (min-width: 1560px) { :root { --ante-fluid-progress: 0.914135; } } @media (min-width: 1580px) { :root { --ante-fluid-progress: 0.924995; } } @media (min-width: 1600px) { :root { --ante-fluid-progress: 0.935355; } } @media (min-width: 1620px) { :root { --ante-fluid-progress: 0.945188; } } @media (min-width: 1640px) { :root { --ante-fluid-progress: 0.954464; } } @media (min-width: 1660px) { :root { --ante-fluid-progress: 0.963149; } } @media (min-width: 1680px) { :root { --ante-fluid-progress: 0.971199; } } @media (min-width: 1700px) { :root { --ante-fluid-progress: 0.978558; } } @media (min-width: 1720px) { :root { --ante-fluid-progress: 0.985155; } } @media (min-width: 1740px) { :root { --ante-fluid-progress: 0.990888; } } @media (min-width: 1760px) { :root { --ante-fluid-progress: 0.995601; } } @media (min-width: 1780px) { :root { --ante-fluid-progress: 0.99899; } } @media (min-width: 1792px) { :root { --ante-fluid-progress: 1; } } :root { --content-width: 1792px; --break-gap: var(--spacing-small); --column-count: 12; --width-1: calc((min(var(--ante-page-width) - var(--page-gutter) * 2, var(--content-width)) - var(--break-gap) * (var(--column-count) - 1)) / var(--column-count)); --width-2: calc(var(--width-1) * 2 + var(--break-gap) * 1); --width-3: calc(var(--width-1) * 3 + var(--break-gap) * 2); --width-4: calc(var(--width-1) * 4 + var(--break-gap) * 3); --width-5: calc(var(--width-1) * 5 + var(--break-gap) * 4); --width-6: calc(var(--width-1) * 6 + var(--break-gap) * 5); --width-7: calc(var(--width-1) * 7 + var(--break-gap) * 6); --width-8: calc(var(--width-1) * 8 + var(--break-gap) * 7); --width-9: calc(var(--width-1) * 9 + var(--break-gap) * 8); --width-10: calc(var(--width-1) * 10 + var(--break-gap) * 9); --width-11: calc(var(--width-1) * 11 + var(--break-gap) * 10); --width-12: calc(var(--width-1) * 12 + var(--break-gap) * 11); } @media (max-width: 1440px) { :root { --column-count: 10; } } @media (max-width: 1024px) { :root { --column-count: 8; } } @media (max-width: 600px) { :root { --column-count: 6; } } /* END_SNIPPET:ante-import-sizes */ /* START_SNIPPET:ante-import-text (INDEX:116) */ .text-display { font-family: var(--font-display); font-size: var(--font-size-display); font-weight: var(--font-weight-display); line-height: var(--line-height-display); letter-spacing: var(--letter-spacing-display); } /* Family swaps only. Size and line height stay whatever they were, so these can flip a run inside a heading or a paragraph without resizing it. */ .text-font-heading { font-family: var(--font-heading); font-weight: var(--font-weight-h); letter-spacing: var(--letter-spacing-heading); } .text-font-base { font-family: var(--font); font-weight: var(--font-weight-base); letter-spacing: var(--letter-spacing); } {%- comment -%} headings force font-weight: inherit !important on descendants, so the swap has to match it {%- endcomment -%} .ante-section :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) :is(.text-font-base, .text-font-base *) { font-family: var(--font); font-weight: var(--font-weight-base) !important; letter-spacing: var(--letter-spacing); } .ante-section :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) :is(.text-font-heading, .text-font-heading *) { font-family: var(--font-heading); font-weight: var(--font-weight-h) !important; } .ante-section :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) { all: unset; display: block; margin: 0; font-family: var(--font-heading); color: var(--color-text-default); letter-spacing: var(--letter-spacing-heading); } .ante-section :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) * { font-family: var(--font-heading); font-weight: inherit !important; } .ante-section :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) :is([class*="body-"], [class*="callout-"], [class*="display-"]), .ante-section :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) :is([class*="body-"], [class*="callout-"], [class*="display-"]) * { font-family: revert; } .ante-section :is(h1, .h1) { font-size: var(--font-size-h1); font-weight: var(--font-weight-h1); line-height: var(--line-height-h1); letter-spacing: var(--letter-spacing-heading); } .ante-section :is(h2, .h2) { font-size: var(--font-size-h2); font-weight: var(--font-weight-h2); line-height: var(--line-height-h2); letter-spacing: var(--letter-spacing-heading); } .ante-section :is(h3, .h3) { font-size: var(--font-size-h3); font-weight: var(--font-weight-h3); line-height: var(--line-height-h3); letter-spacing: var(--letter-spacing-heading); } .ante-section :is(h4, .h4) { font-size: var(--font-size-h4); font-weight: var(--font-weight-h4); line-height: var(--line-height-h4); letter-spacing: var(--letter-spacing-heading); } .ante-section :is(h5, .h5) { font-size: var(--font-size-h5); font-weight: var(--font-weight-h5); line-height: var(--line-height-h5); letter-spacing: var(--letter-spacing-heading); } .ante-section :is(h6, .h6) { font-size: var(--font-size-h6); font-weight: var(--font-weight-h6); line-height: var(--line-height-h6); letter-spacing: var(--letter-spacing-heading); } .ante-section .h1 { font-size: var(--font-size-h1); font-weight: var(--font-weight-h1); line-height: var(--line-height-h1); letter-spacing: var(--letter-spacing-heading); } .ante-section .h2 { font-size: var(--font-size-h2); font-weight: var(--font-weight-h2); line-height: var(--line-height-h2); letter-spacing: var(--letter-spacing-heading); } .ante-section .h3 { font-size: var(--font-size-h3); font-weight: var(--font-weight-h3); line-height: var(--line-height-h3); letter-spacing: var(--letter-spacing-heading); } .ante-section .h4 { font-size: var(--font-size-h4); font-weight: var(--font-weight-h4); line-height: var(--line-height-h4); letter-spacing: var(--letter-spacing-heading); } .ante-section .h5 { font-size: var(--font-size-h5); font-weight: var(--font-weight-h5); line-height: var(--line-height-h5); letter-spacing: var(--letter-spacing-heading); } .ante-section .h6 { font-size: var(--font-size-h6); font-weight: var(--font-weight-h6); line-height: var(--line-height-h6); letter-spacing: var(--letter-spacing-heading); } .text-callout-large { font-family: var(--font-callout); font-size: var(--font-size-callout-large); font-weight: var(--font-weight-callout); line-height: var(--line-height-callout-large); letter-spacing: var(--letter-spacing-callout); } .text-callout { font-family: var(--font-callout); font-size: var(--font-size-callout); font-weight: var(--font-weight-callout); line-height: var(--line-height-callout); letter-spacing: var(--letter-spacing-callout); } .text-callout-small { font-family: var(--font-callout); font-size: var(--font-size-callout-small); font-weight: var(--font-weight-callout); line-height: var(--line-height-callout-small); letter-spacing: var(--letter-spacing-callout); } .ante-section strong, .ante-section b, .ante-section .bold, strong .body-large, b .body-large, .bold .body-large, strong .body-base, b .body-base, .bold .body-base, strong .body-small, b .body-small, .bold .body-small, strong .body-x-small, b .body-x-small, .bold .body-x-small { font-weight: var(--font-weight-bold); } .text-display strong, .text-display b, .text-display .bold, strong .text-display, b .text-display, .bold .text-display { font-weight: var(--font-weight-display-bold); } .ante-section :is(h1, .h1) strong, .ante-section :is(h1, .h1) b, .ante-section :is(h1, .h1) .bold, strong .ante-section :is(h1, .h1), b .ante-section :is(h1, .h1), .bold .ante-section :is(h1, .h1) { font-weight: var(--font-weight-h1-bold) !important; } .ante-section :is(h2, .h2) strong, .ante-section :is(h2, .h2) b, .ante-section :is(h2, .h2) .bold, strong .ante-section :is(h2, .h2), b .ante-section :is(h2, .h2), .bold .ante-section :is(h2, .h2) { font-weight: var(--font-weight-h2-bold) !important; } .ante-section :is(h3, .h3) strong, .ante-section :is(h3, .h3) b, .ante-section :is(h3, .h3) .bold, strong .ante-section :is(h3, .h3), b .ante-section :is(h3, .h3), .bold .ante-section :is(h3, .h3) { font-weight: var(--font-weight-h3-bold) !important; } .ante-section :is(h4, .h4) strong, .ante-section :is(h4, .h4) b, .ante-section :is(h4, .h4) .bold, strong .ante-section :is(h4, .h4), b .ante-section :is(h4, .h4), .bold .ante-section :is(h4, .h4) { font-weight: var(--font-weight-h4-bold) !important; } .ante-section :is(h5, .h5) strong, .ante-section :is(h5, .h5) b, .ante-section :is(h5, .h5) .bold, strong .ante-section :is(h5, .h5), b .ante-section :is(h5, .h5), .bold .ante-section :is(h5, .h5) { font-weight: var(--font-weight-h5-bold) !important; } .ante-section :is(h6, .h6) strong, .ante-section :is(h6, .h6) b, .ante-section :is(h6, .h6) .bold, strong .ante-section :is(h6, .h6), b .ante-section :is(h6, .h6), .bold .ante-section :is(h6, .h6) { font-weight: var(--font-weight-h6-bold) !important; } .text-callout-large strong, .text-callout-large b, .text-callout-large .bold, .text-callout strong, .text-callout b, .text-callout .bold, .text-callout-small strong, .text-callout-small b, .text-callout-small .bold, strong .text-callout-large, b .text-callout-large, .bold .text-callout-large, strong .text-callout, b .text-callout, .bold .text-callout, strong .text-callout-small, b .text-callout-small, .bold .text-callout-small { font-weight: var(--font-weight-callout-bold); } .ante-section .muted { color: var(--color-text-muted); } .ante-section .faint { color: var(--color-text-faint); } .ante-section a { color: var(--color-text-link); text-decoration: underline; } .body-large { font-size: var(--font-size-body-large); font-weight: var(--font-weight-base); line-height: var(--line-height-body); } .ante-section, .body-base { font-size: var(--font-size-body); font-weight: var(--font-weight-base); line-height: var(--line-height-body); letter-spacing: var(--letter-spacing); } .body-small { font-size: var(--font-size-body-small); font-weight: var(--font-weight-base); line-height: var(--line-height-body); } .body-x-small { font-size: var(--font-size-body-x-small); font-weight: var(--font-weight-base); line-height: var(--line-height-body); } .body-caption-small { font-family: var(--font-caption); font-size: var(--font-size-caption-small); font-weight: var(--font-weight-caption); line-height: var(--line-height-caption); letter-spacing: var(--letter-spacing-caption); } .body-caption-x-small { font-family: var(--font-caption); font-size: var(--font-size-caption-x-small); font-weight: var(--font-weight-caption); line-height: var(--line-height-caption); letter-spacing: var(--letter-spacing-caption); } .body-caption-small strong, .body-caption-small b, .body-caption-small .bold, .body-caption-x-small strong, .body-caption-x-small b, .body-caption-x-small .bold, strong .body-caption-small, b .body-caption-small, .bold .body-caption-small, strong .body-caption-x-small, b .body-caption-x-small, .bold .body-caption-x-small { font-weight: var(--font-weight-caption-bold); } .richtext > *:not(:is(style, script, .ante-header-row, h1, h2, h3, h4, h5, h6, p, ul, ol, .metafield-rich_text_field)), .richtext > .metafield-rich_text_field > *:not(:is(style, script, .ante-header-row, h1, h2, h3, h4, h5, h6, p, ul, ol)) { display: inline-block !important; } .richtext * { white-space: pre-wrap; } .richtext > .metafield-rich_text_field { display: contents; } .richtext { --richtext-gap: var(--spacing-x-small); } .richtext :is(p, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .ante-header-row) { margin: var(--richtext-gap) 0; } .richtext.small-gap :is(p, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .ante-header-row) { margin: var(--micropad-small) 0; } .richtext > :first-child, .richtext > .metafield-rich_text_field > :first-child { margin-top: 0 !important; } .richtext > :last-child, .richtext > .metafield-rich_text_field > :last-child { margin-bottom: 0 !important; } .richtext ul, .richtext ol { padding-left: 20px; } .richtext li { list-style: initial; } .richtext.small-gap li ~ li { margin-top: var(--micropad-small); } .richtext p:empty { display: block; height: var(--spacing-x-small); } .richtext.small-gap p:empty { height: var(--micropad-small); } .ante-text-svg, .ante-text-icon-wrap { height: 0; display: inline-grid; vertical-align: middle; } .ante-text-svg svg, .ante-text-icon { height: 1lh; width: auto; transform: translateY(-64%); display: inline-block; } .text-separator { height: 1lh; border-right: 1px solid var(--color-text-faint); margin: 0 0.3lh; opacity: 0.5; } .highlight { background-color: var(--color-surface-dark); padding: 0.05em 0.25em; border-radius: var(--radius-x-small); } .ante-text-tag { display: inline-block; padding: 0.05em 0.25em; border-radius: var(--radius-x-small); } .popupable-container { font-family: var(--font); } /* END_SNIPPET:ante-import-text */