@esportsplus/ui 0.57.0 → 0.58.0

package/build/components/progress/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.progress-text-ink{position:absolute;inset:0}.progress-text-strip{position:absolute;inset:0 0 auto}.progress-text-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.progress-text-check{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;stroke-dasharray:1;stroke-dashoffset:1px}.progress-text{color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight);align-items:center;gap:var(--part-gap);line-height:var(--part-height);display:inline-flex;position:relative}.progress-text-check{height:var(--check-size);stroke-dashoffset:var(--check-offset);stroke-width:3px;transition:stroke-dashoffset var(--check-duration) var(--ease-in-out) .15s;width:var(--check-size);flex-shrink:0}.progress-text-done{filter:blur(4px);align-items:center;gap:var(--done-gap);opacity:0;pointer-events:none;transition:filter .15s var(--ease-out), opacity .15s var(--ease-out), translate .15s var(--ease-out);white-space:nowrap;grid-area:1/1;display:flex;translate:0 4px}.progress-text-done.--done{filter:none;opacity:1;pointer-events:auto;transition:filter .3s var(--ease-out) .1s, opacity .3s var(--ease-out) .1s, translate .3s var(--ease-out) .1s;translate:0}.progress-text-label{transition:filter .3s var(--ease-out), opacity .3s var(--ease-out), translate .3s var(--ease-out);white-space:nowrap;grid-area:1/1;position:relative}.progress-text-label.--done{filter:blur(4px);opacity:0;transition-duration:.2s;translate:0 -4px}.progress-text-labels{display:grid}.progress-text-percent{color:var(--muted-color);font-variant-numeric:tabular-nums;transition:filter .3s var(--ease-out), opacity .3s var(--ease-out);display:flex}.progress-text-percent.--done{filter:blur(4px);opacity:0;transition-duration:.2s}.progress-text-roll{width:1ch;height:1lh;display:inline-block;position:relative;overflow:hidden}.progress-text-strip{transition:translate .3s var(--ease-out);white-space:pre;flex-direction:column;display:flex}.progress-text-strip span{height:1lh}.progress-text-track{color:var(--track-color)}@media (prefers-reduced-motion:reduce){.progress-text-check,.progress-text-strip{transition:none}.progress-text-done,.progress-text-label.--done{translate:0}}.progress{--color:var(--color-text-500);--duration:.15s;--ease:cubic-bezier(.4, 0, .2, 1);--font-size:calc(var(--font-size-400) * .875);--height:6px;--indicator-color:var(--color-text-500);--muted-color:var(--color-text-300);--status-font-size:12px;--track-color:var(--color-grey-500)}.progress-text{--check-duration:0s;--check-offset:1;--check-size:16px;--color:var(--color-text-500);--done-gap:6px;--ease-in-out:cubic-bezier(.65, 0, .35, 1);--ease-out:cubic-bezier(.23, 1, .32, 1);--font-size:var(--font-size-400);--font-weight:var(--font-weight-500);--muted-color:var(--color-text-300);--part-gap:10px;--part-height:24px;--pour-duration:.4s;--track-color:oklch(from var(--color-text-500) l c h / .2)}@media (prefers-reduced-motion:reduce){.progress-text{--pour-duration:0s}}.progress-text--blue{--color:var(--color-blue-400);--track-color:oklch(from var(--color-blue-400) l c h / .2)}.progress-text--done{--check-duration:.3s;--check-offset:0}.progress-text--large{--check-size:22px;--done-gap:8px;--font-size:var(--font-size-600);--part-gap:14px;--part-height:32px}.progress{color:var(--color);font-size:var(--font-size);flex-direction:column;gap:8px;width:100%;display:flex}.progress-header{justify-content:space-between;align-items:baseline;display:flex}.progress-indicator{background:var(--indicator-color);height:100%;transition:translate var(--duration) var(--ease);width:100%}.progress-percent{color:var(--muted-color);font-variant-numeric:tabular-nums}.progress-status{color:var(--muted-color);font-size:var(--status-font-size)}.progress-track{background:var(--track-color);height:var(--height);border-radius:999px;width:100%;position:relative;overflow:hidden}@media (prefers-reduced-motion:reduce){.progress-indicator{transition:none}}}
+@layer components{.progress-text-ink{position:absolute;inset:0}.progress-text-strip{position:absolute;inset:0 0 auto}.progress-text-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.progress-text-check{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;stroke-dasharray:1;stroke-dashoffset:1px}.progress-text{color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight);align-items:center;gap:var(--part-gap);line-height:var(--part-height);display:inline-flex;position:relative}.progress-text-check{height:var(--check-size);stroke-dashoffset:var(--check-offset);stroke-width:3px;transition:stroke-dashoffset var(--check-duration) var(--ease-in-out) .15s;width:var(--check-size);flex-shrink:0}.progress-text-done{filter:blur(var(--blur-400));align-items:center;gap:var(--done-gap);opacity:0;pointer-events:none;transition:filter var(--duration-fast) var(--ease-out), opacity var(--duration-fast) var(--ease-out), translate var(--duration-fast) var(--ease-out);white-space:nowrap;grid-area:1/1;display:flex;translate:0 4px}.progress-text-done.--done{filter:none;opacity:1;pointer-events:auto;transition:filter var(--duration-moderate) var(--ease-out) .1s, opacity var(--duration-moderate) var(--ease-out) .1s, translate var(--duration-moderate) var(--ease-out) .1s;translate:0}.progress-text-label{transition:filter var(--duration-moderate) var(--ease-out), opacity var(--duration-moderate) var(--ease-out), translate var(--duration-moderate) var(--ease-out);white-space:nowrap;grid-area:1/1;position:relative}.progress-text-label.--done{filter:blur(var(--blur-400));opacity:0;transition-duration:var(--duration-moderate);translate:0 -4px}.progress-text-labels{display:grid}.progress-text-percent{color:var(--muted-color);font-variant-numeric:tabular-nums;transition:filter var(--duration-moderate) var(--ease-out), opacity var(--duration-moderate) var(--ease-out);display:flex}.progress-text-percent.--done{filter:blur(var(--blur-400));opacity:0;transition-duration:var(--duration-moderate)}.progress-text-roll{width:1ch;height:1lh;display:inline-block;position:relative;overflow:hidden}.progress-text-strip{transition:translate var(--duration-moderate) var(--ease-out);white-space:pre;flex-direction:column;display:flex}.progress-text-strip span{height:1lh}.progress-text-track{color:var(--track-color)}@media (prefers-reduced-motion:reduce){.progress-text-check,.progress-text-strip{transition:none}.progress-text-done,.progress-text-label.--done{translate:0}}.progress{--color:var(--color-text-500);--duration:var(--duration-fast);--ease:cubic-bezier(.4, 0, .2, 1);--font-size:calc(var(--font-size-400) * .875);--height:6px;--indicator-color:var(--color-primary-500);--muted-color:var(--color-text-300);--status-font-size:var(--font-size-300);--track-color:var(--surface-border-default)}.progress-text{--check-duration:0s;--check-offset:1;--check-size:var(--size-400);--color:var(--color-text-500);--done-gap:calc(var(--size-300) / 2);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--ease-out:var(--easing-out);--font-size:var(--font-size-400);--font-weight:var(--font-weight-500);--muted-color:var(--color-text-300);--part-gap:var(--size-200);--part-height:24px;--pour-duration:var(--duration-slow);--track-color:var(--surface-border-hover)}@media (prefers-reduced-motion:reduce){.progress-text{--pour-duration:0s}}.progress-text--blue{--color:var(--color-blue-400);--track-color:oklch(from var(--color-blue-400) l c h / .2)}.progress-text--done{--check-duration:var(--duration-moderate);--check-offset:0}.progress-text--large{--check-size:22px;--done-gap:var(--size-100);--font-size:var(--font-size-600);--part-gap:14px;--part-height:32px}.progress{color:var(--color);font-size:var(--font-size);gap:var(--size-100);flex-direction:column;width:100%;display:flex}.progress-header{justify-content:space-between;align-items:baseline;display:flex}.progress-indicator{background:var(--indicator-color);height:100%;transition:translate var(--duration) var(--ease);width:100%}.progress-percent{color:var(--muted-color);font-variant-numeric:tabular-nums}.progress-status{color:var(--muted-color);font-size:var(--status-font-size)}.progress-track{background:var(--track-color);height:var(--height);border-radius:999px;width:100%;position:relative;overflow:hidden}@media (prefers-reduced-motion:reduce){.progress-indicator{transition:none}}}
 /*$vite$:1*/

package/build/components/pull-to-refresh/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.pull-to-refresh-indicator{position:absolute;inset:0 0 auto}.pull-to-refresh-status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@property --pull-to-refresh-y{syntax:"<number>";inherits:false;initial-value:0}.pull-to-refresh{--background:var(--color-white-300);--color:var(--color-text-500);--fade-duration:.15s;--fade-timing-function:cubic-bezier(.23, 1, .32, 1);--fresh-blur:4px;--fresh-duration:.3s;--fresh-timing-function:cubic-bezier(.23, 1, .32, 1);--height:100%;--settle-duration:.617s;--slide-in-duration:.882s;--spin-duration:.8s;--spinner-animation:pull-to-refresh-spin;--spinner-size:24px;--spring:linear(0, .0575, .1803, .3208, .4551, .573, .6711, .7501, .8122, .8601, .8966, .924, .9445, .9596, .9708, .9789, .9848, .9891, .9922, .9944, .996, .9972, .998, .9986, 1)}@media (prefers-reduced-motion:reduce){.pull-to-refresh{--fresh-blur:0px}}.pull-to-refresh{height:var(--height);min-height:0;transition:--pull-to-refresh-y var(--settle-duration) var(--spring);position:relative}.pull-to-refresh--instant{transition:none}.pull-to-refresh--landing{transition-duration:var(--slide-in-duration)}.pull-to-refresh--refreshing .pull-to-refresh-glyph{animation:var(--spinner-animation) var(--spin-duration) steps(8) infinite}.pull-to-refresh-content{--pull-to-refresh-y:inherit;background:var(--background);min-height:100%;translate:0 calc(var(--pull-to-refresh-y) * 1px);-webkit-user-select:none;user-select:none}.pull-to-refresh-glyph{--pull-to-refresh-y:inherit;display:flex}.pull-to-refresh-glyph--landing{opacity:0;transition:opacity var(--fade-duration) var(--fade-timing-function)}.pull-to-refresh-indicator{--pull-to-refresh-y:inherit;color:var(--color);height:calc(var(--threshold) * 1px);opacity:clamp(0, var(--pull-to-refresh-y) / var(--threshold), 1);pointer-events:none;justify-content:center;align-items:center;display:flex}.pull-to-refresh-item--fresh{animation:pull-to-refresh-fresh var(--fresh-duration) var(--fresh-timing-function)}.pull-to-refresh-scroller{--pull-to-refresh-y:inherit;overscroll-behavior:contain;scroll-behavior:smooth;height:100%;position:relative;overflow-y:auto}@media (prefers-reduced-motion:reduce){.pull-to-refresh-scroller{scroll-behavior:auto}}.pull-to-refresh-spinner{--pull-to-refresh-y:inherit;height:var(--spinner-size);rotate:calc(var(--pull-to-refresh-y) * 3deg);width:var(--spinner-size)}.pull-to-refresh-tick{transform-origin:12px 12px}.pull-to-refresh-tick:first-child{opacity:calc(clamp(0, (var(--reveal) * 8 - 0) * 1000, 1) * 1);rotate:0deg}.pull-to-refresh-tick:nth-child(2){opacity:calc(clamp(0, (var(--reveal) * 8 - 1) * 1000, 1) * .3);rotate:45deg}.pull-to-refresh-tick:nth-child(3){opacity:calc(clamp(0, (var(--reveal) * 8 - 2) * 1000, 1) * .4);rotate:90deg}.pull-to-refresh-tick:nth-child(4){opacity:calc(clamp(0, (var(--reveal) * 8 - 3) * 1000, 1) * .5);rotate:135deg}.pull-to-refresh-tick:nth-child(5){opacity:calc(clamp(0, (var(--reveal) * 8 - 4) * 1000, 1) * .6);rotate:180deg}.pull-to-refresh-tick:nth-child(6){opacity:calc(clamp(0, (var(--reveal) * 8 - 5) * 1000, 1) * .7);rotate:225deg}.pull-to-refresh-tick:nth-child(7){opacity:calc(clamp(0, (var(--reveal) * 8 - 6) * 1000, 1) * .8);rotate:270deg}.pull-to-refresh-tick:nth-child(8){opacity:calc(clamp(0, (var(--reveal) * 8 - 7) * 1000, 1) * .9);rotate:315deg}@media (prefers-reduced-motion:reduce){.pull-to-refresh,.pull-to-refresh-glyph--landing{transition:none}.pull-to-refresh--refreshing .pull-to-refresh-glyph{animation:none}}@keyframes pull-to-refresh-fresh{0%{filter:blur(var(--fresh-blur));opacity:0}}@keyframes pull-to-refresh-spin{to{rotate:360deg}}}
+@layer components{.pull-to-refresh-indicator{position:absolute;inset:0 0 auto}.pull-to-refresh-status{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.pull-to-refresh{--surface-shadow-weight:6;--surface-background-active:light-dark(oklch(from var(--surface-background-default) calc(l + .01) c h),oklch(from var(--surface-background-default) calc(l + .02) c h));--surface-background-default:light-dark(oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) calc(c * clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) / max(l, .01)) h));--surface-background-hover:light-dark(oklch(from var(--surface-background-default) calc(l + .005) c h),oklch(from var(--surface-background-default) calc(l + .01) c h));--surface-background-pressed:light-dark(oklch(from var(--surface-background-default) calc(l - .02) c h),oklch(from var(--surface-background-default) calc(l - .04) c h));--surface-border-active:light-dark(oklch(from var(--surface-background-active) max(0, l - .04) c h),oklch(from var(--surface-background-active) min(1, l + .06) c h));--surface-border-default:light-dark(oklch(from var(--surface-background-default) max(0, l - .04) c h),oklch(from var(--surface-background-default) min(1, l + .06) c h));--surface-border-hover:light-dark(oklch(from var(--surface-background-hover) max(0, l - .04) c h),oklch(from var(--surface-background-hover) min(1, l + .06) c h));--surface-border-pressed:light-dark(oklch(from var(--surface-background-pressed) max(0, l - .04) c h),oklch(from var(--surface-background-pressed) min(1, l + .06) c h));--surface-shadow-active:var(--surface-shadow-hover);--surface-shadow-color:light-dark(oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .08),oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-cast:light-dark(oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .08),oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-default:0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 0, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 5 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 1, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 9 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 25 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -7 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, var(--surface-shadow-weight) - 0, 1) + .05 * clamp(0, var(--surface-shadow-weight) - 2, 1) + .15 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -8 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -10 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -.1 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10));--surface-shadow-hover:0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 5 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 1, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 9 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 25 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -7 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + .15 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -8 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -.1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10));--surface-shadow-pressed:0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 5 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 1, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 9 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 25 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -7 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + .15 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -8 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -.1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10))}@container style(--surface-level:-3){.pull-to-refresh{--surface-level:-2;--surface-shadow-weight:0}}@container style(--surface-level:-2){.pull-to-refresh{--surface-level:-1;--surface-shadow-weight:0}}@container style(--surface-level:-1){.pull-to-refresh{--surface-level:0;--surface-shadow-weight:0}}@container style(--surface-level:0){.pull-to-refresh{--surface-level:1;--surface-shadow-weight:1}}@container style(--surface-level:1){.pull-to-refresh{--surface-level:2;--surface-shadow-weight:2}}@container style(--surface-level:2){.pull-to-refresh{--surface-level:3;--surface-shadow-weight:3}}@container style(--surface-level:3){.pull-to-refresh{--surface-level:4;--surface-shadow-weight:4}}@container style(--surface-level:4){.pull-to-refresh{--surface-level:5;--surface-shadow-weight:5}}@container style(--surface-level:5){.pull-to-refresh{--surface-level:6;--surface-shadow-weight:6}}.pull-to-refresh{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--active.pull-to-refresh{--background:var(--background-active)}.pull-to-refresh:not(.--active):hover{--background:var(--background-hover)}.pull-to-refresh:not(.--active):active{--background:var(--background-pressed)}@property --pull-to-refresh-y{syntax:"<number>";inherits:false;initial-value:0}.pull-to-refresh{--background-default:var(--surface-background-default);--color:var(--color-text-500);--fade-duration:var(--duration-fast);--fade-timing-function:var(--easing-out);--fresh-blur:var(--blur-400);--fresh-duration:var(--duration-moderate);--fresh-timing-function:var(--easing-out);--height:100%;--settle-duration:.617s;--slide-in-duration:.882s;--spin-duration:.8s;--spinner-animation:pull-to-refresh-spin;--spinner-size:24px;--spring:linear(0, .0575, .1803, .3208, .4551, .573, .6711, .7501, .8122, .8601, .8966, .924, .9445, .9596, .9708, .9789, .9848, .9891, .9922, .9944, .996, .9972, .998, .9986, 1)}@media (prefers-reduced-motion:reduce){.pull-to-refresh{--fresh-blur:0px}}.pull-to-refresh{height:var(--height);min-height:0;transition:--pull-to-refresh-y var(--settle-duration) var(--spring);position:relative}.pull-to-refresh--instant{transition:none}.pull-to-refresh--landing{transition-duration:var(--slide-in-duration)}.pull-to-refresh--refreshing .pull-to-refresh-glyph{animation:var(--spinner-animation) var(--spin-duration) steps(8) infinite}.pull-to-refresh-content{--pull-to-refresh-y:inherit;background:var(--background);min-height:100%;translate:0 calc(var(--pull-to-refresh-y) * 1px);-webkit-user-select:none;user-select:none}.pull-to-refresh-glyph{--pull-to-refresh-y:inherit;display:flex}.pull-to-refresh-glyph--landing{opacity:0;transition:opacity var(--fade-duration) var(--fade-timing-function)}.pull-to-refresh-indicator{--pull-to-refresh-y:inherit;color:var(--color);height:calc(var(--threshold) * 1px);opacity:clamp(0, var(--pull-to-refresh-y) / var(--threshold), 1);pointer-events:none;justify-content:center;align-items:center;display:flex}.pull-to-refresh-item--fresh{animation:pull-to-refresh-fresh var(--fresh-duration) var(--fresh-timing-function)}.pull-to-refresh-scroller{--pull-to-refresh-y:inherit;overscroll-behavior:contain;scroll-behavior:smooth;height:100%;position:relative;overflow-y:auto}@media (prefers-reduced-motion:reduce){.pull-to-refresh-scroller{scroll-behavior:auto}}.pull-to-refresh-spinner{--pull-to-refresh-y:inherit;height:var(--spinner-size);rotate:calc(var(--pull-to-refresh-y) * 3deg);width:var(--spinner-size)}.pull-to-refresh-tick{transform-origin:12px 12px}.pull-to-refresh-tick:first-child{opacity:calc(clamp(0, (var(--reveal) * 8 - 0) * 1000, 1) * 1);rotate:0deg}.pull-to-refresh-tick:nth-child(2){opacity:calc(clamp(0, (var(--reveal) * 8 - 1) * 1000, 1) * .3);rotate:45deg}.pull-to-refresh-tick:nth-child(3){opacity:calc(clamp(0, (var(--reveal) * 8 - 2) * 1000, 1) * .4);rotate:90deg}.pull-to-refresh-tick:nth-child(4){opacity:calc(clamp(0, (var(--reveal) * 8 - 3) * 1000, 1) * .5);rotate:135deg}.pull-to-refresh-tick:nth-child(5){opacity:calc(clamp(0, (var(--reveal) * 8 - 4) * 1000, 1) * .6);rotate:180deg}.pull-to-refresh-tick:nth-child(6){opacity:calc(clamp(0, (var(--reveal) * 8 - 5) * 1000, 1) * .7);rotate:225deg}.pull-to-refresh-tick:nth-child(7){opacity:calc(clamp(0, (var(--reveal) * 8 - 6) * 1000, 1) * .8);rotate:270deg}.pull-to-refresh-tick:nth-child(8){opacity:calc(clamp(0, (var(--reveal) * 8 - 7) * 1000, 1) * .9);rotate:315deg}@media (prefers-reduced-motion:reduce){.pull-to-refresh,.pull-to-refresh-glyph--landing{transition:none}.pull-to-refresh--refreshing .pull-to-refresh-glyph{animation:none}}@keyframes pull-to-refresh-fresh{0%{filter:blur(var(--fresh-blur));opacity:0}}@keyframes pull-to-refresh-spin{to{rotate:360deg}}}
 /*$vite$:1*/

