@groupviz/react 2.1.3 → 2.1.4

package/index.js

@@ -1,12 +1,12 @@
 import { createContext as e, createElement as t, memo as n, useCallback as r, useContext as i, useEffect as a, useId as o, useLayoutEffect as s, useMemo as c, useRef as l, useState as u } from "react";
 import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
 import m from "katex";
-import { COLOR_PALETTE as h, FACE_COLOR_PALETTE as g, buildCosetViewData as _, buildUndirectedEdgeKeys as v, cayleyCircleLayout as y, compute3DPositions as b, computeCayleyActionEdges as x, computeCycleCandidates as S, computeElementRotation as C, computeFixedPoints as w, computeLatticeLayout as T, computeShape2DPositions as E, computeSubgroupLattice as D, cosetStripLayout as O, cycleGraphLayout as k, elementOrder as A, factorizeOrder as j, findAllSubgroups as M, findMinimalGenerators as N, getDefaultLayout3D as P, getDefaultShape2D as F, getGroupCenter as I, getHomomorphismProperties as L, getSemidirectProductMeta as R, getSymmetryType as z, isTooLarge as ee, latticeFitScale as B, latticeLodTier as te, latticeSlotScreenSize as ne, mergeLatticeByConjugacy as V, resolveElement as H, semidirectFactorMap as U, semidirectFixedPoints as re, subgroupFaces as W, subgroupSetKey as ie, subgroupStructureSymbol as G, verifyHomomorphism as K } from "@groupviz/core";
-import { Canvas as q, useFrame as ae, useThree as oe } from "@react-three/fiber";
-import { Html as se, OrbitControls as ce } from "@react-three/drei";
+import { COLOR_PALETTE as h, FACE_COLOR_PALETTE as g, buildCosetViewData as _, buildUndirectedEdgeKeys as v, cayleyCircleLayout as y, circleLayoutRadius as b, compute3DPositions as x, computeCayleyActionEdges as S, computeCycleCandidates as C, computeElementRotation as w, computeFixedPoints as T, computeLatticeLayout as E, computeShape2DPositions as D, computeSubgroupLattice as O, cosetStripLayout as k, cycleGraphLayout as A, elementOrder as j, factorizeOrder as M, findAllSubgroups as N, findMinimalGenerators as P, getDefaultLayout3D as F, getDefaultShape2D as I, getGroupCenter as L, getHomomorphismProperties as R, getSemidirectProductMeta as ee, getSymmetryType as te, isTooLarge as z, latticeFitScale as ne, latticeLodTier as B, latticeSlotScreenSize as V, mergeLatticeByConjugacy as re, resolveElement as H, semidirectFactorMap as ie, semidirectFixedPoints as U, subgroupFaces as W, subgroupSetKey as G, subgroupStructureSymbol as K, verifyHomomorphism as q } from "@groupviz/core";
+import { Canvas as ae, useFrame as oe, useThree as se } from "@react-three/fiber";
+import { Html as ce, OrbitControls as le } from "@react-three/drei";
 import * as J from "three";
 //#region src/components/Canvas/SceneThemeRoot.tsx
