@mkbabb/glass-ui 6.0.0 → 7.0.0

package/dist/slider-DzqeQmMu.js

@@ -0,0 +1,162 @@
+import { t as e } from "./useMotionAxis-D-rtIhca.js";
+import { t } from "./useTouchGate-B4mzQcHJ.js";
+import { t as n } from "./useDragVelocity-6ONX0sr0.js";
+import { t as r } from "./_plugin-vue_export-helper-B3ysoDQm.js";
+import { i } from "./dockContext-BUTlGRNJ.js";
+import { n as a } from "./valueDomain-SbVzoHMH.js";
+import { Fragment as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createVNode as d, defineComponent as f, mergeProps as p, normalizeStyle as m, onBeforeUnmount as h, onMounted as g, openBlock as _, renderList as v, unref as y, useAttrs as b, useTemplateRef as x, withCtx as S } from "vue";
+import { SliderRange as C, SliderRoot as w, SliderThumb as T, SliderTrack as E, useForwardPropsEmits as D } from "reka-ui";
+//#region src/components/dock/composables/useDockHold.ts
+function O(e, t = {}) {
+	let n = i(), r = t.enabled ?? (() => !0), a = !1;
+	function o() {
+		!r() || a || !n || (n.keepOpen(), a = !0);
+	}
+	function s() {
+		!a || !n || (n.release(), a = !1);
+	}
+	function c() {
+		s(), !(typeof window > "u") && (window.removeEventListener("pointerup", c), window.removeEventListener("pointercancel", c), window.removeEventListener("blur", c));
+	}
+	function l() {
+		o(), !(typeof window > "u") && (window.removeEventListener("pointerup", c), window.removeEventListener("pointercancel", c), window.removeEventListener("blur", c), window.addEventListener("pointerup", c), window.addEventListener("pointercancel", c), window.addEventListener("blur", c));
+	}
+	let u = null;
+	return g(() => {
+		u = e(), u && (u.addEventListener("pointerdown", l), u.addEventListener("touchstart", l, { passive: !0 }));
+	}), h(() => {
+		u && (u.removeEventListener("pointerdown", l), u.removeEventListener("touchstart", l)), typeof window < "u" && (window.removeEventListener("pointerup", c), window.removeEventListener("pointercancel", c), window.removeEventListener("blur", c)), s();
+	}), { isHeld: n?.held };
+}
+//#endregion
+//#region src/components/slider/Slider.vue?vue&type=script&setup=true&lang.ts
+var k = {
+	key: 0,
+	class: "slider-marks",
+	"aria-hidden": "true"
+}, A = /*#__PURE__*/ r(/* @__PURE__ */ f({
+	__name: "Slider",
+	props: {
+		modelValue: {},
+		defaultValue: {},
+		disabled: { type: Boolean },
+		orientation: {},
+		dir: {},
+		inverted: { type: Boolean },
+		min: {},
+		max: {},
+		step: {},
+		minStepsBetweenThumbs: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		variant: { default: "standard" },
+		size: { default: "md" },
+		marks: {},
+		invalid: {
+			type: Boolean,
+			default: !1
+		},
+		keepDockOpen: {
+			type: Boolean,
+			default: !0
+		},
+		motion: {},
+		name: {},
+		required: { type: Boolean }
+	},
+	emits: ["update:modelValue", "valueCommit"],
+	setup(r, { emit: f }) {
+		let A = r, j = f, M = s(() => A.variant), N = s(() => A.size), P = s(() => A.keepDockOpen), F = s(() => a(A.marks, A.min ?? 0, A.max ?? 100)), I = D(s(() => {
+			let { class: e, variant: t, size: n, marks: r, invalid: i, keepDockOpen: a, motion: o, ...s } = A;
+			return {
+				...s,
+				thumbAlignment: "contain"
+			};
+		}), j), L = i(), R = x("sliderRootRef");
+		function z() {
+			let e = R.value;
+			return e ? e instanceof HTMLElement ? e : e.$el ?? null : null;
+		}
+		O(z, { enabled: () => P.value });
+		let B = e(() => A.motion);
+		n({
+			host: () => B.armed.value ? z() : null,
+			axis: () => A.orientation === "vertical" ? "y" : "x"
+		});
+		let V = t();
+		function H(e) {
+			let t = z(), n = e.touches[0];
+			!t || !n || V.handleTouchStart(t, n.clientY) || (e.preventDefault(), e.stopPropagation());
+		}
+		function U(e) {
+			V.handleScrollCheck(e);
+		}
+		function W() {
+			V.handleTouchEnd();
+		}
+		g(() => {
+			let e = z();
+			e && (e.addEventListener("touchstart", H, { passive: !1 }), e.addEventListener("touchmove", U, { passive: !0 }), e.addEventListener("touchend", W, { passive: !0 }));
+		}), h(() => {
+			let e = z();
+			e && (e.removeEventListener("touchstart", H), e.removeEventListener("touchmove", U), e.removeEventListener("touchend", W));
+		});
+		let G = s(() => L?.held.value === !0), K = s(() => V.isActive.value);
+		return b(), g(() => {}), (e, t) => (_(), c(y(w), p({
+			"data-slot": "slider",
+			ref_key: "sliderRootRef",
+			ref: R,
+			class: ["glass-slider", A.class],
+			"data-control-target": "",
+			"data-variant": M.value,
+			"data-size": N.value,
+			"data-invalid": A.invalid || void 0,
+			"data-held": G.value || void 0,
+			"data-touch-active": K.value || void 0,
+			"data-inverted": A.inverted || void 0,
+			"data-motion": y(B).dataMotion.value,
+			style: y(B).hostStyle.value
+		}, y(I)), {
+			default: S(({ modelValue: t }) => [d(y(E), { class: "slider-track" }, {
+				default: S(() => [F.value.length ? (_(), u("span", k, [(_(!0), u(o, null, v(F.value, (e) => (_(), u("span", {
+					key: e.value,
+					class: "slider-mark",
+					style: m({ "--value-mark-position": `${e.position * 100}%` })
+				}, null, 4))), 128))])) : l("", !0), d(y(C), { class: "slider-range glass-liquid-fill" })]),
+				_: 1
+			}), (_(!0), u(o, null, v(t, (t, n) => (_(), c(y(T), {
+				key: n,
+				"aria-label": e.$attrs["aria-label"] ?? void 0,
+				"aria-labelledby": e.$attrs["aria-labelledby"] ?? void 0,
+				"aria-describedby": e.$attrs["aria-describedby"] ?? void 0,
+				"aria-errormessage": e.$attrs["aria-errormessage"] ?? void 0,
+				"aria-invalid": A.invalid || void 0,
+				class: "slider-thumb glass-specular-track"
+			}, null, 8, [
+				"aria-label",
+				"aria-labelledby",
+				"aria-describedby",
+				"aria-errormessage",
+				"aria-invalid"
+			]))), 128))]),
+			_: 1
+		}, 16, [
+			"class",
+			"data-variant",
+			"data-size",
+			"data-invalid",
+			"data-held",
+			"data-touch-active",
+			"data-inverted",
+			"data-motion",
+			"style"
+		]));
+	}
+}), [["__scopeId", "data-v-4f4cab01"]]);
+//#endregion
+export { A as t };

package/dist/slider.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "./slider-Cc_qw6GA.js";
-export { e as Slider, t as sliderVariants };
+import { t as e } from "./slider-DzqeQmMu.js";
+export { e as Slider };

package/dist/sortable-list.js

@@ -1,5 +1,5 @@
-import { t as e } from "./_plugin-vue_export-helper-C1je1s0u.js";
-import { n as t } from "./createContext-FU0n5MGK.js";
+import { n as e } from "./createContext-BhkE9mLH.js";
+import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { Fragment as n, computed as r, createElementBlock as i, createElementVNode as a, defineComponent as o, mergeProps as s, nextTick as c, onScopeDispose as l, openBlock as u, renderSlot as d, shallowRef as f, toDisplayString as p, toRef as m, unref as h, useAttrs as g } from "vue";
 //#region src/components/sortable-list/composables/dropResolver.ts
 var _ = /* @__PURE__ */ new Set();
@@ -27,7 +27,7 @@ function y(e, t, n) {
 //#endregion
 //#region src/components/sortable-list/composables/touchGate.ts
 function b(e, t) {
-	return t === null ? !0 : e instanceof Element ? e.closest(t) !== null : !1;
+	return t === null || e instanceof Element && e.closest(t) !== null;
 }
 function x(e, t) {
 	if (e && "setPointerCapture" in e) try {
@@ -316,7 +316,7 @@ function N(e) {
 }
 //#endregion
 //#region src/components/sortable-list/context.ts
-var P = t("glass-ui:sortable-list", "[glass-ui] <SortableItem> must be used inside <SortableList>"), F = P.provide, I = P.use, L = t("glass-ui:sortable-item", "[glass-ui] <SortableHandle> must be used inside <SortableItem>"), R = L.provide, z = L.use, B = ["aria-label"], V = {
+var P = e("glass-ui:sortable-list", "[glass-ui] <SortableItem> must be used inside <SortableList>"), F = P.provide, I = P.use, L = e("glass-ui:sortable-item", "[glass-ui] <SortableHandle> must be used inside <SortableItem>"), R = L.provide, z = L.use, B = ["aria-label"], V = {
 	class: "sr-only",
 	"aria-live": "polite",
 	"aria-atomic": "true"
@@ -356,7 +356,7 @@ var P = t("glass-ui:sortable-list", "[glass-ui] <SortableItem> must be used insi
 			dragId: h(f).dragId.value
 		})], 16, B), a("span", V, p(h(f).announcement.value), 1)], 64));
 	}