package/build/components/range/index.js

@@ -3,7 +3,7 @@ import * as reactivity_u0 from '@esportsplus/reactivity';
 import form from '../form/index.js';
 import filter from './filter.js';
 import './scss/index.scss';
-const template_0aka2e62 = template_u1.template(`<input class='range --border-black ' type='range' />`);
+const template_0aka2e62 = template_u1.template(`<input class='range ' type='range' />`);
 class ReactiveObject_0aka2e60 extends reactivity_u0.ReactiveObject {
     #active = this[reactivity_u0.SIGNAL](false);
     #error = this[reactivity_u0.SIGNAL]('');

package/build/components/range/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.range-filter-strip{position:absolute;inset:0 0 auto}.range{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--active.range{--background:var(--background-active)}.range:not(.--active):hover{--background:var(--background-hover)}.range:not(.--active):active{--background:var(--background-pressed)}.range{--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:transparent;--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default)}.--active.range{--border-color:var(--border-color-active)}.range:not(.--active):hover{--border-color:var(--border-color-hover)}.range:not(.--active):active{--border-color:var(--border-color-pressed)}.range-filter-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.range{--background-default:linear-gradient(to right, var(--thumb-background) var(--thumb-position), var(--color-black-300) var(--thumb-position));--border-width:var(--border-width-700);--height:var(--size-200);--margin-horizontal:0px;--margin-vertical:0px;--thumb-background:var(--color-white-400);--thumb-size:var(--size-400);--width:100%}.range-filter{--clear-background:var(--color-white-300);--clear-border:var(--color-border-300);--clear-display:inline-flex;--clear-hover:var(--color-grey-400);--color:var(--color-text-500);--field-background:var(--color-white-300);--field-border-radius:var(--border-radius-400);--field-cursor:text;--field-height:40px;--focus-color:oklch(from var(--color-text-500) l c h / .3);--ghost-color:oklch(from var(--color-text-500) l c h / .3);--ghost-display:block;--header-align:flex-start;--header-gap:16px;--heading-display:block;--label-color:var(--muted-color);--label-font-size:12px;--label-letter-spacing:.05em;--label-margin:0 0 4px;--label-text-transform:uppercase;--muted-color:var(--color-text-300);--range-border-radius:0px;--range-color:var(--color-text-500);--roll-duration:.5s;--roll-ease:cubic-bezier(.23, 1, .32, 1);--root-cursor:pointer;--thumb-background:var(--color-white-300);--thumb-border:var(--color-text-500);--thumb-border-width:2px;--thumb-cursor:initial;--thumb-cursor-active:initial;--thumb-outline:0 solid var(--focus-color);--thumb-scale-active:1.25;--thumb-scale-hover:1.25;--thumb-shadow:0 4px 6px -1px oklch(from var(--color-black-300) l c h / .1), 0 2px 4px -2px oklch(from var(--color-black-300) l c h / .1);--thumb-shadow-active:var(--thumb-shadow);--thumb-shadow-focus:var(--thumb-shadow);--thumb-size:20px;--thumb-transition:scale .15s ease-out;--tick-color:oklch(from var(--color-text-300) l c h / .6);--track-color:var(--color-grey-500);--track-height:8px;--track-inset:0px;--track-overflow:hidden;--value-font-size:var(--font-size-500);--value-font-weight:var(--font-weight-700,700);--width:384px}.range-filter.--disabled{--field-cursor:not-allowed;--root-cursor:not-allowed;--thumb-scale-active:1;--thumb-scale-hover:1}@media (prefers-reduced-motion:reduce){.range-filter{--thumb-scale-active:1;--thumb-scale-hover:1;--thumb-transition:none}}.range-filter-column{--strip-display:flex;--symbol-display:none}.range-filter-column--symbol{--strip-display:none;--symbol-display:inline}.range-filter-field .range-filter-input{--background-default:transparent;--color-default:currentColor;--font-size:inherit;--padding-horizontal:0px;--padding-vertical:0px}.range-filter{color:var(--color);max-width:100%;width:var(--width);flex-direction:column;gap:20px;margin-inline:auto;display:flex}.range-filter-body{flex-direction:column;gap:8px;display:flex}.range-filter-body--vertical{flex-direction:row;align-self:center}.range-filter-clear{background:var(--clear-background);border:1px solid var(--clear-border);box-shadow:0 1px 2px oklch(from var(--color-black-300) l c h/.05);color:var(--muted-color);cursor:pointer;display:var(--clear-display);font:inherit;font-size:12px;font-weight:var(--font-weight-500);outline:0 solid var(--focus-color);outline-offset:2px;border-radius:6px;flex-shrink:0;align-items:center;gap:4px;height:24px;padding:0 8px;transition:background-color .15s ease-out,color .15s ease-out,opacity .15s ease-out}.range-filter-clear:disabled{cursor:default;opacity:.5}.range-filter-clear:focus-visible{outline-width:2px}.range-filter-clear:not(:disabled):hover{background:var(--clear-hover);color:var(--color)}.range-filter-clear-icon{width:12px;height:12px}.range-filter-column{text-align:center;max-width:1ch;height:1lh;transition:max-width var(--roll-duration) var(--roll-ease), opacity var(--roll-duration) var(--roll-ease);vertical-align:bottom;display:inline-block;position:relative;overflow:hidden}.range-filter-column--digit{width:1ch}.range-filter-column--empty{opacity:0;max-width:0}.range-filter-column--symbol{white-space:pre;max-width:1.5em}.range-filter-columns{display:inline-flex}.range-filter-dash{color:var(--muted-color)}.range-filter-digit{height:1lh}.range-filter-field{background:var(--field-background);border:1px solid var(--clear-border);border-radius:var(--field-border-radius);cursor:var(--field-cursor);height:var(--field-height);outline:0 solid var(--focus-color);outline-offset:2px;flex:1 1 0;align-items:center;gap:6px;min-width:0;padding-inline:12px;display:flex}.range-filter-field:has(:focus-visible){outline-width:2px}.range-filter-field-label{color:var(--muted-color);font-size:12px;font-weight:var(--font-weight-500);letter-spacing:.05em;text-transform:uppercase}.range-filter-field-prefix{color:var(--muted-color);margin-inline-start:auto}.range-filter-field .range-filter-input{font-variant-numeric:tabular-nums;text-align:right;outline:none;flex:0 72px;width:72px;min-height:0;margin-inline-start:auto}.range-filter-field-prefix+.range-filter-input{margin-inline-start:0}.range-filter-fields{align-items:center;gap:12px;display:flex}.range-filter-ghost{background:var(--ghost-color);display:var(--ghost-display);height:var(--track-height);opacity:0;pointer-events:none;z-index:1;border-radius:999px;transition:left 75ms ease-out,opacity .1s ease-out,width 75ms ease-out;position:absolute;top:50%;translate:0 -50%}.range-filter-ghost.--active{opacity:1}.range-filter-ghost--vertical{width:var(--track-height);transition:bottom 75ms ease-out,opacity .1s ease-out,height 75ms ease-out;top:auto;left:50%;translate:-50%}.range-filter-header{align-items:var(--header-align);gap:var(--header-gap);justify-content:space-between;display:flex}.range-filter-heading{display:var(--heading-display)}.range-filter-label{color:var(--label-color);font-size:var(--label-font-size);font-weight:var(--font-weight-500);letter-spacing:var(--label-letter-spacing);margin:var(--label-margin);text-transform:var(--label-text-transform)}.range-filter-number{display:inline-flex}.range-filter-range{background:var(--range-color);border-radius:var(--range-border-radius);position:absolute;inset-block:0}.range-filter-range--vertical{inset-block:auto;inset-inline:0}.range-filter-root{cursor:var(--root-cursor);height:var(--thumb-size);touch-action:none;-webkit-user-select:none;user-select:none;align-items:center;width:100%;display:flex;position:relative}.range-filter-root--vertical{height:var(--vertical-size);width:var(--thumb-size);justify-content:center}.range-filter-separator{background:var(--track-color);flex-shrink:0;width:12px;height:1px}.range-filter-strip{display:var(--strip-display);transition:translate var(--roll-duration) var(--roll-ease);translate:0 calc(var(--digit,0) * -10%);flex-direction:column}.range-filter-symbol{display:var(--symbol-display)}.range-filter-thumb{background:var(--thumb-background);border:var(--thumb-border-width) solid var(--thumb-border);box-shadow:var(--thumb-shadow);cursor:var(--thumb-cursor);height:var(--thumb-size);left:calc(var(--thumb-size) / 2 + var(--position) * (100% - var(--thumb-size)));outline:var(--thumb-outline);outline-offset:2px;transition:var(--thumb-transition);width:var(--thumb-size);z-index:2;border-radius:50%;position:absolute;top:50%;translate:-50% -50%}.range-filter-thumb--stacked,.range-filter-thumb.--active{z-index:3}.range-filter-thumb--vertical{bottom:calc(var(--thumb-size) / 2 + var(--position) * (100% - var(--thumb-size)));top:auto;left:50%;translate:-50% 50%}.range-filter-thumb:focus-visible{box-shadow:var(--thumb-shadow-focus);outline-width:3px}.range-filter-thumb:hover{scale:var(--thumb-scale-hover)}.range-filter-thumb.--active{box-shadow:var(--thumb-shadow-active);cursor:var(--thumb-cursor-active);scale:var(--thumb-scale-active)}.range-filter-ticks{color:var(--tick-color);font-size:11px;font-weight:var(--font-weight-500);-webkit-user-select:none;user-select:none;justify-content:space-between;display:flex}.range-filter-ticks--vertical{flex-direction:column-reverse}.range-filter-track{background:var(--track-color);height:var(--track-height);margin-inline:var(--track-inset);overflow:var(--track-overflow);width:calc(100% - var(--track-inset) * 2);border-radius:999px;position:relative}.range-filter-track--vertical{height:calc(100% - var(--track-inset) * 2);margin-block:var(--track-inset);width:var(--track-height);margin-inline:0}.range-filter-value{font-size:var(--value-font-size);font-variant-numeric:tabular-nums;font-weight:var(--value-font-weight);align-items:center;display:inline-flex}.range-filter-values{align-items:center;gap:6px;display:flex}.range-filter.--disabled{opacity:.5}@media (prefers-reduced-motion:reduce){.range-filter-column,.range-filter-ghost,.range-filter-strip{transition:none}}.range{appearance:none;background:var(--background);height:var(--height);margin-block:calc(var(--margin-vertical) + (var(--thumb-size) - var(--height)) / 2);margin-inline:var(--margin-horizontal);transition:background var(--transition-duration) var(--transition-timing-function), border-color var(--transition-duration) var(--transition-timing-function), box-shadow var(--transition-duration) var(--transition-timing-function), opacity var(--transition-duration) var(--transition-timing-function), transform var(--transition-duration) var(--transition-timing-function);width:var(--width);border:0;border-radius:240px;outline:none}.range::-moz-range-thumb{appearance:none;background:var(--thumb-background);border:var(--border-width) solid var(--border-color);cursor:pointer;height:var(--thumb-size);width:var(--thumb-size);border-radius:100%;outline:none}.range::-webkit-slider-thumb{appearance:none;background:var(--thumb-background);border:var(--border-width) solid var(--border-color);cursor:pointer;height:var(--thumb-size);width:var(--thumb-size);border-radius:100%;outline:none}.range--slider{--focus-color:oklch(from var(--color-text-500) l c h / .24);--range-color:var(--color-text-500);--thumb-background:var(--color-white-300);--thumb-border:var(--color-border-300);--thumb-shadow:0 1px 2px oklch(from var(--color-black-300) l c h / .05), 0 1px oklch(from var(--color-black-300) l c h / .04);--thumb-size:16px;--track-color:var(--color-border-300)}@media (pointer:coarse){.range--slider{--thumb-size:20px}}.range.range--slider{--background-default:linear-gradient(to right, var(--range-color) var(--thumb-position), var(--track-color) var(--thumb-position));--height:4px}.range.range--slider::-webkit-slider-thumb{background:var(--thumb-background);border:1px solid var(--thumb-border);box-shadow:var(--thumb-shadow);cursor:grab;height:var(--thumb-size);width:var(--thumb-size);appearance:none;border-radius:50%;transition:box-shadow .15s ease-out,scale .15s ease-out}.range.range--slider::-moz-range-thumb{background:var(--thumb-background);border:1px solid var(--thumb-border);box-shadow:var(--thumb-shadow);cursor:grab;height:var(--thumb-size);width:var(--thumb-size);appearance:none;border-radius:50%;transition:box-shadow .15s ease-out,scale .15s ease-out}.range.range--slider:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--focus-color)}.range.range--slider:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px var(--focus-color)}.range.range--slider:active:not(:disabled)::-webkit-slider-thumb{box-shadow:none;cursor:grabbing;scale:1.2}.range.range--slider:active:not(:disabled)::-moz-range-thumb{box-shadow:none;cursor:grabbing;scale:1.2}.range.range--slider:disabled{opacity:.64}.range.range--slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.range.range--slider:disabled::-moz-range-thumb{cursor:not-allowed}@media (prefers-reduced-motion:reduce){.range.range--slider:active:not(:disabled)::-webkit-slider-thumb{scale:1}.range.range--slider:active:not(:disabled)::-moz-range-thumb{scale:1}}.range-filter.range--slider{--clear-display:none;--ghost-display:none;--header-align:center;--header-gap:8px;--heading-display:contents;--label-color:currentColor;--label-font-size:1em;--label-letter-spacing:normal;--label-margin:0;--label-text-transform:none;--range-border-radius:999px;--thumb-border-width:1px;--thumb-cursor:grab;--thumb-cursor-active:grabbing;--thumb-outline:none;--thumb-scale-active:1.2;--thumb-scale-hover:1;--thumb-shadow-active:none;--thumb-shadow-focus:0 0 0 3px var(--focus-color);--thumb-transition:box-shadow .15s ease-out, scale .15s ease-out;--track-height:4px;--track-inset:calc(var(--thumb-size) / 2);--track-overflow:visible;--value-font-size:calc(var(--font-size-400) * .875);--value-font-weight:initial;--width:100%;font-size:var(--value-font-size);gap:8px}.range-filter.range--slider.--disabled{--thumb-cursor:not-allowed;--thumb-cursor-active:not-allowed;--thumb-scale-active:1;opacity:.64}@media (prefers-reduced-motion:reduce){.range-filter.range--slider{--thumb-scale-active:1;--thumb-transition:box-shadow .15s ease-out}}.range--vertical{--vertical-size:176px}.range.range--vertical{--background-default:linear-gradient(to top, var(--thumb-background) var(--thumb-position), var(--color-black-300) var(--thumb-position));height:var(--vertical-size);margin-block:var(--margin-vertical);margin-inline:calc(var(--margin-horizontal) + (var(--thumb-size) - var(--height)) / 2);width:var(--height);writing-mode:vertical-lr;direction:rtl}.range.range--vertical.range--slider{--background-default:linear-gradient(to top, var(--range-color) var(--thumb-position), var(--track-color) var(--thumb-position))}.range-filter.range--vertical{--width:max-content}}
+@layer components{.range-filter{--surface-shadow-weight:6;--surface-background-active:light-dark(oklch(from var(--surface-background-default) calc(l + .01) c h),oklch(from var(--surface-background-default) calc(l + .02) c h));--surface-background-default:light-dark(oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) calc(c * clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) / max(l, .01)) h));--surface-background-hover:light-dark(oklch(from var(--surface-background-default) calc(l + .005) c h),oklch(from var(--surface-background-default) calc(l + .01) c h));--surface-background-pressed:light-dark(oklch(from var(--surface-background-default) calc(l - .02) c h),oklch(from var(--surface-background-default) calc(l - .04) c h));--surface-border-active:light-dark(oklch(from var(--surface-background-active) max(0, l - .04) c h),oklch(from var(--surface-background-active) min(1, l + .06) c h));--surface-border-default:light-dark(oklch(from var(--surface-background-default) max(0, l - .04) c h),oklch(from var(--surface-background-default) min(1, l + .06) c h));--surface-border-hover:light-dark(oklch(from var(--surface-background-hover) max(0, l - .04) c h),oklch(from var(--surface-background-hover) min(1, l + .06) c h));--surface-border-pressed:light-dark(oklch(from var(--surface-background-pressed) max(0, l - .04) c h),oklch(from var(--surface-background-pressed) min(1, l + .06) c h));--surface-shadow-active:var(--surface-shadow-hover);--surface-shadow-color:light-dark(oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .08),oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-cast:light-dark(oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .08),oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-default:0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 0, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 5 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 1, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 9 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 25 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -7 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, var(--surface-shadow-weight) - 0, 1) + .05 * clamp(0, var(--surface-shadow-weight) - 2, 1) + .15 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -8 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -10 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -.1 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10));--surface-shadow-hover:0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 5 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 1, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 9 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 25 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -7 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + .15 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -8 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -.1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10));--surface-shadow-pressed:0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 5 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 1, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 9 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 25 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -7 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + .15 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -8 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -.1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10))}@container style(--surface-level:-3){.range-filter{--surface-level:-2;--surface-shadow-weight:0}}@container style(--surface-level:-2){.range-filter{--surface-level:-1;--surface-shadow-weight:0}}@container style(--surface-level:-1){.range-filter{--surface-level:0;--surface-shadow-weight:0}}@container style(--surface-level:0){.range-filter{--surface-level:1;--surface-shadow-weight:1}}@container style(--surface-level:1){.range-filter{--surface-level:2;--surface-shadow-weight:2}}@container style(--surface-level:2){.range-filter{--surface-level:3;--surface-shadow-weight:3}}@container style(--surface-level:3){.range-filter{--surface-level:4;--surface-shadow-weight:4}}@container style(--surface-level:4){.range-filter{--surface-level:5;--surface-shadow-weight:5}}@container style(--surface-level:5){.range-filter{--surface-level:6;--surface-shadow-weight:6}}.range,.range-filter-clear{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--active.range,.--active.range-filter-clear{--background:var(--background-active)}.range:not(.--active):hover,.range-filter-clear:not(.--active):hover{--background:var(--background-hover)}.range:not(.--active):active,.range-filter-clear:not(.--active):active{--background:var(--background-pressed)}.range{--border-color-active:var(--border-color-default);--border-color-default:transparent;--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default);--border-color:var(--border-color-default)}.--active.range{--border-color:var(--border-color-active)}.range:not(.--active):hover{--border-color:var(--border-color-hover)}.range:not(.--active):active{--border-color:var(--border-color-pressed)}.range-filter-strip{position:absolute;inset:0 0 auto}.range-filter-thumb{--box-shadow:var(--box-shadow-default);--box-shadow-active:var(--box-shadow-default);--box-shadow-default:none;--box-shadow-hover:var(--box-shadow-default);--box-shadow-pressed:var(--box-shadow-default)}.--active.range-filter-thumb{--box-shadow:var(--box-shadow-active)}.range-filter-thumb:not(.--active):hover{--box-shadow:var(--box-shadow-hover)}.range-filter-thumb:not(.--active):active{--box-shadow:var(--box-shadow-pressed)}.range-filter-clear{--color:var(--color-default);--color-active:var(--color-default);--color-default:var(--color-text-400);--color-hover:var(--color-default);--color-pressed:var(--color-default)}.--active.range-filter-clear{--color:var(--color-active)}.range-filter-clear:not(.--active):hover{--color:var(--color-hover)}.range-filter-clear:not(.--active):active{--color:var(--color-pressed)}.range-filter-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.range{--background-default:linear-gradient(to right, var(--thumb-background) var(--thumb-position), var(--color-primary-300) var(--thumb-position));--border-width:var(--border-width-700);--height:var(--size-200);--margin-horizontal:0px;--margin-vertical:0px;--thumb-background:var(--surface-background-default);--thumb-size:var(--size-400);--width:100%}.range-filter{--clear-background:var(--surface-background-default);--clear-border:var(--surface-border-default);--clear-color-hover:var(--color);--clear-display:inline-flex;--clear-hover:var(--surface-background-hover);--color:var(--color-text-500);--field-background:var(--surface-background-default);--field-border-radius:var(--border-radius-400);--field-cursor:text;--field-height:40px;--focus-color:var(--surface-border-pressed);--ghost-color:oklch(from var(--color-primary-500) l c h / .3);--ghost-display:block;--header-align:flex-start;--header-gap:var(--size-400);--heading-display:block;--label-color:var(--muted-color);--label-font-size:var(--font-size-300);--label-margin:0 0 calc(var(--size-100) / 2);--label-text-transform:uppercase;--muted-color:var(--color-text-300);--range-border-radius:0px;--range-color:var(--color-primary-500);--roll-duration:.5s;--roll-ease:var(--easing-out);--root-cursor:pointer;--thumb-background:var(--surface-background-default);--thumb-border:var(--color-primary-500);--thumb-border-width:var(--border-width-500);--thumb-cursor:initial;--thumb-cursor-active:initial;--thumb-outline:0 solid var(--focus-color);--thumb-scale-active:1.25;--thumb-scale-hover:1.25;--thumb-shadow:var(--surface-shadow-default);--thumb-shadow-active:var(--thumb-shadow);--thumb-shadow-focus:var(--thumb-shadow);--thumb-size:var(--size-500);--thumb-transition:scale var(--duration-fast) var(--easing-spring);--tick-color:oklch(from var(--color-primary-300) l c h / .6);--track-color:var(--surface-border-default);--track-height:var(--size-100);--track-inset:0px;--track-overflow:hidden;--value-font-size:var(--font-size-500);--value-font-weight:var(--font-weight-700,700);--width:384px}.range-filter.--disabled{--field-cursor:not-allowed;--root-cursor:not-allowed;--thumb-scale-active:1;--thumb-scale-hover:1}@media (prefers-reduced-motion:reduce){.range-filter{--thumb-scale-active:1;--thumb-scale-hover:1;--thumb-transition:none}}.range-filter-column{--strip-display:flex;--symbol-display:none}.range-filter-column--symbol{--strip-display:none;--symbol-display:inline}.range-filter-field .range-filter-input{--background-default:transparent;--color-default:currentColor;--font-size:inherit;--padding-horizontal:0px;--padding-vertical:0px}.range-filter{color:var(--color);gap:var(--size-500);max-width:100%;width:var(--width);flex-direction:column;margin-inline:auto;display:flex}.range-filter-body{gap:var(--size-100);flex-direction:column;display:flex}.range-filter-body--vertical{flex-direction:row;align-self:center}.range-filter-clear{--background-default:var(--clear-background);--background-hover:var(--clear-hover);--background-pressed:var(--background-hover);--color-default:var(--muted-color);--color-hover:var(--clear-color-hover);--color-pressed:var(--color-hover);background:var(--background);border:1px solid var(--clear-border);border-radius:var(--border-radius-300);box-shadow:var(--surface-shadow-default);color:var(--color);cursor:pointer;display:var(--clear-display);font:inherit;font-size:var(--font-size-300);font-weight:var(--font-weight-500);align-items:center;gap:calc(var(--size-100) / 2);outline:0 solid var(--focus-color);outline-offset:calc(var(--size-100) / 4);height:24px;padding:0 var(--size-100);transition:background-color var(--duration-fast) var(--easing-spring), color var(--duration-fast) var(--easing-spring), opacity var(--duration-fast) var(--easing-spring);flex-shrink:0}.range-filter-clear-icon{width:12px;height:12px}.range-filter-clear:disabled{--background-hover:var(--background-default);--background-pressed:var(--background-default);--color-hover:var(--color-default);--color-pressed:var(--color-default);cursor:default;opacity:.5}.range-filter-clear:focus-visible{outline-width:var(--border-width-500)}.range-filter-column{text-align:center;max-width:1ch;height:1lh;transition:max-width var(--roll-duration) var(--roll-ease), opacity var(--roll-duration) var(--roll-ease);vertical-align:bottom;display:inline-block;position:relative;overflow:hidden}.range-filter-column--digit{width:1ch}.range-filter-column--empty{opacity:0;max-width:0}.range-filter-column--symbol{white-space:pre;max-width:1.5em}.range-filter-columns{display:inline-flex}.range-filter-dash{color:var(--muted-color)}.range-filter-digit{height:1lh}.range-filter-field{background:var(--field-background);border:1px solid var(--clear-border);border-radius:var(--field-border-radius);cursor:var(--field-cursor);align-items:center;gap:calc(var(--size-300) / 2);height:var(--field-height);outline:0 solid var(--focus-color);outline-offset:calc(var(--size-100) / 4);flex:1 1 0;min-width:0;padding-inline:12px;display:flex}.range-filter-field-label{color:var(--muted-color);font-size:var(--font-size-300);font-weight:var(--font-weight-500);text-transform:uppercase}.range-filter-field-prefix{color:var(--muted-color);margin-inline-start:auto}.range-filter-field-prefix+.range-filter-input{margin-inline-start:0}.range-filter-field:has(:focus-visible){outline-width:var(--border-width-500)}.range-filter-field .range-filter-input{font-variant-numeric:tabular-nums;text-align:right;outline:none;flex:0 72px;width:72px;min-height:0;margin-inline-start:auto}.range-filter-fields{align-items:center;gap:12px;display:flex}.range-filter-ghost{background:var(--ghost-color);display:var(--ghost-display);height:var(--track-height);opacity:0;pointer-events:none;transition:left 75ms var(--easing-out), opacity .1s var(--easing-out), width 75ms var(--easing-out);z-index:1;border-radius:999px;position:absolute;top:50%;translate:0 -50%}.range-filter-ghost.--active{opacity:1}.range-filter-ghost--vertical{transition:bottom 75ms var(--easing-out), opacity .1s var(--easing-out), height 75ms var(--easing-out);width:var(--track-height);top:auto;left:50%;translate:-50%}.range-filter-header{align-items:var(--header-align);gap:var(--header-gap);justify-content:space-between;display:flex}.range-filter-heading{display:var(--heading-display)}.range-filter-label{color:var(--label-color);font-size:var(--label-font-size);font-weight:var(--font-weight-500);margin:var(--label-margin);text-transform:var(--label-text-transform)}.range-filter-number{display:inline-flex}.range-filter-range{background:var(--range-color);border-radius:var(--range-border-radius);position:absolute;inset-block:0}.range-filter-range--vertical{inset-block:auto;inset-inline:0}.range-filter-root{cursor:var(--root-cursor);height:var(--thumb-size);touch-action:none;-webkit-user-select:none;user-select:none;align-items:center;width:100%;display:flex;position:relative}.range-filter-root--vertical{height:var(--vertical-size);width:var(--thumb-size);justify-content:center}.range-filter-separator{background:var(--track-color);flex-shrink:0;width:12px;height:1px}.range-filter-strip{display:var(--strip-display);transition:translate var(--roll-duration) var(--roll-ease);translate:0 calc(var(--digit,0) * -10%);flex-direction:column}.range-filter-symbol{display:var(--symbol-display)}.range-filter-thumb{--box-shadow-active:var(--thumb-shadow-active);--box-shadow-default:var(--thumb-shadow);background:var(--thumb-background);border:var(--thumb-border-width) solid var(--thumb-border);box-shadow:var(--box-shadow);cursor:var(--thumb-cursor);height:var(--thumb-size);left:calc(var(--thumb-size) / 2 + var(--position) * (100% - var(--thumb-size)));outline:var(--thumb-outline);outline-offset:calc(var(--size-100) / 4);transition:var(--thumb-transition);width:var(--thumb-size);z-index:2;border-radius:50%;position:absolute;top:50%;translate:-50% -50%}.range-filter-thumb--stacked,.range-filter-thumb.--active{z-index:3}.range-filter-thumb--vertical{bottom:calc(var(--thumb-size) / 2 + var(--position) * (100% - var(--thumb-size)));top:auto;left:50%;translate:-50% 50%}.range-filter-thumb:focus-visible{--box-shadow-default:var(--thumb-shadow-focus);outline-width:var(--border-width-600)}.range-filter-thumb:hover{scale:var(--thumb-scale-hover)}.range-filter-thumb.--active{cursor:var(--thumb-cursor-active);scale:var(--thumb-scale-active)}.range-filter-ticks{color:var(--tick-color);font-size:var(--font-size-200);font-weight:var(--font-weight-500);-webkit-user-select:none;user-select:none;justify-content:space-between;display:flex}.range-filter-ticks--vertical{flex-direction:column-reverse}.range-filter-track{background:var(--track-color);height:var(--track-height);margin-inline:var(--track-inset);overflow:var(--track-overflow);width:calc(100% - var(--track-inset) * 2);border-radius:999px;position:relative}.range-filter-track--vertical{height:calc(100% - var(--track-inset) * 2);margin-block:var(--track-inset);width:var(--track-height);margin-inline:0}.range-filter-value{font-size:var(--value-font-size);font-variant-numeric:tabular-nums;font-weight:var(--value-font-weight);align-items:center;display:inline-flex}.range-filter-values{align-items:center;gap:calc(var(--size-300) / 2);display:flex}.range-filter.--disabled{opacity:.5}@media (prefers-reduced-motion:reduce){.range-filter-column,.range-filter-ghost,.range-filter-strip{transition:none}}.range{appearance:none;background:var(--background);height:var(--height);margin-block:calc(var(--margin-vertical) + (var(--thumb-size) - var(--height)) / 2);margin-inline:var(--margin-horizontal);transition:background var(--transition-duration) var(--transition-timing-function), border-color var(--transition-duration) var(--transition-timing-function), box-shadow var(--transition-duration) var(--transition-timing-function), opacity var(--transition-duration) var(--transition-timing-function), transform var(--transition-duration) var(--transition-timing-function);width:var(--width);border:0;border-radius:240px;outline:none}.range::-moz-range-thumb{appearance:none;background:var(--thumb-background);border:var(--border-width) solid var(--border-color);cursor:pointer;height:var(--thumb-size);width:var(--thumb-size);border-radius:100%;outline:none}.range::-webkit-slider-thumb{appearance:none;background:var(--thumb-background);border:var(--border-width) solid var(--border-color);cursor:pointer;height:var(--thumb-size);width:var(--thumb-size);border-radius:100%;outline:none}.range--slider{--focus-color:var(--surface-border-pressed);--range-color:var(--color-primary-500);--thumb-background:var(--color-white-300);--thumb-border:var(--surface-border-default);--thumb-shadow:var(--surface-shadow-default);--thumb-size:var(--size-400);--track-color:light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h))}@media (pointer:coarse){.range--slider{--thumb-size:var(--size-500)}}.range-filter.range--slider{--clear-display:none;--ghost-display:none;--header-align:center;--header-gap:var(--size-100);--heading-display:contents;--label-color:currentColor;--label-font-size:1em;--label-margin:0;--label-text-transform:none;--range-border-radius:999px;--thumb-border-width:var(--border-width-400);--thumb-cursor:grab;--thumb-cursor-active:grabbing;--thumb-outline:none;--thumb-scale-active:1.2;--thumb-scale-hover:1;--thumb-shadow-active:none;--thumb-shadow-focus:0 0 0 3px var(--focus-color);--thumb-transition:box-shadow var(--duration-fast) var(--easing-spring), scale var(--duration-fast) var(--easing-spring);--track-height:4px;--track-inset:calc(var(--thumb-size) / 2);--track-overflow:visible;--value-font-size:calc(var(--font-size-400) * .875);--value-font-weight:initial;--width:100%;font-size:var(--value-font-size);gap:var(--size-100)}.range-filter.range--slider.--disabled{--thumb-cursor:not-allowed;--thumb-cursor-active:not-allowed;--thumb-scale-active:1;opacity:.64}@media (prefers-reduced-motion:reduce){.range-filter.range--slider{--thumb-scale-active:1;--thumb-transition:box-shadow var(--duration-fast) var(--easing-spring)}}.range.range--slider{--background-default:linear-gradient(to right, var(--range-color) var(--thumb-position), var(--track-color) var(--thumb-position));--height:4px}.range.range--slider::-moz-range-thumb{background:var(--thumb-background);border:1px solid var(--thumb-border);box-shadow:var(--thumb-shadow);cursor:grab;height:var(--thumb-size);transition:box-shadow var(--duration-fast) var(--easing-spring), scale var(--duration-fast) var(--easing-spring);width:var(--thumb-size);appearance:none;border-radius:50%}.range.range--slider::-webkit-slider-thumb{background:var(--thumb-background);border:1px solid var(--thumb-border);box-shadow:var(--thumb-shadow);cursor:grab;height:var(--thumb-size);transition:box-shadow var(--duration-fast) var(--easing-spring), scale var(--duration-fast) var(--easing-spring);width:var(--thumb-size);appearance:none;border-radius:50%}.range.range--slider:active:not(:disabled)::-moz-range-thumb{box-shadow:none;cursor:grabbing;scale:1.2}.range.range--slider:active:not(:disabled)::-webkit-slider-thumb{box-shadow:none;cursor:grabbing;scale:1.2}.range.range--slider:disabled{opacity:.64}.range.range--slider:disabled::-moz-range-thumb{cursor:not-allowed}.range.range--slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.range.range--slider:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px var(--focus-color)}.range.range--slider:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--focus-color)}@media (prefers-reduced-motion:reduce){.range.range--slider:active:not(:disabled)::-moz-range-thumb{scale:1}.range.range--slider:active:not(:disabled)::-webkit-slider-thumb{scale:1}}.range--vertical{--vertical-size:176px}.range-filter.range--vertical{--width:max-content}.range.range--vertical{--background-default:linear-gradient(to top, var(--thumb-background) var(--thumb-position), var(--color-primary-300) var(--thumb-position));height:var(--vertical-size);margin-block:var(--margin-vertical);margin-inline:calc(var(--margin-horizontal) + (var(--thumb-size) - var(--height)) / 2);width:var(--height);writing-mode:vertical-lr;direction:rtl}.range.range--vertical.range--slider{--background-default:linear-gradient(to top, var(--range-color) var(--thumb-position), var(--track-color) var(--thumb-position))}}
 /*$vite$:1*/