-function le({ theme: e, children: t, style: n, className: r }) {
+function Y({ theme: e, children: t, style: n, className: r }) {
 	return e ? /* @__PURE__ */ f("div", {
 		"data-theme": e,
 		className: r,
@@ -111,18 +111,18 @@ var ue = {
 	"⟩": "\\rangle",
 	"⁻": "^{-1}"
 };
-function Y(e) {
+function X(e) {
 	let t = "";
 	for (let n = 0; n < e.length; n++) {
 		let r = e[n], i = n + 1 < e.length ? e[n + 1] : "";
 		if (pe[r]) {
 			let e = pe[r];
-			t += e, me(e) && X(i) && (t += " ");
+			t += e, Z(e) && me(i) && (t += " ");
 			continue;
 		}
 		if (fe[r]) {
 			let e = fe[r];
-			t += e, me(e) && X(i) && (t += " ");
+			t += e, Z(e) && me(i) && (t += " ");
 			continue;
 		}
 		if (ue[r]) {
@@ -143,7 +143,7 @@ function Y(e) {
 	}
 	return t;
 }
-function me(e) {
+function Z(e) {
 	if (!e.startsWith("\\") || e.length < 2) return !1;
 	for (let t = 1; t < e.length; t++) {
 		let n = e[t];
@@ -151,10 +151,10 @@ function me(e) {
 	}
 	return !0;
 }
-function X(e) {
+function me(e) {
 	return e ? e >= "a" && e <= "z" || e >= "A" && e <= "Z" : !1;
 }
-function Z(e, t = !1) {
+function Q(e, t = !1) {
 	try {
 		return m.renderToString(e, {
 			displayMode: t,
@@ -168,13 +168,13 @@ function Z(e, t = !1) {
 }
 //#endregion
 //#region src/components/Canvas/SetView.tsx
-function Q(e) {
-	return /* @__PURE__ */ f(le, {
+function he(e) {
+	return /* @__PURE__ */ f(Y, {
 		theme: e.theme,
-		children: /* @__PURE__ */ f(_e, { ...e })
+		children: /* @__PURE__ */ f(ve, { ...e })
 	});
 }
-var he = [
+var ge = [
 	"#ff6b6b",
 	"#4ecdc4",
 	"#ffd93d",
@@ -192,7 +192,7 @@ var he = [
 	"#0ea5e9",
 	"#22c55e"
 ];
-function ge(e, t, n, r, i, a, o = !0) {
+function _e(e, t, n, r, i, a, o = !0) {
 	let s = e.cosetMemberLabels, c = Math.min(s.length, 12), l = Math.min(10, Math.max(4, Math.floor(t / (Math.max(3, Math.sqrt(c)) * 1.8)))), u = t * .72, m = e.cosetInternalLayout && e.cosetInternalLayout.length >= c, h = (n) => {
 		if (m) {
 			let t = e.cosetInternalLayout[n];
@@ -213,7 +213,7 @@ function ge(e, t, n, r, i, a, o = !0) {
 			cx: t.x,
 			cy: t.y,
 			r: l,
-			fill: he[e % he.length],
+			fill: ge[e % ge.length],
 			stroke: "var(--node-stroke)",
 			strokeWidth: .8
 		}, e));
@@ -293,7 +293,7 @@ function ge(e, t, n, r, i, a, o = !0) {
 		})
 	] });
 }
-function _e({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r, subsets: i, selfInverseElementId: a, cosetElementMap: o, cosetHighlightSet: s, cosetColors: l, onSelect: u, onHover: m, noGroupText: h, nodeRadius: g, gap: _, columns: v, showLabels: y, largeGroupThreshold: b = 60 }) {
+function ve({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r, subsets: i, selfInverseElementId: a, cosetElementMap: o, cosetHighlightSet: s, cosetColors: l, onSelect: u, onHover: m, noGroupText: h, nodeRadius: g, gap: _, columns: v, showLabels: y, largeGroupThreshold: b = 60 }) {
 	let x = c(() => {
 		let e = /* @__PURE__ */ new Map();
 		return i?.forEach((t) => t.elementIds.forEach((n) => {
@@ -301,7 +301,7 @@ function _e({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 		})), e;
 	}, [i]), S = c(() => {
 		let t = /* @__PURE__ */ new Map();
-		return e?.elements.forEach((e) => t.set(e.id, Z(Y(e.label)))), t;
+		return e?.elements.forEach((e) => t.set(e.id, Q(X(e.label)))), t;
 	}, [e]), C = l ?? [];
 	if (!e) return /* @__PURE__ */ f("div", {
 		className: "view-empty",
@@ -355,7 +355,7 @@ function _e({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 					onMouseLeave: () => m?.(null, null),
 					style: { cursor: "pointer" },
 					children: [
-						T ? ge(e, E, c, _, v, b, !0) : /* @__PURE__ */ p(d, { children: [
+						T ? _e(e, E, c, _, v, b, !0) : /* @__PURE__ */ p(d, { children: [
 							/* @__PURE__ */ f("circle", {
 								r: E,
 								fill: _,
@@ -433,13 +433,13 @@ function _e({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 }
 //#endregion
 //#region src/components/Canvas/CycleView.tsx
-function ve(e) {
-	return /* @__PURE__ */ f(le, {
+function ye(e) {
+	return /* @__PURE__ */ f(Y, {
 		theme: e.theme,
-		children: /* @__PURE__ */ f(xe, { ...e })
+		children: /* @__PURE__ */ f(Se, { ...e })
 	});
 }
-var ye = 0, be = [
+var be = 0, xe = [
 	"#ff6b6b",
 	"#4ecdc4",
 	"#ffd93d",
@@ -448,25 +448,25 @@ var ye = 0, be = [
 	"#3498db",
 	"#e67e22"
 ];
-function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i, showMaximalCycles: a = !0, nodeRadius: o = 24, showLabels: s = !0, showCycleLabels: l = !0, locked: d = !1, subsets: m, selfInverseElementId: h, cosetElementMap: g, cosetHighlightSet: _, cosetColors: v, getNodePosition: y, onNodePositionChange: b, onSelect: x, onHover: S, noGroupText: C, largeGroupThreshold: w = 60 }) {
-	let [T] = u(() => `cyv${++ye}`), E = e ? `${e.symbol}|${e.order}|${a}` : "", [D, O] = u({
-		key: E,
+function Se({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i, showMaximalCycles: a = !0, nodeRadius: o = 24, showLabels: s = !0, showCycleLabels: l = !0, locked: d = !1, subsets: m, selfInverseElementId: h, cosetElementMap: g, cosetHighlightSet: _, cosetColors: v, getNodePosition: y, onNodePositionChange: x, onSelect: S, onHover: C, noGroupText: w, largeGroupThreshold: T = 60 }) {
+	let [E] = u(() => `cyv${++be}`), D = e ? `${e.symbol}|${e.order}|${a}` : "", [O, k] = u({
+		key: D,
 		map: /* @__PURE__ */ new Map()
 	});
-	D.key !== E && O({
-		key: E,
+	O.key !== D && k({
+		key: D,
 		map: /* @__PURE__ */ new Map()
 	});
-	let A = c(() => D.key === E ? D.map : /* @__PURE__ */ new Map(), [D, E]), j = r((e, t) => {
-		O((n) => {
-			if (n.key !== E) return n;
+	let j = c(() => O.key === D ? O.map : /* @__PURE__ */ new Map(), [O, D]), M = r((e, t) => {
+		k((n) => {
+			if (n.key !== D) return n;
 			let r = new Map(n.map);
 			return r.set(e, t), {
 				key: n.key,
 				map: r
 			};
 		});
-	}, [E]), M = c(() => {
+	}, [D]), N = c(() => {
 		if (!e) return [];
 		let t = [], n = /* @__PURE__ */ new Set();
 		for (let r of e.elements) {
@@ -493,50 +493,54 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 				return [...n].every((e) => r.has(e));
 			});
 		}).sort((e, t) => e.order - t.order) : t.sort((e, t) => e.order - t.order);
-	}, [e, a]), N = c(() => !e || !a || M.length === 0 ? null : k(e.elements, M.map((e) => ({ elementIds: e.elements.map((e) => e.id) })), i.width, i.height, e.identity.id), [
+	}, [e, a]), P = c(() => !e || !a || N.length === 0 ? null : A(e.elements, N.map((e) => ({ elementIds: e.elements.map((e) => e.id) })), i.width, i.height, e.identity.id), [
 		e,
 		a,
-		M,
+		N,
 		i.width,
 		i.height
-	]), P = c(() => {
+	]), F = c(() => {
 		let e = /* @__PURE__ */ new Map();
 		return m?.forEach((t) => t.elementIds.forEach((n) => {
 			e.has(n) || e.set(n, t);
 		})), e;
-	}, [m]), F = v ?? [], I = c(() => {
+	}, [m]), I = v ?? [], L = c(() => {
 		let t = /* @__PURE__ */ new Map();
-		return e?.elements.forEach((e) => t.set(e.id, Z(Y(e.label)))), t;
+		return e?.elements.forEach((e) => t.set(e.id, Q(X(e.label)))), t;
 	}, [e]);
 	if (!e) return /* @__PURE__ */ f("div", {
 		className: "view-empty",
-		children: /* @__PURE__ */ f("p", { children: C ?? "" })
+		children: /* @__PURE__ */ f("p", { children: w ?? "" })
 	});
-	let L = e.order > w, R = (e, t) => {
-		if (!L) return !0;
+	let R = e.order > T, ee = (e, t) => {
+		if (!R) return !0;
 		let r = e * n.scale + n.x, a = t * n.scale + n.y, s = o * n.scale * 1.5;
 		return r + s > 0 && r - s < i.width && a + s > 0 && a - s < i.height;
-	}, z = i.width / 2, ee = i.height / 2, B = Math.min(i.width * .32, 160 + e.order * 16), te = (t) => {
+	}, te = i.width / 2, z = i.height / 2, ne = b(i.width, i.height, e.order, o, {
+		widthFactor: .32,
+		base: 160,
+		growth: 16
+	}), B = (t) => {
 		let n = y?.(t);
 		if (n) return n;
-		let r = A.get(t);
+		let r = j.get(t);
 		if (r) return r;
-		if (N) {
-			let e = N.get(t);
+		if (P) {
+			let e = P.get(t);
 			if (e) return e;
 		}
 		let i = e.elements.findIndex((e) => e.id === t) * 2 * Math.PI / e.order - Math.PI / 2;
 		return {
-			x: z + B * Math.cos(i),
-			y: ee + B * Math.sin(i)
+			x: te + ne * Math.cos(i),
+			y: z + ne * Math.sin(i)
 		};
 	};
 	return /* @__PURE__ */ p("svg", {
 		viewBox: `0 0 ${i.width} ${i.height}`,
 		className: "view-svg",
 		style: { userSelect: "none" },
-		children: [!L && /* @__PURE__ */ f("defs", { children: /* @__PURE__ */ f("filter", {
-			id: `${T}-node-shadow`,
+		children: [!R && /* @__PURE__ */ f("defs", { children: /* @__PURE__ */ f("filter", {
+			id: `${E}-node-shadow`,
 			x: "-30%",
 			y: "-30%",
 			width: "160%",
@@ -550,10 +554,10 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 			})
 		}) }), /* @__PURE__ */ p("g", {
 			transform: `translate(${n.x}, ${n.y}) scale(${n.scale})`,
-			children: [M.map((e, n) => {
-				let r = e.elements.map((e) => te(e.id));
+			children: [N.map((e, n) => {
+				let r = e.elements.map((e) => B(e.id));
 				if (r.length < 2) return null;
-				let i = r.map((e, t) => t === 0 ? `M ${e.x} ${e.y}` : `L ${e.x} ${e.y}`).join(" ") + " Z", o = t.size > 0 && e.elements.some((e) => t.has(e.id)), s = be[n % be.length];
+				let i = r.map((e, t) => t === 0 ? `M ${e.x} ${e.y}` : `L ${e.x} ${e.y}`).join(" ") + " Z", o = t.size > 0 && e.elements.some((e) => t.has(e.id)), s = xe[n % xe.length];
 				if (a) {
 					if (r.length === 2) return /* @__PURE__ */ f("line", {
 						x1: r[0].x,
@@ -588,7 +592,7 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 					})] }, n);
 				}
 				if (!l) return null;
-				let c = be[n % be.length], u = r.reduce((e, t) => e + t.x, 0) / r.length, d = r.reduce((e, t) => e + t.y, 0) / r.length;
+				let c = xe[n % xe.length], u = r.reduce((e, t) => e + t.x, 0) / r.length, d = r.reduce((e, t) => e + t.y, 0) / r.length;
 				return /* @__PURE__ */ p("g", { children: [
 					/* @__PURE__ */ f("path", {
 						d: i,
@@ -621,13 +625,13 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 					})
 				] }, n);
 			}), e.elements.map((e) => {
-				let r = te(e.id);
-				if (!R(r.x, r.y)) return null;
-				let a = t.has(e.id), c = P.get(e.id), l = g?.get(e.id), u = l !== void 0 && (_?.has(l) ?? !1), m = "var(--node-fill)", v = "var(--node-stroke)", y = 2.5;
-				return a ? (m = "var(--node-fill-selected)", v = "#ffd93d", y = 3) : u && l !== void 0 && F[l] ? (m = F[l] + "33", v = F[l], y = 3) : c && (m = c.color + "33", v = c.color, y = 2.5), /* @__PURE__ */ p("g", {
+				let r = B(e.id);
+				if (!ee(r.x, r.y)) return null;
+				let a = t.has(e.id), c = F.get(e.id), l = g?.get(e.id), u = l !== void 0 && (_?.has(l) ?? !1), m = "var(--node-fill)", v = "var(--node-stroke)", y = 2.5;
+				return a ? (m = "var(--node-fill-selected)", v = "#ffd93d", y = 3) : u && l !== void 0 && I[l] ? (m = I[l] + "33", v = I[l], y = 3) : c && (m = c.color + "33", v = c.color, y = 2.5), /* @__PURE__ */ p("g", {
 					transform: `translate(${r.x}, ${r.y})`,
 					onClick: (t) => {
-						t.stopPropagation(), x?.(e.id, t.ctrlKey || t.metaKey);
+						t.stopPropagation(), S?.(e.id, t.ctrlKey || t.metaKey);
 					},
 					onMouseDown: (t) => {
 						if (d || t.button !== 0) return;
@@ -636,9 +640,9 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 						if (!r) return;
 						let a = r.getBoundingClientRect();
 						if (a.width === 0 || a.height === 0) return;
-						let o = i.width / a.width, s = i.height / a.height, c = (t.clientX - a.left) * o, l = (t.clientY - a.top) * s, u = te(e.id), f = (t) => {
+						let o = i.width / a.width, s = i.height / a.height, c = (t.clientX - a.left) * o, l = (t.clientY - a.top) * s, u = B(e.id), f = (t) => {
 							let r = (t.clientX - a.left) * o, i = (t.clientY - a.top) * s, d = u.x + (r - c) / n.scale, f = u.y + (i - l) / n.scale;
-							b ? b(e.id, d, f) : j(e.id, {
+							x ? x(e.id, d, f) : M(e.id, {
 								x: d,
 								y: f
 							});
@@ -647,11 +651,11 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 						};
 						window.addEventListener("mousemove", f), window.addEventListener("mouseup", p);
 					},
-					onMouseEnter: () => S?.(e, {
+					onMouseEnter: () => C?.(e, {
 						x: r.x * n.scale + n.x,
 						y: r.y * n.scale + n.y
 					}),
-					onMouseLeave: () => S?.(null, null),
+					onMouseLeave: () => C?.(null, null),
 					style: { cursor: "grab" },
 					children: [
 						/* @__PURE__ */ f("circle", {
@@ -659,19 +663,19 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 							fill: m,
 							stroke: v,
 							strokeWidth: y,
-							filter: L ? void 0 : `url(#${T}-node-shadow)`
+							filter: R ? void 0 : `url(#${E}-node-shadow)`
 						}),
 						c && /* @__PURE__ */ f("circle", {
 							r: o,
 							fill: `${c.color}22`,
 							stroke: "none"
 						}),
-						u && l !== void 0 && F[l] && /* @__PURE__ */ f("circle", {
+						u && l !== void 0 && I[l] && /* @__PURE__ */ f("circle", {
 							r: o,
-							fill: `${F[l]}22`,
+							fill: `${I[l]}22`,
 							stroke: "none"
 						}),
-						s && (!L || a || t.size === 0) && /* @__PURE__ */ f("foreignObject", {
+						s && (!R || a || t.size === 0) && /* @__PURE__ */ f("foreignObject", {
 							x: -o,
 							y: -15,
 							width: o * 2,
@@ -688,9 +692,9 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 									width: "100%",
 									height: "100%",
 									color: "var(--node-text)",
-									fontSize: L ? "10px" : "14px"
+									fontSize: R ? "10px" : "14px"
 								},
-								dangerouslySetInnerHTML: { __html: I.get(e.id) ?? "" }
+								dangerouslySetInnerHTML: { __html: L.get(e.id) ?? "" }
 							})
 						}),
 						h === e.id && /* @__PURE__ */ p("g", { children: [/* @__PURE__ */ f("circle", {
@@ -720,37 +724,37 @@ function xe({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 }
 //#endregion
 //#region src/utils/elementRef.ts
-var Se = /* @__PURE__ */ new Set();
-function Ce(e, t, n) {
+var Ce = /* @__PURE__ */ new Set();
+function we(e, t, n) {
 	let r = H(e, t);
 	if (r) return r;
 	if (!e || t == null || t === "") return null;
 	let i = `${n}|${e.symbol}|${t}`;
-	return Se.has(i) || (Se.add(i), console.warn(`[groupviz] ${n}: 元素引用 ${JSON.stringify(t)} 在群 ${e?.symbol ?? "?"} 中解析不到（已试 id / label / value / 循环记号四种写法），该项已忽略。`)), null;
+	return Ce.has(i) || (Ce.add(i), console.warn(`[groupviz] ${n}: 元素引用 ${JSON.stringify(t)} 在群 ${e?.symbol ?? "?"} 中解析不到（已试 id / label / value / 循环记号四种写法），该项已忽略。`)), null;
 }
-function we(e, t, n) {
+function Te(e, t, n) {
 	if (!t) return [];
 	let r = [], i = /* @__PURE__ */ new Set();
 	for (let a of t) {
-		let t = Ce(e, a, n);
+		let t = we(e, a, n);
 		!t || i.has(t.id) || (i.add(t.id), r.push(t.id));
 	}
 	return r;
 }
 //#endregion
 //#region src/context/cayleyActions.ts
-function Te(e) {
+function Ee(e) {
 	return e.generators.map((t, n) => ({
 		elementId: t.apply(e.identity)?.id || e.elements[0]?.id || e.identity.id,
 		enabled: !0,
 		color: h[n % h.length]
 	}));
 }
-function Ee(e, t) {
-	if (!t) return Te(e);
+function De(e, t) {
+	if (!t) return Ee(e);
 	let n = [], r = /* @__PURE__ */ new Set();
 	for (let i of t) {
-		let t = Ce(e, i.elementId, "CayleyView.actions[].elementId");
+		let t = we(e, i.elementId, "CayleyView.actions[].elementId");
 		!t || r.has(t.id) || (r.add(t.id), n.push({
 			elementId: t.id,
 			enabled: i.enabled !== !1,
@@ -761,14 +765,14 @@ function Ee(e, t) {
 }
 //#endregion
 //#region src/components/Canvas/CayleyView.tsx
-function De(e) {
-	return /* @__PURE__ */ f(le, {
+function Oe(e) {
+	return /* @__PURE__ */ f(Y, {
 		theme: e.theme,
-		children: /* @__PURE__ */ f(Ae, { ...e })
+		children: /* @__PURE__ */ f(je, { ...e })
 	});
 }
-var Oe = 0;
-function ke(e, t, n, r, i, a) {
+var ke = 0;
+function Ae(e, t, n, r, i, a) {
 	let o = t.get(e.fromId), s = t.get(e.toId);
 	if (!o || !s) return null;
 	let c = s.x - o.x, l = s.y - o.y, u = Math.sqrt(c * c + l * l);
@@ -799,100 +803,100 @@ function ke(e, t, n, r, i, a) {
 		opacity: .9
 	}, `${e.fromId}-${e.toId}-${e.actionElementId}`);
 }
-function Ae({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i, shape2D: a, multiplyType: o, actions: s, nodeRadius: l, showLabels: d, locked: m = !1, onSelect: h, onHover: g, hoveredElementId: _, noGroupText: v, largeGroupThreshold: b = 60 }) {
-	let [S] = u(() => `cv${++Oe}`), C = e?.order ?? 0, w = e ? a ?? F(e) : "circular", T = o ?? "right", D = l ?? 28, O = C > b, k = c(() => e ? Ee(e, s) : [], [e, s]), A = e ? `${e.symbol}|${e.order}|${w}` : "", [j, M] = u({
-		key: A,
+function je({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i, shape2D: a, multiplyType: o, actions: s, nodeRadius: l, showLabels: d, locked: m = !1, onSelect: h, onHover: g, hoveredElementId: _, noGroupText: v, largeGroupThreshold: x = 60 }) {
+	let [C] = u(() => `cv${++ke}`), w = e?.order ?? 0, T = e ? a ?? I(e) : "circular", E = o ?? "right", O = l ?? 28, k = w > x, A = c(() => e ? De(e, s) : [], [e, s]), j = e ? `${e.symbol}|${e.order}|${T}` : "", [M, N] = u({
+		key: j,
 		map: /* @__PURE__ */ new Map()
 	});
-	j.key !== A && M({
-		key: A,
+	M.key !== j && N({
+		key: j,
 		map: /* @__PURE__ */ new Map()
 	});
-	let N = c(() => j.key === A ? j.map : /* @__PURE__ */ new Map(), [j, A]), P = r((e, t) => {
-		M((n) => {
-			if (n.key !== A) return n;
+	let P = c(() => M.key === j ? M.map : /* @__PURE__ */ new Map(), [M, j]), F = r((e, t) => {
+		N((n) => {
+			if (n.key !== j) return n;
 			let r = new Map(n.map);
 			return r.set(e, t), {
 				key: n.key,
 				map: r
 			};
 		});
-	}, [A]), I = i.width / 2, L = i.height / 2, z = Math.min(i.width * .3, 180 + C * 10), ee = c(() => e ? E(e, w, i.width, i.height) : null, [
+	}, [j]), L = i.width / 2, R = i.height / 2, te = b(i.width, i.height, w, O), z = c(() => e ? D(e, T, i.width, i.height) : null, [
 		e,
-		w,
+		T,
 		i.width,
 		i.height
-	]), B = c(() => !e || C === 0 ? /* @__PURE__ */ new Map() : y(e, I, L, z), [
+	]), ne = c(() => !e || w === 0 ? /* @__PURE__ */ new Map() : y(e, L, R, te), [
 		e,
-		I,
 		L,
-		z,
-		C
-	]), te = c(() => e ? R(e) : null, [e]), ne = c(() => {
+		R,
+		te,
+		w
+	]), B = c(() => e ? ee(e) : null, [e]), V = c(() => {
 		let t = /* @__PURE__ */ new Map();
-		if (!e || !te) return t;
-		let n = U(e, te);
-		return n ? re(e, te, n) : t;
-	}, [e, te]), V = c(() => k.filter((e) => e.enabled), [k]), H = c(() => {
+		if (!e || !B) return t;
+		let n = ie(e, B);
+		return n ? U(e, B, n) : t;
+	}, [e, B]), re = c(() => A.filter((e) => e.enabled), [A]), H = c(() => {
 		let e = /* @__PURE__ */ new Map();
-		return V.forEach((t, n) => e.set(t.elementId, n)), e;
-	}, [V]), W = c(() => e ? x(e, k, T) : [], [
+		return re.forEach((t, n) => e.set(t.elementId, n)), e;
+	}, [re]), W = c(() => e ? S(e, A, E) : [], [
 		e,
-		k,
-		T
-	]), ie = r((e) => {
+		A,
+		E
+	]), G = r((e) => {
 		let t;
-		if (ee) {
-			let n = ee.get(e);
+		if (z) {
+			let n = z.get(e);
 			if (!n) return {
-				x: I,
-				y: L
+				x: L,
+				y: R
 			};
 			t = n;
 		} else {
-			let n = B.get(e);
+			let n = ne.get(e);
 			if (!n) return {
-				x: I,
-				y: L
+				x: L,
+				y: R
 			};
 			t = n;
 		}
-		let n = N.get(e);
+		let n = P.get(e);
 		return n && (Math.abs(n.x - t.x) > 1 || Math.abs(n.y - t.y) > 1) ? n : t;
 	}, [
-		ee,
-		B,
-		N,
-		I,
-		L
-	]), G = c(() => {
+		z,
+		ne,
+		P,
+		L,
+		R
+	]), K = c(() => {
 		let t = /* @__PURE__ */ new Map();
-		return e && e.elements.forEach((e) => t.set(e.id, ie(e.id))), t;
-	}, [e, ie]), K = c(() => {
+		return e && e.elements.forEach((e) => t.set(e.id, G(e.id))), t;
+	}, [e, G]), q = c(() => {
 		let t = /* @__PURE__ */ new Map();
-		return e && e.elements.forEach((e) => t.set(e.id, Z(Y(e.label)))), t;
-	}, [e]), q = c(() => t.size, [t]), ae = c(() => e ? W.map((e) => ke(e, G, D, H, !1, S)) : null, [
+		return e && e.elements.forEach((e) => t.set(e.id, Q(X(e.label)))), t;
+	}, [e]), ae = c(() => t.size, [t]), oe = c(() => e ? W.map((e) => Ae(e, K, O, H, !1, C)) : null, [
 		W,
-		G,
+		K,
 		H,
-		D,
+		O,
 		e,
-		S
-	]), oe = c(() => !e || t.size === 0 ? null : W.filter((e) => t.has(e.fromId) || t.has(e.toId)).map((e) => ke(e, G, D, H, !0, S)), [
+		C
+	]), se = c(() => !e || t.size === 0 ? null : W.filter((e) => t.has(e.fromId) || t.has(e.toId)).map((e) => Ae(e, K, O, H, !0, C)), [
 		W,
 		t,
-		G,
+		K,
 		H,
-		D,
+		O,
 		e,
-		S
-	]), se = c(() => e ? e.elements.map((e) => {
-		let t = G.get(e.id) || {
-			x: I,
-			y: L
-		}, r = t.x * n.scale + n.x, a = t.y * n.scale + n.y, o = D * n.scale * 1.5;
-		if (!(!O || r + o > 0 && r - o < i.width && a + o > 0 && a - o < i.height)) return null;
-		let s = w === "rewiring" && !!te && ne.get(e.id) === !0, c = "var(--node-fill)", l = "var(--node-stroke)", u = 2.5;
+		C
+	]), ce = c(() => e ? e.elements.map((e) => {
+		let t = K.get(e.id) || {
+			x: L,
+			y: R
+		}, r = t.x * n.scale + n.x, a = t.y * n.scale + n.y, o = O * n.scale * 1.5;
+		if (!(!k || r + o > 0 && r - o < i.width && a + o > 0 && a - o < i.height)) return null;
+		let s = T === "rewiring" && !!B && V.get(e.id) === !0, c = "var(--node-fill)", l = "var(--node-stroke)", u = 2.5;
 		return s && (c = "var(--accent-teal)22", l = "var(--accent-teal)", u = 3), /* @__PURE__ */ p("g", {
 			transform: `translate(${t.x}, ${t.y})`,
 			onClick: (t) => {
@@ -905,8 +909,8 @@ function Ae({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 				if (!r) return;
 				let a = r.getBoundingClientRect();
 				if (a.width === 0 || a.height === 0) return;
-				let o = i.width / a.width, s = i.height / a.height, c = (t.clientX - a.left) * o, l = (t.clientY - a.top) * s, u = ie(e.id), d = null, f = { current: 0 }, p = () => {
-					d && P(e.id, d);
+				let o = i.width / a.width, s = i.height / a.height, c = (t.clientX - a.left) * o, l = (t.clientY - a.top) * s, u = G(e.id), d = null, f = { current: 0 }, p = () => {
+					d && F(e.id, d);
 				}, h = (e) => {
 					let t = (e.clientX - a.left) * o, r = (e.clientY - a.top) * s;
 					d = {
@@ -928,24 +932,24 @@ function Ae({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 			style: { cursor: "grab" },
 			children: [
 				/* @__PURE__ */ f("circle", {
-					r: D,
+					r: O,
 					fill: c,
 					stroke: l,
 					strokeWidth: u,
-					filter: O ? void 0 : `url(#${S}-node-shadow)`
+					filter: k ? void 0 : `url(#${C}-node-shadow)`
 				}),
 				e.id === _ && /* @__PURE__ */ f("circle", {
-					r: D + 5,
+					r: O + 5,
 					fill: "none",
 					stroke: "#4ecdc4",
 					strokeWidth: 3.5,
 					opacity: .95,
 					style: { filter: "drop-shadow(0 0 4px rgba(78,205,196,0.7))" }
 				}),
-				d !== !1 && (!O || q === 0) && /* @__PURE__ */ f("foreignObject", {
-					x: -D,
+				d !== !1 && (!k || ae === 0) && /* @__PURE__ */ f("foreignObject", {
+					x: -O,
 					y: -16,
-					width: D * 2,
+					width: O * 2,
 					height: 32,
 					style: {
 						pointerEvents: "none",
@@ -959,53 +963,53 @@ function Ae({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 							width: "100%",
 							height: "100%",
 							color: s ? "var(--accent-teal)" : "var(--node-text)",
-							fontSize: O ? "10px" : "15px",
+							fontSize: k ? "10px" : "15px",
 							fontWeight: s ? 700 : 400
 						},
-						dangerouslySetInnerHTML: { __html: K.get(e.id) ?? "" }
+						dangerouslySetInnerHTML: { __html: q.get(e.id) ?? "" }
 					})
 				})
 			]
 		}, e.id);
 	}) : null, [
 		e,
-		G,
-		q,
-		te,
-		ne,
-		D,
+		K,
+		ae,
+		B,
+		V,
 		O,
+		k,
 		n,
 		i,
-		I,
 		L,
-		K,
-		w,
-		ie,
+		R,
+		q,
+		T,
+		G,
 		h,
 		g,
-		S,
+		C,
 		d,
-		P,
+		F,
 		m,
 		_
-	]), ce = c(() => !e || t.size === 0 ? null : [...t].map((e) => {
-		let t = G.get(e) || {
-			x: I,
-			y: L
-		}, r = t.x * n.scale + n.x, a = t.y * n.scale + n.y, o = D * n.scale * 1.5;
-		return O && !(r + o > 0 && r - o < i.width && a + o > 0 && a - o < i.height) ? null : /* @__PURE__ */ p("g", {
+	]), le = c(() => !e || t.size === 0 ? null : [...t].map((e) => {
+		let t = K.get(e) || {
+			x: L,
+			y: R
+		}, r = t.x * n.scale + n.x, a = t.y * n.scale + n.y, o = O * n.scale * 1.5;
+		return k && !(r + o > 0 && r - o < i.width && a + o > 0 && a - o < i.height) ? null : /* @__PURE__ */ p("g", {
 			transform: `translate(${t.x}, ${t.y})`,
 			children: [/* @__PURE__ */ f("circle", {
-				r: D + 3,
+				r: O + 3,
 				fill: "none",
 				stroke: "#ffd93d",
 				strokeWidth: 3,
 				opacity: .95
-			}), O && /* @__PURE__ */ f("foreignObject", {
-				x: -D,
+			}), k && /* @__PURE__ */ f("foreignObject", {
+				x: -O,
 				y: -16,
-				width: D * 2,
+				width: O * 2,
 				height: 32,
 				style: {
 					pointerEvents: "none",
@@ -1021,28 +1025,28 @@ function Ae({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 						color: "var(--node-text)",
 						fontSize: "10px"
 					},
-					dangerouslySetInnerHTML: { __html: K.get(e) ?? "" }
+					dangerouslySetInnerHTML: { __html: q.get(e) ?? "" }
 				})
 			})]
 		}, `selected-${e}`);
 	}), [
 		e,
 		t,
-		G,
-		D,
+		K,
+		O,
 		n,
 		i,
-		O,
-		I,
+		k,
 		L,
-		K
+		R,
+		q
 	]);
 	return e ? /* @__PURE__ */ p("svg", {
 		viewBox: `0 0 ${i.width} ${i.height}`,
 		className: "view-svg",
 		style: { userSelect: "none" },
 		children: [/* @__PURE__ */ p("defs", { children: [/* @__PURE__ */ f("filter", {
-			id: `${S}-node-shadow`,
+			id: `${C}-node-shadow`,
 			x: "-30%",
 			y: "-30%",
 			width: "160%",
@@ -1054,8 +1058,8 @@ function Ae({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 				floodColor: "#000000",
 				floodOpacity: "0.25"
 			})
-		}), V.map((e, t) => /* @__PURE__ */ f("marker", {
-			id: `${S}-arrow-${t}`,
+		}), re.map((e, t) => /* @__PURE__ */ f("marker", {
+			id: `${C}-arrow-${t}`,
 			markerWidth: 10,
 			markerHeight: 10,
 			refX: 9,
@@ -1069,10 +1073,10 @@ function Ae({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 		}, t))] }), /* @__PURE__ */ p("g", {
 			transform: `translate(${n.x}, ${n.y}) scale(${n.scale})`,
 			children: [
-				ae,
 				oe,
 				se,
-				ce
+				ce,
+				le
 			]
 		})]
 	}) : /* @__PURE__ */ f("div", {
@@ -1080,7 +1084,7 @@ function Ae({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: i,
 		children: /* @__PURE__ */ f("p", { children: v ?? "" })
 	});
 }
-var je = {
+var Me = {
 	zh: {
 		"app.title": "GroupViz - 群论可视化",
 		"app.header": "GroupViz - 群论可视化",
@@ -1090,7 +1094,7 @@ var je = {
 		"theme.viewWindowDark": "视图窗口切换为浅色",
 		"theme.viewWindowLight": "视图窗口切换为深色",
 		"welcome.subtitle": "群论可视化平台",
-		"welcome.version": "v2.1.3",
+		"welcome.version": "v2.1.4",
 		"welcome.tagline": "探索抽象代数的对称之美 — 交互式群论可视化与学习工具",
 		"welcome.enter": "进入应用",
 		"welcome.section.done": "已实现",
@@ -1719,7 +1723,7 @@ var je = {
 		"theme.viewWindowDark": "View windows: switch to light",
 		"theme.viewWindowLight": "View windows: switch to dark",
 		"welcome.subtitle": "Group Theory Visualization Platform",
-		"welcome.version": "v2.1.3",
+		"welcome.version": "v2.1.4",
 		"welcome.tagline": "Explore the beauty of symmetry in abstract algebra — Interactive group theory visualization & learning tool",
 		"welcome.enter": "Enter",
 		"welcome.section.done": "Implemented",
@@ -2340,33 +2344,33 @@ var je = {
 		"theme.switchToDark": "Switch to Dark Mode"
 	}
 };
-function Me() {
+function $() {
 	if (typeof window > "u") return "zh";
 	let e = localStorage.getItem("groupviz-lang");
 	return e === "en" || e === "zh" ? e : ((navigator.language || "").startsWith("zh"), "zh");
 }
 //#endregion
 //#region src/i18n/I18nContext.tsx
-function $(e, t) {
-	let n = je.zh[e] ?? je.en[e] ?? e;
+function Ne(e, t) {
+	let n = Me.zh[e] ?? Me.en[e] ?? e;
 	if (t) for (let [e, r] of Object.entries(t)) n = n.replace(RegExp(`\\{${e}\\}`, "g"), String(r));
 	return n;
 }
-var Ne = e({
+var Pe = e({
 	lang: "zh",
 	setLang: () => {},
-	t: $
+	t: Ne
 });
-function Pe({ children: e, lang: t, persist: n = !0 }) {
-	let [i, a] = u(() => t ?? Me()), o = r((e) => {
+function Fe({ children: e, lang: t, persist: n = !0 }) {
+	let [i, a] = u(() => t ?? $()), o = r((e) => {
 		a(e), n && localStorage.setItem("groupviz-lang", e);
 	}, [n]), s = r((e, t) => {
-		let n = je[i][e];
-		if (n === void 0 && (n = je.en[e]), n === void 0) return console.warn(`Missing translation key: "${e}" for lang "${i}"`), e;
+		let n = Me[i][e];
+		if (n === void 0 && (n = Me.en[e]), n === void 0) return console.warn(`Missing translation key: "${e}" for lang "${i}"`), e;
 		if (t) for (let [e, r] of Object.entries(t)) n = n.replace(RegExp(`\\{${e}\\}`, "g"), String(r));
 		return n;
 	}, [i]);
-	return /* @__PURE__ */ f(Ne.Provider, {
+	return /* @__PURE__ */ f(Pe.Provider, {
 		value: {
 			lang: i,
 			setLang: o,
@@ -2377,41 +2381,41 @@ function Pe({ children: e, lang: t, persist: n = !0 }) {
 }
 //#endregion
 //#region src/i18n/useTranslation.ts
-function Fe() {
-	return i(Ne);
+function Ie() {
+	return i(Pe);
 }
 //#endregion
 //#region src/components/Canvas/CosetStripScene.tsx
-var Ie = /* @__PURE__ */ new Set();
-function Le(e, t) {
+var Le = /* @__PURE__ */ new Set();
+function Re(e, t) {
 	let n = `${e.symbol}|${[...t].sort().join(",")}`;
-	Ie.has(n) || (Ie.add(n), console.warn(`[groupviz] CosetStripScene.subgroup: 元素集合 [${n.split("|")[1]}] 在群 ${e.symbol} 中不构成子群（不含单位元或乘法不封闭），陪集视图显示空态。`));
+	Le.has(n) || (Le.add(n), console.warn(`[groupviz] CosetStripScene.subgroup: 元素集合 [${n.split("|")[1]}] 在群 ${e.symbol} 中不构成子群（不含单位元或乘法不封闭），陪集视图显示空态。`));
 }
-function Re(e) {
-	return /* @__PURE__ */ f(le, {
+function ze(e) {
+	return /* @__PURE__ */ f(Y, {
 		theme: e.theme,
-		children: /* @__PURE__ */ f(ze, { ...e })
+		children: /* @__PURE__ */ f(Be, { ...e })
 	});
 }
-function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r, cosetElementMap: i, cosetColors: a, cosetHighlightSet: s, subsets: l, showLabels: u = !0, showSubgroupCayley: d = !0, onSelect: m, onHover: g, noGroupText: v, noCosetsText: b, subgroup: S, cosetType: C = "left", highlightAllCosets: w = !1 }) {
-	let { t: T } = Fe(), E = o(), D = `${E}-cs-node-shadow`, k = (e) => `${E}-cs-cayley-arrow-${e}`, A = c(() => {
-		if (i || !e || !S || S.length === 0) return null;
-		let n = we(e, S, "CosetStripScene.subgroup");
+function Be({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r, cosetElementMap: i, cosetColors: a, cosetHighlightSet: s, subsets: l, showLabels: u = !0, showSubgroupCayley: d = !0, onSelect: m, onHover: g, noGroupText: v, noCosetsText: b, subgroup: x, cosetType: C = "left", highlightAllCosets: w = !1 }) {
+	let { t: T } = Ie(), E = o(), D = `${E}-cs-node-shadow`, O = (e) => `${E}-cs-cayley-arrow-${e}`, A = c(() => {
+		if (i || !e || !x || x.length === 0) return null;
+		let n = Te(e, x, "CosetStripScene.subgroup");
 		if (n.length === 0) return null;
 		let r = _(e, n, {
 			side: C,
 			highlightAll: w,
 			selected: t ?? []
 		});
-		return r || Le(e, n), r;
+		return r || Re(e, n), r;
 	}, [
 		i,
 		e,
-		S,
+		x,
 		C,
 		w,
 		t
-	]), j = i ?? A?.cosetElementMap, M = a ?? A?.cosetColors, P = s ?? A?.cosetHighlightSet, F = c(() => {
+	]), j = i ?? A?.cosetElementMap, M = a ?? A?.cosetColors, N = s ?? A?.cosetHighlightSet, F = c(() => {
 		let e = /* @__PURE__ */ new Map();
 		return (l ?? []).forEach((t) => t.elementIds.forEach((n) => {
 			e.has(n) || e.set(n, t);
@@ -2429,7 +2433,7 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 			r,
 			topPad: 2 * r + 64
 		};
-	}, [e, j]), L = c(() => !e || !j || j.size === 0 ? null : O(e, r.width, r.height, void 0, j, new Set(j.values()).size, M, I && d ? I.topPad : void 0), [
+	}, [e, j]), L = c(() => !e || !j || j.size === 0 ? null : k(e, r.width, r.height, void 0, j, new Set(j.values()).size, M, I && d ? I.topPad : void 0), [
 		e,
 		r.width,
 		r.height,
@@ -2444,7 +2448,7 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 		let n = [];
 		for (let [e, r] of j) r === t && n.push(e);
 		if (n.length < 2 || n.length > 12) return null;
-		let r = new Set(n), i = e.elements.filter((e) => r.has(e.id)), a = N(i, e);
+		let r = new Set(n), i = e.elements.filter((e) => r.has(e.id)), a = P(i, e);
 		if (a.length === 0) return null;
 		let o = /* @__PURE__ */ new Map();
 		return {
@@ -2452,7 +2456,7 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 			hElements: i,
 			hGenerators: a,
 			genIndex: o,
-			edges: x(e, a.map((e, t) => (o.set(e.id, t), {
+			edges: S(e, a.map((e, t) => (o.set(e.id, t), {
 				elementId: e.id,
 				enabled: !0,
 				color: h[t % h.length]
@@ -2462,11 +2466,11 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 		e,
 		j,
 		d
-	]), z = c(() => {
+	]), ee = c(() => {
 		if (!e) return 28;
 		let t = Math.max(...e.elements.map((e) => e.label.length));
 		return t > 15 ? 20 : t > 8 ? 24 : 28;
-	}, [e]), ee = !e, B = (e, t) => {
+	}, [e]), te = !e, z = (e, t) => {
 		g && g(e, t);
 	};
 	return /* @__PURE__ */ p("svg", {
@@ -2487,7 +2491,7 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 				floodOpacity: "0.25"
 			})
 		}), R && R.hGenerators.map((e, t) => /* @__PURE__ */ f("marker", {
-			id: k(t),
+			id: O(t),
 			markerWidth: 13,
 			markerHeight: 13,
 			refX: 10,
@@ -2558,7 +2562,7 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 								stroke: e.color,
 								strokeWidth: 2.2,
 								opacity: .9,
-								markerEnd: e.isBidirectional ? void 0 : `url(#${k(r)})`
+								markerEnd: e.isBidirectional ? void 0 : `url(#${O(r)})`
 							}, `${e.fromId}-${e.toId}-${e.actionElementId}`);
 						}),
 						R.hElements.map((t) => {
@@ -2589,7 +2593,7 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 											color: "var(--node-text)",
 											fontSize: `${o}px`
 										},
-										dangerouslySetInnerHTML: { __html: Z(Y(t.label)) }
+										dangerouslySetInnerHTML: { __html: Q(X(t.label)) }
 									})
 								})]
 							}, `h-cayley-${t.id}`) : null;
@@ -2612,7 +2616,7 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 				L && e && e.elements.map((e) => {
 					let r = L.positions.get(e.id);
 					if (!r) return null;
-					let i = t?.has(e.id) ?? !1, a = F.get(e.id), o = j?.get(e.id), s = o !== void 0 && (P?.has(o) ?? !1), c = "var(--node-fill)", l = "var(--node-stroke)", d = 2.5;
+					let i = t?.has(e.id) ?? !1, a = F.get(e.id), o = j?.get(e.id), s = o !== void 0 && (N?.has(o) ?? !1), c = "var(--node-fill)", l = "var(--node-stroke)", d = 2.5;
 					return i ? (c = "var(--node-fill-selected)", l = "#ffd93d", d = 3) : s && o !== void 0 && M ? (c = M[o] + "33", l = M[o], d = 3) : a && (c = a.color + "33", l = a.color, d = 2.5), /* @__PURE__ */ p("g", {
 						"data-coset-node": e.id,
 						transform: `translate(${r.x}, ${r.y})`,
@@ -2621,35 +2625,35 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 						},
 						onMouseEnter: () => {
 							let t = n?.scale ?? 1;
-							B(e, {
+							z(e, {
 								x: r.x * t + (n?.x ?? 0),
 								y: r.y * t + (n?.y ?? 0)
 							});
 						},
-						onMouseLeave: () => B(null),
+						onMouseLeave: () => z(null),
 						style: { cursor: "pointer" },
 						children: [
 							/* @__PURE__ */ f("circle", {
-								r: z,
+								r: ee,
 								fill: c,
 								stroke: l,
 								strokeWidth: d,
 								filter: "url(#${shadowId})"
 							}),
 							a && /* @__PURE__ */ f("circle", {
-								r: z,
+								r: ee,
 								fill: `${a.color}22`,
 								stroke: "none"
 							}),
 							s && o !== void 0 && M && /* @__PURE__ */ f("circle", {
-								r: z,
+								r: ee,
 								fill: `${M[o]}22`,
 								stroke: "none"
 							}),
 							u && /* @__PURE__ */ f("foreignObject", {
-								x: -z,
+								x: -ee,
 								y: -16,
-								width: z * 2,
+								width: ee * 2,
 								height: 32,
 								style: {
 									pointerEvents: "none",
@@ -2665,13 +2669,13 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 										color: "var(--node-text)",
 										fontSize: e.label.length <= 4 ? "15px" : e.label.length <= 6 ? "13px" : "10px"
 									},
-									dangerouslySetInnerHTML: { __html: Z(Y(e.label)) }
+									dangerouslySetInnerHTML: { __html: Q(X(e.label)) }
 								})
 							})
 						]
 					}, e.id);
 				}),
-				ee && /* @__PURE__ */ f("text", {
+				te && /* @__PURE__ */ f("text", {
 					x: r.width / 2,
 					y: r.height / 2,
 					textAnchor: "middle",
@@ -2693,13 +2697,13 @@ function ze({ group: e, selectedElements: t, canvasTransform: n, viewBoxSize: r,
 }
 //#endregion
 //#region src/utils/download.ts
-function Be(e, t) {
+function Ve(e, t) {
 	let n = URL.createObjectURL(e), r = document.createElement("a");
 	r.href = n, r.download = t, document.body.appendChild(r), r.click(), document.body.removeChild(r), setTimeout(() => URL.revokeObjectURL(n), 1e3);
 }
 //#endregion
 //#region src/components/Canvas/TableView.tsx
-var Ve = [
+var He = [
 	"#ff6b6b",
 	"#4ecdc4",
 	"#ffd93d",
@@ -2715,15 +2719,15 @@ var Ve = [
 	"#3071a9",
 	"#d35400",
 	"#c0392b"
-], He = 60, Ue = 80;
-function We(e) {
-	return /* @__PURE__ */ f(le, {
+], Ue = 60, We = 80;
+function Ge(e) {
+	return /* @__PURE__ */ f(Y, {
 		theme: e.theme,
-		children: /* @__PURE__ */ f(Ye, { ...e })
+		children: /* @__PURE__ */ f(Xe, { ...e })
 	});
 }
-var Ge = /* @__PURE__ */ new Map(), Ke = [];
-function qe(e, t) {
+var Ke = /* @__PURE__ */ new Map(), qe = [];
+function Je(e, t) {
 	let n = e.order, r = new Set([t.get(e.identity.id) ?? 0]), i = Math.max(r.size, Math.min(n, 6 + Math.floor(Math.random() * 7))), a = [];
 	for (let e = 0; e < n; e++) r.has(e) || a.push(e);
 	for (; r.size < i && a.length > 0;) {
@@ -2732,7 +2736,7 @@ function qe(e, t) {
 	}
 	return [...r].sort((e, t) => e - t);
 }
-function Je(e, t, n) {
+function Ye(e, t, n) {
 	let r = /* @__PURE__ */ new Map(), i = (e, t) => {
 		let n = [...e].sort((e, t) => e - t).join(",");
 		r.has(n) || r.set(n, {
@@ -2769,7 +2773,7 @@ function Je(e, t, n) {
 			i(a, `⟨${e.label}⟩`);
 		}
 	}
-	if (e.order <= 60) for (let n of M(e)) {
+	if (e.order <= 60) for (let n of N(e)) {
 		if (n.order < 2 || n.order > 16) continue;
 		let e = [], r = !0;
 		for (let i of n.elements) {
@@ -2787,24 +2791,24 @@ function Je(e, t, n) {
 	let c = [...r.values()], l = c.filter((e) => e.order >= 6 && e.order <= 12), u = l.length > 0 ? l : c;
 	return u.length === 0 ? null : u[Math.floor(Math.random() * u.length)];
 }
-function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i, subsets: o, cosetElementMap: s, cosetColors: m, cosetData: h, cosetType: g, showAllCosets: _, forceShowLargeGroup: v, onForceShowLargeGroup: y, strategy: b, cellSize: x, showHeatmap: S = !1, onStrategyChange: C, onLayoutSize: w, onSelect: T, onHover: E, noGroupText: D, maxTableOrder: O, maxHeatmapOrder: k }) {
-	let { t: A } = Fe(), j = o ?? Ke, M = s ?? Ge, N = h ?? null, P = g ?? "left", F = _ ?? !1, I = e ? e.order > 16 : !1, [L, R] = u(() => b ?? "subgroup"), [z, B] = u(0), [te, ne] = u(!1), [V, H] = u(!1), [U, re] = u(1), [W, ie] = u(!1), [G, K] = u({
+function Xe({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i, subsets: o, cosetElementMap: s, cosetColors: m, cosetData: h, cosetType: g, showAllCosets: _, forceShowLargeGroup: v, onForceShowLargeGroup: y, strategy: b, cellSize: x, showHeatmap: S = !1, onStrategyChange: C, onLayoutSize: w, onSelect: T, onHover: E, noGroupText: D, maxTableOrder: O, maxHeatmapOrder: k }) {
+	let { t: A } = Ie(), j = o ?? qe, M = s ?? Ke, N = h ?? null, P = g ?? "left", F = _ ?? !1, I = e ? e.order > 16 : !1, [L, R] = u(() => b ?? "subgroup"), [ee, te] = u(0), [ne, B] = u(!1), [V, re] = u(!1), [H, ie] = u(1), [U, W] = u(!1), [G, K] = u({
 		l: 0,
 		t: 0
 	}), [q, ae] = u({
 		w: 0,
 		h: 0
-	}), oe = l(null), se = l(0), ce = l(null), J = l(null), [le, ue] = u(!1), de = v ?? le, fe = r(() => {
-		y ? y(!0) : ue(!0);
-	}, [y]), [pe, Y] = u(b);
-	b !== pe && (Y(b), b !== void 0 && R(b));
-	let me = r((e) => {
+	}), oe = l(null), se = l(0), ce = l(null), le = l(null), [J, Y] = u(!1), ue = v ?? J, de = r(() => {
+		y ? y(!0) : Y(!0);
+	}, [y]), [fe, pe] = u(b);
+	b !== fe && (pe(b), b !== void 0 && R(b));
+	let X = r((e) => {
 		R(e), C?.(e);
-	}, [C]), X = c(() => {
+	}, [C]), Z = c(() => {
 		if (!e) return /* @__PURE__ */ new Map();
 		let t = /* @__PURE__ */ new Map();
 		return e.elements.forEach((e, n) => t.set(e.id, n)), t;
-	}, [e]), Z = c(() => {
+	}, [e]), me = c(() => {
 		if (!e) return /* @__PURE__ */ new Map();
 		let t = /* @__PURE__ */ new Map();
 		return e.elements.forEach((e, n) => t.set(e.label, n)), t;
@@ -2824,18 +2828,18 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 		}
 		return i;
 	}, [e]), he = (e) => {
-		let t = Z.get(e);
-		return t === void 0 ? "#ccc" : Ve[t % Ve.length];
+		let t = me.get(e);
+		return t === void 0 ? "#ccc" : He[t % He.length];
 	}, ge = c(() => {
 		let e = /* @__PURE__ */ new Set();
 		return t.forEach((t) => {
-			let n = X.get(t);
+			let n = Z.get(t);
 			n !== void 0 && e.add(n);
 		}), e;
-	}, [t, X]), _e = c(() => e ? j.filter((e) => e.isSubgroup).map((e) => {
+	}, [t, Z]), _e = c(() => e ? j.filter((e) => e.isSubgroup).map((e) => {
 		let t = /* @__PURE__ */ new Set();
 		return e.elementIds.forEach((e) => {
-			let n = X.get(e);
+			let n = Z.get(e);
 			n !== void 0 && t.add(n);
 		}), {
 			color: e.color,
@@ -2843,26 +2847,26 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 		};
 	}) : [], [
 		j,
-		X,
+		Z,
 		e
 	]), ve = c(() => {
 		let e = /* @__PURE__ */ new Set();
 		for (let t of j) if (!t.isSubgroup) for (let n of t.elementIds) {
-			let t = X.get(n);
+			let t = Z.get(n);
 			t !== void 0 && e.add(t);
 		}
 		return e;
-	}, [j, X]), ye = c(() => {
+	}, [j, Z]), ye = c(() => {
 		let e = /* @__PURE__ */ new Map();
 		for (let t of j) for (let n of t.elementIds) {
-			let r = X.get(n);
+			let r = Z.get(n);
 			r !== void 0 && (e.has(r) || e.set(r, {
 				color: t.color,
 				isSubgroup: t.isSubgroup
 			}));
 		}
 		return e;
-	}, [j, X]), be = c(() => {
+	}, [j, Z]), be = c(() => {
 		if (!e) return /* @__PURE__ */ new Map();
 		let t = /* @__PURE__ */ new Map();
 		for (let e of _e) for (let n of e.indices) for (let r of e.indices) t.set(`${n},${r}`, e.color);
@@ -2871,14 +2875,14 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 		let t = /* @__PURE__ */ new Set();
 		if (!e || !N) return t;
 		for (let e of N.subgroup.elements) {
-			let n = X.get(e.id);
+			let n = Z.get(e.id);
 			n !== void 0 && t.add(n);
 		}
 		return t;
 	}, [
 		e,
 		N,
-		X
+		Z
 	]), Se = c(() => {
 		if (!e || !N) return /* @__PURE__ */ new Set();
 		if (F) {
@@ -2911,18 +2915,18 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 		let e = /* @__PURE__ */ new Set();
 		for (let t of _e) for (let n of t.indices) e.add(n);
 		return e;
-	}, [_e]), Te = c(() => !e || !I || L !== "subgroup" ? null : Je(e, X, j), [
+	}, [_e]), Te = c(() => !e || !I || L !== "subgroup" ? null : Ye(e, Z, j), [
 		e,
 		I,
 		L,
 		j,
-		X,
-		z
-	]), Ee = c(() => !e || !I ? [] : qe(e, X), [
+		Z,
+		ee
+	]), Ee = c(() => !e || !I ? [] : Je(e, Z), [
 		e,
 		I,
-		X,
-		z
+		Z,
+		ee
 	]), De = c(() => e ? !I || L === "full" ? e.elements.map((e, t) => t) : L === "random" ? Ee : Te ? Te.indices : Ee : [], [
 		e,
 		I,
@@ -2930,8 +2934,8 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 		Te,
 		Ee
 	]), Oe = c(() => {
-		if (!e || !Q || !(S && L === "full" && e.order > He)) return null;
-		let t = e.order, n = Math.min(Ue, t), r = [];
+		if (!e || !Q || !(S && L === "full" && e.order > Ue)) return null;
+		let t = e.order, n = Math.min(We, t), r = [];
 		for (let e = 0; e < n; e++) {
 			let i = Math.floor(e * t / n), a = Math.floor((e + 1) * t / n), o = Array(n);
 			for (let e = 0; e < n; e++) {
@@ -2939,11 +2943,11 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 				for (let e = i; e < a; e++) {
 					let t = Q[e];
 					for (let e = r; e < s; e++) {
-						let n = X.get(t[e].id) ?? 0;
+						let n = Z.get(t[e].id) ?? 0;
 						c.set(n, (c.get(n) ?? 0) + 1);
 					}
 				}
-				let l = X.get(Q[i][r].id) ?? 0, u = -1;
+				let l = Z.get(Q[i][r].id) ?? 0, u = -1;
 				for (let [e, t] of c) t > u && (u = t, l = e);
 				o[e] = l;
 			}
@@ -2953,10 +2957,10 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 	}, [
 		e,
 		Q,
-		X,
+		Z,
 		S,
 		L
-	]), ke = x ?? 50, Ae = S && e !== null && (!I || L === "full"), je = Oe ? Oe.length : De.length, Me = Math.max(4, Math.floor((Math.min(n.width, n.height) - 60) / Math.max(1, je))), $ = Ae ? Math.min(ke, Me) : ke, Ne = e ? ee(e.order, S ? "heatmap" : "table", S ? k : O) && !de : !1, Pe = !S && I && L === "full" && !!e && e.order > 30 && !V;
+	]), ke = x ?? 50, Ae = S && e !== null && (!I || L === "full"), je = Oe ? Oe.length : De.length, Me = Math.max(4, Math.floor((Math.min(n.width, n.height) - 60) / Math.max(1, je))), $ = Ae ? Math.min(ke, Me) : ke, Ne = e ? z(e.order, S ? "heatmap" : "table", S ? k : O) && !ue : !1, Pe = !S && I && L === "full" && !!e && e.order > 30 && !V;
 	a(() => {
 		if (!e || !Q) {
 			w?.(null);
@@ -2982,61 +2986,61 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 		w,
 		S
 	]);
-	let Ie = r(() => {
-		H(!1), me("subgroup");
-	}, [me]);
+	let Fe = r(() => {
+		re(!1), X("subgroup");
+	}, [X]);
 	a(() => {
 		if (!V) return;
 		let e = (e) => {
-			e.key === "Escape" && Ie();
+			e.key === "Escape" && Fe();
 		};
 		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
-	}, [V, Ie]), a(() => {
+	}, [V, Fe]), a(() => {
 		if (V) {
 			let e = oe.current;
 			e && (e.scrollLeft = 0, e.scrollTop = 0);
 		}
 	}, [V]);
 	let Le = () => {
-		re(1), H(!0);
+		ie(1), re(!0);
 	}, Re = (t) => {
 		if (t === L) {
-			B((e) => e + 1);
+			te((e) => e + 1);
 			return;
 		}
 		if (t === "full") {
 			if (!S && e && e.order > 30) {
-				ne(!0);
+				B(!0);
 				return;
 			}
-			me("full");
+			X("full");
 			return;
 		}
-		me(t);
+		X(t);
 	}, ze = () => {
-		ne(!1), Le();
-	}, We = r((e, t, n) => {
+		B(!1), Le();
+	}, Be = r((e, t, n) => {
 		let r = oe.current;
 		if (!r) return;
-		let i = r.getBoundingClientRect(), a = t ?? i.width / 2, o = n ?? i.height / 2, s = (r.scrollLeft + a) / U, c = (r.scrollTop + o) / U, l = Math.min(6, Math.max(.25, U * e));
-		re(l), requestAnimationFrame(() => {
+		let i = r.getBoundingClientRect(), a = t ?? i.width / 2, o = n ?? i.height / 2, s = (r.scrollLeft + a) / H, c = (r.scrollTop + o) / H, l = Math.min(6, Math.max(.25, H * e));
+		ie(l), requestAnimationFrame(() => {
 			r.scrollLeft = s * l - a, r.scrollTop = c * l - o;
 		});
-	}, [U]), Ye = (e) => {
-		We(e / 100 / U);
+	}, [H]), Ge = (e) => {
+		Be(e / 100 / H);
 	}, Xe = (e) => {
 		let t = oe.current;
-		t && (J.current = {
+		t && (le.current = {
 			x: e.clientX,
 			y: e.clientY,
 			sl: t.scrollLeft,
 			st: t.scrollTop
-		}, ie(!0), t.setPointerCapture(e.pointerId));
+		}, W(!0), t.setPointerCapture(e.pointerId));
 	}, Ze = (e) => {
-		let t = oe.current, n = J.current;
+		let t = oe.current, n = le.current;
 		!t || !n || (t.scrollLeft = n.sl - (e.clientX - n.x), t.scrollTop = n.st - (e.clientY - n.y));
 	}, Qe = () => {
-		J.current = null, ie(!1);
+		le.current = null, W(!1);
 	}, $e = r(() => {
 		let e = oe.current;
 		!e || se.current || (se.current = requestAnimationFrame(() => {
@@ -3064,17 +3068,17 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 		let t = ce.current;
 		if (!t || !e) return;
 		let n = t.cloneNode(!0), r = (t.getAttribute("viewBox") || "0 0 800 600").trim().split(/\s+/).map(Number);
-		n.setAttribute("width", String(r[2] || 800)), n.setAttribute("height", String(r[3] || 600)), n.removeAttribute("style"), Be(new Blob([new XMLSerializer().serializeToString(n)], { type: "image/svg+xml;charset=utf-8" }), `table_${e.symbol.replace(/[^A-Za-z0-9]+/g, "_")}_${e.order}x${e.order}.svg`);
+		n.setAttribute("width", String(r[2] || 800)), n.setAttribute("height", String(r[3] || 600)), n.removeAttribute("style"), Ve(new Blob([new XMLSerializer().serializeToString(n)], { type: "image/svg+xml;charset=utf-8" }), `table_${e.symbol.replace(/[^A-Za-z0-9]+/g, "_")}_${e.order}x${e.order}.svg`);
 	};
 	if (!e || !Q) return /* @__PURE__ */ f("div", {
 		className: "view-empty",
 		children: /* @__PURE__ */ f("p", { children: D ?? A("canvas.noGroup") })
 	});
-	if (ee(e.order, "table", O) && !de) return /* @__PURE__ */ p("div", {
+	if (z(e.order, "table", O) && !ue) return /* @__PURE__ */ p("div", {
 		className: "large-group-warning",
 		children: [/* @__PURE__ */ f("p", { children: A("canvas.orderTooLarge", { n: e.order }) }), /* @__PURE__ */ f("button", {
 			className: "panel-btn",
-			onClick: fe,
+			onClick: de,
 			children: A("canvas.show")
 		})]
 	});
@@ -3128,7 +3132,7 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 					transform: `translate(${i.x}, ${i.y}) scale(${i.scale}) translate(${ot}, ${st})`,
 					children: [
 						!S && De.map((e, t) => {
-							let n = tt[e], r = ge.has(e), i = ye.get(e), a = we.has(e), o = N !== null, s = Se.has(n.id), c = M.get(n.id), l = s && c !== void 0, u = Ve[e % Ve.length], d = null;
+							let n = tt[e], r = ge.has(e), i = ye.get(e), a = we.has(e), o = N !== null, s = Se.has(n.id), c = M.get(n.id), l = s && c !== void 0, u = He[e % He.length], d = null;
 							return !o && r ? d = "#ffd93d33" : l ? d = (m ?? [])[c] + "33" : !o && a && i && (d = i.color + "33"), !o && r && (u = "#ffd93d"), /* @__PURE__ */ p("g", {
 								transform: `translate(0, ${t * ke})`,
 								onClick: () => T?.(n.id, !0),
@@ -3154,7 +3158,7 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 							}, n.id);
 						}),
 						!S && De.map((e, t) => {
-							let n = tt[e], r = ge.has(e), i = ye.get(e), a = we.has(e), o = N !== null, s = Ce.has(n.id), c = M.get(n.id), l = s && c !== void 0, u = Ve[e % Ve.length], d = null;
+							let n = tt[e], r = ge.has(e), i = ye.get(e), a = we.has(e), o = N !== null, s = Ce.has(n.id), c = M.get(n.id), l = s && c !== void 0, u = He[e % He.length], d = null;
 							return !o && r ? d = "#ffd93d33" : l ? d = (m ?? [])[c] + "33" : !o && a && i && (d = i.color + "33"), !o && r && (u = "#ffd93d"), /* @__PURE__ */ p("g", {
 								onClick: () => T?.(n.id, !0),
 								style: { cursor: "pointer" },
@@ -3179,7 +3183,7 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 							}, `head-${n.id}`);
 						}),
 						Oe && Oe.map((e, t) => e.map((e, n) => {
-							let r = Ve[e % Ve.length], i = $ <= 8 ? .5 : $ <= 20 ? 1 : 2, a = $ <= 8 ? 1 : $ <= 20 ? 2 : 3;
+							let r = He[e % He.length], i = $ <= 8 ? .5 : $ <= 20 ? 1 : 2, a = $ <= 8 ? 1 : $ <= 20 ? 2 : 3;
 							return /* @__PURE__ */ f("g", {
 								transform: `translate(${n * $}, ${t * $})`,
 								children: /* @__PURE__ */ f("rect", {
@@ -3193,7 +3197,7 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 							}, `agg-${t}-${n}`);
 						})),
 						!Oe && De.map((t, n) => De.map((r, i) => {
-							let a = tt[t], o = tt[r], s = Q[t][r], c = he(s.label), l = ge.has(t), u = ge.has(r), d = `${t},${r}`, h = be.get(d), g = X.get(e.identity.id) ?? -1, _ = g >= 0 && t === g && ve.has(r), v = g >= 0 && r === g && ve.has(t), y = xe.has(r), b = xe.has(t), x = N !== null, C = Se.has(a.id), w = Ce.has(o.id), D = P === "left" && C && y || P === "right" && w && b;
+							let a = tt[t], o = tt[r], s = Q[t][r], c = he(s.label), l = ge.has(t), u = ge.has(r), d = `${t},${r}`, h = be.get(d), g = Z.get(e.identity.id) ?? -1, _ = g >= 0 && t === g && ve.has(r), v = g >= 0 && r === g && ve.has(t), y = xe.has(r), b = xe.has(t), x = N !== null, C = Se.has(a.id), w = Ce.has(o.id), D = P === "left" && C && y || P === "right" && w && b;
 							if (S) {
 								let e = $ <= 8 ? .5 : $ <= 20 ? 1 : 2, t = $ <= 8 ? 1 : $ <= 20 ? 2 : 3, r = c, d = "rgba(0,0,0,0.18)", p = $ <= 8 ? .2 : .5;
 								if (D) {
@@ -3283,7 +3287,7 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 				})
 			]
 		}),
-		te && /* @__PURE__ */ f("div", {
+		ne && /* @__PURE__ */ f("div", {
 			className: "table-confirm-overlay",
 			children: /* @__PURE__ */ p("div", {
 				className: "table-confirm-modal",
@@ -3300,7 +3304,7 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 						className: "table-confirm-actions",
 						children: [/* @__PURE__ */ f("button", {
 							className: "panel-btn",
-							onClick: () => ne(!1),
+							onClick: () => B(!1),
 							children: A("table.confirmCancel")
 						}), /* @__PURE__ */ f("button", {
 							className: "panel-btn",
@@ -3327,19 +3331,19 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 						/* @__PURE__ */ f("button", {
 							className: "table-fs-btn",
 							title: A("table.fullZoomOut"),
-							onClick: () => We(1 / 1.25),
+							onClick: () => Be(1 / 1.25),
 							children: "−"
 						}),
 						/* @__PURE__ */ f("button", {
 							className: "table-fs-btn",
 							title: A("table.fullZoomIn"),
-							onClick: () => We(1.25),
+							onClick: () => Be(1.25),
 							children: "+"
 						}),
 						/* @__PURE__ */ f("button", {
 							className: "table-fs-btn",
 							title: A("table.fullZoomReset"),
-							onClick: () => We(1 / U),
+							onClick: () => Be(1 / H),
 							children: "⟳"
 						}),
 						/* @__PURE__ */ f("input", {
@@ -3348,9 +3352,9 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 							min: 25,
 							max: 600,
 							step: 1,
-							value: Math.round(U * 100),
+							value: Math.round(H * 100),
 							"aria-label": A("table.zoomSlider"),
-							onChange: (e) => Ye(Number(e.target.value))
+							onChange: (e) => Ge(Number(e.target.value))
 						}),
 						/* @__PURE__ */ f("button", {
 							className: "panel-btn",
@@ -3359,13 +3363,13 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 						}),
 						/* @__PURE__ */ f("button", {
 							className: "panel-btn",
-							onClick: Ie,
+							onClick: Fe,
 							children: A("table.fullExit")
 						})
 					]
 				})]
 			}), /* @__PURE__ */ f("div", {
-				className: `table-fullscreen-body${W ? " dragging" : ""}`,
+				className: `table-fullscreen-body${U ? " dragging" : ""}`,
 				ref: oe,
 				onScroll: $e,
 				onPointerDown: Xe,
@@ -3373,14 +3377,14 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 				onPointerUp: Qe,
 				onPointerLeave: Qe,
 				children: (() => {
-					let t = e.order, n = t * 32 + 44 + 16, r = t * 32 + 26 + 34, i = X.get(e.identity.id) ?? -1, a = q.w || 960, o = q.h || 600, s = G.l / U, c = G.t / U, l = a / U, u = o / U, d = Math.max(0, Math.floor((s - 44) / 32) - 3), h = Math.min(t - 1, Math.ceil((s + l - 44) / 32) + 3), g = Math.max(0, Math.floor((c - 26) / 32) - 3), _ = Math.min(t - 1, Math.ceil((c + u - 26) / 32) + 3), v = Array.from({ length: _ - g + 1 }, (e, t) => g + t), y = Array.from({ length: h - d + 1 }, (e, t) => d + t);
+					let t = e.order, n = t * 32 + 44 + 16, r = t * 32 + 26 + 34, i = Z.get(e.identity.id) ?? -1, a = q.w || 960, o = q.h || 600, s = G.l / H, c = G.t / H, l = a / H, u = o / H, d = Math.max(0, Math.floor((s - 44) / 32) - 3), h = Math.min(t - 1, Math.ceil((s + l - 44) / 32) + 3), g = Math.max(0, Math.floor((c - 26) / 32) - 3), _ = Math.min(t - 1, Math.ceil((c + u - 26) / 32) + 3), v = Array.from({ length: _ - g + 1 }, (e, t) => g + t), y = Array.from({ length: h - d + 1 }, (e, t) => d + t);
 					return /* @__PURE__ */ p("svg", {
 						ref: ce,
 						className: "table-fullscreen-svg",
 						viewBox: `0 0 ${n} ${r}`,
 						style: {
-							width: n * U,
-							height: r * U
+							width: n * H,
+							height: r * H
 						},
 						children: [/* @__PURE__ */ p("g", {
 							transform: `translate(${S ? 8 : 44}, ${S ? 8 : 26})`,
@@ -3391,7 +3395,7 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 										x: -6,
 										y: e * 32 + 32 / 2 + 4,
 										textAnchor: "end",
-										fill: Ve[e % Ve.length],
+										fill: He[e % He.length],
 										fontSize: 11,
 										fontFamily: "serif",
 										children: t.label
@@ -3403,7 +3407,7 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 										x: e * 32 + 32 / 2,
 										y: -6,
 										textAnchor: "middle",
-										fill: Ve[e % Ve.length],
+										fill: He[e % He.length],
 										fontSize: 11,
 										fontFamily: "serif",
 										children: t.label
@@ -3472,15 +3476,15 @@ function Ye({ group: e, selectedElements: t, viewBoxSize: n, canvasTransform: i,
 }
 //#endregion
 //#region src/components/Canvas/ActionScene.tsx
-var Xe = 28, Ze = 26, Qe = 90, $e = 100, et = 30, tt = 10, nt = et + 10, rt = 8, it = 8, at = 18, ot = 14, st = "#ffd93d", ct = 44;
-function lt(e) {
+var Ze = 28, Qe = 26, $e = 90, et = 100, tt = 30, nt = 10, rt = tt + 10, it = 8, at = 8, ot = 18, st = 14, ct = "#ffd93d", lt = 44;
+function ut(e) {
 	return e <= 1 ? 52 : Math.max(52, Math.ceil(110 / Math.sin(Math.PI / e)));
 }
-function ut(e, t, n, r = 10) {
+function dt(e, t, n, r = 10) {
 	let i = n - Math.PI / 6, a = n + Math.PI / 6;
 	return `${e},${t} ${e - Math.cos(i) * r},${t - Math.sin(i) * r} ${e - Math.cos(a) * r},${t - Math.sin(a) * r}`;
 }
-function dt({ sx: e, sy: t, ex: n, ey: r, color: i, width: a = 2.2, dashed: o, dir: s = 1, opacity: c = .85, headSize: l = 12, nodeR: u = 0, offset: d = 0, tFrom: m, onClick: h, onDrop: g, highlight: _ }) {
+function ft({ sx: e, sy: t, ex: n, ey: r, color: i, width: a = 2.2, dashed: o, dir: s = 1, opacity: c = .85, headSize: l = 12, nodeR: u = 0, offset: d = 0, tFrom: m, onClick: h, onDrop: g, highlight: _ }) {
 	let v = n - e, y = r - t, b = Math.sqrt(v * v + y * y) || 1, x = v / b, S = y / b, C = Math.min(l * 1.25, Math.max(12, b * .25)), w = Math.min(l, C), T = m ? m.x : -S, E = m ? m.y : x, D = e + x * u + T * d, O = t + S * u + E * d, k = n - x * (u + C) + T * d, A = r - S * (u + C) + E * d, j = (D + k) / 2, M = (O + A) / 2, N = Math.atan2(A - M, k - j), P = `M${D},${O} Q${j},${M} ${k},${A}`;
 	return /* @__PURE__ */ p("g", { children: [
 		/* @__PURE__ */ f("path", {
@@ -3493,7 +3497,7 @@ function dt({ sx: e, sy: t, ex: n, ey: r, color: i, width: a = 2.2, dashed: o, d
 			strokeLinecap: "round"
 		}),
 		/* @__PURE__ */ f("polygon", {
-			points: ut(k, A, N, w),
+			points: dt(k, A, N, w),
 			fill: i,
 			stroke: i,
 			strokeWidth: .5,
@@ -3502,7 +3506,7 @@ function dt({ sx: e, sy: t, ex: n, ey: r, color: i, width: a = 2.2, dashed: o, d
 		_ && /* @__PURE__ */ f("path", {
 			d: P,
 			fill: "none",
-			stroke: st,
+			stroke: ct,
 			strokeWidth: 6.5,
 			strokeDasharray: o ? "8 5" : void 0,
 			strokeOpacity: .95,
@@ -3530,8 +3534,8 @@ function dt({ sx: e, sy: t, ex: n, ey: r, color: i, width: a = 2.2, dashed: o, d
 		})
 	] });
 }
-function ft({ x: e, y: t, label: n, isSelected: r, isFixed: i, nodeR: a = Xe, onClick: o, onPointerDown: s, showNumber: c, onHoverIn: l, onHoverOut: u, testId: d }) {
-	let m = r ? "var(--node-fill-selected)" : "var(--node-fill)", h = r ? st : "var(--node-stroke)";
+function pt({ x: e, y: t, label: n, isSelected: r, isFixed: i, nodeR: a = Ze, onClick: o, onPointerDown: s, showNumber: c, onHoverIn: l, onHoverOut: u, testId: d }) {
+	let m = r ? "var(--node-fill-selected)" : "var(--node-fill)", h = r ? ct : "var(--node-stroke)";
 	return /* @__PURE__ */ p("g", {
 		transform: `translate(${e}, ${t})`,
 		onClick: (e) => {
@@ -3554,7 +3558,7 @@ function ft({ x: e, y: t, label: n, isSelected: r, isFixed: i, nodeR: a = Xe, on
 				x: a - 2,
 				y: -(a + 2),
 				textAnchor: "middle",
-				fill: st,
+				fill: ct,
 				fontSize: 13,
 				fontWeight: "bold",
 				children: "★"
@@ -3592,7 +3596,7 @@ function ft({ x: e, y: t, label: n, isSelected: r, isFixed: i, nodeR: a = Xe, on
 		]
 	});
 }
-function pt({ label: e, color: t, symbol: n, isSelected: r, onClick: i, onHover: a, onPointerDown: o }) {
+function mt({ label: e, color: t, symbol: n, isSelected: r, onClick: i, onHover: a, onPointerDown: o }) {
 	return /* @__PURE__ */ p("g", {
 		onClick: (e) => {
 			e.stopPropagation(), i();
@@ -3605,17 +3609,17 @@ function pt({ label: e, color: t, symbol: n, isSelected: r, onClick: i, onHover:
 			touchAction: "none"
 		},
 		children: [/* @__PURE__ */ f("rect", {
-			width: $e,
-			height: et,
+			width: et,
+			height: tt,
 			rx: 6,
 			fill: r ? "var(--node-fill-selected)" : "var(--node-fill)",
-			stroke: r ? st : t || "var(--node-stroke)",
+			stroke: r ? ct : t || "var(--node-stroke)",
 			strokeWidth: r ? 2.5 : 1.5
 		}), /* @__PURE__ */ f("foreignObject", {
 			x: 0,
 			y: 0,
-			width: $e,
-			height: et,
+			width: et,
+			height: tt,
 			style: {
 				pointerEvents: "none",
 				userSelect: "none"
@@ -3637,27 +3641,27 @@ function pt({ label: e, color: t, symbol: n, isSelected: r, onClick: i, onHover:
 		})]
 	});
 }
-var mt = "#f59e0b";
-function ht(e, t, n, r) {
+var ht = "#f59e0b";
+function gt(e, t, n, r) {
 	let i = 1 - r;
 	return {
 		x: i * i * e.x + 2 * i * r * t.x + r * r * n.x,
 		y: i * i * e.y + 2 * i * r * t.y + r * r * n.y
 	};
 }
-function gt(e, t, n) {
+function _t(e, t, n) {
 	let r = t.x - e.x, i = t.y - e.y, a = Math.sqrt(r * r + i * i) || 1, o = -i / a, s = r / a, c = {
 		x: (e.x + t.x) / 2 + o * 8,
 		y: (e.y + t.y) / 2 + s * 8
 	}, l = Infinity;
 	for (let r = 0; r <= 20; r++) {
-		let i = ht(e, c, t, r / 20);
+		let i = gt(e, c, t, r / 20);
 		l = Math.min(l, Math.hypot(i.x - n.x, i.y - n.y));
 	}
 	return l;
 }
-function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArrow: o, onBindArrow: s, onRemoveArrow: c, onReplaceGenArrows: d }) {
-	let { t: m } = Fe(), [h, g] = u(null), [_, v] = u(null), [y, b] = u(null), [x, C] = u(null), w = l(null), T = l(!1), E = l(null), D = l(null), O = l(!1), k = l(null), A = r, j = Math.max(220, A * 22), M = t / 2, N = n / 2 + 40, P = (e) => {
+function vt({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArrow: o, onBindArrow: s, onRemoveArrow: c, onReplaceGenArrows: d }) {
+	let { t: m } = Ie(), [h, g] = u(null), [_, v] = u(null), [y, b] = u(null), [x, S] = u(null), w = l(null), T = l(!1), E = l(null), D = l(null), O = l(!1), k = l(null), A = r, j = Math.max(220, A * 22), M = t / 2, N = n / 2 + 40, P = (e) => {
 		let t = e / A * 2 * Math.PI - Math.PI / 2;
 		return {
 			x: M + Math.cos(t) * j,
@@ -3692,14 +3696,14 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 		let r = null, a = 48;
 		i.forEach((e, t) => {
 			if (e.generatorId !== null) return;
-			let i = gt(P(e.from), P(e.to), n);
+			let i = _t(P(e.from), P(e.to), n);
 			i < a && (a = i, r = t);
 		}), k.current = r, b(r), v((e) => e && {
 			...e,
 			x: n.x,
 			y: n.y
 		});
-	}, z = () => {
+	}, ee = () => {
 		if (!E.current) return;
 		let e = k.current, t = O.current, n = E.current.symbol;
 		if (E.current = null, D.current = null, k.current = null, v(null), b(null), t && e !== null) {
@@ -3709,7 +3713,7 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 		window.setTimeout(() => {
 			O.current = !1;
 		}, 0);
-	}, ee = (e, t) => {
+	}, te = (e, t) => {
 		if (e.button !== 0 || w.current) return;
 		let n = e.currentTarget.ownerSVGElement;
 		if (!n) return;
@@ -3721,13 +3725,13 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 			snap: null,
 			justStarted: !0,
 			justPicked: !1
-		}, C({
+		}, S({
 			from: t,
 			x: r.x,
 			y: r.y,
 			snap: null
 		});
-	}, B = (e) => {
+	}, z = (e) => {
 		let t = w.current;
 		if (!t) return;
 		let n = e.currentTarget.ownerSVGElement;
@@ -3737,7 +3741,7 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 		let i = null;
 		for (let e = 0; e < A; e++) {
 			let t = P(e);
-			if (Math.hypot(r.x - t.x, r.y - t.y) < ct) {
+			if (Math.hypot(r.x - t.x, r.y - t.y) < lt) {
 				i = e;
 				break;
 			}
@@ -3745,19 +3749,19 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 		w.current = {
 			...t,
 			snap: i
-		}, C((e) => e && {
+		}, S((e) => e && {
 			...e,
 			x: r.x,
 			y: r.y,
 			snap: i
 		});
-	}, te = (e, t) => {
-		o(e, t, h), w.current = null, C(null);
-	}, ne = () => {
+	}, ne = (e, t) => {
+		o(e, t, h), w.current = null, S(null);
+	}, B = () => {
 		let e = w.current;
 		if (e) {
 			if (T.current) {
-				w.current = null, C(null), e.snap !== null && e.snap !== e.from && o(e.from, e.snap, h);
+				w.current = null, S(null), e.snap !== null && e.snap !== e.from && o(e.from, e.snap, h);
 				return;
 			}
 			e.justStarted && (w.current = {
@@ -3766,12 +3770,12 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 				justPicked: !0
 			});
 		}
-	}, V = e.generators.length, H = N - (V - 1) / 2 * nt, U = e.generators.map((e, t) => /* @__PURE__ */ f("g", {
-		transform: `translate(60, ${H + t * nt})`,
+	}, V = e.generators.length, re = N - (V - 1) / 2 * rt, H = e.generators.map((e, t) => /* @__PURE__ */ f("g", {
+		transform: `translate(60, ${re + t * rt})`,
 		onPointerMove: R,
-		onPointerUp: z,
-		children: /* @__PURE__ */ f(pt, {
-			label: Z(Y(e.symbol)),
+		onPointerUp: ee,
+		children: /* @__PURE__ */ f(mt, {
+			label: Q(X(e.symbol)),
 			color: e.color,
 			symbol: e.symbol,
 			isSelected: h === e.symbol,
@@ -3780,22 +3784,22 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 			},
 			onPointerDown: L
 		})
-	}, `genchip-${t}`)), re = /* @__PURE__ */ new Map(), W = /* @__PURE__ */ new Map();
+	}, `genchip-${t}`)), ie = /* @__PURE__ */ new Map(), U = /* @__PURE__ */ new Map();
 	i.forEach((e, t) => {
 		if (e.from === e.to) return;
-		let n = `${Math.min(e.from, e.to)}|${Math.max(e.from, e.to)}`, r = e.from < e.to ? `${n}f` : `${n}b`, i = re.get(r) ?? 0;
-		re.set(r, i + 1), W.set(t, i);
+		let n = `${Math.min(e.from, e.to)}|${Math.max(e.from, e.to)}`, r = e.from < e.to ? `${n}f` : `${n}b`, i = ie.get(r) ?? 0;
+		ie.set(r, i + 1), U.set(t, i);
 	});
-	let ie = /* @__PURE__ */ new Map();
+	let W = /* @__PURE__ */ new Map();
 	i.forEach((e, t) => {
 		if (e.from !== e.to) return;
-		let n = ie.get(e.from);
-		n ? n.push(t) : ie.set(e.from, [t]);
+		let n = W.get(e.from);
+		n ? n.push(t) : W.set(e.from, [t]);
 	});
 	let G = /* @__PURE__ */ new Map();
-	ie.forEach((e) => e.forEach((e, t) => G.set(e, t)));
+	W.forEach((e) => e.forEach((e, t) => G.set(e, t)));
 	let K = i.map((e, t) => {
-		let n = P(e.from), r = P(e.to), i = e.generatorId === null, a = e.generatorId === null ? mt : F(e.generatorId), o = () => {
+		let n = P(e.from), r = P(e.to), i = e.generatorId === null, a = e.generatorId === null ? ht : F(e.generatorId), o = () => {
 			O.current || (i ? h ? s(e.from, e.to, h) : c(e.from, null, e.to) : c(e.from, e.generatorId));
 		};
 		if (e.from === e.to) {
@@ -3832,8 +3836,8 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 				]
 			}, `loop-${e.generatorId ?? "u"}-${e.from}`);
 		}
-		let l = 8 + (W.get(t) ?? 0) * 18;
-		return /* @__PURE__ */ f(dt, {
+		let l = 8 + (U.get(t) ?? 0) * 18;
+		return /* @__PURE__ */ f(ft, {
 			sx: n.x,
 			sy: n.y,
 			ex: r.x,
@@ -3848,10 +3852,10 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 			highlight: y === t,
 			onClick: o
 		}, `${e.from}-${t}`);
-	}), q = H + V * nt + 16, ae = S(h === null ? i.filter((e) => e.generatorId === null) : i.some((e) => e.generatorId === h) ? i.filter((e) => e.generatorId === h) : i.filter((e) => e.generatorId === null), A);
+	}), q = re + V * rt + 16, ae = C(h === null ? i.filter((e) => e.generatorId === null) : i.some((e) => e.generatorId === h) ? i.filter((e) => e.generatorId === h) : i.filter((e) => e.generatorId === null), A);
 	return /* @__PURE__ */ p("g", {
-		onPointerMove: B,
-		onPointerUp: ne,
+		onPointerMove: z,
+		onPointerUp: B,
 		children: [
 			/* @__PURE__ */ f("rect", {
 				x: 0,
@@ -3860,10 +3864,10 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 				height: n,
 				fill: "transparent",
 				onClick: () => {
-					w.current = null, C(null);
+					w.current = null, S(null);
 				}
 			}),
-			U,
+			H,
 			ae.length > 0 && /* @__PURE__ */ f("foreignObject", {
 				x: 0,
 				y: 24,
@@ -3923,19 +3927,19 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 				children: m("action.genSelectHint")
 			}),
 			K,
-			x && /* @__PURE__ */ f(dt, {
+			x && /* @__PURE__ */ f(ft, {
 				sx: P(x.from).x,
 				sy: P(x.from).y,
 				ex: x.snap === null ? x.x : P(x.snap).x,
 				ey: x.snap === null ? x.y : P(x.snap).y,
-				color: st,
+				color: ct,
 				width: 3,
 				headSize: 13,
 				nodeR: 20,
 				dashed: !0,
 				opacity: .9
 			}),
-			Array.from({ length: A }, (e, t) => /* @__PURE__ */ f(ft, {
+			Array.from({ length: A }, (e, t) => /* @__PURE__ */ f(pt, {
 				x: P(t).x,
 				y: P(t).y,
 				label: "",
@@ -3944,7 +3948,7 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 				isFixed: !1,
 				nodeR: 20,
 				testId: `action-edit-node-${t + 1}`,
-				onPointerDown: (e) => ee(e, t),
+				onPointerDown: (e) => te(e, t),
 				onClick: () => {
 					let e = w.current;
 					if (e) {
@@ -3955,7 +3959,7 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 							};
 							return;
 						}
-						te(e.from, t);
+						ne(e.from, t);
 					}
 				}
 			}, t)),
@@ -3965,10 +3969,10 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 				style: { pointerEvents: "none" },
 				children: [
 					/* @__PURE__ */ f("rect", {
-						x: -$e / 2,
-						y: -et / 2,
-						width: $e,
-						height: et,
+						x: -et / 2,
+						y: -tt / 2,
+						width: et,
+						height: tt,
 						rx: 6,
 						fill: F(_.symbol),
 						fillOpacity: .35,
@@ -3987,9 +3991,9 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 					}),
 					/* @__PURE__ */ f("text", {
 						x: 0,
-						y: et / 2 + 16,
+						y: tt / 2 + 16,
 						textAnchor: "middle",
-						fill: st,
+						fill: ct,
 						fontSize: 13,
 						style: { pointerEvents: "none" },
 						children: m("action.dropHint")
@@ -4015,24 +4019,24 @@ function _t({ group: e, vw: t, vh: n, setSize: r, arrows: i, error: a, onAddArro
 		]
 	});
 }
-function vt(e, t = !0) {
-	let n = e.orbits.map((e) => 2 * (lt(e.elements.length) + Xe + Ze)), r = n.reduce((e, t) => e + t, 0) + Qe * Math.max(0, e.orbits.length - 1), i = 0;
+function yt(e, t = !0) {
+	let n = e.orbits.map((e) => 2 * (ut(e.elements.length) + Ze + Qe)), r = n.reduce((e, t) => e + t, 0) + $e * Math.max(0, e.orbits.length - 1), i = 0;
 	t && e.orbits.forEach((e) => {
 		let t = e.elements.length;
-		i += at + Math.ceil(t / rt) * nt + 2 * it + ot;
+		i += ot + Math.ceil(t / it) * rt + 2 * at + st;
 	});
-	let a = t ? i - ot : 0, o = (t ? 12 : 42) + a + 30, s = Math.max(0, ...n), c = o + 60 + s + 60, l = Math.max(r + 2 * Qe, 320);
+	let a = t ? i - st : 0, o = (t ? 12 : 42) + a + 30, s = Math.max(0, ...n), c = o + 60 + s + 60, l = Math.max(r + 2 * $e, 320);
 	return {
 		width: Math.ceil(l),
 		height: Math.ceil(c)
 	};
 }
-function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedElementChange: i, hoveredElement: a, onHoverElementChange: o, onSetElementSelect: s, showLabels: l, onHover: u, legendHover: m, onLegendHover: h, viewBoxOverride: g, canvasTransform: _, viewBoxSize: v }) {
-	let { t: y } = Fe(), b = g?.width ?? v.width, x = g?.height ?? v.height, { n: S, perms: C, orbits: T, orbitOf: E } = t, D = c(() => new Set(w(C, S)), [C, S]), O = n === "conjugation", k = O || n === "regular", A = !!a, j = Math.min(v.width / Math.max(b, 1), v.height / Math.max(x, 1)), M = (v.width - b * j) / 2, N = (v.height - x * j) / 2, P = (e) => ({
+function bt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedElementChange: i, hoveredElement: a, onHoverElementChange: o, onSetElementSelect: s, showLabels: l, onHover: u, legendHover: m, onLegendHover: h, viewBoxOverride: g, canvasTransform: _, viewBoxSize: v }) {
+	let { t: y } = Ie(), b = g?.width ?? v.width, x = g?.height ?? v.height, { n: S, perms: C, orbits: w, orbitOf: E } = t, D = c(() => new Set(T(C, S)), [C, S]), O = n === "conjugation", k = O || n === "regular", A = !!a, j = Math.min(v.width / Math.max(b, 1), v.height / Math.max(x, 1)), M = (v.width - b * j) / 2, N = (v.height - x * j) / 2, P = (e) => ({
 		x: (e.x * _.scale + _.x) * j + M,
 		y: (e.y * _.scale + _.y) * j + N
-	}), F = T.map((e) => 2 * (lt(e.elements.length) + Xe + Ze)), I = F.reduce((e, t) => e + t, 0) + Qe * (T.length - 1), L = T.map((e) => 2 * (lt(e.elements.length) + Xe + Ze)), R = Math.max(0, ...L), z = b - 40 - e.generators.length * 110, ee = e.generators.map((e, t) => /* @__PURE__ */ p("g", {
-		transform: `translate(${z + t * 110}, 0)`,
+	}), F = w.map((e) => 2 * (ut(e.elements.length) + Ze + Qe)), I = F.reduce((e, t) => e + t, 0) + $e * (w.length - 1), L = w.map((e) => 2 * (ut(e.elements.length) + Ze + Qe)), R = Math.max(0, ...L), ee = b - 40 - e.generators.length * 110, te = e.generators.map((e, t) => /* @__PURE__ */ p("g", {
+		transform: `translate(${ee + t * 110}, 0)`,
 		onMouseEnter: () => h(e.symbol),
 		onMouseLeave: () => h(null),
 		style: { cursor: "pointer" },
@@ -4048,25 +4052,25 @@ function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedE
 			fontSize: 14,
 			children: e.symbol
 		})]
-	}, `legend-${t}`)), B = [], te = [];
-	T.forEach((e) => {
-		let t = e.elements.length, n = Math.min(rt, t);
-		B.push(n * $e + (n - 1) * tt + 2 * it), te.push(at + Math.ceil(t / rt) * nt + 2 * it);
+	}, `legend-${t}`)), z = [], ne = [];
+	w.forEach((e) => {
+		let t = e.elements.length, n = Math.min(it, t);
+		z.push(n * et + (n - 1) * nt + 2 * at), ne.push(ot + Math.ceil(t / it) * rt + 2 * at);
 	});
-	let ne = 0, V = T.map((e, t) => {
-		let n = ne;
-		return ne += te[t] + ot, n;
-	}), H = l ? ne - ot : 0, U = (l ? 12 : 42) + H + 30, re = U + 60 + R, W = Math.max(30, (x - re) / 2), ie = [], G = Math.max(0, (b - I) / 2);
-	for (let e = 0; e < T.length; e++) {
-		let t = lt(T[e].elements.length);
-		ie.push({
+	let B = 0, V = w.map((e, t) => {
+		let n = B;
+		return B += ne[t] + st, n;
+	}), re = l ? B - st : 0, H = (l ? 12 : 42) + re + 30, ie = H + 60 + R, U = Math.max(30, (x - ie) / 2), W = [], G = Math.max(0, (b - I) / 2);
+	for (let e = 0; e < w.length; e++) {
+		let t = ut(w[e].elements.length);
+		W.push({
 			x: G + F[e] / 2,
-			y: W + U + 60 + R / 2,
+			y: U + H + 60 + R / 2,
 			r: t
-		}), G += F[e] + Qe;
+		}), G += F[e] + $e;
 	}
 	let K = (e) => {
-		let t = E[e], n = ie[t], r = T[t].elements.indexOf(e) / T[t].elements.length * 2 * Math.PI - Math.PI / 2;
+		let t = E[e], n = W[t], r = w[t].elements.indexOf(e) / w[t].elements.length * 2 * Math.PI - Math.PI / 2;
 		return {
 			x: n.x + Math.cos(r) * n.r,
 			y: n.y + Math.sin(r) * n.r
@@ -4092,11 +4096,11 @@ function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedE
 	}
 	let se = [];
 	for (let { key: t, rec: n } of oe) {
-		let { x: r, y: i, gi: a } = n, o = e.generators[a], s = ae.get(t), c = s.indexOf(n), l = s.length, u = K(r), d = K(i), p = Math.sqrt((d.x - u.x) ** 2 + (d.y - u.y) ** 2) || 1, h = Math.max(10, Math.min(16, p * .06)), g = (c - (l - 1) / 2) * h, _ = ie[E[r]], v = K(s[0].x), y = Math.atan2(v.y - _.y, v.x - _.x), b = {
+		let { x: r, y: i, gi: a } = n, o = e.generators[a], s = ae.get(t), c = s.indexOf(n), l = s.length, u = K(r), d = K(i), p = Math.sqrt((d.x - u.x) ** 2 + (d.y - u.y) ** 2) || 1, h = Math.max(10, Math.min(16, p * .06)), g = (c - (l - 1) / 2) * h, _ = W[E[r]], v = K(s[0].x), y = Math.atan2(v.y - _.y, v.x - _.x), b = {
 			x: -Math.sin(y),
 			y: Math.cos(y)
 		}, x = m !== null && m === o.symbol, S = A || m !== null && !x;
-		se.push(/* @__PURE__ */ f(dt, {
+		se.push(/* @__PURE__ */ f(ft, {
 			sx: u.x,
 			sy: u.y,
 			ex: d.x,
@@ -4104,7 +4108,7 @@ function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedE
 			color: S ? "var(--node-stroke)" : o.color || "var(--node-stroke)",
 			width: S ? 1.2 : x ? 3.4 : 3,
 			headSize: 18,
-			nodeR: Xe,
+			nodeR: Ze,
 			offset: g,
 			tFrom: b,
 			dashed: S,
@@ -4118,35 +4122,35 @@ function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedE
 			let t = K(e);
 			ce.push(/* @__PURE__ */ f("circle", {
 				cx: t.x,
-				cy: t.y - Xe - 6,
+				cy: t.y - Ze - 6,
 				r: 5,
 				fill: "none",
-				stroke: st,
+				stroke: ct,
 				strokeWidth: 1.5
 			}, `loop-${e}`));
 			continue;
 		}
 		let n = K(e), r = K(t);
-		ce.push(/* @__PURE__ */ f(dt, {
+		ce.push(/* @__PURE__ */ f(ft, {
 			sx: n.x,
 			sy: n.y,
 			ex: r.x,
 			ey: r.y,
-			color: st,
+			color: ct,
 			width: 3,
 			headSize: 18,
-			nodeR: Xe,
+			nodeR: Ze,
 			opacity: .95,
 			dir: e < t ? 1 : -1
 		}, `h-${e}`));
 	}
-	let J = r === null ? -1 : E[r], le = [];
-	return T.forEach((n, c) => {
-		let l = (b - B[c]) / 2, u = W + 12 + V[c], d = n.elements.map((n, c) => {
-			let l = Math.floor(c / rt), u = c % rt, d = k ? e.elements[n] : null, p = d ? Z(Y(d.label)) : t.setLabels?.[n] ? Z(Y(t.setLabels[n])) : String(n + 1);
+	let le = r === null ? -1 : E[r], J = [];
+	return w.forEach((n, c) => {
+		let l = (b - z[c]) / 2, u = U + 12 + V[c], d = n.elements.map((n, c) => {
+			let l = Math.floor(c / it), u = c % it, d = k ? e.elements[n] : null, p = d ? Q(X(d.label)) : t.setLabels?.[n] ? Q(X(t.setLabels[n])) : String(n + 1);
 			return /* @__PURE__ */ f("g", {
-				transform: `translate(${it + u * ($e + tt)}, ${at + it + l * nt})`,
-				children: /* @__PURE__ */ f(pt, {
+				transform: `translate(${at + u * (et + nt)}, ${ot + at + l * rt})`,
+				children: /* @__PURE__ */ f(mt, {
 					label: p,
 					isSelected: d ? a === d.id : r === n,
 					onClick: d ? () => s?.(d.id) : () => {
@@ -4157,12 +4161,12 @@ function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedE
 				})
 			}, d ? d.id : `s-${n}`);
 		});
-		le.push(/* @__PURE__ */ p("g", {
+		J.push(/* @__PURE__ */ p("g", {
 			transform: `translate(${l}, ${u})`,
 			children: [
 				/* @__PURE__ */ f("rect", {
-					width: B[c],
-					height: te[c],
+					width: z[c],
+					height: ne[c],
 					rx: 8,
 					fill: "var(--node-fill)",
 					fillOpacity: .15,
@@ -4171,8 +4175,8 @@ function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedE
 					strokeDasharray: "3 3"
 				}),
 				/* @__PURE__ */ f("text", {
-					x: it + 2,
-					y: at - 4,
+					x: at + 2,
+					y: ot - 4,
 					fill: "var(--text-secondary)",
 					fontSize: 13,
 					children: y("action.orbitGroup", { size: String(n.elements.length) })
@@ -4181,26 +4185,26 @@ function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedE
 			]
 		}, `grp-${c}`));
 	}), /* @__PURE__ */ p(d, { children: [
-		ee,
-		l && le,
-		ie.map((e, t) => /* @__PURE__ */ f("circle", {
+		te,
+		l && J,
+		W.map((e, t) => /* @__PURE__ */ f("circle", {
 			cx: e.x,
 			cy: e.y,
-			r: e.r + Xe + 14,
+			r: e.r + Ze + 14,
 			fill: "none",
-			stroke: J === t ? st : "var(--node-stroke)",
-			strokeWidth: J === t ? 3 : 1,
-			strokeOpacity: J === t ? .9 : .25,
-			strokeDasharray: J === t ? void 0 : "4 6"
+			stroke: le === t ? ct : "var(--node-stroke)",
+			strokeWidth: le === t ? 3 : 1,
+			strokeOpacity: le === t ? .9 : .25,
+			strokeDasharray: le === t ? void 0 : "4 6"
 		}, `glow-${t}`)),
 		se,
 		ce,
 		Array.from({ length: S }, (n, a) => {
 			let s = K(a), c = k ? e.elements[a] : null, d = !!c && !!u;
-			return /* @__PURE__ */ f(ft, {
+			return /* @__PURE__ */ f(pt, {
 				x: s.x,
 				y: s.y,
-				label: l && k ? Z(Y(e.elements[a].label)) : l && t.setLabels?.[a] ? Z(Y(t.setLabels[a])) : "",
+				label: l && k ? Q(X(e.elements[a].label)) : l && t.setLabels?.[a] ? Q(X(t.setLabels[a])) : "",
 				showNumber: k || t.setLabels ? void 0 : a + 1,
 				isSelected: r === a,
 				isFixed: D.has(a),
@@ -4216,25 +4220,25 @@ function yt({ group: e, computation: t, kind: n, selectedElement: r, onSelectedE
 		})
 	] });
 }
-function bt(e) {
-	return /* @__PURE__ */ f(le, {
+function xt(e) {
+	return /* @__PURE__ */ f(Y, {
 		theme: e.theme,
-		children: /* @__PURE__ */ f(Ct, { ...e })
+		children: /* @__PURE__ */ f(wt, { ...e })
 	});
 }
-var xt = {
+var St = {
 	x: 0,
 	y: 0,
 	scale: 1
-}, St = {
+}, Ct = {
 	width: 2e3,
 	height: 2e3
 };
-function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = null, arrows: a = [], error: o = null, onAddArrow: s, onBindArrow: c, onRemoveArrow: l, onReplaceGenArrows: m, selectedElement: h = null, onSelectedElementChange: g, hoveredElement: _ = null, onHoverElementChange: v, onSetElementSelect: y, showLabels: b = !0, onHover: x, canvasTransform: S = xt, viewBoxSize: C = St, prime: w = null }) {
-	let { t: T } = Fe(), [E, D] = u(null), O = t === "conjugation", k = O || t === "regular", A = _ ? e.elements.find((e) => e.id === _) ?? null : null, j = !!n && !r, M = !!x, N = M ? O ? "g·x = g·x·g⁻¹" : t === "regular" ? "g·x = g·x" : "" : O ? T("action.viewTitle.conjugation") : t === "sylow" ? T("action.viewTitle.sylow", { p: w ?? "" }) : T(t === "regular" ? "action.viewTitle.regular" : t === "coset" ? "action.viewTitle.coset" : "action.viewTitle.custom"), P = A ? T("action.hoverElEdges", { el: A.label }) : E ? T("action.hoverGenEdges", { gen: E }) : T(h === null ? "action.edgeBlurb" : "action.selHint"), F = A || E ? st : "var(--text-secondary)", I = n && !r ? vt(n, b) : null, L = Math.max(220, (i ?? 1) * 22), R = Math.max(900, 2 * L + 520), z = r ? {
+function wt({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = null, arrows: a = [], error: o = null, onAddArrow: s, onBindArrow: c, onRemoveArrow: l, onReplaceGenArrows: m, selectedElement: h = null, onSelectedElementChange: g, hoveredElement: _ = null, onHoverElementChange: v, onSetElementSelect: y, showLabels: b = !0, onHover: x, canvasTransform: S = St, viewBoxSize: C = Ct, prime: w = null }) {
+	let { t: T } = Ie(), [E, D] = u(null), O = t === "conjugation", k = O || t === "regular", A = _ ? e.elements.find((e) => e.id === _) ?? null : null, j = !!n && !r, M = !!x, N = M ? O ? "g·x = g·x·g⁻¹" : t === "regular" ? "g·x = g·x" : "" : O ? T("action.viewTitle.conjugation") : t === "sylow" ? T("action.viewTitle.sylow", { p: w ?? "" }) : T(t === "regular" ? "action.viewTitle.regular" : t === "coset" ? "action.viewTitle.coset" : "action.viewTitle.custom"), P = A ? T("action.hoverElEdges", { el: A.label }) : E ? T("action.hoverGenEdges", { gen: E }) : T(h === null ? "action.edgeBlurb" : "action.selHint"), F = A || E ? ct : "var(--text-secondary)", I = n && !r ? yt(n, b) : null, L = Math.max(220, (i ?? 1) * 22), R = Math.max(900, 2 * L + 520), ee = r ? {
 		width: 1200,
 		height: R
-	} : I ?? C, ee = n && h !== null ? (n.stabilizers.get(h) ?? []).map((t) => e.elements.find((e) => e.id === t)).filter((e) => !!e) : [], B = n && h !== null ? k ? Z(Y(e.elements[h]?.label ?? "")) : n.setLabels?.[h] ? Z(Y(n.setLabels[h])) : String(h + 1) : "", te = !!n && !r && h !== null && ee.length > 0;
+	} : I ?? C, te = n && h !== null ? (n.stabilizers.get(h) ?? []).map((t) => e.elements.find((e) => e.id === t)).filter((e) => !!e) : [], z = n && h !== null ? k ? Q(X(e.elements[h]?.label ?? "")) : n.setLabels?.[h] ? Q(X(n.setLabels[h])) : String(h + 1) : "", ne = !!n && !r && h !== null && te.length > 0;
 	return /* @__PURE__ */ p(d, { children: [
 		j && N !== "" && /* @__PURE__ */ p("div", {
 			style: {
@@ -4269,7 +4273,7 @@ function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = n
 			})]
 		}),
 		/* @__PURE__ */ p("svg", {
-			viewBox: `0 0 ${z.width} ${z.height}`,
+			viewBox: `0 0 ${ee.width} ${ee.height}`,
 			className: "view-svg",
 			style: { userSelect: "none" },
 			children: [/* @__PURE__ */ f("defs", { children: /* @__PURE__ */ f("filter", {
@@ -4287,7 +4291,7 @@ function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = n
 				})
 			}) }), /* @__PURE__ */ f("g", {
 				transform: r ? void 0 : `translate(${S.x}, ${S.y}) scale(${S.scale})`,
-				children: r ? /* @__PURE__ */ f(_t, {
+				children: r ? /* @__PURE__ */ f(vt, {
 					group: e,
 					vw: 1200,
 					vh: R,
@@ -4298,7 +4302,7 @@ function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = n
 					onBindArrow: c ?? (() => {}),
 					onRemoveArrow: l ?? (() => {}),
 					onReplaceGenArrows: m ?? (() => {})
-				}) : n ? /* @__PURE__ */ f(yt, {
+				}) : n ? /* @__PURE__ */ f(bt, {
 					group: e,
 					computation: n,
 					kind: t,
@@ -4324,7 +4328,7 @@ function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = n
 				})
 			})]
 		}),
-		te && /* @__PURE__ */ p("div", {
+		ne && /* @__PURE__ */ p("div", {
 			style: {
 				position: "absolute",
 				bottom: 8,
@@ -4352,14 +4356,14 @@ function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = n
 						color: "var(--text-primary)"
 					},
 					children: [
-						/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: T("action.stabilizerFor", { el: B }) } }),
+						/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: T("action.stabilizerFor", { el: z }) } }),
 						" ",
 						/* @__PURE__ */ p("span", {
 							style: {
 								color: "var(--text-secondary)",
 								fontWeight: 400
 							},
-							children: ["|G_x| = ", ee.length]
+							children: ["|G_x| = ", te.length]
 						})
 					]
 				}), /* @__PURE__ */ f("button", {
@@ -4386,7 +4390,7 @@ function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = n
 					maxHeight: 160,
 					overflowY: "auto"
 				},
-				children: ee.map((e) => /* @__PURE__ */ f("span", {
+				children: te.map((e) => /* @__PURE__ */ f("span", {
 					style: {
 						padding: "2px 8px",
 						borderRadius: 10,
@@ -4396,7 +4400,7 @@ function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = n
 						color: "var(--text-primary)",
 						whiteSpace: "nowrap"
 					},
-					dangerouslySetInnerHTML: { __html: Z(Y(e.label)) }
+					dangerouslySetInnerHTML: { __html: Q(X(e.label)) }
 				}, e.id))
 			})]
 		})
@@ -4404,7 +4408,7 @@ function Ct({ group: e, kind: t, computation: n, editing: r = !1, setSize: i = n
 }
 //#endregion
 //#region src/components/Canvas/HomomorphismScene.tsx
-var wt = [
+var Tt = [
 	"#4ecdc4",
 	"#a78bfa",
 	"#ffd93d",
@@ -4420,12 +4424,12 @@ var wt = [
 	"#22c55e",
 	"#a855f7",
 	"#06b6d4"
-], Tt = "#ff6b6b", Et = "#4ecdc4";
-function Dt(e, t, n, r) {
+], Et = "#ff6b6b", Dt = "#4ecdc4";
+function Ot(e, t, n, r) {
 	let i = Math.abs(n - e) * .3;
 	return `M ${e} ${t} C ${e + i} ${t}, ${n - i} ${r}, ${n} ${r}`;
 }
-function Ot(e) {
+function kt(e) {
 	let t = [];
 	for (let n of e.generators) {
 		let r = e.elements.find((e) => e.label === n.symbol || e.label === n.name);
@@ -4437,19 +4441,19 @@ function Ot(e) {
 	}
 	return t;
 }
-function kt(e) {
-	return /* @__PURE__ */ f(le, {
+function At(e) {
+	return /* @__PURE__ */ f(Y, {
 		theme: e.theme,
-		children: /* @__PURE__ */ f(At, { ...e })
+		children: /* @__PURE__ */ f(jt, { ...e })
 	});
 }
-function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode: o = !1, onTheoremModeChange: s, theoremAnimation: m, showLabels: g = !0, onHover: _ }) {
-	let { t: v } = Fe(), b = l(null), [S, C] = u(null), [w, T] = u(null), [E, D] = u(null), O = c(() => i === void 0 ? !e || !t || n.size === 0 ? null : K(e, t, n) : i, [
+function jt({ source: e, target: t, mapping: n, result: i, name: a, theoremMode: o = !1, onTheoremModeChange: s, theoremAnimation: m, showLabels: g = !0, onHover: _ }) {
+	let { t: v } = Ie(), b = l(null), [x, C] = u(null), [w, T] = u(null), [E, D] = u(null), O = c(() => i === void 0 ? !e || !t || n.size === 0 ? null : q(e, t, n) : i, [
 		e,
 		t,
 		n,
 		i
-	]), k = O?.kernel || [], A = O?.image || [], j = O?.isHomomorphism ? L(e, t, O) : null, M = new Set(k), N = new Set(A), P = E || S, F = P ? n.get(P) : w, I = c(() => {
+	]), k = O?.kernel || [], A = O?.image || [], j = O?.isHomomorphism ? R(e, t, O) : null, M = new Set(k), N = new Set(A), P = E || x, F = P ? n.get(P) : w, I = c(() => {
 		if (!F || P) return /* @__PURE__ */ new Set();
 		let e = /* @__PURE__ */ new Set();
 		return n.forEach((t, n) => {
@@ -4459,20 +4463,20 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 		F,
 		P,
 		n
-	]), R = r((e) => {
+	]), L = r((e) => {
 		D((t) => t === e ? null : e);
-	}, []), z = c(() => {
+	}, []), ee = c(() => {
 		if (!e) return [];
-		let t = Ot(e);
-		return t.length === 0 ? [] : x(e, t.map((e, t) => ({
+		let t = kt(e);
+		return t.length === 0 ? [] : S(e, t.map((e, t) => ({
 			elementId: e.id,
 			enabled: !0,
 			color: h[t % h.length]
 		})), "right");
-	}, [e]), ee = c(() => {
+	}, [e]), te = c(() => {
 		if (!t) return [];
-		let e = Ot(t);
-		return e.length === 0 ? [] : x(t, e.map((e, t) => ({
+		let e = kt(t);
+		return e.length === 0 ? [] : S(t, e.map((e, t) => ({
 			elementId: e.id,
 			enabled: !0,
 			color: h[t % h.length]
@@ -4520,8 +4524,8 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 			children: m
 		})]
 	});
-	let B = Math.min(140, Math.max(65, e.order * 4.5)), te = Math.min(140, Math.max(65, t.order * 4.5)), ne = y(e, 170, 240, B), V = y(t, 630, 240, te);
-	function H(e, t, n, r, i, a = 1.5, o = .5, s = !1, c = !1, l = 0) {
+	let z = Math.min(140, Math.max(65, e.order * 4.5)), ne = Math.min(140, Math.max(65, t.order * 4.5)), B = y(e, 170, 240, z), V = y(t, 630, 240, ne);
+	function re(e, t, n, r, i, a = 1.5, o = .5, s = !1, c = !1, l = 0) {
 		let u = e.get(t), d = e.get(n);
 		if (!u || !d || s) return null;
 		let p = d.x - u.x, m = d.y - u.y, h = Math.sqrt(p * p + m * m);
@@ -4544,7 +4548,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 			opacity: o
 		}, i);
 	}
-	function U(e) {
+	function H(e) {
 		let t = /* @__PURE__ */ new Map();
 		e.forEach((e, n) => {
 			let r = [e.fromId, e.toId].sort(), i = `${r[0]}|${r[1]}`, a = t.get(i);
@@ -4559,16 +4563,16 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 			});
 		}), n;
 	}
-	let re = [];
+	let ie = [];
 	return n.forEach((e, n) => {
-		let r = ne.get(n), i = V.get(e);
+		let r = B.get(n), i = V.get(e);
 		if (!r || !i) return;
-		let a = M.has(n), o = t.elements.findIndex((t) => t.id === e), s = a ? Tt : wt[o >= 0 ? o % wt.length : 0], c = P === n || F === e;
-		re.push({
+		let a = M.has(n), o = t.elements.findIndex((t) => t.id === e), s = a ? Et : Tt[o >= 0 ? o % Tt.length : 0], c = P === n || F === e;
+		ie.push({
 			srcId: n,
 			tgtId: e,
 			color: s,
-			pathD: Dt(r.x, r.y, i.x, i.y),
+			pathD: Ot(r.x, r.y, i.x, i.y),
 			isKernel: a,
 			isHighlighted: !!c
 		});
@@ -4603,7 +4607,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 						color: "var(--text-primary)",
 						lineHeight: "28px"
 					},
-					dangerouslySetInnerHTML: { __html: Z(Y(a || `${e.symbol} → ${t.symbol}`)) }
+					dangerouslySetInnerHTML: { __html: Q(X(a || `${e.symbol} → ${t.symbol}`)) }
 				})
 			}),
 			/* @__PURE__ */ f("foreignObject", {
@@ -4619,7 +4623,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 						color: "var(--text-primary)",
 						lineHeight: "22px"
 					},
-					dangerouslySetInnerHTML: { __html: `${Z(Y(e.symbol))} <span style="color:var(--text-muted);font-weight:400">(|G|=${e.order})</span>` }
+					dangerouslySetInnerHTML: { __html: `${Q(X(e.symbol))} <span style="color:var(--text-muted);font-weight:400">(|G|=${e.order})</span>` }
 				})
 			}),
 			/* @__PURE__ */ f("foreignObject", {
@@ -4635,25 +4639,25 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 						color: "var(--text-primary)",
 						lineHeight: "22px"
 					},
-					dangerouslySetInnerHTML: { __html: `${Z(Y(t.symbol))} <span style="color:var(--text-muted);font-weight:400">(|H|=${t.order})</span>` }
+					dangerouslySetInnerHTML: { __html: `${Q(X(t.symbol))} <span style="color:var(--text-muted);font-weight:400">(|H|=${t.order})</span>` }
 				})
 			}),
 			(() => {
-				let e = U(z);
-				return z.map((t, n) => H(ne, t.fromId, t.toId, t.color, `gce-${n}`, 1.8, .7, t.isSelfLoop, t.isBidirectional, e[n]));
+				let e = H(ee);
+				return ee.map((t, n) => re(B, t.fromId, t.toId, t.color, `gce-${n}`, 1.8, .7, t.isSelfLoop, t.isBidirectional, e[n]));
 			})(),
 			(() => {
-				let e = U(ee);
-				return ee.map((t, n) => H(V, t.fromId, t.toId, t.color, `hce-${n}`, 1.4, .65, t.isSelfLoop, t.isBidirectional, e[n]));
+				let e = H(te);
+				return te.map((t, n) => re(V, t.fromId, t.toId, t.color, `hce-${n}`, 1.4, .65, t.isSelfLoop, t.isBidirectional, e[n]));
 			})(),
-			re.filter((e) => !e.isHighlighted).map((e, t) => /* @__PURE__ */ f("path", {
+			ie.filter((e) => !e.isHighlighted).map((e, t) => /* @__PURE__ */ f("path", {
 				d: e.pathD,
 				stroke: e.color,
 				strokeWidth: e.isKernel ? 2 : 1,
 				strokeOpacity: e.isKernel ? .45 : .28,
 				fill: "none"
 			}, `nl-${t}`)),
-			re.filter((e) => e.isHighlighted).map((e, t) => /* @__PURE__ */ f("path", {
+			ie.filter((e) => e.isHighlighted).map((e, t) => /* @__PURE__ */ f("path", {
 				d: e.pathD,
 				stroke: e.color,
 				strokeWidth: 2.5,
@@ -4662,13 +4666,13 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 				style: { filter: "drop-shadow(0 0 4px currentColor)" }
 			}, `hl-${t}`)),
 			e.elements.map((e) => {
-				let r = ne.get(e.id);
+				let r = B.get(e.id);
 				if (!r) return null;
 				let i = M.has(e.id), a = n.has(e.id), o = P === e.id || I.has(e.id), s = E === e.id, c = P && !o, l = "var(--node-fill)";
-				if (i) l = Tt;
+				if (i) l = Et;
 				else if (a) {
 					let r = n.get(e.id), i = t.elements.findIndex((e) => e.id === r);
-					i >= 0 && (l = wt[i % wt.length]);
+					i >= 0 && (l = Tt[i % Tt.length]);
 				}
 				return /* @__PURE__ */ p("g", {
 					"data-homo-source-node": !0,
@@ -4683,7 +4687,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 					onMouseLeave: () => {
 						C(null), _?.(null, null);
 					},
-					onClick: () => R(e.id),
+					onClick: () => L(e.id),
 					style: { cursor: "pointer" },
 					children: [
 						o && /* @__PURE__ */ f("circle", {
@@ -4691,7 +4695,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 							cy: r.y,
 							r: 18,
 							fill: "none",
-							stroke: i ? Tt : "var(--accent-teal)",
+							stroke: i ? Et : "var(--accent-teal)",
 							strokeWidth: 2,
 							opacity: .6,
 							style: { filter: "drop-shadow(0 0 6px currentColor)" }
@@ -4701,7 +4705,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 							cy: r.y,
 							r: a ? 13 : 8,
 							fill: l,
-							stroke: i ? Tt : "var(--border-color)",
+							stroke: i ? Et : "var(--border-color)",
 							strokeWidth: i ? 2 : 1,
 							opacity: c ? .3 : 1
 						}),
@@ -4724,11 +4728,11 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 								style: {
 									fontSize: "8px",
 									textAlign: "center",
-									color: i ? Tt : c ? "var(--text-muted)" : "var(--text-primary)",
+									color: i ? Et : c ? "var(--text-muted)" : "var(--text-primary)",
 									fontWeight: i || o ? 700 : 400,
 									pointerEvents: "none"
 								},
-								dangerouslySetInnerHTML: { __html: Z(e.label) }
+								dangerouslySetInnerHTML: { __html: Q(e.label) }
 							})
 						})
 					]
@@ -4758,7 +4762,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 							cy: t.y,
 							r: 18,
 							fill: "none",
-							stroke: Et,
+							stroke: Dt,
 							strokeWidth: 2,
 							opacity: .6,
 							style: { filter: "drop-shadow(0 0 8px currentColor)" }
@@ -4767,8 +4771,8 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 							cx: t.x,
 							cy: t.y,
 							r: n ? 13 : 8,
-							fill: n ? Et : "var(--node-fill)",
-							stroke: n ? Et : "var(--border-color)",
+							fill: n ? Dt : "var(--node-fill)",
+							stroke: n ? Dt : "var(--border-color)",
 							strokeWidth: n ? 2 : 1,
 							opacity: i ? .3 : 1
 						}),
@@ -4790,11 +4794,11 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 								style: {
 									fontSize: "8px",
 									textAlign: "center",
-									color: n ? Et : i ? "var(--text-muted)" : "var(--text-primary)",
+									color: n ? Dt : i ? "var(--text-muted)" : "var(--text-primary)",
 									fontWeight: n || r ? 700 : 400,
 									pointerEvents: "none"
 								},
-								dangerouslySetInnerHTML: { __html: Z(e.label) }
+								dangerouslySetInnerHTML: { __html: Q(e.label) }
 							})
 						})
 					]
@@ -4817,7 +4821,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 							y: 0,
 							textAnchor: "middle",
 							fontSize: "9",
-							fill: j.isInjective ? "var(--accent-teal)" : Tt,
+							fill: j.isInjective ? "var(--accent-teal)" : Et,
 							children: j.isInjective ? v("homo.injective") : v("homo.notInjective")
 						}),
 						/* @__PURE__ */ f("rect", {
@@ -4866,7 +4870,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 							y: 0,
 							textAnchor: "middle",
 							fontSize: "9",
-							fill: j.isSurjective ? "var(--accent-teal)" : Tt,
+							fill: j.isSurjective ? "var(--accent-teal)" : Et,
 							children: j.isSurjective ? v("homo.surjective") : v("homo.notSurjective")
 						}),
 						j.isIsomorphism && /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f("rect", {
@@ -4893,7 +4897,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 						y: 0,
 						textAnchor: "middle",
 						fontSize: "10",
-						fill: Tt,
+						fill: Et,
 						fontWeight: "bold",
 						children: ["✗ ", v("homo.invalid")]
 					}),
@@ -4913,7 +4917,7 @@ function At({ source: e, target: t, mapping: n, result: i, name: a, theoremMode:
 }
 //#endregion
 //#region src/components/Canvas/SymmetryViewScene.tsx
-function jt(e, t) {
+function Mt(e, t) {
 	let n = [], r = [];
 	for (let i = 0; i < e; i++) {
 		let a = 2 * Math.PI * i / e - Math.PI / 2;
@@ -4925,7 +4929,7 @@ function jt(e, t) {
 		directed: !0
 	};
 }
-function Mt(e, t) {
+function Nt(e, t) {
 	let n = [], r = [];
 	for (let i = 0; i < e; i++) {
 		let a = 2 * Math.PI * i / e - Math.PI / 2;
@@ -4936,7 +4940,7 @@ function Mt(e, t) {
 		edges: r
 	};
 }
-function Nt(e) {
+function Pt(e) {
 	let t = e / Math.sqrt(3), n = [
 		new J.Vector3(1, 1, 1).multiplyScalar(t),
 		new J.Vector3(1, -1, -1).multiplyScalar(t),
@@ -4949,7 +4953,7 @@ function Nt(e) {
 		edges: r
 	};
 }
-function Pt(e) {
+function Ft(e) {
 	let t = e / Math.sqrt(3), n = [-1, 1], r = [];
 	for (let e of n) for (let i of n) for (let a of n) r.push(new J.Vector3(e * t, i * t, a * t));
 	let i = [];
@@ -4963,7 +4967,7 @@ function Pt(e) {
 		edges: i
 	};
 }
-function Ft(e) {
+function It(e) {
 	let t = (1 + Math.sqrt(5)) / 2, n = [
 		[
 			0,
@@ -5032,8 +5036,8 @@ function Ft(e) {
 		edges: a
 	};
 }
-var It = /* @__PURE__ */ new Map();
-function Lt(e) {
+var Lt = /* @__PURE__ */ new Map();
+function Rt(e) {
 	let t = e * 1, n = e * .55;
 	return {
 		vertices: [
@@ -5050,7 +5054,7 @@ function Lt(e) {
 		]
 	};
 }
-function Rt(e) {
+function zt(e) {
 	let t = [
 		new J.Vector3(e, 0, 0),
 		new J.Vector3(-e, 0, 0),
@@ -5065,7 +5069,7 @@ function Rt(e) {
 		edges: n
 	};
 }
-function zt(e) {
+function Bt(e) {
 	let t = (1 + Math.sqrt(5)) / 2, n = 1 / t, r = t, i = [];
 	for (let e of [-1, 1]) for (let t of [-1, 1]) for (let n of [-1, 1]) i.push([
 		e * 1,
@@ -5094,11 +5098,11 @@ function zt(e) {
 		edges: l
 	};
 }
-function Bt(e, t) {
+function Vt(e, t) {
 	return `hsl(${e / t * 360}, 70%, 60%)`;
 }
-function Vt(e) {
-	let t = `${e.vertices.length}:${e.edges.map((e) => e.join("-")).join("|")}`, n = It.get(t);
+function Ht(e) {
+	let t = `${e.vertices.length}:${e.edges.map((e) => e.join("-")).join("|")}`, n = Lt.get(t);
 	if (n) return n;
 	let r = /* @__PURE__ */ new Map();
 	for (let t = 0; t < e.vertices.length; t++) r.set(t, []);
@@ -5128,9 +5132,9 @@ function Vt(e) {
 			}
 		}
 	}
-	return It.set(t, a), a;
+	return Lt.set(t, a), a;
 }
-function Ht(e) {
+function Ut(e) {
 	let t = e.vertices[0].length() / Math.sqrt(3);
 	return [
 		new J.Vector3(t, 0, 0),
@@ -5141,13 +5145,13 @@ function Ht(e) {
 		new J.Vector3(0, 0, -t)
 	];
 }
-function Ut(e, t) {
+function Wt(e, t) {
 	let n = [];
 	if (t.length > 0 && e.vertices.length <= 12) {
 		for (let [r, i, a] of t) n.push(e.vertices[r].clone().add(e.vertices[i]).add(e.vertices[a]).multiplyScalar(1 / 3));
 		return n;
 	}
-	if (e.vertices.length === 8) return Ht(e);
+	if (e.vertices.length === 8) return Ut(e);
 	if (e.vertices.length >= 20) {
 		let t = /* @__PURE__ */ new Map();
 		for (let n = 0; n < e.vertices.length; n++) t.set(n, /* @__PURE__ */ new Set());
@@ -5182,29 +5186,29 @@ function Ut(e, t) {
 	}
 	return [];
 }
-function Wt(e, t) {
-	return C(e, t);
+function Gt(e, t) {
+	return w(e, t);
 }
-function Gt({ group: e, symmetryType: t, dark: n = !1, variant: r = !1, showAction: i = !1, actionElementId: a = null, rotateSpeed: o = 1, showFigureTitle: s = !0, locked: l = !1, onHint: u, hintOnIdle: d = !0, replaySignal: m = 0, theme: h, lockCameraOnAction: g = !1, onAnimationEnd: _ }) {
-	let v = t ?? z(e), y = h ? h === "dark" : n, b = c(() => {
+function Kt({ group: e, symmetryType: t, dark: n = !1, variant: r = !1, showAction: i = !1, actionElementId: a = null, rotateSpeed: o = 1, showFigureTitle: s = !0, locked: l = !1, onHint: u, hintOnIdle: d = !0, replaySignal: m = 0, theme: h, lockCameraOnAction: g = !1, onAnimationEnd: _ }) {
+	let v = t ?? te(e), y = h ? h === "dark" : n, b = c(() => {
 		switch (v) {
-			case "cyclic": return jt(e.order, 4);
+			case "cyclic": return Mt(e.order, 4);
 			case "dihedral": {
 				let t = e.order / 2;
-				return Mt(Math.round(t), 4);
+				return Nt(Math.round(t), 4);
 			}
-			case "tetrahedron": return Nt(4);
-			case "cube": return r ? Rt(4) : Pt(4);
-			case "icosahedron": return r ? zt(4) : Ft(4);
-			case "rectangle": return Lt(4);
-			default: return jt(1, 4);
+			case "tetrahedron": return Pt(4);
+			case "cube": return r ? zt(4) : Ft(4);
+			case "icosahedron": return r ? Bt(4) : It(4);
+			case "rectangle": return Rt(4);
+			default: return Mt(1, 4);
 		}
 	}, [
 		e,
 		v,
 		r
 	]);
-	if (v === "unsupported") return /* @__PURE__ */ f(Xt, { group: e });
+	if (v === "unsupported") return /* @__PURE__ */ f(Zt, { group: e });
 	let x = y ? "#0a0a1a" : "#f4f4f7";
 	return /* @__PURE__ */ f("div", {
 		style: {
@@ -5212,7 +5216,7 @@ function Gt({ group: e, symmetryType: t, dark: n = !1, variant: r = !1, showActi
 			height: "100%",
 			background: x
 		},
-		children: /* @__PURE__ */ p(q, {
+		children: /* @__PURE__ */ p(ae, {
 			camera: {
 				position: [
 					0,
@@ -5231,7 +5235,7 @@ function Gt({ group: e, symmetryType: t, dark: n = !1, variant: r = !1, showActi
 			children: [/* @__PURE__ */ f("color", {
 				attach: "background",
 				args: [x]
-			}), /* @__PURE__ */ f(Yt, {
+			}), /* @__PURE__ */ f(Xt, {
 				group: e,
 				symmetryType: v,
 				data: b,
@@ -5251,7 +5255,7 @@ function Gt({ group: e, symmetryType: t, dark: n = !1, variant: r = !1, showActi
 		})
 	});
 }
-function Kt(e, t, n, r, i) {
+function qt(e, t, n, r, i) {
 	let o = l({
 		target: null,
 		t: 2,
@@ -5269,7 +5273,7 @@ function Kt(e, t, n, r, i) {
 	}, [e, n]), a(() => {
 		let e = o.current;
 		!r || !e.target || (e.t = 0, e.phase = "reset", e.settled = !1, n("reset"));
-	}, [r]), ae((e, t) => {
+	}, [r]), oe((e, t) => {
 		let r = o.current;
 		if (!(!r.target || r.t > 1.5)) {
 			if (r.t += t * r.speed, r.phase === "reset") if (r.t >= .5) r.phase = "rotating", r.t = .5, n("rotating");
@@ -5281,16 +5285,16 @@ function Kt(e, t, n, r, i) {
 		}
 	}), o;
 }
-function qt({ data: e, symmetryType: t, isDirected: n, animState: r }) {
+function Jt({ data: e, symmetryType: t, isDirected: n, animState: r }) {
 	let [i] = u(() => new J.Group());
 	return a(() => {
 		for (; i.children.length > 0;) i.remove(i.children[0]);
 		if (e.vertices.forEach((t, n) => {
 			let r = new J.Mesh(new J.SphereGeometry(.28, 16, 16), new J.MeshStandardMaterial({
-				color: Bt(n, e.vertices.length),
+				color: Vt(n, e.vertices.length),
 				roughness: .3,
 				metalness: .1,
-				emissive: Bt(n, e.vertices.length),
+				emissive: Vt(n, e.vertices.length),
 				emissiveIntensity: .3
 			}));
 			r.position.copy(t), i.add(r);
@@ -5309,7 +5313,7 @@ function qt({ data: e, symmetryType: t, isDirected: n, animState: r }) {
 			"cube",
 			"icosahedron"
 		].includes(t)) {
-			let n = t === "cube" ? "#ff9944" : t === "tetrahedron" ? "#44cc88" : "#cc66ff", r = Vt(e);
+			let n = t === "cube" ? "#ff9944" : t === "tetrahedron" ? "#44cc88" : "#cc66ff", r = Ht(e);
 			if (r.length > 0) {
 				let t = [], a = [];
 				for (let [n, i, o] of r) {
@@ -5331,11 +5335,11 @@ function qt({ data: e, symmetryType: t, isDirected: n, animState: r }) {
 		t,
 		n,
 		i
-	]), ae(() => {
+	]), oe(() => {
 		i.quaternion.copy(r.current.currentQuat);
 	}), /* @__PURE__ */ f("primitive", { object: i });
 }
-function Jt({ from: e, to: t, intersections: n }) {
+function Yt({ from: e, to: t, intersections: n }) {
 	let r = c(() => e.clone().add(t).multiplyScalar(.5), [e, t]), i = c(() => t.clone().sub(e).normalize(), [e, t]), a = c(() => t.distanceTo(e), [e, t]), o = c(() => {
 		let e = new J.Quaternion();
 		return e.setFromUnitVectors(new J.Vector3(0, 1, 0), i), e;
@@ -5386,23 +5390,23 @@ function Jt({ from: e, to: t, intersections: n }) {
 		}, t))
 	] });
 }
-function Yt({ group: e, symmetryType: t, data: n, variant: r, showAction: i, actionElementId: o, rotateSpeed: s, showFigureTitle: l, dark: m, locked: h, onHint: g, hintOnIdle: _, replaySignal: v, lockCameraOnAction: y, onAnimationEnd: b }) {
-	let { t: x } = Fe(), [S, C] = u("rest"), w = c(() => {
+function Xt({ group: e, symmetryType: t, data: n, variant: r, showAction: i, actionElementId: o, rotateSpeed: s, showFigureTitle: l, dark: m, locked: h, onHint: g, hintOnIdle: _, replaySignal: v, lockCameraOnAction: y, onAnimationEnd: b }) {
+	let { t: x } = Ie(), [S, C] = u("rest"), w = c(() => {
 		if (!i || !o || !n) return null;
-		let t = Ce(e, o, "SymmetryViewScene.actionElementId");
+		let t = we(e, o, "SymmetryViewScene.actionElementId");
 		if (!t) return null;
-		let r = Wt(e, t);
+		let r = Gt(e, t);
 		return !r || r.angleRad === 0 ? null : r;
 	}, [
 		i,
 		o,
 		e,
 		n
-	]), T = Kt(c(() => {
+	]), T = qt(c(() => {
 		if (!w || w.angleRad === 0) return null;
 		let e = new J.Quaternion();
 		return e.setFromAxisAngle(new J.Vector3(...w.axis), w.angleRad), e;
-	}, [w]), s, C, v, b), E = c(() => i && o ? Ce(e, o, "SymmetryViewScene.actionElementId") : null, [
+	}, [w]), s, C, v, b), E = c(() => i && o ? we(e, o, "SymmetryViewScene.actionElementId") : null, [
 		i,
 		o,
 		e
@@ -5452,7 +5456,7 @@ function Yt({ group: e, symmetryType: t, data: n, variant: r, showAction: i, act
 				kind: "edge"
 			});
 		}
-		let r = Ut(n, Vt(n));
+		let r = Wt(n, Ht(n));
 		for (let n of r) {
 			let r = n.dot(e), i = e.clone().multiplyScalar(r);
 			n.distanceTo(i) < .25 && t.push({
@@ -5497,7 +5501,7 @@ function Yt({ group: e, symmetryType: t, data: n, variant: r, showAction: i, act
 			],
 			intensity: .5
 		}),
-		l && /* @__PURE__ */ f(se, {
+		l && /* @__PURE__ */ f(ce, {
 			position: [
 				0,
 				A + 1.5,
@@ -5516,10 +5520,10 @@ function Yt({ group: e, symmetryType: t, data: n, variant: r, showAction: i, act
 					userSelect: "none",
 					pointerEvents: "none"
 				},
-				dangerouslySetInnerHTML: { __html: Z(Y(e.name)) }
+				dangerouslySetInnerHTML: { __html: Q(X(e.name)) }
 			})
 		}),
-		l && /* @__PURE__ */ f(se, {
+		l && /* @__PURE__ */ f(ce, {
 			position: [
 				0,
 				A + 2.2,
@@ -5537,15 +5541,15 @@ function Yt({ group: e, symmetryType: t, data: n, variant: r, showAction: i, act
 					userSelect: "none",
 					pointerEvents: "none"
 				},
-				dangerouslySetInnerHTML: { __html: Z(t === "cyclic" ? x("symmetry.geo.cyclicText", { n: e.order }) : t === "dihedral" ? x("symmetry.geo.dihedralText", { n: e.order / 2 }) : x(t === "cube" ? r ? "symmetry.geo.octahedron" : "symmetry.geo.cube" : t === "icosahedron" ? r ? "symmetry.geo.dodecahedron" : "symmetry.geo.icosahedron" : "symmetry.geo." + t)) }
+				dangerouslySetInnerHTML: { __html: Q(t === "cyclic" ? x("symmetry.geo.cyclicText", { n: e.order }) : t === "dihedral" ? x("symmetry.geo.dihedralText", { n: e.order / 2 }) : x(t === "cube" ? r ? "symmetry.geo.octahedron" : "symmetry.geo.cube" : t === "icosahedron" ? r ? "symmetry.geo.dodecahedron" : "symmetry.geo.icosahedron" : "symmetry.geo." + t)) }
 			})
 		}),
-		M && /* @__PURE__ */ f(Jt, {
+		M && /* @__PURE__ */ f(Yt, {
 			from: F,
 			to: P,
 			intersections: I
 		}),
-		/* @__PURE__ */ f(qt, {
+		/* @__PURE__ */ f(Jt, {
 			data: n,
 			symmetryType: t,
 			isDirected: k,
@@ -5583,7 +5587,7 @@ function Yt({ group: e, symmetryType: t, data: n, variant: r, showAction: i, act
 				depthWrite: !1
 			})]
 		}),
-		/* @__PURE__ */ f(ce, {
+		/* @__PURE__ */ f(le, {
 			enableDamping: !1,
 			minDistance: 2,
 			maxDistance: 20,
@@ -5593,8 +5597,8 @@ function Yt({ group: e, symmetryType: t, data: n, variant: r, showAction: i, act
 		})
 	] }) : null;
 }
-function Xt({ group: e }) {
-	let { t } = Fe();
+function Zt({ group: e }) {
+	let { t } = Ie();
 	return /* @__PURE__ */ p("div", {
 		style: {
 			width: "100%",
@@ -5612,7 +5616,7 @@ function Xt({ group: e }) {
 					fontSize: "18px",
 					marginBottom: "8px"
 				},
-				children: /* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(Y(e.name)) } })
+				children: /* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(X(e.name)) } })
 			}),
 			/* @__PURE__ */ f("p", {
 				style: {
@@ -5634,7 +5638,7 @@ function Xt({ group: e }) {
 }
 //#endregion
 //#region src/theme/ThemeContext.tsx
-var Zt = e({
+var Qt = e({
 	theme: "dark",
 	toggleTheme: () => {},
 	viewWindowTheme: "dark",
@@ -5642,25 +5646,25 @@ var Zt = e({
 });
 //#endregion
 //#region src/theme/useTheme.ts
-function Qt() {
-	return i(Zt);
+function $t() {
+	return i(Qt);
 }
 //#endregion
 //#region src/utils/cayley3dControls.ts
-var $t = null;
-function en(e) {
-	$t = e;
-}
+var en = null;
 function tn(e) {
-	$t === e && ($t = null);
+	en = e;
+}
+function nn(e) {
+	en === e && (en = null);
 }
 //#endregion
 //#region src/components/Canvas/Cayley3DScene.tsx
-function nn(e, t, n) {
+function rn(e, t, n) {
 	return n ? `hsl(${e / t * 360}, 60%, 55%)` : `hsl(${e * 137.508 % 360}, 65%, 55%)`;
 }
-var rn = n(function({ position: e, label: t, color: n, isSelected: r, isHovered: i, subsetColor: a, element: o, nodeScale: s, showLabel: l, isDark: u, onSelectElement: d, onPointerEnter: m, onPointerLeave: h }) {
-	let g = c(() => Z(Y(t)), [t]), _ = r || i, v = _ ? 24 : 12;
+var an = n(function({ position: e, label: t, color: n, isSelected: r, isHovered: i, subsetColor: a, element: o, nodeScale: s, showLabel: l, isDark: u, onSelectElement: d, onPointerEnter: m, onPointerLeave: h }) {
+	let g = c(() => Q(X(t)), [t]), _ = r || i, v = _ ? 24 : 12;
 	return /* @__PURE__ */ p("group", {
 		position: e,
 		children: [
@@ -5700,7 +5704,7 @@ var rn = n(function({ position: e, label: t, color: n, isSelected: r, isHovered:
 				transparent: !0,
 				opacity: .3
 			})] }),
-			l && _ && /* @__PURE__ */ f(se, {
+			l && _ && /* @__PURE__ */ f(ce, {
 				distanceFactor: 12,
 				center: !0,
 				style: {
@@ -5725,7 +5729,7 @@ var rn = n(function({ position: e, label: t, color: n, isSelected: r, isHovered:
 			})
 		]
 	});
-}), an = n(function({ start: e, end: t, color: n, isHighlighted: r }) {
+}), on = n(function({ start: e, end: t, color: n, isHighlighted: r }) {
 	let i = l(null), o = new J.Vector3().subVectors(t, e), s = o.length();
 	o.normalize();
 	let c = new J.Vector3().addVectors(e, t).multiplyScalar(.5), u = r ? .08 : .05;
@@ -5750,7 +5754,7 @@ var rn = n(function({ position: e, label: t, color: n, isSelected: r, isHovered:
 			roughness: .4
 		})]
 	});
-}), on = n(function({ position: e, direction: t, color: n, isHighlighted: r }) {
+}), sn = n(function({ position: e, direction: t, color: n, isHighlighted: r }) {
 	return /* @__PURE__ */ p("mesh", {
 		position: e,
 		quaternion: c(() => {
@@ -5769,7 +5773,7 @@ var rn = n(function({ position: e, label: t, color: n, isSelected: r, isHovered:
 			roughness: .4
 		})]
 	});
-}), sn = n(function({ start: e, end: t, color: n, isHighlighted: r, isSelfLoop: i, isBidirectional: a, showArrow: o }) {
+}), cn = n(function({ start: e, end: t, color: n, isHighlighted: r, isSelfLoop: i, isBidirectional: a, showArrow: o }) {
 	if (i) return /* @__PURE__ */ p("group", {
 		position: e,
 		children: [/* @__PURE__ */ p("mesh", {
@@ -5814,29 +5818,29 @@ var rn = n(function({ position: e, label: t, color: n, isSelected: r, isHovered:
 		})]
 	});
 	let s = new J.Vector3().subVectors(t, e);
-	return s.normalize(), /* @__PURE__ */ p("group", { children: [/* @__PURE__ */ f(an, {
+	return s.normalize(), /* @__PURE__ */ p("group", { children: [/* @__PURE__ */ f(on, {
 		start: e,
 		end: t,
 		color: n,
 		isHighlighted: r
-	}), o && !a && /* @__PURE__ */ f(on, {
+	}), o && !a && /* @__PURE__ */ f(sn, {
 		position: t.clone().addScaledVector(s, -.66),
 		direction: s,
 		color: n,
 		isHighlighted: r
 	})] });
-}), cn = () => {};
-function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, multiplyType: o, layout3D: s, nodeScale: m, autoRotate: h, showLabels: _, locked: y = !1, subsetHighlights: S = [], theme: C = "dark", faceFill: w }) {
-	let { t: T } = Fe(), { gl: E, camera: D, scene: O } = oe(), k = c(() => Ee(e, i), [e, i]), A = o ?? "right", j = s ?? P(e), M = m ?? 1, N = _ !== !1, F = n ?? cn, [I, L] = u(!1), R = h ?? I, [z, ee] = u(null), B = l({
+}), ln = () => {};
+function un({ group: e, selectedElements: t, onSelectElement: n, actions: i, multiplyType: o, layout3D: s, nodeScale: m, autoRotate: h, showLabels: _, locked: y = !1, subsetHighlights: b = [], theme: C = "dark", faceFill: w }) {
+	let { t: T } = Ie(), { gl: E, camera: D, scene: O } = se(), k = c(() => De(e, i), [e, i]), A = o ?? "right", j = s ?? F(e), M = m ?? 1, N = _ !== !1, P = n ?? ln, [I, L] = u(!1), R = h ?? I, [ee, te] = u(null), z = l({
 		theta: 0,
 		phi: Math.acos(3 / Math.sqrt(153)),
 		radius: Math.sqrt(153),
 		target: new J.Vector3(0, 0, 0),
 		initialized: !1
-	}), te = l({
+	}), ne = l({
 		x: 0,
 		y: 0
-	}), ne = l({
+	}), B = l({
 		active: !1,
 		lastX: 0,
 		lastY: 0,
@@ -5852,11 +5856,11 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 		target: new J.Vector3(),
 		renderer: null,
 		ecam: null
-	}), H = r(() => {
-		let e = te.current, t = Math.hypot(e.x, e.y);
+	}), re = r(() => {
+		let e = ne.current, t = Math.hypot(e.x, e.y);
 		return (t >= 8 ? .35 + Math.min(.65, t / 360) : 1) * 2 * Math.PI;
-	}, []), U = e.order > 100, re = c(() => {
-		if (!U) return new Set(e.elements.map((e) => e.id));
+	}, []), H = e.order > 100, ie = c(() => {
+		if (!H) return new Set(e.elements.map((e) => e.id));
 		let n = new Set([e.identity.id]);
 		for (let e of k.filter((e) => e.enabled).slice(0, 4)) n.add(e.elementId);
 		for (let e of t) n.add(e);
@@ -5866,12 +5870,12 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 		e,
 		k,
 		t,
-		U
-	]), ie = c(() => x(e, k, A), [
+		H
+	]), U = c(() => S(e, k, A), [
 		e,
 		k,
 		A
-	]), G = c(() => b(e, j).map((e) => new J.Vector3(e[0], e[1], e[2])), [e, j]), K = c(() => {
+	]), G = c(() => x(e, j).map((e) => new J.Vector3(e[0], e[1], e[2])), [e, j]), K = c(() => {
 		let e = new J.Vector3(0, 0, 0);
 		if (G.length === 0) return {
 			center: e,
@@ -5895,24 +5899,24 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 			maxRadius: Math.max(30, t * 3),
 			target: K.center.clone()
 		};
-	}, [K, D]), ce = l(q);
+	}, [K, D]), ae = l(q);
 	a(() => {
-		ce.current = q;
+		ae.current = q;
 	});
-	let le = `${e.symbol}|${e.order}`, ue = r(() => {
-		let e = B.current, t = ce.current;
+	let le = `${e.symbol}|${e.order}`, Y = r(() => {
+		let e = z.current, t = ae.current;
 		e.theta = t.theta, e.phi = t.phi, e.radius = t.radius, e.target.copy(t.target);
 	}, []);
 	a(() => {
-		ue();
+		Y();
 	}, [
 		le,
 		j,
-		ue
+		Y
 	]), a(() => {
 		if (y) return;
 		let e = E.domElement, t = (t) => {
-			ne.current = {
+			B.current = {
 				active: !0,
 				lastX: t.clientX,
 				lastY: t.clientY,
@@ -5921,24 +5925,24 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 				button: t.button
 			}, e.setPointerCapture?.(t.pointerId);
 		}, n = (e) => {
-			let t = ne.current;
+			let t = B.current;
 			if (!t.active) return;
 			let n = e.clientX - t.lastX, r = e.clientY - t.lastY;
 			t.lastX = e.clientX, t.lastY = e.clientY, t.x += n, t.y += r;
-			let i = B.current;
+			let i = z.current;
 			if (t.button === 2) {
 				let e = new J.Vector3().setFromMatrixColumn(D.matrix, 0), t = new J.Vector3().setFromMatrixColumn(D.matrix, 1);
 				i.target.addScaledVector(e, -n * i.radius * .0012).addScaledVector(t, r * i.radius * .0012);
 			} else i.theta -= n * .006, i.phi -= r * .006;
 		}, r = (t) => {
-			let n = ne.current;
-			n.active = !1, Math.hypot(n.x, n.y) >= 8 && (te.current = {
+			let n = B.current;
+			n.active = !1, Math.hypot(n.x, n.y) >= 8 && (ne.current = {
 				x: n.x,
 				y: n.y
 			}), e.releasePointerCapture?.(t.pointerId);
 		}, i = (e) => {
 			e.preventDefault();
-			let t = B.current;
+			let t = z.current;
 			t.radius = Math.min(q.maxRadius, Math.max(q.minRadius, t.radius * .95 ** (-e.deltaY / 100)));
 		};
 		return e.addEventListener("pointerdown", t), e.addEventListener("pointermove", n), e.addEventListener("pointerup", r), e.addEventListener("pointercancel", r), e.addEventListener("wheel", i, { passive: !1 }), () => {
@@ -5950,25 +5954,25 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 		q,
 		y
 	]);
-	let de = (e, t, n) => {
-		let r = te.current, i = Math.hypot(r.x, r.y);
+	let ue = (e, t, n) => {
+		let r = ne.current, i = Math.hypot(r.x, r.y);
 		i >= 8 ? (e.theta -= r.x / i * t * n, e.phi -= r.y / i * t * n) : e.theta -= t * n;
-	}, fe = r((e) => {
+	}, de = r((e) => {
 		let t = Math.sin(e.phi);
 		D.position.set(e.target.x + e.radius * t * Math.sin(e.theta), e.target.y + e.radius * Math.cos(e.phi), e.target.z + e.radius * t * Math.cos(e.theta)), D.up.set(0, t >= 0 ? 1 : -1, 0), D.lookAt(e.target);
 	}, [D]);
-	ae((e, t) => {
-		let n = B.current;
-		n.initialized ||= (n.theta = q.theta, n.phi = q.phi, n.radius = q.radius, n.target.copy(q.target), !0), R && de(n, H(), t), fe(n);
+	oe((e, t) => {
+		let n = z.current;
+		n.initialized ||= (n.theta = q.theta, n.phi = q.phi, n.radius = q.radius, n.target.copy(q.target), !0), R && ue(n, re(), t), de(n);
 	}), a(() => {
-		let e = E.domElement, t = () => ue();
+		let e = E.domElement, t = () => Y();
 		return e.addEventListener("dblclick", t), () => e.removeEventListener("dblclick", t);
-	}, [E, ue]), a(() => {
+	}, [E, Y]), a(() => {
 		if (!E.domElement.closest(".canvas-viewport")) return;
 		let e = {
 			isReady: () => !0,
 			snapshotOrbit: () => {
-				let e = B.current;
+				let e = z.current;
 				return {
 					theta: e.theta,
 					phi: e.phi,
@@ -5976,9 +5980,9 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 					target: e.target.clone()
 				};
 			},
-			displayAngVel: () => H(),
+			displayAngVel: () => re(),
 			beginRotation: (e) => {
-				let t = B.current, n = new J.WebGLRenderer({
+				let t = z.current, n = new J.WebGLRenderer({
 					antialias: !1,
 					preserveDrawingBuffer: !0
 				});
@@ -6000,7 +6004,7 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 			frameAt: (e, t) => {
 				let n = V.current;
 				if (!n.active || !n.renderer || !n.ecam) return null;
-				let r = n.radPerSec * e * t / 1e3, i = te.current, a = Math.hypot(i.x, i.y), o, s;
+				let r = n.radPerSec * e * t / 1e3, i = ne.current, a = Math.hypot(i.x, i.y), o, s;
 				a >= 8 ? (o = n.baseTheta - i.x / a * r, s = n.basePhi - i.y / a * r) : (o = n.baseTheta - r, s = n.basePhi);
 				let c = Math.sin(s);
 				return n.ecam.position.set(n.target.x + n.radius * c * Math.sin(o), n.target.y + n.radius * Math.cos(s), n.target.z + n.radius * c * Math.cos(o)), n.ecam.up.set(0, c >= 0 ? 1 : -1, 0), n.ecam.lookAt(n.target), n.renderer.render(O, n.ecam), n.renderer.domElement;
@@ -6010,21 +6014,21 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 				e.active = !1, e.renderer?.dispose(), e.renderer = null, e.ecam = null;
 			}
 		};
-		return en(e), () => tn(e);
+		return tn(e), () => nn(e);
 	}, [
 		E,
 		O,
 		D,
-		H
+		re
 	]);
-	let pe = c(() => {
+	let fe = c(() => {
 		let t = /* @__PURE__ */ new Map();
 		for (let n of e.elements) t.set(n.id, n);
 		return t;
-	}, [e]), me = w?.enabled === !1 ? 0 : w?.opacity ?? .45, X = c(() => {
+	}, [e]), pe = w?.enabled === !1 ? 0 : w?.opacity ?? .45, Z = c(() => {
 		let t = w?.subgroup;
-		if (me <= 0 || !t || t.length === 0) return [];
-		let n = v(ie.map((e) => [e.fromIdx, e.toIdx])), r = W(e, t, G.map((e) => [
+		if (pe <= 0 || !t || t.length === 0) return [];
+		let n = v(U.map((e) => [e.fromIdx, e.toIdx])), r = W(e, t, G.map((e) => [
 			e.x,
 			e.y,
 			e.z
@@ -6052,28 +6056,28 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 	}, [
 		e,
 		w,
-		ie,
+		U,
 		G,
-		me
+		pe
 	]);
 	a(() => () => {
-		for (let e of X) e.geometry.dispose();
-	}, [X]);
-	let Q = c(() => {
+		for (let e of Z) e.geometry.dispose();
+	}, [Z]);
+	let me = c(() => {
 		let e = /* @__PURE__ */ new Map();
 		for (let t of k) {
-			let n = pe.get(t.elementId);
+			let n = fe.get(t.elementId);
 			n && e.set(t.elementId, n.label);
 		}
 		return e;
-	}, [k, pe]), he = c(() => {
+	}, [k, fe]), he = c(() => {
 		let e = /* @__PURE__ */ new Map();
-		for (let t of S) for (let n of t.elementIds) e.has(n) || e.set(n, t);
+		for (let t of b) for (let n of t.elementIds) e.has(n) || e.set(n, t);
 		return e;
-	}, [S]), ge = c(() => {
-		let t = /* @__PURE__ */ new Map(), n = U ? Math.max(60, e.order * 2) : Infinity;
-		for (let r of ie) {
-			if (U && !re.has(r.fromId) && !re.has(r.toId)) continue;
+	}, [b]), ge = c(() => {
+		let t = /* @__PURE__ */ new Map(), n = H ? Math.max(60, e.order * 2) : Infinity;
+		for (let r of U) {
+			if (H && !ie.has(r.fromId) && !ie.has(r.toId)) continue;
 			let i = `${Math.min(r.fromIdx, r.toIdx)}|${Math.max(r.fromIdx, r.toIdx)}|${r.actionElementId}`;
 			if (t.has(i) || t.set(i, {
 				fromIdx: r.fromIdx,
@@ -6084,7 +6088,7 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 				toPos: G[r.toIdx],
 				gen: {
 					name: r.actionElementId,
-					symbol: pe.get(r.actionElementId)?.label || "",
+					symbol: fe.get(r.actionElementId)?.label || "",
 					color: r.color,
 					apply: () => e.elements[0],
 					inverse: {}
@@ -6095,12 +6099,12 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 		}
 		return t;
 	}, [
-		ie,
+		U,
 		G,
 		e,
-		U,
-		re,
-		pe
+		H,
+		ie,
+		fe
 	]);
 	return /* @__PURE__ */ p(d, { children: [
 		/* @__PURE__ */ f("ambientLight", { intensity: .3 }),
@@ -6131,7 +6135,7 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 			intensity: .3,
 			color: "#ffffff"
 		}),
-		/* @__PURE__ */ f(se, {
+		/* @__PURE__ */ f(ce, {
 			fullscreen: !0,
 			position: [
 				0,
@@ -6163,7 +6167,7 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 						},
 						children: [/* @__PURE__ */ f("span", {
 							style: { fontWeight: "bold" },
-							dangerouslySetInnerHTML: { __html: Z(Y(e.symbol)) }
+							dangerouslySetInnerHTML: { __html: Q(X(e.symbol)) }
 						}), /* @__PURE__ */ p("span", {
 							style: {
 								marginLeft: 8,
@@ -6189,7 +6193,7 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 						children: R ? "❚❚" : "▶"
 					}),
 					/* @__PURE__ */ f("button", {
-						onClick: ue,
+						onClick: Y,
 						title: T("cayley3d.resetView"),
 						"aria-label": T("cayley3d.resetView"),
 						style: {
@@ -6207,7 +6211,7 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 				]
 			})
 		}),
-		k.length > 0 && /* @__PURE__ */ f(se, {
+		k.length > 0 && /* @__PURE__ */ f(ce, {
 			fullscreen: !0,
 			position: [
 				0,
@@ -6236,7 +6240,7 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 					},
 					children: T(A === "right" ? "cayley3d.multiplyRight" : "cayley3d.multiplyLeft")
 				}), k.filter((e) => e.enabled).map((e) => {
-					let t = Q.get(e.elementId) || e.elementId;
+					let t = me.get(e.elementId) || e.elementId;
 					return /* @__PURE__ */ p("div", {
 						style: {
 							display: "flex",
@@ -6250,60 +6254,60 @@ function ln({ group: e, selectedElements: t, onSelectElement: n, actions: i, mul
 							height: 3,
 							background: e.color,
 							borderRadius: 2
-						} }), /* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(Y(t)) } })]
+						} }), /* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(X(t)) } })]
 					}, e.elementId);
 				})]
 			})
 		}),
-		X.map((e) => /* @__PURE__ */ f("mesh", {
+		Z.map((e) => /* @__PURE__ */ f("mesh", {
 			geometry: e.geometry,
 			renderOrder: -2,
 			children: /* @__PURE__ */ f("meshBasicMaterial", {
 				color: e.color,
 				transparent: !0,
-				opacity: me,
+				opacity: pe,
 				side: J.DoubleSide,
 				depthWrite: !1
 			})
 		}, e.key)),
 		Array.from(ge.values()).map((e) => {
-			let n = pe.get(e.fromId), r = pe.get(e.toId);
+			let n = fe.get(e.fromId), r = fe.get(e.toId);
 			if (!n || !r) return null;
 			let i = t.has(n.id) || t.has(r.id);
-			return /* @__PURE__ */ f(sn, {
+			return /* @__PURE__ */ f(cn, {
 				start: e.fromPos,
 				end: e.toPos,
 				color: e.gen.color,
 				isHighlighted: i,
 				isSelfLoop: e.isSelfLoop,
 				isBidirectional: e.isBidirectional,
-				showArrow: !U
+				showArrow: !H
 			}, `edge-${e.fromIdx}-${e.toIdx}`);
 		}),
 		G.map((n, r) => {
 			let i = e.elements[r];
-			if (U && !re.has(i.id)) return null;
+			if (H && !ie.has(i.id)) return null;
 			let a = t.has(i.id), o = he.get(i.id);
-			return /* @__PURE__ */ f(rn, {
+			return /* @__PURE__ */ f(an, {
 				position: n,
 				label: i.label,
-				color: nn(r, e.order, e.isAbelian),
+				color: rn(r, e.order, e.isAbelian),
 				isSelected: a,
-				isHovered: z?.id === i.id,
+				isHovered: ee?.id === i.id,
 				subsetColor: o ? o.color : null,
 				element: i,
 				nodeScale: M,
 				showLabel: N,
 				isDark: C === "dark",
-				onSelectElement: F,
-				onPointerEnter: ee,
-				onPointerLeave: ee
+				onSelectElement: P,
+				onPointerEnter: te,
+				onPointerLeave: te
 			}, i.id);
 		})
 	] });
 }
-function un(e) {
-	let { group: t, theme: n } = e, { t: r } = Fe(), { theme: i } = Qt(), a = n ?? i;
+function dn(e) {
+	let { group: t, theme: n } = e, { t: r } = Ie(), { theme: i } = $t(), a = n ?? i;
 	if (!t) return /* @__PURE__ */ f("div", {
 		className: "view-empty",
 		children: /* @__PURE__ */ f("p", { children: r("canvas.noGroup") })
@@ -6315,7 +6319,7 @@ function un(e) {
 			height: "100%",
 			background: o
 		},
-		children: /* @__PURE__ */ p(q, {
+		children: /* @__PURE__ */ p(ae, {
 			camera: {
 				position: [
 					0,
@@ -6338,7 +6342,7 @@ function un(e) {
 			children: [/* @__PURE__ */ f("color", {
 				attach: "background",
 				args: [o]
-			}), /* @__PURE__ */ f(ln, {
+			}), /* @__PURE__ */ f(un, {
 				...e,
 				group: t,
 				theme: a
@@ -6348,7 +6352,7 @@ function un(e) {
 }
 //#endregion
 //#region src/components/Canvas/SublatticeScene.tsx
-var dn = {
+var fn = {
 	derived: {
 		light: "#b8860b",
 		dark: "#ffd93d"
@@ -6365,15 +6369,15 @@ var dn = {
 		light: "#7c3aed",
 		dark: "#c084fc"
 	}
-}, fn = {
+}, pn = {
 	w: 104,
 	h: 28,
 	font: 13
-}, pn = 8, mn = 11;
-function hn(e, t, n) {
+}, mn = 8, hn = 11;
+function gn(e, t, n) {
 	return Math.min(e / Math.max(t, 1e-4), n);
 }
-function gn(e) {
+function _n(e) {
 	return e === "light" ? {
 		edge: "#a9adbc",
 		edgeOpacity: .95,
@@ -6426,12 +6430,12 @@ function gn(e) {
 		seriesBadgeText: "#111"
 	};
 }
-function _n(e, t) {
+function vn(e, t) {
 	let n = Array.from({ length: e }, () => []);
 	for (let r of t) r.from >= 0 && r.from < e && r.to >= 0 && r.to < e && (n[r.from].push(r.to), n[r.to].push(r.from));
 	return n;
 }
-function vn(e, t, n) {
+function yn(e, t, n) {
 	if (t === n) return [t];
 	let r = /* @__PURE__ */ new Set(), i = [[t]];
 	for (; i.length > 0;) {
@@ -6444,9 +6448,9 @@ function vn(e, t, n) {
 	}
 	return null;
 }
-function yn({ group: e, series: t, color: n, theme: r }) {
-	let { t: i } = Fe(), { theme: a } = Qt(), o = r ?? a, { type: s, terms: c, factors: l, solvable: u, nilpotent: m, chainCount: h, truncated: g, loading: _ } = t, v = c ? c.map((t, n) => {
-		let r = t.length === 1 ? "\\langle e \\rangle" : t.length === e.order ? Y(e.symbol) : `N_{${n}}`;
+function bn({ group: e, series: t, color: n, theme: r }) {
+	let { t: i } = Ie(), { theme: a } = $t(), o = r ?? a, { type: s, terms: c, factors: l, solvable: u, nilpotent: m, chainCount: h, truncated: g, loading: _ } = t, v = c ? c.map((t, n) => {
+		let r = t.length === 1 ? "\\langle e \\rangle" : t.length === e.order ? X(e.symbol) : `N_{${n}}`;
 		return (n === 0 ? "" : " \\trianglerighteq ") + r;
 	}).join("") : "", y = c ? c.map((e, t) => `|N_{${t}}| = ${e.length}`).join(",\\;") : "", b = l ? l.map((e, t) => `N_{${t}}/N_{${t + 1}} \\cong ${e.label}`).join(",\\;") : "", x = l ? [...l].sort((e, t) => e.order - t.order || e.label.localeCompare(t.label)).map((e) => e.label).join(", ") : "", S = o === "light" ? "#15803d" : "#4ade80", C = o === "light" ? "#0369a1" : "#38bdf8";
 	return /* @__PURE__ */ f("div", {
@@ -6473,7 +6477,7 @@ function yn({ group: e, series: t, color: n, theme: r }) {
 						color: n ?? void 0
 					},
 					children: i(`series.${s}`)
-				}), /* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(v) } })]
+				}), /* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(v) } })]
 			}),
 			/* @__PURE__ */ f("div", {
 				style: {
@@ -6485,7 +6489,7 @@ function yn({ group: e, series: t, color: n, theme: r }) {
 				},
 				children: /* @__PURE__ */ f("span", {
 					style: { color: "var(--text-muted)" },
-					dangerouslySetInnerHTML: { __html: Z(y) }
+					dangerouslySetInnerHTML: { __html: Q(y) }
 				})
 			}),
 			l && l.length > 0 && /* @__PURE__ */ f("div", {
@@ -6496,7 +6500,7 @@ function yn({ group: e, series: t, color: n, theme: r }) {
 					gap: "4px 14px",
 					marginTop: 3
 				},
-				children: /* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(b) } })
+				children: /* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(b) } })
 			}),
 			/* @__PURE__ */ p("div", {
 				style: {
@@ -6554,13 +6558,13 @@ function yn({ group: e, series: t, color: n, theme: r }) {
 		})
 	});
 }
-function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelDetail: i = "auto", mergeConjugates: a = !1, nodeScale: o = 1, showSeriesPanel: d = !0, series: m = null, centerIds: h, subsets: g, activeNodeIdx: _, onActivateNode: v, noGroupText: y, theme: b, maxEnumerateOrder: x = 60 }) {
-	let { t: S } = Fe(), { theme: C } = Qt(), w = b ?? C, E = c(() => gn(w), [w]), O = l(null), [k, A] = u({
+function xn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelDetail: i = "auto", mergeConjugates: a = !1, nodeScale: o = 1, showSeriesPanel: d = !0, series: m = null, centerIds: h, subsets: g, activeNodeIdx: _, onActivateNode: v, noGroupText: y, theme: b, maxEnumerateOrder: x = 60 }) {
+	let { t: S } = Ie(), { theme: C } = $t(), w = b ?? C, T = c(() => _n(w), [w]), D = l(null), [k, A] = u({
 		width: 0,
 		height: 0
 	});
 	s(() => {
-		let e = O.current;
+		let e = D.current;
 		if (!e) return;
 		let t = () => {
 			let t = e.getBoundingClientRect();
@@ -6573,15 +6577,15 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 		let n = new ResizeObserver(t);
 		return n.observe(e), () => n.disconnect();
 	}, [e?.symbol]);
-	let M = r?.width ?? k.width, N = r?.height ?? k.height, P = n ?? {
+	let j = r?.width ?? k.width, N = r?.height ?? k.height, P = n ?? {
 		x: 0,
 		y: 0,
 		scale: 1
-	}, F = c(() => t === void 0 ? !e || e.order > x ? null : D(e) : t, [
+	}, F = c(() => t === void 0 ? !e || e.order > x ? null : O(e) : t, [
 		e,
 		t,
 		x
-	]), { viewNodes: L, viewEdges: R, mergedOf: z, mergeUnavailable: ee } = c(() => {
+	]), { viewNodes: I, viewEdges: R, mergedOf: ee, mergeUnavailable: te } = c(() => {
 		if (!F) return {
 			viewNodes: [],
 			viewEdges: [],
@@ -6595,7 +6599,7 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 			mergeUnavailable: !1
 		};
 		if (!a || !e) return t;
-		let n = V(e, F.nodes, F.edges);
+		let n = re(e, F.nodes, F.edges);
 		return n ? {
 			viewNodes: n.nodes,
 			viewEdges: n.edges,
@@ -6609,125 +6613,125 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 		F,
 		a,
 		e
-	]), H = c(() => T(L, R, { nodeScale: o }), [
-		L,
+	]), z = c(() => E(I, R, { nodeScale: o }), [
+		I,
 		R,
 		o
-	]), { eff: U, slotScreenWidth: re, tier: W, edgeWidth: K } = c(() => {
-		let e = B(M, N, H.viewW, H.viewH), t = e * P.scale, { slotScreenWidth: n, rowScreenHeight: r } = ne(H.slotW, H.rowH, e, P.scale), a = i === "auto" ? te(n, r) : i;
+	]), { eff: H, slotScreenWidth: ie, tier: U, edgeWidth: W } = c(() => {
+		let e = ne(j, N, z.viewW, z.viewH), t = e * P.scale, { slotScreenWidth: n, rowScreenHeight: r } = V(z.slotW, z.rowH, e, P.scale), a = i === "auto" ? B(n, r) : i;
 		return {
 			fit: e,
 			eff: t,
 			slotScreenWidth: n,
 			rowScreenHeight: r,
 			tier: a,
-			edgeWidth: a === "full" ? E.edgeWidth : hn(1.7, t, H.nodeRx * .1)
+			edgeWidth: a === "full" ? T.edgeWidth : gn(1.7, t, z.nodeRx * .1)
 		};
 	}, [
-		M,
+		j,
 		N,
-		H,
+		z,
 		P.scale,
 		i,
-		E
+		T
 	]), { fullIdx: q, trivialIdx: ae } = c(() => {
 		let t = e?.order ?? 0;
 		return {
-			fullIdx: L.findIndex((e) => e.order === t),
-			trivialIdx: L.findIndex((e) => e.order === 1)
+			fullIdx: I.findIndex((e) => e.order === t),
+			trivialIdx: I.findIndex((e) => e.order === 1)
 		};
-	}, [L, e]), oe = c(() => h ? new Set(h) : !e || e.order > x ? null : new Set(I(e).map((e) => e.id)), [
+	}, [I, e]), oe = c(() => h ? new Set(h) : !e || e.order > x ? null : new Set(L(e).map((e) => e.id)), [
 		e,
 		h,
 		x
-	]), se = c(() => !oe || oe.size === 0 ? -1 : L.findIndex((e) => e.elementIds.length === oe.size ? e.elementIds.every((e) => oe.has(e)) : !1), [L, oe]), ce = c(() => {
+	]), se = c(() => !oe || oe.size === 0 ? -1 : I.findIndex((e) => e.elementIds.length === oe.size ? e.elementIds.every((e) => oe.has(e)) : !1), [I, oe]), ce = c(() => {
 		let t = /* @__PURE__ */ new Map();
 		if (!e) return t;
-		for (let { prime: n, exponent: r } of j(e.order)) {
+		for (let { prime: n, exponent: r } of M(e.order)) {
 			let e = 1;
 			for (let t = 0; t < r; t++) e *= n;
 			t.set(e, n);
 		}
 		return t;
-	}, [e]), [J, le] = u(null), ue = _ ?? J, [de, fe] = u(null), pe = c(() => _n(L.length, R), [L, R]), me = c(() => {
-		if (ue === null || L.length === 0) return /* @__PURE__ */ new Set();
-		let e = /* @__PURE__ */ new Set(), t = q >= 0 ? vn(pe, ue, q) : null, n = ae >= 0 ? vn(pe, ue, ae) : null;
+	}, [e]), [le, J] = u(null), Y = _ ?? le, [ue, de] = u(null), fe = c(() => vn(I.length, R), [I, R]), pe = c(() => {
+		if (Y === null || I.length === 0) return /* @__PURE__ */ new Set();
+		let e = /* @__PURE__ */ new Set(), t = q >= 0 ? yn(fe, Y, q) : null, n = ae >= 0 ? yn(fe, Y, ae) : null;
 		return t && t.forEach((t) => e.add(t)), n && n.forEach((t) => e.add(t)), e;
 	}, [
-		ue,
-		pe,
+		Y,
+		fe,
 		q,
 		ae,
-		L
-	]), X = c(() => {
+		I
+	]), Z = c(() => {
 		let e = /* @__PURE__ */ new Set();
-		if (me.size === 0) return e;
+		if (pe.size === 0) return e;
 		for (let t = 0; t < R.length; t++) {
 			let n = R[t];
-			me.has(n.from) && me.has(n.to) && e.add(t);
+			pe.has(n.from) && pe.has(n.to) && e.add(t);
 		}
 		return e;
-	}, [me, R]), Q = c(() => {
+	}, [pe, R]), me = c(() => {
 		if (!m) return null;
-		let e = dn[m.type];
+		let e = fn[m.type];
 		return w === "light" ? e.light : e.dark;
 	}, [m, w]), he = c(() => {
 		let e = /* @__PURE__ */ new Map();
 		return F && F.nodes.forEach((t, n) => {
-			let r = ie(t.elementIds);
-			e.has(r) || e.set(r, z ? z[n] : n);
+			let r = G(t.elementIds);
+			e.has(r) || e.set(r, ee ? ee[n] : n);
 		}), e;
-	}, [F, z]), ge = c(() => {
+	}, [F, ee]), ge = c(() => {
 		let e = /* @__PURE__ */ new Map();
 		return m?.terms && m.terms.forEach((t, n) => {
-			let r = he.get(ie(t.map((e) => e.id)));
+			let r = he.get(G(t.map((e) => e.id)));
 			r !== void 0 && !e.has(r) && e.set(r, n);
 		}), e;
 	}, [m, he]), _e = c(() => new Set(ge.keys()), [ge]), ve = c(() => {
-		let e = W === "compact" ? hn(fn.h / 2, U, H.nodeRy * .9) : W === "dots" ? hn(pn, U, H.nodeRx * .42) : H.nodeRy;
+		let e = U === "compact" ? gn(pn.h / 2, H, z.nodeRy * .9) : U === "dots" ? gn(mn, H, z.nodeRx * .42) : z.nodeRy;
 		return R.map((t, n) => {
-			let r = H.positions[t.from], i = H.positions[t.to];
+			let r = z.positions[t.from], i = z.positions[t.to];
 			if (!r || !i) return null;
-			let a = X.has(n);
+			let a = Z.has(n);
 			return /* @__PURE__ */ f("line", {
 				x1: r.x,
 				y1: r.y + e,
 				x2: i.x,
 				y2: i.y - e,
-				stroke: a ? E.pathEdge : E.edge,
-				strokeWidth: a ? Math.max(E.pathEdgeWidth, K) : K,
-				opacity: a ? 1 : W === "dots" ? .75 : E.edgeOpacity
+				stroke: a ? T.pathEdge : T.edge,
+				strokeWidth: a ? Math.max(T.pathEdgeWidth, W) : W,
+				opacity: a ? 1 : U === "dots" ? .75 : T.edgeOpacity
 			}, `edge-${n}`);
 		});
 	}, [
 		R,
-		H,
-		X,
-		E,
+		z,
+		Z,
+		T,
+		U,
 		W,
-		K,
-		U
+		H
 	]), ye = c(() => (g ?? []).map((e) => ({
 		color: e.color,
 		set: new Set(e.elementIds)
-	})), [g]), be = c(() => L.map((t, n) => {
-		let r = H.positions[n];
+	})), [g]), be = c(() => I.map((t, n) => {
+		let r = z.positions[n];
 		if (!r) return null;
-		let i = t.orbitSize ?? 1, a = me.has(n), o = ue === n, s = t.order === 1, c = t.order === (e?.order ?? 0), l = n === se, u = t.order > 1 ? ce.get(t.order) : void 0, d = ge.get(n), h = !!m?.terms && d === void 0 && !_e.has(n), g = E.nodeFill, _ = t.isNormal ? E.nodeStrokeNormal : E.nodeStroke, y = 2.5, b = E.nodeText;
-		a && !(d !== void 0 && Q) && (g = E.pathFill, _ = E.pathStroke, y = 4, b = E.pathText), o && (g = E.activeFill, y = 4), l && !a && (g = E.centerFill, _ = E.centerStroke), s && !a && (g = E.trivialFill, _ = E.trivialStroke, y = 2), c && !a && (g = E.fullFill, _ = E.fullStroke), d !== void 0 && Q && (_ = Q, y = W === "full" ? 4 : Math.max(hn(3, U, H.nodeRx * .1), K));
+		let i = t.orbitSize ?? 1, a = pe.has(n), o = Y === n, s = t.order === 1, c = t.order === (e?.order ?? 0), l = n === se, u = t.order > 1 ? ce.get(t.order) : void 0, d = ge.get(n), h = !!m?.terms && d === void 0 && !_e.has(n), g = T.nodeFill, _ = t.isNormal ? T.nodeStrokeNormal : T.nodeStroke, y = 2.5, b = T.nodeText;
+		a && !(d !== void 0 && me) && (g = T.pathFill, _ = T.pathStroke, y = 4, b = T.pathText), o && (g = T.activeFill, y = 4), l && !a && (g = T.centerFill, _ = T.centerStroke), s && !a && (g = T.trivialFill, _ = T.trivialStroke, y = 2), c && !a && (g = T.fullFill, _ = T.fullStroke), d !== void 0 && me && (_ = me, y = U === "full" ? 4 : Math.max(gn(3, H, z.nodeRx * .1), W));
 		let x = ye.find((e) => t.elementIds.every((t) => e.set.has(t))), C = {
 			onMouseDown: (e) => e.stopPropagation(),
 			onClick: (e) => {
-				e.stopPropagation(), ue === n ? (le(null), v?.(null, null)) : (le(n), v?.(n, t));
+				e.stopPropagation(), Y === n ? (J(null), v?.(null, null)) : (J(n), v?.(n, t));
 			},
-			onMouseEnter: () => fe(n),
-			onMouseLeave: () => fe((e) => e === n ? null : e)
+			onMouseEnter: () => de(n),
+			onMouseLeave: () => de((e) => e === n ? null : e)
 		}, w = {
 			cursor: "pointer",
 			opacity: h ? .22 : 1
 		};
-		if (W === "dots") {
-			let e = hn(pn, U, H.nodeRx * .42), m = d !== void 0 && Q ? Q : l ? E.centerStroke : u === void 0 ? c ? E.fullStroke : s ? E.trivialStroke : t.isNormal ? E.nodeStrokeNormal : E.dotPlain : E.sylowText;
+		if (U === "dots") {
+			let e = gn(mn, H, z.nodeRx * .42), m = d !== void 0 && me ? me : l ? T.centerStroke : u === void 0 ? c ? T.fullStroke : s ? T.trivialStroke : t.isNormal ? T.nodeStrokeNormal : T.dotPlain : T.sylowText;
 			return /* @__PURE__ */ p("g", {
 				transform: `translate(${r.x}, ${r.y})`,
 				style: w,
@@ -6737,7 +6741,7 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 					/* @__PURE__ */ f("circle", {
 						cx: 0,
 						cy: 0,
-						r: hn(14, U, H.nodeRx),
+						r: gn(14, H, z.nodeRx),
 						fill: "transparent",
 						stroke: "none"
 					}),
@@ -6745,16 +6749,16 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 						cx: 0,
 						cy: 0,
 						r: e,
-						fill: a ? E.pathFill : m,
-						stroke: a ? E.pathStroke : m,
-						strokeWidth: a || o ? hn(2.5, U, e) : 0
+						fill: a ? T.pathFill : m,
+						stroke: a ? T.pathStroke : m,
+						strokeWidth: a || o ? gn(2.5, H, e) : 0
 					}),
 					i > 1 && /* @__PURE__ */ p("text", {
-						x: e + hn(3, U, H.nodeRx * .2),
-						y: hn(-3, U, H.nodeRy * .5),
+						x: e + gn(3, H, z.nodeRx * .2),
+						y: gn(-3, H, z.nodeRy * .5),
 						textAnchor: "start",
-						fill: E.nodeSubText,
-						fontSize: hn(mn, U, H.nodeRx * .6),
+						fill: T.nodeSubText,
+						fontSize: gn(hn, H, z.nodeRx * .6),
 						fontFamily: "monospace",
 						style: {
 							pointerEvents: "none",
@@ -6765,8 +6769,8 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 				]
 			}, t.id);
 		}
-		if (W === "compact") {
-			let u = hn(fn.w / 2, U, H.nodeRx * .94), m = hn(fn.h / 2, U, H.nodeRy * .9), h = hn(fn.font, U, H.nodeRx * .5);
+		if (U === "compact") {
+			let u = gn(pn.w / 2, H, z.nodeRx * .94), m = gn(pn.h / 2, H, z.nodeRy * .9), h = gn(pn.font, H, z.nodeRx * .5);
 			return /* @__PURE__ */ p("g", {
 				transform: `translate(${r.x}, ${r.y})`,
 				style: w,
@@ -6811,7 +6815,7 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 						x: u - h * .35,
 						y: h * .36,
 						textAnchor: "end",
-						fill: E.nodeSubText,
+						fill: T.nodeSubText,
 						fontSize: h * .85,
 						fontFamily: "monospace",
 						style: {
@@ -6839,14 +6843,14 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 								color: b,
 								fontSize: h
 							},
-							dangerouslySetInnerHTML: { __html: Z(Y(e.symbol)) }
+							dangerouslySetInnerHTML: { __html: Q(X(e.symbol)) }
 						})
 					}),
-					d !== void 0 && Q && /* @__PURE__ */ f("circle", {
+					d !== void 0 && me && /* @__PURE__ */ f("circle", {
 						cx: -u + m * .55,
 						cy: 0,
 						r: m * .3,
-						fill: Q,
+						fill: me,
 						stroke: "none",
 						style: { pointerEvents: "none" }
 					}),
@@ -6854,14 +6858,14 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 						cx: u - m * .55,
 						cy: 0,
 						r: m * .3,
-						fill: E.centerStroke,
+						fill: T.centerStroke,
 						stroke: "none",
 						style: { pointerEvents: "none" }
 					})
 				]
 			}, t.id);
 		}
-		let T = H.nodeRx, D = H.nodeRy;
+		let E = z.nodeRx, D = z.nodeRy;
 		return /* @__PURE__ */ p("g", {
 			transform: `translate(${r.x}, ${r.y})`,
 			style: w,
@@ -6869,9 +6873,9 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 			...C,
 			children: [
 				/* @__PURE__ */ f("rect", {
-					x: -T,
+					x: -E,
 					y: -D,
-					width: T * 2,
+					width: E * 2,
 					height: D * 2,
 					rx: 12,
 					ry: 12,
@@ -6880,9 +6884,9 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 					strokeWidth: y
 				}),
 				x && !a && /* @__PURE__ */ f("rect", {
-					x: -T,
+					x: -E,
 					y: -D,
-					width: T * 2,
+					width: E * 2,
 					height: D * 2,
 					rx: 12,
 					ry: 12,
@@ -6903,10 +6907,10 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 					children: s ? "⟨e⟩" : c ? "" : i > 1 ? `|H|=${t.order} ×${i}` : `|H|=${t.order}`
 				}),
 				l && /* @__PURE__ */ f("text", {
-					x: T - 6,
+					x: E - 6,
 					y: -D + 12,
 					textAnchor: "end",
-					fill: E.centerStroke,
+					fill: T.centerStroke,
 					fontSize: 10,
 					fontWeight: "bold",
 					fontFamily: "monospace",
@@ -6917,10 +6921,10 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 					children: "Z(G)"
 				}),
 				u !== void 0 && /* @__PURE__ */ f("text", {
-					x: -T + 6,
+					x: -E + 6,
 					y: -D + 12,
 					textAnchor: "start",
-					fill: E.sylowText,
+					fill: T.sylowText,
 					fontSize: 10,
 					fontWeight: "bold",
 					fontFamily: "monospace",
@@ -6930,29 +6934,29 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 					},
 					children: S("lattice.sylow", { p: String(u) })
 				}),
-				d !== void 0 && Q && /* @__PURE__ */ p("g", {
+				d !== void 0 && me && /* @__PURE__ */ p("g", {
 					style: { pointerEvents: "none" },
 					children: [/* @__PURE__ */ f("circle", {
-						cx: -T + 12,
+						cx: -E + 12,
 						cy: D - 12,
 						r: 9,
-						fill: Q,
+						fill: me,
 						stroke: "none"
 					}), /* @__PURE__ */ f("text", {
-						x: -T + 12,
+						x: -E + 12,
 						y: D - 8,
 						textAnchor: "middle",
 						fontSize: "10",
 						fontWeight: "bold",
-						fill: E.seriesBadgeText,
+						fill: T.seriesBadgeText,
 						fontFamily: "monospace",
 						children: d
 					})]
 				}),
 				c && e && /* @__PURE__ */ f("foreignObject", {
-					x: -T + 6,
+					x: -E + 6,
 					y: -D + 2,
-					width: T * 2 - 12,
+					width: E * 2 - 12,
 					height: D * 2 - 4,
 					style: {
 						pointerEvents: "none",
@@ -6968,13 +6972,13 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 							color: b,
 							fontSize: "15px"
 						},
-						dangerouslySetInnerHTML: { __html: Z(Y(e.symbol)) }
+						dangerouslySetInnerHTML: { __html: Q(X(e.symbol)) }
 					})
 				}),
 				/* @__PURE__ */ f("text", {
 					y: 13,
 					textAnchor: "middle",
-					fill: a ? E.pathSubText : t.isNormal ? E.nodeStrokeNormal : E.nodeSubText,
+					fill: a ? T.pathSubText : t.isNormal ? T.nodeStrokeNormal : T.nodeSubText,
 					fontSize: "11px",
 					fontFamily: "monospace",
 					style: {
@@ -6986,29 +6990,29 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 			]
 		}, t.id);
 	}), [
-		L,
-		H,
-		me,
-		ue,
+		I,
+		z,
+		pe,
+		Y,
 		e,
 		se,
 		ce,
 		ge,
 		m,
 		_e,
-		Q,
-		E,
+		me,
+		T,
 		ye,
 		S,
-		W,
 		U,
-		K,
+		H,
+		W,
 		v
 	]), xe = c(() => {
-		if (!Q) return null;
+		if (!me) return null;
 		let e = [...ge.entries()].sort((e, t) => e[1] - t[1]), t = [];
 		for (let n = 0; n + 1 < e.length; n++) {
-			let r = H.positions[e[n][0]], i = H.positions[e[n + 1][0]];
+			let r = z.positions[e[n][0]], i = z.positions[e[n + 1][0]];
 			r && i && t.push({
 				from: r,
 				to: i
@@ -7016,39 +7020,39 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 		}
 		return t;
 	}, [
-		Q,
+		me,
 		ge,
-		H
-	]), Se = de ?? ue, Ce = Se === null ? null : L[Se] ?? null, we = c(() => !e || !Ce || Ce.order === e.order ? null : G(e, Ce.elementIds), [e, Ce]), Te = Ce, Ee = Se === null ? void 0 : ge.get(Se), De = c(() => {
+		z
+	]), Se = ue ?? Y, Ce = Se === null ? null : I[Se] ?? null, we = c(() => !e || !Ce || Ce.order === e.order ? null : K(e, Ce.elementIds), [e, Ce]), Te = Ce, Ee = Se === null ? void 0 : ge.get(Se), De = c(() => {
 		if (!e || !Ce || Se === null) return null;
-		let t = H.positions[Se];
+		let t = z.positions[Se];
 		if (!t) return null;
-		let n = H.nodeRy, r = 12 / U, i = 6 / U, a = 280 / U, o = 18 / U, s = 8 / U, c = [];
-		c.push(/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(`|H| = ${Ce.order}`) } }, "order")), we && c.push(/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(`\\cong ${we}`) } }, "sym")), Ce.isNormal && Ce.order !== e.order && c.push(/* @__PURE__ */ f("span", {
-			style: { color: E.nodeStrokeNormal },
+		let n = z.nodeRy, r = 12 / H, i = 6 / H, a = 280 / H, o = 18 / H, s = 8 / H, c = [];
+		c.push(/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(`|H| = ${Ce.order}`) } }, "order")), we && c.push(/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(`\\cong ${we}`) } }, "sym")), Ce.isNormal && Ce.order !== e.order && c.push(/* @__PURE__ */ f("span", {
+			style: { color: T.nodeStrokeNormal },
 			children: `◁ ${S("badge.normal")}`
-		}, "normal")), c.push(/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(`[G:H] = ${Math.round(e.order / Ce.order)}`) } }, "idx")), (Te?.orbitSize ?? 1) > 1 && c.push(/* @__PURE__ */ p("span", {
+		}, "normal")), c.push(/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(`[G:H] = ${Math.round(e.order / Ce.order)}`) } }, "idx")), (Te?.orbitSize ?? 1) > 1 && c.push(/* @__PURE__ */ p("span", {
 			style: { color: "var(--text-muted)" },
 			children: [
 				S("lattice.orbitMembers", { n: String(Te.orbitSize) }),
 				" · ",
-				/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(`|N_G(H)| = ${Te.normalizerOrder}`) } })
+				/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(`|N_G(H)| = ${Te.normalizerOrder}`) } })
 			]
-		}, "orbit")), Ce.label && Ce.label !== `${Ce.order}` && c.push(/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Z(Y(Ce.label)) } }, "label")), Ee !== void 0 && m && c.push(/* @__PURE__ */ f("span", {
-			style: { color: Q ?? void 0 },
+		}, "orbit")), Ce.label && Ce.label !== `${Ce.order}` && c.push(/* @__PURE__ */ f("span", { dangerouslySetInnerHTML: { __html: Q(X(Ce.label)) } }, "label")), Ee !== void 0 && m && c.push(/* @__PURE__ */ f("span", {
+			style: { color: me ?? void 0 },
 			children: `N_${Ee} · ${S(`series.${m.type}`)}`
 		}, "term"));
 		let l = o * c.length + i * 2, u = t.y - n - s - l, d = t.y + n + s, h = u, g = "down";
-		(u < 0 || d + l > H.viewH) && (u >= H.viewH - (d + l) ? (h = Math.max(u, 0), g = "down") : (h = Math.min(d, H.viewH - l), g = "up"));
-		let _ = t.x - a / 2, v = Math.min(Math.max(_, 0), Math.max(H.viewW - a, 0)), y = Math.min(Math.max(t.x, v + r), v + a - r), b = g === "down" ? h + l : h, x = g === "down" ? h : h + l;
+		(u < 0 || d + l > z.viewH) && (u >= z.viewH - (d + l) ? (h = Math.max(u, 0), g = "down") : (h = Math.min(d, z.viewH - l), g = "up"));
+		let _ = t.x - a / 2, v = Math.min(Math.max(_, 0), Math.max(z.viewW - a, 0)), y = Math.min(Math.max(t.x, v + r), v + a - r), b = g === "down" ? h + l : h, x = g === "down" ? h : h + l;
 		return /* @__PURE__ */ p("g", {
 			style: { pointerEvents: "none" },
 			"data-testid": "lattice-bubble",
 			children: [/* @__PURE__ */ f("polygon", {
-				points: `${y - 6 / U},${x} ${y + 6 / U},${x} ${y},${b}`,
+				points: `${y - 6 / H},${x} ${y + 6 / H},${x} ${y},${b}`,
 				fill: "var(--bg-panel)",
 				stroke: "var(--border-primary)",
-				strokeWidth: 1 / U
+				strokeWidth: 1 / H
 			}), /* @__PURE__ */ f("foreignObject", {
 				x: v,
 				y: h,
@@ -7061,21 +7065,21 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 						height: "100%",
 						padding: `${i}px ${r}px`,
 						border: "1px solid var(--border-primary)",
-						borderRadius: `${6 / U}px`,
+						borderRadius: `${6 / H}px`,
 						background: "var(--bg-panel)",
 						color: "var(--text-primary)",
-						fontSize: `${13 / U}px`,
+						fontSize: `${13 / H}px`,
 						lineHeight: 1.4,
 						boxShadow: "0 2px 8px rgba(0,0,0,0.25)",
 						display: "flex",
 						flexDirection: "column",
-						gap: `${2 / U}px`
+						gap: `${2 / H}px`
 					},
 					children: c.map((e, t) => /* @__PURE__ */ f("span", {
 						style: {
 							display: "inline-flex",
 							alignItems: "center",
-							gap: `${8 / U}px`
+							gap: `${8 / H}px`
 						},
 						children: e
 					}, t))
@@ -7088,21 +7092,21 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 		Te,
 		Ee,
 		we,
+		z,
 		H,
-		U,
 		e,
 		m,
-		Q,
+		me,
 		S,
-		E.nodeStrokeNormal
+		T.nodeStrokeNormal
 	]);
-	return !e || !F || L.length === 0 ? /* @__PURE__ */ f("div", {
+	return !e || !F || I.length === 0 ? /* @__PURE__ */ f("div", {
 		className: "view-empty",
 		children: /* @__PURE__ */ f("p", { children: y ?? S(e ? "lattice.backendOnly" : "canvas.noGroup") })
 	}) : /* @__PURE__ */ p("div", {
 		className: "sublattice-view-wrap",
-		"data-lattice-tier": W,
-		"data-lattice-slot-width": Math.round(re),
+		"data-lattice-tier": U,
+		"data-lattice-slot-width": Math.round(ie),
 		style: {
 			height: "100%",
 			display: "flex",
@@ -7116,8 +7120,8 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 					position: "relative"
 				},
 				children: /* @__PURE__ */ f("svg", {
-					ref: O,
-					viewBox: `0 0 ${H.viewW} ${H.viewH}`,
+					ref: D,
+					viewBox: `0 0 ${z.viewW} ${z.viewH}`,
 					className: "view-svg",
 					style: {
 						position: "absolute",
@@ -7136,8 +7140,8 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 								y1: e.from.y,
 								x2: e.to.x,
 								y2: e.to.y,
-								stroke: Q,
-								strokeWidth: W === "full" ? 4 : Math.max(hn(4, U, H.nodeRx * .1), K),
+								stroke: me,
+								strokeWidth: U === "full" ? 4 : Math.max(gn(4, H, z.nodeRx * .1), W),
 								strokeLinecap: "round",
 								opacity: .85
 							}, `series-line-${t}`)),
@@ -7147,7 +7151,7 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 					})
 				})
 			}),
-			ee && /* @__PURE__ */ f("div", {
+			te && /* @__PURE__ */ f("div", {
 				"data-testid": "lattice-merge-hint",
 				style: {
 					padding: "2px 10px",
@@ -7157,10 +7161,10 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 				},
 				children: S("lattice.mergeTooLarge")
 			}),
-			d && m && /* @__PURE__ */ f(yn, {
+			d && m && /* @__PURE__ */ f(bn, {
 				group: e,
 				series: m,
-				color: Q,
+				color: me,
 				theme: w
 			})
 		]
@@ -7168,19 +7172,19 @@ function bn({ group: e, lattice: t, canvasTransform: n, availableSize: r, labelD
 }
 //#endregion
 //#region src/components/Canvas/SceneWindow.tsx
-var xn = 32, Sn = 220, Cn = 160, wn = 208, Tn = 8, En = 5e3, Dn = {
+var Sn = 32, Cn = 220, wn = 160, Tn = 208, En = 8, Dn = 5e3, On = {
 	x: 12,
 	y: 12
-}, On = {
+}, kn = {
 	width: 440,
 	height: 320
-}, kn = {
+}, An = {
 	locked: !1,
 	showInfo: !1,
 	resizable: !0,
 	viewportFixed: !1,
 	showControls: !0
-}, An = {
+}, jn = {
 	n: "ns-resize",
 	s: "ns-resize",
 	e: "ew-resize",
@@ -7189,7 +7193,7 @@ var xn = 32, Sn = 220, Cn = 160, wn = 208, Tn = 8, En = 5e3, Dn = {
 	sw: "nesw-resize",
 	nw: "nwse-resize",
 	se: "nwse-resize"
-}, jn = [
+}, Mn = [
 	"n",
 	"s",
 	"e",
@@ -7198,7 +7202,7 @@ var xn = 32, Sn = 220, Cn = 160, wn = 208, Tn = 8, En = 5e3, Dn = {
 	"nw",
 	"se",
 	"sw"
-], Mn = {
+], Nn = {
 	dark: {
 		tbarBg: "#131c2b",
 		tbarBorder: "#24324a",
@@ -7222,7 +7226,7 @@ var xn = 32, Sn = 220, Cn = 160, wn = 208, Tn = 8, En = 5e3, Dn = {
 		accent: "#0e7490"
 	}
 };
-function Nn(e, t) {
+function Pn(e, t) {
 	try {
 		let n = localStorage.getItem(`gv-sw-${e}`);
 		return n ? t(JSON.parse(n)) : null;
@@ -7230,19 +7234,19 @@ function Nn(e, t) {
 		return null;
 	}
 }
-function Pn(e, t) {
+function Fn(e, t) {
 	try {
 		localStorage.setItem(`gv-sw-${e}`, JSON.stringify(t));
 	} catch {}
 }
-function Fn(e, t) {
+function In(e, t) {
 	return t ? {
 		...e,
 		...t
 	} : e;
 }
-function In(e, t = !0) {
-	return !e || !t ? null : Nn(e, (e) => {
+function Ln(e, t = !0) {
+	return !e || !t ? null : Pn(e, (e) => {
 		let t = e.pos, n = e.size, r = e.config;
 		return {
 			pos: t && typeof t.x == "number" && typeof t.y == "number" ? {
@@ -7250,35 +7254,35 @@ function In(e, t = !0) {
 				y: t.y
 			} : void 0,
 			size: n && typeof n.width == "number" && typeof n.height == "number" ? {
-				width: Math.max(Sn, n.width),
-				height: Math.max(Cn, n.height)
+				width: Math.max(Cn, n.width),
+				height: Math.max(wn, n.height)
 			} : void 0,
 			cfg: r && typeof r == "object" ? r : void 0
 		};
 	});
 }
-var Ln = {};
-function Rn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabilities: o, config: s, onConfigChange: c, storageKey: l, defaultPosition: d, defaultSize: m, onClose: h, children: g }) {
-	let _ = Mn[n], v = !!l && o?.persist !== !1, [y, b] = u(() => {
+var Rn = {};
+function zn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabilities: o, config: s, onConfigChange: c, storageKey: l, defaultPosition: d, defaultSize: m, onClose: h, children: g }) {
+	let _ = Nn[n], v = !!l && o?.persist !== !1, [y, b] = u(() => {
 		let e = {
-			...kn,
-			...s ?? Ln
-		}, t = In(l, v);
-		return t?.cfg ? Fn(e, t.cfg) : e;
+			...An,
+			...s ?? Rn
+		}, t = Ln(l, v);
+		return t?.cfg ? In(e, t.cfg) : e;
 	}), x = r((e) => {
 		b((t) => {
-			let n = Fn(t, e);
+			let n = In(t, e);
 			return c?.(n), n;
 		});
 	}, [c]), [S, C] = u(() => {
-		let e = In(l, v);
+		let e = Ln(l, v);
 		return {
-			pos: e?.pos ?? d ?? Dn,
-			size: e?.size ?? m ?? On
+			pos: e?.pos ?? d ?? On,
+			size: e?.size ?? m ?? kn
 		};
 	}), { pos: w, size: T } = S;
 	a(() => {
-		v && Pn(l, {
+		v && Fn(l, {
 			pos: w,
 			size: T,
 			config: y
@@ -7290,7 +7294,7 @@ function Rn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabi
 		l,
 		v
 	]);
-	let [E, D] = u(() => ++En), O = r(() => D(++En), []), [k, A] = u(!1), j = r((e) => {
+	let [E, D] = u(() => ++Dn), O = r(() => D(++Dn), []), [k, A] = u(!1), j = r((e) => {
 		if (y.locked || e.target.closest("button")) return;
 		e.preventDefault(), O();
 		let t = {
@@ -7330,7 +7334,7 @@ function Rn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabi
 				width: n.ow,
 				height: n.oh
 			};
-			e.includes("e") && (s = Math.max(Sn, n.ow + r)), e.includes("s") && (c = Math.max(Cn, n.oh + i)), e.includes("w") && (s = Math.max(Sn, n.ow - r), a = n.ox + (n.ow - s)), e.includes("n") && (c = Math.max(Cn, n.oh - i), o = n.oy + (n.oh - c)), C({
+			e.includes("e") && (s = Math.max(Cn, n.ow + r)), e.includes("s") && (c = Math.max(wn, n.oh + i)), e.includes("w") && (s = Math.max(Cn, n.ow - r), a = n.ox + (n.ow - s)), e.includes("n") && (c = Math.max(wn, n.oh - i), o = n.oy + (n.oh - c)), C({
 				pos: {
 					x: a,
 					y: o
@@ -7370,7 +7374,7 @@ function Rn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabi
 		params: !0,
 		close: !0,
 		persist: !0,
-		...o ?? Ln
+		...o ?? Rn
 	}, P = y.showControls !== !1, F = e ?? (t ? t.symbol : "View"), I = y.showInfo && t ? `${t.symbol} · |G|=${t.order} · ${t.name ?? ""}` : "", L = {
 		background: "none",
 		border: "none",
@@ -7408,7 +7412,7 @@ function Rn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabi
 					alignItems: "center",
 					justifyContent: "space-between",
 					padding: "0 6px 0 10px",
-					height: xn,
+					height: Sn,
 					background: _.tbarBg,
 					borderBottom: `1px solid ${_.tbarBorder}`,
 					cursor: N.drag && !y.locked ? "grab" : "default",
@@ -7475,15 +7479,15 @@ function Rn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabi
 			}), /* @__PURE__ */ p("div", {
 				style: {
 					position: "relative",
-					height: T.height - (N.titlebar && P ? xn : 0),
+					height: T.height - (N.titlebar && P ? Sn : 0),
 					overflow: "hidden",
 					background: _.contentBg
 				},
-				children: [g, N.resize && y.resizable !== !1 && jn.map((e) => {
+				children: [g, N.resize && y.resizable !== !1 && Mn.map((e) => {
 					let t = {
 						position: "absolute",
 						zIndex: 10,
-						cursor: An[e],
+						cursor: jn[e],
 						background: "transparent"
 					}, n = (() => {
 						switch (e) {
@@ -7549,9 +7553,9 @@ function Rn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabi
 		}), k && N.params && /* @__PURE__ */ p("div", {
 			style: {
 				position: y.viewportFixed ? "fixed" : "absolute",
-				left: T.width + Tn,
+				left: T.width + En,
 				top: 0,
-				width: wn,
+				width: Tn,
 				maxHeight: T.height,
 				overflowY: "auto",
 				zIndex: E + 1,
@@ -7657,9 +7661,9 @@ function Rn({ title: e, group: t, theme: n = "dark", shell: i = "chrome", capabi
 }
 //#endregion
 //#region src/components/Canvas/SceneHoverBubble.tsx
-function zn({ element: e, anchor: t, theme: n = "dark", group: r, offset: i }) {
+function Bn({ element: e, anchor: t, theme: n = "dark", group: r, offset: i }) {
 	if (!e || !t) return null;
-	let a = i?.x ?? 0, o = i?.y ?? -14, s = r ? A(r, e) : null;
+	let a = i?.x ?? 0, o = i?.y ?? -14, s = r ? j(r, e) : null;
 	return /* @__PURE__ */ f("div", {
 		"data-theme": n,
 		style: {
@@ -7705,18 +7709,18 @@ function zn({ element: e, anchor: t, theme: n = "dark", group: r, offset: i }) {
 }
 //#endregion
 //#region src/hooks/useSceneState.ts
-var Bn = {
+var Vn = {
 	x: 0,
 	y: 0,
 	scale: 1
-}, Vn = {
+}, Hn = {
 	width: 800,
 	height: 600
-}, Hn = .25, Un = 8;
-function Wn(e, n = {}) {
-	let { initialTransform: i, locked: o = !1, enableZoom: s = !0, enablePan: d = !0, minScale: f = Hn, maxScale: p = Un, selectedElements: m, onSelectionChange: h, fallbackViewBoxSize: g, hostStyle: _, theme: v = "dark", renderHoverBubble: y } = n, b = l(null), x = r((e) => {
+}, Un = .25, Wn = 8;
+function Gn(e, n = {}) {
+	let { initialTransform: i, locked: o = !1, enableZoom: s = !0, enablePan: d = !0, minScale: f = Un, maxScale: p = Wn, selectedElements: m, onSelectionChange: h, fallbackViewBoxSize: g, hostStyle: _, theme: v = "dark", renderHoverBubble: y } = n, b = l(null), x = r((e) => {
 		b.current = e;
-	}, []), S = r(() => b.current, []), [C, w] = u(g ?? Vn);
+	}, []), S = r(() => b.current, []), [C, w] = u(g ?? Hn);
 	a(() => {
 		let e = b.current;
 		if (!e) return;
@@ -7731,9 +7735,9 @@ function Wn(e, n = {}) {
 		let n = new ResizeObserver(t);
 		return n.observe(e), () => n.disconnect();
 	}, []);
-	let [T, E] = u(i ?? Bn), D = l(T), O = r((e) => {
+	let [T, E] = u(i ?? Vn), D = l(T), O = r((e) => {
 		D.current = e, E(e);
-	}, []), k = r(() => O(i ?? Bn), [O, i]), A = r((e, t) => {
+	}, []), k = r(() => O(i ?? Vn), [O, i]), A = r((e, t) => {
 		let n = b.current, r = n?.getBoundingClientRect();
 		if (!r) return {
 			x: 0,
@@ -7794,7 +7798,7 @@ function Wn(e, n = {}) {
 			ox: D.current.x,
 			oy: D.current.y
 		}, F(!0));
-	}, [I]), z = r((e) => {
+	}, [I]), ee = r((e) => {
 		if (!N.current.active) return;
 		let t = N.current;
 		O({
@@ -7806,7 +7810,7 @@ function Wn(e, n = {}) {
 	a(() => {
 		if (P) return globalThis.addEventListener("mouseup", L), () => globalThis.removeEventListener("mouseup", L);
 	}, [P, L]);
-	let ee = c(() => ({
+	let te = c(() => ({
 		ref: x,
 		style: {
 			position: "relative",
@@ -7818,7 +7822,7 @@ function Wn(e, n = {}) {
 			..._
 		},
 		onMouseDown: R,
-		onMouseMove: z,
+		onMouseMove: ee,
 		onMouseUp: L,
 		onMouseLeave: L
 	}), [
@@ -7827,44 +7831,44 @@ function Wn(e, n = {}) {
 		I,
 		P,
 		R,
-		z,
+		ee,
 		L
-	]), [B, te] = u(() => /* @__PURE__ */ new Set()), ne = m ?? B, V = r((e) => {
-		m || te(e), h?.(e);
-	}, [m, h]), H = r((e) => {
-		V(typeof e == "function" ? e(m ?? B) : e);
+	]), [z, ne] = u(() => /* @__PURE__ */ new Set()), B = m ?? z, V = r((e) => {
+		m || ne(e), h?.(e);
+	}, [m, h]), re = r((e) => {
+		V(typeof e == "function" ? e(m ?? z) : e);
 	}, [
 		m,
-		B,
+		z,
 		V
-	]), U = r((e, t = !1) => {
-		let n = m ?? B;
+	]), H = r((e, t = !1) => {
+		let n = m ?? z;
 		if (t) {
 			let t = new Set(n);
 			t.has(e) ? t.delete(e) : t.add(e), V(t);
 		} else V(new Set([e]));
 	}, [
 		m,
-		B,
+		z,
 		V
-	]), re = r(() => V(/* @__PURE__ */ new Set()), [V]), [W, ie] = u(null), [G, K] = u(null), q = r((e, t) => {
-		if (ie(e), !e || !t) {
+	]), ie = r(() => V(/* @__PURE__ */ new Set()), [V]), [U, W] = u(null), [G, K] = u(null), q = r((e, t) => {
+		if (W(e), !e || !t) {
 			K(null);
 			return;
 		}
 		K(t);
-	}, []), ae = c(() => W ? y ? y(W, G) : t(zn, {
-		element: W,
+	}, []), ae = c(() => U ? y ? y(U, G) : t(Bn, {
+		element: U,
 		anchor: G,
 		theme: v,
 		group: e ?? null
 	}) : null, [
-		W,
+		U,
 		G,
 		y,
 		v,
 		e
-	]), [oe, se] = u(() => /* @__PURE__ */ new Map()), ce = r((e) => oe.get(e), [oe]), J = r((e, t, n) => {
+	]), [oe, se] = u(() => /* @__PURE__ */ new Map()), ce = r((e) => oe.get(e), [oe]), le = r((e, t, n) => {
 		se((r) => {
 			let i = new Map(r);
 			return i.set(e, {
@@ -7872,42 +7876,42 @@ function Wn(e, n = {}) {
 				y: n
 			}), i;
 		});
-	}, []), le = r(() => se(/* @__PURE__ */ new Map()), []), [ue, de] = u(e);
-	return ue !== e && (de(e), ie(null), K(null), se(/* @__PURE__ */ new Map()), m || te(/* @__PURE__ */ new Set())), {
-		hostProps: ee,
+	}, []), J = r(() => se(/* @__PURE__ */ new Map()), []), [Y, ue] = u(e);
+	return Y !== e && (ue(e), W(null), K(null), se(/* @__PURE__ */ new Map()), m || ne(/* @__PURE__ */ new Set())), {
+		hostProps: te,
 		viewBoxSize: C,
 		getHostElement: S,
 		canvasTransform: T,
 		setCanvasTransform: O,
-		selectedElements: ne,
-		setSelectedElements: H,
-		select: U,
-		clearSelection: re,
-		hovered: W,
+		selectedElements: B,
+		setSelectedElements: re,
+		select: H,
+		clearSelection: ie,
+		hovered: U,
 		hoverAnchor: G,
 		hoverBubble: ae,
 		sceneProps: c(() => ({
-			selectedElements: ne,
+			selectedElements: B,
 			canvasTransform: T,
 			viewBoxSize: C,
-			onSelect: U,
+			onSelect: H,
 			onHover: q
 		}), [
-			ne,
+			B,
 			T,
 			C,
-			U,
+			H,
 			q
 		]),
 		resetTransform: k,
 		zoomBy: M,
 		locked: o,
 		getNodePosition: ce,
-		onNodePositionChange: J,
-		resetNodePositions: le
+		onNodePositionChange: le,
+		resetNodePositions: J
 	};
 }
 //#endregion
-export { bt as ActionScene, un as Cayley3DScene, De as CayleyView, Re as CosetStripScene, ve as CycleView, kt as HomomorphismScene, Pe as I18nProvider, zn as SceneHoverBubble, le as SceneThemeRoot, Rn as SceneWindow, Q as SetView, bn as SublatticeScene, Gt as SymmetryViewScene, We as TableView, Wn as useSceneState, Fe as useTranslation };
+export { xt as ActionScene, dn as Cayley3DScene, Oe as CayleyView, ze as CosetStripScene, ye as CycleView, At as HomomorphismScene, Fe as I18nProvider, Bn as SceneHoverBubble, Y as SceneThemeRoot, zn as SceneWindow, he as SetView, xn as SublatticeScene, Kt as SymmetryViewScene, Ge as TableView, Gn as useSceneState, Ie as useTranslation };
 
 //# sourceMappingURL=index.js.map