@a-type/ui 5.0.19 → 5.0.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/css/main.css CHANGED
@@ -1,10 +1,10 @@
1
1
  @layer preflightBase, preflightVariant, primitives, components, composed, composed-2, responsive, variants, utilities, user;
2
2
  @layer preflightBase{*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}}@layer preflightBase{::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}}
3
3
  :root { --u-font-sans: "Inter", sans-serif; --u-font-serif: "Domine", serif; --u-font-title: "Inter", sans-serif; --u-font-default: var(--u-font-sans, sans-serif); --z-now-playing: 40; --z-nav: 50; --z-menu: 100; --z-backdrop: 900; --z-dialog: 1000; --z-tooltip: 10000; --z-overdraw: 100000; --un-shadow-color: #000000; --un-shadow-opacity: 10%; --t-arrow-size: 1rem; } @layer preflightBase { html, body { margin: 0; padding: 0; font-family: var(--u-font-default, sans-serif); font-size: 16px; min-height: 100%; --webkit-font-smoothing: antialiased; } body { overflow: overlay; } #root, #main, #app, #storybook-root { isolation: isolate; display: flex; flex-direction: column; min-height: 100dvh; } a { color: inherit; text-decoration: none; } * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; border-style: solid; border-width: 0; } }
4
- .palette-primary, .theme-primary { --p-name: primary; --p-main-hue: var(--u-c-primary-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-primary { --u-c-primary-hue: var(--u-c-primary-hue); --u-c-accent-hue: var(--u-c-primary-accent-hue); } .palette-accent, .theme-accent { --p-name: accent; --p-main-hue: var(--u-c-accent-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-accent { --u-c-primary-hue: var(--u-c-accent-hue); --u-c-accent-hue: var(--u-c-accent-accent-hue); } .palette-lemon, .theme-lemon { --p-name: lemon; --p-main-hue: var(--u-c-lemon-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(90.8)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-lemon { --u-c-primary-hue: var(--u-c-lemon-hue); --u-c-accent-hue: var(--u-c-lemon-accent-hue); } .palette-leek, .theme-leek { --p-name: leek; --p-main-hue: var(--u-c-leek-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(165.88)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-leek { --u-c-primary-hue: var(--u-c-leek-hue); --u-c-accent-hue: var(--u-c-leek-accent-hue); } .palette-tomato, .theme-tomato { --p-name: tomato; --p-main-hue: var(--u-c-tomato-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(10.51)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-tomato { --u-c-primary-hue: var(--u-c-tomato-hue); --u-c-accent-hue: var(--u-c-tomato-accent-hue); } .palette-blueberry, .theme-blueberry { --p-name: blueberry; --p-main-hue: var(--u-c-blueberry-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(248.14)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-blueberry { --u-c-primary-hue: var(--u-c-blueberry-hue); --u-c-accent-hue: var(--u-c-blueberry-accent-hue); } .palette-eggplant, .theme-eggplant { --p-name: eggplant; --p-main-hue: var(--u-c-eggplant-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(280.21)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-eggplant { --u-c-primary-hue: var(--u-c-eggplant-hue); --u-c-accent-hue: var(--u-c-eggplant-accent-hue); } .palette-attention, .theme-attention { --p-name: attention; --p-main-hue: var(--u-c-attention-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(30)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(30)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(30)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(30)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(30)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-attention { --u-c-primary-hue: var(--u-c-attention-hue); --u-c-accent-hue: var(--u-c-attention-accent-hue); } .palette-success, .theme-success { --p-name: success; --p-main-hue: var(--u-c-success-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(140)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(140)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(140)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(140)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(140)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-success { --u-c-primary-hue: var(--u-c-success-hue); --u-c-accent-hue: var(--u-c-success-accent-hue); } .palette-main { --p-saturation: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .palette-gray, .theme-gray { --p-name: gray; --p-saturation: 0.15; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-gray { --u-c-primary-hue: var(--u-c-gray-hue); --u-c-accent-hue: var(--u-c-gray-accent-hue); } .palette-high-contrast, .theme-high-contrast { --p-name: high-contrast; --p-saturation: 0.04; --p-lightness-spread: 10; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-high-contrast { --u-c-primary-hue: var(--u-c-high-contrast-hue); --u-c-accent-hue: var(--u-c-high-contrast-accent-hue); } body { --p-name: 'primary'; --v-c-i: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --v-bg-l: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); color: var(--v-c-i); background-color: var(--v-bg-l); --p-main-hue: var(--u-c-primary-hue); --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } @property --v-c { syntax: "*"; inherits: false; } @property --v-c-i { syntax: "*"; inherits: true; } @property --v-c-op { syntax: "<percentage>"; inherits: false; } @property --v-bg { syntax: "*"; inherits: false; } @property --v-bg-l { syntax: "*"; inherits: true; } @property --v-bg-op { syntax: "<percentage>"; inherits: false; } @property --v-bd-c { syntax: "*"; inherits: false; } @property --v-bd-c-i { syntax: "*"; inherits: true; } @property --v-bd-c-op { syntax: "<percentage>"; inherits: false; } @property --v-bd-t-c { syntax: "*"; inherits: false; } @property --v-bd-t-c-i { syntax: "*"; inherits: true; } @property --v-bd-t-c-op { syntax: "<percentage>"; inherits: false; } @property --v-bd-r-c { syntax: "*"; inherits: false; } @property --v-bd-r-c-i { syntax: "*"; inherits: true; } @property --v-bd-r-c-op { syntax: "<percentage>"; inherits: false; } @property --v-bd-b-c { syntax: "*"; inherits: false; } @property --v-bd-b-c-i { syntax: "*"; inherits: true; } @property --v-bd-b-c-op { syntax: "<percentage>"; inherits: false; } @property --v-bd-l-c { syntax: "*"; inherits: false; } @property --v-bd-l-c-i { syntax: "*"; inherits: true; } @property --v-bd-l-c-op { syntax: "<percentage>"; inherits: false; } @property --v-ring-c { syntax: "*"; inherits: false; } @property --v-ring-c-i { syntax: "*"; inherits: true; } @property --v-ring-c-op { syntax: "<percentage>"; inherits: false; }
4
+ .palette-primary, .theme-primary { --p-name: primary; --p-main-hue: var(--u-c-primary-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-primary { --u-c-primary-hue: var(--u-c-primary-hue); --u-c-accent-hue: var(--u-c-primary-accent-hue); } .palette-accent, .theme-accent { --p-name: accent; --p-main-hue: var(--u-c-accent-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-accent { --u-c-primary-hue: var(--u-c-accent-hue); --u-c-accent-hue: var(--u-c-accent-accent-hue); } .palette-lemon, .theme-lemon { --p-name: lemon; --p-main-hue: var(--u-c-lemon-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(90.8)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-lemon { --u-c-primary-hue: var(--u-c-lemon-hue); --u-c-accent-hue: var(--u-c-lemon-accent-hue); } .palette-leek, .theme-leek { --p-name: leek; --p-main-hue: var(--u-c-leek-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(165.88)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-leek { --u-c-primary-hue: var(--u-c-leek-hue); --u-c-accent-hue: var(--u-c-leek-accent-hue); } .palette-tomato, .theme-tomato { --p-name: tomato; --p-main-hue: var(--u-c-tomato-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(10.51)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-tomato { --u-c-primary-hue: var(--u-c-tomato-hue); --u-c-accent-hue: var(--u-c-tomato-accent-hue); } .palette-blueberry, .theme-blueberry { --p-name: blueberry; --p-main-hue: var(--u-c-blueberry-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(248.14)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-blueberry { --u-c-primary-hue: var(--u-c-blueberry-hue); --u-c-accent-hue: var(--u-c-blueberry-accent-hue); } .palette-eggplant, .theme-eggplant { --p-name: eggplant; --p-main-hue: var(--u-c-eggplant-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(280.21)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-eggplant { --u-c-primary-hue: var(--u-c-eggplant-hue); --u-c-accent-hue: var(--u-c-eggplant-accent-hue); } .palette-attention, .theme-attention { --p-name: attention; --p-main-hue: var(--u-c-attention-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(30)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(30)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(30)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(30)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(30)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-attention { --u-c-primary-hue: var(--u-c-attention-hue); --u-c-accent-hue: var(--u-c-attention-accent-hue); } .palette-success, .theme-success { --p-name: success; --p-main-hue: var(--u-c-success-hue); --p-saturation: 1; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(140)); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(140)); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(140)); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(140)); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(140)); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-success { --u-c-primary-hue: var(--u-c-success-hue); --u-c-accent-hue: var(--u-c-success-accent-hue); } .palette-main { --p-saturation: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .palette-gray, .theme-gray { --p-name: gray; --p-saturation: 0.15; --p-lightness-spread: 1; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-gray { --u-c-primary-hue: var(--u-c-gray-hue); --u-c-accent-hue: var(--u-c-gray-accent-hue); } .palette-high-contrast, .theme-high-contrast { --p-name: high-contrast; --p-saturation: 0.04; --p-lightness-spread: 10; --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .theme-high-contrast { --u-c-primary-hue: var(--u-c-high-contrast-hue); --u-c-accent-hue: var(--u-c-high-contrast-accent-hue); } body { --p-name: 'primary'; --v-c-i: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --v-bg-l: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); color: var(--v-c-i); background-color: var(--v-bg-l); --p-main-hue: var(--u-c-primary-hue); --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } @property --v-c { syntax: "*"; inherits: false; } @property --v-c-i { syntax: "*"; inherits: true; } @property --v-c-op { syntax: "<percentage>"; initial-value: 100%; inherits: false; } @property --v-bg { syntax: "*"; inherits: false; } @property --v-bg-l { syntax: "*"; inherits: true; } @property --v-bg-op { syntax: "<percentage>"; initial-value: 100%; inherits: false; } @property --v-bd-c { syntax: "*"; inherits: false; } @property --v-bd-c-i { syntax: "*"; inherits: true; } @property --v-bd-c-op { syntax: "<percentage>"; initial-value: 100%; inherits: false; } @property --v-bd-t-c { syntax: "*"; inherits: false; } @property --v-bd-t-c-i { syntax: "*"; inherits: true; } @property --v-bd-t-c-op { syntax: "<percentage>"; initial-value: 100%; inherits: false; } @property --v-bd-r-c { syntax: "*"; inherits: false; } @property --v-bd-r-c-i { syntax: "*"; inherits: true; } @property --v-bd-r-c-op { syntax: "<percentage>"; initial-value: 100%; inherits: false; } @property --v-bd-b-c { syntax: "*"; inherits: false; } @property --v-bd-b-c-i { syntax: "*"; inherits: true; } @property --v-bd-b-c-op { syntax: "<percentage>"; initial-value: 100%; inherits: false; } @property --v-bd-l-c { syntax: "*"; inherits: false; } @property --v-bd-l-c-i { syntax: "*"; inherits: true; } @property --v-bd-l-c-op { syntax: "<percentage>"; initial-value: 100%; inherits: false; } @property --v-ring-c { syntax: "*"; inherits: false; } @property --v-ring-c-i { syntax: "*"; inherits: true; } @property --v-ring-c-op { syntax: "<percentage>"; initial-value: 100%; inherits: false; }
5
5
  @layer preflightBase { html { --m-mult: 1; --m-l-neutral: 90%; --m-l-range-up: 10%; --m-l-range-down: 70%; --m-s-neutral: 75%; --m-s-range-up: -55%; --m-s-range-down: 20%; --m-white: #ffffff; --m-black: #000000; color: var(--v-c-i); --p-primary-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-accent-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-lemon-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(90.8)); --p-lemon-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-leek-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(165.88)); --p-leek-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-tomato-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(10.51)); --p-tomato-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-blueberry-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(248.14)); --p-blueberry-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-eggplant-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(280.21)); --p-eggplant-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-attention-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(30)); --p-attention-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(30)); --p-success-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(140)); --p-success-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(140)); --v-c-i: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --v-bg-l: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } @media (prefers-color-scheme: dark) { html { --m-mult: -1; --m-l-neutral: 60%; --m-l-range-up: 38%; --m-l-range-down: 70%; --m-s-neutral: 80%; --m-s-range-up: 40%; --m-s-range-down: -30%; --m-white: #000000; --m-black: #ffffff; color: var(--v-c-i); --p-primary-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-accent-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-lemon-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(90.8)); --p-lemon-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-leek-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(165.88)); --p-leek-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-tomato-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(10.51)); --p-tomato-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-blueberry-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(248.14)); --p-blueberry-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-eggplant-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(280.21)); --p-eggplant-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-attention-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(30)); --p-attention-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(30)); --p-success-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(140)); --p-success-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(140)); --v-c-i: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --v-bg-l: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } } } @layer preflightVariants { .override-light { --m-mult: 1; --m-l-neutral: 90%; --m-l-range-up: 10%; --m-l-range-down: 70%; --m-s-neutral: 75%; --m-s-range-up: -55%; --m-s-range-down: 20%; --m-white: #ffffff; --m-black: #000000; color: var(--v-c-i); --p-primary-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-accent-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-lemon-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(90.8)); --p-lemon-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-leek-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(165.88)); --p-leek-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-tomato-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(10.51)); --p-tomato-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-blueberry-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(248.14)); --p-blueberry-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-eggplant-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(280.21)); --p-eggplant-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-attention-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(30)); --p-attention-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(30)); --p-success-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(140)); --p-success-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(140)); --v-c-i: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --v-bg-l: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } .override-dark { --m-mult: -1; --m-l-neutral: 60%; --m-l-range-up: 38%; --m-l-range-down: 70%; --m-s-neutral: 80%; --m-s-range-up: 40%; --m-s-range-down: -30%; --m-white: #000000; --m-black: #ffffff; color: var(--v-c-i); --p-primary-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-primary-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-primary-hue,91.8))); --p-accent-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-accent-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--u-c-accent-hue,160.88))); --p-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-gray-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-high-contrast-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --p-lemon-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(90.8)); --p-lemon-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-lemon-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(90.8)); --p-leek-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(165.88)); --p-leek-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-leek-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(165.88)); --p-tomato-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(10.51)); --p-tomato-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-tomato-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(10.51)); --p-blueberry-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(248.14)); --p-blueberry-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-blueberry-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(248.14)); --p-eggplant-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(280.21)); --p-eggplant-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-eggplant-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(280.21)); --p-attention-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(30)); --p-attention-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(30)); --p-attention-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(30)); --p-success-shade-wash: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-light: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * 0.5 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * 0.75 * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-mid: oklch(calc(var(--m-l-neutral)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * var(--m-s-neutral)), 100%)) calc(140)); --p-success-shade-dark: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 0.35 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 0.5 * var(--m-mult, 1)))), 100%)) calc(140)); --p-success-shade-ink: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (1 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(140)); --v-c-i: oklch(calc(clamp(0%, (var(--m-l-neutral) - (var(--m-l-range-down) * 1 * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.04 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) - (var(--m-s-range-down) * 1 * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); --v-bg-l: oklch(calc(clamp(0%, (var(--m-l-neutral) + (var(--m-l-range-up) * var(--m-mult, 1) * var(--p-lightness-spread, 1))), 100%)) calc(clamp(0%, (0.15 * var(--p-saturation, 1) * var(--u-saturation, 1) * (var(--m-s-neutral) + (var(--m-s-range-up) * var(--m-mult, 1)))), 100%)) calc(var(--p-main-hue,var(--u-c-primary-hue,91.8)))); } }
6
6
  @font-face { font-family: "Inter"; src: url("https://resources.biscuits.club/fonts/Inter-VariableFont_slnt,wght.ttf") format("truetype-variations"); font-weight: 1 999; font-style: oblique 0deg 5deg; font-display: block; }
7
- @property --l-corner-scale { syntax: "*"; inherits: false; } @property --t-shadow-y-mult { syntax: "*"; inherits: false; }
7
+ @property --l-corner-scale { syntax: "*"; initial-value: 1; inherits: false; } @property --t-shadow-y-mult { syntax: "*"; initial-value: 1; inherits: false; }
8
8
  @layer preflightBase { :root { --u-saturation: 0.5; --u-corner-scale: 1; --u-spacing-scale: 1; --u-border-scale: 1; --u-shadow-spread: 1; --u-c-primary-hue: 90.8; --u-c-accent-hue: 165.88; --u-focus-color: var(--m-black); --u-c-lemon-hue: 90.8; --u-c-lemon-accent-hue: 165.88; --u-c-leek-hue: 165.88; --u-c-leek-accent-hue: 90.8; --u-c-tomato-hue: 10.51; --u-c-tomato-accent-hue: 165.88; --u-c-blueberry-hue: 248.14; --u-c-blueberry-accent-hue: 165.88; --u-c-eggplant-hue: 280.21; --u-c-eggplant-accent-hue: 165.88; --u-c-attention-hue: 30; --u-c-attention-accent-hue: 165.88; --u-c-success-hue: 140; --u-c-success-accent-hue: 165.88; } body, :host { font-size: 16px; } }
9
9
  .outline-off{outline:none;}.unset{all:unset;}.container{width:100%;}.hidden-input{pointer-events:none;position:absolute;z-index:-1;opacity:0;}.bottom-keyboard{bottom:var(--mock-virtual-keyboard-height,env(keyboard-inset-height,0px));}.center{left:50%;top:50%;--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));--un-translate-y:-50%;}.center-x{left:50%;--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.center-y{top:50%;--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.hidden-input::webkit-file-upload-button{display:none;}.body{min-height:100vh;color:var(--v-c,var(--v-c-i));--v-c-i:var(--p-high-contrast-shade-ink);--v-c-op:100%;background-color:var(--v-bg,var(--v-bg-l));--v-bg-l:var(--p-gray-shade-wash);--v-bg-op:100%;}.flex-0-0-auto{flex-shrink:0;flex-grow:0;flex-basis:auto;}.flex-1-0-0{flex-shrink:0;flex-grow:1;flex-basis:0px;}.border{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;}.border-default{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;--v-bd-c-i:var(--p-high-contrast-shade-ink);--v-bd-c-op:100%;}.border-light{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;--v-bd-c-i:var(--p-gray-shade-mid);--v-bd-c-op:100%;--v-bd-c:oklch(from var(--v-bd-c-i,currentColor) calc(l * (1 + 3 / 30 * -1 * var(--m-mult, 1))) calc(c * (1 - (3 * 0.1 * -1 * (1 + (1 - var(--u-saturation, 0)))))) h);}:where(.border-default),:where(.border-light){--v-bd-r-c-i:var(--v-bd-r-c,var(--v-bd-r-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-right-color:var(--v-bd-r-c,var(--v-bd-r-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-l-c-i:var(--v-bd-l-c,var(--v-bd-l-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-left-color:var(--v-bd-l-c,var(--v-bd-l-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-t-c-i:var(--v-bd-t-c,var(--v-bd-t-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-top-color:var(--v-bd-t-c,var(--v-bd-t-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-b-c-i:var(--v-bd-b-c,var(--v-bd-b-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-bottom-color:var(--v-bd-b-c,var(--v-bd-b-c-i,var(--v-bd-c,var(--v-bd-c-i))));}@layer components{.layer-components\:unset{all:unset;}.layer-components\:focus\:outline-off:focus{outline:none;}.col{display:flex;flex-direction:column;align-items:center;gap:calc(0.5rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.row{display:flex;flex-direction:row;align-items:center;gap:calc(0.5rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.layer-components\:border{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;}.layer-components\:border-default,.layer-components\:data-\[pressed\]\:border-default[data-pressed]{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;--v-bd-c-i:var(--p-high-contrast-shade-ink);--v-bd-c-op:100%;}.layer-components\:data-\[pressed\]\:hover\:border-default:hover[data-pressed]{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;--v-bd-c-i:var(--p-high-contrast-shade-ink);--v-bd-c-op:100%;}.layer-components\:focus-visible\:border:focus-visible{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;}:where(.layer-components\:border-default),:where(.layer-components\:data-\[pressed\]\:border-default)[data-pressed]{--v-bd-r-c-i:var(--v-bd-r-c,var(--v-bd-r-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-right-color:var(--v-bd-r-c,var(--v-bd-r-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-l-c-i:var(--v-bd-l-c,var(--v-bd-l-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-left-color:var(--v-bd-l-c,var(--v-bd-l-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-t-c-i:var(--v-bd-t-c,var(--v-bd-t-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-top-color:var(--v-bd-t-c,var(--v-bd-t-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-b-c-i:var(--v-bd-b-c,var(--v-bd-b-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-bottom-color:var(--v-bd-b-c,var(--v-bd-b-c-i,var(--v-bd-c,var(--v-bd-c-i))));}:where(.layer-components\:data-\[pressed\]\:hover\:border-default):hover[data-pressed]{--v-bd-r-c-i:var(--v-bd-r-c,var(--v-bd-r-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-right-color:var(--v-bd-r-c,var(--v-bd-r-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-l-c-i:var(--v-bd-l-c,var(--v-bd-l-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-left-color:var(--v-bd-l-c,var(--v-bd-l-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-t-c-i:var(--v-bd-t-c,var(--v-bd-t-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-top-color:var(--v-bd-t-c,var(--v-bd-t-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-b-c-i:var(--v-bd-b-c,var(--v-bd-b-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-bottom-color:var(--v-bd-b-c,var(--v-bd-b-c-i,var(--v-bd-c,var(--v-bd-c-i))));}}@layer composed{.layer-composed\:border{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;}.layer-composed\:border-light{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;--v-bd-c-i:var(--p-gray-shade-mid);--v-bd-c-op:100%;--v-bd-c:oklch(from var(--v-bd-c-i,currentColor) calc(l * (1 + 3 / 30 * -1 * var(--m-mult, 1))) calc(c * (1 - (3 * 0.1 * -1 * (1 + (1 - var(--u-saturation, 0)))))) h);}:where(.layer-composed\:border-light){--v-bd-r-c-i:var(--v-bd-r-c,var(--v-bd-r-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-right-color:var(--v-bd-r-c,var(--v-bd-r-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-l-c-i:var(--v-bd-l-c,var(--v-bd-l-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-left-color:var(--v-bd-l-c,var(--v-bd-l-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-t-c-i:var(--v-bd-t-c,var(--v-bd-t-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-top-color:var(--v-bd-t-c,var(--v-bd-t-c-i,var(--v-bd-c,var(--v-bd-c-i))));--v-bd-b-c-i:var(--v-bd-b-c,var(--v-bd-b-c-i,var(--v-bd-c,var(--v-bd-c-i))));border-bottom-color:var(--v-bd-b-c,var(--v-bd-b-c-i,var(--v-bd-c,var(--v-bd-c-i))));}}@layer primitives{.layer-primitives\:border{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;}}@layer variants{.layer-variants\:border{border-width:calc(1px * var(--u-border-scale,1));border-style:solid;}}@media (min-width: 640px){.container{max-width:640px;}}@media (min-width: 768px){.container{max-width:768px;}}@media (min-width: 1024px){.container{max-width:1024px;}}@media (min-width: 1280px){.container{max-width:1280px;}}@media (min-width: 1536px){.container{max-width:1536px;}}.\[--gap\:0\.75rem\]{--gap:0.75rem;}.\[--height\:var\(--toast-frontmost-height\,var\(--toast-height\)\)\]{--height:var(--toast-frontmost-height,var(--toast-height));}.\[--offset-y\:calc\(var\(--toast-offset-y\)\+calc\(var\(--toast-index\)\*var\(--gap\)\)\+var\(--toast-swipe-movement-y\)\)\]{--offset-y:calc(var(--toast-offset-y) + calc(var(--toast-index) * var(--gap)) + var(--toast-swipe-movement-y));}.\[--peek\:0\.75rem\]{--peek:0.75rem;}.\[--scale\:calc\(max\(0\,1-\(var\(--toast-index\)\*0\.1\)\)\)\]{--scale:calc(max(0,1 - (var(--toast-index) * 0.1)));}.\[--shrink\:calc\(1-var\(--scale\)\)\]{--shrink:calc(1 - var(--scale));}.\[all\:unset\]{all:unset;}.\[background-size\:400\%_400\%\]{background-size:400% 400%;}.\[grid-area\:content\]{grid-area:content;}.\[grid-area\:leftGrid\]{grid-area:leftGrid;}.\[grid-area\:leftMonth\]{grid-area:leftMonth;}.\[grid-area\:nextMonth\]{grid-area:nextMonth;}.\[grid-area\:prevMonth\]{grid-area:prevMonth;}.\[grid-area\:rightGrid\]{grid-area:rightGrid;}.\[grid-area\:rightMonth\]{grid-area:rightMonth;}.\[justify-self\:anchor-center\]{justify-self:anchor-center;}.\[outline\:none\],.foc-contained>*:focus,.foc-effect:focus,.foc-lg:focus,.foc:focus{outline:none;}.\[stroke-dasharray\:80_200\]{stroke-dasharray:80 200;}.\[stroke-dashoffset\:0\]{stroke-dashoffset:0;}.\[transition-duration\:250ms\]{transition-duration:250ms;}.\[transition\:transform_0\.5s_cubic-bezier\(0\.22\,1\,0\.36\,1\)\,opacity_0\.5s\,height_0\.15s\]{transition:transform 0.5s cubic-bezier(0.22,1,0.36,1),opacity 0.5s,height 0.15s;}.contain-strict{contain:strict;}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}.pointer-events-auto{pointer-events:auto;}.\!pointer-events-none{pointer-events:none !important;}.\[\&\[data-behind\]\:not\(\[data-expanded\]\)\]\:pointer-events-none[data-behind]:not([data-expanded]),.pointer-events-none{pointer-events:none;}.\!visible{visibility:visible !important;}.visible{visibility:visible;}[data-behind]:not([data-expanded]) .\[\[data-behind\]\:not\(\[data-expanded\]\)_\&\]\:invisible{visibility:hidden;}.absolute{position:absolute;}.fixed{position:fixed;}.relative{position:relative;}.sticky{position:sticky;}.after\:absolute::after{position:absolute;}.static{position:static;}.inset-0{inset:0px;}.after\:inset-0::after{inset:0px;}.bottom-\[anchor\(bottom\)\]{bottom:anchor(bottom);}.bottom-\[var\(--mock-virtual-keyboard-height\,env\(keyboard-inset-height\,0px\)\)\]{bottom:var(--mock-virtual-keyboard-height,env(keyboard-inset-height,0px));}.bottom-0{bottom:0px;}.bottom-0px{bottom:0;}.bottom-2{bottom:0.5rem;}.left-\[anchor\(left\)\]{left:anchor(left);}.left-\[anchor\(right\)\]{left:anchor(right);}.left-0{left:0px;}.left-1\/2{left:50%;}.left-2{left:0.5rem;}.left-auto{left:auto;}.right-\[anchor\(right\)\]{right:anchor(right);}.right-0{right:0px;}.right-2{right:0.5rem;}.right-md{right:calc(1rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.right-sm{right:calc(0.5rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.right-xs{right:calc(0.25rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.top-\[anchor\(bottom\)\]{top:anchor(bottom);}.top-0{top:0px;}.top-1\/2{top:50%;}.top-1px{top:1px;}.top-2{top:0.5rem;}.top-2px{top:2px;}.top-auto{top:auto;}.top-md{top:calc(1rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.top-sm{top:calc(0.5rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.top-xs{top:calc(0.25rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.after\:left-0::after{left:0px;}.after\:top-auto::after{top:auto;}.after\:top-full::after{top:100%;}.isolate{isolation:isolate;}.z--1{z-index:-1;}.z-\[1000000\],.z-1000000{z-index:1000000;}.z-\[calc\(100000-var\(--toast-index\)\)\]{z-index:calc(100000 - var(--toast-index));}.z-1{z-index:1;}.z-1000{z-index:1000;}.z-10000{z-index:10000;}.z-10001{z-index:10001;}.z-101{z-index:101;}.grid{display:grid;}.col-span-2,.grid-col-span-2{grid-column:span 2/span 2;}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr));}.m-0{margin:0px;}.m-1{margin:0.25rem;}.m-auto{margin:auto;}.m5\.87{margin:1.4675rem;}.my-4{margin-top:1rem;margin-bottom:1rem;}.my-auto{margin-top:auto;margin-bottom:auto;}.mb-1{margin-bottom:0.25rem;}.mb-auto{margin-bottom:auto;}.mb-sm{margin-bottom:calc(0.5rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.me{margin-inline-end:1rem;}.ml-auto{margin-left:auto;}.ml-md{margin-left:calc(1rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.ml-sm{margin-left:calc(0.5rem * var(--l-spacing-scale,1) * var(--u-spacing-scale,1));}.mr-0{margin-right:0px;}.mr-1{margin-right:0.25rem;}.mr-auto{margin-right:auto;}.mt-200px{margin-top:200px;}.mt-auto{margin-top:auto;}.inline{display:inline;}.block{display:block;}.inline-block{display:inline-block;}.\!hidden{display:none !important;}.\[\&\:\:webkit-file-upload-button\]\:hidden::webkit-file-upload-button,.hidden,[data-has-icon=true] .\[\[data-has-icon\=true\]_\&\]\:hidden{display:none;}.aspect-\[9\/16\]{aspect-ratio:9/16;}.aspect-1{aspect-ratio:1;}.\[\&\[data-state\=closed\]\]\:max-h-\[var\(--peek-height\,120px\)\][data-state=closed]{max-height:var(--peek-height,120px);}.data-\[both\]\:h-\[--collapsible-panel-height\][data-both],.data-\[vertical\]\:h-\[--collapsible-panel-height\][data-vertical]{height:var(--collapsible-panel-height);}.data-\[both\]\:w-\[--collapsible-panel-width\][data-both],.data-\[horizontal\]\:w-\[--collapsible-panel-width\][data-horizontal]{width:var(--collapsible-panel-width);}.data-\[expanded\]\:h-\[--toast-height\][data-expanded]{height:var(--toast-height);}.h-\[--height\]{height:var(--height);}.h-\[100vh\],.h-screen{height:100vh;}.h-\[12px\]{height:12px;}.h-\[var\(--mock-virtual-keyboard-height\,0\)\]{height:var(--mock-virtual-keyboard-height,0);}.h-100px{height:100px;}.h-16px{height:16px;}.h-1em{height:1em;}.h-1px{height:1px;}.h-200px{height:200px;}.h-240px{height:240px;}.h-24px{height:24px;}.h-300px{height:300px;}.h-32{height:8rem;}.h-600px{height:600px;}.h-64{height:16rem;}.h-80px{height:80px;}.h-full{height:100%;}.h-touch{height:30px;}.h1{height:0.25rem;}.h2{height:0.5rem;}.h3{height:0.75rem;}.h4{height:1rem;}.h5{height:1.25rem;}.max-h-200px{max-height:200px;}.max-h-20vh{max-height:20vh;}.max-h-full{max-height:100%;}.max-w-300px{max-width:300px;}.max-w-full{max-width:100%;}.max-w-sm{max-width:24rem;}.min-h-0{min-height:0;}.min-h-18px{min-height:18px;}.min-h-200px{min-height:200px;}.min-h-20vh{min-height:20vh;}.min-h-32px{min-height:32px;}.min-h-80px{min-height:80px;}.min-h-80vh{min-height:80vh;}.min-h-screen{min-height:100vh;}.min-w-0{min-width:0;}.min-w-32px{min-width:32px;}.min-w-80px{min-width:80px;}.start-end\:data-\[both\]\:h-0[data-both][data-starting-style], .start-end\:data-\[both\]\:h-0[data-both][data-ending-style],.start-end\:data-\[vertical\]\:h-0[data-vertical][data-starting-style], .start-end\:data-\[vertical\]\:h-0[data-vertical][data-ending-style]{height:0;}.start-end\:data-\[both\]\:w-0[data-both][data-starting-style], .start-end\:data-\[both\]\:w-0[data-both][data-ending-style],.start-end\:data-\[horizontal\]\:w-0[data-horizontal][data-starting-style], .start-end\:data-\[horizontal\]\:w-0[data-horizontal][data-ending-style],.w-0{width:0;}.w-\[12px\]{width:12px;}.w-\[200px\],.w-200px{width:200px;}.w-10000px{width:10000px;}.w-16px{width:16px;}.w-1em{width:1em;}.w-24px{width:24px;}.w-300px{width:300px;}.w-400px{width:400px;}.w-64{width:16rem;}.w-800px{width:800px;}.w-80px{width:80px;}.w-95vw{width:95vw;}.w-full{width:100%;}.w-max-content{width:max-content;}.w-touch{width:30px;}[data-behind]:not([data-expanded]) .\[\[data-behind\]\:not\(\[data-expanded\]\)_\&\]\:max-h-\[--height\]{max-height:var(--height);}.after\:h-\[calc\(var\(--gap\)\+1px\)\]::after{height:calc(var(--gap) + 1px);}.after\:h-80px::after{height:80px;}.after\:w-full::after{width:100%;}.flex{display:flex;}.after\:flex::after{display:flex;}.inline-flex{display:inline-flex;}.flex-1{flex:1 1 0%;}.flex-shrink-0,.shrink-0{flex-shrink:0;}.flex-grow,.flex-grow-1,.grow{flex-grow:1;}.flex-grow-0{flex-grow:0;}.flex-basis-0{flex-basis:0px;}.flex-basis-auto{flex-basis:auto;}.flex-row{flex-direction:row;}.flex-col{flex-direction:column;}.after\:flex-col::after{flex-direction:column;}.flex-wrap{flex-wrap:wrap;}.table{display:table;}.origin-top{transform-origin:top;}.transform-origin-\[--transform-origin\]{transform-origin:var(--transform-origin);}.transform-origin-\[50\%_50\%\]{transform-origin:50% 50%;}.\[\&\[data-ending-style\]\:not\(\[data-limited\]\)\:not\(\[data-swipe-direction\]\)\]\:-translate-y-150\%[data-ending-style]:not([data-limited]):not([data-swipe-direction]),.data-\[starting-style\]\:-translate-y-150\%[data-starting-style]{--un-translate-y:-150%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.data-\[ending-style\]\:data-\[swipe-direction\=down\]\:translate-y-\[calc\(var\(--toast-swipe-movement-y\)\+150\%\)\][data-swipe-direction=down][data-ending-style],.data-\[expanded\]\:data-\[ending-style\]\:data-\[swipe-direction\=down\]\:translate-y-\[calc\(var\(--toast-swipe-movement-y\)\+150\%\)\][data-swipe-direction=down][data-ending-style][data-expanded]{--un-translate-y:calc(var(--toast-swipe-movement-y) + 150%);transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.data-\[ending-style\]\:data-\[swipe-direction\=left\]\:translate-x-\[calc\(var\(--toast-swipe-movement-x\)-150\%\)\][data-swipe-direction=left][data-ending-style],.data-\[expanded\]\:data-\[ending-style\]\:data-\[swipe-direction\=left\]\:translate-x-\[calc\(var\(--toast-swipe-movement-x\)-150\%\)\][data-swipe-direction=left][data-ending-style][data-expanded]{--un-translate-x:calc(var(--toast-swipe-movement-x) - 150%);transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.data-\[ending-style\]\:data-\[swipe-direction\=left\]\:translate-y-\[var\(--offset-y\)\][data-swipe-direction=left][data-ending-style],.data-\[ending-style\]\:data-\[swipe-direction\=right\]\:translate-y-\[var\(--offset-y\)\][data-swipe-direction=right][data-ending-style],.data-\[expanded\]\:data-\[ending-style\]\:data-\[swipe-direction\=left\]\:translate-y-\[var\(--offset-y\)\][data-swipe-direction=left][data-ending-style][data-expanded],.data-\[expanded\]\:data-\[ending-style\]\:data-\[swipe-direction\=right\]\:translate-y-\[var\(--offset-y\)\][data-swipe-direction=right][data-ending-style][data-expanded],.data-\[expanded\]\:translate-y-\[--offset-y\][data-expanded]{--un-translate-y:var(--offset-y);transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.data-\[ending-style\]\:data-\[swipe-direction\=right\]\:translate-x-\[calc\(var\(--toast-swipe-movement-x\)\+150\%\)\][data-swipe-direction=right][data-ending-style],.data-\[expanded\]\:data-\[ending-style\]\:data-\[swipe-direction\=right\]\:translate-x-\[calc\(var\(--toast-swipe-movement-x\)\+150\%\)\][data-swipe-direction=right][data-ending-style][data-expanded]{--un-translate-x:calc(var(--toast-swipe-movement-x) + 150%);transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.data-\[ending-style\]\:data-\[swipe-direction\=up\]\:translate-y-\[calc\(var\(--toast-swipe-movement-y\)-150\%\)\][data-swipe-direction=up][data-ending-style],.data-\[expanded\]\:data-\[ending-style\]\:data-\[swipe-direction\=up\]\:translate-y-\[calc\(var\(--toast-swipe-movement-y\)-150\%\)\][data-swipe-direction=up][data-ending-style][data-expanded]{--un-translate-y:calc(var(--toast-swipe-movement-y) - 150%);transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.data-\[expanded\]\:translate-x-\[--toast-swipe-movement-x\][data-expanded],.translate-x-\[--toast-swipe-movement-x\]{--un-translate-x:var(--toast-swipe-movement-x);transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.translate-x--1\/2{--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.translate-y--1\/2{--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.translate-y-\[calc\(var\(--toast-swipe-movement-y\)\+\(var\(--toast-index\)\*var\(--peek\)\)\+\(var\(--shrink\)\*var\(--height\)\)\)\]{--un-translate-y:calc(var(--toast-swipe-movement-y) + (var(--toast-index) * var(--peek)) + (var(--shrink) * var(--height)));transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.rotate-180{--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-rotate:180deg;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.rotate-90{--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-rotate:90deg;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.\[\&\[data-ending-style\]\:not\(\[data-limited\]\)\:not\(\[data-swipe-direction\]\)\]\:scale-90[data-ending-style]:not([data-limited]):not([data-swipe-direction]){--un-scale-x:0.9;--un-scale-y:0.9;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.data-\[expanded\]\:scale-100[data-expanded]{--un-scale-x:1;--un-scale-y:1;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.scale-\[var\(--scale\)\]{--un-scale-x:var(--scale);--un-scale-y:var(--scale);transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.transform{transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.transform-gpu{transform:translate3d(var(--un-translate-x), var(--un-translate-y), var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}@keyframes peek-close{
10
10
  from { height: calc(var(--collapsible-height) + 80px); max-height: none; }
@@ -14,8 +14,9 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, Pi
14
14
  disableIconMode?: boolean;
15
15
  ref?: Ref<HTMLButtonElement>;
16
16
  disableDropdownTriggerIcon?: boolean;
17
+ disableDefaultLoadingIndicator?: boolean;
17
18
  }
18
- export declare function ButtonRoot({ className, color, emphasis, size, toggled, toggleMode, align, visuallyDisabled, visuallyFocused, loading, children, disabled, disableIconMode, disableDropdownTriggerIcon, ref, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
19
+ export declare function ButtonRoot({ className, color, emphasis, size, toggled, toggleMode, align, visuallyDisabled, visuallyFocused, loading, children, disabled, disableIconMode, disableDropdownTriggerIcon, disableDefaultLoadingIndicator, ref, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
19
20
  export declare namespace ButtonRoot {
20
21
  var displayName: string;
21
22
  }
@@ -25,7 +25,7 @@ import { Spinner } from '../spinner/index.js';
25
25
  import { SlotDiv } from '../utility/SlotDiv.js';
26
26
  import { getButtonClassName } from './classes.js';
27
27
  export function ButtonRoot(_a) {
28
- var { className, color, emphasis = 'default', size, toggled, toggleMode = 'color-and-indicator', align, visuallyDisabled, visuallyFocused, loading, children, disabled, disableIconMode, disableDropdownTriggerIcon, ref } = _a, props = __rest(_a, ["className", "color", "emphasis", "size", "toggled", "toggleMode", "align", "visuallyDisabled", "visuallyFocused", "loading", "children", "disabled", "disableIconMode", "disableDropdownTriggerIcon", "ref"]);
28
+ var { className, color, emphasis = 'default', size, toggled, toggleMode = 'color-and-indicator', align, visuallyDisabled, visuallyFocused, loading, children, disabled, disableIconMode, disableDropdownTriggerIcon, disableDefaultLoadingIndicator, ref } = _a, props = __rest(_a, ["className", "color", "emphasis", "size", "toggled", "toggleMode", "align", "visuallyDisabled", "visuallyFocused", "loading", "children", "disabled", "disableIconMode", "disableDropdownTriggerIcon", "disableDefaultLoadingIndicator", "ref"]);
29
29
  const isFormSubmitting = false;
30
30
  const isSubmitLoading = 'type' in props && props.type === 'submit' && isFormSubmitting;
31
31
  const isLoading = loading || isSubmitLoading;
@@ -51,7 +51,7 @@ export function ButtonRoot(_a) {
51
51
  if (toggled !== undefined) {
52
52
  buttonProps['aria-pressed'] = !!toggled;
53
53
  }
54
- return (_jsx(IconLoadingProvider, { value: isLoading, children: _jsxs(BaseButton, Object.assign({}, buttonProps, { children: [_jsx(AnimatePresence, { children: isLoading && (_jsx(motion.div, { initial: { width: 0, marginLeft: '-0.5rem' }, animate: { width: 'auto', marginLeft: 0 }, exit: { width: 0, marginLeft: '-0.5rem' }, className: clsx('my-auto inline-block flex flex-shrink-0 overflow-hidden', '[[data-has-icon=true]_&]:hidden'), "data-default-loader": true, children: _jsx(Spinner, { size: 15, className: "inline-block h-1em w-1em" }) }, "spinner")) }), toggled !== undefined &&
54
+ return (_jsx(IconLoadingProvider, { value: isLoading, children: _jsxs(BaseButton, Object.assign({}, buttonProps, { children: [_jsx(AnimatePresence, { children: isLoading && !disableDefaultLoadingIndicator && (_jsx(motion.div, { initial: { width: 0, marginLeft: '-0.5rem' }, animate: { width: 'auto', marginLeft: 0 }, exit: { width: 0, marginLeft: '-0.5rem' }, className: clsx('my-auto inline-block flex flex-shrink-0 overflow-hidden', '[[data-has-icon=true]_&]:hidden'), "data-default-loader": true, children: _jsx(Spinner, { size: 15, className: "inline-block h-1em w-1em" }) }, "spinner")) }), toggled !== undefined &&
55
55
  (toggleMode === 'indicator' ||
56
56
  toggleMode === 'color-and-indicator') && (_jsx(ButtonToggleIndicator, { value: toggled })), children, isDropdownTrigger && (_jsx(IconLoadingProvider, { value: false, children: _jsx(DropdownMenuTriggerIcon, { render: _jsx(Icon, { name: "chevron" }) }) }))] })) }));
57
57
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":"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"}
@@ -117,7 +117,7 @@ ${[
117
117
  function propertyDefinitions(propGroup) {
118
118
  return `@property ${propGroup.FINAL} { syntax: "*"; inherits: false; }
119
119
  @property ${propGroup.INHERITED} { syntax: "*"; inherits: true; }
120
- @property ${propGroup.OPACITY} { syntax: "<percentage>"; inherits: false; }
120
+ @property ${propGroup.OPACITY} { syntax: "<percentage>"; initial-value: 100%; inherits: false; }
121
121
  `;
122
122
  }
123
123
  //# sourceMappingURL=colors.js.map
@@ -6,10 +6,12 @@ export const propertiesPreflight = preflight({
6
6
  return `
7
7
  @property ${PROPS.LOCALS.CORNER_SCALE} {
8
8
  syntax: "*";
9
+ initial-value: 1;
9
10
  inherits: false;
10
11
  }
11
12
  @property ${PROPS.UTILS.SHADOW_Y_MULT} {
12
13
  syntax: "*";
14
+ initial-value: 1;
13
15
  inherits: false;
14
16
  }
15
17
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"properties.js","sourceRoot":"","sources":["../../../../src/uno/preflights/properties.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAEvC,MAAM,CAAC,MAAM,mBAAmB,GAAG,SAAS,CAAC;IAC5C,MAAM,EAAE,CAAC,IAA6B,EAAE,EAAE;QACzC,OAAO;YACG,KAAK,CAAC,MAAM,CAAC,YAAY;;;;YAIzB,KAAK,CAAC,KAAK,CAAC,aAAa;;;;CAIpC,CAAC;IACD,CAAC;CACD,CAAC,CAAC"}
1
+ {"version":3,"file":"properties.js","sourceRoot":"","sources":["../../../../src/uno/preflights/properties.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAEvC,MAAM,CAAC,MAAM,mBAAmB,GAAG,SAAS,CAAC;IAC5C,MAAM,EAAE,CAAC,IAA6B,EAAE,EAAE;QACzC,OAAO;YACG,KAAK,CAAC,MAAM,CAAC,YAAY;;;;;YAKzB,KAAK,CAAC,KAAK,CAAC,aAAa;;;;;CAKpC,CAAC;IACD,CAAC;CACD,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@a-type/ui",
3
- "version": "5.0.19",
3
+ "version": "5.0.21",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "url": "https://github.com/a-type/ui"
@@ -48,6 +48,7 @@ export interface ButtonProps
48
48
  disableIconMode?: boolean;
49
49
  ref?: Ref<HTMLButtonElement>;
50
50
  disableDropdownTriggerIcon?: boolean;
51
+ disableDefaultLoadingIndicator?: boolean;
51
52
  }
52
53
 
53
54
  export function ButtonRoot({
@@ -65,6 +66,7 @@ export function ButtonRoot({
65
66
  disabled,
66
67
  disableIconMode,
67
68
  disableDropdownTriggerIcon,
69
+ disableDefaultLoadingIndicator,
68
70
  ref,
69
71
  ...props
70
72
  }: ButtonProps) {
@@ -125,7 +127,7 @@ export function ButtonRoot({
125
127
  <IconLoadingProvider value={isLoading}>
126
128
  <BaseButton {...buttonProps}>
127
129
  <AnimatePresence>
128
- {isLoading && (
130
+ {isLoading && !disableDefaultLoadingIndicator && (
129
131
  <motion.div
130
132
  key="spinner"
131
133
  initial={{ width: 0, marginLeft: '-0.5rem' }}
@@ -167,6 +167,6 @@ function propertyDefinitions(propGroup: {
167
167
  }) {
168
168
  return `@property ${propGroup.FINAL} { syntax: "*"; inherits: false; }
169
169
  @property ${propGroup.INHERITED} { syntax: "*"; inherits: true; }
170
- @property ${propGroup.OPACITY} { syntax: "<percentage>"; inherits: false; }
170
+ @property ${propGroup.OPACITY} { syntax: "<percentage>"; initial-value: 100%; inherits: false; }
171
171
  `;
172
172
  }
@@ -8,10 +8,12 @@ export const propertiesPreflight = preflight({
8
8
  return `
9
9
  @property ${PROPS.LOCALS.CORNER_SCALE} {
10
10
  syntax: "*";
11
+ initial-value: 1;
11
12
  inherits: false;
12
13
  }
13
14
  @property ${PROPS.UTILS.SHADOW_Y_MULT} {
14
15
  syntax: "*";
16
+ initial-value: 1;
15
17
  inherits: false;
16
18
  }
17
19
  `;