package/build/components/relative-time/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.relative-time-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.relative-time{--color-hover:var(--color-text-500);--focus-color:var(--color-text-500);--placeholder:"0 min ago";--roll-blur:3px;--roll-duration:.3s;--roll-enter-offset:.55em;--roll-exit-offset:-.4em;--roll-timing-function:cubic-bezier(.32, .72, 0, 1)}@media (prefers-reduced-motion:reduce){.relative-time{--roll-blur:0px;--roll-enter-offset:0;--roll-exit-offset:0}}.relative-time-tooltip.tooltip-message{--border-radius:var(--border-radius-300);--box-shadow:var(--box-shadow-200);--font-size:var(--font-size-300);--font-weight:var(--font-weight-500);--offset:3px;--padding-horizontal:var(--size-100);--padding-vertical:calc(var(--size-100) / 2);--scale:.9;--spacer:6px;--transition-duration:.1s;--transition-timing-function:cubic-bezier(.23, 1, .32, 1)}.relative-time.--active>.relative-time-tooltip.tooltip-message{--transition-duration:.16s}@media (prefers-reduced-motion:reduce){.relative-time-tooltip.tooltip-message{--offset:0px;--scale:1}}.relative-time{border-radius:var(--border-radius-100);font-variant-numeric:tabular-nums;white-space:nowrap;outline:none;transition:color .15s ease-out;display:inline-flex}.relative-time.tooltip{cursor:default}.relative-time:focus-visible,.relative-time:hover{color:var(--color-hover)}.relative-time:focus-visible{outline:2px solid var(--focus-color);outline-offset:2px}.relative-time-digit,.relative-time-rest{white-space:pre;display:inline-block}.relative-time-digits,.relative-time-rests,.relative-time-roll,.relative-time-slot{display:inline-flex;position:relative}.relative-time-digit--entering,.relative-time-rest--entering,.relative-time-slot--entering{animation:relative-time-enter var(--roll-duration) var(--roll-timing-function)}.relative-time-digit--exiting,.relative-time-rest--exiting,.relative-time-slot--exiting{animation:relative-time-exit var(--roll-duration) var(--roll-timing-function) forwards;position:absolute}.relative-time-digits:empty{display:none}.relative-time-roll--placeholder:before{content:var(--placeholder);visibility:hidden}.relative-time-tooltip.tooltip-message{filter:blur(2px);transform-origin:bottom;transition:filter var(--transition-duration) var(--transition-timing-function), opacity var(--transition-duration) var(--transition-timing-function), scale var(--transition-duration) var(--transition-timing-function), translate var(--transition-duration) var(--transition-timing-function)}.relative-time.--active>.relative-time-tooltip.tooltip-message{filter:blur()}.relative-time.tooltip--instant>.relative-time-tooltip.tooltip-message{transition:none}@media (prefers-reduced-motion:reduce){.relative-time-tooltip.tooltip-message{filter:none}}@keyframes relative-time-enter{0%{filter:blur(var(--roll-blur));opacity:0;translate:0 var(--roll-enter-offset)}}@keyframes relative-time-exit{to{filter:blur(var(--roll-blur));opacity:0;translate:0 var(--roll-exit-offset)}}}
+@layer components{.relative-time-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.relative-time{--color:var(--color-default);--color-active:var(--color-default);--color-default:var(--color-text-400);--color-hover:var(--color-default);--color-pressed:var(--color-default)}.--active.relative-time{--color:var(--color-active)}.relative-time:not(.--active):hover{--color:var(--color-hover)}.relative-time:not(.--active):active{--color:var(--color-pressed)}.relative-time{--color-active:var(--color-hover);--color-default:currentColor;--color-hover:var(--color-text-500);--focus-color:var(--color-primary-500);--placeholder:"0 min ago";--roll-blur:var(--blur-400);--roll-duration:var(--duration-moderate);--roll-enter-offset:.55em;--roll-exit-offset:-.4em;--roll-timing-function:cubic-bezier(.32, .72, 0, 1)}@media (prefers-reduced-motion:reduce){.relative-time{--roll-blur:0px;--roll-enter-offset:0;--roll-exit-offset:0}}.relative-time-tooltip.tooltip-message{--border-radius:var(--border-radius-300);--box-shadow-default:var(--surface-shadow-default);--font-size:var(--font-size-300);--font-weight:var(--font-weight-500);--offset:calc(var(--size-300) / 4);--padding-horizontal:var(--size-100);--padding-vertical:calc(var(--size-100) / 2);--scale:.9;--spacer:6px}@media (prefers-reduced-motion:reduce){.relative-time-tooltip.tooltip-message{--offset:0px;--scale:1}}.relative-time{border-radius:var(--border-radius-100);color:var(--color);font-variant-numeric:tabular-nums;transition:color var(--duration-fast) var(--easing-spring);white-space:nowrap;outline:none;display:inline-flex}.relative-time-digit,.relative-time-rest{white-space:pre;display:inline-block}.relative-time-digit--entering,.relative-time-rest--entering,.relative-time-slot--entering{animation:relative-time-enter var(--roll-duration) var(--roll-timing-function)}.relative-time-digit--exiting,.relative-time-rest--exiting,.relative-time-slot--exiting{animation:relative-time-exit var(--roll-duration) var(--roll-timing-function) forwards;position:absolute}.relative-time-digits,.relative-time-rests,.relative-time-roll,.relative-time-slot{display:inline-flex;position:relative}.relative-time-digits:empty{display:none}.relative-time-roll--placeholder:before{content:var(--placeholder);visibility:hidden}.relative-time-tooltip.tooltip-message{filter:blur(var(--blur-300));transform-origin:bottom;transition:filter var(--transition-duration) var(--transition-timing-function), opacity var(--transition-duration) var(--transition-timing-function), scale var(--transition-duration) var(--transition-timing-function), translate var(--transition-duration) var(--transition-timing-function)}.relative-time.--active>.relative-time-tooltip.tooltip-message{filter:blur()}.relative-time.tooltip--instant>.relative-time-tooltip.tooltip-message{transition:none}.relative-time.tooltip{cursor:default}.relative-time:focus-visible{--color:var(--color-hover);outline:2px solid var(--focus-color);outline-offset:calc(var(--size-100) / 4)}@media (prefers-reduced-motion:reduce){.relative-time-tooltip.tooltip-message{filter:none}}@keyframes relative-time-enter{0%{filter:blur(var(--roll-blur));opacity:0;translate:0 var(--roll-enter-offset)}}@keyframes relative-time-exit{to{filter:blur(var(--roll-blur));opacity:0;translate:0 var(--roll-exit-offset)}}}
 /*$vite$:1*/