-}), U = ["aria-disabled", "data-disabled"], W = /* @__PURE__ */ e(/* @__PURE__ */ o({
+}), U = ["aria-disabled", "data-disabled"], W = /*#__PURE__*/ t(/* @__PURE__ */ o({
 	__name: "SortableItem",
 	props: {
 		id: {},
@@ -385,11 +385,11 @@ var P = t("glass-ui:sortable-list", "[glass-ui] <SortableItem> must be used insi
 			onKeydown: n[1] ||= (...e) => h(a).onKeydown && h(a).onKeydown(...e)
 		}), [d(t.$slots, "default", { isBeingDragged: c.value }, void 0, !0)], 16, U));
 	}
-}), [["__scopeId", "data-v-c8dee7e3"]]), G = [
+}), [["__scopeId", "data-v-a2b888a8"]]), G = [
 	"type",
 	"disabled",
 	"aria-label"
-], K = /* @__PURE__ */ e(/* @__PURE__ */ o({
+], K = /*#__PURE__*/ t(/* @__PURE__ */ o({
 	inheritAttrs: !1,
 	__name: "SortableHandle",
 	props: { type: { default: "button" } },
@@ -399,10 +399,11 @@ var P = t("glass-ui:sortable-list", "[glass-ui] <SortableItem> must be used insi
 			type: e.type,
 			class: "sortable-handle",
 			"data-sortable-handle": "",
+			"data-control-target": "",
 			disabled: h(n).binding.disabled.value,
 			"aria-label": a.value
 		}), [d(r.$slots, "default", {}, void 0, !0)], 16, G));
 	}
-}), [["__scopeId", "data-v-fd52a6c0"]]);
+}), [["__scopeId", "data-v-4cc4d202"]]);
 //#endregion
 export { K as SortableHandle, W as SortableItem, H as SortableList };

package/dist/springPresets-rCii5KqX.js

@@ -0,0 +1,52 @@
+//#region src/composables/motion/spring/springPresets.ts
+var e = [
+	{
+		name: "smooth",
+		response: .58,
+		dampingFraction: .8,
+		comment: "Patient entrances, fades, and scale-ins with a quiet sense of weight."
+	},
+	{
+		name: "snappy",
+		response: .48,
+		dampingFraction: .74,
+		comment: "Quick, weighty control movement for indicators, progress, and reveals."
+	},
+	{
+		name: "bouncy",
+		response: .6,
+		dampingFraction: .6,
+		comment: "Playful emphasis for dialogs, success moments, and the completion seal."
+	},
+	{
+		name: "gentle",
+		response: .82,
+		dampingFraction: 1,
+		comment: "A calm, patient arrival with no overshoot."
+	},
+	{
+		name: "dock",
+		response: .3,
+		dampingFraction: .82,
+		comment: "A brisk liquid morph for the dock and its coordinated contents."
+	},
+	{
+		name: "press",
+		response: .2,
+		dampingFraction: .8,
+		comment: "A responsive press with a subtle rebound and continuous interruption."
+	},
+	{
+		name: "transient",
+		response: .62,
+		dampingFraction: .9,
+		comment: "A centered materialize bloom for brief surfaces such as Toast."
+	}
+];
+function t(t) {
+	let n = e.find((e) => e.name === t);
+	if (!n) throw Error(`Unknown spring preset: ${t}`);
+	return n;
+}
+//#endregion
+export { t as n, e as t };

package/dist/status-dot.js

@@ -1,19 +1,20 @@
-import { t as e } from "./class-names-5jotTFzp.js";
-import { computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeClass as o, normalizeStyle as s, openBlock as c, toDisplayString as l, unref as u } from "vue";
+import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
+import { t } from "./FeedbackMark-DZq5001h.js";
+import { createElementBlock as n, createVNode as r, defineComponent as i, mergeProps as a, openBlock as o } from "vue";
 //#region src/components/status-dot/StatusDot.vue?vue&type=script&setup=true&lang.ts
-var d = ["role"], f = ["data-status"], p = {
-	key: 0,
-	class: "text-xs leading-none text-muted-foreground"
-}, m = /* @__PURE__ */ a({
+var s = [
+	"data-state",
+	"data-size",
+	"data-identity",
+	"role",
+	"aria-label",
+	"aria-hidden"
+], c = /*#__PURE__*/ e(/* @__PURE__ */ i({
 	name: "StatusDot",
+	inheritAttrs: !1,
 	__name: "StatusDot",
 	props: {
-		variant: { default: "active" },
-		color: {},
-		pulse: {
-			type: Boolean,
-			default: !1
-		},
+		state: { default: "online" },
 		size: { default: "sm" },
 		label: {},
 		class: { type: [
@@ -24,36 +25,18 @@ var d = ["role"], f = ["data-status"], p = {
 			Array
 		] }
 	},
-	setup(a) {
-		let m = a, h = t(() => {
-			switch (m.size) {
-				case "xs": return "h-1.5 w-1.5";
-				case "md": return "h-2.5 w-2.5";
-				default: return "h-2 w-2";
-			}
-		}), g = t(() => m.variant === "custom" ? m.color ?? "var(--muted-foreground)" : {
-			active: "var(--color-status-active, hsl(142 71% 45%))",
-			paused: "var(--color-status-paused, hsl(48 96% 53%))",
-			idle: "var(--color-status-idle, var(--muted-foreground))",
-			error: "var(--color-status-error, var(--destructive))"
-		}[m.variant]), _ = t(() => ({ backgroundColor: g.value })), v = t(() => ({ backgroundColor: g.value }));
-		return (t, g) => (c(), r("span", {
-			role: t.$attrs["aria-label"] == null ? void 0 : "img",
-			class: o(u(e)("inline-flex items-center gap-1.5 align-middle", m.class))
-		}, [i("span", {
-			class: o(["status-dot__dot relative inline-flex shrink-0 rounded-pill", h.value]),
-			"data-status": a.variant,
-			style: s(_.value)
-		}, [a.pulse ? (c(), r("span", {
-			key: 0,
-			"aria-hidden": "true",
-			class: "status-dot__pulse absolute inset-0 rounded-pill opacity-60 motion-safe:animate-ping",
-			style: s(v.value)
-		}, null, 4)) : n("", !0), i("span", {
-			class: "status-dot__fill relative inline-block h-full w-full rounded-pill",
-			style: s(_.value)
-		}, null, 4)], 14, f), a.label ? (c(), r("span", p, l(a.label), 1)) : n("", !0)], 10, d));
+	setup(e) {
+		let i = e;
+		return (c, l) => (o(), n("span", a(c.$attrs, {
+			class: ["status-dot", i.class],
+			"data-state": e.state,
+			"data-size": e.size,
+			"data-identity": e.label ? "labelled" : "decorative",
+			role: e.label ? "img" : void 0,
+			"aria-label": e.label,
+			"aria-hidden": e.label ? void 0 : "true"
+		}), [r(t, { state: e.state }, null, 8, ["state"])], 16, s));
 	}
-});
+}), [["__scopeId", "data-v-046ecd58"]]);
 //#endregion
-export { m as StatusDot };
+export { c as StatusDot };

package/dist/styles/accessibility.css

@@ -1 +1 @@
-@import "./glass/a11y-fallback.css"; @import "./utilities/a11y-overrides.css"; @media (prefers-contrast: more) { :is( [aria-current]:not([aria-current="false"]), [aria-selected="true"], [aria-pressed="true"], [aria-checked="true"], [data-state="checked"], [data-state="on"] ) { border-color: currentColor !important; border-style: solid !important; border-width: 2px !important; } :is([aria-invalid="true"], :user-invalid) { border-color: var(--destructive) !important; border-style: solid !important; border-width: 2px !important; } } @media (forced-colors: active) { :is( [aria-current]:not([aria-current="false"]), [aria-selected="true"], [aria-pressed="true"], [aria-checked="true"], [data-state="checked"], [data-state="on"] ) { border-color: Highlight !important; border-style: solid !important; border-width: 2px !important; } :is([aria-invalid="true"], :user-invalid) { border-color: Mark !important; border-style: solid !important; border-width: 2px !important; } }
+@import "./glass/a11y-fallback.css"; @import "./utilities/responsive.css"; @import "./utilities/a11y-overrides.css"; @media (prefers-contrast: more) { :is( [aria-current]:not([aria-current="false"]), [aria-selected="true"], [aria-pressed="true"], [aria-checked="true"], [data-state="checked"], [data-state="on"] ) { border-color: currentColor !important; border-style: solid !important; border-width: 2px !important; } :is([aria-invalid="true"], :user-invalid) { border-color: var(--destructive) !important; border-style: solid !important; border-width: 2px !important; } } @media (forced-colors: active) { :is( [aria-current]:not([aria-current="false"]), [aria-selected="true"], [aria-pressed="true"], [aria-checked="true"], [data-state="checked"], [data-state="on"] ) { border-color: Highlight !important; border-style: solid !important; border-width: 2px !important; } :is([aria-invalid="true"], :user-invalid) { border-color: Mark !important; border-style: solid !important; border-width: 2px !important; } }

package/dist/styles/animations.css

@@ -1 +1 @@
-@keyframes collapsible-open { from { height: 0; opacity: 0; } to { height: var(--reka-collapsible-content-height); opacity: 1; } } @keyframes collapsible-close { from { height: var(--reka-collapsible-content-height); opacity: 1; } to { height: 0; opacity: 0; } } @keyframes tooltip-in { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: scale(1); } } @keyframes fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } } @keyframes scale-in { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } } @keyframes slide-up { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } } @keyframes dock-in { from { opacity: 0; transform: translateY(14px) scale(0.96); } to { opacity: 1; transform: translateY(0) scale(1); } } @keyframes shimmer-sweep { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } } @keyframes shimmer { 0% { background-position: 250% 0; } 100% { background-position: -250% 0; } } @keyframes shake { 0%, 100% { transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { transform: translateX(-4px); } 20%, 40%, 60%, 80% { transform: translateX(4px); } } @keyframes metal-shimmer-sweep { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes pulse-dot-bounce { 0%, 80%, 100% { opacity: 0.35; transform: scale(0.8); } 40% { opacity: 1; transform: scale(1.2); } } @keyframes pulse-ring-spin { to { transform: rotate(360deg); } } @keyframes typewriter-blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } } @keyframes ambient-pulse { 0%, 100% { --pulse-aura-breath-scale: var(--animate-ambient-pulse-scale-min, 1); opacity: var(--pulse-aura-breath-min, 0.28); } 50% { --pulse-aura-breath-scale: var(--animate-ambient-pulse-scale-max, 1.15); opacity: var(--pulse-aura-breath-max, 0.42); } } @keyframes scrim-breath { 0%, 100% { opacity: var(--scrim-opacity-min, 0.92); } 50% { opacity: var(--scrim-opacity-max, 0.98); } } @media (prefers-reduced-motion: reduce) { @keyframes scrim-breath { 0%, 100% { opacity: var(--scrim-opacity-min, 0.92); } } } [data-scrim-animation] { animation: var(--scrim-animation, none); } @media (prefers-reduced-motion: reduce) { [data-scrim-animation] { animation: none; } } @keyframes glass-reveal-out { from { scale: 1 1; opacity: 1; filter: blur(0); } to { scale: calc(var(--glass-reveal-enter-scale, 0.88) * var(--lq-stretch-x, 1.06)) calc(var(--glass-reveal-enter-scale, 0.88) * var(--lq-stretch-y, 0.945)); opacity: 0; filter: blur(var(--glass-reveal-blur, 4px)); } } @keyframes glass-reveal-out-reduced { from { opacity: 1; } to { opacity: 0; } } @supports (overlay: auto) { .glass-top-layer[popover], dialog.glass-top-layer { opacity: 0; scale: var(--top-layer-enter-scale, 0.96); filter: blur(var(--top-layer-enter-blur, 4px)); transition-property: opacity, scale, filter, display, overlay; transition-duration: var(--enter-overlay-clock), var(--enter-overlay-clock), var(--enter-overlay-clock), var(--enter-overlay-clock), var(--enter-overlay-clock); transition-timing-function: var(--enter-overlay-spring), var(--enter-overlay-spring), var(--ease-out), linear, linear; transition-behavior: allow-discrete; } .glass-top-layer[popover]:popover-open, dialog.glass-top-layer[open] { opacity: 1; scale: 1; filter: blur(0); @starting-style { opacity: 0; scale: var(--top-layer-enter-scale, 0.96); filter: blur(var(--top-layer-enter-blur, 4px)); } } dialog.glass-top-layer::backdrop { background-color: color-mix(in srgb, var(--background) 0%, transparent); -webkit-backdrop-filter: blur(var(--top-layer-backdrop-blur, 8px)); backdrop-filter: blur(var(--top-layer-backdrop-blur, 8px)); transition: display var(--duration-normal) allow-discrete, overlay var(--duration-normal) allow-discrete, background-color var(--duration-normal) var(--ease-standard); } dialog.glass-top-layer[open]::backdrop { background-color: color-mix( in srgb, var(--background) calc(var(--top-layer-backdrop-dim, 0.5) * 100%), transparent ); transition: display var(--top-layer-backdrop-in, 0.15s) allow-discrete, overlay var(--top-layer-backdrop-in, 0.15s) allow-discrete, background-color var(--top-layer-backdrop-in, 0.15s) var(--ease-out); @starting-style { background-color: color-mix(in srgb, var(--background) 0%, transparent); } } } @media (prefers-reduced-motion: reduce) { .glass-top-layer[popover], dialog.glass-top-layer { scale: none; transition-duration: var(--duration-fast); } }
+@keyframes tooltip-in { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: scale(1); } } @keyframes fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } } @keyframes scale-in { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } } @keyframes slide-up { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } } @keyframes dock-in { from { opacity: 0; transform: translateY(14px) scale(0.96); } to { opacity: 1; transform: translateY(0) scale(1); } } @keyframes shimmer-sweep { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } } @keyframes shimmer { 0% { background-position: 250% 0; } 100% { background-position: -250% 0; } } @keyframes shake { 0%, 100% { transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { transform: translateX(-4px); } 20%, 40%, 60%, 80% { transform: translateX(4px); } } @keyframes metal-shimmer-sweep { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes typewriter-blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } } @keyframes glass-reveal-out { from { scale: 1 1; opacity: 1; filter: blur(0); } to { scale: calc(var(--glass-reveal-enter-scale, 0.94) * var(--lq-stretch-x, 1.06)) calc(var(--glass-reveal-enter-scale, 0.94) * var(--lq-stretch-y, 0.945)); opacity: 0; filter: blur(var(--glass-reveal-blur, 4px)); } } @keyframes glass-reveal-out-reduced { from { opacity: 1; } to { opacity: 0; } } @supports (overlay: auto) { .glass-top-layer[popover], dialog.glass-top-layer { opacity: 0; scale: var(--top-layer-enter-scale, 0.96); filter: blur(var(--top-layer-enter-blur, 4px)); transition-property: opacity, scale, filter, display, overlay; transition-duration: var(--enter-overlay-clock), var(--enter-overlay-clock), var(--enter-overlay-clock), var(--enter-overlay-clock), var(--enter-overlay-clock); transition-timing-function: var(--enter-overlay-spring), var(--enter-overlay-spring), var(--ease-out), linear, linear; transition-behavior: allow-discrete; } .glass-top-layer[popover]:popover-open, dialog.glass-top-layer[open] { opacity: 1; scale: 1; filter: blur(0); @starting-style { opacity: 0; scale: var(--top-layer-enter-scale, 0.96); filter: blur(var(--top-layer-enter-blur, 4px)); } } dialog.glass-top-layer::backdrop { background-color: color-mix(in srgb, var(--background) 0%, transparent); -webkit-backdrop-filter: blur(var(--top-layer-backdrop-blur, 7px)); backdrop-filter: blur(var(--top-layer-backdrop-blur, 7px)); transition: display var(--duration-normal) allow-discrete, overlay var(--duration-normal) allow-discrete, background-color var(--duration-normal) var(--ease-standard); } dialog.glass-top-layer[open]::backdrop { background-color: color-mix( in srgb, var(--background) calc(var(--top-layer-backdrop-dim, 0.5) * 100%), transparent ); transition: display var(--top-layer-backdrop-in, 0.15s) allow-discrete, overlay var(--top-layer-backdrop-in, 0.15s) allow-discrete, background-color var(--top-layer-backdrop-in, 0.15s) var(--ease-out); @starting-style { background-color: color-mix(in srgb, var(--background) 0%, transparent); } } } @media (prefers-reduced-motion: reduce) { .glass-top-layer[popover], dialog.glass-top-layer { scale: none; transition-duration: var(--duration-fast); } }

