@mhmo91/schmancy 0.10.23 → 0.10.25

package/dist/directives-BBMqe8x3.js

@@ -0,0 +1,4082 @@
+import { t as e } from "./audio-CxO5a2HL.js";
+import { _ as t, d as n, f as r, l as i, u as a } from "./animation-DCznELuT.js";
+import { t as o } from "./reduced-motion-D-L12p7G.js";
+import "./cursor-glow-Ah7VXSj7.js";
+import { i as s, n as c, r as l } from "./theme.service-Bh08uOSJ.js";
+import { t as u } from "./layout-DSAjo92m.js";
+import { t as d } from "./overlay-stack-D2rgxQLh.js";
+import { r as f } from "./discovery.service-COmbHaoI.js";
+import "./magnetic-mHXl54Z8.js";
+import { BehaviorSubject as p, EMPTY as m, Observable as h, Subject as g, Subscription as _, animationFrameScheduler as v, combineLatest as y, concat as b, debounceTime as x, defer as S, filter as C, forkJoin as ee, from as w, fromEvent as T, interval as E, merge as te, of as ne, takeUntil as re, timer as D } from "rxjs";
+import { auditTime as ie, catchError as O, debounceTime as ae, delay as oe, distinctUntilChanged as k, filter as A, finalize as se, first as ce, map as j, observeOn as le, repeat as ue, skip as de, startWith as fe, switchMap as M, take as N, takeUntil as P, takeWhile as F, tap as I } from "rxjs/operators";
+import { noChange as L, nothing as R } from "lit";
+import { AsyncDirective as z, directive as B } from "lit/async-directive.js";
+import { Directive as V, PartType as H, directive as U } from "lit/directive.js";
+var pe = {
+	smooth: n,
+	snappy: r,
+	bouncy: i,
+	gentle: a
+}, me = B(class extends z {
+	constructor(...e) {
+		super(...e), this.element = null, this.originalContent = "", this.animations = [], this.disconnecting$ = new g(), this.initialized = !1;
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t]) {
+		return this.element = e.element, this.initialized || (this.initialized = !0, this.disconnecting$.closed && (this.disconnecting$ = new g()), t.text === void 0 ? this.originalContent = this.element.textContent || "" : (this.originalContent = t.text, this.element.textContent = t.text), this.element.style.willChange = "transform, opacity", t.animation === "typewriter" ? this.element.textContent = "" : this.element.style.opacity = "0", this.initialize(t)), L;
+	}
+	disconnected() {
+		this.cleanup();
+	}
+	reconnected() {
+		this.element && (this.element.style.willChange = "transform, opacity");
+	}
+	initialize(e) {
+		let { animation: t, delay: n = 0, duration: r, stagger: i, preset: a = "snappy", restart: o = !1 } = e, s = pe[a], c = r ?? s.duration, l = i ?? (t === "cyber-glitch" ? 30 : 50), u = this.createVisibilityObservable$();
+		(o ? u.pipe(M((e) => e ? D(n).pipe(M(() => this.runAnimation$(t, c, l, s))) : S(() => (this.resetToInitial(t), m)))) : u.pipe(A((e) => e), N(1), oe(n), M(() => this.runAnimation$(t, c, l, s)))).pipe(P(this.disconnecting$)).subscribe();
+	}
+	cleanup() {
+		this.disconnecting$.next(), this.disconnecting$.complete(), this.cancelAnimations(), this.element && (this.element.textContent = this.originalContent, this.element.style.opacity = "", this.element.style.willChange = "auto", this.element.style.transform = "", this.element.style.filter = ""), this.element = null, this.initialized = !1;
+	}
+	cancelAnimations() {
+		this.animations.forEach((e) => e.cancel()), this.animations = [];
+	}
+	resetToInitial(e) {
+		this.cancelAnimations(), this.element && (e === "typewriter" ? this.element.textContent = "" : (this.element.textContent = this.originalContent, this.element.style.opacity = "0"), this.element.style.transform = "", this.element.style.filter = "", this.element.style.willChange = "transform, opacity");
+	}
+	getAccumulatedOpacity() {
+		if (!this.element) return 0;
+		let e = 1, t = this.element.parentElement, n = 0;
+		for (; t && t !== document.body && n < 10;) {
+			let r = window.getComputedStyle(t);
+			if (r.visibility === "hidden" || r.display === "none") return 0;
+			let i = parseFloat(r.opacity) || 1;
+			if (i < 1 && (e *= i, e <= .5)) return e;
+			if (t.assignedSlot) {
+				let n = this.getSlotAncestorOpacity(t.assignedSlot);
+				if (n === 0) return 0;
+				e *= n;
+			}
+			t = t.parentElement, n++;
+		}
+		return e;
+	}
+	getSlotAncestorOpacity(e) {
+		let t = 1, n = e.parentElement;
+		for (; n;) {
+			let e = window.getComputedStyle(n);
+			if (e.visibility === "hidden" || e.display === "none") return 0;
+			t *= parseFloat(e.opacity) || 1, n = n.parentElement;
+		}
+		return t;
+	}
+	createVisibilityObservable$() {
+		let e = T(document, "visibilitychange").pipe(fe(null), j(() => document.visibilityState === "visible"), k());
+		return y([E(200).pipe(fe(0), j(() => {
+			if (!this.element) return !1;
+			let e = this.element.getBoundingClientRect();
+			return e.width > 0 && e.height > 0 && e.top < window.innerHeight && e.bottom > 0 && this.getAccumulatedOpacity() > .5;
+		}), k()), e]).pipe(j(([e, t]) => e && t), k());
+	}
+	runAnimation$(e, t, n, r) {
+		if (!this.element) return m;
+		switch (e) {
+			case "fade-up": return this.animateFadeUp$(t, r);
+			case "blur-reveal": return this.animateBlurReveal$(t, n, r);
+			case "word-reveal": return this.animateWordReveal$(t, n, r);
+			case "cyber-glitch": return this.animateCyberGlitch$(t, n, r);
+			case "typewriter": return this.animateTypewriter$(t);
+			default: return m;
+		}
+	}
+	animateFadeUp$(e, t) {
+		if (!this.element) return m;
+		let n = this.element.animate([{
+			opacity: 0,
+			transform: "translateY(30px)"
+		}, {
+			opacity: 1,
+			transform: "translateY(0)"
+		}], {
+			duration: e,
+			easing: t.easingFallback,
+			fill: "forwards"
+		});
+		return this.animations.push(n), w(n.finished).pipe(I(() => {
+			this.element && (this.element.style.opacity = "", this.element.style.transform = "", this.element.style.willChange = "auto");
+		}), O(() => m));
+	}
+	wrapTextNodes(e) {
+		let t = [], n = document.createDocumentFragment(), r = Array.from(e.childNodes);
+		for (let e of r) if (e.nodeType === Node.TEXT_NODE) {
+			let r = (e.textContent || "").split(/(\s+)/);
+			for (let e of r) if (/^\s+$/.test(e)) n.appendChild(document.createTextNode(e));
+			else if (e.length > 0) {
+				let r = document.createElement("span");
+				r.textContent = e, n.appendChild(r), t.push(r);
+			}
+		} else e instanceof HTMLElement && (n.appendChild(e), t.push(e));
+		return e.textContent = "", e.appendChild(n), t;
+	}
+	animateBlurReveal$(e, t, n) {
+		if (!this.element) return m;
+		let r = this.wrapTextNodes(this.element);
+		this.element.style.opacity = "1", r.forEach((r, i) => {
+			r.style.opacity = "0", r.style.display = "inline-block";
+			let a = r.animate([{
+				opacity: 0,
+				filter: "blur(8px)",
+				transform: "scale(0.9)"
+			}, {
+				opacity: 1,
+				filter: "blur(0)",
+				transform: "scale(1)"
+			}], {
+				duration: e,
+				easing: n.easingFallback,
+				delay: i * t,
+				fill: "forwards"
+			});
+			this.animations.push(a);
+		});
+		let i = this.animations[this.animations.length - 1];
+		return i ? w(i.finished).pipe(I(() => {
+			this.element && (this.element.style.willChange = "auto", r.forEach((e) => {
+				e.style.willChange = "auto";
+			}));
+		}), O(() => m)) : m;
+	}
+	animateWordReveal$(e, t, n) {
+		if (!this.element) return m;
+		let r = this.wrapTextNodes(this.element);
+		this.element.style.opacity = "1", r.forEach((r, i) => {
+			r.style.opacity = "0", r.style.display = "inline-block";
+			let a = r.animate([{
+				opacity: 0,
+				transform: "translateY(20px)"
+			}, {
+				opacity: 1,
+				transform: "translateY(0)"
+			}], {
+				duration: e,
+				easing: n.easingFallback,
+				delay: i * t,
+				fill: "forwards"
+			});
+			this.animations.push(a);
+		});
+		let i = this.animations[this.animations.length - 1];
+		return i ? w(i.finished).pipe(I(() => {
+			this.element && (this.element.style.willChange = "auto", r.forEach((e) => {
+				e.style.willChange = "auto";
+			}));
+		}), O(() => m)) : m;
+	}
+	animateCyberGlitch$(e, t, n) {
+		if (!this.element) return m;
+		let r = this.originalContent.split(""), i = document.createDocumentFragment(), a = [];
+		for (let e of r) {
+			let t = document.createElement("span");
+			t.style.display = "inline-block", t.style.opacity = "0", t.textContent = e === " " ? "\xA0" : e, i.appendChild(t), a.push(t);
+		}
+		this.element.textContent = "", this.element.appendChild(i), this.element.style.opacity = "1", a.forEach((i, a) => {
+			if (r[a] === " ") return void (i.style.opacity = "1");
+			let o = i.animate([{
+				opacity: 0,
+				transform: "translateY(-8px) scale(1.4)",
+				filter: "blur(4px)"
+			}, {
+				opacity: 1,
+				transform: "translateY(0) scale(1)",
+				filter: "blur(0)"
+			}], {
+				duration: e,
+				easing: n.easingFallback,
+				delay: a * t,
+				fill: "forwards"
+			});
+			this.animations.push(o);
+		});
+		let o = this.animations[this.animations.length - 1];
+		return o ? w(o.finished).pipe(I(() => {
+			this.element && (this.element.style.willChange = "auto", a.forEach((e) => {
+				e.style.willChange = "auto";
+			}));
+		}), O(() => m)) : m;
+	}
+	animateTypewriter$(e) {
+		if (!this.element) return m;
+		let t = this.originalContent, n = t.length;
+		if (n === 0) return m;
+		let r = 0;
+		return E(e / n).pipe(I(() => {
+			r++, this.element && (this.element.textContent = t.slice(0, r));
+		}), F(() => r < n), se(() => {
+			this.element && (this.element.textContent = this.originalContent, this.element.style.willChange = "auto");
+		}));
+	}
+}), he = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null;
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t = ""]) {
+		let n = e.element;
+		if (!t) return this.cleanup(), L;
+		if (this.state) return L;
+		this.state = {
+			message: t,
+			element: n,
+			badge: null,
+			animation: null
+		}, getComputedStyle(n).position === "static" && (n.style.position = "relative");
+		let r = document.createElement("div");
+		return r.style.cssText = "\n			display: block;\n			position: absolute;\n			bottom: -8px;\n			left: 8px;\n			z-index: 10;\n			padding: 3px 10px;\n			border-radius: 12px;\n			font-size: 0.65rem;\n			font-weight: 600;\n			background: linear-gradient(\n				135deg,\n				var(--md-sys-color-primary, #7c5cff),\n				var(--md-sys-color-primary-container, #6750a4)\n			);\n			color: var(--md-sys-color-on-primary, #fff);\n			box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);\n			white-space: nowrap;\n		", r.textContent = `✦ ${t}`, r.title = t, n.appendChild(r), this.state.badge = r, this.state.animation = r.animate([
+			{ transform: "scale(1)" },
+			{ transform: "scale(1.03)" },
+			{ transform: "scale(1)" }
+		], {
+			duration: 2e3,
+			easing: "ease-in-out",
+			iterations: Infinity
+		}), L;
+	}
+	cleanup() {
+		this.state &&= (this.state.animation?.cancel(), this.state.badge?.remove(), null);
+	}
+	disconnected() {
+		this.cleanup();
+	}
+});
+function W(e) {
+	let t = document.createElement("div");
+	return t.className = `art-overlay ${e}`, t.style.cssText = "\n		position: absolute;\n		top: 0;\n		left: 0;\n		width: 100%;\n		height: 100%;\n		pointer-events: none;\n		z-index: 1000;\n		overflow: hidden;\n	", t;
+}
+function G() {
+	let e = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+	return e.setAttribute("width", "100%"), e.setAttribute("height", "100%"), e.setAttribute("viewBox", "0 0 100 100"), e.setAttribute("preserveAspectRatio", "none"), e.style.cssText = "\n		position: absolute;\n		top: 0;\n		left: 0;\n		width: 100%;\n		height: 100%;\n	", e;
+}
+var ge = class {
+	constructor(e, t = 10) {
+		this.pool = [], this.active = /* @__PURE__ */ new Set(), this.factory = e;
+		for (let n = 0; n < t; n++) this.pool.push(e());
+	}
+	acquire() {
+		let e = this.pool.pop();
+		return e ||= this.factory(), this.active.add(e), e;
+	}
+	release(e) {
+		this.active.delete(e), e.setAttribute("opacity", "0"), this.pool.push(e);
+	}
+	clear() {
+		this.active.forEach((e) => this.release(e));
+	}
+	get activeCount() {
+		return this.active.size;
+	}
+};
+function K(e, t, n, r) {
+	return `#${(1 << 24 | Math.round(e + (255 - e) * r) << 16 | Math.round(t + (255 - t) * r) << 8 | Math.round(n + (255 - n) * r)).toString(16).slice(1)}`;
+}
+function _e(e) {
+	let [t, n, r] = function(e) {
+		let t = e.replace("#", ""), n = parseInt(t.length === 3 ? t.split("").map((e) => e + e).join("") : t, 16);
+		return [
+			n >> 16 & 255,
+			n >> 8 & 255,
+			255 & n
+		];
+	}(e);
+	return [
+		K(t, n, r, .92),
+		K(t, n, r, .8),
+		K(t, n, r, .65),
+		K(t, n, r, .5),
+		K(t, n, r, .35),
+		K(t, n, r, .18),
+		e
+	];
+}
+var ve = [
+	"M 2,0.4 A 1.6,1.6 0 1,1 2,3.6 A 1.6,1.6 0 1,1 2,0.4 Z",
+	"M 2,0.2 L 3.8,2 L 2,3.8 L 0.2,2 Z",
+	"M 2,0.3 L 3.5,1.15 L 3.5,2.85 L 2,3.7 L 0.5,2.85 L 0.5,1.15 Z",
+	"M 2,0.3 L 3.7,3.4 L 0.3,3.4 Z",
+	"M 1.4,0.4 L 2.6,0.4 L 2.6,1.4 L 3.6,1.4 L 3.6,2.6 L 2.6,2.6 L 2.6,3.6 L 1.4,3.6 L 1.4,2.6 L 0.4,2.6 L 0.4,1.4 L 1.4,1.4 Z",
+	"M 2,0 A 2,2 0 1,1 2,4 A 2,2 0 1,1 2,0 Z M 2,0.8 A 1.2,1.2 0 1,0 2,3.2 A 1.2,1.2 0 1,0 2,0.8 Z",
+	"M 0.4,1.6 L 3.6,1.6 L 3.6,2.4 L 0.4,2.4 Z"
+], ye = [
+	{
+		scale: .8,
+		fallSpeed: .12,
+		windSensitivity: 2.2,
+		tumbleSpeed: .6
+	},
+	{
+		scale: 1.2,
+		fallSpeed: .18,
+		windSensitivity: 1.6,
+		tumbleSpeed: .5
+	},
+	{
+		scale: 1.6,
+		fallSpeed: .25,
+		windSensitivity: 1.2,
+		tumbleSpeed: .35
+	}
+], be = [
+	{
+		opacity: .12,
+		blur: .8
+	},
+	{
+		opacity: .2,
+		blur: .3
+	},
+	{
+		opacity: .3,
+		blur: 0
+	}
+], xe = [
+	{
+		x: 0,
+		xRange: 15,
+		vx: .3
+	},
+	{
+		x: 15,
+		xRange: 25,
+		vx: .1
+	},
+	{
+		x: 40,
+		xRange: 20,
+		vx: 0
+	},
+	{
+		x: 60,
+		xRange: 25,
+		vx: -.1
+	},
+	{
+		x: 85,
+		xRange: 15,
+		vx: -.3
+	}
+];
+function Se(e) {
+	let { element: t, color: n } = e, r = W("howl-overlay"), i = G(), a = document.createElementNS("http://www.w3.org/2000/svg", "g"), o = [
+		{
+			cx: 15,
+			cy: 20,
+			r: 8,
+			teeth: 12,
+			speed: .5
+		},
+		{
+			cx: 85,
+			cy: 25,
+			r: 6,
+			teeth: 10,
+			speed: -.7
+		},
+		{
+			cx: 30,
+			cy: 80,
+			r: 10,
+			teeth: 16,
+			speed: .4
+		},
+		{
+			cx: 75,
+			cy: 75,
+			r: 7,
+			teeth: 12,
+			speed: -.6
+		}
+	].map((e) => {
+		let t = document.createElementNS("http://www.w3.org/2000/svg", "g");
+		t.style.transformOrigin = `${e.cx}% ${e.cy}%`, t.style.willChange = "transform";
+		let r = document.createElementNS("http://www.w3.org/2000/svg", "path");
+		return r.setAttribute("d", function(e, t, n, r) {
+			let i = n - .2 * n, a = "";
+			for (let o = 0; o < r; o++) {
+				let s = o / r * Math.PI * 2, c = (o + .4) / r * Math.PI * 2, l = (o + .6) / r * Math.PI * 2, u = (o + 1) / r * Math.PI * 2;
+				o === 0 && (a += `M ${e + i * Math.cos(s)},${t + i * Math.sin(s)} `), a += `L ${e + n * Math.cos(c)},${t + n * Math.sin(c)} L ${e + n * Math.cos(l)},${t + n * Math.sin(l)} L ${e + i * Math.cos(u)},${t + i * Math.sin(u)} `;
+			}
+			return a + "Z";
+		}(e.cx, e.cy, e.r, e.teeth)), r.setAttribute("fill", n), r.setAttribute("opacity", "0.3"), r.style.mixBlendMode = "screen", t.appendChild(r), a.appendChild(t), {
+			element: t,
+			speed: e.speed
+		};
+	}), s = document.createElementNS("http://www.w3.org/2000/svg", "g"), c = [];
+	for (let e = 0; e < 6; e++) {
+		let e = document.createElementNS("http://www.w3.org/2000/svg", "path"), t = 10 + 80 * Math.random(), r = 10 + 80 * Math.random(), i = .3 + .5 * Math.random(), a = `M ${t},${r - i} L ${t + .3 * i},${r} L ${t},${r + i} L ${t - .3 * i},${r} Z`;
+		e.setAttribute("d", a), e.setAttribute("fill", n), e.style.mixBlendMode = "screen", e.style.willChange = "opacity, transform", s.appendChild(e), c.push({
+			element: e,
+			baseX: t,
+			baseY: r,
+			phase: Math.random() * Math.PI * 2,
+			speed: .5 + 1.5 * Math.random()
+		});
+	}
+	let l = document.createElementNS("http://www.w3.org/2000/svg", "g"), u = [];
+	for (let e = 0; e < 4; e++) {
+		let e = document.createElementNS("http://www.w3.org/2000/svg", "polygon"), t = 20 + 60 * Math.random(), r = 20 + 60 * Math.random(), i = .8 + 1.2 * Math.random();
+		e.setAttribute("points", `${t},${r - i} ${t + .6 * i},${r} ${t},${r + i} ${t - .6 * i},${r}`), e.setAttribute("fill", n), e.style.mixBlendMode = "screen", e.style.willChange = "transform, opacity", l.appendChild(e), u.push({
+			element: e,
+			baseX: t,
+			baseY: r,
+			phase: Math.random() * Math.PI * 2,
+			rotSpeed: .5 + Math.random()
+		});
+	}
+	i.appendChild(a), i.appendChild(s), i.appendChild(l), r.appendChild(i), t.appendChild(r), e.overlayElement = r, e.howl = {
+		gears: o,
+		sparkles: c,
+		steamPool: new ge(() => {
+			let e = document.createElementNS("http://www.w3.org/2000/svg", "circle");
+			return e.setAttribute("fill", n), e.style.mixBlendMode = "screen", e.style.willChange = "transform, opacity", i.appendChild(e), e;
+		}, 12),
+		steamParticles: [],
+		wisps: [],
+		crystals: u,
+		lastSteamSpawn: performance.now(),
+		startTime: performance.now()
+	};
+}
+function Ce(e, t) {
+	if (!e.error) return;
+	let { edges: n, staticParticles: r, boltPool: i, lightningBolts: a, startTime: o } = e.error, s = (t - o) % 2500 / 2500, c = .08 + .17 * (.5 * Math.sin(s * Math.PI * 4) + .5);
+	if (n.forEach((e) => e.setAttribute("opacity", c.toFixed(3))), r.forEach((e, t) => {
+		let n = (s + .125 * t) % 1, r = 0, i = 0;
+		switch (e.edge) {
+			case 0:
+				r = 100 * Math.random(), i = 5 * Math.random();
+				break;
+			case 1:
+				r = 95 + 5 * Math.random(), i = 100 * Math.random();
+				break;
+			case 2:
+				r = 100 * Math.random(), i = 95 + 5 * Math.random();
+				break;
+			case 3: r = 5 * Math.random(), i = 100 * Math.random();
+		}
+		e.element.setAttribute("cx", r.toString()), e.element.setAttribute("cy", i.toString());
+		let a = .5 * Math.sin(n * Math.PI * 2) + .5;
+		e.element.setAttribute("opacity", (.35 * a).toFixed(3));
+	}), t - e.error.lastLightningSpawn > 1500 && i.activeCount < 3) {
+		let n = i.acquire(), r = 0, o = 0, s = 0, c = 0;
+		switch (Math.floor(4 * Math.random())) {
+			case 0:
+				r = 100 * Math.random(), o = 0, s = 100 * Math.random(), c = 50;
+				break;
+			case 1:
+				r = 100, o = 100 * Math.random(), s = 70, c = 100 * Math.random();
+				break;
+			case 2:
+				r = 100 * Math.random(), o = 100, s = 100 * Math.random(), c = 50;
+				break;
+			case 3: r = 0, o = 100 * Math.random(), s = 30, c = 100 * Math.random();
+		}
+		n.setAttribute("d", function(e, t, n, r) {
+			let i = `M ${e.toFixed(1)},${t.toFixed(1)}`, a = (n - e) / 4, o = (r - t) / 4, s = e, c = t;
+			for (let e = 1; e < 4; e++) {
+				let e = 3 + 5 * Math.random();
+				s += a + -o * e * (Math.random() - .5), c += o + a * e * (Math.random() - .5), i += ` L ${s.toFixed(1)},${c.toFixed(1)}`;
+			}
+			return i + ` L ${n.toFixed(1)},${r.toFixed(1)}`;
+		}(r, o, s, c)), a.push({
+			element: n,
+			x: 0,
+			y: 0,
+			vx: 0,
+			vy: 0,
+			life: 1
+		}), e.error.lastLightningSpawn = t;
+	}
+	for (let e = a.length - 1; e >= 0; e--) {
+		let t = a[e];
+		t.life -= .05;
+		let n = t.life > .8 ? .7 : .875 * t.life;
+		t.element.setAttribute("opacity", Math.max(0, n).toFixed(3)), t.life <= 0 && (i.release(t.element), a.splice(e, 1));
+	}
+}
+var we = [
+	"#FFFFFF",
+	"#F8FCFF",
+	"#E8F4FF",
+	"#F0F8FF",
+	"#FAFEFF",
+	"#E0F0FF",
+	"#D4A574",
+	"#C19A6B",
+	"#8B4513",
+	"#CD853F"
+], Te = [
+	"M 2,0 L 2.15,1.7 L 3.7,0.8 L 2.3,2 L 3.7,3.2 L 2.15,2.3 L 2,4 L 1.85,2.3 L 0.3,3.2 L 1.7,2 L 0.3,0.8 L 1.85,1.7 Z",
+	"M 2,0.2 L 2.2,1.6 L 3.4,0.6 L 2.4,1.8 L 3.8,2 L 2.4,2.2 L 3.4,3.4 L 2.2,2.4 L 2,3.8 L 1.8,2.4 L 0.6,3.4 L 1.6,2.2 L 0.2,2 L 1.6,1.8 L 0.6,0.6 L 1.8,1.6 Z",
+	"M 2,0.3 L 2.3,1.2 L 3.2,0.8 L 2.6,1.6 L 3.6,1.8 L 2.7,2.1 L 3.3,2.8 L 2.4,2.5 L 2,3.7 L 1.6,2.5 L 0.7,2.8 L 1.3,2.1 L 0.4,1.8 L 1.4,1.6 L 0.8,0.8 L 1.7,1.2 Z",
+	"M 2,0.4 L 2.12,1.8 L 3.6,2 L 2.12,2.2 L 2,3.6 L 1.88,2.2 L 0.4,2 L 1.88,1.8 Z",
+	"M 2,0.5 C 2.8,0.8 3.2,1.4 3.4,2 C 3.2,2.6 2.8,3.2 2,3.5 C 1.2,3.2 0.8,2.6 0.6,2 C 0.8,1.4 1.2,0.8 2,0.5 Z",
+	"M 2,0.2 L 2.1,1.5 L 2.8,0.5 L 2.25,1.6 L 3.5,1.2 L 2.35,1.85 L 3.8,2 L 2.35,2.15 L 3.5,2.8 L 2.25,2.4 L 2.8,3.5 L 2.1,2.5 L 2,3.8 L 1.9,2.5 L 1.2,3.5 L 1.75,2.4 L 0.5,2.8 L 1.65,2.15 L 0.2,2 L 1.65,1.85 L 0.5,1.2 L 1.75,1.6 L 1.2,0.5 L 1.9,1.5 Z",
+	"M 2,0.4 C 2.6,1 3,1.6 3.1,2.2 C 3,2.8 2.6,3.2 2,3.6 C 1.4,3.2 1,2.8 0.9,2.2 C 1,1.6 1.4,1 2,0.4 Z",
+	"M 2,0.8 L 2.15,1.7 L 3.2,2 L 2.15,2.3 L 2,3.2 L 1.85,2.3 L 0.8,2 L 1.85,1.7 Z"
+], Ee = [
+	{
+		scale: .7,
+		fallSpeed: .03,
+		windSensitivity: 2.8,
+		tumbleSpeed: .15
+	},
+	{
+		scale: 1,
+		fallSpeed: .05,
+		windSensitivity: 2.2,
+		tumbleSpeed: .2
+	},
+	{
+		scale: 1.4,
+		fallSpeed: .07,
+		windSensitivity: 1.6,
+		tumbleSpeed: .15
+	}
+], De = [
+	{
+		opacity: .2,
+		blur: .8
+	},
+	{
+		opacity: .35,
+		blur: .3
+	},
+	{
+		opacity: .55,
+		blur: 0
+	}
+], Oe = [
+	{
+		x: 0,
+		xRange: 20,
+		vx: .2
+	},
+	{
+		x: 20,
+		xRange: 20,
+		vx: .1
+	},
+	{
+		x: 40,
+		xRange: 20,
+		vx: 0
+	},
+	{
+		x: 60,
+		xRange: 20,
+		vx: -.1
+	},
+	{
+		x: 80,
+		xRange: 20,
+		vx: -.2
+	}
+];
+function ke(e) {
+	let { element: t } = e, n = W("starfield-overlay"), r = document.createElement("div");
+	r.style.cssText = "position:absolute;bottom:0;right:0;width:66vw;height:66vw;", n.appendChild(r);
+	let i = Array.from({ length: 6 }, (e, t) => {
+		let n = [];
+		for (let e = 0; e < 7; e++) {
+			let e = 96 * Math.random() + 2, t = 94 * Math.random() + 3, r = .8 + 1.5 * Math.random(), i = .3 + .7 * Math.random();
+			n.push(`radial-gradient(circle ${r}px at ${e}% ${t}%, rgba(255,255,255,${i}) 0%, transparent 100%)`);
+		}
+		let r = .6 * t;
+		return {
+			bg: n.join(","),
+			appearDelay: r,
+			twinkleDuration: 5 + .7 * t,
+			twinkleDelay: r + 2.5
+		};
+	}), a = [];
+	for (let e of i) {
+		let t = document.createElement("div");
+		t.style.cssText = `position:absolute;inset:0;opacity:0;will-change:opacity;background:${e.bg};`, r.appendChild(t), a.push({
+			element: t,
+			appearDelay: e.appearDelay,
+			twinkleDuration: e.twinkleDuration,
+			twinkleDelay: e.twinkleDelay
+		});
+	}
+	t.appendChild(n), e.overlayElement = n, e.starfield = {
+		groups: a,
+		startTime: performance.now()
+	};
+}
+var Ae = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null;
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t]) {
+		let n = e.element, { name: r, color: i, intensity: a = 1, speed: o = 1 } = t;
+		if (!this.state || this.state.effect === r && this.state.color === i && this.state.intensity === a && this.state.speed === o || this.cleanup(), !this.state) {
+			let e = n.style.position;
+			this.state = {
+				effect: r,
+				color: i,
+				intensity: a,
+				speed: o,
+				element: n,
+				isVisible: !0,
+				initialized: !1,
+				originalPosition: e
+			}, requestAnimationFrame(() => {
+				if (!this.state) return;
+				let e = n.getBoundingClientRect();
+				if (!(e.top < window.innerHeight && e.bottom > 0 && e.left < window.innerWidth && e.right > 0)) return this.state.isVisible = !1, void this.setupVisibilityObserver();
+				this.initializeResources(), this.startAnimation(), this.setupVisibilityObserver();
+			});
+		}
+		return L;
+	}
+	initializeResources() {
+		if (!this.state || this.state.initialized) return;
+		let { element: e, effect: t } = this.state;
+		switch (getComputedStyle(e).position === "static" && (e.style.position = "relative"), t) {
+			case "funkhaus":
+				(function(e) {
+					let { element: t, color: n } = e, r = W("funkhaus-overlay"), i = G(), a = function(e, t, n, r) {
+						let i = "";
+						for (let e = 0; e <= t; e++) {
+							let t = e * r;
+							i += `M 0,${t} L 100,${t} `;
+						}
+						for (let t = 0; t <= e; t++) {
+							let e = t * n;
+							i += `M ${e},0 L ${e},100 `;
+						}
+						return i;
+					}(5, 4, 20, 25), o = document.createElementNS("http://www.w3.org/2000/svg", "path");
+					o.setAttribute("d", a), o.setAttribute("stroke", n), o.setAttribute("stroke-width", "0.15"), o.setAttribute("opacity", "0.2"), o.setAttribute("fill", "none");
+					let s = document.createElementNS("http://www.w3.org/2000/svg", "g");
+					s.id = "window-panes", s.style.mixBlendMode = "screen";
+					let c = [];
+					for (let e = 0; e < 4; e++) for (let t = 0; t < 5; t++) {
+						let r = document.createElementNS("http://www.w3.org/2000/svg", "rect");
+						r.setAttribute("x", (t * 20).toString()), r.setAttribute("y", (e * 25).toString()), r.setAttribute("width", "20"), r.setAttribute("height", "25"), r.setAttribute("fill", n), r.setAttribute("opacity", "0"), r.style.willChange = "opacity", c.push({
+							element: r,
+							diagonalIndex: e + t
+						}), s.appendChild(r);
+					}
+					i.appendChild(s), i.appendChild(o), r.appendChild(i), t.appendChild(r), e.overlayElement = r, e.funkhaus = {
+						panes: c,
+						maxDiagonal: 7,
+						startTime: performance.now()
+					};
+				})(this.state);
+				break;
+			case "samwa":
+				(function(e) {
+					let { element: t, color: n } = e, r = W("samwa-overlay"), i = G();
+					r.appendChild(i), t.appendChild(r);
+					let a = _e(n), o = 0;
+					e.overlayElement = r, e.samwa = {
+						leafPool: new ge(() => {
+							let e = document.createElementNS("http://www.w3.org/2000/svg", "path"), t = o % ve.length;
+							return e.setAttribute("d", ve[t]), e.setAttribute("fill", a[t]), e.setAttribute("opacity", "0"), t === 5 && e.setAttribute("fill-rule", "evenodd"), e.style.mixBlendMode = "soft-light", e.style.willChange = "transform, opacity", e.style.transform = "translate(-100px, -100px)", i.appendChild(e), o++, e;
+						}, 18),
+						fallingLeaves: [],
+						windStrength: 0,
+						windDirection: 1,
+						lastWindTime: performance.now(),
+						lastLeafSpawn: performance.now(),
+						startTime: performance.now()
+					};
+				})(this.state);
+				break;
+			case "howl":
+				Se(this.state);
+				break;
+			case "error":
+				(function(e) {
+					let { element: t, color: n } = e, r = W("error-overlay"), i = G(), a = document.createElementNS("http://www.w3.org/2000/svg", "g"), o = [
+						{
+							x: 0,
+							y: 0,
+							width: 100,
+							height: .5
+						},
+						{
+							x: 0,
+							y: 99.5,
+							width: 100,
+							height: .5
+						},
+						{
+							x: 0,
+							y: 0,
+							width: .5,
+							height: 100
+						},
+						{
+							x: 99.5,
+							y: 0,
+							width: .5,
+							height: 100
+						}
+					].map((e) => {
+						let t = document.createElementNS("http://www.w3.org/2000/svg", "rect");
+						return t.setAttribute("x", e.x.toString()), t.setAttribute("y", e.y.toString()), t.setAttribute("width", e.width.toString()), t.setAttribute("height", e.height.toString()), t.setAttribute("fill", n), t.style.mixBlendMode = "screen", t.style.willChange = "opacity", a.appendChild(t), t;
+					}), s = document.createElementNS("http://www.w3.org/2000/svg", "g"), c = [];
+					for (let e = 0; e < 4; e++) {
+						let t = document.createElementNS("http://www.w3.org/2000/svg", "circle");
+						t.setAttribute("r", "0.3"), t.setAttribute("fill", n), t.style.mixBlendMode = "screen", t.style.willChange = "opacity", s.appendChild(t), c.push({
+							element: t,
+							edge: e % 4
+						});
+					}
+					i.appendChild(a), i.appendChild(s), r.appendChild(i), t.appendChild(r), e.overlayElement = r, e.error = {
+						edges: o,
+						staticParticles: c,
+						boltPool: new ge(() => {
+							let e = document.createElementNS("http://www.w3.org/2000/svg", "path");
+							return e.setAttribute("stroke", n), e.setAttribute("stroke-width", "0.5"), e.setAttribute("fill", "none"), e.style.mixBlendMode = "screen", e.style.willChange = "opacity", i.appendChild(e), e;
+						}, 5),
+						lightningBolts: [],
+						lastLightningSpawn: performance.now(),
+						startTime: performance.now()
+					};
+				})(this.state);
+				break;
+			case "snow":
+				(function(e) {
+					let { element: t } = e, n = W("snow-overlay"), r = G();
+					n.appendChild(r), t.appendChild(n);
+					let i = 0;
+					e.overlayElement = n, e.snow = {
+						snowflakePool: new ge(() => {
+							let e = document.createElementNS("http://www.w3.org/2000/svg", "path"), t = i % Te.length, n = Math.floor(Math.random() * we.length);
+							return e.setAttribute("d", Te[t]), e.setAttribute("fill", we[n]), e.setAttribute("opacity", "0"), e.style.mixBlendMode = "soft-light", e.style.willChange = "transform, opacity", e.style.transform = "translate(-100px, -100px)", r.appendChild(e), i++, e;
+						}, 20),
+						fallingSnowflakes: [],
+						windStrength: 0,
+						windDirection: 1,
+						windPhase: Math.random() * Math.PI * 2,
+						lastWindGust: performance.now(),
+						lastSpawn: performance.now(),
+						startTime: performance.now()
+					};
+				})(this.state);
+				break;
+			case "starfield": ke(this.state);
+		}
+		this.state.initialized = !0;
+	}
+	setupVisibilityObserver() {
+		this.state && typeof IntersectionObserver < "u" && (this.state.observer = new IntersectionObserver((e) => {
+			if (!this.state) return;
+			let t = e[0].isIntersecting;
+			t && !this.state.isVisible ? (this.state.isVisible = !0, this.state.initialized || this.initializeResources(), this.startAnimation()) : !t && this.state.isVisible && (this.state.isVisible = !1, this.state.animationId && (cancelAnimationFrame(this.state.animationId), this.state.animationId = void 0));
+		}, { threshold: 0 }), this.state.observer.observe(this.state.element));
+	}
+	startAnimation() {
+		if (!this.state || !this.state.isVisible || this.state.animationId) return;
+		this.state.initialized || this.initializeResources();
+		let e = (t) => {
+			if (this.state && this.state.isVisible) {
+				switch (this.state.effect) {
+					case "funkhaus":
+						(function(e, t) {
+							if (!e.funkhaus) return;
+							let { panes: n, maxDiagonal: r, startTime: i } = e.funkhaus, { intensity: a = 1, speed: o = 1 } = e;
+							if (a <= 0) {
+								for (let e of n) e.element.getAttribute("opacity") !== "0" && e.element.setAttribute("opacity", "0");
+								return;
+							}
+							let s = 7e3 / o, c = (t - i) % s / s * 1.555, l = .18 * a;
+							for (let e = 0; e < n.length; e++) {
+								let t = n[e], i = t.diagonalIndex / r, a = Math.abs(i - c);
+								if (a > .5) {
+									t.element.getAttribute("opacity") !== "0" && t.element.setAttribute("opacity", "0");
+									continue;
+								}
+								let o = Math.exp(-a * a * 15.4320987654321);
+								o = o < .5 ? 4 * o * o * o : 1 - (-2 * o + 2) ** 3 / 2;
+								let s = o * l;
+								t.element.setAttribute("opacity", s.toFixed(3));
+							}
+						})(this.state, t);
+						break;
+					case "samwa":
+						(function(e, t) {
+							if (!e.samwa) return;
+							let { intensity: n = 1, speed: r = 1 } = e, { leafPool: i, fallingLeaves: a } = e.samwa;
+							if (n <= 0) {
+								for (let e of a) e.element.setAttribute("opacity", "0");
+								return;
+							}
+							if (t - e.samwa.lastWindTime > (4e3 + 4e3 * Math.random()) / r) {
+								let n = Math.random() < .3;
+								e.samwa.windStrength = n ? 1.5 : .8 + .4 * Math.random(), e.samwa.windDirection = Math.random() > .5 ? 1 : -1, e.samwa.lastWindTime = t;
+							}
+							let o = .1 * Math.sin(.001 * t);
+							e.samwa.windStrength = Math.max(0, e.samwa.windStrength - .008 + .002 * o);
+							let s = (800 + 1200 * Math.random()) / r, c = Math.max(1, Math.round(12 * n));
+							if (t - e.samwa.lastLeafSpawn > s && i.activeCount < c) {
+								let n = i.acquire(), r = [
+									.25,
+									.15,
+									.2,
+									.15,
+									.25
+								], o = Math.random(), s = 0;
+								for (let e = 0; e < r.length; e++) if (o -= r[e], o <= 0) {
+									s = e;
+									break;
+								}
+								let c = xe[s], l = Math.floor(Math.random() * ye.length), u = Math.floor(Math.random() * be.length), d = ye[l], f = {
+									element: n,
+									x: c.x + Math.random() * c.xRange,
+									y: -5 - 15 * Math.random(),
+									vx: .5 * c.vx + .1 * (Math.random() - .5),
+									vy: d.fallSpeed * (.85 + .3 * Math.random()),
+									life: 1,
+									rotation: 360 * Math.random(),
+									phase: Math.random() * Math.PI * 2,
+									sizeIndex: l,
+									depthIndex: u,
+									tumbleDirection: Math.random() > .5 ? 1 : -1,
+									flutterAmplitude: .15 + .25 * Math.random(),
+									flutterFrequency: .012 + .008 * Math.random(),
+									spawnTime: t
+								};
+								a.push(f), e.samwa.lastLeafSpawn = t;
+							}
+							let l = e.samwa.windStrength, u = e.samwa.windDirection;
+							for (let e = a.length - 1; e >= 0; e--) {
+								let o = a[e], s = ye[o.sizeIndex], c = be[o.depthIndex], d = l * u * s.windSensitivity * .6, f = Math.sin(o.y * o.flutterFrequency + o.phase) * o.flutterAmplitude, p = Math.sin(o.y * o.flutterFrequency * .5 + 1.3 * o.phase) * o.flutterAmplitude * .4, m = Math.sin(o.y * o.flutterFrequency * .25 + .7 * o.phase) * o.flutterAmplitude * .2;
+								o.vx += .01 * d, o.vx += .025 * (f + p + m), o.vx *= .97;
+								let h = .03 * Math.sin(3e-4 * t * r + o.phase);
+								o.vy = (s.fallSpeed + h) * r, o.x += o.vx, o.y += o.vy;
+								let g = s.tumbleSpeed * o.tumbleDirection * .7, _ = l * u * .8;
+								o.rotation += g + _ + f;
+								let v = t - o.spawnTime, y = c.opacity * n;
+								v < 600 && (y *= v / 600), o.y > 80 && (y *= 1 - (o.y - 80) / 30);
+								let b = s.scale * (.8 + c.opacity);
+								o.element.style.transform = `translate(${o.x.toFixed(1)}px, ${o.y.toFixed(1)}px) rotate(${o.rotation.toFixed(0)}deg) scale(${b.toFixed(2)})`, o.element.style.filter = c.blur > 0 ? `blur(${c.blur}px)` : "", o.element.setAttribute("opacity", Math.max(0, y).toFixed(3)), (o.y > 110 || o.x < -10 || o.x > 110) && (i.release(o.element), a.splice(e, 1));
+							}
+						})(this.state, t);
+						break;
+					case "howl":
+						(function(e, t) {
+							if (!e.howl) return;
+							let { gears: n, sparkles: r, crystals: i, steamPool: a, steamParticles: o, startTime: s } = e.howl, c = t - s, l = c % 17e3 / 17e3;
+							if (n.forEach((e) => {
+								let t = c / 80 * e.speed;
+								e.element.style.transform = `rotate(${t.toFixed(1)}deg)`;
+							}), r.forEach((e) => {
+								let t = .15 + .25 * Math.sin((l * e.speed + e.phase) * Math.PI * 2), n = .3 * Math.sin(c / 2e3 * e.speed + e.phase), r = .2 * Math.cos(c / 2e3 * e.speed + e.phase);
+								e.element.setAttribute("opacity", t.toFixed(3)), e.element.style.transform = `translate(${n.toFixed(2)}px, ${r.toFixed(2)}px)`;
+							}), i.forEach((e) => {
+								let t = 1.5 * Math.sin(c / 3500 * e.rotSpeed + e.phase), n = 1.2 * Math.cos(c / 4e3 * e.rotSpeed + e.phase), r = c / 120 * e.rotSpeed, i = .12 + .18 * Math.sin((l + e.phase / (2 * Math.PI)) * Math.PI * 2);
+								e.element.style.transform = `translate(${t.toFixed(1)}px, ${n.toFixed(1)}px) rotate(${r.toFixed(1)}deg)`, e.element.setAttribute("opacity", i.toFixed(3));
+							}), t - e.howl.lastSteamSpawn > 600 && a.activeCount < 12) {
+								let n = a.acquire();
+								o.push({
+									element: n,
+									x: 10 + 80 * Math.random(),
+									y: 105,
+									vx: .15 * (Math.random() - .5),
+									vy: -.25 - .25 * Math.random(),
+									life: 1,
+									scale: .5 + Math.random()
+								}), e.howl.lastSteamSpawn = t;
+							}
+							for (let e = o.length - 1; e >= 0; e--) {
+								let t = o[e];
+								t.x += t.vx, t.y += t.vy, t.life -= .008, t.scale += .02, t.element.style.transform = `translate(${t.x.toFixed(1)}px, ${t.y.toFixed(1)}px)`, t.element.setAttribute("r", t.scale.toFixed(2)), t.element.setAttribute("opacity", (.18 * t.life).toFixed(3)), (t.life <= 0 || t.y < -10) && (a.release(t.element), o.splice(e, 1));
+							}
+						})(this.state, t);
+						break;
+					case "error":
+						Ce(this.state, t);
+						break;
+					case "snow":
+						(function(e, t) {
+							if (!e.snow) return;
+							let { intensity: n = 1, speed: r = 1 } = e, { snowflakePool: i, fallingSnowflakes: a } = e.snow;
+							if (n <= 0) {
+								for (let e of a) e.element.setAttribute("opacity", "0");
+								return;
+							}
+							if (t - e.snow.lastWindGust > (8e3 + 8e3 * Math.random()) / r) {
+								let n = Math.random() < .15;
+								e.snow.windStrength = n ? .8 : .3 + .3 * Math.random(), e.snow.windDirection = Math.random() > .5 ? 1 : -1, e.snow.lastWindGust = t;
+							}
+							let o = .08 * Math.sin(5e-4 * t);
+							e.snow.windStrength = Math.max(0, e.snow.windStrength - .003 + .001 * o);
+							let s = (1200 + 1500 * Math.random()) / r, c = Math.max(2, Math.round(12 * n));
+							if (t - e.snow.lastSpawn > s && i.activeCount < c) {
+								let n = i.acquire(), r = Oe[Math.floor(Math.random() * Oe.length)], o = Math.floor(Math.random() * Ee.length), s = Math.floor(Math.random() * De.length), c = Ee[o], l = {
+									element: n,
+									x: r.x + Math.random() * r.xRange,
+									y: -5 - 15 * Math.random(),
+									vx: .5 * r.vx + .1 * (Math.random() - .5),
+									vy: c.fallSpeed * (.85 + .3 * Math.random()),
+									life: 1,
+									rotation: 360 * Math.random(),
+									phase: Math.random() * Math.PI * 2,
+									sizeIndex: o,
+									depthIndex: s,
+									tumbleDirection: Math.random() > .5 ? 1 : -1,
+									flutterAmplitude: .06 + .1 * Math.random(),
+									flutterFrequency: .008 + .005 * Math.random(),
+									spawnTime: t
+								};
+								a.push(l), e.snow.lastSpawn = t;
+							}
+							let l = e.snow.windStrength, u = e.snow.windDirection;
+							for (let e = a.length - 1; e >= 0; e--) {
+								let o = a[e], s = Ee[o.sizeIndex], c = De[o.depthIndex], d = l * u * s.windSensitivity * .4, f = Math.sin(o.y * o.flutterFrequency + o.phase) * o.flutterAmplitude, p = Math.sin(o.y * o.flutterFrequency * .5 + 1.3 * o.phase) * o.flutterAmplitude * .3;
+								o.vx += .006 * d, o.vx += .015 * (f + p), o.vx *= .985;
+								let m = .015 * Math.sin(2e-4 * t * r + o.phase);
+								o.vy = (s.fallSpeed + m) * r, o.x += o.vx, o.y += o.vy;
+								let h = s.tumbleSpeed * o.tumbleDirection * .4, g = l * u * .3;
+								o.rotation += h + g + .5 * f;
+								let _ = t - o.spawnTime, v = 1e3, y = c.opacity * n;
+								_ < v && (y *= _ / v), o.y > 75 && (y *= 1 - (o.y - 75) / 35);
+								let b = s.scale * (.8 + c.opacity);
+								o.element.style.transform = `translate(${o.x.toFixed(1)}px, ${o.y.toFixed(1)}px) rotate(${o.rotation.toFixed(0)}deg) scale(${b.toFixed(2)})`, o.element.style.filter = c.blur > 0 ? `blur(${c.blur}px)` : "", o.element.setAttribute("opacity", Math.max(0, y).toFixed(3)), (o.y > 110 || o.x < -10 || o.x > 110) && (i.release(o.element), a.splice(e, 1));
+							}
+						})(this.state, t);
+						break;
+					case "starfield": (function(e, t) {
+						if (!e.starfield) return;
+						let { intensity: n = 1, speed: r = 1 } = e, { groups: i, startTime: a } = e.starfield, o = (t - a) / 1e3 * r;
+						for (let e of i) {
+							if (n <= 0) {
+								e.element.style.opacity = "0";
+								continue;
+							}
+							let t = e.appearDelay, r;
+							if (o < t) r = 0;
+							else if (o < t + 2.5) r = 1 - (1 - (o - t) / 2.5) ** 3;
+							else {
+								let t = o - e.twinkleDelay;
+								if (t < 0) r = 1;
+								else {
+									let n = t % e.twinkleDuration / e.twinkleDuration;
+									r = n < .25 ? 1 - n / .25 * .4 : n < .5 ? .6 + (n - .25) / .25 * .25 : n < .75 ? .85 - (n - .5) / .25 * .3 : .55 + (n - .75) / .25 * .45;
+								}
+							}
+							e.element.style.opacity = (r * n).toFixed(3);
+						}
+					})(this.state, t);
+				}
+				this.state.animationId = requestAnimationFrame(e);
+			} else this.state && (this.state.animationId = void 0);
+		};
+		this.state.animationId = requestAnimationFrame(e);
+	}
+	cleanup() {
+		this.state &&= (this.state.animationId && cancelAnimationFrame(this.state.animationId), this.state.observer && this.state.observer.disconnect(), this.state.samwa && this.state.samwa.leafPool.clear(), this.state.howl && this.state.howl.steamPool.clear(), this.state.error && this.state.error.boltPool.clear(), this.state.snow && this.state.snow.snowflakePool.clear(), this.state.overlayElement && this.state.overlayElement.remove(), this.state.originalPosition !== void 0 && (this.state.element.style.position = this.state.originalPosition), null);
+	}
+	disconnected() {
+		this.cleanup();
+	}
+}), je = {
+	cyber: {
+		primary: "#00f0ff",
+		secondary: "#0099ff",
+		glow: "#00f0ff",
+		particle: "#00f0ff",
+		scanLine: "#00f0ff",
+		gridColor: "#00f0ff"
+	},
+	hologram: {
+		primary: "#00ff88",
+		secondary: "#00cc66",
+		glow: "#00ff88",
+		particle: "#00ff88",
+		scanLine: "#00ff88",
+		gridColor: "#00ff88"
+	},
+	plasma: {
+		primary: "#ff00ff",
+		secondary: "#cc00ff",
+		glow: "#ff00ff",
+		particle: "#ff00ff",
+		scanLine: "#ff00ff",
+		gridColor: "#ff00ff"
+	},
+	quantum: {
+		primary: "#8800ff",
+		secondary: "#6600cc",
+		glow: "#8800ff",
+		particle: "#8800ff",
+		scanLine: "#8800ff",
+		gridColor: "#8800ff"
+	},
+	matrix: {
+		primary: "#00ff00",
+		secondary: "#00cc00",
+		glow: "#00ff00",
+		particle: "#00ff00",
+		scanLine: "#00ff00",
+		gridColor: "#00ff00"
+	},
+	neon: {
+		primary: "#ff0080",
+		secondary: "#cc0066",
+		glow: "#ff0080",
+		particle: "#ff0080",
+		scanLine: "#ff0080",
+		gridColor: "#ff0080"
+	},
+	success: {
+		primary: "#00ff88",
+		secondary: "#00cc66",
+		glow: "#00ff88",
+		particle: "#00ff88",
+		scanLine: "#00ff88",
+		gridColor: "#00ff88"
+	},
+	warning: {
+		primary: "#ffaa00",
+		secondary: "#ff8800",
+		glow: "#ffaa00",
+		particle: "#ffaa00",
+		scanLine: "#ffaa00",
+		gridColor: "#ffaa00"
+	},
+	danger: {
+		primary: "#ff3366",
+		secondary: "#ff0044",
+		glow: "#ff3366",
+		particle: "#ff3366",
+		scanLine: "#ff3366",
+		gridColor: "#ff3366"
+	}
+}, Me = B(class extends z {
+	constructor(...e) {
+		super(...e), this.element = null, this.container = null, this.fillElement = null, this.energyWave = null, this.scanLine = null, this.particlesCanvas = null, this.particlesCtx = null, this.hexGrid = null, this.readout = null, this.dataStreams = null, this.glitchLayer = null, this.styleElement = null, this.options = { percent: 0 }, this.variant = je.cyber, this.currentVariantName = "cyber", this.particles = [], this.animationFrame = null, this.lastTime = 0, this.currentPercent = 0, this.originalStyles = {}, this.resizeObserver = null, this.animate = (e) => {
+			let t = (e - this.lastTime) / 1e3;
+			this.lastTime = e, this.updateParticles(t), this.animationFrame = requestAnimationFrame(this.animate);
+		};
+	}
+	getEffectiveSpeed() {
+		return (this.options.speed ?? 1) * (.15 + Math.min(Math.max(this.currentPercent, 0), 100) / 100 * .85);
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t]) {
+		let n = e.element, r;
+		if (this.element || (this.element = n, this.options = {
+			variant: "cyber",
+			autoVariant: !1,
+			showReadout: !0,
+			showScanLines: !0,
+			showParticles: !0,
+			showGrid: !0,
+			showGlitch: !1,
+			intensity: 1,
+			speed: 1,
+			criticalEffects: !0,
+			glassEffect: !0,
+			duration: 600,
+			...t
+		}, this.variant = je[this.options.variant], this.currentVariantName = this.options.variant, this.storeOriginalStyles(), this.setupElement(), this.createStructure(), this.setupResizeObserver(), this.startAnimation()), t.autoVariant) {
+			let e = t.percent;
+			r = e >= 80 ? "success" : e >= 50 ? "warning" : "danger";
+		} else r = t.variant ?? "cyber";
+		return r !== this.currentVariantName && (this.currentVariantName = r, this.variant = je[r], this.updateColors()), this.options = {
+			...this.options,
+			...t
+		}, this.variant = je[r], this.updateFill(), L;
+	}
+	storeOriginalStyles() {
+		if (!this.element) return;
+		let e = this.element.style;
+		this.originalStyles = {
+			position: e.position,
+			overflow: e.overflow,
+			border: e.border,
+			background: e.background,
+			boxShadow: e.boxShadow,
+			backdropFilter: e.backdropFilter,
+			borderRadius: e.borderRadius
+		};
+	}
+	setupElement() {
+		this.element && (getComputedStyle(this.element).position === "static" && (this.element.style.position = "relative"), this.element.style.overflow = "hidden", !1 !== this.options.glassEffect && Object.assign(this.element.style, {
+			background: "rgba(10, 10, 20, 0.9)",
+			backdropFilter: "blur(16px) saturate(130%)",
+			border: `1.5px solid ${this.variant.primary}30`,
+			boxShadow: "\n					0 2px 8px rgba(0, 0, 0, 0.4),\n					0 8px 32px rgba(0, 0, 0, 0.25),\n					inset 0 1px 0 rgba(255, 255, 255, 0.06),\n					0 0 0 1px rgba(0, 0, 0, 0.3)\n				",
+			borderRadius: "12px"
+		}));
+	}
+	createStructure() {
+		this.element && (this.styleElement = document.createElement("style"), this.styleElement.textContent = "\n@keyframes future-fill-pulse {\n	0%, 100% { opacity: 0.85; }\n	50% { opacity: 1; }\n}\n\n@keyframes future-glow-pulse {\n	0%, 100% {\n		filter: drop-shadow(0 0 4px var(--glow-color))\n		        drop-shadow(0 0 8px var(--glow-color));\n	}\n	50% {\n		filter: drop-shadow(0 0 8px var(--glow-color))\n		        drop-shadow(0 0 16px var(--glow-color));\n	}\n}\n\n@keyframes scan-line-move {\n	0% { transform: translateY(-100%); }\n	100% { transform: translateY(200%); }\n}\n\n@keyframes energy-wave {\n	0% { \n		transform: translateY(0) scaleX(1);\n		opacity: 0.6;\n	}\n	50% { \n		transform: translateY(-10px) scaleX(1.1);\n		opacity: 1;\n	}\n	100% { \n		transform: translateY(0) scaleX(1);\n		opacity: 0.6;\n	}\n}\n\n@keyframes data-stream {\n	0% { \n		transform: translateY(100%);\n		opacity: 0;\n	}\n	10% {\n		opacity: 1;\n	}\n	90% {\n		opacity: 1;\n	}\n	100% { \n		transform: translateY(-100%);\n		opacity: 0;\n	}\n}\n\n@keyframes hologram-flicker {\n	0%, 100% { opacity: 1; }\n	2% { opacity: 0.8; }\n	4% { opacity: 1; }\n	8% { opacity: 0.9; }\n	10% { opacity: 1; }\n	50% { opacity: 0.95; }\n	51% { opacity: 1; }\n}\n\n@keyframes glitch-shift {\n	0%, 100% { \n		transform: translate(0, 0);\n		filter: hue-rotate(0deg);\n	}\n	20% { \n		transform: translate(-2px, 1px);\n		filter: hue-rotate(90deg);\n	}\n	40% { \n		transform: translate(2px, -1px);\n		filter: hue-rotate(180deg);\n	}\n	60% { \n		transform: translate(-1px, -2px);\n		filter: hue-rotate(270deg);\n	}\n	80% { \n		transform: translate(1px, 2px);\n		filter: hue-rotate(360deg);\n	}\n}\n\n@keyframes hex-grid-pulse {\n	0%, 100% { opacity: 0.15; }\n	50% { opacity: 0.35; }\n}\n\n@keyframes chromatic-aberration {\n	0%, 100% {\n		text-shadow:\n			-0.5px 0 0 rgba(255, 0, 0, 0.3),\n			0.5px 0 0 rgba(0, 255, 255, 0.3);\n	}\n	50% {\n		text-shadow:\n			-1px 0 0 rgba(255, 0, 0, 0.5),\n			1px 0 0 rgba(0, 255, 255, 0.5);\n	}\n}\n\n@keyframes critical-flash {\n	0%, 100% { opacity: 1; }\n	50% { opacity: 0.5; }\n}\n\n@keyframes overfill-surge {\n	0%, 100% {\n		transform: scale(1);\n		filter: brightness(1);\n	}\n	50% {\n		transform: scale(1.01);\n		filter: brightness(1.15);\n	}\n}\n\n", this.element.appendChild(this.styleElement), this.container = document.createElement("div"), Object.assign(this.container.style, {
+			position: "absolute",
+			inset: "0",
+			pointerEvents: "none",
+			zIndex: "0",
+			overflow: "hidden",
+			borderRadius: "inherit",
+			background: "rgba(0, 0, 0, 0.3)"
+		}), this.element.insertBefore(this.container, this.element.firstChild), this.createFill(), this.createHexGrid(), this.createEnergyWave(), this.createScanLines(), this.createDataStreams(), this.createGlitchLayer(), this.createParticles(), this.createReadout());
+	}
+	createFill() {
+		if (!this.container) return;
+		let e = this.options.duration ?? 600, t = 4 / this.getEffectiveSpeed();
+		this.fillElement = document.createElement("div"), Object.assign(this.fillElement.style, {
+			position: "absolute",
+			left: "0",
+			right: "0",
+			bottom: "0",
+			height: "0%",
+			background: `linear-gradient(180deg,\n\t\t\t\t${this.variant.primary}00 0%,\n\t\t\t\t${this.variant.primary}25 20%,\n\t\t\t\t${this.variant.primary}50 60%,\n\t\t\t\t${this.variant.secondary}cc 100%\n\t\t\t)`,
+			transition: `height ${e}ms cubic-bezier(0.4, 0, 0.2, 1)`,
+			boxShadow: `\n\t\t\t\tinset 0 0 30px ${this.variant.glow}30,\n\t\t\t\tinset 0 -10px 20px ${this.variant.glow}20,\n\t\t\t\t0 0 15px ${this.variant.glow}25\n\t\t\t`,
+			overflow: "hidden",
+			"--glow-color": this.variant.glow,
+			animation: `future-fill-pulse ${t}s ease-in-out infinite`
+		}), this.container.appendChild(this.fillElement);
+	}
+	createEnergyWave() {
+		if (!this.fillElement) return;
+		let e = this.getEffectiveSpeed();
+		this.energyWave = document.createElement("div"), Object.assign(this.energyWave.style, {
+			position: "absolute",
+			left: "-10%",
+			top: "-12px",
+			width: "120%",
+			height: "24px",
+			background: `radial-gradient(ellipse at center,\n\t\t\t\t${this.variant.primary}90 0%,\n\t\t\t\t${this.variant.primary}40 30%,\n\t\t\t\ttransparent 70%\n\t\t\t)`,
+			filter: `blur(6px) drop-shadow(0 0 6px ${this.variant.glow}80)`,
+			animation: `energy-wave ${3 / e}s ease-in-out infinite`
+		}), this.fillElement.appendChild(this.energyWave);
+	}
+	createHexGrid() {
+		if (!this.fillElement || !this.options.showGrid) return;
+		let e = this.getEffectiveSpeed();
+		this.hexGrid = document.createElement("div"), Object.assign(this.hexGrid.style, {
+			position: "absolute",
+			inset: "0",
+			background: this.createHexPattern(),
+			opacity: "0.08",
+			animation: `hex-grid-pulse ${5 / e}s ease-in-out infinite`,
+			mixBlendMode: "screen"
+		}), this.fillElement.appendChild(this.hexGrid);
+	}
+	createHexPattern() {
+		let e = this.variant.gridColor;
+		return `\n\t\t\trepeating-linear-gradient(\n\t\t\t\t0deg,\n\t\t\t\t${e}00 0px,\n\t\t\t\t${e}40 1px,\n\t\t\t\t${e}00 2px,\n\t\t\t\t${e}00 40px\n\t\t\t),\n\t\t\trepeating-linear-gradient(\n\t\t\t\t60deg,\n\t\t\t\t${e}00 0px,\n\t\t\t\t${e}40 1px,\n\t\t\t\t${e}00 2px,\n\t\t\t\t${e}00 40px\n\t\t\t),\n\t\t\trepeating-linear-gradient(\n\t\t\t\t120deg,\n\t\t\t\t${e}00 0px,\n\t\t\t\t${e}40 1px,\n\t\t\t\t${e}00 2px,\n\t\t\t\t${e}00 40px\n\t\t\t)\n\t\t`;
+	}
+	createScanLines() {
+		if (!this.fillElement || !this.options.showScanLines) return;
+		let e = this.getEffectiveSpeed(), t = document.createElement("div");
+		Object.assign(t.style, {
+			position: "absolute",
+			inset: "0",
+			background: `repeating-linear-gradient(\n\t\t\t\t0deg,\n\t\t\t\ttransparent 0px,\n\t\t\t\t${this.variant.scanLine}08 1px,\n\t\t\t\ttransparent 2px,\n\t\t\t\ttransparent 4px\n\t\t\t)`,
+			opacity: "0.15",
+			pointerEvents: "none"
+		}), this.fillElement.appendChild(t), this.scanLine = document.createElement("div"), Object.assign(this.scanLine.style, {
+			position: "absolute",
+			left: "0",
+			right: "0",
+			top: "-1px",
+			height: "1px",
+			background: `linear-gradient(90deg,\n\t\t\t\ttransparent 0%,\n\t\t\t\t${this.variant.scanLine}cc 50%,\n\t\t\t\ttransparent 100%\n\t\t\t)`,
+			boxShadow: `0 0 8px ${this.variant.glow}60`,
+			animation: `scan-line-move ${6 / e}s linear infinite`,
+			opacity: "0.35"
+		}), this.fillElement.appendChild(this.scanLine);
+	}
+	createParticles() {
+		this.fillElement && this.options.showParticles && (this.particlesCanvas = document.createElement("canvas"), Object.assign(this.particlesCanvas.style, {
+			position: "absolute",
+			left: "0",
+			bottom: "0",
+			width: "100%",
+			height: "100%",
+			pointerEvents: "none",
+			zIndex: "5"
+		}), this.fillElement.appendChild(this.particlesCanvas), this.particlesCtx = this.particlesCanvas.getContext("2d"), this.resizeCanvas(), this.initParticles());
+	}
+	resizeCanvas() {
+		if (!this.particlesCanvas || !this.fillElement) return;
+		let e = this.fillElement.getBoundingClientRect();
+		this.particlesCanvas.width = e.width, this.particlesCanvas.height = e.height;
+	}
+	setupResizeObserver() {
+		this.element && typeof ResizeObserver < "u" && (this.resizeObserver = new ResizeObserver(() => {
+			this.resizeCanvas();
+		}), this.resizeObserver.observe(this.element));
+	}
+	initParticles() {
+		let e = Math.floor(12 * (this.options.intensity ?? 1));
+		for (let t = 0; t < e; t++) this.spawnParticle();
+	}
+	spawnParticle() {
+		if (!this.particlesCanvas) return;
+		let e = this.particlesCanvas.width, t = this.particlesCanvas.height, n = this.getEffectiveSpeed();
+		this.particles.push({
+			x: Math.random() * e,
+			y: t + 30 * Math.random(),
+			vx: .5 * (Math.random() - .5),
+			vy: (-.4 - 1.2 * Math.random()) * n,
+			size: .8 + 1.2 * Math.random(),
+			opacity: .2 + .4 * Math.random(),
+			hue: 60 * Math.random() - 30,
+			life: 0
+		});
+	}
+	createDataStreams() {
+		if (!this.fillElement) return;
+		let e = this.getEffectiveSpeed();
+		this.dataStreams = document.createElement("div"), Object.assign(this.dataStreams.style, {
+			position: "absolute",
+			inset: "0",
+			overflow: "hidden",
+			opacity: "0.18",
+			zIndex: "3"
+		}), this.fillElement.appendChild(this.dataStreams);
+		for (let t = 0; t < 3; t++) {
+			let n = document.createElement("div"), r = 15 + 30 * t, i = 4 * Math.random(), a = 3 + 2 * Math.random();
+			Object.assign(n.style, {
+				position: "absolute",
+				left: `${r}%`,
+				top: "0",
+				width: "1px",
+				height: "100%",
+				background: `linear-gradient(180deg,\n\t\t\t\t\ttransparent 0%,\n\t\t\t\t\t${this.variant.primary}cc 50%,\n\t\t\t\t\ttransparent 100%\n\t\t\t\t)`,
+				animation: `data-stream ${a / e}s linear infinite`,
+				animationDelay: `${i}s`,
+				boxShadow: `0 0 4px ${this.variant.glow}40`
+			}), this.dataStreams.appendChild(n);
+		}
+	}
+	createGlitchLayer() {
+		this.fillElement && this.options.showGlitch && (this.glitchLayer = document.createElement("div"), Object.assign(this.glitchLayer.style, {
+			position: "absolute",
+			inset: "0",
+			background: `linear-gradient(90deg,\n\t\t\t\t${this.variant.primary}20 0%,\n\t\t\t\ttransparent 50%,\n\t\t\t\t${this.variant.secondary}20 100%\n\t\t\t)`,
+			opacity: "0.3",
+			animation: "glitch-shift 0.3s steps(1) infinite",
+			mixBlendMode: "overlay"
+		}), this.fillElement.appendChild(this.glitchLayer));
+	}
+	createReadout() {
+		if (!this.element || !this.options.showReadout) return;
+		let e = this.getEffectiveSpeed();
+		this.readout = document.createElement("div"), Object.assign(this.readout.style, {
+			position: "absolute",
+			top: "10px",
+			right: "10px",
+			fontFamily: "monospace",
+			fontSize: "1rem",
+			fontWeight: "600",
+			color: this.variant.primary,
+			textShadow: `\n\t\t\t\t0 0 6px ${this.variant.glow}80,\n\t\t\t\t0 2px 4px rgba(0, 0, 0, 0.8)\n\t\t\t`,
+			zIndex: "10",
+			pointerEvents: "none",
+			letterSpacing: "0.08em",
+			animation: `hologram-flicker ${8 / e}s ease-in-out infinite`
+		}), this.element.appendChild(this.readout);
+		let t = document.createElement("span");
+		t.textContent = " PWR", t.style.opacity = "0.6", t.style.fontSize = "0.7em", this.readout.appendChild(t);
+	}
+	updateColors() {
+		this.fillElement && (this.fillElement.style.background = `linear-gradient(180deg,\n\t\t\t\t${this.variant.primary}00 0%,\n\t\t\t\t${this.variant.primary}25 20%,\n\t\t\t\t${this.variant.primary}50 60%,\n\t\t\t\t${this.variant.secondary}cc 100%\n\t\t\t)`, this.fillElement.style.boxShadow = `\n\t\t\t\tinset 0 0 30px ${this.variant.glow}30,\n\t\t\t\tinset 0 -10px 20px ${this.variant.glow}20,\n\t\t\t\t0 0 15px ${this.variant.glow}25\n\t\t\t`, this.fillElement.style.setProperty("--glow-color", this.variant.glow)), this.energyWave && (this.energyWave.style.background = `radial-gradient(ellipse at center,\n\t\t\t\t${this.variant.primary}90 0%,\n\t\t\t\t${this.variant.primary}40 30%,\n\t\t\t\ttransparent 70%\n\t\t\t)`, this.energyWave.style.filter = `blur(6px) drop-shadow(0 0 6px ${this.variant.glow}80)`), this.hexGrid && (this.hexGrid.style.background = this.createHexPattern()), this.dataStreams && this.dataStreams.querySelectorAll("div").forEach((e) => {
+			let t = e;
+			t.style.background = `linear-gradient(180deg,\n\t\t\t\t\ttransparent 0%,\n\t\t\t\t\t${this.variant.primary}cc 50%,\n\t\t\t\t\ttransparent 100%\n\t\t\t\t)`, t.style.boxShadow = `0 0 4px ${this.variant.glow}40`;
+		}), this.glitchLayer && (this.glitchLayer.style.background = `linear-gradient(90deg,\n\t\t\t\t${this.variant.primary}20 0%,\n\t\t\t\ttransparent 50%,\n\t\t\t\t${this.variant.secondary}20 100%\n\t\t\t)`), this.readout && (this.readout.style.color = this.variant.primary, this.readout.style.textShadow = `\n\t\t\t\t0 0 6px ${this.variant.glow}80,\n\t\t\t\t0 2px 4px rgba(0, 0, 0, 0.8)\n\t\t\t`), this.element && !1 !== this.options.glassEffect && (this.element.style.border = `1.5px solid ${this.variant.primary}30`);
+	}
+	startAnimation() {
+		this.lastTime = performance.now(), this.animate(this.lastTime);
+	}
+	updateParticles(e) {
+		if (!this.particlesCanvas || !this.particlesCtx || !this.options.showParticles) return;
+		let t = this.particlesCtx, n = this.particlesCanvas.width, r = this.particlesCanvas.height;
+		t.clearRect(0, 0, n, r);
+		for (let n = this.particles.length - 1; n >= 0; n--) {
+			let r = this.particles[n], i = this.getEffectiveSpeed();
+			if (r.x += r.vx * e * 60 * i, r.y += r.vy * e * 60 * i, r.life += e, r.life > 2 && (r.opacity *= .95), r.opacity < .01 || r.y < -50) {
+				this.particles.splice(n, 1), this.spawnParticle();
+				continue;
+			}
+			let a = t.createRadialGradient(r.x, r.y, 0, r.x, r.y, 2.5 * r.size);
+			a.addColorStop(0, this.hexToRGBA(this.variant.particle, .8 * r.opacity)), a.addColorStop(.5, this.hexToRGBA(this.variant.particle, .15 * r.opacity)), a.addColorStop(1, this.hexToRGBA(this.variant.particle, 0)), t.fillStyle = a, t.beginPath(), t.arc(r.x, r.y, 2.5 * r.size, 0, 2 * Math.PI), t.fill(), t.fillStyle = this.hexToRGBA(this.variant.particle, .7 * r.opacity), t.beginPath(), t.arc(r.x, r.y, .8 * r.size, 0, 2 * Math.PI), t.fill();
+		}
+	}
+	hexToRGBA(e, t) {
+		return `rgba(${parseInt(e.slice(1, 3), 16)}, ${parseInt(e.slice(3, 5), 16)}, ${parseInt(e.slice(5, 7), 16)}, ${t})`;
+	}
+	updateFill() {
+		let e = Math.max(0, this.options.percent), t = Math.min(e, 100), n = e < 20, r = e > 100;
+		this.currentPercent = t;
+		let i = this.getEffectiveSpeed();
+		if (this.fillElement) {
+			this.fillElement.style.height = `${t}%`;
+			let e = this.options.duration ?? 600;
+			this.fillElement.style.transition = `height ${e}ms cubic-bezier(0.4, 0, 0.2, 1)`;
+		}
+		if (this.readout) {
+			let t = Math.round(e);
+			this.readout.firstChild.textContent = t.toString().padStart(3, "0"), this.options.criticalEffects && (this.readout.style.animation = n ? "critical-flash 1s ease-in-out infinite" : r ? "overfill-surge 1.5s ease-in-out infinite" : `hologram-flicker ${8 / i}s ease-in-out infinite`);
+		}
+		if (this.fillElement) {
+			let e = 4 / i;
+			this.options.criticalEffects && n ? this.fillElement.style.animation = "future-fill-pulse 1s ease-in-out infinite, critical-flash 1.5s ease-in-out infinite" : this.options.criticalEffects && r ? this.fillElement.style.animation = "future-fill-pulse 1.2s ease-in-out infinite, overfill-surge 1.5s ease-in-out infinite" : this.fillElement.style.animation = `future-fill-pulse ${e}s ease-in-out infinite`;
+		}
+		this.energyWave && (this.energyWave.style.animation = `energy-wave ${3 / i}s ease-in-out infinite`), this.scanLine && (this.scanLine.style.animation = `scan-line-move ${6 / i}s linear infinite`), this.hexGrid && (this.hexGrid.style.animation = `hex-grid-pulse ${5 / i}s ease-in-out infinite`);
+	}
+	disconnected() {
+		this.animationFrame && cancelAnimationFrame(this.animationFrame), this.resizeObserver && this.resizeObserver.disconnect(), this.styleElement?.remove(), this.container?.remove(), this.readout?.remove(), this.element && Object.assign(this.element.style, this.originalStyles), this.element = null, this.container = null, this.fillElement = null, this.energyWave = null, this.scanLine = null, this.particlesCanvas = null, this.particlesCtx = null, this.hexGrid = null, this.readout = null, this.dataStreams = null, this.glitchLayer = null, this.particles = [], this.resizeObserver = null;
+	}
+}), Ne = () => !1;
+function Pe(e) {
+	Ne = e;
+}
+function Fe() {
+	return Ne();
+}
+function Ie(e, t = R) {
+	return Fe() ? e : t;
+}
+var Le = U(class extends V {
+	constructor(e) {
+		super(e), this.config = {};
+	}
+	update(e, [t]) {
+		if (e.type !== H.ELEMENT) throw Error("The `classMap` directive must be used in the `class` attribute");
+		let n = e.element;
+		this.config = t, this.config.bgColor && (n.style.backgroundColor = this.config.bgColor), this.config.color && (n.style.color = this.config.color);
+	}
+	render(e) {
+		return this.config = e, R;
+	}
+}), q = /* @__PURE__ */ new WeakMap();
+function Re(e, t) {
+	let n = e.match(/var\(([^,)]+)/);
+	return n && getComputedStyle(document.documentElement).getPropertyValue(n[1]).trim() || t;
+}
+var ze = U(class extends V {
+	constructor(e) {
+		if (super(e), e.type !== H.ELEMENT) throw Error("confirmClick directive can only be used on elements");
+	}
+	render(e, t) {}
+	update(e, [t, n = {}]) {
+		let r = e.element, i = q.get(r);
+		if (i) {
+			if (i.callback = t, this.optionsEqual(i.options, n)) return;
+			this.cleanup(r);
+		}
+		let a = new g(), o = this.setupClickListener(r, n ?? {}, a);
+		q.set(r, {
+			subscription: o,
+			callback: t,
+			options: n ?? {},
+			overlayElement: null,
+			isConfirming: !1,
+			cancel$: a
+		});
+	}
+	optionsEqual(e, t) {
+		return t ? e.timeout === t.timeout && e.icon === t.icon : Object.keys(e).length === 0;
+	}
+	setupClickListener(e, t, n) {
+		return T(e, "click").pipe(I((r) => {
+			let i = q.get(e);
+			i && !i.isConfirming && (r.stopPropagation(), r.preventDefault(), i.isConfirming = !0, this.showOverlay(e, i, t, n));
+		})).subscribe();
+	}
+	showOverlay(e, t, n, r) {
+		let i = n.timeout ?? 3e3, a = e, o = n.icon ?? a.icon ?? a._capturedIcon ?? e.textContent?.trim() ?? "warning", s = Re("var(--schmancy-sys-color-error-default)", "#dc2626"), c = Re("var(--schmancy-sys-color-error-on)", "#ffffff"), l = Re("var(--schmancy-sys-color-error-container)", "#fecaca"), u = document.createElement("div");
+		u.setAttribute("role", "status"), u.setAttribute("aria-label", "Click again to confirm");
+		let d = e.getBoundingClientRect(), f = d.width, p = d.height, m = window.devicePixelRatio || 1, h = getComputedStyle(e);
+		Object.assign(u.style, {
+			position: "fixed",
+			top: `${d.top}px`,
+			left: `${d.left}px`,
+			width: `${f}px`,
+			height: `${p}px`,
+			zIndex: "10000",
+			borderRadius: h.borderRadius || "50%",
+			overflow: "hidden",
+			cursor: "pointer",
+			opacity: "0",
+			transform: "scale(0.6)",
+			transition: "opacity 250ms cubic-bezier(0.22, 1.25, 0.36, 1), transform 300ms cubic-bezier(0.22, 1.25, 0.36, 1)"
+		});
+		let g = document.createElement("canvas");
+		g.width = f * m, g.height = p * m, g.style.width = `${f}px`, g.style.height = `${p}px`, g.style.position = "absolute", g.style.top = "0", g.style.left = "0", u.appendChild(g);
+		let _ = Math.round(.5 * Math.min(f, p)), y = document.createElement("schmancy-icon");
+		y.textContent = o, y.setAttribute("size", `${_}px`), Object.assign(y.style, {
+			position: "absolute",
+			top: "50%",
+			left: "50%",
+			transform: "translate(-50%, -50%)",
+			color: c,
+			pointerEvents: "none"
+		}), u.appendChild(y), document.body.appendChild(u), t.overlayElement = u, ne(null).pipe(le(v)).subscribe(() => {
+			u.style.opacity = "1", u.style.transform = "scale(1)";
+		});
+		let b = g.getContext("2d");
+		if (!b) return;
+		b.scale(m, m);
+		let x = f / 2, S = p / 2, C = Math.min(f, p) / 2 - 1, ee = C - 3, w = (e) => {
+			b.clearRect(0, 0, f, p), b.beginPath(), b.arc(x, S, ee, 0, 2 * Math.PI), b.fillStyle = s, b.fill();
+			let t = 1 - e;
+			if (t > 0) {
+				let e = -Math.PI / 2, n = e + 2 * Math.PI * t;
+				b.beginPath(), b.arc(x, S, C, e, n), b.arc(x, S, ee, n, e, !0), b.closePath(), b.fillStyle = l, b.fill();
+			}
+		};
+		w(0);
+		let re = performance.now(), D = E(0, v).pipe(j(() => (performance.now() - re) / i), F((e) => e <= 1), P(r), I((e) => w(e))).subscribe({ complete: () => {
+			q.get(e)?.isConfirming && this.hideOverlay(e);
+		} });
+		t.subscription.add(D);
+		let ie = te(T(u, "click").pipe(N(1), I(() => {
+			t.callback(), this.hideOverlay(e);
+		})), T(document, "click", { capture: !0 }).pipe(A((t) => !u.contains(t.target) && !e.contains(t.target)), N(1), I(() => this.hideOverlay(e))), T(document, "keydown").pipe(A((e) => e.key === "Escape"), N(1), I(() => this.hideOverlay(e)))).pipe(N(1), P(r)).subscribe();
+		t.subscription.add(ie);
+	}
+	hideOverlay(e) {
+		let t = q.get(e);
+		if (t && (t.cancel$.next(), t.isConfirming = !1, t.overlayElement)) {
+			let e = t.overlayElement;
+			e.style.opacity = "0", e.style.transform = "scale(0.6)", D(250).pipe(I(() => {
+				document.body.contains(e) && document.body.removeChild(e);
+			})).subscribe(), t.overlayElement = null;
+		}
+	}
+	cleanup(e) {
+		let t = q.get(e);
+		t && (t.cancel$.next(), t.cancel$.complete(), t.subscription.unsubscribe(), t.overlayElement && document.body.contains(t.overlayElement) && document.body.removeChild(t.overlayElement), q.delete(e));
+	}
+	disconnected(e) {
+		this.cleanup(e.element);
+	}
+	reconnected(e) {
+		let t = e.element, n = q.get(t);
+		if (n) {
+			let e = new g(), r = this.setupClickListener(t, n.options, e);
+			q.set(t, {
+				subscription: r,
+				callback: n.callback,
+				options: n.options,
+				overlayElement: null,
+				isConfirming: !1,
+				cancel$: e
+			});
+		}
+	}
+}), Be = B(class extends z {
+	constructor(...e) {
+		super(...e), this.element = null, this.items = [], this.subscription = null, this.typewriterSub = null, this.currentAnimation = null, this.addDisplayEl = null, this.disconnecting$ = new g(), this.initialized = !1;
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t = {}]) {
+		if (this.element = e.element, !this.initialized && this.isConnected) {
+			if (this.initialized = !0, this.disconnecting$.closed && (this.disconnecting$ = new g()), this.items = Array.from(this.element.children).filter((e) => e instanceof HTMLElement), this.items.length === 0) return L;
+			this.element.style.display = "inline-grid", this.element.style.verticalAlign = "bottom", this.items.forEach((e, t) => {
+				e.style.gridColumn = "1", e.style.gridRow = "1", e.style.visibility = t === 0 ? "" : "hidden";
+			}), this.startCycling(t);
+		}
+		return L;
+	}
+	disconnected() {
+		this.cleanup();
+	}
+	reconnected() {}
+	startCycling(e) {
+		let { mode: t = "replace" } = e;
+		this.items.length < 2 || (t === "add" ? this.startAddCycling(e) : this.startReplaceCycling(e));
+	}
+	startReplaceCycling(e) {
+		let { transition: t = "fade", hold: n = 2e3, duration: r = 300, delay: i = 0 } = e, a = (e) => S(() => new h((i) => {
+			let a = this.items[e], o = (e - 1 + this.items.length) % this.items.length, s = this.items[o], c = parseInt(a.dataset.hold || "", 10) || n, l = this.transitionItems(s, a, t, r).pipe(M(() => D(c)), N(1), P(this.disconnecting$)).subscribe({
+				next: () => {
+					i.next(), i.complete();
+				},
+				error: (e) => i.error(e)
+			});
+			return () => l.unsubscribe();
+		})), o = parseInt(this.items[0].dataset.hold || "", 10) || n, s = b(S(() => new h((e) => {
+			let t = D(o).pipe(P(this.disconnecting$)).subscribe({ next: () => {
+				e.next(), e.complete();
+			} });
+			return () => t.unsubscribe();
+		})), b(...[...Array.from({ length: this.items.length }, (e, t) => t).slice(1), 0].map((e) => a(e))).pipe(ue()));
+		this.subscription = D(i).pipe(M(() => s), P(this.disconnecting$)).subscribe();
+	}
+	startAddCycling(e) {
+		let { transition: t = "fade", hold: n = 2e3, duration: r = 300, delay: i = 0, separator: a = ", " } = e, o = this.items.map((e) => e.textContent || "");
+		this.items.forEach((e) => {
+			e.style.display = "none";
+		});
+		let s = document.createElement("span");
+		this.element.appendChild(s), this.addDisplayEl = s;
+		let c = S(() => {
+			s.textContent = "";
+			let e = "", i = o.map((i, o) => {
+				let c = parseInt(this.items[o].dataset.hold || "", 10) || n, l = (o > 0 ? a : "") + i;
+				return S(() => t === "typewriter" ? this.typewriterAdd(s, e, l, r).pipe(I(() => {
+					e += l;
+				}), M(() => D(c))) : S(() => (e += l, s.textContent = e, D(c))));
+			}), c = S(() => {
+				let t = s.animate([{ opacity: 1 }, { opacity: 0 }], {
+					duration: r,
+					fill: "forwards"
+				});
+				return this.currentAnimation = t, w(t.finished).pipe(I(() => {
+					t.cancel(), s.textContent = "", s.style.opacity = "", e = "";
+				}), M(() => D(300)));
+			});
+			return b(...i, c);
+		});
+		this.subscription = D(i).pipe(M(() => c.pipe(ue())), P(this.disconnecting$)).subscribe();
+	}
+	typewriterAdd(e, t, n, r) {
+		if (n.length === 0) return ne(void 0);
+		let i = r / n.length;
+		return new h((r) => {
+			let a = 0, o = E(i).pipe(I(() => {
+				a++, e.textContent = t + n.slice(0, a);
+			}), F(() => a < n.length), P(this.disconnecting$)).subscribe({ complete: () => {
+				e.textContent = t + n, r.next(), r.complete();
+			} });
+			return () => o.unsubscribe();
+		});
+	}
+	transitionItems(e, t, n, r) {
+		switch (this.currentAnimation?.cancel(), this.currentAnimation = null, this.typewriterSub?.unsubscribe(), this.typewriterSub = null, n) {
+			case "slide": return this.slideTransition(e, t, r);
+			case "typewriter": return this.typewriterTransition(e, t, r);
+			default: return this.fadeTransition(e, t, r);
+		}
+	}
+	fadeTransition(e, t, n) {
+		let r = e.animate([{ opacity: 1 }, { opacity: 0 }], {
+			duration: n / 2,
+			fill: "forwards"
+		});
+		return this.currentAnimation = r, w(r.finished).pipe(M(() => {
+			r.cancel(), e.style.visibility = "hidden", t.style.visibility = "";
+			let i = t.animate([{ opacity: 0 }, { opacity: 1 }], {
+				duration: n / 2,
+				fill: "forwards"
+			});
+			return this.currentAnimation = i, w(i.finished).pipe(I(() => {
+				i.cancel();
+			}), j(() => {}), O(() => m));
+		}), O(() => m));
+	}
+	slideTransition(e, t, n) {
+		let r = "cubic-bezier(0.4, 0, 0.2, 1)";
+		t.style.visibility = "";
+		let i = e.animate([{
+			transform: "translateY(0)",
+			opacity: 1
+		}, {
+			transform: "translateY(-100%)",
+			opacity: 0
+		}], {
+			duration: n,
+			fill: "forwards",
+			easing: r
+		}), a = t.animate([{
+			transform: "translateY(100%)",
+			opacity: 0
+		}, {
+			transform: "translateY(0)",
+			opacity: 1
+		}], {
+			duration: n,
+			fill: "forwards",
+			easing: r
+		});
+		return this.currentAnimation = a, w(a.finished).pipe(I(() => {
+			i.cancel(), a.cancel(), e.style.visibility = "hidden";
+		}), j(() => {}), O(() => m));
+	}
+	typewriterTransition(e, t, n) {
+		let r = e.textContent || "", i = t.textContent || "", a = r.length + i.length;
+		if (a === 0) return e.style.visibility = "hidden", t.style.visibility = "", ne(void 0);
+		let o = n / a;
+		return new h((n) => {
+			let a = r.length;
+			return this.typewriterSub = b(E(o).pipe(I(() => {
+				a--, e.textContent = r.slice(0, a);
+			}), F(() => a > 0)), S(() => (e.style.visibility = "hidden", e.textContent = r, t.style.visibility = "", t.textContent = "", ne(null))), S(() => {
+				let e = 0;
+				return E(o).pipe(I(() => {
+					e++, t.textContent = i.slice(0, e);
+				}), F(() => e < i.length));
+			})).pipe(P(this.disconnecting$)).subscribe({ complete: () => {
+				t.textContent = i, n.next(), n.complete();
+			} }), () => {
+				this.typewriterSub?.unsubscribe(), this.typewriterSub = null;
+			};
+		});
+	}
+	cleanup() {
+		this.disconnecting$.next(), this.disconnecting$.complete(), this.currentAnimation?.cancel(), this.currentAnimation = null, this.typewriterSub?.unsubscribe(), this.typewriterSub = null, this.subscription?.unsubscribe(), this.subscription = null, this.addDisplayEl &&= (this.addDisplayEl.remove(), null), this.items.forEach((e, t) => {
+			e.style.gridColumn = "", e.style.gridRow = "", e.style.visibility = t === 0 ? "" : "hidden", e.style.opacity = "", e.style.transform = "";
+		}), this.element = null, this.items = [], this.initialized = !1;
+	}
+}), Ve = U(class extends z {
+	constructor(...e) {
+		super(...e), this.maxBlur = 8, this.duration = 400, this.isBlurred = !1, this.transitionSet = !1;
+	}
+	render(e) {}
+	update(e, [t]) {
+		if (e.type !== H.ELEMENT) throw Error("depthOfField directive must be used on an element");
+		this.element = e.element, this.maxBlur = t.maxBlur ?? 8, this.duration = t.duration ?? 400, this.transitionSet || o.value || (this.element.style.transition = `filter ${this.duration}ms cubic-bezier(0.34, 1.2, 0.64, 1), scale ${this.duration}ms cubic-bezier(0.34, 1.2, 0.64, 1)`, this.transitionSet = !0), t.active && !this.isBlurred ? this.applyBlur() : !t.active && this.isBlurred && this.clearBlur();
+	}
+	applyBlur() {
+		this.element.style.filter = `blur(${this.maxBlur}px) saturate(60%)`, this.element.style.scale = "1.01", this.isBlurred = !0;
+	}
+	clearBlur() {
+		this.element.style.filter = "", this.element.style.scale = "", this.isBlurred = !1;
+	}
+	disconnected() {
+		this.isBlurred && this.clearBlur();
+	}
+	reconnected() {}
+}), He = new p(null), J = new p(null), Y = /* @__PURE__ */ new Map(), X = /* @__PURE__ */ new Map(), Ue = [];
+function Z(e) {
+	Ue.push(`[${(/* @__PURE__ */ new Date()).toISOString().slice(11, 23)}] ${e}`);
+}
+var We = null;
+J.pipe(k((e, t) => e?.target === t?.target && e?.position === t?.position)).subscribe((e) => {
+	if (!e) return void (We && (We.style.display = "none"));
+	if (o.value) return;
+	let t = function() {
+		if (We) return We;
+		let e = document.createElement("div");
+		e.setAttribute("data-schmancy-drop-line", ""), Object.assign(e.style, {
+			position: "fixed",
+			height: "2px",
+			backgroundColor: "var(--schmancy-sys-color-tertiary-default, #6750A4)",
+			borderRadius: "1px",
+			pointerEvents: "none",
+			zIndex: "10000",
+			transition: "top 100ms ease, left 100ms ease, width 100ms ease",
+			boxShadow: "0 0 4px var(--schmancy-sys-color-tertiary-default, #6750A4)",
+			display: "none"
+		});
+		for (let t of ["left", "right"]) {
+			let n = document.createElement("div");
+			Object.assign(n.style, {
+				position: "absolute",
+				width: "6px",
+				height: "6px",
+				borderRadius: "50%",
+				backgroundColor: "var(--schmancy-sys-color-tertiary-default, #6750A4)",
+				top: "-2px",
+				[t]: "-3px"
+			}), e.appendChild(n);
+		}
+		return document.body.appendChild(e), We = e, e;
+	}(), n = e.target.getBoundingClientRect(), r = e.position === "before" ? n.top - 1 : n.bottom + 1;
+	Object.assign(t.style, {
+		top: `${r}px`,
+		left: `${n.left}px`,
+		width: `${n.width}px`,
+		display: "block"
+	});
+});
+var Ge = class extends V {
+	constructor(...e) {
+		super(...e), this.destroy$ = new g();
+	}
+	update(e, [t]) {
+		if (this.id = t, !this.element) {
+			let t = e.element;
+			this.element = t, t.draggable = !0, t.style.cursor = "grab", T(t, "dragstart").pipe(I((e) => {
+				e.stopPropagation(), e.dataTransfer?.setData("application/json", JSON.stringify({ id: this.id })), e.dataTransfer && (e.dataTransfer.effectAllowed = "move"), t.style.cursor = "grabbing", Ue.length = 0, Z(`DRAGSTART id=${this.id} tag=${t.tagName}`), He.next(this.id), X.clear();
+				let n = t.parentElement;
+				if (n) for (let [e, t] of Y) t.parentElement === n && X.set(e, t.getBoundingClientRect());
+			}), le(v), I(() => {
+				o.value || (t.style.transition = "transform 150ms ease, box-shadow 150ms ease, opacity 150ms ease", t.style.transform = "scale(1.03)", t.style.boxShadow = "0 8px 25px rgba(0,0,0,0.15)", t.style.opacity = "0.6", t.style.zIndex = "1000", t.style.pointerEvents = "none");
+			}), M(() => T(t, "dragend").pipe(N(1), I(() => {
+				let e = J.value;
+				if (t.style.removeProperty("transition"), t.style.removeProperty("transform"), t.style.removeProperty("box-shadow"), t.style.removeProperty("opacity"), t.style.removeProperty("z-index"), t.style.removeProperty("pointer-events"), t.style.cursor = "grab", e) {
+					let { target: t, destinationId: n, position: i } = e;
+					Z(`DROP source=${this.id} dest=${n} pos=${i}`), t.dispatchEvent(new CustomEvent("drop", {
+						detail: {
+							source: this.id,
+							destination: n,
+							position: i
+						},
+						bubbles: !0,
+						composed: !0
+					})), D(0, v).pipe(de(1), N(1)).subscribe(() => {
+						if (!o.value && X.size !== 0) {
+							for (let [e, t] of X) {
+								let n = Y.get(e);
+								if (!n) continue;
+								let i = n.getBoundingClientRect(), a = t.left - i.left, o = t.top - i.top;
+								Math.abs(a) < 1 && Math.abs(o) < 1 || n.animate([{ transform: `translate(${a}px, ${o}px)` }, { transform: "translate(0,0)" }], {
+									duration: r.duration,
+									easing: r.easingFallback,
+									fill: "none"
+								});
+							}
+							X.clear();
+						}
+					});
+				}
+				He.next(null), J.next(null), Z(`DRAGEND id=${this.id}`), Ue.length !== 0 && (Ue.length = 0);
+			}))), P(this.destroy$)).subscribe();
+		}
+		return this.registeredId && this.registeredId !== t && Y.delete(this.registeredId), Y.set(t, this.element), this.registeredId = t, R;
+	}
+	disconnected() {
+		this.destroy$.next(), this.destroy$.complete(), this.registeredId && Y.delete(this.registeredId), this.element = void 0;
+	}
+	reconnected() {
+		this.destroy$ = new g(), this.element = void 0;
+	}
+	render(e) {
+		return R;
+	}
+}, Ke = U(Ge), qe = class extends V {
+	constructor(...e) {
+		super(...e), this.destroy$ = new g();
+	}
+	update(e, [t]) {
+		if (this.destinationId = t, !this.element) {
+			let t = e.element;
+			this.element = t, T(t, "dragenter").pipe(I((e) => {
+				Z(`NATIVE-DRAGENTER dest=${this.destinationId}`), e.preventDefault();
+			}), P(this.destroy$)).subscribe(), T(t, "dragover").pipe(I((e) => {
+				Z(`NATIVE-DRAGOVER dest=${this.destinationId}`), e.preventDefault(), e.dataTransfer && (e.dataTransfer.dropEffect = "move");
+			}), P(this.destroy$)).subscribe(), T(t, "drop").pipe(I((e) => {
+				e.preventDefault(), Z(`NATIVE-DROP dest=${this.destinationId}`);
+			}), P(this.destroy$)).subscribe(), He.pipe(M((e) => e && e !== this.destinationId ? (Z(`DROP-ACTIVE dest=${this.destinationId} src=${e}`), T(t, "dragover").pipe(I((e) => {
+				e.preventDefault(), e.dataTransfer && (e.dataTransfer.dropEffect = "move");
+			}), I((n) => {
+				let r = function(e, t, n) {
+					let r = t.getBoundingClientRect(), i = n ? Y.get(n) : null;
+					if (!i) return e.clientY < r.top + r.height / 2 ? "before" : "after";
+					let a = i.getBoundingClientRect();
+					if (Math.abs(a.top - r.top) < r.height / 2) {
+						let t = r.left + r.width / 2;
+						return a.left > r.left ? e.clientX < t ? "before" : null : e.clientX >= t ? "after" : null;
+					}
+					let o = r.top + r.height / 2;
+					return a.top > r.top ? e.clientY < o ? "before" : null : e.clientY >= o ? "after" : null;
+				}(n, t, e);
+				J.next(r ? {
+					target: t,
+					destinationId: this.destinationId,
+					position: r
+				} : null);
+			}))) : (J.next(null), m)), P(this.destroy$)).subscribe();
+		}
+		return R;
+	}
+	disconnected() {
+		this.destroy$.next(), this.destroy$.complete(), this.element = void 0;
+	}
+	reconnected() {
+		this.destroy$ = new g(), this.element = void 0;
+	}
+	render(e) {
+		return R;
+	}
+}, Je = U(qe), Ye = B(class extends z {
+	constructor(...e) {
+		super(...e), this.element = null, this.disconnecting$ = new g();
+	}
+	subscribe() {
+		let e = this.element;
+		e && y([
+			te(T(window, "resize", { passive: !0 }), window.visualViewport ? te(T(window.visualViewport, "resize", { passive: !0 }), T(window.visualViewport, "scroll", { passive: !0 })) : m, T(window, "orientationchange"), T(document, "focusout", { passive: !0 }).pipe(M(() => D(100))), u(e), e.parentElement ? u(e.parentElement) : m).pipe(ie(0, v), fe(null)),
+			c.bottomOffset$,
+			c.fullscreen$
+		]).pipe(A(() => {
+			let e = window.visualViewport;
+			return !e || Math.abs(e.scale - 1) <= .01;
+		}), I(([, t, n]) => {
+			let r = window.visualViewport, i = e.getBoundingClientRect(), a = e.style;
+			a.boxSizing = "border-box", a.height = `${Math.max(0, (r?.height ?? window.innerHeight) - i.top)}px`, a.width = `${Math.max(0, (r?.width ?? window.innerWidth) - i.left)}px`, a.paddingBottom = `${n ? 0 : t}px`, a.minHeight = "0", a.minWidth = "0", a.overflow = "hidden";
+		}), P(this.disconnecting$)).subscribe();
+	}
+	render() {}
+	update(e) {
+		if (e.type !== H.ELEMENT) throw Error("fill directive can only be used on elements");
+		let t = e.element;
+		this.element !== t && (this.element = t, this.subscribe());
+	}
+	disconnected() {
+		this.disconnecting$.next(), this.element = null;
+	}
+	reconnected() {
+		this.element && (this.disconnecting$ = new g(), this.subscribe());
+	}
+}), Xe = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null, this.destroy$ = new g(), this.subscriptions = new _();
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t = {}]) {
+		let n = e.element, { emoji: r = "", position: i = "auto", showAfter: a = 0, hideAfter: o, animation: s = "point", shimmerDuration: c = 3e3 } = t;
+		return !this.state || this.state.emoji === r && this.state.position === i && this.state.showAfter === a && this.state.hideAfter === o && this.state.animation === s && this.state.shimmerDuration === c || this.cleanup(), !this.state && this.isConnected && (this.state = {
+			emoji: r,
+			position: i,
+			showAfter: a,
+			hideAfter: o,
+			animation: s,
+			shimmerDuration: c,
+			element: n,
+			activeAnimations: /* @__PURE__ */ new Set()
+		}, this.destroy$ = new g(), this.subscriptions = new _(), this.scheduleShow()), L;
+	}
+	scheduleShow() {
+		if (!this.state || !this.isConnected) return;
+		let e = this.state.showAfter, t = D(e).pipe(P(this.destroy$), A(() => this.isConnected && this.state !== null), M(() => d.activeCount > 0 ? D(500).pipe(P(this.destroy$), M(() => this.waitForOverlaysClear())) : D(0))).subscribe({
+			next: () => {
+				this.isConnected && this.state && this.show();
+			},
+			error: () => {}
+		});
+		this.subscriptions.add(t);
+	}
+	waitForOverlaysClear() {
+		return D(500).pipe(P(this.destroy$), M(() => this.isConnected ? d.activeCount > 0 ? this.waitForOverlaysClear() : D(0) : m));
+	}
+	show() {
+		if (!this.state || !this.state.element || !this.isConnected) return;
+		let e = this.state.element, t = window.getComputedStyle(e), n = t.position;
+		this.state.originalOverflow = e.style.overflow, this.state.originalPosition = e.style.position, n === "static" && (e.style.position = "relative"), e.style.overflow = "hidden";
+		let r = document.createElement("div");
+		r.className = "fyi-shimmer-overlay";
+		let i = t.borderRadius;
+		if (Object.assign(r.style, {
+			position: "absolute",
+			inset: "0",
+			pointerEvents: "none",
+			zIndex: "9999",
+			borderRadius: i,
+			background: "\n				linear-gradient(\n					108deg,\n					transparent 0%,\n					transparent 40%,\n					rgba(255, 255, 255, 0.02) 44%,\n					rgba(255, 255, 255, 0.06) 48%,\n					rgba(255, 255, 255, 0.08) 50%,\n					rgba(255, 255, 255, 0.06) 52%,\n					rgba(255, 255, 255, 0.02) 56%,\n					transparent 60%,\n					transparent 100%\n				)\n			",
+			backgroundSize: "400% 100%",
+			backgroundRepeat: "no-repeat"
+		}), e.appendChild(r), this.state.shimmerOverlay = r, this.state.elementAnimation = r.animate([{ backgroundPosition: "100% 0" }, { backgroundPosition: "0% 0" }], {
+			duration: this.state.shimmerDuration,
+			easing: "linear",
+			iterations: Infinity
+		}), this.state.activeAnimations.add(this.state.elementAnimation), !this.state.emoji) return void this.scheduleHide();
+		let a = document.createElement("div");
+		a.className = "fyi-indicator", a.textContent = this.state.emoji;
+		let o = this.getPositionTransform(this.state.position);
+		Object.assign(a.style, {
+			fontSize: "1.5rem",
+			pointerEvents: "none",
+			zIndex: "10001"
+		}), a.style.transform = o;
+		let s = this.state.element.getBoundingClientRect();
+		switch (a.style.position = "fixed", this.state.position) {
+			case "bottom":
+				a.style.top = `${s.bottom + 2}px`, a.style.left = `${s.left + s.width / 2}px`;
+				break;
+			case "top":
+				a.style.bottom = window.innerHeight - s.top + "px", a.style.left = `${s.left + s.width / 2}px`;
+				break;
+			case "left":
+				a.style.right = window.innerWidth - s.left + "px", a.style.top = `${s.top + s.height / 2}px`;
+				break;
+			case "right":
+				a.style.left = `${s.right + 12}px`, a.style.top = `${s.top + s.height / 2}px`;
+				break;
+			default: a.style.top = `${s.top}px`, a.style.right = window.innerWidth - s.right + "px";
+		}
+		document.body.appendChild(a), this.state.indicator = a;
+		let c = a.animate([{
+			opacity: 0,
+			transform: `${o} scale(0.5)`
+		}, {
+			opacity: 1,
+			transform: `${o} scale(1)`
+		}], {
+			duration: 400,
+			easing: "cubic-bezier(0.34, 1.56, 0.64, 1)",
+			fill: "forwards"
+		});
+		this.state.activeAnimations.add(c), this.applyAnimation(c, a, o), this.scheduleHide();
+	}
+	applyAnimation(e, t, n) {
+		if (!this.state) return;
+		let r = this.state.animation, i = this.state.position;
+		switch (r) {
+			case "point": {
+				let r = this.getPointingKeyframes(i, n), a = T(e, "finish").pipe(N(1), P(this.destroy$)).subscribe(() => {
+					if (!this.state || !this.isConnected) return;
+					let e = t.animate(r, {
+						duration: 1800,
+						easing: "ease-in-out",
+						iterations: Infinity
+					});
+					this.state.webAnimation = e, this.state.activeAnimations.add(e);
+				});
+				this.subscriptions.add(a);
+				break;
+			}
+			case "bounce": {
+				let e = t.animate([
+					{
+						opacity: 0,
+						transform: `${n} scale(0.3)`,
+						offset: 0
+					},
+					{
+						transform: `${n} scale(1.1)`,
+						offset: .5
+					},
+					{
+						transform: `${n} scale(0.95)`,
+						offset: .7
+					},
+					{
+						opacity: 1,
+						transform: `${n} scale(1)`,
+						offset: 1
+					}
+				], {
+					duration: 600,
+					easing: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
+					fill: "forwards"
+				});
+				this.state.webAnimation = e, this.state.activeAnimations.add(e);
+				break;
+			}
+			case "pulse": {
+				let r = T(e, "finish").pipe(N(1), P(this.destroy$)).subscribe(() => {
+					if (!this.state || !this.isConnected) return;
+					let e = t.animate([
+						{ transform: `${n} scale(1)` },
+						{ transform: `${n} scale(1.15)` },
+						{ transform: `${n} scale(1)` }
+					], {
+						duration: 1500,
+						easing: "ease-in-out",
+						iterations: Infinity
+					});
+					this.state.webAnimation = e, this.state.activeAnimations.add(e);
+				});
+				this.subscriptions.add(r);
+				break;
+			}
+			case "none": {
+				let e = t.animate([{ opacity: 0 }, { opacity: 1 }], {
+					duration: 300,
+					easing: "ease-in",
+					fill: "forwards"
+				});
+				this.state.webAnimation = e, this.state.activeAnimations.add(e);
+				break;
+			}
+		}
+	}
+	getPointingKeyframes(e, t) {
+		switch (e) {
+			case "top": return [
+				{ transform: `${t} scale(1) translateY(0px)` },
+				{ transform: `${t} scale(1) translateY(8px)` },
+				{ transform: `${t} scale(1) translateY(0px)` }
+			];
+			case "bottom": return [
+				{ transform: `${t} scale(1) translateY(0px)` },
+				{ transform: `${t} scale(1) translateY(-8px)` },
+				{ transform: `${t} scale(1) translateY(0px)` }
+			];
+			case "left": return [
+				{ transform: `${t} scale(1) translateX(0px)` },
+				{ transform: `${t} scale(1) translateX(8px)` },
+				{ transform: `${t} scale(1) translateX(0px)` }
+			];
+			case "right": return [
+				{ transform: `${t} scale(1) translateX(0px)` },
+				{ transform: `${t} scale(1) translateX(-8px)` },
+				{ transform: `${t} scale(1) translateX(0px)` }
+			];
+			default: return [
+				{ transform: `${t} scale(1) translate(0px, 0px)` },
+				{ transform: `${t} scale(1) translate(-6px, 6px)` },
+				{ transform: `${t} scale(1) translate(0px, 0px)` }
+			];
+		}
+	}
+	scheduleHide() {
+		if (!this.state?.hideAfter || !this.isConnected) return;
+		let e = D(this.state.hideAfter).pipe(P(this.destroy$)).subscribe(() => {
+			this.isConnected && this.hide();
+		});
+		this.subscriptions.add(e);
+	}
+	hide() {
+		if (!this.state) return;
+		let e = this.state, t = [];
+		if (e.indicator) {
+			let n = e.indicator.animate([{ opacity: 1 }, { opacity: 0 }], {
+				duration: 600,
+				easing: "cubic-bezier(0.4, 0, 0.2, 1)",
+				fill: "forwards"
+			});
+			e.activeAnimations.add(n);
+			let r = () => {
+				e.webAnimation?.cancel(), e.indicator?.remove();
+			};
+			t.push(n.finished.then(r).catch(r));
+		}
+		if (e.shimmerOverlay) {
+			let n = e.shimmerOverlay.animate([
+				{ opacity: 1 },
+				{
+					opacity: .7,
+					offset: .3
+				},
+				{
+					opacity: .3,
+					offset: .7
+				},
+				{ opacity: 0 }
+			], {
+				duration: 3e3,
+				easing: "ease-out",
+				fill: "forwards"
+			});
+			e.activeAnimations.add(n);
+			let r = () => {
+				e.elementAnimation?.cancel(), e.shimmerOverlay?.remove();
+			};
+			t.push(n.finished.then(r).catch(r));
+		}
+		Promise.all(t).then(() => {
+			this.state === e && (this.restoreStyles(e), this.state = null);
+		});
+	}
+	restoreStyles(e) {
+		e.element && (e.originalOverflow !== void 0 && (e.element.style.overflow = e.originalOverflow), e.originalPosition !== void 0 && (e.element.style.position = e.originalPosition));
+	}
+	getPositionTransform(e) {
+		switch (e) {
+			case "top":
+			case "bottom": return "translateX(-50%)";
+			case "left":
+			case "right": return "translateY(-50%)";
+			default: return "";
+		}
+	}
+	cleanup() {
+		this.destroy$.next(), this.destroy$.complete(), this.subscriptions.unsubscribe(), this.state &&= (this.state.activeAnimations.forEach((e) => e.cancel()), this.state.activeAnimations.clear(), this.restoreStyles(this.state), this.state.shimmerOverlay?.remove(), this.state.indicator?.remove(), null);
+	}
+	disconnected() {
+		this.cleanup();
+	}
+	reconnected() {
+		this.destroy$ = new g(), this.subscriptions = new _();
+	}
+}), Ze = U(class extends z {
+	constructor(...e) {
+		super(...e), this.hasAnimated = !1;
+	}
+	render(e) {}
+	update(e, [t]) {
+		if (e.type !== H.ELEMENT) throw Error("gravity directive must be used on an element");
+		if (this.element = e.element, this.options = t, this.hasAnimated) return;
+		if (o.value) return void (this.hasAnimated = !0);
+		let n = Math.max(.3, Math.min(3, t?.mass ?? 1)), r = t?.distance ?? 30, i = (t?.delay ?? 0) + (t?.stagger ?? 0);
+		this.animate(n, r, i), this.hasAnimated = !0;
+	}
+	reconnected() {
+		if (this.hasAnimated = !1, this.options && !o.value) {
+			let e = Math.max(.3, Math.min(3, this.options.mass ?? 1)), t = this.options.distance ?? 30, n = (this.options.delay ?? 0) + (this.options.stagger ?? 0);
+			this.animate(e, t, n), this.hasAnimated = !0;
+		}
+	}
+	animate(e, t, r) {
+		let a = e < .7 ? i : n, o = a.duration * (1 / Math.sqrt(e)), s = 1 / e * t;
+		this.animation?.cancel(), this.element.style.willChange = "transform, opacity", this.animation = this.element.animate([{
+			opacity: 0,
+			transform: `translateY(-${s}px)`
+		}, {
+			opacity: 1,
+			transform: "translateY(0)"
+		}], {
+			duration: o,
+			delay: r,
+			easing: a.easingFallback,
+			fill: "backwards"
+		}), w(this.animation.finished).pipe(N(1), I(() => {
+			this.element.style.willChange = "", this.animation = void 0;
+		}), O(() => m)).subscribe();
+	}
+	disconnected() {
+		this.animation?.cancel(), this.animation = void 0;
+	}
+}), Qe = 600, $e = !1, Q = {
+	hAlpha: "rgba(200, 50, 100, 0.85)",
+	hAlphaDim: "rgba(150, 30, 80, 0.5)",
+	oiii: "rgba(40, 180, 180, 0.7)",
+	oiiiDim: "rgba(30, 140, 150, 0.35)",
+	stellar: "rgba(255, 230, 240, 0.9)",
+	stellarDim: "rgba(255, 180, 200, 0.4)",
+	deepPurple: "rgba(80, 40, 120, 0.6)",
+	deepBlue: "rgba(20, 40, 100, 0.5)",
+	voidBlack: "rgba(0, 0, 0, 1)",
+	singularity: "rgba(10, 5, 20, 1)"
+}, et = (e) => `<svg viewBox="0 0 24 24" width="24" height="24" style="overflow:visible">\n\t<defs>\n\t\t<radialGradient id="glow">\n\t\t\t<stop offset="0%" stop-color="${e}" stop-opacity="1"/>\n\t\t\t<stop offset="50%" stop-color="${e}" stop-opacity="0.4"/>\n\t\t\t<stop offset="100%" stop-color="${e}" stop-opacity="0"/>\n\t\t</radialGradient>\n\t</defs>\n\n\t\x3c!-- Outer glow --\x3e\n\t<circle cx="12" cy="12" r="10" fill="url(#glow)"/>\n\n\t\x3c!-- Core --\x3e\n\t<circle cx="12" cy="12" r="4" fill="${e}"/>\n\n\t\x3c!-- Bright center --\x3e\n\t<circle cx="12" cy="12" r="2" fill="white" opacity="0.9"/>\n</svg>`;
+function tt(e, t) {
+	return `rgba(${parseInt(e.slice(1, 3), 16)}, ${parseInt(e.slice(3, 5), 16)}, ${parseInt(e.slice(5, 7), 16)}, ${t})`;
+}
+var nt = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state$ = new p("idle"), this.destroyed$ = new p(!1), this.visible$ = new p(!0), this.bird = null, this.blackHole = null, this.particles = [], this.trailCanvas = null, this.trailCtx = null, this.lastTrailPos = null, this.rafId = 0, this.context = null, this.element = null, this.options = {}, this.hasHome = !1, this.currentColor = "", this.shimmerOverlay = null, this.shimmerAnimation = null, this.pulseRings = [], this.homeElement = null, this.accretionDisks = [], this.lensingRing = null, this.eventHorizon = null;
+	}
+	toHostRelative(e, t) {
+		if (!this.element) return {
+			x: e,
+			y: t
+		};
+		let n = this.element.getBoundingClientRect();
+		return {
+			x: e - n.left + this.element.scrollLeft,
+			y: t - n.top + this.element.scrollTop
+		};
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t = !0]) {
+		let n = e.element, r = typeof t == "object" ? t : {};
+		return (typeof t == "boolean" ? t : !1 !== r.playing) ? (this.bird || (this.destroyed$.value && (this.destroyed$.next(!1), this.state$.next("idle")), this.element = n, this.options = r, window.getComputedStyle(n).position === "static" && (n.style.position = "relative"), n.style.overflow = "visible", function() {
+			if ($e) return;
+			$e = !0;
+			let e = document.createElement("style");
+			e.id = "hb-keyframes", e.textContent = "\n		@keyframes hb-wing {\n			0% { transform: scaleY(0.85); opacity: 0.4; }\n			100% { transform: scaleY(1.15); opacity: 0.6; }\n		}\n		@keyframes hb-disk-inner {\n			to { transform: translate(-50%, -50%) rotateX(75deg) rotate(360deg); }\n		}\n		@keyframes hb-disk-outer {\n			to { transform: translate(-50%, -50%) rotateX(70deg) rotate(-360deg); }\n		}\n		@keyframes hb-disk-mid {\n			to { transform: translate(-50%, -50%) rotateX(72deg) rotate(180deg); }\n		}\n		@keyframes hb-bh-in {\n			0% { transform: translate(-50%, -50%) scale(0); }\n			60% { transform: translate(-50%, -50%) scale(1.1); }\n			100% { transform: translate(-50%, -50%) scale(1); }\n		}\n		@keyframes hb-horizon-pulse {\n			0%, 100% { box-shadow: 0 0 20px 6px var(--hb-color), 0 0 40px 12px var(--hb-color-dim); }\n			50% { box-shadow: 0 0 30px 10px var(--hb-color), 0 0 60px 20px var(--hb-color-dim); }\n		}\n		@keyframes hb-lensing {\n			0% { transform: translate(-50%, -50%) rotateX(85deg) scale(1); opacity: 0.6; }\n			50% { transform: translate(-50%, -50%) rotateX(85deg) scale(1.05); opacity: 0.8; }\n			100% { transform: translate(-50%, -50%) rotateX(85deg) scale(1); opacity: 0.6; }\n		}\n		@keyframes hb-particle-orbit {\n			0% { transform: rotate(0deg) translateX(var(--orbit-radius)) rotate(0deg) scale(1); opacity: 0.9; }\n			100% { transform: rotate(720deg) translateX(0px) rotate(-720deg) scale(0); opacity: 0; }\n		}\n		@keyframes hb-ripple {\n			0% { transform: translate(-50%, -50%) scale(0.5); opacity: 0.8; }\n			100% { transform: translate(-50%, -50%) scale(3); opacity: 0; }\n		}\n	", document.head.appendChild(e);
+		}(), this.initStateMachine()), L) : (this.fadeOutAndCleanup(), L);
+	}
+	initStateMachine() {
+		this.state$.pipe(k(), A(() => !this.destroyed$.value), M((e) => this.handleStateTransition(e)), P(this.destroyed$.pipe(A((e) => e)))).subscribe(), y([
+			new h((e) => {
+				if (!this.element || typeof IntersectionObserver > "u") return void e.next(!0);
+				let t = new IntersectionObserver((t) => e.next(t[0].isIntersecting), { threshold: 0 });
+				return t.observe(this.element), () => t.disconnect();
+			}),
+			T(document, "visibilitychange").pipe(j(() => document.visibilityState === "visible"), fe(document.visibilityState === "visible")),
+			new h((e) => {
+				if (!this.element) return void e.next(!0);
+				let t = this.element, n = null;
+				for (; t;) {
+					if ("playing" in t) {
+						n = t;
+						break;
+					}
+					t = t.parentElement;
+				}
+				if (!n) return void e.next(!0);
+				e.next(n.playing);
+				let r = new MutationObserver(() => {
+					e.next(n.playing);
+				});
+				return r.observe(n, {
+					attributes: !0,
+					attributeFilter: ["playing"]
+				}), () => r.disconnect();
+			})
+		]).pipe(j(([e, t, n]) => e && t && n), k(), I((e) => this.visible$.next(e)), A(() => !this.destroyed$.value && !!this.context), P(this.destroyed$.pipe(A((e) => e)))).subscribe((e) => {
+			e && !this.rafId ? this.startAnimationLoop() : !e && this.rafId && (cancelAnimationFrame(this.rafId), this.rafId = 0);
+		}), T(window, "resize").pipe(ae(100), A(() => !this.destroyed$.value && !!this.context), P(this.destroyed$.pipe(A((e) => e)))).subscribe(() => this.updateDestinationPositions()), D(this.options.delay ?? 500).pipe(A(() => !this.destroyed$.value && !this.bird), M(() => new h((e) => {
+			if (!this.element) return e.next(), void e.complete();
+			let t = () => {
+				this.isElementVisible(this.element) ? (e.next(), e.complete()) : D(50).pipe(P(this.destroyed$.pipe(A((e) => e)))).subscribe(t);
+			};
+			t();
+		})), M(() => this.createBird()), I(() => {
+			this.destroyed$.value || this.state$.next("flying");
+		}), P(this.destroyed$.pipe(A((e) => e)))).subscribe();
+	}
+	handleStateTransition(e) {
+		switch (e) {
+			case "idle":
+			default: return m;
+			case "flying":
+			case "hovering":
+			case "spiraling":
+			case "absorbed": return this.startAnimationLoop(), m;
+			case "done": return this.cleanup(), this.element?.dispatchEvent(new CustomEvent("hummingbird-complete", {
+				bubbles: !0,
+				composed: !0
+			})), m;
+		}
+	}
+	async createBird() {
+		if (!this.element) return;
+		let e = document.createElement("div");
+		e.innerHTML = et(this.currentColor), e.className = "pointer-events-none", e.style.cssText = "\n			position: absolute;\n			left: 0;\n			top: 0;\n			width: 24px;\n			height: 24px;\n			z-index: 99999;\n			will-change: transform, opacity;\n			transform-origin: center center;\n			transition: opacity 400ms ease-out;\n		", this.element.appendChild(e), this.bird = e, this.discoverInitialColor();
+		let t = this.element.getBoundingClientRect(), n = this.toHostRelative(t.left, t.top), r = await this.discoverWaypoints(this.options.waypoints || []), i = this.options.home ? await this.getPosition(this.options.home) : null, a = [...r];
+		this.hasHome = !!i, i && a.push(i), a.length === 0 && a.push({
+			x: n.x + t.width + 60,
+			y: n.y + .5 * t.height,
+			duration: Qe
+		});
+		let o = n.x - 60, s = n.y + t.height / 2;
+		this.context = {
+			state: "flying",
+			cx: o,
+			cy: s,
+			flightStartX: o,
+			flightStartY: s,
+			phaseStart: performance.now(),
+			destIdx: 0,
+			destinations: a,
+			bx: 0,
+			by: 0
+		}, this.bird.style.transform = `translate(${o - 12}px, ${s - 12}px)`;
+	}
+	discoverInitialColor() {
+		this.element && (T(window, l).pipe(N(1), P(D(150)), j((e) => e.detail.theme?.color), A((e) => !!e && e !== this.currentColor), P(this.destroyed$.pipe(A((e) => e)))).subscribe((e) => {
+			this.bird && (this.currentColor = e, this.bird.innerHTML = et(e));
+		}), this.element.dispatchEvent(new CustomEvent(s, {
+			bubbles: !0,
+			composed: !0
+		})));
+	}
+	updateBirdColor() {
+		if (!this.bird || !this.context || this.destroyed$.value) return;
+		let e = this.context.destinations[this.context.destIdx];
+		e?.element && (T(window, l).pipe(N(1), P(D(100)), j((e) => e.detail.theme?.color), A((e) => !!e && e !== this.currentColor), P(this.destroyed$.pipe(A((e) => e)))).subscribe((e) => {
+			this.bird && (this.currentColor = e, this.bird.innerHTML = et(e));
+		}), e.element.dispatchEvent(new CustomEvent(s, {
+			bubbles: !0,
+			composed: !0
+		})));
+	}
+	discoverWaypoints(e) {
+		if (e.length === 0) return Promise.resolve([]);
+		let t = e.map((e) => typeof e == "string" || e instanceof HTMLElement ? {
+			ref: e,
+			duration: Qe
+		} : {
+			ref: e.ref,
+			duration: e.duration ?? Qe
+		}), n = t.map((e) => this.discoverElement(e.ref));
+		return new Promise((e) => {
+			ee(n).pipe(j((e) => e.map((e, n) => {
+				if (!e) return null;
+				let r = e.getBoundingClientRect(), i = this.toHostRelative(r.left + r.width / 2, r.top + r.height / 2);
+				return {
+					x: i.x,
+					y: i.y,
+					element: e,
+					duration: t[n].duration
+				};
+			}).filter((e) => e !== null)), P(this.destroyed$.pipe(A((e) => e)))).subscribe({
+				next: (t) => e(t),
+				error: () => e([])
+			});
+		});
+	}
+	discoverElement(e) {
+		return e instanceof HTMLElement ? Promise.resolve(e) : new Promise((t) => {
+			f(e, 300).pipe(P(this.destroyed$.pipe(A((e) => e)))).subscribe({
+				next: (e) => t(e),
+				error: () => t(null)
+			});
+		});
+	}
+	async getPosition(e) {
+		let t = await this.discoverElement(e);
+		if (!t) return null;
+		let n = t.getBoundingClientRect(), r = this.toHostRelative(n.left + n.width / 2, n.top + n.height / 2);
+		return {
+			x: r.x,
+			y: r.y,
+			element: t,
+			duration: Qe
+		};
+	}
+	updateDestinationPositions() {
+		if (this.context) {
+			for (let e of this.context.destinations) if (e.element) {
+				let t = e.element.getBoundingClientRect(), n = this.toHostRelative(t.left + t.width / 2, t.top + t.height / 2);
+				e.x = n.x, e.y = n.y;
+			}
+		}
+	}
+	startAnimationLoop() {
+		if (this.rafId) return;
+		let e = (t) => {
+			if (this.bird && this.context && !this.destroyed$.value && this.visible$.value) {
+				switch (this.state$.value) {
+					case "flying":
+						this.tickFlying(t);
+						break;
+					case "hovering":
+						this.tickHovering(t);
+						break;
+					case "spiraling":
+						this.tickSpiraling(t);
+						break;
+					case "absorbed":
+						this.tickAbsorbed(t);
+						return;
+				}
+				this.rafId = requestAnimationFrame(e);
+			} else this.rafId = 0;
+		};
+		this.rafId = requestAnimationFrame(e);
+	}
+	tickFlying(e) {
+		if (!this.context || !this.bird) return;
+		let t = this.context, n = e - t.phaseStart, r = t.destinations[t.destIdx], i = r.x - t.flightStartX, a = r.y - t.flightStartY, o = Math.hypot(i, a) / 200 * 1e3, s = Math.min(1, n / o), c = s < .5 ? 4 * s * s * s : 1 - (-2 * s + 2) ** 3 / 2;
+		t.cx = t.flightStartX + i * c, t.cy = t.flightStartY + a * c, this.bird.style.transform = `translate(${t.cx - 12}px, ${t.cy - 12}px)`, this.options.showConnections && (this.drawTrail(t.cx, t.cy), this.fadeTrail()), Math.floor(n / 200) !== Math.floor((n - 16) / 200) && this.updateBirdColor(), s >= 1 && (t.destIdx >= t.destinations.length - 1 && this.hasHome ? (t.bx = r.x, t.by = r.y, t.phaseStart = e, this.createBlackHole(t.bx, t.by), this.state$.next("spiraling")) : (t.phaseStart = e, this.state$.next("hovering")));
+	}
+	tickHovering(e) {
+		if (!this.context || !this.bird) return;
+		let t = this.context, n = e - t.phaseStart, r = t.destinations[t.destIdx];
+		n < 20 && r.element && !this.shimmerOverlay && (this.showShimmer(r.element), this.showPulseRings(r.x, r.y), this.bird.style.opacity = "0"), t.cx = r.x, t.cy = r.y;
+		let i = 1 + .08 * Math.sin(.006 * n);
+		if (this.bird.style.transform = `translate(${r.x - 12}px, ${r.y - 12}px) scale(${i})`, n > r.duration) {
+			let n = t.destinations[t.destIdx + 1];
+			if (!n && !this.hasHome) return this.hideShimmer(), void this.fadeOutBird();
+			if (n?.element && !this.isElementVisible(n.element)) return;
+			if (n?.element && !this.isInViewport(n.element) && n.element.scrollIntoView({
+				behavior: "smooth",
+				block: "center",
+				inline: "center"
+			}), n?.element) {
+				let e = n.element.getBoundingClientRect(), t = this.toHostRelative(e.left + e.width / 2, e.top + e.height / 2);
+				n.x = t.x, n.y = t.y;
+			}
+			this.bird.style.opacity = "1", this.hideShimmer(), this.resetTrail(), t.destIdx++, t.flightStartX = r.x, t.flightStartY = r.y, t.phaseStart = e, this.state$.next("flying");
+		}
+	}
+	isElementVisible(e) {
+		let t = window.getComputedStyle(e);
+		return parseFloat(t.opacity) > .5 && t.visibility !== "hidden" && t.display !== "none";
+	}
+	isInViewport(e) {
+		let t = e.getBoundingClientRect();
+		return t.bottom > 80 && t.top < window.innerHeight - 80 && t.right > 80 && t.left < window.innerWidth - 80;
+	}
+	showShimmer(e) {
+		let t = window.getComputedStyle(e);
+		t.position === "static" && (e.style.position = "relative");
+		let n = document.createElement("div");
+		n.style.cssText = `\n\t\t\tposition: absolute;\n\t\t\tinset: 0;\n\t\t\tpointer-events: none;\n\t\t\tz-index: 9999;\n\t\t\tborder-radius: ${t.borderRadius};\n\t\t\tbackground: linear-gradient(\n\t\t\t\t108deg,\n\t\t\t\ttransparent 0%,\n\t\t\t\ttransparent 30%,\n\t\t\t\trgba(255, 255, 255, 0.02) 38%,\n\t\t\t\trgba(255, 255, 255, 0.06) 45%,\n\t\t\t\trgba(255, 255, 255, 0.08) 50%,\n\t\t\t\trgba(255, 255, 255, 0.06) 55%,\n\t\t\t\trgba(255, 255, 255, 0.02) 62%,\n\t\t\t\ttransparent 70%,\n\t\t\t\ttransparent 100%\n\t\t\t);\n\t\t\tbackground-size: 300% 100%;\n\t\t`, e.appendChild(n), this.shimmerOverlay = n, this.shimmerAnimation = n.animate([{ backgroundPosition: "300% 0" }, { backgroundPosition: "-100% 0" }], {
+			duration: 1e4,
+			easing: "cubic-bezier(0.25, 0.1, 0.25, 1)",
+			iterations: Infinity
+		});
+	}
+	hideShimmer() {
+		if (this.shimmerAnimation &&= (this.shimmerAnimation.cancel(), null), this.shimmerOverlay) {
+			let e = this.shimmerOverlay.animate([{ opacity: 1 }, { opacity: 0 }], {
+				duration: 300,
+				easing: "ease-out",
+				fill: "forwards"
+			}), t = this.shimmerOverlay;
+			e.onfinish = () => t.remove(), this.shimmerOverlay = null;
+		}
+	}
+	fadeOutBird() {
+		this.bird && (this.state$.next("idle"), this.bird.style.opacity = "1", this.bird.animate([{
+			opacity: 1,
+			transform: this.bird.style.transform
+		}, {
+			opacity: 0,
+			transform: this.bird.style.transform
+		}], {
+			duration: 400,
+			easing: "ease-out",
+			fill: "forwards"
+		}).onfinish = () => {
+			this.state$.next("done");
+		});
+	}
+	fadeOutAndCleanup() {
+		if (!this.bird) return void this.cleanup();
+		this.rafId &&= (cancelAnimationFrame(this.rafId), 0), this.bird.style.opacity = "1";
+		let e = this.bird.animate([
+			{ opacity: 1 },
+			{
+				opacity: .8,
+				offset: .3
+			},
+			{
+				opacity: .5,
+				offset: .6
+			},
+			{
+				opacity: .2,
+				offset: .85
+			},
+			{ opacity: 0 }
+		], {
+			duration: 3e3,
+			easing: "linear",
+			fill: "forwards"
+		});
+		this.trailCanvas && this.trailCanvas.animate([{ opacity: 1 }, { opacity: 0 }], {
+			duration: 3500,
+			easing: "ease-out",
+			fill: "forwards"
+		}), this.hideShimmer(), e.onfinish = () => {
+			this.cleanup();
+		};
+	}
+	showPulseRings(e, t) {
+		let n = this.currentColor;
+		for (let r = 0; r < 3; r++) {
+			let i = document.createElement("div");
+			i.className = "pointer-events-none", i.style.cssText = `\n\t\t\t\tposition: absolute;\n\t\t\t\tleft: ${e}px;\n\t\t\t\ttop: ${t}px;\n\t\t\t\twidth: 40px;\n\t\t\t\theight: 40px;\n\t\t\t\tborder-radius: 9999px;\n\t\t\t\tborder: 2px solid ${tt(n, .5)};\n\t\t\t\ttransform: translate(-50%, -50%) scale(1);\n\t\t\t\tz-index: 9998;\n\t\t\t\twill-change: transform, opacity;\n\t\t\t`, this.element?.appendChild(i), this.pulseRings.push(i), i.animate([{
+				transform: "translate(-50%, -50%) scale(1)",
+				opacity: .6
+			}, {
+				transform: "translate(-50%, -50%) scale(4)",
+				opacity: 0
+			}], {
+				duration: 1200,
+				delay: 300 * r,
+				easing: "ease-out",
+				fill: "forwards"
+			}).onfinish = () => i.remove();
+		}
+		D(1800).pipe(P(this.destroyed$.pipe(A((e) => e)))).subscribe(() => {
+			this.pulseRings = [];
+		});
+	}
+	tickSpiraling(e) {
+		if (!this.context || !this.bird) return;
+		let t = this.context, n = e - t.phaseStart, r = t.bx - t.cx, i = t.by - t.cy, a = Math.hypot(r, i);
+		if (a > 8) {
+			let e = 180 * (1 - a / 150) ** 2 + 40, o = Math.min(e, .15 * a), s = Math.atan2(i, r), c = .015 * Math.min(1, a / 60), l = .012 * n, u = Math.sin(l) * a * c;
+			t.cx += Math.cos(s) * o * .016 + Math.cos(s + Math.PI / 2) * u, t.cy += Math.sin(s) * o * .016 + Math.sin(s + Math.PI / 2) * u;
+			let d = Math.max(.2, a / 120), f = .3 * n;
+			this.bird.style.transform = `translate(${t.cx - 12}px, ${t.cy - 12}px) rotate(${f}deg) scale(${d})`;
+			let p = 1 - a / 100;
+			p > .3 && (this.bird.style.filter = `brightness(${1 + .5 * p}) drop-shadow(0 0 ${8 * p}px ${this.currentColor})`);
+		} else t.phaseStart = e, this.startHostDistortion(), this.state$.next("absorbed");
+	}
+	startHostDistortion() {
+		if (!this.context) return;
+		let e = this.context.destinations[this.context.destinations.length - 1];
+		if (!e?.element) return;
+		this.homeElement = e.element;
+		let t = this.homeElement, n = this.currentColor, r = t.style.transform || "";
+		t.animate([
+			{
+				transform: `${r} translate(0, 0) scale(1) rotate(0deg)`,
+				filter: "brightness(1)"
+			},
+			{
+				transform: `${r} translate(-2px, 1px) scale(0.992) rotate(-0.3deg)`,
+				filter: "brightness(1.05)",
+				offset: .05
+			},
+			{
+				transform: `${r} translate(3px, -1px) scale(1.005) rotate(0.4deg)`,
+				filter: "brightness(1.1)",
+				offset: .1
+			},
+			{
+				transform: `${r} translate(-1px, 2px) scale(0.995) rotate(-0.2deg)`,
+				filter: `brightness(1.15) drop-shadow(0 0 5px ${n})`,
+				offset: .15
+			},
+			{
+				transform: `${r} translate(2px, 0px) scale(1.008) rotate(0.5deg)`,
+				filter: "brightness(1.2)",
+				offset: .2
+			},
+			{
+				transform: `${r} translate(-3px, -2px) scale(0.988) rotate(-0.6deg)`,
+				filter: `brightness(1.25) drop-shadow(0 0 8px ${n})`,
+				offset: .25
+			},
+			{
+				transform: `${r} translate(1px, 3px) scale(1.01) rotate(0.3deg)`,
+				filter: "brightness(1.3)",
+				offset: .3
+			},
+			{
+				transform: `${r} translate(-2px, -1px) scale(0.985) rotate(-0.4deg)`,
+				filter: `brightness(1.35) drop-shadow(0 0 12px ${n})`,
+				offset: .35
+			},
+			{
+				transform: `${r} translate(4px, 1px) scale(1.015) rotate(0.7deg)`,
+				filter: "brightness(1.4)",
+				offset: .4
+			},
+			{
+				transform: `${r} translate(-1px, 2px) scale(0.99) rotate(-0.5deg)`,
+				filter: `brightness(1.35) drop-shadow(0 0 15px ${n})`,
+				offset: .45
+			},
+			{
+				transform: `${r} translate(2px, -2px) scale(1.012) rotate(0.4deg)`,
+				filter: "brightness(1.3)",
+				offset: .5
+			},
+			{
+				transform: `${r} translate(-3px, 1px) scale(0.993) rotate(-0.3deg)`,
+				filter: `brightness(1.25) drop-shadow(0 0 10px ${n})`,
+				offset: .55
+			},
+			{
+				transform: `${r} translate(1px, -1px) scale(1.006) rotate(0.2deg)`,
+				filter: "brightness(1.2)",
+				offset: .6
+			},
+			{
+				transform: `${r} translate(-1px, 1px) scale(0.997) rotate(-0.15deg)`,
+				filter: "brightness(1.15)",
+				offset: .7
+			},
+			{
+				transform: `${r} translate(1px, 0px) scale(1.003) rotate(0.1deg)`,
+				filter: "brightness(1.1)",
+				offset: .8
+			},
+			{
+				transform: `${r} translate(0px, -1px) scale(0.999) rotate(-0.05deg)`,
+				filter: "brightness(1.05)",
+				offset: .9
+			},
+			{
+				transform: `${r} translate(0, 0) scale(1) rotate(0deg)`,
+				filter: "brightness(1)"
+			}
+		], {
+			duration: 500,
+			easing: "linear"
+		});
+	}
+	tickAbsorbed(e) {
+		if (!this.context || !this.bird) return;
+		let t = this.context, n = e - t.phaseStart, r = Math.min(1, n / 500), i = r * r * r, a = .2 * (1 - .9 * i), o = .2 * (1 - i) * (1 + 2 * i), s = r * r * 1080;
+		this.bird.style.transform = `translate(${t.bx - 12}px, ${t.by - 12}px) rotate(${s}deg) scale(${a}, ${o})`, this.bird.style.opacity = String(Math.max(0, 1 - 1.2 * i)), this.bird.style.filter = `brightness(${1 + 3 * i}) blur(${2 * i}px)`, r >= 1 ? this.collapseBlackHole() : this.rafId = requestAnimationFrame((e) => this.tickAbsorbed(e));
+	}
+	createBlackHole(e, t) {
+		let n = this.currentColor, r = document.createElement("div");
+		r.className = "pointer-events-none", r.style.cssText = `\n\t\t\tposition: absolute;\n\t\t\tleft: ${e}px;\n\t\t\ttop: ${t}px;\n\t\t\twidth: 100px;\n\t\t\theight: 100px;\n\t\t\tborder-radius: 9999px;\n\t\t\tborder: 1px solid ${Q.oiiiDim};\n\t\t\tbackground: radial-gradient(circle, transparent 40%, ${Q.deepPurple} 70%, transparent 100%);\n\t\t\tbox-shadow:\n\t\t\t\tinset 0 0 25px ${Q.oiiiDim},\n\t\t\t\t0 0 40px ${Q.deepPurple},\n\t\t\t\t0 0 60px ${tt(n, .15)};\n\t\t\ttransform: translate(-50%, -50%) rotateX(85deg) scale(0);\n\t\t\tz-index: 9994;\n\t\t\twill-change: transform, opacity;\n\t\t\tanimation: hb-lensing 2s ease-in-out infinite;\n\t\t`, r.animate([{ transform: "translate(-50%, -50%) rotateX(85deg) scale(0)" }, { transform: "translate(-50%, -50%) rotateX(85deg) scale(1)" }], {
+			duration: 600,
+			easing: "cubic-bezier(0.34, 1.56, 0.64, 1)",
+			fill: "forwards"
+		}), this.element?.appendChild(r), this.lensingRing = r, [
+			{
+				size: 85,
+				speed: 4,
+				color1: Q.oiii,
+				color2: Q.deepBlue,
+				rotateX: 68,
+				reverse: !0
+			},
+			{
+				size: 68,
+				speed: 2.5,
+				color1: Q.hAlpha,
+				color2: Q.hAlphaDim,
+				rotateX: 72,
+				reverse: !1
+			},
+			{
+				size: 52,
+				speed: 1.8,
+				color1: Q.stellar,
+				color2: Q.stellarDim,
+				rotateX: 76,
+				reverse: !0
+			}
+		].forEach((n, r) => {
+			let i = document.createElement("div");
+			i.className = "pointer-events-none";
+			let a = n.reverse ? "-" : "";
+			i.style.cssText = `\n\t\t\t\tposition: absolute;\n\t\t\t\tleft: ${e}px;\n\t\t\t\ttop: ${t}px;\n\t\t\t\twidth: ${n.size}px;\n\t\t\t\theight: ${n.size}px;\n\t\t\t\tborder-radius: 9999px;\n\t\t\t\tbackground: conic-gradient(\n\t\t\t\t\tfrom ${45 * r}deg,\n\t\t\t\t\ttransparent 0%,\n\t\t\t\t\t${n.color1} 15%,\n\t\t\t\t\t${n.color2} 35%,\n\t\t\t\t\ttransparent 50%,\n\t\t\t\t\t${n.color1} 65%,\n\t\t\t\t\t${n.color2} 85%,\n\t\t\t\t\ttransparent 100%\n\t\t\t\t);\n\t\t\t\ttransform: translate(-50%, -50%) rotateX(${n.rotateX}deg) scale(0);\n\t\t\t\tz-index: ${9995 + r};\n\t\t\t\twill-change: transform;\n\t\t\t\tfilter: blur(${.3 * r}px);\n\t\t\t\tmix-blend-mode: screen;\n\t\t\t`, i.animate([{ transform: `translate(-50%, -50%) rotateX(${n.rotateX}deg) scale(0) rotate(0deg)` }, { transform: `translate(-50%, -50%) rotateX(${n.rotateX}deg) scale(1) rotate(0deg)` }], {
+				duration: 400 + 100 * r,
+				easing: "cubic-bezier(0.34, 1.56, 0.64, 1)",
+				fill: "forwards"
+			}).onfinish = () => {
+				i.style.transform = `translate(-50%, -50%) rotateX(${n.rotateX}deg) scale(1)`, i.animate([{ transform: `translate(-50%, -50%) rotateX(${n.rotateX}deg) scale(1) rotate(0deg)` }, { transform: `translate(-50%, -50%) rotateX(${n.rotateX}deg) scale(1) rotate(${a}360deg)` }], {
+					duration: 1e3 * n.speed,
+					easing: "linear",
+					iterations: Infinity
+				});
+			}, this.element?.appendChild(i), this.accretionDisks.push(i);
+		});
+		let i = document.createElement("div");
+		i.className = "pointer-events-none", i.style.cssText = `\n\t\t\t--hb-color: ${Q.hAlpha};\n\t\t\t--hb-color-dim: ${Q.oiiiDim};\n\t\t\tposition: absolute;\n\t\t\tleft: ${e}px;\n\t\t\ttop: ${t}px;\n\t\t\twidth: 36px;\n\t\t\theight: 36px;\n\t\t\tborder-radius: 9999px;\n\t\t\tbackground: radial-gradient(circle,\n\t\t\t\t${Q.singularity} 0%,\n\t\t\t\t${Q.voidBlack} 40%,\n\t\t\t\t${Q.deepPurple} 60%,\n\t\t\t\t${Q.hAlphaDim} 75%,\n\t\t\t\ttransparent 100%\n\t\t\t);\n\t\t\tbox-shadow:\n\t\t\t\t0 0 15px 4px ${Q.hAlpha},\n\t\t\t\t0 0 30px 8px ${Q.oiiiDim},\n\t\t\t\t0 0 50px 15px ${Q.deepPurple},\n\t\t\t\tinset 0 0 15px ${Q.voidBlack};\n\t\t\ttransform: translate(-50%, -50%) scale(0);\n\t\t\tz-index: 9999;\n\t\t\twill-change: transform, box-shadow;\n\t\t\tanimation: hb-horizon-pulse 1.5s ease-in-out infinite;\n\t\t`, i.animate([
+			{ transform: "translate(-50%, -50%) scale(0)" },
+			{
+				transform: "translate(-50%, -50%) scale(1.15)",
+				offset: .6
+			},
+			{ transform: "translate(-50%, -50%) scale(1)" }
+		], {
+			duration: 500,
+			easing: "cubic-bezier(0.34, 1.56, 0.64, 1)",
+			fill: "forwards"
+		}), this.element?.appendChild(i), this.eventHorizon = i, this.blackHole = i, this.addParticles(e, t);
+	}
+	addParticles(e, t) {
+		let n = [
+			{
+				bg: Q.hAlpha,
+				glow: Q.hAlphaDim
+			},
+			{
+				bg: Q.oiii,
+				glow: Q.oiiiDim
+			},
+			{
+				bg: Q.stellar,
+				glow: Q.stellarDim
+			},
+			{
+				bg: "rgba(255, 255, 255, 0.9)",
+				glow: Q.stellarDim
+			}
+		];
+		for (let r = 0; r < 10; r++) {
+			let i = document.createElement("div"), a = r / 10 * Math.PI * 2, o = 45 + r % 3 * 18, s = 2 + r % 3, c = 1400 + r % 3 * 400, l = 70 * r, u = n[r % n.length];
+			i.className = "pointer-events-none", i.style.cssText = `\n\t\t\t\t--orbit-radius: ${o}px;\n\t\t\t\tposition: absolute;\n\t\t\t\twidth: ${s}px;\n\t\t\t\theight: ${s}px;\n\t\t\t\tborder-radius: 9999px;\n\t\t\t\tbackground: ${u.bg};\n\t\t\t\tbox-shadow: 0 0 ${4 * s}px ${u.bg}, 0 0 ${8 * s}px ${u.glow};\n\t\t\t\tleft: ${e}px;\n\t\t\t\ttop: ${t}px;\n\t\t\t\tz-index: 9997;\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\ttransform-origin: center center;\n\t\t\t\ttransform: rotate(${a}rad) translateX(${o}px);\n\t\t\t\topacity: 0;\n\t\t\t`, this.element?.appendChild(i), this.particles.push(i), i.animate([
+				{
+					transform: `rotate(${a}rad) translateX(${o}px) scale(1)`,
+					opacity: 0
+				},
+				{
+					transform: `rotate(${a}rad) translateX(${o}px) scale(1)`,
+					opacity: .9,
+					offset: .1
+				},
+				{
+					transform: `rotate(${a + Math.PI}rad) translateX(${.5 * o}px) scale(0.8)`,
+					opacity: .7,
+					offset: .5
+				},
+				{
+					transform: `rotate(${a + 2 * Math.PI}rad) translateX(0px) scale(0)`,
+					opacity: 0
+				}
+			], {
+				duration: c,
+				delay: l,
+				easing: "cubic-bezier(0.4, 0, 0.2, 1)",
+				fill: "forwards"
+			}).onfinish = () => i.remove();
+		}
+		let r = [
+			Q.hAlpha,
+			Q.oiii,
+			Q.stellar,
+			Q.oiii
+		];
+		for (let n = 0; n < 5; n++) {
+			let i = document.createElement("div"), a = n / 5 * Math.PI * 2 + Math.PI / 10, o = 65 + 25 * Math.random(), s = r[n % r.length];
+			i.className = "pointer-events-none", i.style.cssText = `\n\t\t\t\tposition: absolute;\n\t\t\t\twidth: 2px;\n\t\t\t\theight: 14px;\n\t\t\t\tborder-radius: 1px;\n\t\t\t\tbackground: linear-gradient(to bottom, transparent, ${s}, rgba(255,255,255,0.3));\n\t\t\t\tleft: ${e + Math.cos(a) * o}px;\n\t\t\t\ttop: ${t + Math.sin(a) * o}px;\n\t\t\t\tz-index: 9996;\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\ttransform: rotate(${a + Math.PI / 2}rad) scale(0);\n\t\t\t\topacity: 0;\n\t\t\t\tmix-blend-mode: screen;\n\t\t\t`, this.element?.appendChild(i), this.particles.push(i), i.animate([
+				{
+					transform: `rotate(${a + Math.PI / 2}rad) scale(0)`,
+					opacity: 0,
+					left: `${e + Math.cos(a) * o}px`,
+					top: `${t + Math.sin(a) * o}px`
+				},
+				{
+					transform: `rotate(${a + Math.PI / 2}rad) scale(1.5)`,
+					opacity: .85,
+					left: `${e + Math.cos(a) * o * .5}px`,
+					top: `${t + Math.sin(a) * o * .5}px`,
+					offset: .3
+				},
+				{
+					transform: `rotate(${a + Math.PI / 2}rad) scale(0.5)`,
+					opacity: 0,
+					left: `${e}px`,
+					top: `${t}px`
+				}
+			], {
+				duration: 900,
+				delay: 150 + 120 * n,
+				easing: "cubic-bezier(0.55, 0, 1, 0.45)",
+				fill: "forwards"
+			}).onfinish = () => i.remove();
+		}
+	}
+	collapseBlackHole() {
+		if (this.bird?.remove(), this.particles.forEach((e) => e.remove()), !this.context) return void this.state$.next("done");
+		let { bx: e, by: t } = this.context, n = this.currentColor;
+		this.accretionDisks.forEach((e, t) => {
+			e.animate([{
+				transform: e.style.transform,
+				opacity: 1
+			}, {
+				transform: "translate(-50%, -50%) rotateX(90deg) scale(0)",
+				opacity: 0
+			}], {
+				duration: 200 + 50 * t,
+				easing: "ease-in",
+				fill: "forwards"
+			}).onfinish = () => e.remove();
+		}), this.accretionDisks = [], this.lensingRing && (this.lensingRing.animate([{
+			transform: "translate(-50%, -50%) rotateX(85deg) scale(1)",
+			opacity: .6
+		}, {
+			transform: "translate(-50%, -50%) rotateX(85deg) scale(0)",
+			opacity: 0
+		}], {
+			duration: 250,
+			easing: "ease-in",
+			fill: "forwards"
+		}).onfinish = () => this.lensingRing?.remove());
+		let r = this.blackHole;
+		r && (r.animate([
+			{
+				transform: "translate(-50%, -50%) scale(1)",
+				filter: "brightness(1)"
+			},
+			{
+				transform: "translate(-50%, -50%) scale(1.3)",
+				filter: "brightness(3)",
+				offset: .2
+			},
+			{
+				transform: "translate(-50%, -50%) scale(0)",
+				filter: "brightness(5)",
+				opacity: 0
+			}
+		], {
+			duration: 350,
+			easing: "cubic-bezier(0.55, 0, 1, 0.45)",
+			fill: "forwards"
+		}).onfinish = () => r.remove());
+		let i = [
+			{
+				border: Q.stellar,
+				glow: Q.stellarDim
+			},
+			{
+				border: Q.hAlpha,
+				glow: Q.hAlphaDim
+			},
+			{
+				border: Q.oiii,
+				glow: Q.oiiiDim
+			},
+			{
+				border: Q.deepPurple,
+				glow: Q.deepBlue
+			}
+		];
+		for (let n = 0; n < 4; n++) {
+			let r = document.createElement("div"), a = i[n];
+			r.className = "pointer-events-none", r.style.cssText = `\n\t\t\t\tposition: absolute;\n\t\t\t\tleft: ${e}px;\n\t\t\t\ttop: ${t}px;\n\t\t\t\twidth: 20px;\n\t\t\t\theight: 20px;\n\t\t\t\tborder-radius: 9999px;\n\t\t\t\tborder: ${2.5 - .4 * n}px solid ${a.border};\n\t\t\t\tbox-shadow:\n\t\t\t\t\t0 0 ${18 - 3 * n}px ${a.border},\n\t\t\t\t\t0 0 ${30 - 5 * n}px ${a.glow},\n\t\t\t\t\tinset 0 0 ${12 - 2 * n}px ${a.glow};\n\t\t\t\ttransform: translate(-50%, -50%) scale(0.5);\n\t\t\t\tz-index: ${9990 - n};\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\tmix-blend-mode: screen;\n\t\t\t`, this.element?.appendChild(r), r.animate([
+				{
+					transform: "translate(-50%, -50%) scale(0.5)",
+					opacity: .95,
+					borderWidth: 2.5 - .4 * n + "px"
+				},
+				{
+					transform: "translate(-50%, -50%) scale(2.5)",
+					opacity: .6,
+					borderWidth: 1.8 - .3 * n + "px",
+					offset: .35
+				},
+				{
+					transform: "translate(-50%, -50%) scale(6)",
+					opacity: 0,
+					borderWidth: "0.5px"
+				}
+			], {
+				duration: 800 + 120 * n,
+				delay: 60 * n,
+				easing: "cubic-bezier(0, 0.55, 0.45, 1)",
+				fill: "forwards"
+			}).onfinish = () => r.remove();
+		}
+		let a = document.createElement("div");
+		a.className = "pointer-events-none", a.style.cssText = `\n\t\t\tposition: absolute;\n\t\t\tleft: ${e}px;\n\t\t\ttop: ${t}px;\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t\tborder-radius: 9999px;\n\t\t\tbackground: radial-gradient(circle,\n\t\t\t\twhite 0%,\n\t\t\t\t${Q.stellar} 20%,\n\t\t\t\t${Q.hAlpha} 50%,\n\t\t\t\t${Q.oiiiDim} 70%,\n\t\t\t\ttransparent 100%\n\t\t\t);\n\t\t\ttransform: translate(-50%, -50%) scale(0);\n\t\t\tz-index: 10000;\n\t\t\twill-change: transform, opacity;\n\t\t`, this.element?.appendChild(a), a.animate([
+			{
+				transform: "translate(-50%, -50%) scale(0)",
+				opacity: 1
+			},
+			{
+				transform: "translate(-50%, -50%) scale(5)",
+				opacity: 1,
+				offset: .12
+			},
+			{
+				transform: "translate(-50%, -50%) scale(8)",
+				opacity: 0
+			}
+		], {
+			duration: 450,
+			easing: "ease-out",
+			fill: "forwards"
+		}).onfinish = () => a.remove();
+		let o = document.createElement("div");
+		if (o.className = "pointer-events-none", o.style.cssText = `\n\t\t\tposition: absolute;\n\t\t\tleft: ${e}px;\n\t\t\ttop: ${t}px;\n\t\t\twidth: 50px;\n\t\t\theight: 50px;\n\t\t\tborder-radius: 9999px;\n\t\t\tbackground: radial-gradient(circle,\n\t\t\t\t${Q.stellarDim} 0%,\n\t\t\t\t${Q.hAlphaDim} 30%,\n\t\t\t\t${Q.oiiiDim} 50%,\n\t\t\t\t${Q.deepPurple} 70%,\n\t\t\t\ttransparent 100%\n\t\t\t);\n\t\t\ttransform: translate(-50%, -50%);\n\t\t\tz-index: 9989;\n\t\t\twill-change: opacity;\n\t\t\tmix-blend-mode: screen;\n\t\t`, this.element?.appendChild(o), o.animate([
+			{
+				opacity: 1,
+				transform: "translate(-50%, -50%) scale(1)"
+			},
+			{
+				opacity: .6,
+				transform: "translate(-50%, -50%) scale(1.8)",
+				offset: .4
+			},
+			{
+				opacity: 0,
+				transform: "translate(-50%, -50%) scale(2.5)"
+			}
+		], {
+			duration: 900,
+			easing: "ease-out",
+			fill: "forwards"
+		}).onfinish = () => {
+			o.remove(), this.state$.next("done");
+		}, this.homeElement) {
+			let e = this.homeElement, t = e.style.transform || "";
+			e.animate([
+				{
+					transform: `${t} translate(0, 0) scale(1) rotate(0deg)`,
+					filter: "brightness(1)"
+				},
+				{
+					transform: `${t} translate(0, 0) scale(1.04) rotate(0deg)`,
+					filter: `brightness(2) drop-shadow(0 0 30px ${n})`,
+					offset: .05
+				},
+				{
+					transform: `${t} translate(-4px, 2px) scale(1.025) rotate(-0.8deg)`,
+					filter: `brightness(1.6) drop-shadow(0 0 25px ${n})`,
+					offset: .1
+				},
+				{
+					transform: `${t} translate(5px, -3px) scale(0.98) rotate(1deg)`,
+					filter: `brightness(1.4) drop-shadow(0 0 20px ${n})`,
+					offset: .15
+				},
+				{
+					transform: `${t} translate(-3px, -2px) scale(1.02) rotate(-0.6deg)`,
+					filter: `brightness(1.3) drop-shadow(0 0 18px ${n})`,
+					offset: .2
+				},
+				{
+					transform: `${t} translate(4px, 3px) scale(0.985) rotate(0.8deg)`,
+					filter: `brightness(1.25) drop-shadow(0 0 15px ${n})`,
+					offset: .25
+				},
+				{
+					transform: `${t} translate(-2px, 1px) scale(1.015) rotate(-0.5deg)`,
+					filter: `brightness(1.2) drop-shadow(0 0 12px ${n})`,
+					offset: .3
+				},
+				{
+					transform: `${t} translate(3px, -2px) scale(0.99) rotate(0.6deg)`,
+					filter: `brightness(1.18) drop-shadow(0 0 10px ${n})`,
+					offset: .35
+				},
+				{
+					transform: `${t} translate(-2px, 2px) scale(1.01) rotate(-0.4deg)`,
+					filter: `brightness(1.15) drop-shadow(0 0 8px ${n})`,
+					offset: .4
+				},
+				{
+					transform: `${t} translate(2px, -1px) scale(0.995) rotate(0.4deg)`,
+					filter: "brightness(1.12)",
+					offset: .45
+				},
+				{
+					transform: `${t} translate(-1px, 1px) scale(1.008) rotate(-0.3deg)`,
+					filter: "brightness(1.1)",
+					offset: .5
+				},
+				{
+					transform: `${t} translate(1px, -1px) scale(0.997) rotate(0.25deg)`,
+					filter: "brightness(1.08)",
+					offset: .55
+				},
+				{
+					transform: `${t} translate(-1px, 0px) scale(1.005) rotate(-0.2deg)`,
+					filter: "brightness(1.06)",
+					offset: .6
+				},
+				{
+					transform: `${t} translate(1px, 1px) scale(0.998) rotate(0.15deg)`,
+					filter: "brightness(1.05)",
+					offset: .65
+				},
+				{
+					transform: `${t} translate(0px, -1px) scale(1.003) rotate(-0.1deg)`,
+					filter: "brightness(1.04)",
+					offset: .7
+				},
+				{
+					transform: `${t} translate(-1px, 0px) scale(0.999) rotate(0.08deg)`,
+					filter: "brightness(1.03)",
+					offset: .75
+				},
+				{
+					transform: `${t} translate(0px, 1px) scale(1.002) rotate(-0.05deg)`,
+					filter: "brightness(1.02)",
+					offset: .8
+				},
+				{
+					transform: `${t} translate(0px, 0px) scale(1.001) rotate(0.03deg)`,
+					filter: "brightness(1.01)",
+					offset: .9
+				},
+				{
+					transform: `${t} translate(0, 0) scale(1) rotate(0deg)`,
+					filter: "brightness(1)"
+				}
+			], {
+				duration: 800,
+				easing: "linear"
+			});
+		}
+	}
+	ensureTrailCanvas() {
+		if (this.trailCanvas || !this.element) return;
+		let e = this.element.scrollWidth, t = this.element.scrollHeight, n = document.createElement("canvas");
+		n.width = e * window.devicePixelRatio, n.height = t * window.devicePixelRatio, n.style.cssText = `\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\twidth: ${e}px;\n\t\t\theight: ${t}px;\n\t\t\tpointer-events: none;\n\t\t\tz-index: 9990;\n\t\t`, this.element.appendChild(n), this.trailCanvas = n, this.trailCtx = n.getContext("2d"), this.trailCtx && this.trailCtx.scale(window.devicePixelRatio, window.devicePixelRatio);
+	}
+	drawTrail(e, t) {
+		if (!this.options.showConnections) return;
+		if (this.ensureTrailCanvas(), !this.trailCtx || !this.lastTrailPos) return void (this.lastTrailPos = {
+			x: e,
+			y: t
+		});
+		let n = this.trailCtx, r = this.currentColor;
+		n.beginPath(), n.moveTo(this.lastTrailPos.x, this.lastTrailPos.y), n.lineTo(e, t), n.strokeStyle = r, n.lineWidth = 3, n.lineCap = "round", n.globalAlpha = .6, n.shadowColor = r, n.shadowBlur = 8, n.stroke(), n.globalAlpha = 1, n.shadowBlur = 0, this.lastTrailPos = {
+			x: e,
+			y: t
+		};
+	}
+	resetTrail() {
+		this.lastTrailPos = null;
+	}
+	fadeTrail() {
+		if (!this.trailCtx || !this.element) return;
+		let e = this.element.scrollWidth, t = this.element.scrollHeight;
+		this.trailCtx.globalCompositeOperation = "destination-out", this.trailCtx.fillStyle = "rgba(0, 0, 0, 0.02)", this.trailCtx.fillRect(0, 0, e, t), this.trailCtx.globalCompositeOperation = "source-over";
+	}
+	cleanup() {
+		this.destroyed$.next(!0), this.rafId &&= (cancelAnimationFrame(this.rafId), 0), this.shimmerAnimation?.cancel(), this.shimmerOverlay?.remove(), this.shimmerAnimation = null, this.shimmerOverlay = null, this.pulseRings.forEach((e) => e.remove()), this.pulseRings = [], this.trailCanvas?.remove(), this.trailCanvas = null, this.trailCtx = null, this.lastTrailPos = null, this.accretionDisks.forEach((e) => e.remove()), this.accretionDisks = [], this.lensingRing?.remove(), this.lensingRing = null, this.eventHorizon?.remove(), this.eventHorizon = null, this.homeElement = null, this.bird?.remove(), this.blackHole?.remove(), this.particles.forEach((e) => e.remove()), this.bird = null, this.blackHole = null, this.particles = [], this.context = null;
+	}
+	disconnected() {
+		this.cleanup();
+	}
+}), rt = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null;
+	}
+	render(e, t) {
+		return L;
+	}
+	update(e, [t, n]) {
+		let r = e.element, i, a, o, s = {};
+		if (typeof t == "function" ? (i = t, s = n || {}) : (a = t.onEnter, o = t.onExit, s = t.options || {}, i = (e) => {
+			e && a && a(), !e && o && o();
+		}), this.state?.element === r) return L;
+		this.cleanup();
+		let { once: c = !1, threshold: l = 0, rootMargin: u = "0px", delay: d = 0 } = s, f = new IntersectionObserver((e) => {
+			if (!this.state) return;
+			let t = e[0], n = t.isIntersecting;
+			d > 0 && n ? (this.state.delayTimerSub && this.state.delayTimerSub.unsubscribe(), this.state.delayTimerSub = D(d).pipe(N(1), I(() => this.triggerCallback(n, t))).subscribe()) : (!n && this.state.delayTimerSub && (this.state.delayTimerSub.unsubscribe(), this.state.delayTimerSub = void 0), this.triggerCallback(n, t));
+		}, {
+			threshold: l,
+			rootMargin: u
+		});
+		return this.state = {
+			element: r,
+			observer: f,
+			callback: i,
+			onEnter: a,
+			onExit: o,
+			once: c,
+			delay: d,
+			hasFired: !1
+		}, f.observe(r), L;
+	}
+	triggerCallback(e, t) {
+		this.state && (this.state.once ? e && !this.state.hasFired && (this.state.hasFired = !0, this.state.callback(e, t), this.cleanup()) : this.state.callback(e, t));
+	}
+	cleanup() {
+		this.state &&= (this.state.delayTimerSub?.unsubscribe(), this.state.delayTimerSub = void 0, this.state.observer.disconnect(), null);
+	}
+	pause() {
+		this.state && (this.state.delayTimerSub?.unsubscribe(), this.state.observer.disconnect());
+	}
+	disconnected() {
+		this.pause();
+	}
+	reconnected() {
+		this.state && this.state.observer.observe(this.state.element);
+	}
+}), it = {
+	active: !0,
+	intensity: "medium"
+}, at = {
+	light: {
+		blur: 12,
+		sat: 1.3,
+		bright: 1.05,
+		tint: .45,
+		border: .2,
+		shadow: .06
+	},
+	medium: {
+		blur: 16,
+		sat: 1.4,
+		bright: 1.08,
+		tint: .55,
+		border: .28,
+		shadow: .08
+	},
+	strong: {
+		blur: 24,
+		sat: 1.5,
+		bright: 1.12,
+		tint: .65,
+		border: .35,
+		shadow: .1
+	}
+}, ot = [
+	"backdropFilter",
+	"background",
+	"boxShadow",
+	"borderTop",
+	"borderBottom"
+], st = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null;
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t = {}]) {
+		let n = e.element, r = {
+			...it,
+			...t
+		};
+		return r.active ? this.activate(n, r) : this.cleanup(), L;
+	}
+	activate(e, t) {
+		if (!this.isConnected) return;
+		let n = at[t.intensity];
+		if (!this.state) {
+			let t = {};
+			for (let n of ot) t[n] = e.style[n];
+			this.state = {
+				element: e,
+				origStyles: t
+			};
+		}
+		this.applyStyles(e, n);
+	}
+	applyStyles(e, t) {
+		let n = `blur(${t.blur}px) saturate(${t.sat}) brightness(${t.bright})`;
+		e.style.backdropFilter = n, e.style.setProperty("-webkit-backdrop-filter", n), e.style.background = `rgba(var(--md-sys-color-surface-container, 255 255 255) / ${t.tint})`;
+		let r = t.border;
+		e.style.boxShadow = [
+			`inset 0 1px 0 0 rgba(255,255,255, ${1.5 * r})`,
+			`inset 0 2px 6px rgba(255,255,255, ${.6 * r})`,
+			`inset 0 -1px 0 0 rgba(255,255,255, ${.25 * r})`,
+			`0 1px 3px rgba(0,0,0, ${t.shadow})`,
+			`0 6px 20px rgba(0,0,0, ${.5 * t.shadow})`
+		].join(", "), e.style.borderTop = `0.5px solid rgba(255,255,255, ${.9 * r})`, e.style.borderBottom = "0.5px solid rgba(0,0,0, 0.05)";
+	}
+	cleanup() {
+		if (!this.state) return;
+		let { element: e, origStyles: t } = this.state;
+		for (let n of ot) e.style[n] = t[n];
+		e.style.removeProperty("-webkit-backdrop-filter"), this.state = null;
+	}
+	disconnected() {
+		this.cleanup();
+	}
+	reconnected() {}
+}), $ = "schmancy-lb-rotate", ct = !1;
+function lt() {
+	if (ct) return;
+	let e = document.createElement("style");
+	e.id = "schmancy-living-border-shared", e.textContent = `\n\t\t@property --${$}-angle {\n\t\t\tsyntax: '<angle>';\n\t\t\tinitial-value: 0deg;\n\t\t\tinherits: false;\n\t\t}\n\t\t@keyframes ${$} {\n\t\t\tto { --${$}-angle: 360deg; }\n\t\t}\n\t`, document.head.appendChild(e), ct = !0;
+}
+var ut = U(class extends z {
+	constructor(...e) {
+		super(...e), this.teardown$ = new g(), this.didSetPosition = !1;
+	}
+	render(e) {}
+	update(e, [t]) {
+		if (e.type !== H.ELEMENT) throw Error("livingBorder directive must be used on an element");
+		let n = JSON.stringify(t ?? {});
+		this.element && n === this.prevKey || (this.prevKey = n, this.element = e.element, this.lastOptions = t, o.value || (this.teardown$.next(), this.cleanup(), lt(), this.createBorderOverlay(t)));
+	}
+	reconnected() {
+		this.lastOptions && !o.value && (lt(), this.createBorderOverlay(this.lastOptions));
+	}
+	createBorderOverlay(e) {
+		let t = e?.width ?? 1, n = e?.color ?? "var(--schmancy-sys-color-primary-default)", r = e?.spread ?? 6, i = e?.duration ?? 3e3, a = e?.onHover ?? !1;
+		getComputedStyle(this.element).position === "static" && (this.element.style.position = "relative", this.didSetPosition = !0), this.borderEl = document.createElement("div"), this.borderEl.setAttribute("aria-hidden", "true");
+		let o = `-${t}px`;
+		Object.assign(this.borderEl.style, {
+			position: "absolute",
+			top: o,
+			left: o,
+			right: o,
+			bottom: o,
+			borderRadius: "inherit",
+			pointerEvents: "none",
+			zIndex: "0",
+			background: `conic-gradient(\n\t\t\t\tfrom var(--${$}-angle),\n\t\t\t\ttransparent 0%, transparent 30%,\n\t\t\t\tcolor-mix(in srgb, ${n} 50%, transparent) 45%,\n\t\t\t\t${n} 50%,\n\t\t\t\tcolor-mix(in srgb, ${n} 50%, transparent) 55%,\n\t\t\t\ttransparent 70%, transparent 100%\n\t\t\t)`,
+			mask: "linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0)",
+			maskComposite: "exclude",
+			WebkitMaskComposite: "xor",
+			padding: `${t}px`,
+			animation: `${$} ${i}ms linear infinite`,
+			filter: `blur(${.3 * r}px) drop-shadow(0 0 ${r}px color-mix(in srgb, ${n} 40%, transparent))`,
+			opacity: a ? "0" : "0.5",
+			transition: "opacity 300ms ease"
+		}), this.element.prepend(this.borderEl), te(T(this.element, "mouseenter").pipe(j(() => {
+			this.borderEl && (this.borderEl.style.opacity = a ? "0.7" : "0.8");
+		})), T(this.element, "mouseleave").pipe(j(() => {
+			this.borderEl && (this.borderEl.style.opacity = a ? "0" : "0.5");
+		}))).pipe(P(this.teardown$)).subscribe();
+	}
+	cleanup() {
+		this.borderEl?.remove(), this.borderEl = void 0;
+	}
+	disconnected() {
+		this.teardown$.next(), this.cleanup(), this.didSetPosition && this.element && (this.element.style.position = "", this.didSetPosition = !1);
+	}
+}), dt = /* @__PURE__ */ new WeakMap(), ft = U(class extends V {
+	constructor(e) {
+		if (super(e), e.type !== H.ELEMENT) throw Error("longPress directive can only be used on elements");
+	}
+	render(e, t) {}
+	update(e, [t, n = {}]) {
+		let r = e.element, i = dt.get(r);
+		if (i) {
+			if (i.callback === t && this.optionsEqual(i.options, n)) return;
+			i.subscription.unsubscribe();
+		}
+		let a = this.setupLongPress(r, t, n);
+		dt.set(r, {
+			subscription: a,
+			callback: t,
+			options: n || {}
+		});
+	}
+	optionsEqual(e, t) {
+		return t ? e.duration === t.duration && e.movementThreshold === t.movementThreshold : Object.keys(e).length === 0;
+	}
+	setupLongPress(e, t, n = {}) {
+		let r = n.duration ?? 500, i = n.movementThreshold ?? 10, a = T(e, "pointerdown"), o = T(window, "pointerup"), s = T(window, "pointermove"), c = T(window, "pointercancel");
+		return a.pipe(M((e) => {
+			let n = e.clientX, a = e.clientY, l = te(o, c, s.pipe(A((e) => {
+				let t = e.clientX - n, r = e.clientY - a;
+				return Math.sqrt(t * t + r * r) > i;
+			}))).pipe(ce());
+			return D(r).pipe(P(l), I(() => t()));
+		})).subscribe();
+	}
+	disconnected(e) {
+		let t = e.element, n = dt.get(t);
+		n && (n.subscription.unsubscribe(), dt.delete(t));
+	}
+	reconnected(e) {
+		let t = e.element, n = dt.get(t);
+		n && (n.subscription = this.setupLongPress(t, n.callback, n.options));
+	}
+}), pt = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null;
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t]) {
+		let n = e.element, { active: r, color: i = "var(--md-sys-color-error, #ef4444)", width: a = 150 } = t;
+		return !r && this.state ? (this.cleanup(), L) : r ? (!this.state || this.state.color === i && this.state.width === a || this.cleanup(), this.state || (this.state = {
+			active: !0,
+			color: i,
+			width: a,
+			element: n,
+			shards: [],
+			cracks: [],
+			isVisible: !0,
+			startTime: performance.now()
+		}, getComputedStyle(n).position === "static" && (n.style.position = "relative"), this.createOverlay(), this.setupVisibilityObserver(), this.startAnimation()), L) : L;
+	}
+	createOverlay() {
+		if (!this.state) return;
+		let { element: e, color: t, width: n } = this.state, r = document.createElement("div");
+		r.className = "missed-punch-overlay", Object.assign(r.style, {
+			position: "absolute",
+			top: "50%",
+			left: "0",
+			width: `${n}px`,
+			height: "40px",
+			transform: "translateY(-50%)",
+			pointerEvents: "none",
+			overflow: "visible",
+			zIndex: "4"
+		});
+		let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+		i.setAttribute("width", "100%"), i.setAttribute("height", "100%"), i.setAttribute("viewBox", `0 0 ${n} 40`), i.setAttribute("preserveAspectRatio", "xMinYMid meet"), Object.assign(i.style, {
+			position: "absolute",
+			top: "0",
+			left: "0",
+			width: "100%",
+			height: "100%",
+			overflow: "visible"
+		});
+		let a = [];
+		for (let e of [
+			-15,
+			0,
+			15,
+			-30,
+			30,
+			-8,
+			8
+		]) {
+			let n = document.createElementNS("http://www.w3.org/2000/svg", "path"), r = e * Math.PI / 180, o = 30 + 40 * Math.random(), s = "M 0,20", c = 0, l = 20, u = 4 + Math.floor(3 * Math.random());
+			for (let e = 0; e < u; e++) {
+				let e = o / u;
+				c += Math.cos(r) * e + 4 * (Math.random() - .5), l += Math.sin(r) * e + 3 * (Math.random() - .5), s += ` L ${c.toFixed(1)},${l.toFixed(1)}`;
+			}
+			n.setAttribute("d", s), n.setAttribute("stroke", t), n.setAttribute("stroke-width", "1.5"), n.setAttribute("fill", "none"), n.setAttribute("opacity", "0"), n.style.willChange = "opacity, stroke-dashoffset";
+			let d = 1.2 * o;
+			n.setAttribute("stroke-dasharray", d.toString()), n.setAttribute("stroke-dashoffset", d.toString()), a.push(n), i.appendChild(n);
+		}
+		let o = [], s = document.createElementNS("http://www.w3.org/2000/svg", "defs");
+		for (let e = 0; e < 8; e++) {
+			let n = `shard-gradient-${e}`, r = document.createElementNS("http://www.w3.org/2000/svg", "linearGradient");
+			r.setAttribute("id", n), r.setAttribute("x1", "0%"), r.setAttribute("y1", "0%"), r.setAttribute("x2", "100%"), r.setAttribute("y2", "100%");
+			let a = document.createElementNS("http://www.w3.org/2000/svg", "stop");
+			a.setAttribute("offset", "0%"), a.setAttribute("stop-color", "white"), a.setAttribute("stop-opacity", "0.9");
+			let c = document.createElementNS("http://www.w3.org/2000/svg", "stop");
+			c.setAttribute("offset", "40%"), c.setAttribute("stop-color", t), c.setAttribute("stop-opacity", "0.8");
+			let l = document.createElementNS("http://www.w3.org/2000/svg", "stop");
+			l.setAttribute("offset", "100%"), l.setAttribute("stop-color", t), l.setAttribute("stop-opacity", "0.4"), r.appendChild(a), r.appendChild(c), r.appendChild(l), s.appendChild(r);
+			let u = document.createElementNS("http://www.w3.org/2000/svg", "polygon"), d = 5 + 7 * Math.random(), f = this.generateShardPoints(d);
+			u.setAttribute("points", f), u.setAttribute("fill", `url(#${n})`), u.setAttribute("stroke", "white"), u.setAttribute("stroke-width", "0.5"), u.setAttribute("stroke-opacity", "0.6"), u.setAttribute("opacity", "0"), u.style.willChange = "transform, opacity", u.style.filter = "drop-shadow(0 0 2px rgba(255,255,255,0.5))";
+			let p = (Math.random() - .3) * Math.PI * .6, m = 1 + 1.5 * Math.random();
+			o.push({
+				element: u,
+				x: 0,
+				y: 20,
+				vx: Math.cos(p) * m,
+				vy: Math.sin(p) * m,
+				rotation: 0,
+				rotationSpeed: 10 * (Math.random() - .5),
+				scale: .6 + .6 * Math.random(),
+				opacity: 0
+			}), i.appendChild(u);
+		}
+		i.insertBefore(s, i.firstChild);
+		for (let e = 0; e < 6; e++) {
+			let t = document.createElementNS("http://www.w3.org/2000/svg", "circle");
+			t.setAttribute("r", "1.5"), t.setAttribute("fill", "white"), t.setAttribute("opacity", "0"), t.setAttribute("data-sparkle", e.toString()), t.style.willChange = "transform, opacity", i.appendChild(t);
+		}
+		let c = document.createElementNS("http://www.w3.org/2000/svg", "text");
+		if (c.setAttribute("x", (n - 15).toString()), c.setAttribute("y", "25"), c.setAttribute("fill", t), c.setAttribute("font-size", "16"), c.setAttribute("font-weight", "bold"), c.setAttribute("opacity", "0.6"), c.textContent = "!", c.style.animation = "missed-pulse 1.5s ease-in-out infinite", i.appendChild(c), !document.getElementById("missed-punch-styles")) {
+			let e = document.createElement("style");
+			e.id = "missed-punch-styles", e.textContent = "\n				@keyframes missed-pulse {\n					0%, 100% { opacity: 0.4; transform: scale(1); }\n					50% { opacity: 0.8; transform: scale(1.1); }\n				}\n			", document.head.appendChild(e);
+		}
+		r.appendChild(i), e.appendChild(r), this.state.overlayElement = r, this.state.svg = i, this.state.shards = o, this.state.cracks = a;
+	}
+	generateShardPoints(e) {
+		let t = 3 + Math.floor(2 * Math.random()), n = [];
+		for (let r = 0; r < t; r++) {
+			let i = r / t * Math.PI * 2 + .5 * Math.random(), a = e * (.5 + .5 * Math.random()), o = Math.cos(i) * a, s = Math.sin(i) * a;
+			n.push(`${o.toFixed(1)},${s.toFixed(1)}`);
+		}
+		return n.join(" ");
+	}
+	setupVisibilityObserver() {
+		this.state && typeof IntersectionObserver < "u" && (this.state.observer = new IntersectionObserver((e) => {
+			if (!this.state) return;
+			let t = e[0].isIntersecting;
+			t && !this.state.isVisible ? (this.state.isVisible = !0, this.startAnimation()) : !t && this.state.isVisible && (this.state.isVisible = !1, this.state.animationId && (cancelAnimationFrame(this.state.animationId), this.state.animationId = void 0));
+		}, { threshold: 0 }), this.state.observer.observe(this.state.element));
+	}
+	startAnimation() {
+		if (!this.state || !this.state.isVisible) return;
+		let { cracks: e } = this.state;
+		for (let t = 0; t < e.length; t++) {
+			let n = e[t];
+			n.setAttribute("stroke-dashoffset", "0"), n.setAttribute("opacity", "0.5");
+		}
+		let t = (n) => {
+			if (!this.state || !this.state.isVisible) return;
+			let r = n - this.state.startTime, { shards: i, width: a } = this.state;
+			for (let e = 0; e < i.length; e++) {
+				let t = i[e], n = 2500 + 200 * e, o = (r + 300 * e) % n / n;
+				t.x = o * t.vx * a * .5, t.y = 20 + o * t.vy * 25 + o * o * 20, t.rotation += .3 * t.rotationSpeed;
+				let s = .85;
+				o < .1 ? s = 8.5 * o : o > .8 && (s = 4.25 * (1 - o)), t.element.style.transform = `translate(${t.x.toFixed(1)}px, ${t.y.toFixed(1)}px) rotate(${t.rotation.toFixed(0)}deg) scale(${t.scale})`, t.element.setAttribute("opacity", s.toFixed(2));
+			}
+			let o = this.state.svg?.querySelectorAll("[data-sparkle]");
+			o && o.forEach((e, t) => {
+				let n = 1500 + 150 * t, i = (r + 200 * t) % n / n, o = 5 + i * a * .6, s = 18 + 10 * Math.sin(i * Math.PI * 4), c = .8 * Math.sin(i * Math.PI);
+				e.setAttribute("cx", o.toFixed(1)), e.setAttribute("cy", s.toFixed(1)), e.setAttribute("opacity", Math.max(0, c).toFixed(2));
+			});
+			let s = .15 * Math.sin(r / 800) + .45;
+			for (let t of e) t.setAttribute("opacity", s.toFixed(2));
+			this.state.animationId = requestAnimationFrame(t);
+		};
+		this.state.animationId = requestAnimationFrame(t);
+	}
+	cleanup() {
+		this.state &&= (this.state.animationId && cancelAnimationFrame(this.state.animationId), this.state.observer && this.state.observer.disconnect(), this.state.overlayElement && this.state.overlayElement.remove(), null);
+	}
+	disconnected() {
+		this.cleanup();
+	}
+}), mt = {
+	active: !0,
+	autoHideDuration: 3e3,
+	background: !0,
+	intensity: 1,
+	blur: 1,
+	speed: 1,
+	fadeInDuration: 1e3,
+	fadeOutDuration: 8e3,
+	idleOpacity: .6,
+	idleBreathe: !0,
+	temperature: 0,
+	chromaticAberration: 1,
+	particleCount: 30
+}, ht = "cubic-bezier(0.37, 0, 0.63, 1)", gt = "cubic-bezier(0.25, 0.1, 0.25, 1)", _t = !1, vt = class e {
+	constructor() {
+		this.elementToDirective = /* @__PURE__ */ new WeakMap(), this.instances = /* @__PURE__ */ new Set(), this.observer = null, this.visibilitySub = null, this.tabVisible = !0;
+	}
+	static {
+		this._instance = null;
+	}
+	static get instance() {
+		return e._instance ||= new e(), e._instance;
+	}
+	register(e, t) {
+		let n = this.instances.size === 0;
+		this.instances.add(e), this.elementToDirective.set(t, e), n && this.setup(), this.observer?.observe(t);
+	}
+	unregister(e, t) {
+		this.observer?.unobserve(t), this.elementToDirective.delete(t), this.instances.delete(e), this.instances.size === 0 && this.teardown();
+	}
+	setup() {
+		this.observer = new IntersectionObserver((e) => {
+			for (let t of e) {
+				let e = this.elementToDirective.get(t.target);
+				e && e.onVisibilityChange(t.isIntersecting && this.tabVisible);
+			}
+		}, { threshold: 0 }), this.visibilitySub = T(document, "visibilitychange").pipe(I(() => {
+			this.tabVisible = document.visibilityState === "visible";
+			for (let e of this.instances) e.onVisibilityChange(this.tabVisible);
+		})).subscribe();
+	}
+	teardown() {
+		this.observer &&= (this.observer.disconnect(), null), this.visibilitySub &&= (this.visibilitySub.unsubscribe(), null);
+	}
+}, yt = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null, this.coordinator = vt.instance;
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t = {}]) {
+		let n = e.element, r = {
+			...mt,
+			...t
+		};
+		return r.active ? this.show(n, r) : this.hide(r), L;
+	}
+	onVisibilityChange(e) {
+		if (!this.state?.overlay) return;
+		let t = this.state.isVisible;
+		this.state.isVisible = e, t !== e && (this.state.overlay.classList.toggle("paused", !e), this.state.overlay.classList.toggle("running", e));
+	}
+	show(e, t) {
+		(function() {
+			if (_t || typeof document > "u") return;
+			_t = !0;
+			let e = document.createElement("style");
+			e.id = "nebula-directive-styles", e.textContent = "\n/* =============================================================================\n   NEBULA v3 - SURREAL DIMENSIONAL RIFT - GPU-COMPOSITED CSS ANIMATIONS\n   Chromatic aberration, iridescent hue-cycling, event horizon, tendrils.\n   Performance: translate3d + opacity for most layers, hue-rotate for core only.\n   ============================================================================= */\n\n/* Chromatic red channel - rightward aberration drift */\n@keyframes nebula-chromatic-red {\n	0%, 100% { transform: translate3d(var(--nebula-aberration, 3px), 0, 0); }\n	25% { transform: translate3d(calc(var(--nebula-aberration, 3px) * 1.8), -1%, 0); }\n	50% { transform: translate3d(var(--nebula-aberration, 3px), 1%, 0); }\n	75% { transform: translate3d(calc(var(--nebula-aberration, 3px) * 0.5), 0, 0); }\n}\n\n/* Chromatic blue channel - leftward counter-drift */\n@keyframes nebula-chromatic-blue {\n	0%, 100% { transform: translate3d(calc(var(--nebula-aberration, 3px) * -1), 0, 0); }\n	25% { transform: translate3d(calc(var(--nebula-aberration, 3px) * -0.5), 1%, 0); }\n	50% { transform: translate3d(calc(var(--nebula-aberration, 3px) * -1), -1%, 0); }\n	75% { transform: translate3d(calc(var(--nebula-aberration, 3px) * -1.8), 0, 0); }\n}\n\n/* Iridescent core - continuous 360-degree hue rotation (the ONE filter animation) */\n@keyframes nebula-iridescent {\n	0% { filter: hue-rotate(0deg) blur(var(--nebula-blur-core, 12px)) saturate(1.6); }\n	100% { filter: hue-rotate(360deg) blur(var(--nebula-blur-core, 12px)) saturate(1.6); }\n}\n\n/* Bioluminescent tendrils - organic breathing */\n@keyframes nebula-tendrils-breathe {\n	0%, 100% { opacity: 0.6; transform: translate3d(0, 0, 0); }\n	30% { opacity: 0.9; transform: translate3d(1%, -1.5%, 0); }\n	60% { opacity: 0.5; transform: translate3d(-1%, 1.5%, 0); }\n}\n\n/* Quantum particle twinkle - opacity only (cheapest) */\n@keyframes nebula-particle-twinkle {\n	0%, 100% { opacity: 0.7; }\n	15% { opacity: 1; }\n	40% { opacity: 0.5; }\n	65% { opacity: 0.85; }\n	85% { opacity: 0.6; }\n}\n\n/* Idle breathing - gentle pulse when dimmed */\n@keyframes nebula-idle-breathe {\n	0%, 100% {\n		opacity: var(--nebula-idle-opacity, 0.08);\n		filter: blur(calc(var(--nebula-blur-base, 10px) * 8));\n		transform: scale(1);\n	}\n	50% {\n		opacity: calc(var(--nebula-idle-opacity, 0.08) * 1.4);\n		filter: blur(calc(var(--nebula-blur-base, 10px) * 10));\n		transform: scale(1.005);\n	}\n}\n\n/* =============================================================================\n   STATE CLASSES - Control via CSS class toggle (no JS animation calls)\n   ============================================================================= */\n\n.nebula-overlay {\n	contain: strict;\n	pointer-events: none;\n	isolation: isolate;\n}\n\n.nebula-overlay.paused .nebula-layer {\n	animation-play-state: paused !important;\n}\n\n.nebula-overlay.running .nebula-layer {\n	animation-play-state: running !important;\n}\n\n/* Reduced motion - respect user preferences */\n@media (prefers-reduced-motion: reduce) {\n	.nebula-layer {\n		animation: none !important;\n		transition: opacity 0s !important;\n	}\n}\n", document.head.appendChild(e);
+		})(), this.state?.autoHideSub && (this.state.autoHideSub.unsubscribe(), this.state.autoHideSub = null);
+		let n = o.value;
+		if (this.state?.overlay && this.state.isDimmed) return this.state.isDimmed = !1, this.state.options = t, this.awakenOverlay(t, n), void this.scheduleAutoHide(t);
+		this.state?.overlay || this.createOverlay(e, t, n), this.scheduleAutoHide(t);
+	}
+	awakenOverlay(e, r) {
+		if (!this.state?.overlay) return;
+		let i = this.state.overlay, a = r ? 0 : .6 * e.fadeInDuration, o = r ? "linear" : t(n);
+		i.style.setProperty("--nebula-intensity", String(e.intensity)), i.animate([
+			{
+				opacity: e.idleOpacity,
+				transform: "scale(0.98)",
+				filter: `blur(${4 * e.blur}px)`
+			},
+			{
+				opacity: .7 * e.intensity,
+				transform: "scale(1.01)",
+				filter: `blur(${1 * e.blur}px)`
+			},
+			{
+				opacity: e.intensity,
+				transform: "scale(1)",
+				filter: "blur(0px)"
+			}
+		], {
+			duration: a,
+			easing: o,
+			fill: "forwards"
+		}), i.classList.remove("paused"), i.classList.add("running");
+	}
+	createOverlay(e, r, i) {
+		let a = window.getComputedStyle(e).position, o = e.style.position, s = e.style.overflow, c = e.style.contain;
+		a === "static" && (e.style.position = "relative"), e.style.overflow = "hidden", e.style.contain = "paint";
+		let l = r.temperature, u = Math.max(0, l), d = Math.max(0, -l), f = r.intensity, p = Math.round(3 + 5 * r.chromaticAberration), m = Math.round(20 + 60 * d), h = Math.round(80 + 80 * d), g = Math.round(20 + 80 * u), _ = Math.round(255 - 55 * u), v = Math.round(100 + 100 * d), y = Math.round(100 * u), b = Math.round(255 - 55 * u), x = Math.round(100 + 55 * d), S = Math.round(255 - 55 * d), C = document.createElement("div");
+		if (C.className = "nebula-overlay running", Object.assign(C.style, {
+			position: "absolute",
+			inset: "-20%",
+			zIndex: r.background ? "-1" : "9999",
+			opacity: "0",
+			"--nebula-intensity": String(f),
+			"--nebula-blur-base": 10 * r.blur + "px",
+			"--nebula-idle-opacity": String(r.idleOpacity),
+			"--nebula-aberration": `${p}px`,
+			"--nebula-blur-core": 12 * r.blur + "px"
+		}), i) {
+			let e = document.createElement("div");
+			Object.assign(e.style, {
+				position: "absolute",
+				inset: "0",
+				background: `\n\t\t\t\t\tradial-gradient(ellipse 45% 40% at 50% 50%,\n\t\t\t\t\t\trgba(255,${x},${S},${.12 * f}) 0%,\n\t\t\t\t\t\trgba(${g},100,${_},${.06 * f}) 40%,\n\t\t\t\t\t\ttransparent 70%),\n\t\t\t\t\tradial-gradient(circle 8% at 50% 50%,\n\t\t\t\t\t\trgba(255,255,255,${.15 * f}) 0%,\n\t\t\t\t\t\ttransparent 100%)`,
+				filter: `blur(${10 * r.blur}px)`,
+				opacity: String(f)
+			}), C.appendChild(e);
+		} else {
+			let e = document.createElement("div");
+			e.className = "nebula-layer", Object.assign(e.style, {
+				position: "absolute",
+				inset: "-5%",
+				background: `\n\t\t\t\t\tlinear-gradient(155deg,\n\t\t\t\t\t\ttransparent 0%, transparent 38%,\n\t\t\t\t\t\trgba(8,2,18,${.35 * f}) 44%,\n\t\t\t\t\t\trgba(0,0,0,${.4 * f}) 49%,\n\t\t\t\t\t\trgba(8,2,18,${.35 * f}) 54%,\n\t\t\t\t\t\ttransparent 60%, transparent 100%),\n\t\t\t\t\tlinear-gradient(225deg,\n\t\t\t\t\t\ttransparent 0%, transparent 42%,\n\t\t\t\t\t\trgba(5,0,12,${.28 * f}) 47%,\n\t\t\t\t\t\trgba(0,0,0,${.32 * f}) 50%,\n\t\t\t\t\t\trgba(5,0,12,${.28 * f}) 53%,\n\t\t\t\t\t\ttransparent 58%, transparent 100%),\n\t\t\t\t\tradial-gradient(ellipse 110% 110% at 50% 50%,\n\t\t\t\t\t\ttransparent 35%,\n\t\t\t\t\t\trgba(3,0,8,${.2 * f}) 60%,\n\t\t\t\t\t\trgba(0,0,0,${.35 * f}) 85%),\n\t\t\t\t\tradial-gradient(ellipse 50% 45% at 30% 35%,\n\t\t\t\t\t\trgba(0,0,0,${.3 * f}) 0%,\n\t\t\t\t\t\ttransparent 65%),\n\t\t\t\t\tradial-gradient(ellipse 40% 55% at 70% 65%,\n\t\t\t\t\t\trgba(0,0,0,${.25 * f}) 0%,\n\t\t\t\t\t\ttransparent 60%)`,
+				filter: `blur(${4 * r.blur}px)`,
+				mixBlendMode: "multiply",
+				transform: "translateZ(0)"
+			}), C.appendChild(e);
+			let t = document.createElement("div");
+			t.className = "nebula-layer", Object.assign(t.style, {
+				position: "absolute",
+				inset: "-15%",
+				background: `\n\t\t\t\t\tradial-gradient(ellipse 55% 50% at 48% 50%,\n\t\t\t\t\t\trgba(255,${m},${h},${.14 * f}) 0%,\n\t\t\t\t\t\trgba(255,${m},${h},${.06 * f}) 35%,\n\t\t\t\t\t\ttransparent 65%),\n\t\t\t\t\tradial-gradient(ellipse 30% 35% at 30% 35%,\n\t\t\t\t\t\trgba(255,${v},200,${.1 * f}) 0%,\n\t\t\t\t\t\trgba(255,${v},200,${.03 * f}) 50%,\n\t\t\t\t\t\ttransparent 70%),\n\t\t\t\t\tradial-gradient(ellipse 25% 30% at 65% 70%,\n\t\t\t\t\t\trgba(255,${Math.min(255, m + 30)},${h},${.08 * f}) 0%,\n\t\t\t\t\t\ttransparent 60%)`,
+				filter: `blur(${18 * r.blur}px) saturate(1.4)`,
+				mixBlendMode: "screen",
+				transform: "translateZ(0)",
+				animation: `nebula-chromatic-red ${35e3 / r.speed}ms ${gt} infinite`
+			}), C.appendChild(t);
+			let n = document.createElement("div");
+			n.className = "nebula-layer", Object.assign(n.style, {
+				position: "absolute",
+				inset: "-15%",
+				background: `\n\t\t\t\t\tradial-gradient(ellipse 50% 55% at 52% 50%,\n\t\t\t\t\t\trgba(${g},100,${_},${.12 * f}) 0%,\n\t\t\t\t\t\trgba(${g},100,${_},${.05 * f}) 35%,\n\t\t\t\t\t\ttransparent 60%),\n\t\t\t\t\tradial-gradient(ellipse 35% 30% at 68% 40%,\n\t\t\t\t\t\trgba(${y},${b},200,${.09 * f}) 0%,\n\t\t\t\t\t\trgba(${y},${b},200,${.03 * f}) 45%,\n\t\t\t\t\t\ttransparent 65%),\n\t\t\t\t\tradial-gradient(ellipse 28% 25% at 35% 65%,\n\t\t\t\t\t\trgba(${g},100,${Math.min(255, _ + 20)},${.07 * f}) 0%,\n\t\t\t\t\t\ttransparent 55%)`,
+				filter: `blur(${18 * r.blur}px) saturate(1.4)`,
+				mixBlendMode: "screen",
+				transform: "translateZ(0)",
+				animation: `nebula-chromatic-blue ${35e3 / r.speed}ms ${gt} infinite`
+			}), C.appendChild(n);
+			let i = document.createElement("div");
+			i.className = "nebula-layer", Object.assign(i.style, {
+				position: "absolute",
+				inset: "0",
+				background: `\n\t\t\t\t\tradial-gradient(ellipse 20% 22% at 50% 50%,\n\t\t\t\t\t\trgba(255,${x},${S},${.18 * f}) 0%,\n\t\t\t\t\t\trgba(255,${v},200,${.08 * f}) 40%,\n\t\t\t\t\t\trgba(${g},100,${_},${.03 * f}) 65%,\n\t\t\t\t\t\ttransparent 80%),\n\t\t\t\t\tradial-gradient(circle 6% at 50% 50%,\n\t\t\t\t\t\trgba(255,255,255,${.25 * f}) 0%,\n\t\t\t\t\t\trgba(255,240,245,${.1 * f}) 50%,\n\t\t\t\t\t\ttransparent 100%)`,
+				mixBlendMode: "screen",
+				transform: "translateZ(0)",
+				animation: `nebula-iridescent ${28e3 / r.speed}ms linear infinite`
+			}), C.appendChild(i);
+			let a = document.createElement("div");
+			if (a.className = "nebula-layer", Object.assign(a.style, {
+				position: "absolute",
+				inset: "-12%",
+				background: `\n\t\t\t\t\tradial-gradient(ellipse 60% 12% at 50% 48%,\n\t\t\t\t\t\trgba(255,${v},200,${.1 * f}) 0%,\n\t\t\t\t\t\ttransparent 70%),\n\t\t\t\t\tradial-gradient(ellipse 12% 55% at 48% 50%,\n\t\t\t\t\t\trgba(${y},${b},200,${.08 * f}) 0%,\n\t\t\t\t\t\ttransparent 65%),\n\t\t\t\t\tradial-gradient(ellipse 45% 10% at 45% 35%,\n\t\t\t\t\t\trgba(255,${x},${S},${.07 * f}) 0%,\n\t\t\t\t\t\ttransparent 60%),\n\t\t\t\t\tradial-gradient(ellipse 10% 40% at 60% 60%,\n\t\t\t\t\t\trgba(${g},100,${_},${.06 * f}) 0%,\n\t\t\t\t\t\ttransparent 55%)`,
+				filter: `blur(${14 * r.blur}px)`,
+				mixBlendMode: "screen",
+				transform: "translateZ(0)",
+				animation: `nebula-tendrils-breathe ${22e3 / r.speed}ms ${ht} infinite`
+			}), C.appendChild(a), r.particleCount > 0) {
+				let e = document.createElement("div");
+				e.className = "nebula-layer";
+				let t = [];
+				for (let e = 0; e < r.particleCount; e++) {
+					let e = 5 + 90 * Math.random(), n = 5 + 90 * Math.random(), r = .5 + 2 * Math.random(), i = Math.round(360 * Math.random()), a = (.3 + .5 * Math.random()) * f;
+					t.push(`radial-gradient(circle ${r}px at ${e}% ${n}%, hsla(${i},80%,70%,${a}) 0%, transparent 100%)`);
+				}
+				Object.assign(e.style, {
+					position: "absolute",
+					inset: "0",
+					background: t.join(","),
+					mixBlendMode: "screen",
+					transform: "translateZ(0)",
+					animation: `nebula-particle-twinkle ${5e3 / r.speed}ms ${ht} infinite`
+				}), C.appendChild(e);
+			}
+		}
+		e.appendChild(C);
+		let ee = i ? 0 : r.fadeInDuration, w = i ? "linear" : t(n);
+		C.animate([
+			{
+				opacity: 0,
+				transform: "scale(0.85)",
+				filter: `blur(${25 * r.blur}px) saturate(0.5)`
+			},
+			{
+				opacity: .3 * r.intensity,
+				transform: "scale(0.95)",
+				filter: `blur(${12 * r.blur}px) saturate(0.8)`
+			},
+			{
+				opacity: .6 * r.intensity,
+				transform: "scale(1.02)",
+				filter: `blur(${4 * r.blur}px) saturate(1.1)`
+			},
+			{
+				opacity: .85 * r.intensity,
+				transform: "scale(1.005)",
+				filter: `blur(${1 * r.blur}px) saturate(1.05)`
+			},
+			{
+				opacity: r.intensity,
+				transform: "scale(1)",
+				filter: "blur(0px) saturate(1)"
+			}
+		], {
+			duration: ee,
+			easing: w,
+			fill: "forwards"
+		}), this.state = {
+			element: e,
+			overlay: C,
+			originalPosition: o,
+			originalOverflow: s,
+			originalContain: c,
+			isDimmed: !1,
+			autoHideSub: null,
+			options: r,
+			reducedMotion: i,
+			isVisible: document.visibilityState === "visible"
+		}, this.coordinator.register(this, e);
+	}
+	scheduleAutoHide(e) {
+		!this.state || e.autoHideDuration <= 0 || (this.state.autoHideSub = D(e.autoHideDuration).pipe(N(1), I(() => {
+			this.state && (this.state.autoHideSub = null, this.hide(this.state.options));
+		})).subscribe());
+	}
+	hide(e) {
+		if (!this.state?.overlay || (this.state.autoHideSub && (this.state.autoHideSub.unsubscribe(), this.state.autoHideSub = null), this.state.isDimmed)) return;
+		this.state.isDimmed = !0;
+		let n = this.state.overlay, r = this.state.options, i = this.state.reducedMotion, o = i ? 0 : e.fadeOutDuration, s = i ? "linear" : t(a);
+		if (e.idleOpacity <= 0) return void n.animate([
+			{
+				opacity: r.intensity,
+				transform: "scale(1)",
+				filter: "blur(0px) saturate(1)"
+			},
+			{
+				opacity: .4 * r.intensity,
+				transform: "scale(0.95)",
+				filter: `blur(${8 * r.blur}px) saturate(0.7)`
+			},
+			{
+				opacity: 0,
+				transform: "scale(0.9)",
+				filter: `blur(${15 * r.blur}px) saturate(0.3)`
+			}
+		], {
+			duration: o,
+			easing: s,
+			fill: "forwards"
+		});
+		let c = n.animate([
+			{
+				opacity: r.intensity,
+				transform: "scale(1)",
+				filter: "blur(0px) saturate(1)"
+			},
+			{
+				opacity: .5 * r.intensity,
+				transform: "scale(0.99)",
+				filter: `blur(${3 * r.blur}px) saturate(0.75)`
+			},
+			{
+				opacity: e.idleOpacity,
+				transform: "scale(1)",
+				filter: `blur(${8 * r.blur}px) saturate(0.4)`
+			}
+		], {
+			duration: o,
+			easing: s,
+			fill: "forwards"
+		});
+		e.idleBreathe && !i && w(c.finished).pipe(N(1), O(() => m)).subscribe(() => {
+			this.state?.overlay && (this.state.overlay.style.animation = `nebula-idle-breathe ${12e3 / r.speed}ms ${ht} infinite`);
+		});
+	}
+	cleanup() {
+		this.state &&= (this.coordinator.unregister(this, this.state.element), this.state.autoHideSub?.unsubscribe(), this.state.overlay?.remove(), this.state.element.style.position = this.state.originalPosition, this.state.element.style.overflow = this.state.originalOverflow, this.state.element.style.contain = this.state.originalContain, null);
+	}
+	disconnected() {
+		this.cleanup();
+	}
+	reconnected() {
+		this.state && this.coordinator.register(this, this.state.element);
+	}
+}), bt = {
+	smooth: n,
+	snappy: r,
+	bouncy: i,
+	gentle: a
+}, xt = B(class extends z {
+	constructor(e) {
+		if (super(e), this.initialized = !1, this.element = null, e.type !== H.ELEMENT) throw Error("reveal() can only be used on elements");
+	}
+	render(e, t) {
+		return L;
+	}
+	update(e, [n = !1, r = {}]) {
+		let i = e.element;
+		this.element = i;
+		let { preset: a = "smooth", maxHeight: s = "10rem", duration: c, easing: l } = r, u = bt[a], d = c ?? u.duration, f = l ?? t(u), p = o.value;
+		return this.initialized ||= (this.setupElement(i, d, f, p), !0), n ? (i.style.maxHeight = s, i.style.opacity = "1", i.style.transform = "translateY(0) scale(1)", i.style.pointerEvents = "", i.style.paddingTop = "", i.style.paddingBottom = "", i.style.marginTop = "", i.style.marginBottom = "", i.removeAttribute("aria-hidden"), i.removeAttribute("inert")) : (i.style.maxHeight = "0", i.style.opacity = "0", i.style.transform = "translateY(-8px) scale(0.98)", i.style.pointerEvents = "none", i.style.paddingTop = "0", i.style.paddingBottom = "0", i.style.marginTop = "0", i.style.marginBottom = "0", i.setAttribute("aria-hidden", "true"), i.setAttribute("inert", "")), L;
+	}
+	setupElement(e, t, n, r) {
+		e.style.overflow = "hidden", e.style.transition = r ? "none" : [
+			`max-height ${t}ms ${n}`,
+			`opacity ${t}ms ${n}`,
+			`transform ${t}ms ${n}`,
+			`padding ${t}ms ${n}`,
+			`margin ${t}ms ${n}`
+		].join(", ");
+	}
+	disconnected() {
+		this.element && (this.element.style.willChange = "");
+	}
+	reconnected() {}
+}), St = !1, Ct = U(class extends z {
+	constructor(...e) {
+		super(...e), this.teardown$ = new g();
+	}
+	render() {}
+	update(e) {
+		if (e.type !== H.ELEMENT) throw Error("ripple directive must be used on an element");
+		this.element = e.element, function() {
+			if (St) return;
+			let e = document.createElement("style");
+			e.id = "schmancy-ripple-shared", e.textContent = "\n		.schmancy-ripple-effect {\n			position: absolute;\n			border-radius: 50%;\n			background: var(--schmancy-sys-color-surface-on);\n			opacity: 0.12;\n			transform: scale(0);\n			animation: schmancy-ripple-expand 600ms linear forwards;\n			pointer-events: none;\n			aria-hidden: true;\n		}\n		@keyframes schmancy-ripple-expand {\n			to { transform: scale(4); opacity: 0; }\n		}\n	", document.head.appendChild(e), St = !0;
+		}(), getComputedStyle(this.element).position === "static" && (this.element.style.position = "relative"), this.element.style.overflow = "hidden", this.teardown$.next(), T(this.element, "click").pipe(P(this.teardown$)).subscribe((e) => this.addRipple(e));
+	}
+	reconnected() {
+		this.teardown$.next(), T(this.element, "click").pipe(P(this.teardown$)).subscribe((e) => this.addRipple(e));
+	}
+	addRipple(e) {
+		let t = this.element.getBoundingClientRect(), n = Math.max(t.width, t.height), r = n / 2, i = document.createElement("span");
+		i.className = "schmancy-ripple-effect", i.setAttribute("aria-hidden", "true"), i.style.width = `${n}px`, i.style.height = `${n}px`, i.style.left = e.clientX - t.left - r + "px", i.style.top = e.clientY - t.top - r + "px", this.element.appendChild(i), T(i, "animationend").pipe(N(1)).subscribe(() => i.remove());
+	}
+	disconnected() {
+		this.teardown$.next();
+	}
+}), wt = "schmancy-overflow-within-hidden", Tt = !1, Et = B(class extends z {
+	constructor(...e) {
+		super(...e), this.element = null, this.disconnecting$ = new g();
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t = {}]) {
+		if (e.type !== H.ELEMENT) throw Error("overflowWithin directive can only be used on elements");
+		let n = e.element, { hide: r = !1, direction: i = "both", name: a, debounce: o = 10 } = t, s = n.style;
+		s.minHeight = "0", s.minWidth = "0", s.boxSizing = "border-box", s.overflowY = i === "horizontal" ? "hidden" : "auto", s.overflowX = i === "vertical" ? "hidden" : "auto", s.scrollBehavior = "smooth", s.overscrollBehavior = "contain", r ? (function() {
+			if (Tt) return;
+			Tt = !0;
+			let e = new CSSStyleSheet();
+			e.replaceSync(`.${wt} { scrollbar-width: none; -ms-overflow-style: none; }\n\t\t .${wt}::-webkit-scrollbar { display: none; }`), document.adoptedStyleSheets = [...document.adoptedStyleSheets, e];
+		}(), n.classList.add(wt)) : n.classList.remove(wt);
+		let c = this.element !== n, l = this.currentName !== a;
+		return c ? (this.element = n, this.subscribe(o, a)) : l && (this.disconnecting$.next(), this.disconnecting$ = new g(), this.subscribe(o, a)), this.currentName = a, L;
+	}
+	subscribe(e, t) {
+		if (!this.element) return;
+		let n = this.element;
+		T(n, "scroll", { passive: !0 }).pipe(x(e), re(this.disconnecting$)).subscribe((e) => {
+			n.dispatchEvent(new CustomEvent("scroll", {
+				detail: {
+					scrollTop: n.scrollTop,
+					scrollHeight: n.scrollHeight,
+					clientHeight: n.clientHeight,
+					scrollLeft: n.scrollLeft,
+					scrollWidth: n.scrollWidth,
+					clientWidth: n.clientWidth,
+					e
+				},
+				bubbles: !0,
+				composed: !0
+			}));
+		}), t !== void 0 && T(window, "@schmancy:scrollTo").pipe(C((e) => e.detail.name === t && e.detail.action === "scrollTo"), re(this.disconnecting$)).subscribe((e) => {
+			let t = {
+				behavior: "smooth",
+				top: e.detail.top
+			};
+			typeof e.detail.left == "number" && (t.left = e.detail.left), n.scrollTo(t);
+		});
+	}
+	disconnected() {
+		this.disconnecting$.next(), this.element = null;
+	}
+	reconnected() {
+		this.element && (this.disconnecting$ = new g(), this.subscribe(10, this.currentName));
+	}
+}), Dt = {
+	error: [
+		"#ef4444",
+		"#dc2626",
+		"#b91c1c",
+		"#fca5a5",
+		"#fee2e2"
+	],
+	warning: [
+		"#f59e0b",
+		"#d97706",
+		"#b45309",
+		"#fcd34d",
+		"#fef3c7"
+	],
+	primary: [
+		"#3b82f6",
+		"#2563eb",
+		"#1d4ed8",
+		"#93c5fd",
+		"#dbeafe"
+	]
+}, Ot = {
+	error: 0,
+	warning: 1,
+	primary: 2
+}, kt = class t {
+	static {
+		this.instance = null;
+	}
+	constructor() {
+		this.container = null, this.stylesInjected = !1, this.shardPools = new Map([
+			[0, []],
+			[1, []],
+			[2, []]
+		]), this.activeShards = [], this.animationId = null, this.instances = /* @__PURE__ */ new Set(), this.tabVisible = !0, this.visibilityObserver = null, this.elementVisibility = /* @__PURE__ */ new WeakMap(), this.observedElements = /* @__PURE__ */ new WeakSet(), this.lastSoundTime = 0, this.SOUND_THROTTLE_MS = 150, document.addEventListener("visibilitychange", () => {
+			this.tabVisible = document.visibilityState === "visible", this.tabVisible ? (this.resumeAllAnimations(), this.startAnimationLoop()) : (this.pauseAllAnimations(), this.stopAnimationLoop(), this.clearAllShards());
+		});
+	}
+	static getInstance() {
+		return t.instance ||= new t(), t.instance;
+	}
+	ensureInitialized() {
+		this.ensureStyles(), this.ensureContainer(), this.ensureObserver();
+	}
+	ensureStyles() {
+		if (this.stylesInjected) return;
+		let e = document.createElement("style");
+		e.id = "urgent-shard-styles", e.textContent = "\n			.urgent-shard {\n				position: absolute;\n				transform-origin: center;\n				will-change: transform, opacity;\n				pointer-events: none;\n				contain: layout style;\n			}\n			.urgent-container {\n				position: fixed;\n				top: 0;\n				left: 0;\n				width: 100vw;\n				height: 100vh;\n				pointer-events: none;\n				overflow: visible;\n				z-index: 9999;\n				contain: strict;\n			}\n		", document.head.appendChild(e), this.stylesInjected = !0;
+	}
+	ensureContainer() {
+		this.container && this.container.isConnected || (this.container = document.createElement("div"), this.container.className = "urgent-container", document.body.appendChild(this.container));
+	}
+	ensureObserver() {
+		this.visibilityObserver ||= new IntersectionObserver((e) => {
+			for (let t of e) this.elementVisibility.set(t.target, t.isIntersecting);
+		}, { threshold: 0 });
+	}
+	register(e) {
+		this.ensureInitialized(), this.instances.add(e), this.startAnimationLoop();
+	}
+	unregister(e) {
+		this.instances.delete(e), this.instances.size === 0 && this.stopAnimationLoop();
+	}
+	observeElement(e) {
+		this.observedElements.has(e) || (this.ensureObserver(), this.visibilityObserver.observe(e), this.observedElements.add(e), this.elementVisibility.set(e, !0));
+	}
+	unobserveElement(e) {
+		this.visibilityObserver?.unobserve(e), this.observedElements.delete(e);
+	}
+	isElementVisible(e) {
+		return this.elementVisibility.get(e) ?? !0;
+	}
+	isTabVisible() {
+		return this.tabVisible;
+	}
+	acquireShard(e, t) {
+		let n = this.shardPools.get(e).pop();
+		n || (n = document.createElement("div"), n.className = "urgent-shard", this.container.appendChild(n));
+		let r = 4 + 12 * Math.random(), i = 4 + 12 * Math.random(), a = t[Math.floor(Math.random() * t.length)];
+		return Object.assign(n.style, {
+			width: `${r}px`,
+			height: `${i}px`,
+			background: `linear-gradient(${360 * Math.random()}deg,${a},transparent)`,
+			clipPath: `polygon(${30 * Math.random()}% ${30 * Math.random()}%,${70 + 30 * Math.random()}% ${40 * Math.random()}%,${60 + 40 * Math.random()}% ${60 + 40 * Math.random()}%,${40 * Math.random()}% ${70 + 30 * Math.random()}%)`,
+			boxShadow: `0 0 ${2 + 4 * Math.random()}px ${t[0]}88`,
+			opacity: "1"
+		}), n;
+	}
+	releaseShard(e, t) {
+		Object.assign(e.style, {
+			opacity: "0",
+			transform: "translate(-9999px,-9999px)"
+		}), this.shardPools.get(t).push(e);
+	}
+	addShards(e) {
+		this.activeShards.push(...e);
+	}
+	clearAllShards() {
+		for (let e of this.activeShards) this.releaseShard(e.element, e.colorIndex);
+		this.activeShards = [];
+	}
+	startAnimationLoop() {
+		if (this.animationId !== null || !this.tabVisible) return;
+		let e = () => {
+			this.updateShards(), this.updateInstanceTimers(), this.instances.size > 0 && this.tabVisible ? this.animationId = requestAnimationFrame(e) : this.animationId = null;
+		};
+		this.animationId = requestAnimationFrame(e);
+	}
+	stopAnimationLoop() {
+		this.animationId !== null && (cancelAnimationFrame(this.animationId), this.animationId = null);
+	}
+	updateShards() {
+		let e = this.activeShards;
+		for (let t = e.length - 1; t >= 0; t--) {
+			let n = e[t];
+			n.life++, n.x += n.vx, n.y += n.vy, n.vy += .15, n.vx *= .98, n.rotation += n.rotationSpeed;
+			let r = n.life / n.maxLife, i = Math.max(0, 1 - r * r), a = n.initialScale * (1 - .5 * r);
+			n.element.style.transform = `translate3d(${n.x}px,${n.y}px,0) rotate(${n.rotation}deg) scale(${a})`, n.element.style.opacity = String(i), n.life >= n.maxLife && (this.releaseShard(n.element, n.colorIndex), e.splice(t, 1));
+		}
+	}
+	updateInstanceTimers() {
+		let e = performance.now();
+		for (let t of this.instances) t.checkBurstTimer(e);
+	}
+	pauseAllAnimations() {
+		for (let e of this.instances) e.pauseAnimations();
+	}
+	resumeAllAnimations() {
+		for (let e of this.instances) e.resumeAnimations();
+	}
+	playSound(t) {
+		let n = performance.now();
+		if (n - this.lastSoundTime < this.SOUND_THROTTLE_MS) return;
+		this.lastSoundTime = n;
+		let r = t === "error" ? "anxious" : t === "warning" ? "worried" : "curious";
+		e.play(r);
+	}
+	destroy() {
+		this.stopAnimationLoop(), this.visibilityObserver?.disconnect(), this.container?.remove(), this.shardPools.forEach((e) => e.forEach((e) => e.remove())), this.shardPools.clear(), this.activeShards = [], t.instance = null;
+	}
+}, At = /* @__PURE__ */ new WeakMap(), jt = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null, this.coordinator = kt.getInstance();
+	}
+	render(e, t, n) {
+		return L;
+	}
+	update(e, t) {
+		let n = e.element, r, i, a, o, s, c = t[0];
+		if (typeof c == "object" && c ? (r = c.active ?? !1, i = c.color ?? "error", a = c.shake ?? !0, o = c.mode ?? "auto", s = c.interval ?? 4e3) : (r = typeof c == "boolean" && c, i = t[1] ?? "error", a = t[2] ?? !0, o = "auto", s = 4e3), !r && this.state?.active) return this.cleanup(), L;
+		if (this.state && this.state.active === r && this.state.color === i && this.state.shake === a && this.state.mode === o && this.state.interval === s) return L;
+		if (!this.state || this.state.color === i && this.state.shake === a && this.state.mode === o && this.state.interval === s || this.cleanup(), r && !this.state) {
+			let e = n.style.position, t = n.style.overflow;
+			this.state = {
+				active: r,
+				color: i,
+				shake: a,
+				mode: o,
+				interval: s,
+				element: n,
+				originalPosition: e,
+				originalOverflow: t,
+				shakeAnimation: null,
+				pulseAnimation: null,
+				isRunning: !1,
+				lastBurstTime: performance.now() + Math.random() * s,
+				initialized: !1
+			}, At.set(n, this.createController()), this.coordinator.register(this), this.coordinator.observeElement(n), requestAnimationFrame(() => {
+				this.state && (this.initializeElement(), o === "auto" && this.startBurstInterval());
+			});
+		}
+		return L;
+	}
+	initializeElement() {
+		if (!this.state || this.state.initialized) return;
+		let { element: e, color: t, shake: n } = this.state, r = Dt[t];
+		getComputedStyle(e).position === "static" && (e.style.position = "relative"), e.style.overflow = "visible", n && (this.state.shakeAnimation = e.animate([
+			{ transform: "rotate(0deg) scale(1)" },
+			{ transform: "rotate(-2deg) scale(1.02)" },
+			{ transform: "rotate(2deg) scale(1.02)" },
+			{ transform: "rotate(-1deg) scale(1.01)" },
+			{ transform: "rotate(1deg) scale(1.01)" },
+			{ transform: "rotate(0deg) scale(1)" }
+		], {
+			duration: 400,
+			easing: "ease-in-out",
+			iterations: Infinity
+		})), this.state.pulseAnimation = e.animate([
+			{ boxShadow: `0 0 0 0 ${r[0]}66` },
+			{ boxShadow: `0 0 20px 5px ${r[0]}33` },
+			{ boxShadow: `0 0 0 0 ${r[0]}66` }
+		], {
+			duration: 1500,
+			easing: "ease-in-out",
+			iterations: Infinity
+		}), this.coordinator.playSound(t), this.state.initialized = !0;
+	}
+	checkBurstTimer(e) {
+		this.state && this.state.isRunning && this.coordinator.isTabVisible() && this.coordinator.isElementVisible(this.state.element) && e - this.state.lastBurstTime >= this.state.interval && (this.state.lastBurstTime = e, this.createBurst());
+	}
+	createBurst() {
+		if (!this.state) return;
+		let { element: e, color: t } = this.state, n = Dt[t], r = Ot[t], i = e.getBoundingClientRect(), a = i.left + i.width / 2, o = i.top + i.height / 2, s = 8 + Math.floor(5 * Math.random()), c = [];
+		for (let e = 0; e < s; e++) {
+			let e = this.coordinator.acquireShard(r, n), t = Math.random() * Math.PI * 2, i = 2 + 4 * Math.random();
+			c.push({
+				element: e,
+				colorIndex: r,
+				x: a,
+				y: o,
+				vx: Math.cos(t) * i,
+				vy: Math.sin(t) * i,
+				rotation: 360 * Math.random(),
+				rotationSpeed: 30 * Math.random() - 15,
+				initialScale: .5 + .5 * Math.random(),
+				life: 0,
+				maxLife: 40 + 30 * Math.random()
+			});
+		}
+		this.coordinator.addShards(c), this.coordinator.playSound(t);
+	}
+	pauseAnimations() {
+		this.state?.shakeAnimation?.pause(), this.state?.pulseAnimation?.pause();
+	}
+	resumeAnimations() {
+		this.state?.shakeAnimation?.play(), this.state?.pulseAnimation?.play();
+	}
+	createController() {
+		let e = this;
+		return {
+			play: () => e.playOnce(),
+			start: (t) => {
+				e.state && t !== void 0 && (e.state.interval = t), e.startBurstInterval();
+			},
+			stop: () => e.stopBurstInterval(),
+			get isRunning() {
+				return e.state?.isRunning ?? !1;
+			}
+		};
+	}
+	playOnce() {
+		this.state && (this.state.initialized || this.initializeElement(), this.createBurst());
+	}
+	startBurstInterval() {
+		this.state && (this.state.isRunning = !0, this.state.lastBurstTime = performance.now());
+	}
+	stopBurstInterval() {
+		this.state && (this.state.isRunning = !1);
+	}
+	cleanup() {
+		this.state &&= (this.coordinator.unregister(this), this.coordinator.unobserveElement(this.state.element), this.state.shakeAnimation?.cancel(), this.state.pulseAnimation?.cancel(), At.delete(this.state.element), this.state.originalPosition !== void 0 && (this.state.element.style.position = this.state.originalPosition), this.state.originalOverflow !== void 0 && (this.state.element.style.overflow = this.state.originalOverflow), null);
+	}
+	disconnected() {
+		this.cleanup();
+	}
+}), Mt = Object.assign((e, t, n) => jt(e, t, n), { getController: (e) => At.get(e) }), Nt = 10, Pt = B(class extends z {
+	constructor(...e) {
+		super(...e), this.state = null;
+	}
+	render(e) {
+		return L;
+	}
+	update(e, [t]) {
+		let n = e.element, r = n.offsetWidth || n.clientWidth, { active: i, color: a = "var(--md-sys-color-primary)", travelWidth: o = r } = t;
+		return !i && this.state ? (this.cleanup(), L) : i ? (!this.state || this.state.color === a && this.state.travelWidth === o || this.cleanup(), this.state || (this.state = {
+			active: !0,
+			color: a,
+			travelWidth: o,
+			element: n,
+			segments: [],
+			isVisible: !0,
+			startTime: performance.now()
+		}, getComputedStyle(n).position === "static" && (n.style.position = "relative"), this.createOverlay(), this.setupVisibilityObserver(), this.startAnimation()), L) : L;
+	}
+	createOverlay() {
+		if (!this.state) return;
+		let { element: e, color: t, travelWidth: n } = this.state, r = document.createElement("div");
+		r.className = "working-snake-overlay", r.style.cssText = `\n\t\t\tposition: absolute;\n\t\t\ttop: 50%;\n\t\t\tleft: 0;\n\t\t\twidth: ${n}px;\n\t\t\theight: 20px;\n\t\t\ttransform: translateY(-50%);\n\t\t\tpointer-events: none;\n\t\t\toverflow: visible;\n\t\t\tz-index: 5;\n\t\t`;
+		let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+		i.setAttribute("width", "100%"), i.setAttribute("height", "100%"), i.setAttribute("viewBox", `0 0 ${n} 20`), i.setAttribute("preserveAspectRatio", "none"), i.style.cssText = "\n			position: absolute;\n			top: 0;\n			left: 0;\n			width: 100%;\n			height: 100%;\n			overflow: visible;\n		";
+		let a = [];
+		for (let e = 0; e < Nt; e++) {
+			let n = document.createElementNS("http://www.w3.org/2000/svg", "circle"), r = 4 - e / 9 * 2.5;
+			n.setAttribute("r", r.toString()), n.setAttribute("fill", t), n.setAttribute("cy", "10"), n.style.willChange = "transform, opacity";
+			let o = e / Nt * .5, s = e / Nt * Math.PI * 2;
+			a.push({
+				element: n,
+				progress: o,
+				phase: s
+			}), i.appendChild(n);
+		}
+		r.appendChild(i), e.appendChild(r), this.state.overlayElement = r, this.state.svg = i, this.state.segments = a;
+	}
+	setupVisibilityObserver() {
+		this.state && typeof IntersectionObserver < "u" && (this.state.observer = new IntersectionObserver((e) => {
+			if (!this.state) return;
+			let t = e[0].isIntersecting;
+			t && !this.state.isVisible ? (this.state.isVisible = !0, this.startAnimation()) : !t && this.state.isVisible && (this.state.isVisible = !1, this.state.animationId && (cancelAnimationFrame(this.state.animationId), this.state.animationId = void 0));
+		}, { threshold: 0 }), this.state.observer.observe(this.state.element));
+	}
+	startAnimation() {
+		if (!this.state || !this.state.isVisible) return;
+		let e = (t) => {
+			if (!this.state || !this.state.isVisible) return;
+			let n = (t - this.state.startTime) % 3e3 / 3e3, { segments: r, travelWidth: i } = this.state;
+			for (let e = 0; e < r.length; e++) {
+				let a = r[e], o = (n + e / Nt) % 1, s = 1 - (1 - o) ** 2, c = s * i, l = 10 + 3 * Math.sin(o * Math.PI * 4 + a.phase), u = (e === 0 ? .9 : .7 - e / Nt * .55) * (1 - .7 * s), d = 1;
+				e === 0 && (d = .1 * Math.sin(t / 200) + 1), a.element.setAttribute("cx", c.toFixed(1)), a.element.setAttribute("cy", l.toFixed(1)), a.element.setAttribute("opacity", Math.max(.1, u).toFixed(2)), d !== 1 && (a.element.style.transform = `scale(${d.toFixed(2)})`, a.element.style.transformOrigin = `${c}px ${l}px`);
+			}
+			this.state.animationId = requestAnimationFrame(e);
+		};
+		this.state.animationId = requestAnimationFrame(e);
+	}
+	cleanup() {
+		this.state &&= (this.state.animationId && cancelAnimationFrame(this.state.animationId), this.state.observer && this.state.observer.disconnect(), this.state.overlayElement && this.state.overlayElement.remove(), null);
+	}
+	disconnected() {
+		this.cleanup();
+	}
+});
+export { me as A, Le as C, Me as D, Pe as E, Ae as O, ze as S, Fe as T, qe as _, xt as a, Ve as b, ft as c, rt as d, nt as f, Ge as g, Ye as h, Ct as i, he as k, ut as l, Xe as m, Mt as n, yt as o, Ze as p, Et as r, pt as s, Pt as t, st as u, Ke as v, Ie as w, Be as x, Je as y };