package/build/components/root/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{:root{--border-radius-100:2px;--border-radius-200:4px;--border-radius-300:6px;--border-radius-400:8px;--border-radius-500:10px;--border-radius-600:12px;--border-radius-700:16px;--border-width-400:1px;--border-width-500:2px;--border-width-600:3px;--border-width-700:4px;--box-shadow-100:0 1px 2px 0 oklch(from var(--color-black-300) l c h/.04);--box-shadow-200:0 1px 2px 0 oklch(from var(--color-black-300) l c h/.04), 0 2px 6px -2px oklch(from var(--color-black-300) l c h/.05);--box-shadow-300:0 2px 3px -2px oklch(from var(--color-black-300) l c h/.06), 0 4px 12px -4px oklch(from var(--color-black-300) l c h/.06);--box-shadow-400:0 4px 8px -4px oklch(from var(--color-black-300) l c h/.07), 0 8px 24px -8px oklch(from var(--color-black-300) l c h/.07);--box-shadow-500:0 8px 16px -8px oklch(from var(--color-black-300) l c h/.08), 0 12px 32px -12px oklch(from var(--color-black-300) l c h/.08);--box-shadow-600:0 12px 24px -12px oklch(from var(--color-black-300) l c h/.09), 0 24px 48px -16px oklch(from var(--color-black-300) l c h/.09);--color-black-300:oklch(18.84% .0306 277.2);--color-black-400:oklch(11.47% .0361 268.9);--color-black-500:oklch(10.04% .0287 263.4);--color-blue-300:oklch(54.49% .2514 268.2);--color-blue-400:oklch(51.45% .2712 266.6);--color-blue-500:oklch(48.45% .2617 266.3);--color-border-300:oklch(92.9% .013 255.508);--color-border-400:oklch(86.9% .022 252.894);--color-border-500:oklch(70.4% .04 256.788);--color-green-300:oklch(87.03% .2708 144.9);--color-green-400:oklch(83.7% .2711 144);--color-green-500:oklch(78.97% .256 144);--color-grey-300:oklch(98.42% .0034 247.86);--color-grey-400:oklch(96.83% .0069 247.9);--color-grey-500:oklch(92.88% .0126 255.51);--color-purple-300:oklch(53.29% .2877 292.5);--color-purple-400:oklch(51.66% .2929 289.7);--color-purple-500:oklch(48.63% .2754 289.9);--color-red-300:oklch(64.46% .2412 23.8);--color-red-400:oklch(62.87% .2567 27.7);--color-red-500:oklch(59.1% .2413 27.6);--color-text-300:oklch(55.1% .027 264.364);--color-text-400:oklch(37.3% .034 259.733);--color-text-500:oklch(21% .034 264.665);--color-white-300:oklch(100% 0 0);--color-white-400:oklch(99.2% 0 0);--color-white-500:oklch(98.5% 0 0);--color-yellow-300:oklch(90.5% .182 98.1);--color-yellow-400:oklch(85.2% .199 91.9);--color-yellow-500:oklch(79.5% .184 86);--font-family-mono:Geist Mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--font-size-100:.486rem;--font-size-200:.618rem;--font-size-300:.786rem;--font-size-400:1rem;--font-size-500:1.272rem;--font-size-600:1.618rem;--font-size-700:2.058rem;--font-size-800:2.618rem;--font-size-900:3.33rem;--size-100:8px;--size-200:10px;--size-300:13px;--size-400:16px;--size-500:20px;--size-600:26px;--size-700:33px;--size-800:42px;--size-900:53px;--size-0px:0px;--spacer-100:58.31px;--spacer-200:74.17px;--spacer-300:94.34px;--spacer-400:120px;--spacer-500:152.64px;--spacer-600:194.16px;--spacer-700:246.97px;--background:var(--color-white-400);--color:var(--color-text-400);--font-size:var(--font-size-400);--font-weight:var(--font-weight-400);--min-width:320px;--transition-duration:.16s;--transition-timing-function:cubic-bezier(.4, 0, .2, 1)}*{--border-radius:calc(1em / 1.618);--gap:calc(1em / 1.618);--gap-horizontal:var(--gap);--gap-vertical:var(--gap);--letter-spacing:clamp(-.022em, calc(.060542rem - .051418em), 0em);--line-height:clamp(1.128em, calc(.95em + .668rem), 1.618em);--padding-horizontal:1em;--padding-vertical:calc(1em * 1.272 / (1.618 * 1.618))}b,strong,h1,h2,h3,h4{--color:var(--color-text-400);--font-weight:var(--font-weight-500)}h1{--font-size:var(--font-size-800)}h2{--font-size:var(--font-size-700)}h3{--font-size:var(--font-size-600)}h4{--font-size:var(--font-size-500)}h5{--font-size:var(--font-size-400)}section{--width:100%}:where(:root){--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}body,html{width:100%;height:100%;overflow-x:hidden}h1,h2,h3,h4,h5,h6{color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight-500);overflow-wrap:break-word;text-wrap:balance;width:100%;margin:0;padding:0;position:relative}h1 sub,h1 sup,h2 sub,h2 sup,h3 sub,h3 sup,h4 sub,h4 sup,h5 sub,h5 sup,h6 sub,h6 sup{font-size:.64em}b,strong{color:var(--color,inherit);font-weight:var(--font-weight)}sub,sup{font-size:.8em}body{background-color:var(--background);color:var(--color);font-family:var(--font-family);font-size:var(--font-size);font-weight:var(--font-weight);min-width:var(--min-width);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{letter-spacing:var(--letter-spacing);line-height:var(--line-height)}*,:after,:before{box-sizing:border-box}a{color:var(--color,inherit);cursor:pointer;outline:none;text-decoration:none}p{overflow-wrap:break-word;width:100%;margin:0;padding:0}pre{overflow-wrap:break-word;white-space:break-spaces;width:100%;margin:0;padding:0}section{width:var(--width);flex-wrap:wrap;place-content:flex-start;display:flex;position:relative}sub{bottom:-.48em}sup{top:-.48em}}
+@layer components{*{--border-radius:calc(1em / 1.618);--gap:calc(1em / 1.618);--gap-horizontal:var(--gap);--gap-vertical:var(--gap);--letter-spacing:clamp(-.022em, calc(.060542rem - .051418em), 0em);--line-height:clamp(1.128em, calc(.95em + .668rem), 1.618em);--padding-horizontal:1em;--padding-vertical:calc(1em * 1.272 / (1.618 * 1.618))}:root{--blur-300:2px;--blur-400:4px;--blur-500:8px;--border-radius-100:2px;--border-radius-200:4px;--border-radius-300:6px;--border-radius-400:8px;--border-radius-500:10px;--border-radius-600:12px;--border-radius-700:16px;--border-width-400:1px;--border-width-500:2px;--border-width-600:3px;--border-width-700:4px;--color-black:oklch(16% .0102 257);--color-blue:oklch(51.45% .2712 266.6);--color-green:oklch(83.7% .2711 144);--color-grey:oklch(92% .0093 257);--color-purple:oklch(51.66% .2929 289.7);--color-red:oklch(62.87% .2567 27.7);--color-white:oklch(98% .0032 257);--color-yellow:oklch(85.2% .199 91.9);--duration-fast:.13s;--duration-fast-exit:.1s;--duration-moderate:.26s;--duration-moderate-exit:.19s;--duration-slow:.35s;--duration-slow-exit:.26s;--easing-in-out:cubic-bezier(.42, 0, .58, 1);--easing-out:cubic-bezier(.23, 1, .32, 1);--easing-spring:linear(0, .0491, .1571, .2846, .4106, .5248, .6231, .7049, .7714, .8243, .866, .8984, .9234, .9425, .957, .9679, .9762, .9824, .987, .9904, .9929, .9948, .9962, .9972, 1);--easing-spring-bounce:linear(0, .0429, .1422, .2659, .3936, .5136, .6199, .71, .7838, .8427, .8885, .9232, .9489, .9675, .9806, .9896, .9955, .9992, 1.0013, 1.0025, 1.0029, 1.0029, 1.0027, 1.0024, 1);--font-size-100:.486rem;--font-size-200:.618rem;--font-size-300:.786rem;--font-size-400:1rem;--font-size-500:1.272rem;--font-size-600:1.618rem;--font-size-700:2.058rem;--font-size-800:2.618rem;--font-size-900:3.33rem;--size-100:8px;--size-200:10px;--size-300:13px;--size-400:16px;--size-500:20px;--size-600:26px;--size-700:33px;--size-800:42px;--size-900:53px;--spacer-100:58.31px;--spacer-200:74.17px;--spacer-300:94.34px;--spacer-400:120px;--spacer-500:152.64px;--spacer-600:194.16px;--spacer-700:246.97px;--color-black-300:light-dark(oklch(from var(--color-black) min(1, l + .03) c h),oklch(from var(--color-black) min(1, l + .03) c h));--color-black-400:var(--color-black);--color-black-500:light-dark(oklch(from var(--color-black) max(0, l - .03) c h),oklch(from var(--color-black) max(0, l - .03) c h));--color-blue-300:light-dark(oklch(from var(--color-blue) min(1, l + .03) c h),oklch(from var(--color-blue) min(1, l + .03) c h));--color-blue-400:var(--color-blue);--color-blue-500:light-dark(oklch(from var(--color-blue) max(0, l - .03) c h),oklch(from var(--color-blue) max(0, l - .03) c h));--color-green-300:light-dark(oklch(from var(--color-green) min(1, l + .03) c h),oklch(from var(--color-green) min(1, l + .03) c h));--color-green-400:var(--color-green);--color-green-500:light-dark(oklch(from var(--color-green) max(0, l - .03) c h),oklch(from var(--color-green) max(0, l - .03) c h));--color-grey-300:light-dark(oklch(from var(--color-grey) min(1, l + .03) c h),oklch(from var(--color-grey) min(1, l + .03) c h));--color-grey-400:var(--color-grey);--color-grey-500:light-dark(oklch(from var(--color-grey) max(0, l - .03) c h),oklch(from var(--color-grey) max(0, l - .03) c h));--color-purple-300:light-dark(oklch(from var(--color-purple) min(1, l + .03) c h),oklch(from var(--color-purple) min(1, l + .03) c h));--color-purple-400:var(--color-purple);--color-purple-500:light-dark(oklch(from var(--color-purple) max(0, l - .03) c h),oklch(from var(--color-purple) max(0, l - .03) c h));--color-red-300:light-dark(oklch(from var(--color-red) min(1, l + .03) c h),oklch(from var(--color-red) min(1, l + .03) c h));--color-red-400:var(--color-red);--color-red-500:light-dark(oklch(from var(--color-red) max(0, l - .03) c h),oklch(from var(--color-red) max(0, l - .03) c h));--color-white-300:light-dark(oklch(from var(--color-white) min(1, l + .03) c h),oklch(from var(--color-white) min(1, l + .03) c h));--color-white-400:var(--color-white);--color-white-500:light-dark(oklch(from var(--color-white) max(0, l - .03) c h),oklch(from var(--color-white) max(0, l - .03) c h));--color-yellow-300:light-dark(oklch(from var(--color-yellow) min(1, l + .03) c h),oklch(from var(--color-yellow) min(1, l + .03) c h));--color-yellow-400:var(--color-yellow);--color-yellow-500:light-dark(oklch(from var(--color-yellow) max(0, l - .03) c h),oklch(from var(--color-yellow) max(0, l - .03) c h));--font-size:var(--font-size-400);--font-weight:var(--font-weight-400);--min-width:320px;--transition-duration:var(--duration-fast);--transition-timing-function:var(--easing-spring)}:where(:root){color-scheme:light}b,strong{--color:var(--color-text-400);--font-weight:var(--font-weight-500)}h1{--font-size:var(--font-size-800)}h1,h2,h3,h4{--color:var(--color-text-400);--font-weight:var(--font-weight-500)}h2{--font-size:var(--font-size-600)}h3{--font-size:var(--font-size-500)}h4{--font-size:var(--font-size-400)}section{--width:100%}@property --font-weight{syntax:"<number>";inherits:true;initial-value:400}@property --surface-level{syntax:"<integer>";inherits:true;initial-value:0}@property --surface-shadow-weight{syntax:"<number>";inherits:false;initial-value:0}*{letter-spacing:calc(var(--letter-spacing) - (var(--font-weight) - var(--font-weight-400)) * var(--font-weight-tracking,0em));line-height:var(--line-height)}*,:after,:before{box-sizing:border-box}a{color:var(--color,inherit);cursor:pointer;outline:none;text-decoration:none}b,strong{color:var(--color,inherit);font-weight:var(--font-weight)}body{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;background-color:var(--background);color:var(--color);font-family:var(--font-family);font-size:var(--font-size);font-weight:var(--font-weight);min-width:var(--min-width);text-rendering:optimizelegibility}body,html{width:100%;height:100%;overflow-x:hidden}h1,h2,h3,h4,h5,h6{color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight-500);overflow-wrap:break-word;text-wrap:balance;width:100%;margin:0;padding:0;position:relative}h1 sub,h1 sup,h2 sub,h2 sup,h3 sub,h3 sup,h4 sub,h4 sup,h5 sub,h5 sup,h6 sub,h6 sup{font-size:.64em}p{overflow-wrap:break-word;text-wrap:pretty;width:100%;margin:0;padding:0}pre{overflow-wrap:break-word;white-space:break-spaces;width:100%;margin:0;padding:0}section{width:var(--width);flex-wrap:wrap;place-content:flex-start;display:flex;position:relative}sub{bottom:-.48em}sub,sup{font-size:.8em}sup{top:-.48em}}
 /*$vite$:1*/