package/dist/styles/components.css

@@ -1 +1 @@
-:root { --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; --animate-spin: spin 1s linear infinite; --color-white: #fff; --container-lg: 32rem; --default-transition-duration: var(--duration-fast, 150ms); --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); --font-weight-bold: 700; --font-weight-medium: 500; --font-weight-normal: 400; --font-weight-semibold: 600; --leading-snug: 1.375; --radius: 0.25rem; --radius-lg: 0.5rem; --radius-sm: 0.25rem; --spacing: 0.25rem; --text-2xl: 1.5rem; --text-2xl--line-height: calc(2 / 1.5); --text-5xl: 3rem; --text-5xl--line-height: 1; --text-base: 1rem; --text-base--line-height: calc(1.5 / 1); --text-sm: 0.875rem; --text-sm--line-height: calc(1.25 / 0.875); --text-xs: 0.75rem; --text-xs--line-height: calc(1 / 0.75); --tracking-widest: 0.1em; } .pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.inset-x-0{inset-inline:0}.top-\(--overlay-pad-block\){top:var(--overlay-pad-block)}.top-0{top:0}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.top-3{top:calc(var(--spacing) * 3)}.top-\[calc\(-1\*var\(--carousel-nav-offset\)\)\]{top:calc(-1 * var(--carousel-nav-offset))}.right-\(--overlay-pad-inline\){right:var(--overlay-pad-inline)}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.right-3{right:calc(var(--spacing) * 3)}.right-4{right:calc(var(--spacing) * 4)}.right-\[calc\(-1\*var\(--carousel-nav-offset\)\)\]{right:calc(-1 * var(--carousel-nav-offset))}.bottom-\(--dock-pos\){bottom:var(--dock-pos)}.bottom-4{bottom:calc(var(--spacing) * 4)}.bottom-\[calc\(-1\*var\(--carousel-nav-offset\)\)\]{bottom:calc(-1 * var(--carousel-nav-offset))}.left-0{left:0}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing) * 2)}.left-3{left:calc(var(--spacing) * 3)}.left-\[calc\(-1\*var\(--carousel-nav-offset\)\)\]{left:calc(-1 * var(--carousel-nav-offset))}.isolate{isolation:isolate}.z-10{z-index:10}.z-dock{z-index:var(--z-dock)}.z-modal{z-index:var(--z-modal)}.z-overlay{z-index:var(--z-overlay)}.z-popover{z-index:var(--z-popover)}.z-toast{z-index:var(--z-toast)}.z-tooltip{z-index:var(--z-tooltip)}.col-start-2{grid-column-start:2}.row-span-2{grid-row:span 2/span 2}.row-start-1{grid-row-start:1}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.-mt-4{margin-top:calc(var(--spacing) * -4)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-auto{margin-top:auto}.mr-1{margin-right:var(--spacing)}.mr-2{margin-right:calc(var(--spacing) * 2)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.-ml-4{margin-left:calc(var(--spacing) * -4)}.ml-auto{margin-left:auto}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.table-cell{display:table-cell}.aspect-square{aspect-ratio:1}.size-\(--search-button-size\){width:var(--search-button-size);height:var(--search-button-size)}.size-\(--search-icon-size\){width:var(--search-icon-size);height:var(--search-icon-size)}.size-\(--switch-thumb\){width:var(--switch-thumb);height:var(--switch-thumb)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-icon-sm{width:var(--icon-sm);height:var(--icon-sm)}.h-\(--carousel-nav-size\){height:var(--carousel-nav-size)}.h-\(--control-h-lg\){height:var(--control-h-lg)}.h-\(--control-h-md\){height:var(--control-h-md)}.h-\(--control-h-sm\){height:var(--control-h-sm)}.h-\(--control-h-xs\){height:var(--control-h-xs)}.h-\(--dropdown-input-height\){height:var(--dropdown-input-height)}.h-\(--reka-select-trigger-height\){height:var(--reka-select-trigger-height)}.h-\(--switch-track-h\){height:var(--switch-track-h)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-16{height:calc(var(--spacing) * 16)}.h-32{height:calc(var(--spacing) * 32)}.h-\[calc\(2rem\*var\(--ui-scale\)\)\]{height:calc(2rem * var(--ui-scale))}.h-auto{height:auto}.h-full{height:100%}.h-px{height:1px}.max-h-\(--overlay-max-block\){max-height:var(--overlay-max-block)}.max-h-\[50vh\]{max-height:50vh}.max-h-\[70vh\]{max-height:70vh}.max-h-\[calc\(100dvh-2rem\)\]{max-height:calc(100dvh - 2rem)}.max-h-screen{max-height:100vh}.min-h-0{min-height:0}.min-h-4{min-height:calc(var(--spacing) * 4)}.min-h-6{min-height:calc(var(--spacing) * 6)}.min-h-20{min-height:calc(var(--spacing) * 20)}.w-\(--carousel-nav-size\){width:var(--carousel-nav-size)}.w-\(--control-h-lg\){width:var(--control-h-lg)}.w-\(--control-h-md\){width:var(--control-h-md)}.w-\(--control-h-sm\){width:var(--control-h-sm)}.w-\(--control-h-xs\){width:var(--control-h-xs)}.w-\(--reka-popover-trigger-width\){width:var(--reka-popover-trigger-width)}.w-\(--switch-track-w\){width:var(--switch-track-w)}.w-1\.5{width:calc(var(--spacing) * 1.5)}.w-1\/2{width:50%}.w-2{width:calc(var(--spacing) * 2)}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-3\/4{width:75%}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-10{width:calc(var(--spacing) * 10)}.w-16{width:calc(var(--spacing) * 16)}.w-32{width:calc(var(--spacing) * 32)}.w-72{width:calc(var(--spacing) * 72)}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.w-max{width:max-content}.w-popover{width:var(--popover-width)}.w-px{width:1px}.max-w-\(--search-modal-width\){max-width:var(--search-modal-width)}.max-w-\[500px\]{max-width:500px}.max-w-lg{max-width:var(--container-lg)}.min-w-\(--overlay-min-width\){min-width:var(--overlay-min-width)}.min-w-\(--reka-select-trigger-width\){min-width:var(--reka-select-trigger-width)}.min-w-0{min-width:0}.min-w-32{min-width:calc(var(--spacing) * 32)}.min-w-\[300px\]{min-width:300px}.min-w-input-sm{min-width:var(--input-min-width-sm)}.flex-1{flex:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.grow-0{flex-grow:0}.basis-full{flex-basis:100%}.caption-bottom{caption-side:bottom}.origin-\(--reka-combobox-content-transform-origin\){transform-origin:var(--reka-combobox-content-transform-origin)}.origin-\(--reka-select-content-transform-origin\){transform-origin:var(--reka-select-content-transform-origin)}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.rotate-90{rotate:90deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.transform-gpu{transform:translateZ(0) var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.resize{resize:both}.scrollbar-thin{scrollbar-width:thin}.appearance-none{appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-\[0_1fr\]{grid-template-columns:0 1fr}.grid-cols-\[auto_1fr\]{grid-template-columns:auto 1fr}.grid-rows-\[auto_minmax\(var\(--configurator-stage-min\,18rem\)\,auto\)_minmax\(0\,1fr\)\]{grid-template-rows:auto minmax(var(--configurator-stage-min,18rem),auto) minmax(0,1fr)}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.justify-items-start{justify-items:start}.gap-\(--card-pad-title-gap\){gap:var(--card-pad-title-gap)}.gap-0{gap:0}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-3{column-gap:calc(var(--spacing) * 3)}:where(.space-x-4>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse)))}.gap-y-\(--card-pad-title-gap\){row-gap:var(--card-pad-title-gap)}.gap-y-0\.5{row-gap:calc(var(--spacing) * .5)}.gap-y-1{row-gap:var(--spacing)}.gap-y-1\.5{row-gap:calc(var(--spacing) * 1.5)}.self-start{align-self:flex-start}.justify-self-end{justify-self:flex-end}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.overscroll-contain{overscroll-behavior:contain}.rounded{border-radius:var(--radius)}.rounded-badge{border-radius:var(--radius-badge)}.rounded-button{border-radius:var(--radius-button)}.rounded-card{border-radius:var(--radius-card)}.rounded-control{border-radius:var(--radius-control)}.rounded-dialog{border-radius:var(--radius-dialog)}.rounded-field{border-radius:var(--radius-field)}.rounded-input{border-radius:var(--radius-input)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-none{border-radius:0}.rounded-panel{border-radius:var(--radius-panel)}.rounded-pill{border-radius:var(--radius-pill)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-tooltip{border-radius:var(--radius-tooltip)}.rounded-t-dialog{border-top-left-radius:var(--radius-dialog);border-top-right-radius:var(--radius-dialog)}.rounded-l-dialog{border-top-left-radius:var(--radius-dialog);border-bottom-left-radius:var(--radius-dialog)}.rounded-r-dialog{border-top-right-radius:var(--radius-dialog);border-bottom-right-radius:var(--radius-dialog)}.rounded-b-dialog{border-bottom-right-radius:var(--radius-dialog);border-bottom-left-radius:var(--radius-dialog)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-none{--tw-border-style:none;border-style:none}.border-\(--configurator-divider-section\){border-color:var(--configurator-divider-section)}.border-\(--control-ring\){border-color:var(--control-ring)}.border-\(--control-surface-border\){border-color:var(--control-surface-border)}.border-\(--glass-border-floating\){border-color:var(--glass-border-floating)}.border-\(--glass-border-resting\){border-color:var(--glass-border-resting)}.border-border,.border-border\/40{border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.border-border\/40{border-color:color-mix(in oklab, var(--border) 40%, transparent)}}.border-border\/50{border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.border-border\/50{border-color:color-mix(in oklab, var(--border) 50%, transparent)}}.border-border\/60{border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.border-border\/60{border-color:color-mix(in oklab, var(--border) 60%, transparent)}}.border-muted-foreground{border-color:var(--muted-foreground)}.border-primary{border-color:var(--primary)}.border-transparent{border-color:#0000}.border-t-transparent{border-top-color:#0000}.bg-\(--control-surface-bg\){background-color:var(--control-surface-bg)}.bg-\(--glass-bg-wash\){background-color:var(--glass-bg-wash)}.bg-\(--separator-ink\){background-color:var(--separator-ink)}.bg-\[color-mix\(in_srgb\,var\(--foreground\)_12\%\,transparent\)\]{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.bg-\[color-mix\(in_srgb\,var\(--foreground\)_12\%\,transparent\)\]{background-color:color-mix(in srgb,var(--foreground) 12%,transparent)}}.bg-\[var\(--progress-track\,var\(--progress-track-on-glass\)\)\]{background-color:var(--progress-track,var(--progress-track-on-glass))}.bg-background{background-color:var(--background)}.bg-border,.bg-border\/70{background-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.bg-border\/70{background-color:color-mix(in oklab, var(--border) 70%, transparent)}}.bg-card,.bg-card\/70{background-color:var(--card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/70{background-color:color-mix(in oklab, var(--card) 70%, transparent)}}.bg-current{background-color:currentColor}.bg-destructive{background-color:var(--destructive)}.bg-info{background-color:var(--info)}.bg-muted{background-color:var(--muted)}.bg-overlay-scrim{background-color:var(--overlay-scrim)}.bg-overlay-scrim-strong{background-color:var(--overlay-scrim-strong)}.bg-overlay-scrim-subtle{background-color:var(--overlay-scrim-subtle)}.bg-primary{background-color:var(--primary)}.bg-secondary{background-color:var(--secondary)}.bg-success{background-color:var(--success)}.bg-transparent{background-color:#0000}.bg-warning{background-color:var(--warning)}.fill-\(--easing-curve-accent\){fill:var(--easing-curve-accent)}.fill-current{fill:currentColor}.fill-foreground{fill:var(--foreground)}.fill-muted-foreground\/50{fill:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.fill-muted-foreground\/50{fill:color-mix(in oklab, var(--muted-foreground) 50%, transparent)}}.fill-muted-foreground\/60{fill:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.fill-muted-foreground\/60{fill:color-mix(in oklab, var(--muted-foreground) 60%, transparent)}}.stroke-\(--easing-curve-accent\){stroke:var(--easing-curve-accent)}.stroke-background{stroke:var(--background)}.stroke-border,.stroke-border\/40{stroke:var(--border)}@supports (color:color-mix(in lab, red, red)){.stroke-border\/40{stroke:color-mix(in oklab, var(--border) 40%, transparent)}}.stroke-muted-foreground\/30{stroke:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.stroke-muted-foreground\/30{stroke:color-mix(in oklab, var(--muted-foreground) 30%, transparent)}}.stroke-muted-foreground\/50{stroke:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.stroke-muted-foreground\/50{stroke:color-mix(in oklab, var(--muted-foreground) 50%, transparent)}}.object-cover{object-fit:cover}.p-0{padding:0}.p-1{padding:var(--spacing)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.px-\(--card-pad-inline\){padding-inline:var(--card-pad-inline)}.px-\(--overlay-pad-inline\){padding-inline:var(--overlay-pad-inline)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-8{padding-inline:calc(var(--spacing) * 8)}.px-9{padding-inline:calc(var(--spacing) * 9)}.py-\(--overlay-pad-block\){padding-block:var(--overlay-pad-block)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-10{padding-block:calc(var(--spacing) * 10)}.pt-\(--card-pad-block\){padding-top:var(--card-pad-block)}.pt-\(--card-pad-footer\){padding-top:var(--card-pad-footer)}.pt-\(--card-pad-section-gap\){padding-top:var(--card-pad-section-gap)}.pt-\(--overlay-pad-block\){padding-top:var(--overlay-pad-block)}.pt-0{padding-top:0}.pt-4{padding-top:calc(var(--spacing) * 4)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-\(--card-pad-block\){padding-bottom:var(--card-pad-block)}.pb-\(--overlay-pad-block\){padding-bottom:var(--overlay-pad-block)}.pb-0{padding-bottom:0}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-4{padding-left:calc(var(--spacing) * 4)}.pl-7{padding-left:calc(var(--spacing) * 7)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.align-middle{vertical-align:middle}.font-display{font-family:var(--font-stack-display)}.font-mono{font-family:var(--font-stack-mono)}.font-sans{font-family:var(--font-stack-sans)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\(length\:--search-result-text\){font-size:var(--search-result-text)}.text-\(length\:--search-result-text-secondary\){font-size:var(--search-result-text-secondary)}.text-\(length\:--tooltip-text\){font-size:var(--tooltip-text)}.text-\[length\:calc\(var\(--type-body\)\*var\(--ui-scale\)\)\]{font-size:calc(var(--type-body) * var(--ui-scale))}.text-\[length\:var\(--control-text\)\]{font-size:var(--control-text)}.text-\[length\:var\(--control-text-sm\)\]{font-size:var(--control-text-sm)}.text-caption{font-size:var(--type-caption)}.text-dropdown{font-size:var(--dropdown-text)}.text-dropdown-secondary{font-size:var(--dropdown-text-secondary)}.text-heading{font-size:var(--type-heading)}.text-micro{font-size:var(--type-micro)}.text-prose{font-size:var(--type-prose)}.text-small{font-size:var(--type-small)}.text-subheading{font-size:var(--type-subheading)}.leading-\[1\.1\]{--tw-leading:1.1;line-height:1.1}.leading-none{--tw-leading:1;line-height:1}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-snug{--tw-tracking:var(--type-tracking-snug);letter-spacing:var(--type-tracking-snug)}.tracking-tight{--tw-tracking:var(--type-tracking-tight);letter-spacing:var(--type-tracking-tight)}.tracking-wider{--tw-tracking:var(--type-tracking-wider);letter-spacing:var(--type-tracking-wider)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.break-words{overflow-wrap:break-word}.wrap-anywhere{overflow-wrap:anywhere}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.text-\(--accent-ai-ink\){color:var(--accent-ai-ink)}.text-\(--easing-curve-accent\){color:var(--easing-curve-accent)}.text-card-foreground{color:var(--card-foreground)}.text-current{color:currentColor}.text-destructive{color:var(--destructive)}.text-destructive-foreground{color:var(--destructive-foreground)}.text-foreground,.text-foreground\/50{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/50{color:color-mix(in oklab, var(--foreground) 50%, transparent)}}.text-foreground\/70{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/70{color:color-mix(in oklab, var(--foreground) 70%, transparent)}}.text-foreground\/85{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/85{color:color-mix(in oklab, var(--foreground) 85%, transparent)}}.text-info-foreground{color:var(--info-foreground)}.text-muted-foreground{color:var(--muted-foreground)}.text-muted-foreground-strong{color:var(--muted-foreground-strong)}.text-muted-foreground\/40{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/40{color:color-mix(in oklab, var(--muted-foreground) 40%, transparent)}}.text-muted-foreground\/60{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/60{color:color-mix(in oklab, var(--muted-foreground) 60%, transparent)}}.text-muted-foreground\/70{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/70{color:color-mix(in oklab, var(--muted-foreground) 70%, transparent)}}.text-muted-foreground\/80{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/80{color:color-mix(in oklab, var(--muted-foreground) 80%, transparent)}}.text-popover-foreground{color:var(--popover-foreground)}.text-primary{color:var(--primary)}.text-primary-foreground{color:var(--primary-foreground)}.text-secondary-foreground{color:var(--secondary-foreground)}.text-success-foreground{color:var(--success-foreground)}.text-warning-foreground{color:var(--warning-foreground)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}.opacity-\(--select-chevron-opacity\){opacity:var(--select-chevron-opacity)}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-80{opacity:.8}.opacity-90{opacity:.9}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-card{--tw-shadow:var(--card-shadow);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-cartoon{--tw-shadow:var(--cartoon-shadow);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-none{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.outline-hidden{outline-offset:2px;outline:2px solid #0000}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[background-color\,border-color\,box-shadow\,color\,opacity\,transform\]{transition-property:background-color,border-color,box-shadow,color,opacity,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-fast{--tw-duration:var(--duration-fast);transition-duration:var(--duration-fast)}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.ease-standard{--tw-ease:var(--motion-ease-standard);transition-timing-function:var(--motion-ease-standard)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.select-text{-webkit-user-select:text;user-select:text}@media (hover:hover){.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.group-data-\[state\=indeterminate\]\:block:is(:where(.group)[data-state=indeterminate] *){display:block}.group-data-\[state\=indeterminate\]\:hidden:is(:where(.group)[data-state=indeterminate] *){display:none}.group-data-\[state\=open\]\:rotate-180:is(:where(.group)[data-state=open] *){rotate:180deg}.group-\[\.destructive\]\:border-muted\/40:is(:where(.group).destructive *){border-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.group-\[\.destructive\]\:border-muted\/40:is(:where(.group).destructive *){border-color:color-mix(in oklab, var(--muted) 40%, transparent)}}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:opacity-70:is(:where(.peer):disabled~*){opacity:.7}.file\:border-0::file-selector-button{border-style:var(--tw-border-style);border-width:0}.file\:bg-transparent::file-selector-button{background-color:#0000}.file\:text-\(length\:--control-text-sm\)::file-selector-button{font-size:var(--control-text-sm)}.file\:font-medium::file-selector-button{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.placeholder\:text-muted-foreground::placeholder{color:var(--muted-foreground)}.user-invalid\:border-\(--destructive\):user-invalid{border-color:var(--destructive)}.user-invalid\:shadow-\(--invalid-ring\):user-invalid{--tw-shadow:var(--invalid-ring);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}@media (hover:hover){.hover\:border-\(--surface-tint-22\):hover{border-color:var(--surface-tint-22)}.hover\:bg-\(--surface-tint-8\):hover{background-color:var(--surface-tint-8)}.hover\:bg-accent:hover{background-color:var(--accent)}.hover\:bg-destructive\/80:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/80:hover{background-color:color-mix(in oklab, var(--destructive) 80%, transparent)}}.hover\:bg-destructive\/90:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab, var(--destructive) 90%, transparent)}}.hover\:bg-foreground\/5:hover{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-foreground\/5:hover{background-color:color-mix(in oklab, var(--foreground) 5%, transparent)}}.hover\:bg-foreground\/8:hover{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-foreground\/8:hover{background-color:color-mix(in oklab, var(--foreground) 8%, transparent)}}.hover\:bg-foreground\/\[0\.04\]:hover{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-foreground\/\[0\.04\]:hover{background-color:color-mix(in oklab, var(--foreground) 4%, transparent)}}.hover\:bg-glass-quiet:hover{background-color:var(--glass-bg-quiet)}.hover\:bg-info\/80:hover{background-color:var(--info)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-info\/80:hover{background-color:color-mix(in oklab, var(--info) 80%, transparent)}}.hover\:bg-muted:hover,.hover\:bg-muted\/50:hover{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/50:hover{background-color:color-mix(in oklab, var(--muted) 50%, transparent)}}.hover\:bg-primary\/80:hover{background-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/80:hover{background-color:color-mix(in oklab, var(--primary) 80%, transparent)}}.hover\:bg-secondary:hover,.hover\:bg-secondary\/80:hover{background-color:var(--secondary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-secondary\/80:hover{background-color:color-mix(in oklab, var(--secondary) 80%, transparent)}}.hover\:bg-success\/80:hover{background-color:var(--success)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-success\/80:hover{background-color:color-mix(in oklab, var(--success) 80%, transparent)}}.hover\:bg-warning\/80:hover{background-color:var(--warning)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-warning\/80:hover{background-color:color-mix(in oklab, var(--warning) 80%, transparent)}}.hover\:bg-white\/10:hover{background-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/10:hover{background-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.hover\:text-accent-foreground:hover{color:var(--accent-foreground)}.hover\:text-foreground:hover{color:var(--foreground)}.hover\:text-muted-foreground:hover{color:var(--muted-foreground)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-100:hover{opacity:1}.group-\[\.destructive\]\:hover\:border-destructive\/30:is(:where(.group).destructive *):hover{border-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.group-\[\.destructive\]\:hover\:border-destructive\/30:is(:where(.group).destructive *):hover{border-color:color-mix(in oklab, var(--destructive) 30%, transparent)}}.group-\[\.destructive\]\:hover\:bg-destructive:is(:where(.group).destructive *):hover{background-color:var(--destructive)}.group-\[\.destructive\]\:hover\:text-destructive-foreground:is(:where(.group).destructive *):hover{color:var(--destructive-foreground)}}.focus\:bg-accent:focus{background-color:var(--accent)}.focus\:text-accent-foreground:focus{color:var(--accent-foreground)}.focus\:opacity-100:focus{opacity:1}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:stroke-\(--easing-curve-accent\):focus-visible{stroke:var(--easing-curve-accent)}.focus-visible\:\[stroke-width\:0\.045\]:focus-visible{stroke-width:.045px}.focus-visible\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\:outline-\(color\:--focus-ring-color\):focus-visible{outline-color:var(--focus-ring-color)}.focus-visible\:user-invalid\:shadow-\(--invalid-ring\):focus-visible:user-invalid{--tw-shadow:var(--invalid-ring);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.active\:bg-destructive\/80:active{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.active\:bg-destructive\/80:active{background-color:color-mix(in oklab, var(--destructive) 80%, transparent)}}.active\:bg-foreground\/12:active{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.active\:bg-foreground\/12:active{background-color:color-mix(in oklab, var(--foreground) 12%, transparent)}}.active\:bg-foreground\/\[0\.08\]:active{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.active\:bg-foreground\/\[0\.08\]:active{background-color:color-mix(in oklab, var(--foreground) 8%, transparent)}}.active\:opacity-80:active{opacity:.8}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:cursor-wait:disabled{cursor:wait}.disabled\:opacity-20:disabled{opacity:.2}.disabled\:opacity-disabled:disabled{opacity:var(--opacity-disabled)}:where([data-state=open]) .in-data-\[state\=open\]\:rotate-180{rotate:180deg}.has-data-\[slot\=card-action\]\:grid:has([data-slot=card-action]){display:grid}.has-data-\[slot\=card-action\]\:grid-cols-\[1fr_auto\]:has([data-slot=card-action]){grid-template-columns:1fr auto}.has-data-\[slot\=card-action\]\:items-start:has([data-slot=card-action]){align-items:flex-start}.has-\[\:user-invalid\]\:border-\(--destructive\):has(:user-invalid){border-color:var(--destructive)}.has-\[\:user-invalid\]\:shadow-\(--invalid-ring\):has(:user-invalid){--tw-shadow:var(--invalid-ring);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.aria-invalid\:border-\(--destructive\)[aria-invalid=true]{border-color:var(--destructive)}.aria-invalid\:text-destructive[aria-invalid=true]{color:var(--destructive)}.aria-invalid\:shadow-\(--invalid-ring\)[aria-invalid=true]{--tw-shadow:var(--invalid-ring);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.aria-invalid\:placeholder\:text-\[color-mix\(in_srgb\,var\(--destructive\)_60\%\,transparent\)\][aria-invalid=true]::placeholder{color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.aria-invalid\:placeholder\:text-\[color-mix\(in_srgb\,var\(--destructive\)_60\%\,transparent\)\][aria-invalid=true]::placeholder{color:color-mix(in srgb,var(--destructive) 60%,transparent)}}.focus-visible\:aria-invalid\:shadow-\(--invalid-ring\):focus-visible[aria-invalid=true]{--tw-shadow:var(--invalid-ring);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.aria-pressed\:bg-destructive\/85[aria-pressed=true]{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.aria-pressed\:bg-destructive\/85[aria-pressed=true]{background-color:color-mix(in oklab, var(--destructive) 85%, transparent)}}.aria-pressed\:bg-foreground\/10[aria-pressed=true]{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.aria-pressed\:bg-foreground\/10[aria-pressed=true]{background-color:color-mix(in oklab, var(--foreground) 10%, transparent)}}.aria-pressed\:bg-foreground\/\[0\.1\][aria-pressed=true]{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.aria-pressed\:bg-foreground\/\[0\.1\][aria-pressed=true]{background-color:color-mix(in oklab, var(--foreground) 10%, transparent)}}.aria-pressed\:text-foreground[aria-pressed=true]{color:var(--foreground)}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[disabled\]\:cursor-not-allowed[data-disabled]{cursor:not-allowed}.data-\[disabled\]\:opacity-disabled[data-disabled]{opacity:var(--opacity-disabled)}.data-\[highlighted\]\:bg-accent[data-highlighted]{background-color:var(--accent)}.data-\[highlighted\]\:text-accent-foreground[data-highlighted]{color:var(--accent-foreground)}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[size\=sm\]\:\[--card-pad-inline\:--spacing\(4\)\][data-size=sm]{--card-pad-inline:calc(var(--spacing) * 4)}.data-\[state\=active\]\:shadow-focus-ring[data-state=active]{--tw-shadow:var(--focus-ring-shadow);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=checked\]\:translate-x-\(--switch-throw\)[data-state=checked]{--tw-translate-x:var(--switch-throw);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:border-\(--control-checked-bg\)[data-state=checked]{border-color:var(--control-checked-bg)}.data-\[state\=checked\]\:bg-\(--control-checked-bg\)[data-state=checked]{background-color:var(--control-checked-bg)}.data-\[state\=checked\]\:bg-primary[data-state=checked]{background-color:var(--primary)}.data-\[state\=checked\]\:text-primary-foreground[data-state=checked]{color:var(--primary-foreground)}.data-\[state\=indeterminate\]\:bg-\(--control-checked-bg\)[data-state=indeterminate]{background-color:var(--control-checked-bg)}.data-\[state\=indeterminate\]\:text-primary-foreground[data-state=indeterminate]{color:var(--primary-foreground)}.data-\[state\=on\]\:border-glass-border-quiet[data-state=on]{border-color:var(--glass-border-quiet)}.data-\[state\=on\]\:bg-accent[data-state=on]{background-color:var(--accent)}.data-\[state\=on\]\:bg-glass-quiet[data-state=on]{background-color:var(--glass-bg-quiet)}.data-\[state\=on\]\:text-accent-foreground[data-state=on]{color:var(--accent-foreground)}.data-\[state\=on\]\:text-foreground[data-state=on]{color:var(--foreground)}.data-\[state\=on\]\:shadow-glass-quiet[data-state=on]{--tw-shadow:var(--glass-shadow-quiet);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=open\]\:bg-accent[data-state=open]{background-color:var(--accent)}.data-\[state\=open\]\:text-muted-foreground[data-state=open]{color:var(--muted-foreground)}.data-\[state\=selected\]\:bg-muted[data-state=selected]{background-color:var(--muted)}.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{--tw-translate-x:0;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=unchecked\]\:bg-\(--glass-bg-wash\)[data-state=unchecked]{background-color:var(--glass-bg-wash)}.data-\[swipe\=cancel\]\:translate-x-0[data-swipe=cancel]{--tw-translate-x:0;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=end\]\:translate-x-\(--reka-toast-swipe-end-x\)[data-swipe=end]{--tw-translate-x:var(--reka-toast-swipe-end-x);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=move\]\:translate-x-\(--reka-toast-swipe-move-x\)[data-swipe=move]{--tw-translate-x:var(--reka-toast-swipe-move-x);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=move\]\:transition-none[data-swipe=move]{transition-property:none}@media (prefers-reduced-motion:no-preference){.motion-safe\:animate-ping{animation:var(--animate-ping)}}@media (prefers-reduced-motion:reduce){.motion-reduce\:transition-none{transition-property:none}}@media (min-width:40rem){.sm\:top-auto{top:auto}.sm\:right-0{right:0}.sm\:bottom-0{bottom:0}.sm\:left-0{left:0}.sm\:left-1\/2{left:50%}.sm\:-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.sm\:flex-col{flex-direction:column}.sm\:flex-row{flex-direction:row}.sm\:justify-end{justify-content:flex-end}.sm\:gap-x-2{column-gap:calc(var(--spacing) * 2)}.sm\:text-left{text-align:left}}@media (min-width:48rem){.md\:max-w-\[420px\]{max-width:420px}}@media (min-width:64rem){.lg\:grid-cols-\[1fr_18rem\]{grid-template-columns:1fr 18rem}.lg\:border-t-0{border-top-style:var(--tw-border-style);border-top-width:0}.lg\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.lg\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.lg\:border-l-0{border-left-style:var(--tw-border-style);border-left-width:0}}.dark\:bg-\[hsl\(0_70\%_45\%\)\]:where(.dark,.dark *){background-color:#c32222}@media (hover:hover){.dark\:hover\:bg-\[hsl\(0_70\%_45\%\)\]\/85:where(.dark,.dark *):hover{background-color:oklab(52.8351% .173873 .0893282/.85)}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}
+:root { --animate-spin: spin 1s linear infinite; --container-lg: 32rem; --default-transition-duration: var(--duration-fast, 150ms); --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --font-weight-bold: 700; --font-weight-medium: 500; --font-weight-normal: 400; --font-weight-semibold: 600; --leading-snug: 1.375; --radius: 0.25rem; --radius-lg: 0.5rem; --radius-sm: 0.25rem; --spacing: 0.25rem; --text-base: 1rem; --text-base--line-height: calc(1.5 / 1); --text-sm: 0.875rem; --text-sm--line-height: calc(1.25 / 0.875); --text-xs: 0.75rem; --text-xs--line-height: calc(1 / 0.75); } .pointer-events-auto{pointer-events:auto}.collapse{visibility:collapse}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.inset-x-0{inset-inline:0}.top-\(--overlay-pad-block\){top:var(--overlay-pad-block)}.top-0{top:0}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.right-\(--overlay-pad-inline\){right:var(--overlay-pad-inline)}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.bottom-\(--dock-pos\){bottom:var(--dock-pos)}.left-0{left:0}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing) * 2)}.z-modal{z-index:var(--z-modal)}.z-overlay{z-index:var(--z-overlay)}.z-popover{z-index:var(--z-popover)}.z-toast{z-index:var(--z-toast)}.z-tooltip{z-index:var(--z-tooltip)}.col-start-2{grid-column-start:2}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.-mt-4{margin-top:calc(var(--spacing) * -4)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-auto{margin-top:auto}.-ml-4{margin-left:calc(var(--spacing) * -4)}.ml-auto{margin-left:auto}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.table-cell{display:table-cell}.aspect-square{aspect-ratio:1}.size-\(--search-button-size\){width:var(--search-button-size);height:var(--search-button-size)}.size-\(--search-icon-size\){width:var(--search-icon-size);height:var(--search-icon-size)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.h-\(--control-h-md\){height:var(--control-h-md)}.h-\(--control-h-sm\){height:var(--control-h-sm)}.h-\(--dropdown-input-height\){height:var(--dropdown-input-height)}.h-\(--reka-select-trigger-height\){height:var(--reka-select-trigger-height)}.h-2{height:calc(var(--spacing) * 2)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-9{height:calc(var(--spacing) * 9)}.h-\[calc\(2rem\*var\(--ui-scale\)\)\]{height:calc(2rem * var(--ui-scale))}.h-full{height:100%}.h-px{height:1px}.max-h-\[50vh\]{max-height:50vh}.max-h-\[70vh\]{max-height:70vh}.max-h-\[calc\(100dvh-2rem\)\]{max-height:calc(100dvh - 2rem)}.max-h-\[inherit\]{max-height:inherit}.max-h-\[min\(24rem\,var\(--reka-combobox-content-available-height\,60dvh\)\)\]{max-height:min(24rem, var(--reka-combobox-content-available-height,60dvh))}.max-h-screen{max-height:100vh}.min-h-0{min-height:0}.min-h-4{min-height:calc(var(--spacing) * 4)}.w-\(--reka-popover-trigger-width\){width:var(--reka-popover-trigger-width)}.w-2{width:calc(var(--spacing) * 2)}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-3\/4{width:75%}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-72{width:calc(var(--spacing) * 72)}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.w-max{width:max-content}.w-popover{width:var(--popover-width)}.max-w-\(--search-modal-width\){max-width:var(--search-modal-width)}.max-w-lg{max-width:var(--container-lg)}.min-w-\(--overlay-min-width\){min-width:var(--overlay-min-width)}.min-w-\(--reka-select-trigger-width\){min-width:var(--reka-select-trigger-width)}.min-w-0{min-width:0}.min-w-input-sm{min-width:var(--input-min-width-sm)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.grow-0{flex-grow:0}.basis-full{flex-basis:100%}.caption-bottom{caption-side:bottom}.origin-\(--reka-combobox-content-transform-origin\){transform-origin:var(--reka-combobox-content-transform-origin)}.origin-\(--reka-select-content-transform-origin\){transform-origin:var(--reka-select-content-transform-origin)}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.resize{resize:both}.scrollbar-thin{scrollbar-width:thin}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-\[0_1fr\]{grid-template-columns:0 1fr}.grid-rows-\[auto_minmax\(var\(--configurator-stage-min\,18rem\)\,auto\)_minmax\(0\,1fr\)\]{grid-template-rows:auto minmax(var(--configurator-stage-min,18rem),auto) minmax(0,1fr)}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-items-start{justify-items:start}.gap-\(--card-pad-title-gap\){gap:var(--card-pad-title-gap)}.gap-0{gap:0}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-x-4>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse)))}.gap-y-0\.5{row-gap:calc(var(--spacing) * .5)}.gap-y-1\.5{row-gap:calc(var(--spacing) * 1.5)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.overscroll-contain{overscroll-behavior:contain}.rounded{border-radius:var(--radius)}.rounded-badge{border-radius:var(--radius-badge)}.rounded-button{border-radius:var(--radius-button)}.rounded-card{border-radius:var(--radius-card)}.rounded-dialog{border-radius:var(--radius-dialog)}.rounded-input{border-radius:var(--radius-input)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-none{border-radius:0}.rounded-panel{border-radius:var(--radius-panel)}.rounded-pill{border-radius:var(--radius-pill)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-tooltip{border-radius:var(--radius-tooltip)}.rounded-t-dialog{border-top-left-radius:var(--radius-dialog);border-top-right-radius:var(--radius-dialog)}.rounded-l-dialog{border-top-left-radius:var(--radius-dialog);border-bottom-left-radius:var(--radius-dialog)}.rounded-r-dialog{border-top-right-radius:var(--radius-dialog);border-bottom-right-radius:var(--radius-dialog)}.rounded-b-dialog{border-bottom-right-radius:var(--radius-dialog);border-bottom-left-radius:var(--radius-dialog)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-none{--tw-border-style:none;border-style:none}.border-border\/50{border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.border-border\/50{border-color:color-mix(in oklab, var(--border) 50%, transparent)}}.border-border\/60{border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.border-border\/60{border-color:color-mix(in oklab, var(--border) 60%, transparent)}}.border-muted-foreground{border-color:var(--muted-foreground)}.border-t-transparent{border-top-color:#0000}.bg-\(--glass-bg-wash\){background-color:var(--glass-bg-wash)}.bg-\[color-mix\(in_srgb\,var\(--foreground\)_12\%\,transparent\)\]{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.bg-\[color-mix\(in_srgb\,var\(--foreground\)_12\%\,transparent\)\]{background-color:color-mix(in srgb,var(--foreground) 12%,transparent)}}.bg-destructive{background-color:var(--destructive)}.bg-info{background-color:var(--info)}.bg-overlay-scrim{background-color:var(--overlay-scrim)}.bg-overlay-scrim-strong{background-color:var(--overlay-scrim-strong)}.bg-overlay-scrim-subtle{background-color:var(--overlay-scrim-subtle)}.bg-primary{background-color:var(--primary)}.bg-secondary{background-color:var(--secondary)}.bg-success{background-color:var(--success)}.bg-transparent{background-color:#0000}.bg-warning{background-color:var(--warning)}.fill-\(--easing-curve-accent\){fill:var(--easing-curve-accent)}.fill-foreground{fill:var(--foreground)}.fill-muted-foreground\/50{fill:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.fill-muted-foreground\/50{fill:color-mix(in oklab, var(--muted-foreground) 50%, transparent)}}.fill-muted-foreground\/60{fill:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.fill-muted-foreground\/60{fill:color-mix(in oklab, var(--muted-foreground) 60%, transparent)}}.stroke-\(--easing-curve-accent\){stroke:var(--easing-curve-accent)}.stroke-background{stroke:var(--background)}.stroke-border,.stroke-border\/40{stroke:var(--border)}@supports (color:color-mix(in lab, red, red)){.stroke-border\/40{stroke:color-mix(in oklab, var(--border) 40%, transparent)}}.stroke-muted-foreground\/30{stroke:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.stroke-muted-foreground\/30{stroke:color-mix(in oklab, var(--muted-foreground) 30%, transparent)}}.stroke-muted-foreground\/50{stroke:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.stroke-muted-foreground\/50{stroke:color-mix(in oklab, var(--muted-foreground) 50%, transparent)}}.p-0{padding:0}.p-1{padding:var(--spacing)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.px-\(--overlay-pad-inline\){padding-inline:var(--overlay-pad-inline)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.py-\(--overlay-pad-block\){padding-block:var(--overlay-pad-block)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-10{padding-block:calc(var(--spacing) * 10)}.pt-\(--card-pad-footer\){padding-top:var(--card-pad-footer)}.pt-\(--overlay-pad-block\){padding-top:var(--overlay-pad-block)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-\(--overlay-pad-block\){padding-bottom:var(--overlay-pad-block)}.pb-0{padding-bottom:0}.pl-4{padding-left:calc(var(--spacing) * 4)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.align-middle{vertical-align:middle}.font-mono{font-family:var(--font-stack-mono)}.font-sans{font-family:var(--font-stack-sans)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\(length\:--search-result-text\){font-size:var(--search-result-text)}.text-\(length\:--search-result-text-secondary\){font-size:var(--search-result-text-secondary)}.text-\(length\:--tooltip-text\){font-size:var(--tooltip-text)}.text-\[length\:calc\(var\(--type-body\)\*var\(--ui-scale\)\)\]{font-size:calc(var(--type-body) * var(--ui-scale))}.text-\[length\:var\(--control-text\)\]{font-size:var(--control-text)}.text-\[length\:var\(--control-text-sm\)\]{font-size:var(--control-text-sm)}.text-caption{font-size:var(--type-caption)}.text-dropdown{font-size:var(--dropdown-text)}.text-dropdown-secondary{font-size:var(--dropdown-text-secondary)}.text-micro{font-size:var(--type-micro)}.text-small{font-size:var(--type-small)}.text-subheading{font-size:var(--type-subheading)}.leading-\[1\.1\]{--tw-leading:1.1;line-height:1.1}.leading-none{--tw-leading:1;line-height:1}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--type-tracking-tight);letter-spacing:var(--type-tracking-tight)}.tracking-wider{--tw-tracking:var(--type-tracking-wider);letter-spacing:var(--type-tracking-wider)}.wrap-anywhere{overflow-wrap:anywhere}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.text-\(--easing-curve-accent\){color:var(--easing-curve-accent)}.text-card-foreground{color:var(--card-foreground)}.text-destructive{color:var(--destructive)}.text-destructive-foreground{color:var(--destructive-foreground)}.text-foreground,.text-foreground\/50{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/50{color:color-mix(in oklab, var(--foreground) 50%, transparent)}}.text-foreground\/85{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/85{color:color-mix(in oklab, var(--foreground) 85%, transparent)}}.text-info-foreground{color:var(--info-foreground)}.text-muted-foreground,.text-muted-foreground\/60{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/60{color:color-mix(in oklab, var(--muted-foreground) 60%, transparent)}}.text-muted-foreground\/70{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/70{color:color-mix(in oklab, var(--muted-foreground) 70%, transparent)}}.text-muted-foreground\/80{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/80{color:color-mix(in oklab, var(--muted-foreground) 80%, transparent)}}.text-popover-foreground{color:var(--popover-foreground)}.text-primary-foreground{color:var(--primary-foreground)}.text-secondary-foreground{color:var(--secondary-foreground)}.text-success-foreground{color:var(--success-foreground)}.text-warning-foreground{color:var(--warning-foreground)}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.underline{text-decoration-line:underline}.opacity-\(--select-chevron-opacity\){opacity:var(--select-chevron-opacity)}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-70{opacity:.7}.opacity-90{opacity:.9}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-none{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.outline-hidden{outline-offset:2px;outline:2px solid #0000}}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.select-text{-webkit-user-select:text;user-select:text}@media (hover:hover){.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.group-data-\[state\=open\]\:rotate-180:is(:where(.group)[data-state=open] *){rotate:180deg}.group-\[\.destructive\]\:border-muted\/40:is(:where(.group).destructive *){border-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.group-\[\.destructive\]\:border-muted\/40:is(:where(.group).destructive *){border-color:color-mix(in oklab, var(--muted) 40%, transparent)}}.placeholder\:text-muted-foreground::placeholder{color:var(--muted-foreground)}.user-invalid\:border-\(--destructive\):user-invalid{border-color:var(--destructive)}@media (hover:hover){.hover\:bg-\(--surface-tint-8\):hover{background-color:var(--surface-tint-8)}.hover\:bg-foreground\/5:hover{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-foreground\/5:hover{background-color:color-mix(in oklab, var(--foreground) 5%, transparent)}}.hover\:bg-secondary:hover{background-color:var(--secondary)}.hover\:text-foreground:hover{color:var(--foreground)}.hover\:opacity-100:hover{opacity:1}.group-\[\.destructive\]\:hover\:border-destructive\/30:is(:where(.group).destructive *):hover{border-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.group-\[\.destructive\]\:hover\:border-destructive\/30:is(:where(.group).destructive *):hover{border-color:color-mix(in oklab, var(--destructive) 30%, transparent)}}.group-\[\.destructive\]\:hover\:bg-destructive:is(:where(.group).destructive *):hover{background-color:var(--destructive)}.group-\[\.destructive\]\:hover\:text-destructive-foreground:is(:where(.group).destructive *):hover{color:var(--destructive-foreground)}}.focus\:opacity-100:focus{opacity:1}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:stroke-\(--easing-curve-accent\):focus-visible{stroke:var(--easing-curve-accent)}.focus-visible\:\[stroke-width\:0\.045\]:focus-visible{stroke-width:.045px}.focus-visible\:user-invalid\:shadow-\(--invalid-ring\):focus-visible:user-invalid{--tw-shadow:var(--invalid-ring);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-disabled:disabled{opacity:var(--opacity-disabled)}:where([data-state=open]) .in-data-\[state\=open\]\:rotate-180{rotate:180deg}.has-\[\:user-invalid\]\:border-\(--destructive\):has(:user-invalid){border-color:var(--destructive)}.has-\[\:user-invalid\]\:shadow-\(--invalid-ring\):has(:user-invalid){--tw-shadow:var(--invalid-ring);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.aria-disabled\:cursor-wait[aria-disabled=true]{cursor:wait}.aria-disabled\:opacity-disabled[aria-disabled=true]{opacity:var(--opacity-disabled)}.aria-invalid\:border-\(--destructive\)[aria-invalid=true]{border-color:var(--destructive)}.aria-invalid\:text-destructive[aria-invalid=true],.aria-invalid\:placeholder\:text-\[color-mix\(in_srgb\,var\(--destructive\)_60\%\,transparent\)\][aria-invalid=true]::placeholder{color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.aria-invalid\:placeholder\:text-\[color-mix\(in_srgb\,var\(--destructive\)_60\%\,transparent\)\][aria-invalid=true]::placeholder{color:color-mix(in srgb,var(--destructive) 60%,transparent)}}.focus-visible\:aria-invalid\:shadow-\(--invalid-ring\):focus-visible[aria-invalid=true]{--tw-shadow:var(--invalid-ring);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[disabled\]\:cursor-not-allowed[data-disabled]{cursor:not-allowed}.data-\[disabled\]\:opacity-disabled[data-disabled]{opacity:var(--opacity-disabled)}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=open\]\:bg-accent[data-state=open]{background-color:var(--accent)}.data-\[state\=open\]\:text-muted-foreground[data-state=open]{color:var(--muted-foreground)}.data-\[swipe\=cancel\]\:translate-x-0[data-swipe=cancel]{--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=end\]\:translate-x-\(--reka-toast-swipe-end-x\)[data-swipe=end]{--tw-translate-x:var(--reka-toast-swipe-end-x);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=move\]\:translate-x-\(--reka-toast-swipe-move-x\)[data-swipe=move]{--tw-translate-x:var(--reka-toast-swipe-move-x);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=move\]\:transition-none[data-swipe=move]{transition-property:none}@media (prefers-reduced-motion:reduce){.motion-reduce\:transition-none{transition-property:none}}@media (min-width:40rem){.sm\:top-auto{top:auto}.sm\:right-0{right:0}.sm\:bottom-0{bottom:0}.sm\:left-0{left:0}.sm\:left-1\/2{left:50%}.sm\:-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.sm\:flex-col{flex-direction:column}.sm\:flex-row{flex-direction:row}.sm\:justify-end{justify-content:flex-end}.sm\:gap-x-2{column-gap:calc(var(--spacing) * 2)}.sm\:text-left{text-align:left}}@media (min-width:48rem){.md\:max-w-\[420px\]{max-width:420px}}@media (min-width:64rem){.lg\:grid-cols-\[1fr_18rem\]{grid-template-columns:1fr 18rem}.lg\:border-t-0{border-top-style:var(--tw-border-style);border-top-width:0}.lg\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.lg\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.lg\:border-l-0{border-left-style:var(--tw-border-style);border-left-width:0}}.dark\:bg-\[hsl\(0_70\%_45\%\)\]:where(.dark,.dark *){background-color:#c32222}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}

package/dist/styles/glass/a11y-fallback.css

@@ -1 +1 @@
-@media (prefers-reduced-transparency: reduce) { :root { --glass-level: 0; --glass-grain-opacity: 0; --glass-highlight: 0 0 0 0 transparent; } } @media (prefers-contrast: more) { :root { --glass-level: 0.3; --glass-tint-source: var(--glass-tint-ink); --glass-tint-strength: var(--glass-tint-strength-aa); --glass-definition: 1; } } @media (forced-colors: active) { :root { --glass-level: 0; --glass-grain-opacity: 0; --glass-highlight: 0 0 0 0 transparent; } .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-card, .glass-drawer { border: 1px solid CanvasText; } .glass-floating, .glass-overlay, .glass-drawer { background: Canvas; } .glass-material::before, .glass-wash::before, .glass-quiet::before, .glass-resting::before, .glass-floating::before, .glass-overlay::before, .glass-card::before, .glass-drawer::before, .glass-wash::after, .glass-quiet::after, .glass-resting::after, .glass-floating::after, .glass-overlay::after { display: none; } .status-dot__dot { border: 1px solid CanvasText; } .status-dot__fill, .status-dot__pulse { display: none; } .status-dot__dot[data-status="active"] { background: Highlight !important; } .status-dot__dot[data-status="paused"] { background: Mark !important; } .status-dot__dot[data-status="error"] { background: CanvasText !important; } .status-dot__dot[data-status="idle"], .status-dot__dot[data-status="custom"] { background: Canvas !important; } }
+@media (prefers-reduced-transparency: reduce) { :root { --glass-level: 0; --glass-grain-opacity: 0; --glass-highlight: 0 0 0 0 transparent; } } @media (prefers-contrast: more) { :root { --glass-level: 0.3; --glass-tint-source: var(--glass-tint-ink); --glass-tint-strength: var(--glass-tint-strength-aa); --glass-definition: 1; } } @media (forced-colors: active) { :root { --glass-level: 0; --glass-grain-opacity: 0; --glass-highlight: 0 0 0 0 transparent; } .glass-material, .glass-wash, .glass-quiet, .glass-resting, .glass-floating, .glass-overlay, .glass-card, .glass-drawer { border: 1px solid CanvasText; } .glass-floating, .glass-overlay, .glass-drawer { background: Canvas; } .glass-material::before, .glass-wash::before, .glass-quiet::before, .glass-resting::before, .glass-floating::before, .glass-overlay::before, .glass-card::before, .glass-drawer::before, .glass-wash::after, .glass-quiet::after, .glass-resting::after, .glass-floating::after, .glass-overlay::after { display: none; } }

package/dist/styles/glass/accent-tone.css

@@ -1 +1 @@
-@layer components { .accent-tone { --accent-fill-strength: 8%; --accent-band-strength: 18%; --accent-edge-strength: 55%; --accent-fill: color-mix( in oklab, var(--surface, var(--card)), var(--tone, var(--primary)) var(--accent-fill-strength) ); --accent-band: color-mix( in oklab, var(--surface, var(--card)), var(--tone, var(--primary)) var(--accent-band-strength) ); --accent-edge: color-mix( in oklab, transparent, var(--tone, var(--primary)) var(--accent-edge-strength) ); --accent-ink: var(--accent-ink-resolved, var(--foreground)); } }
+@layer components { .accent-tone { --accent-band-strength: 18%; --accent-edge-strength: 55%; --accent-band: color-mix( in oklab, var(--surface, var(--card)), var(--tone, var(--primary)) var(--accent-band-strength) ); --accent-edge: color-mix( in oklab, transparent, var(--tone, var(--primary)) var(--accent-edge-strength) ); --accent-ink: var(--accent-ink-resolved, var(--foreground)); } }

package/dist/styles/glass/control-surfaces.css

@@ -1 +1 @@
-@layer components { .input-pill { @apply flex w-full; height: var(--control-pill-h, var(--control-h-md)); border-radius: var(--radius-pill); border: 1.5px solid var(--control-surface-border); background: var(--control-surface-bg); -webkit-backdrop-filter: var(--control-surface-blur); backdrop-filter: var(--control-surface-blur); padding: 0 calc(1rem * var(--ui-scale)); font-size: var(--control-pill-text, var(--control-text)); color: var(--foreground); transition: background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard), opacity var(--duration-fast) var(--ease-standard); } .input-pill::placeholder { color: var(--surface-tint-35); } .control-surface { background: var(--control-surface-bg); border: 1px solid var(--control-surface-border); -webkit-backdrop-filter: var(--control-surface-blur); backdrop-filter: var(--control-surface-blur); -webkit-backdrop-filter: var(--control-surface-blur); } .control-surface:hover:not(:disabled, [data-disabled]) { background: var(--control-surface-bg-hover); } .input-pill:focus-visible { outline: none; border-color: var(--color-accent-opaque, var(--focus-ring-color)); box-shadow: 0 0 0 2px var(--color-accent, color-mix(in srgb, var(--focus-ring-color) 30%, transparent)); } .input-pill:where(:user-invalid, [aria-invalid="true"]) { border-color: var(--destructive); background: color-mix(in srgb, var(--destructive) 8%, var(--glass-bg-quiet)); } .input-pill:where(:user-valid) { border-color: var(--success); } .input-pill:where(:user-invalid, [aria-invalid="true"]):focus-visible { border-color: var(--destructive); box-shadow: var(--invalid-ring); } .input-pill[data-autosize] { field-sizing: content; width: 100%; min-block-size: 3lh; max-block-size: var(--textarea-autosize-max, 12lh); resize: vertical; } .input-pill:disabled { opacity: 0.5; cursor: not-allowed; } .glass-wash[role="combobox"] { border-color: var(--surface-tint-15); } }
+@layer components { .input-pill { @apply flex w-full; height: var(--control-pill-h, var(--control-h-md)); border-radius: var(--radius-pill); border: 1.5px solid var(--control-surface-border); background: var(--control-surface-bg); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--control-surface-blur)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--control-surface-blur)); padding: 0 calc(1rem * var(--ui-scale)); font-size: var(--control-pill-text, var(--control-text)); color: var(--foreground); transition: background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard), opacity var(--duration-fast) var(--ease-standard); } .input-pill::placeholder { color: var(--surface-tint-35); } .control-surface { background: var(--control-surface-bg); border: 1px solid var(--control-surface-border); -webkit-backdrop-filter: var(--glass-cell-backdrop-filter, var(--control-surface-blur)); backdrop-filter: var(--glass-cell-backdrop-filter, var(--control-surface-blur)); } .control-surface:hover:not(:disabled, [data-disabled]) { background: var(--control-surface-bg-hover); } .input-pill:focus-visible { outline: none; border-color: var(--color-accent-opaque, var(--focus-ring-color)); box-shadow: 0 0 0 2px var(--color-accent, color-mix(in srgb, var(--focus-ring-color) 30%, transparent)); } .input-pill:where(:user-invalid, [aria-invalid="true"]) { border-color: var(--destructive); background: color-mix(in srgb, var(--destructive) 8%, var(--glass-bg-quiet)); } .input-pill:where(:user-valid) { border-color: var(--success); } .input-pill:where(:user-invalid, [aria-invalid="true"]):focus-visible { border-color: var(--destructive); box-shadow: var(--invalid-ring); } .input-pill:disabled { opacity: 0.5; cursor: not-allowed; } .glass-wash[role="combobox"] { border-color: var(--surface-tint-15); } }