package/build/components/section/scss/index.scss

@@ -0,0 +1,2 @@
+@layer components{.section{--gap-horizontal:0px;--gap-vertical:0px}.section-header{--gap-horizontal:var(--size-300);--gap-vertical:calc(var(--size-100) / 2)}.section-subtitle,.section-suptitle{--color:var(--color-default);--color-default:var(--color-text-400);--font-size:var(--font-size-400)}.section-title{--color:var(--color-default);--color-default:var(--color-text-500)}.section,.section-header{gap:var(--gap-vertical) var(--gap-horizontal);flex-flow:column;width:100%;display:flex;position:relative}.section-subtitle,.section-suptitle{font-size:var(--font-size)}.section-subtitle,.section-suptitle,.section-title{color:var(--color);z-index:1;width:100%;display:block;position:relative}.section-title{text-wrap:balance}}
+/*$vite$:1*/

package/build/components/select/index.d.ts

@@ -36,6 +36,7 @@ type A = Attributes & {
     state: State;
 });
 type Option = {
+    content?: Renderable<unknown>;
     detail?: string;
     label: Renderable<unknown>;
     selected?: Renderable<unknown>;

package/build/components/select/index.js

@@ -12,8 +12,9 @@ import chevronUp from '@esportsplus/ui/svg/chevron-up.svg';
 import chevrons from '@esportsplus/ui/svg/chevrons-up-down.svg';
 import './scss/index.scss';
 const template_167mg1f3 = template_u1.template(`<div class='select select-menu'><span class='select-menu-label'></span><button aria-haspopup='listbox' class='select-menu-trigger' role='combobox' type='button'><span class='select-menu-value'></span><svg aria-hidden='true' class='select-menu-chevron'><use /></svg></button><input class='select-menu-tag' type='hidden' /><div class='select-menu-panel'><div class='select-menu-scroller'><div role='listbox'></div></div><div aria-hidden='true' class='select-menu-scroll select-menu-scroll--up'><svg class='select-menu-scroll-icon'><use /></svg></div><div aria-hidden='true' class='select-menu-scroll select-menu-scroll--down'><svg class='select-menu-scroll-icon'><use />`);
-const template_167mg1fj = template_u1.template(`<div class='select-menu-option' role='option'><svg aria-hidden='true' class='select-menu-check'><use /></svg><span class='select-menu-option-label'>`);
-const template_167mg1fo = template_u1.template(`<span class='select-menu-option-detail'>`);
+const template_167mg1fj = template_u1.template(`<div class='select-menu-option' role='option'>`);
+const template_167mg1fm = template_u1.template(`<svg aria-hidden='true' class='select-menu-check'><use /></svg><span class='select-menu-option-label'></span><!--$-->`);
+const template_167mg1fr = template_u1.template(`<span class='select-menu-option-detail'>`);
 class ReactiveObject_167mg1f0 extends reactivity_u0.ReactiveObject {
     #active;
     #error;
@@ -294,14 +295,18 @@ function template({ label, name, options: choices, selected: initial, state = ne
             return option?.selected ?? option?.label ?? '';
         }), 1);
         template_u1.slot(element_167mg1fd, options.map((option, index) => {
-            let root_167mg1fi = template_167mg1fj(), element_167mg1fk = root_167mg1fi.firstChild, element_167mg1fl = element_167mg1fk.firstElementChild.firstElementChild, element_167mg1fm = element_167mg1fk.firstElementChild.nextElementSibling;
-            template_u1.slot(element_167mg1fm, option.label, 1);
-            template_u1.slot(element_167mg1fk, option.detail && (() => {
-                let root_167mg1fn = template_167mg1fo(), element_167mg1fp = root_167mg1fn.firstChild;
-                template_u1.slot(element_167mg1fp, option.detail, 1);
-                return root_167mg1fn;
-            })(), 2);
-            template_u1.setProperty(element_167mg1fl, 'href', template_u1.interpolate(["#", (check)]));
+            let root_167mg1fi = template_167mg1fj(), element_167mg1fk = root_167mg1fi.firstChild;
+            template_u1.slot(element_167mg1fk, option.content ?? (() => {
+                let root_167mg1fl = template_167mg1fm(), element_167mg1fn = root_167mg1fl.firstChild.firstElementChild, element_167mg1fo = root_167mg1fl.firstChild.nextSibling, element_167mg1fp = element_167mg1fo.nextSibling;
+                template_u1.slot(element_167mg1fo, option.label, 1);
+                template_u1.slot(element_167mg1fp, option.detail && (() => {
+                    let root_167mg1fq = template_167mg1fr(), element_167mg1fs = root_167mg1fq.firstChild;
+                    template_u1.slot(element_167mg1fs, option.detail, 1);
+                    return root_167mg1fq;
+                })());
+                template_u1.setProperty(element_167mg1fn, 'href', template_u1.interpolate(["#", (check)]));
+                return root_167mg1fl;
+            })(), 1);
             template_u1.setProperty(element_167mg1fk, 'id', template_u1.interpolate([(id), "-option-", (index)]));
             template_u1.setProperties(element_167mg1fk, this?.attributes?.[SELECT_OPTION]);
             template_u1.setProperties(element_167mg1fk, attributes[SELECT_OPTION]);
@@ -330,8 +335,8 @@ function template({ label, name, options: choices, selected: initial, state = ne
         template_u1.setProperty(element_167mg1fd, 'aria-labelledby', template_u1.interpolate([(id), "-label"]));
         template_u1.setProperty(element_167mg1fd, 'id', template_u1.interpolate([(id), "-list"]));
         template_u1.onconnect(element_167mg1fc, (element) => {
-            parts.label = element.querySelector('.select-menu-option-label') ?? undefined;
             parts.option = element.querySelector('.select-menu-option') ?? undefined;
+            parts.label = element.querySelector('.select-menu-option-label') ?? parts.option;
             parts.scroller = element;
         });
         template_u1.on(element_167mg1fc, 'scroll', function () {

package/build/components/select/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.select-menu-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.select-menu-check{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;filter:blur(4px);opacity:0;transition:filter var(--icon-swap-duration) var(--icon-swap-timing-function), opacity var(--icon-swap-duration) var(--icon-swap-timing-function), scale var(--icon-swap-duration) var(--icon-swap-timing-function);scale:.25}@media (prefers-reduced-motion:reduce){.select-menu-check{transition:none}}.select-menu-option[aria-selected=true] .select-menu-check{filter:blur();opacity:1;scale:1}.select-menu-option-label,.select-menu-value{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.select{--background:var(--color-grey-400);--box-shadow:0 0 0 1px oklch(from var(--color-black-500) l c h / .06), 0 1px 2px oklch(from var(--color-black-500) l c h / .06), 0 6px 16px -6px oklch(from var(--color-black-500) l c h / .12);--color:var(--color-text-500);--color-muted:var(--color-text-300);--focus-width:var(--border-width-500);--font-size:calc(var(--font-size-400) * .875);--height:40px;--highlight:color-mix(in oklch, var(--color) 6%, transparent);--item-height:36px;--press-scale:.96;--transition-duration:.15s;--transition-timing-function:ease-out;--trigger-border-radius:var(--border-radius-400);--width:min(260px, 100%)}.select-menu-option{--icon-swap-duration:.3s;--icon-swap-timing-function:linear(0, .058, .18, .321, .455, .573, .671, .75, .812, .86, .897, .924, .944, .96, .971, .979, .985, .989, .992, .994, .996, .997, .998, .999, 1)}.select-menu-panel{--background:var(--color-grey-400);--border-radius:var(--border-radius-600);--box-shadow:0 0 0 1px oklch(from var(--color-black-500) l c h / .06), 0 1px 2px oklch(from var(--color-black-500) l c h / .06), 0 6px 16px -6px oklch(from var(--color-black-500) l c h / .12);--fade:24px;--pad:4px;--rows:8;--scale:.96;--transition-duration:.15s;--transition-timing-function:cubic-bezier(.23, 1, .32, 1);--width:auto}.select-menu-panel:not(.--active){--transition-duration:.1s}@media (prefers-reduced-motion:reduce){.select-menu-panel{--scale:1}}.select-menu-scroller{--fade-bottom:0px;--fade-top:0px}.select-menu-scroller--down{--fade-bottom:var(--fade)}.select-menu-scroller--up{--fade-top:var(--fade)}.select{color:var(--color);font-size:var(--font-size);width:var(--width);z-index:0;position:relative}.select.--active,.select:not(.--active):hover{z-index:9}.select-menu-check{stroke-width:2.25px;flex:none;width:16px;height:16px}.select-menu-chevron{color:var(--color-muted);flex:none;width:16px;height:16px}.select-menu-option{border-radius:var(--border-radius-400);cursor:default;align-items:center;gap:var(--size-200);height:var(--item-height);padding:0 var(--size-100);-webkit-user-select:none;user-select:none;display:flex}.select-menu-option--highlighted,.select-menu-option:focus{background:var(--highlight)}.select-menu-option-detail{color:var(--color-muted);font-size:var(--font-size-300);font-variant-numeric:tabular-nums;flex:none}.select-menu-option-label{flex:1;min-width:0}.select-menu-panel{background:var(--background);border-radius:var(--border-radius);box-shadow:var(--box-shadow);max-width:calc(90vw - var(--size-700) * 2);opacity:0;min-width:auto;scale:var(--scale);transition:opacity var(--transition-duration) var(--transition-timing-function), scale var(--transition-duration) var(--transition-timing-function), translate var(--transition-duration) var(--transition-timing-function);width:var(--width);z-index:50;position:absolute;top:0;left:0;overflow:hidden}.select-menu-panel.--active{opacity:1;scale:1}.select-menu-scroll{color:var(--color-muted);opacity:0;pointer-events:none;justify-content:center;align-items:center;height:24px;transition:opacity .15s ease-out;display:flex;position:absolute;inset-inline:0}.select-menu-scroll.--active{opacity:1;pointer-events:auto}.select-menu-scroll--down{bottom:0}.select-menu-scroll--up{top:0}.select-menu-scroll-icon{width:14px;height:14px}.select-menu-scroller{-webkit-mask-image:linear-gradient(to bottom, transparent, black var(--fade-top), black calc(100% - var(--fade-bottom)), transparent);-webkit-mask-image:linear-gradient(to bottom, transparent, black var(--fade-top), black calc(100% - var(--fade-bottom)), transparent);mask-image:linear-gradient(to bottom, transparent, black var(--fade-top), black calc(100% - var(--fade-bottom)), transparent);max-height:calc(var(--rows) * var(--item-height) + var(--pad) * 2);overscroll-behavior:contain;padding:var(--pad);overflow-y:auto}.select-menu-tag{display:none}.select-menu-trigger{background:var(--background);border-radius:var(--trigger-border-radius);box-shadow:var(--box-shadow);color:var(--color);cursor:pointer;font:inherit;align-items:center;gap:var(--size-200);height:var(--height);padding:0 10px 0 var(--size-300);text-align:left;touch-action:manipulation;transition:scale var(--transition-duration) var(--transition-timing-function);-webkit-user-select:none;user-select:none;border:0;outline:none;width:100%;margin:0;display:flex}.select-menu-trigger:active{scale:var(--press-scale)}.select-menu-trigger:focus-visible{outline:var(--focus-width) solid var(--color);outline-offset:2px}.select-menu-value{flex:1;min-width:0}@media (prefers-reduced-motion:reduce){.select-menu-check{filter:none;scale:1}.select-menu-trigger{transition:none}.select-menu-trigger:active{scale:1}}}
+@layer components{.select-menu-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.select-menu-check{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;filter:blur(var(--blur-400));opacity:0;transition:filter var(--icon-swap-duration) var(--icon-swap-timing-function), opacity var(--icon-swap-duration) var(--icon-swap-timing-function), scale var(--icon-swap-duration) var(--icon-swap-timing-function);scale:.25}@media (prefers-reduced-motion:reduce){.select-menu-check{transition:none}}.select-menu-option[aria-selected=true] .select-menu-check{filter:blur();opacity:1;scale:1}.select-menu-option-label,.select-menu-value{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}@keyframes text-gradient{to{background-position:var(--background-size) 0}}@keyframes text-line-shadow{0%{background-position:0 0}to{background-position:100% -100%}}@keyframes text-shiny{0%,90%,to{background-position:calc(-100% - var(--shine-width)) 0}30%,60%{background-position:calc(100% + var(--shine-width)) 0}}.select,.select-menu-panel{--surface-shadow-weight:6;--surface-background-active:light-dark(oklch(from var(--surface-background-default) calc(l + .01) c h),oklch(from var(--surface-background-default) calc(l + .02) c h));--surface-background-default:light-dark(oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) calc(c * clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) / max(l, .01)) h));--surface-background-hover:light-dark(oklch(from var(--surface-background-default) calc(l + .005) c h),oklch(from var(--surface-background-default) calc(l + .01) c h));--surface-background-pressed:light-dark(oklch(from var(--surface-background-default) calc(l - .02) c h),oklch(from var(--surface-background-default) calc(l - .04) c h));--surface-border-active:light-dark(oklch(from var(--surface-background-active) max(0, l - .04) c h),oklch(from var(--surface-background-active) min(1, l + .06) c h));--surface-border-default:light-dark(oklch(from var(--surface-background-default) max(0, l - .04) c h),oklch(from var(--surface-background-default) min(1, l + .06) c h));--surface-border-hover:light-dark(oklch(from var(--surface-background-hover) max(0, l - .04) c h),oklch(from var(--surface-background-hover) min(1, l + .06) c h));--surface-border-pressed:light-dark(oklch(from var(--surface-background-pressed) max(0, l - .04) c h),oklch(from var(--surface-background-pressed) min(1, l + .06) c h));--surface-shadow-active:var(--surface-shadow-hover);--surface-shadow-color:light-dark(oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .08),oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-cast:light-dark(oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .08),oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-default:0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 0, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 5 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 1, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 9 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 25 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -7 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, var(--surface-shadow-weight) - 0, 1) + .05 * clamp(0, var(--surface-shadow-weight) - 2, 1) + .15 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -8 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -10 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -.1 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10));--surface-shadow-hover:0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 5 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 1, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 9 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 25 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -7 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + .15 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -8 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -.1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10));--surface-shadow-pressed:0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 5 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 1, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 9 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 25 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -7 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + .15 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -8 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -.1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10))}@container style(--surface-level:-3){.select,.select-menu-panel{--surface-level:-2;--surface-shadow-weight:0}}@container style(--surface-level:-2){.select,.select-menu-panel{--surface-level:-1;--surface-shadow-weight:0}}@container style(--surface-level:-1){.select,.select-menu-panel{--surface-level:0;--surface-shadow-weight:0}}@container style(--surface-level:0){.select,.select-menu-panel{--surface-level:1;--surface-shadow-weight:1}}@container style(--surface-level:1){.select,.select-menu-panel{--surface-level:2;--surface-shadow-weight:2}}@container style(--surface-level:2){.select,.select-menu-panel{--surface-level:3;--surface-shadow-weight:3}}@container style(--surface-level:3){.select,.select-menu-panel{--surface-level:4;--surface-shadow-weight:4}}@container style(--surface-level:4){.select,.select-menu-panel{--surface-level:5;--surface-shadow-weight:5}}@container style(--surface-level:5){.select,.select-menu-panel{--surface-level:6;--surface-shadow-weight:6}}.select,.select-menu-option,.select-menu-panel{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--active.select,.--active.select-menu-option,.--active.select-menu-panel{--background:var(--background-active)}.select:not(.--active):hover,.select-menu-option:not(.--active):hover,.select-menu-panel:not(.--active):hover{--background:var(--background-hover)}.select:not(.--active):active,.select-menu-option:not(.--active):active,.select-menu-panel:not(.--active):active{--background:var(--background-pressed)}.select,.select-menu-panel{--box-shadow:var(--box-shadow-default);--box-shadow-active:var(--box-shadow-default);--box-shadow-default:none;--box-shadow-hover:var(--box-shadow-default);--box-shadow-pressed:var(--box-shadow-default)}.--active.select,.--active.select-menu-panel{--box-shadow:var(--box-shadow-active)}.select:not(.--active):hover,.select-menu-panel:not(.--active):hover{--box-shadow:var(--box-shadow-hover)}.select:not(.--active):active,.select-menu-panel:not(.--active):active{--box-shadow:var(--box-shadow-pressed)}.select{--background-active:var(--surface-background-active);--background-default:var(--surface-background-default);--background-hover:var(--surface-background-hover);--background-pressed:var(--surface-background-pressed);--box-shadow-active:var(--surface-shadow-active);--box-shadow-default:var(--surface-shadow-default);--box-shadow-hover:var(--surface-shadow-hover);--box-shadow-pressed:var(--surface-shadow-pressed);--color:var(--color-text-500);--color-muted:var(--color-text-300);--focus-width:var(--border-width-500);--font-size:calc(var(--font-size-400) * .875);--height:40px;--item-height:36px;--trigger-border-radius:var(--border-radius-400);--width:min(260px, 100%)}.select-menu-option{--background-pressed:var(--highlight-pressed);--icon-swap-duration:var(--duration-moderate);--icon-swap-timing-function:linear(0, .058, .18, .321, .455, .573, .671, .75, .812, .86, .897, .924, .944, .96, .971, .979, .985, .989, .992, .994, .996, .997, .998, .999, 1)}.select-menu-panel{--background-default:var(--surface-background-default);--border-radius:var(--border-radius-600);--box-shadow-default:var(--surface-shadow-default);--fade:24px;--highlight:var(--surface-background-hover);--highlight-pressed:var(--surface-background-pressed);--pad:4px;--rows:8;--scale:.96;--transition-duration:var(--duration-moderate);--transition-timing-function:var(--easing-spring);--width:auto}.select-menu-panel:not(.--active){--transition-duration:var(--duration-moderate-exit)}@media (prefers-reduced-motion:reduce){.select-menu-panel{--scale:1}}.select-menu-scroller{--fade-bottom:0px;--fade-top:0px}.select-menu-scroller--down{--fade-bottom:var(--fade)}.select-menu-scroller--up{--fade-top:var(--fade)}.select{color:var(--color);font-size:var(--font-size);width:var(--width);z-index:0;position:relative}.select.--active,.select:not(.--active):hover{z-index:9}.select-menu-check{height:var(--size-400);stroke-width:2.25px;width:var(--size-400);flex:none}.select-menu-chevron{color:var(--color-muted);height:var(--size-400);width:var(--size-400);flex:none}.select-menu-option{background:var(--background);border-radius:var(--border-radius-400);cursor:default;align-items:center;gap:var(--size-200);height:var(--item-height);padding:0 var(--size-100);-webkit-user-select:none;user-select:none;display:flex}.select-menu-option--highlighted,.select-menu-option:focus{--background-default:var(--highlight)}.select-menu-option-detail{color:var(--color-muted);font-size:var(--font-size-300);font-variant-numeric:tabular-nums;flex:none}.select-menu-option-label{flex:1;min-width:0}.select-menu-panel{background:var(--background);border-radius:var(--border-radius);box-shadow:var(--box-shadow);max-width:calc(90vw - var(--size-700) * 2);opacity:0;min-width:auto;scale:var(--scale);transition:opacity var(--transition-duration) var(--transition-timing-function), scale var(--transition-duration) var(--transition-timing-function), translate var(--transition-duration) var(--transition-timing-function);width:var(--width);z-index:50;position:absolute;top:0;left:0;overflow:hidden}.select-menu-panel.--active{opacity:1;scale:1}.select-menu-scroll{color:var(--color-muted);opacity:0;pointer-events:none;height:24px;transition:opacity var(--duration-fast) var(--easing-spring);justify-content:center;align-items:center;display:flex;position:absolute;inset-inline:0}.select-menu-scroll.--active{opacity:1;pointer-events:auto}.select-menu-scroll--down{bottom:0}.select-menu-scroll--up{top:0}.select-menu-scroll-icon{width:14px;height:14px}.select-menu-scroller{mask-image:linear-gradient(to bottom, transparent, black var(--fade-top), black calc(100% - var(--fade-bottom)), transparent);max-height:calc(var(--rows) * var(--item-height) + var(--pad) * 2);overscroll-behavior:contain;padding:var(--pad);overflow-y:auto}.select-menu-tag{display:none}.select-menu-trigger{background:var(--background);border-radius:var(--trigger-border-radius);box-shadow:var(--box-shadow);color:var(--color);cursor:pointer;font:inherit;align-items:center;gap:var(--size-200);height:var(--height);padding:0 var(--size-200) 0 var(--size-300);text-align:left;touch-action:manipulation;-webkit-user-select:none;user-select:none;border:0;outline:none;width:100%;margin:0;display:flex}.select-menu-trigger:focus-visible{outline:var(--focus-width) solid var(--color);outline-offset:calc(var(--size-100) / 4)}.select-menu-value{flex:1;min-width:0}@media (prefers-reduced-motion:reduce){.select-menu-check{filter:none;scale:1}}}
 /*$vite$:1*/

package/build/components/shortcut-recorder/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.shortcut-recorder{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--active.shortcut-recorder{--background:var(--background-active)}.shortcut-recorder:not(.--active):hover{--background:var(--background-hover)}.shortcut-recorder:not(.--active):active{--background:var(--background-pressed)}.shortcut-recorder{--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:transparent;--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default)}.--active.shortcut-recorder{--border-color:var(--border-color-active)}.shortcut-recorder:not(.--active):hover{--border-color:var(--border-color-hover)}.shortcut-recorder:not(.--active):active{--border-color:var(--border-color-pressed)}.shortcut-recorder{--background-active:var(--color-white-300);--background-default:var(--color-grey-400);--background-hover:var(--color-white-300);--background-pressed:var(--background-hover);--border-color-active:var(--color-text-500);--border-color-default:var(--color-border-400);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-hover);--border-radius:var(--border-radius-500);--border-width:var(--border-width-default);--border-width-active:1.5px;--border-width-default:1px;--color:var(--color-text-500);--color-dot:var(--color-red-400);--color-error:var(--color-red-400);--color-muted:var(--color-text-300);--focus-color:var(--color-text-500);--focus-offset:2px;--focus-width:2px;--font-size:var(--font-size-400);--font-size-small:var(--font-size-300);--gap:4px;--height:36px;--min-width:96px;--padding-horizontal:6px;--timing-function-out:cubic-bezier(.23, 1, .32, 1);--timing-function-spring:cubic-bezier(.34, 1.56, .64, 1);--transition-duration:.15s}.shortcut-recorder.--active{--border-width:var(--border-width-active)}.shortcut-recorder.--invalid{--color-muted:var(--color-error)}.shortcut-recorder{background:var(--background);border-radius:var(--border-radius);box-shadow:inset 0 0 0 var(--border-width) var(--border-color);color:var(--color);cursor:pointer;font:inherit;font-size:var(--font-size);align-items:center;gap:var(--gap);height:var(--height);min-width:var(--min-width);padding:0 var(--padding-horizontal);transition:background var(--transition-duration) var(--timing-function-out), box-shadow var(--transition-duration) var(--timing-function-out);border:0;outline:none;flex-shrink:0;justify-content:flex-end;display:flex}.shortcut-recorder:not(.--active):focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.shortcut-recorder-dot{background:var(--color-dot);border-radius:50%;width:6px;height:6px;animation:1.1s ease-in-out infinite shortcut-recorder-blink}.shortcut-recorder-key{pointer-events:none}.shortcut-recorder-key--enter{animation:shortcut-recorder-enter .3s var(--timing-function-spring) backwards}.shortcut-recorder-key--settle{animation:shortcut-recorder-settle .3s var(--timing-function-spring) calc(var(--index) * 30ms) backwards}.shortcut-recorder-placeholder{color:var(--color-muted);font-size:var(--font-size-small);transition:color var(--transition-duration) var(--timing-function-out);align-items:center;gap:6px;padding:0 6px;display:flex}.shortcut-recorder-placeholder--fade{animation:shortcut-recorder-fade .18s var(--timing-function-out)}@media (prefers-reduced-motion:reduce){.shortcut-recorder,.shortcut-recorder-dot,.shortcut-recorder-key,.shortcut-recorder-placeholder{transition:none;animation:none}}.error:has(>.shortcut-recorder){flex-shrink:0}@keyframes shortcut-recorder-blink{50%{opacity:.25}}@keyframes shortcut-recorder-enter{0%{filter:blur(3px);opacity:0;scale:.8}}@keyframes shortcut-recorder-fade{0%{opacity:0}}@keyframes shortcut-recorder-settle{0%{opacity:.6;translate:0 -3px;scale:1.08}}}
+@layer components{.shortcut-recorder{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--active.shortcut-recorder{--background:var(--background-active)}.shortcut-recorder:not(.--active):hover{--background:var(--background-hover)}.shortcut-recorder:not(.--active):active{--background:var(--background-pressed)}.shortcut-recorder{--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:transparent;--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default)}.--active.shortcut-recorder{--border-color:var(--border-color-active)}.shortcut-recorder:not(.--active):hover{--border-color:var(--border-color-hover)}.shortcut-recorder:not(.--active):active{--border-color:var(--border-color-pressed)}.shortcut-recorder{--background-active:var(--surface-background-active);--background-default:var(--surface-background-default);--background-hover:var(--surface-background-hover);--background-pressed:var(--background-hover);--border-color-active:var(--color-primary-500);--border-color-default:var(--surface-border-hover);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-hover);--border-radius:var(--border-radius-500);--border-width:var(--border-width-default);--border-width-active:1.5px;--border-width-default:var(--border-width-400);--color:var(--color-text-500);--color-dot:var(--color-red-400);--color-error:var(--color-red-400);--color-muted:var(--color-text-300);--focus-color:var(--color-primary-500);--focus-offset:calc(var(--size-100) / 4);--focus-width:var(--border-width-500);--font-size:var(--font-size-400);--font-size-small:var(--font-size-300);--gap:calc(var(--size-100) / 2);--height:36px;--min-width:96px;--padding-horizontal:calc(var(--size-300) / 2);--timing-function-out:var(--easing-spring);--timing-function-spring:cubic-bezier(.34, 1.56, .64, 1)}.shortcut-recorder.--active{--border-width:var(--border-width-active)}.shortcut-recorder.--invalid{--color-muted:var(--color-error)}.error:has(>.shortcut-recorder){flex-shrink:0}.shortcut-recorder{background:var(--background);border-radius:var(--border-radius);box-shadow:inset 0 0 0 var(--border-width) var(--border-color);color:var(--color);cursor:pointer;font:inherit;font-size:var(--font-size);align-items:center;gap:var(--gap);height:var(--height);min-width:var(--min-width);padding:0 var(--padding-horizontal);transition:background var(--transition-duration) var(--timing-function-out), box-shadow var(--transition-duration) var(--timing-function-out);border:0;outline:none;flex-shrink:0;justify-content:flex-end;display:flex}.shortcut-recorder:not(.--active):focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset)}.shortcut-recorder-dot{animation:shortcut-recorder-blink 1.1s var(--easing-in-out) infinite;background:var(--color-dot);border-radius:50%;width:6px;height:6px}.shortcut-recorder-key{pointer-events:none}.shortcut-recorder-key--enter{animation:shortcut-recorder-enter var(--duration-moderate) var(--timing-function-spring) backwards}.shortcut-recorder-key--settle{animation:shortcut-recorder-settle var(--duration-moderate) var(--timing-function-spring) calc(var(--index) * 30ms) backwards}.shortcut-recorder-placeholder{color:var(--color-muted);font-size:var(--font-size-small);align-items:center;gap:calc(var(--size-300) / 2);padding:0 calc(var(--size-300) / 2);transition:color var(--transition-duration) var(--timing-function-out);display:flex}.shortcut-recorder-placeholder--fade{animation:shortcut-recorder-fade .18s var(--timing-function-out)}@media (prefers-reduced-motion:reduce){.shortcut-recorder,.shortcut-recorder-dot,.shortcut-recorder-key,.shortcut-recorder-placeholder{transition:none;animation:none}}@keyframes shortcut-recorder-blink{50%{opacity:.25}}@keyframes shortcut-recorder-enter{0%{filter:blur(var(--blur-400));opacity:0;scale:.8}}@keyframes shortcut-recorder-fade{0%{opacity:0}}@keyframes shortcut-recorder-settle{0%{opacity:.6;translate:0 -3px;scale:1.08}}}
 /*$vite$:1*/