package/dist/styles/glass/defined.css

@@ -1 +1 @@
-@layer components { .glass-defined, .btn-glass, .input-pill, .control-surface { --glass-definition: 1; --glass-floor-fill: color-mix( in srgb, var(--card) calc(var(--glass-definition) * var(--glass-floor-fill-max)), transparent ); --glass-border-defined: color-mix( in srgb, var(--foreground) calc(var(--glass-definition) * 14%), transparent ); background-color: transparent; background-image: linear-gradient( var(--glass-defined-plate, var(--glass-plate-tinted)), var(--glass-defined-plate, var(--glass-plate-tinted)) ), linear-gradient(var(--glass-floor-fill), var(--glass-floor-fill)); border-color: var(--glass-border-defined); } .btn-glass { --glass-defined-plate: var(--glass-fill); } .input-pill, .control-surface { --glass-defined-plate: var(--control-surface-bg); } }
+@layer components { .glass-defined, .input-pill, .control-surface { --glass-definition: 1; --glass-floor-fill: color-mix( in srgb, var(--card) calc(var(--glass-definition) * var(--glass-floor-fill-max)), transparent ); --glass-border-defined: color-mix( in srgb, var(--foreground) calc(var(--glass-definition) * 14%), transparent ); background-color: transparent; background-image: linear-gradient( var(--glass-defined-plate, var(--glass-plate-tinted)), var(--glass-defined-plate, var(--glass-plate-tinted)) ), linear-gradient(var(--glass-floor-fill), var(--glass-floor-fill)); border-color: var(--glass-border-defined); } .input-pill, .control-surface { --glass-defined-plate: var(--control-surface-bg); } }