package/build/components/sortable/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.sortable-overlay{position:absolute;inset:0}.sortable>*{-webkit-touch-callout:none}.sortable-overlay{border-radius:inherit;pointer-events:none}.sortable-drag{color:inherit;pointer-events:none;background:0 0;border:0;margin:0;padding:0;position:fixed;inset:auto;overflow:visible}.sortable{--drag-animation:none;--drag-box-shadow:var(--box-shadow-400);--drag-scale:1.06;--drop-blur:4px;--drop-duration:.26s;--drop-easing:cubic-bezier(.34, 1.3, .64, 1);--overlay-transition-duration:.16s;--placeholder-background:transparent;--placeholder-border-color:var(--color-border-500);--placeholder-border-width:var(--border-width-400);--shift-duration:.22s;--shift-easing:cubic-bezier(.2, 0, 0, 1);--swing-angle:8deg;--swing-damping:11;--swing-stiffness:260;--swing-strength:.006}.sortable--bouncy{--swing-angle:10deg;--swing-damping:6;--swing-stiffness:300;--swing-strength:.007}.sortable--damped{--swing-angle:6deg;--swing-damping:32;--swing-stiffness:260;--swing-strength:.006}.sortable--floppy{--swing-angle:14deg;--swing-damping:4;--swing-stiffness:120;--swing-strength:.01}.sortable--heavy{--swing-angle:10deg;--swing-damping:7;--swing-stiffness:90;--swing-strength:.007}.sortable--rigid{--swing-angle:0deg;--swing-damping:11;--swing-stiffness:260;--swing-strength:0}.sortable--snappy{--swing-angle:6deg;--swing-damping:18;--swing-stiffness:600;--swing-strength:.005}.sortable--subtle{--swing-angle:4deg;--swing-damping:16;--swing-stiffness:300;--swing-strength:.003}.sortable--wobbly{--swing-angle:8deg;--swing-damping:5;--swing-stiffness:700;--swing-strength:.006}.sortable--breathe{--drag-animation:sortable-breathe 1.8s ease-in-out infinite alternate}.sortable--drift{--drag-animation:sortable-sway 1.9s ease-in-out infinite alternate, sortable-float 1.3s ease-in-out infinite alternate}.sortable--float{--drag-animation:sortable-float 1.6s ease-in-out infinite alternate}.sortable--heartbeat{--drag-animation:sortable-heartbeat 1.4s ease-in-out infinite}.sortable--jelly{--drag-animation:sortable-jelly .5s ease-in-out infinite alternate}.sortable--jiggle{--drag-animation:sortable-jiggle .28s linear infinite}.sortable--orbit{--drag-animation:sortable-orbit 1.6s linear infinite}.sortable--pop{--drag-animation:sortable-pop .45s cubic-bezier(.3, 0, .3, 1)}.sortable--settle{--drag-animation:sortable-settle .9s ease-out}.sortable--shimmy{--drag-animation:sortable-shimmy 90ms linear infinite alternate}.sortable--sway{--drag-animation:sortable-sway 1.4s ease-in-out infinite alternate}.sortable--tremble{--drag-animation:sortable-tremble .4s linear infinite}.sortable--wiggle{--drag-animation:sortable-wiggle .16s ease-in-out infinite alternate}@media (prefers-reduced-motion:reduce){.sortable{--shift-duration:0s;--swing-angle:0deg}}@property --sortable-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@property --sortable-x{syntax:"<length>";inherits:false;initial-value:0}@property --sortable-y{syntax:"<length>";inherits:false;initial-value:0}.sortable>.sortable-item--held{background:var(--placeholder-background);box-shadow:none;color:#0000;outline:var(--placeholder-border-width) dashed var(--placeholder-border-color);outline-offset:calc(var(--placeholder-border-width) * -1);transition:background-color var(--transition-duration) var(--transition-timing-function), color var(--transition-duration) var(--transition-timing-function);border-color:#0000}.sortable>.sortable-item--held>*{opacity:0;transition:opacity var(--transition-duration) var(--transition-timing-function)}.sortable>.sortable-item--revealing,.sortable>.sortable-item--revealing *{transition:none!important}.sortable-drag{animation:var(--drag-animation);border-radius:var(--sortable-radius);box-shadow:var(--drag-box-shadow);box-sizing:border-box;height:var(--sortable-height);left:var(--sortable-left);scale:var(--drag-scale);top:var(--sortable-top);transform:translate3d(var(--sortable-x), var(--sortable-y), 0) rotate(var(--sortable-angle));transform-origin:var(--sortable-origin);transition:box-shadow var(--transition-duration) var(--transition-timing-function), scale var(--transition-duration) var(--transition-timing-function);width:var(--sortable-width);will-change:transform}@starting-style{.sortable-drag{box-shadow:none;scale:1}}.sortable-drag>*{box-sizing:border-box;width:100%;height:100%;margin:0}.sortable-drag--dropping{box-shadow:none;filter:blur(var(--drop-blur));opacity:0;transition:--sortable-angle var(--drop-duration) var(--drop-easing), --sortable-x var(--drop-duration) var(--drop-easing), --sortable-y var(--drop-duration) var(--drop-easing), box-shadow var(--drop-duration) var(--drop-easing), filter calc(var(--drop-duration) / 4) ease-out calc(var(--drop-duration) * .75), height var(--drop-duration) var(--drop-easing), opacity calc(var(--drop-duration) / 4) ease-out calc(var(--drop-duration) * .75), rotate var(--drop-duration) var(--drop-easing), scale var(--drop-duration) var(--drop-easing), translate var(--drop-duration) var(--drop-easing), width var(--drop-duration) var(--drop-easing);animation:none;scale:1}.sortable-overlay{background:inherit;opacity:0;transition:display var(--overlay-transition-duration) allow-discrete, opacity var(--overlay-transition-duration) var(--transition-timing-function);z-index:1;justify-content:center;align-items:center;display:none}.sortable-drag .sortable-overlay{opacity:1;display:flex}@starting-style{.sortable-drag .sortable-overlay{opacity:0}}.sortable-drag--dropping .sortable-overlay{opacity:0}:root.sortable-grabbing,:root.sortable-grabbing *{cursor:grabbing!important}@keyframes sortable-breathe{0%{scale:var(--drag-scale)}to{scale:calc(var(--drag-scale) * 1.025)}}@keyframes sortable-float{0%{translate:0}to{translate:0 -2px}}@keyframes sortable-heartbeat{0%,28%,70%,to{scale:var(--drag-scale)}14%,42%{scale:calc(var(--drag-scale) * 1.03)}}@keyframes sortable-jelly{0%{scale:calc(var(--drag-scale) * 1.02) calc(var(--drag-scale) * .98)}to{scale:calc(var(--drag-scale) * .98) calc(var(--drag-scale) * 1.02)}}@keyframes sortable-jiggle{0%,to{translate:0 .3px;rotate:-.7deg}25%{translate:.3px;rotate:.5deg}50%{translate:0 -.3px;rotate:.7deg}75%{translate:-.3px;rotate:-.5deg}}@keyframes sortable-orbit{0%,to{translate:1.2px}12.5%{translate:.85px .85px}25%{translate:0 1.2px}37.5%{translate:-.85px .85px}50%{translate:-1.2px}62.5%{translate:-.85px -.85px}75%{translate:0 -1.2px}87.5%{translate:.85px -.85px}}@keyframes sortable-pop{0%{scale:1}45%{scale:calc(var(--drag-scale) * 1.06)}75%{scale:calc(var(--drag-scale) * .98)}to{scale:var(--drag-scale)}}@keyframes sortable-settle{0%,to{rotate:0deg}15%{rotate:3deg}30%{rotate:-2deg}45%{rotate:1.2deg}60%{rotate:-.6deg}75%{rotate:.25deg}}@keyframes sortable-shimmy{0%{translate:-.6px}to{translate:.6px}}@keyframes sortable-sway{0%{rotate:-1.2deg}to{rotate:1.2deg}}@keyframes sortable-tremble{0%,to{translate:0;rotate:0deg}20%{translate:-.4px .3px;rotate:-.3deg}40%{translate:.5px -.2px;rotate:.2deg}60%{translate:-.2px -.4px;rotate:-.1deg}80%{translate:.3px .4px;rotate:.3deg}}@keyframes sortable-wiggle{0%{rotate:-.6deg}to{rotate:.6deg}}@media (prefers-reduced-motion:reduce){.sortable-drag{animation:none}}}
+@layer components{.sortable>*{-webkit-touch-callout:none}.sortable-overlay{border-radius:inherit;pointer-events:none;position:absolute;inset:0}.sortable-drag{color:inherit;pointer-events:none;--surface-shadow-weight:6;--surface-background-active:light-dark(oklch(from var(--surface-background-default) calc(l + .01) c h),oklch(from var(--surface-background-default) calc(l + .02) c h));--surface-background-default:light-dark(oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) calc(c * clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) / max(l, .01)) h));--surface-background-hover:light-dark(oklch(from var(--surface-background-default) calc(l + .005) c h),oklch(from var(--surface-background-default) calc(l + .01) c h));--surface-background-pressed:light-dark(oklch(from var(--surface-background-default) calc(l - .02) c h),oklch(from var(--surface-background-default) calc(l - .04) c h));--surface-border-active:light-dark(oklch(from var(--surface-background-active) max(0, l - .04) c h),oklch(from var(--surface-background-active) min(1, l + .06) c h));--surface-border-default:light-dark(oklch(from var(--surface-background-default) max(0, l - .04) c h),oklch(from var(--surface-background-default) min(1, l + .06) c h));--surface-border-hover:light-dark(oklch(from var(--surface-background-hover) max(0, l - .04) c h),oklch(from var(--surface-background-hover) min(1, l + .06) c h));--surface-border-pressed:light-dark(oklch(from var(--surface-background-pressed) max(0, l - .04) c h),oklch(from var(--surface-background-pressed) min(1, l + .06) c h));--surface-shadow-active:var(--surface-shadow-hover);--surface-shadow-color:light-dark(oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .08),oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-cast:light-dark(oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .08),oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-default:0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 0, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 5 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 1, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 9 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 25 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -7 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, var(--surface-shadow-weight) - 0, 1) + .05 * clamp(0, var(--surface-shadow-weight) - 2, 1) + .15 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -8 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -10 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -.1 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10));--surface-shadow-hover:0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 5 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 1, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 9 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 25 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -7 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + .15 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -8 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -.1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10));--surface-shadow-pressed:0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 5 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 1, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 9 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 25 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -7 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + .15 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -8 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -.1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10));background:0 0;border:0;margin:0;padding:0;position:fixed;inset:auto;overflow:visible}@container style(--surface-level:-3){.sortable-drag{--surface-level:-2;--surface-shadow-weight:0}}@container style(--surface-level:-2){.sortable-drag{--surface-level:-1;--surface-shadow-weight:0}}@container style(--surface-level:-1){.sortable-drag{--surface-level:0;--surface-shadow-weight:0}}@container style(--surface-level:0){.sortable-drag{--surface-level:1;--surface-shadow-weight:1}}@container style(--surface-level:1){.sortable-drag{--surface-level:2;--surface-shadow-weight:2}}@container style(--surface-level:2){.sortable-drag{--surface-level:3;--surface-shadow-weight:3}}@container style(--surface-level:3){.sortable-drag{--surface-level:4;--surface-shadow-weight:4}}@container style(--surface-level:4){.sortable-drag{--surface-level:5;--surface-shadow-weight:5}}@container style(--surface-level:5){.sortable-drag{--surface-level:6;--surface-shadow-weight:6}}.sortable{--drag-animation:none;--drag-scale:1.06;--drop-blur:var(--blur-400);--drop-duration:var(--duration-moderate);--drop-easing:cubic-bezier(.34, 1.3, .64, 1);--overlay-transition-duration:var(--duration-fast);--placeholder-background:transparent;--placeholder-border-color:var(--surface-border-pressed);--placeholder-border-width:var(--border-width-400);--shift-duration:.22s;--shift-easing:cubic-bezier(.2, 0, 0, 1);--swing-angle:8deg;--swing-damping:11;--swing-stiffness:260;--swing-strength:.006}.sortable--bouncy{--swing-angle:10deg;--swing-damping:6;--swing-stiffness:300;--swing-strength:.007}.sortable--damped{--swing-angle:6deg;--swing-damping:32;--swing-stiffness:260;--swing-strength:.006}.sortable--floppy{--swing-angle:14deg;--swing-damping:4;--swing-stiffness:120;--swing-strength:.01}.sortable--heavy{--swing-angle:10deg;--swing-damping:7;--swing-stiffness:90;--swing-strength:.007}.sortable--rigid{--swing-angle:0deg;--swing-damping:11;--swing-stiffness:260;--swing-strength:0}.sortable--snappy{--swing-angle:6deg;--swing-damping:18;--swing-stiffness:600;--swing-strength:.005}.sortable--subtle{--swing-angle:4deg;--swing-damping:16;--swing-stiffness:300;--swing-strength:.003}.sortable--wobbly{--swing-angle:8deg;--swing-damping:5;--swing-stiffness:700;--swing-strength:.006}.sortable--breathe{--drag-animation:sortable-breathe 1.8s ease-in-out infinite alternate}.sortable--drift{--drag-animation:sortable-sway 1.9s ease-in-out infinite alternate, sortable-float 1.3s ease-in-out infinite alternate}.sortable--float{--drag-animation:sortable-float 1.6s ease-in-out infinite alternate}.sortable--heartbeat{--drag-animation:sortable-heartbeat 1.4s ease-in-out infinite}.sortable--jelly{--drag-animation:sortable-jelly .5s ease-in-out infinite alternate}.sortable--jiggle{--drag-animation:sortable-jiggle .28s linear infinite}.sortable--orbit{--drag-animation:sortable-orbit 1.6s linear infinite}.sortable--pop{--drag-animation:sortable-pop .45s cubic-bezier(.3, 0, .3, 1)}.sortable--settle{--drag-animation:sortable-settle .9s ease-out}.sortable--shimmy{--drag-animation:sortable-shimmy 90ms linear infinite alternate}.sortable--sway{--drag-animation:sortable-sway 1.4s ease-in-out infinite alternate}.sortable--tremble{--drag-animation:sortable-tremble .4s linear infinite}.sortable--wiggle{--drag-animation:sortable-wiggle .16s ease-in-out infinite alternate}@media (prefers-reduced-motion:reduce){.sortable{--shift-duration:0s;--swing-angle:0deg}}@property --sortable-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@property --sortable-x{syntax:"<length>";inherits:false;initial-value:0}@property --sortable-y{syntax:"<length>";inherits:false;initial-value:0}.sortable-drag{animation:var(--drag-animation);border-radius:var(--sortable-radius);box-shadow:var(--surface-shadow-default);box-sizing:border-box;height:var(--sortable-height);left:var(--sortable-left);scale:var(--drag-scale);top:var(--sortable-top);transform:translate3d(var(--sortable-x), var(--sortable-y), 0) rotate(var(--sortable-angle));transform-origin:var(--sortable-origin);transition:box-shadow var(--transition-duration) var(--transition-timing-function), scale var(--transition-duration) var(--transition-timing-function);width:var(--sortable-width);will-change:transform}@starting-style{.sortable-drag{box-shadow:none;scale:1}}.sortable-drag--dropping{box-shadow:none;filter:blur(var(--drop-blur));opacity:0;transition:--sortable-angle var(--drop-duration) var(--drop-easing), --sortable-x var(--drop-duration) var(--drop-easing), --sortable-y var(--drop-duration) var(--drop-easing), box-shadow var(--drop-duration) var(--drop-easing), filter calc(var(--drop-duration) / 4) var(--easing-out) calc(var(--drop-duration) * .75), height var(--drop-duration) var(--drop-easing), opacity calc(var(--drop-duration) / 4) var(--easing-out) calc(var(--drop-duration) * .75), rotate var(--drop-duration) var(--drop-easing), scale var(--drop-duration) var(--drop-easing), translate var(--drop-duration) var(--drop-easing), width var(--drop-duration) var(--drop-easing);animation:none;scale:1}.sortable-drag>*{box-sizing:border-box;width:100%;height:100%;margin:0}.sortable-overlay{background:inherit;opacity:0;transition:display var(--overlay-transition-duration) allow-discrete, opacity var(--overlay-transition-duration) var(--transition-timing-function);z-index:1;justify-content:center;align-items:center;display:none}.sortable-drag .sortable-overlay{opacity:1;display:flex}@starting-style{.sortable-drag .sortable-overlay{opacity:0}}.sortable-drag--dropping .sortable-overlay{opacity:0}.sortable>.sortable-item--held{background:var(--placeholder-background);box-shadow:none;color:#0000;outline:var(--placeholder-border-width) dashed var(--placeholder-border-color);outline-offset:calc(var(--placeholder-border-width) * -1);transition:background-color var(--transition-duration) var(--transition-timing-function), color var(--transition-duration) var(--transition-timing-function);border-color:#0000}.sortable>.sortable-item--held>*{opacity:0;transition:opacity var(--transition-duration) var(--transition-timing-function)}.sortable>.sortable-item--revealing,.sortable>.sortable-item--revealing *{transition:none!important}:root.sortable-grabbing,:root.sortable-grabbing *{cursor:grabbing!important}@keyframes sortable-breathe{0%{scale:var(--drag-scale)}to{scale:calc(var(--drag-scale) * 1.025)}}@keyframes sortable-float{0%{translate:0}to{translate:0 -2px}}@keyframes sortable-heartbeat{0%,28%,70%,to{scale:var(--drag-scale)}14%,42%{scale:calc(var(--drag-scale) * 1.03)}}@keyframes sortable-jelly{0%{scale:calc(var(--drag-scale) * 1.02) calc(var(--drag-scale) * .98)}to{scale:calc(var(--drag-scale) * .98) calc(var(--drag-scale) * 1.02)}}@keyframes sortable-jiggle{0%,to{translate:0 .3px;rotate:-.7deg}25%{translate:.3px;rotate:.5deg}50%{translate:0 -.3px;rotate:.7deg}75%{translate:-.3px;rotate:-.5deg}}@keyframes sortable-orbit{0%,to{translate:1.2px}12.5%{translate:.85px .85px}25%{translate:0 1.2px}37.5%{translate:-.85px .85px}50%{translate:-1.2px}62.5%{translate:-.85px -.85px}75%{translate:0 -1.2px}87.5%{translate:.85px -.85px}}@keyframes sortable-pop{0%{scale:1}45%{scale:calc(var(--drag-scale) * 1.06)}75%{scale:calc(var(--drag-scale) * .98)}to{scale:var(--drag-scale)}}@keyframes sortable-settle{0%,to{rotate:0deg}15%{rotate:3deg}30%{rotate:-2deg}45%{rotate:1.2deg}60%{rotate:-.6deg}75%{rotate:.25deg}}@keyframes sortable-shimmy{0%{translate:-.6px}to{translate:.6px}}@keyframes sortable-sway{0%{rotate:-1.2deg}to{rotate:1.2deg}}@keyframes sortable-tremble{0%,to{translate:0;rotate:0deg}20%{translate:-.4px .3px;rotate:-.3deg}40%{translate:.5px -.2px;rotate:.2deg}60%{translate:-.2px -.4px;rotate:-.1deg}80%{translate:.3px .4px;rotate:.3deg}}@keyframes sortable-wiggle{0%{rotate:-.6deg}to{rotate:.6deg}}@media (prefers-reduced-motion:reduce){.sortable-drag{animation:none}}}
 /*$vite$:1*/

package/build/components/sticky-header/index.js

@@ -1,10 +1,10 @@
 import * as reactivity_u0 from '@esportsplus/reactivity';
 import * as template_u1 from '@esportsplus/template';
 import { component } from '@esportsplus/template';
-import scrollbar from '../../css-utilities/scrollbar/index.js';
+import scrollbar from '../../modifiers/scrollbar/index.js';
 import '../card/scss/index.scss';
 import './scss/index.scss';
-const template_1k9qcfo2 = template_u1.template(`<div class='card sticky-header'><div class='sticky-header-scroll --scrollbar' role='region' tabindex='0'><div aria-hidden='true' class='sticky-header-spacer'></div></div><header class='sticky-header-bar'><div aria-hidden='true' class='sticky-header-plate'></div><div aria-hidden='true' class='sticky-header-edge sticky-header-edge--shadow'></div><div aria-hidden='true' class='sticky-header-edge sticky-header-edge--fade'></div><div aria-hidden='true' class='sticky-header-edge sticky-header-edge--line'></div><div class='sticky-header-before'></div><div class='sticky-header-after'>`);
+const template_1k9qcfo2 = template_u1.template(`<div class='card sticky-header'><div class='sticky-header-scroll' role='region' tabindex='0'><div aria-hidden='true' class='sticky-header-spacer'></div></div><header class='sticky-header-bar'><div aria-hidden='true' class='sticky-header-plate'></div><div aria-hidden='true' class='sticky-header-edge sticky-header-edge--shadow'></div><div aria-hidden='true' class='sticky-header-edge sticky-header-edge--fade'></div><div aria-hidden='true' class='sticky-header-edge sticky-header-edge--line'></div><div class='sticky-header-before'></div><div class='sticky-header-after'>`);
 class ReactiveObject_1k9qcfo0 extends reactivity_u0.ReactiveObject {
     #progress = this[reactivity_u0.SIGNAL](0);
     constructor() {
@@ -40,7 +40,7 @@ function fallback(fade) {
     };
 }
 export default component(function ({ after, before, ...attributes }, content) {
-    let fade = scrollbar.fade(), id = `sticky-header-${++uid}`, legacy = typeof CSS === 'undefined' || CSS.supports('timeline-scope: none') ? null : fallback(fade);
+    let fade = scrollbar({ fade: true }), id = `sticky-header-${++uid}`, legacy = typeof CSS === 'undefined' || CSS.supports('timeline-scope: none') ? null : fallback(fade);
     return (() => {
         let root_1k9qcfo1 = template_1k9qcfo2(), element_1k9qcfo3 = root_1k9qcfo1.firstChild, element_1k9qcfo4 = element_1k9qcfo3.firstElementChild, element_1k9qcfo5 = element_1k9qcfo4.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling, element_1k9qcfo6 = element_1k9qcfo5.nextElementSibling;
         template_u1.slot(element_1k9qcfo4, content, 2);

package/build/components/sticky-header/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.sticky-header-bar{position:absolute;inset:0}.sticky-header-after,.sticky-header-before,.sticky-header-edge,.sticky-header-plate{position:absolute;inset:0 0 auto}.sticky-header-bar{border-radius:inherit;pointer-events:none}@property --sticky-header-progress{syntax:"<number>";inherits:true;initial-value:0}@property --sticky-header-range{syntax:"<length>";inherits:true;initial-value:0}.sticky-header{--background-default:var(--color-white-300);--border-color-default:var(--color-border-300);--border-radius:var(--border-radius-600);--border-width:0px;--box-shadow-default:0 0 0 var(--border-width-400) var(--border-color), 0 1px 2px oklch(from var(--color-black-300) l c h / .06), 0 4px 10px -8px oklch(from var(--color-black-300) l c h / .45);--compact-height:48px;--edge-shadow:0 6px 16px -10px oklch(from var(--color-black-300) l c h / .4);--expanded-height:68px;--focus-color:var(--color-blue-300);--gutter:var(--size-400);--max-height:320px;--padding-top:12px;--sticky-header-range:max(64px, var(--travel) * 3);--travel:calc(var(--expanded-height) - var(--compact-height))}.sticky-header-bar{--lifted:clamp(0, var(--sticky-header-progress) / .12, 1);--offset:calc(var(--travel) * var(--sticky-header-progress))}.sticky-header-after{--reveal:clamp(0, (var(--sticky-header-progress) - .55) / .35, 1)}.sticky-header{timeline-scope:--sticky-header}.sticky-header-bar{overflow:clip}.sticky-header-after{height:var(--compact-height);opacity:var(--reveal);padding:0 var(--gutter);translate:0 calc((1 - var(--reveal)) * 6px);align-items:center;display:flex}.sticky-header-after :is(a,button,input,label,select,textarea,[tabindex]),.sticky-header-before :is(a,button,input,label,select,textarea,[tabindex]){pointer-events:auto}.sticky-header-before{opacity:clamp(0, 1 - var(--sticky-header-progress) / .45, 1);padding:var(--padding-top) var(--gutter) 0;scale:calc(1 - .05 * var(--sticky-header-progress));transform-origin:0 0;translate:0 calc(var(--offset) * -1)}.sticky-header-edge{opacity:var(--lifted);translate:0 calc(var(--expanded-height) - var(--offset))}.sticky-header-edge--fade{background:linear-gradient(var(--background), transparent);height:20px}.sticky-header-edge--line{background:var(--border-color);height:1px}.sticky-header-edge--shadow{box-shadow:var(--edge-shadow);height:1px}.sticky-header-plate{background:var(--background);height:var(--expanded-height);translate:0 calc(var(--offset) * -1)}.sticky-header-scroll{border-radius:inherit;max-height:var(--max-height);scroll-padding-top:calc(var(--compact-height) + 10px);scroll-timeline:--sticky-header y;outline:none}.sticky-header-scroll:focus-visible{background:oklch(from var(--focus-color) l c h/.06);box-shadow:inset 0 0 0 1px var(--focus-color)}.sticky-header-spacer{height:var(--expanded-height)}@supports (timeline-scope:none){.sticky-header-after,.sticky-header-bar,.sticky-header-before{animation-duration:1ms;animation-fill-mode:both;animation-range:0 var(--sticky-header-range);animation-timing-function:linear;animation-timeline:--sticky-header}.sticky-header-after{animation-name:sticky-header-after}.sticky-header-bar{animation-name:sticky-header-progress}.sticky-header-before{animation-name:sticky-header-before}}@keyframes sticky-header-after{0%,50%{visibility:hidden}}@keyframes sticky-header-before{50%,to{visibility:hidden}}@keyframes sticky-header-progress{0%{--sticky-header-progress:0}to{--sticky-header-progress:1}}}
+@layer components{.sticky-header-bar{position:absolute;inset:0}.sticky-header-after,.sticky-header-before,.sticky-header-edge,.sticky-header-plate{position:absolute;inset:0 0 auto}.sticky-header-bar{border-radius:inherit;pointer-events:none}@property --sticky-header-progress{syntax:"<number>";inherits:true;initial-value:0}@property --sticky-header-range{syntax:"<length>";inherits:true;initial-value:0}.sticky-header{--background-default:var(--surface-background-default);--border-color-default:var(--surface-border-default);--border-radius:var(--border-radius-600);--border-width:0px;--box-shadow-default:0 0 0 var(--border-width-400) var(--border-color), 0 1px 2px oklch(from var(--surface-shadow-color) l c h / calc(alpha * .6)), 0 4px 10px -8px oklch(from var(--surface-shadow-color) l c h / calc(alpha * 5));--compact-height:48px;--edge-shadow:0 6px 16px -10px oklch(from var(--surface-shadow-color) l c h / calc(alpha * 4.4));--expanded-height:68px;--focus-color:var(--color-blue-300);--gutter:var(--size-400);--max-height:320px;--padding-top:12px;--sticky-header-range:max(64px, var(--travel) * 3);--travel:calc(var(--expanded-height) - var(--compact-height))}.sticky-header-after{--reveal:clamp(0, (var(--sticky-header-progress) - .55) / .35, 1)}.sticky-header-bar{--lifted:clamp(0, var(--sticky-header-progress) / .12, 1);--offset:calc(var(--travel) * var(--sticky-header-progress))}.sticky-header{timeline-scope:--sticky-header}.sticky-header-after{height:var(--compact-height);opacity:var(--reveal);padding:0 var(--gutter);translate:0 calc((1 - var(--reveal)) * 6px);align-items:center;display:flex}.sticky-header-after :is(a,button,input,label,select,textarea,[tabindex]),.sticky-header-before :is(a,button,input,label,select,textarea,[tabindex]){pointer-events:auto}.sticky-header-bar{overflow:clip}.sticky-header-before{opacity:clamp(0, 1 - var(--sticky-header-progress) / .45, 1);padding:var(--padding-top) var(--gutter) 0;scale:calc(1 - .05 * var(--sticky-header-progress));transform-origin:0 0;translate:0 calc(var(--offset) * -1)}.sticky-header-edge{opacity:var(--lifted);translate:0 calc(var(--expanded-height) - var(--offset))}.sticky-header-edge--fade{background:linear-gradient(var(--background), transparent);height:var(--size-500)}.sticky-header-edge--line{background:var(--border-color);height:1px}.sticky-header-edge--shadow{box-shadow:var(--edge-shadow);height:1px}.sticky-header-plate{background:var(--background);height:var(--expanded-height);translate:0 calc(var(--offset) * -1)}.sticky-header-scroll{border-radius:inherit;max-height:var(--max-height);scroll-padding-top:calc(var(--compact-height) + 10px);scroll-timeline:--sticky-header y;outline:none}.sticky-header-scroll:focus-visible{background:oklch(from var(--focus-color) l c h/.06);box-shadow:inset 0 0 0 1px var(--focus-color)}.sticky-header-spacer{height:var(--expanded-height)}@supports (timeline-scope:none){.sticky-header-after{animation-name:sticky-header-after}.sticky-header-after,.sticky-header-bar,.sticky-header-before{animation-duration:1ms;animation-fill-mode:both;animation-range:0 var(--sticky-header-range);animation-timing-function:linear;animation-timeline:--sticky-header}.sticky-header-bar{animation-name:sticky-header-progress}.sticky-header-before{animation-name:sticky-header-before}}@keyframes sticky-header-after{0%,50%{visibility:hidden}}@keyframes sticky-header-before{50%,to{visibility:hidden}}@keyframes sticky-header-progress{0%{--sticky-header-progress:0}to{--sticky-header-progress:1}}}
 /*$vite$:1*/

package/build/components/story/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.story-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.story-pause,.story-play{filter:blur(4px);opacity:0;transition:filter var(--icon-swap-duration) var(--icon-swap-timing-function), opacity var(--icon-swap-duration) var(--icon-swap-timing-function), scale var(--icon-swap-duration) var(--icon-swap-timing-function);scale:.25}@media (prefers-reduced-motion:reduce){.story-pause,.story-play{transition:none}}.story-toggle:not(.story-toggle--paused) .story-pause,.story-toggle--paused .story-play{filter:blur();opacity:1;scale:1}.story{--background:var(--color-grey-400);--bar-color:oklch(from var(--color-text-500) l c h / .15);--bar-height:3px;--box-shadow:0 0 0 var(--border-width-400) oklch(from var(--color-black-500) l c h / .06), 0 1px 2px oklch(from var(--color-black-500) l c h / .06), 0 6px 16px -6px oklch(from var(--color-black-500) l c h / .12);--color:var(--color-text-500);--dim-opacity:.6;--duration:4s;--fill-color:var(--color-text-500);--focus-ring-color:oklch(from var(--color-text-500) l c h / .38);--height:480px;--icon-swap-duration:.3s;--icon-swap-timing-function:var(--spring);--max-width:320px;--muted-color:var(--color-text-300);--radius:24px;--spring:linear(0, .0575, .1803, .3208, .4551, .5729, .6711, .7501, .8122, .8601, .8966, .924, .9445, .9596, .9708, .9789, .9848, .9891, .9922, .9944, .996, .9972, .998, .9986, 1)}.story-slide.frame{--opacity:1}.story{background:var(--background);border-radius:var(--radius);box-shadow:var(--box-shadow);color:var(--color);height:var(--height);touch-action:pan-y;-webkit-user-select:none;user-select:none;width:min(var(--max-width), 100%);outline:none;flex-direction:column;display:flex;position:relative;overflow:hidden}.story:focus-visible{outline:2px solid var(--focus-ring-color);outline-offset:2px}.story--paused{--play-state:paused}.story-bar{background:var(--bar-color);height:var(--bar-height);border-radius:999px;flex:1;overflow:hidden}.story-bar--done{--scale:1}.story-bar.--active{--fill-animation:story-fill var(--duration) linear forwards var(--play-state,running)}.story-bars{gap:4px;padding:12px 12px 0;display:flex}.story-count{color:var(--muted-color);font-variant-numeric:tabular-nums;font-size:12px}.story-fill{animation:var(--fill-animation,none);background:var(--fill-color);height:100%;transform:scaleX(var(--scale,0));transform-origin:0;border-radius:999px;display:block}.story-header{justify-content:space-between;align-items:center;height:44px;padding:0 16px;display:flex}.story-pause,.story-play{grid-area:1/1;width:16px;height:16px}.story-slide{min-height:0;overflow:hidden}.story-slide--dragging.frame{transition:none}.story-sr{margin:0}.story-toggle{color:var(--muted-color);cursor:pointer;background:0 0;border:0;border-radius:999px;outline:none;place-items:center;width:40px;height:40px;margin-right:-8px;padding:0;transition:color .15s ease-out,scale .15s ease-out;display:grid}.story-toggle:active{scale:.96}.story-toggle:focus-visible{outline:2px solid var(--focus-ring-color)}.story-toggle:hover{color:var(--color)}.story-track{z-index:1;flex:1;min-height:0;transition:opacity .2s ease-out;position:relative}.story-track--dimmed{opacity:var(--dim-opacity)}.story-zone{background:0 0;border:0;outline:none;flex:1;padding:0}.story-zone:last-child{flex:2}.story-zones{display:flex;position:absolute;inset:60px 0 0}@media (prefers-reduced-motion:reduce){.story-toggle{transition:color .15s ease-out}}@keyframes story-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}}
+@layer components{.story-toggle{--color:var(--color-default);--color-active:var(--color-default);--color-default:var(--color-text-400);--color-hover:var(--color-default);--color-pressed:var(--color-default)}.--active.story-toggle{--color:var(--color-active)}.story-toggle:not(.--active):hover{--color:var(--color-hover)}.story-toggle:not(.--active):active{--color:var(--color-pressed)}.story-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.story-pause,.story-play{filter:blur(var(--blur-400));opacity:0;transition:filter var(--icon-swap-duration) var(--icon-swap-timing-function), opacity var(--icon-swap-duration) var(--icon-swap-timing-function), scale var(--icon-swap-duration) var(--icon-swap-timing-function);scale:.25}@media (prefers-reduced-motion:reduce){.story-pause,.story-play{transition:none}}.story-toggle:not(.story-toggle--paused) .story-pause,.story-toggle--paused .story-play{filter:blur();opacity:1;scale:1}.story{--surface-shadow-weight:6;--surface-background-active:light-dark(oklch(from var(--surface-background-default) calc(l + .01) c h),oklch(from var(--surface-background-default) calc(l + .02) c h));--surface-background-default:light-dark(oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) calc(c * clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) / max(l, .01)) h));--surface-background-hover:light-dark(oklch(from var(--surface-background-default) calc(l + .005) c h),oklch(from var(--surface-background-default) calc(l + .01) c h));--surface-background-pressed:light-dark(oklch(from var(--surface-background-default) calc(l - .02) c h),oklch(from var(--surface-background-default) calc(l - .04) c h));--surface-border-active:light-dark(oklch(from var(--surface-background-active) max(0, l - .04) c h),oklch(from var(--surface-background-active) min(1, l + .06) c h));--surface-border-default:light-dark(oklch(from var(--surface-background-default) max(0, l - .04) c h),oklch(from var(--surface-background-default) min(1, l + .06) c h));--surface-border-hover:light-dark(oklch(from var(--surface-background-hover) max(0, l - .04) c h),oklch(from var(--surface-background-hover) min(1, l + .06) c h));--surface-border-pressed:light-dark(oklch(from var(--surface-background-pressed) max(0, l - .04) c h),oklch(from var(--surface-background-pressed) min(1, l + .06) c h));--surface-shadow-active:var(--surface-shadow-hover);--surface-shadow-color:light-dark(oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .08),oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-cast:light-dark(oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .08),oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-default:0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 0, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 5 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 1, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 9 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 25 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -7 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, var(--surface-shadow-weight) - 0, 1) + .05 * clamp(0, var(--surface-shadow-weight) - 2, 1) + .15 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -8 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -10 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -.1 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10));--surface-shadow-hover:0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 5 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 1, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 9 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 25 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -7 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + .15 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -8 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -.1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10));--surface-shadow-pressed:0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 5 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 1, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 9 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 25 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -7 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + .15 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -8 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -.1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10))}@container style(--surface-level:-3){.story{--surface-level:-2;--surface-shadow-weight:0}}@container style(--surface-level:-2){.story{--surface-level:-1;--surface-shadow-weight:0}}@container style(--surface-level:-1){.story{--surface-level:0;--surface-shadow-weight:0}}@container style(--surface-level:0){.story{--surface-level:1;--surface-shadow-weight:1}}@container style(--surface-level:1){.story{--surface-level:2;--surface-shadow-weight:2}}@container style(--surface-level:2){.story{--surface-level:3;--surface-shadow-weight:3}}@container style(--surface-level:3){.story{--surface-level:4;--surface-shadow-weight:4}}@container style(--surface-level:4){.story{--surface-level:5;--surface-shadow-weight:5}}@container style(--surface-level:5){.story{--surface-level:6;--surface-shadow-weight:6}}.story{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--active.story{--background:var(--background-active)}.story:not(.--active):hover{--background:var(--background-hover)}.story:not(.--active):active{--background:var(--background-pressed)}.story{--box-shadow:var(--box-shadow-default);--box-shadow-active:var(--box-shadow-default);--box-shadow-default:none;--box-shadow-hover:var(--box-shadow-default);--box-shadow-pressed:var(--box-shadow-default)}.--active.story{--box-shadow:var(--box-shadow-active)}.story:not(.--active):hover{--box-shadow:var(--box-shadow-hover)}.story:not(.--active):active{--box-shadow:var(--box-shadow-pressed)}.story{--background-default:var(--surface-background-default);--bar-color:oklch(from var(--color-primary-500) l c h / .15);--bar-height:3px;--box-shadow-default:var(--surface-shadow-default);--color:var(--color-text-500);--dim-opacity:.6;--duration:4s;--fill-color:var(--color-primary-500);--focus-ring-color:var(--surface-border-pressed);--height:480px;--icon-swap-duration:var(--duration-moderate);--icon-swap-timing-function:var(--spring);--max-width:320px;--muted-color:var(--color-text-300);--radius:24px;--spring:linear(0, .0575, .1803, .3208, .4551, .5729, .6711, .7501, .8122, .8601, .8966, .924, .9445, .9596, .9708, .9789, .9848, .9891, .9922, .9944, .996, .9972, .998, .9986, 1);--toggle-color-hover:var(--color)}.story-slide.frame{--opacity:1}.story{background:var(--background);border-radius:var(--radius);box-shadow:var(--box-shadow);color:var(--color);height:var(--height);touch-action:pan-y;-webkit-user-select:none;user-select:none;width:min(var(--max-width), 100%);outline:none;flex-direction:column;display:flex;position:relative;overflow:hidden}.story--paused{--play-state:paused}.story-bar{background:var(--bar-color);height:var(--bar-height);border-radius:999px;flex:1;overflow:hidden}.story-bar--done{--scale:1}.story-bar.--active{--fill-animation:story-fill var(--duration) linear forwards var(--play-state,running)}.story-bars{gap:calc(var(--size-100) / 2);padding:12px 12px 0;display:flex}.story-count{color:var(--muted-color);font-size:var(--font-size-300);font-variant-numeric:tabular-nums}.story-fill{animation:var(--fill-animation,none);background:var(--fill-color);height:100%;transform:scaleX(var(--scale,0));transform-origin:0;border-radius:999px;display:block}.story-header{height:44px;padding:0 var(--size-400);justify-content:space-between;align-items:center;display:flex}.story-pause,.story-play{height:var(--size-400);width:var(--size-400);grid-area:1/1}.story-slide{min-height:0;overflow:hidden}.story-slide--dragging.frame{transition:none}.story-sr{margin:0}.story-toggle{--color-default:var(--muted-color);--color-hover:var(--toggle-color-hover);--color-pressed:var(--color-hover);color:var(--color);cursor:pointer;height:40px;margin-right:calc(var(--size-100) * -1);transition:color var(--duration-fast) var(--easing-spring);background:0 0;border:0;border-radius:999px;outline:none;place-items:center;width:40px;padding:0;display:grid}.story-toggle:focus-visible{outline:2px solid var(--focus-ring-color)}.story-track{min-height:0;transition:opacity var(--duration-fast) var(--easing-spring);z-index:1;flex:1;position:relative}.story-track--dimmed{opacity:var(--dim-opacity)}.story-zone{background:0 0;border:0;outline:none;flex:1;padding:0}.story-zone:last-child{flex:2}.story-zones{display:flex;position:absolute;inset:60px 0 0}.story:focus-visible{outline:2px solid var(--focus-ring-color);outline-offset:calc(var(--size-100) / 4)}@media (prefers-reduced-motion:reduce){.story-toggle{transition:color var(--duration-fast) var(--easing-spring)}}@keyframes story-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}}
 /*$vite$:1*/