shaders 2.5.110 → 2.5.112

package/dist/svelte/index.js

@@ -1,4 +1,4 @@
-import { n as generatePresetCode } from "./generatePresetCode-jdOx6mhw.js";
+import { n as generatePresetCode } from "./generatePresetCode-DAEzZxbM.js";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import { getContext, onDestroy, onMount, setContext } from "svelte";
@@ -41,80 +41,81 @@ import { componentDefinition as componentDefinition$33 } from "../core/shaders/F
 import { componentDefinition as componentDefinition$34 } from "../core/shaders/FlowField/index.js";
 import { componentDefinition as componentDefinition$35 } from "../core/shaders/Flower/index.js";
 import { componentDefinition as componentDefinition$36 } from "../core/shaders/FlowingGradient/index.js";
-import { componentDefinition as componentDefinition$37 } from "../core/shaders/Fog/index.js";
-import { componentDefinition as componentDefinition$38 } from "../core/shaders/Form3D/index.js";
-import { componentDefinition as componentDefinition$39 } from "../core/shaders/Glass/index.js";
-import { componentDefinition as componentDefinition$40 } from "../core/shaders/GlassTiles/index.js";
-import { componentDefinition as componentDefinition$41 } from "../core/shaders/Glitch/index.js";
-import { componentDefinition as componentDefinition$42 } from "../core/shaders/Glow/index.js";
-import { componentDefinition as componentDefinition$43 } from "../core/shaders/Godrays/index.js";
-import { componentDefinition as componentDefinition$44 } from "../core/shaders/Grayscale/index.js";
-import { componentDefinition as componentDefinition$45 } from "../core/shaders/Grid/index.js";
-import { componentDefinition as componentDefinition$46 } from "../core/shaders/GridDistortion/index.js";
-import { componentDefinition as componentDefinition$47 } from "../core/shaders/Group/index.js";
-import { componentDefinition as componentDefinition$48 } from "../core/shaders/Halftone/index.js";
-import { componentDefinition as componentDefinition$49 } from "../core/shaders/HexGrid/index.js";
-import { componentDefinition as componentDefinition$50 } from "../core/shaders/HueShift/index.js";
-import { componentDefinition as componentDefinition$51 } from "../core/shaders/ImageTexture/index.js";
-import { componentDefinition as componentDefinition$52 } from "../core/shaders/Invert/index.js";
-import { componentDefinition as componentDefinition$53 } from "../core/shaders/Kaleidoscope/index.js";
-import { componentDefinition as componentDefinition$54 } from "../core/shaders/LensFlare/index.js";
-import { componentDefinition as componentDefinition$55 } from "../core/shaders/LinearBlur/index.js";
-import { componentDefinition as componentDefinition$56 } from "../core/shaders/LinearGradient/index.js";
-import { componentDefinition as componentDefinition$57 } from "../core/shaders/Liquify/index.js";
-import { componentDefinition as componentDefinition$58 } from "../core/shaders/Mirror/index.js";
-import { componentDefinition as componentDefinition$59 } from "../core/shaders/MultiPointGradient/index.js";
-import { componentDefinition as componentDefinition$60 } from "../core/shaders/Neon/index.js";
-import { componentDefinition as componentDefinition$61 } from "../core/shaders/Paper/index.js";
-import { componentDefinition as componentDefinition$62 } from "../core/shaders/Perspective/index.js";
-import { componentDefinition as componentDefinition$63 } from "../core/shaders/Pixelate/index.js";
-import { componentDefinition as componentDefinition$64 } from "../core/shaders/Plasma/index.js";
-import { componentDefinition as componentDefinition$65 } from "../core/shaders/PolarCoordinates/index.js";
-import { componentDefinition as componentDefinition$66 } from "../core/shaders/Polygon/index.js";
-import { componentDefinition as componentDefinition$67 } from "../core/shaders/Posterize/index.js";
-import { componentDefinition as componentDefinition$68 } from "../core/shaders/ProgressiveBlur/index.js";
-import { componentDefinition as componentDefinition$69 } from "../core/shaders/RadialGradient/index.js";
-import { componentDefinition as componentDefinition$70 } from "../core/shaders/RectangularCoordinates/index.js";
-import { componentDefinition as componentDefinition$71 } from "../core/shaders/Ring/index.js";
-import { componentDefinition as componentDefinition$72 } from "../core/shaders/Ripples/index.js";
-import { componentDefinition as componentDefinition$73 } from "../core/shaders/RoundedRect/index.js";
-import { componentDefinition as componentDefinition$74 } from "../core/shaders/Saturation/index.js";
-import { componentDefinition as componentDefinition$75 } from "../core/shaders/Sharpness/index.js";
-import { componentDefinition as componentDefinition$76 } from "../core/shaders/Shatter/index.js";
-import { componentDefinition as componentDefinition$77 } from "../core/shaders/SimplexNoise/index.js";
-import { componentDefinition as componentDefinition$78 } from "../core/shaders/SineWave/index.js";
-import { componentDefinition as componentDefinition$79 } from "../core/shaders/Smoke/index.js";
-import { componentDefinition as componentDefinition$80 } from "../core/shaders/SmokeFill/index.js";
-import { componentDefinition as componentDefinition$81 } from "../core/shaders/Solarize/index.js";
-import { componentDefinition as componentDefinition$82 } from "../core/shaders/SolidColor/index.js";
-import { componentDefinition as componentDefinition$83 } from "../core/shaders/Spherize/index.js";
-import { componentDefinition as componentDefinition$84 } from "../core/shaders/Spiral/index.js";
-import { componentDefinition as componentDefinition$85 } from "../core/shaders/Star/index.js";
-import { componentDefinition as componentDefinition$86 } from "../core/shaders/Strands/index.js";
-import { componentDefinition as componentDefinition$87 } from "../core/shaders/Stretch/index.js";
-import { componentDefinition as componentDefinition$88 } from "../core/shaders/Stripes/index.js";
-import { componentDefinition as componentDefinition$89 } from "../core/shaders/StudioBackground/index.js";
-import { componentDefinition as componentDefinition$90 } from "../core/shaders/Swirl/index.js";
-import { componentDefinition as componentDefinition$91 } from "../core/shaders/TiltShift/index.js";
-import { componentDefinition as componentDefinition$92 } from "../core/shaders/Tint/index.js";
-import { componentDefinition as componentDefinition$93 } from "../core/shaders/Trapezoid/index.js";
-import { componentDefinition as componentDefinition$94 } from "../core/shaders/Tritone/index.js";
-import { componentDefinition as componentDefinition$95 } from "../core/shaders/Truchet/index.js";
-import { componentDefinition as componentDefinition$96 } from "../core/shaders/Twirl/index.js";
-import { componentDefinition as componentDefinition$97 } from "../core/shaders/VHS/index.js";
-import { componentDefinition as componentDefinition$98 } from "../core/shaders/Vesica/index.js";
-import { componentDefinition as componentDefinition$99 } from "../core/shaders/Vibrance/index.js";
-import { componentDefinition as componentDefinition$100 } from "../core/shaders/VideoTexture/index.js";
-import { componentDefinition as componentDefinition$101 } from "../core/shaders/Vignette/index.js";
-import { componentDefinition as componentDefinition$102 } from "../core/shaders/Voronoi/index.js";
-import { componentDefinition as componentDefinition$103 } from "../core/shaders/WaveDistortion/index.js";
-import { componentDefinition as componentDefinition$104 } from "../core/shaders/Weave/index.js";
-import { componentDefinition as componentDefinition$105 } from "../core/shaders/WebcamTexture/index.js";
-import { componentDefinition as componentDefinition$106 } from "../core/shaders/ZoomBlur/index.js";
+import { componentDefinition as componentDefinition$37 } from "../core/shaders/FlutedGlass/index.js";
+import { componentDefinition as componentDefinition$38 } from "../core/shaders/Fog/index.js";
+import { componentDefinition as componentDefinition$39 } from "../core/shaders/Form3D/index.js";
+import { componentDefinition as componentDefinition$40 } from "../core/shaders/Glass/index.js";
+import { componentDefinition as componentDefinition$41 } from "../core/shaders/GlassTiles/index.js";
+import { componentDefinition as componentDefinition$42 } from "../core/shaders/Glitch/index.js";
+import { componentDefinition as componentDefinition$43 } from "../core/shaders/Glow/index.js";
+import { componentDefinition as componentDefinition$44 } from "../core/shaders/Godrays/index.js";
+import { componentDefinition as componentDefinition$45 } from "../core/shaders/Grayscale/index.js";
+import { componentDefinition as componentDefinition$46 } from "../core/shaders/Grid/index.js";
+import { componentDefinition as componentDefinition$47 } from "../core/shaders/GridDistortion/index.js";
+import { componentDefinition as componentDefinition$48 } from "../core/shaders/Group/index.js";
+import { componentDefinition as componentDefinition$49 } from "../core/shaders/Halftone/index.js";
+import { componentDefinition as componentDefinition$50 } from "../core/shaders/HexGrid/index.js";
+import { componentDefinition as componentDefinition$51 } from "../core/shaders/HueShift/index.js";
+import { componentDefinition as componentDefinition$52 } from "../core/shaders/ImageTexture/index.js";
+import { componentDefinition as componentDefinition$53 } from "../core/shaders/Invert/index.js";
+import { componentDefinition as componentDefinition$54 } from "../core/shaders/Kaleidoscope/index.js";
+import { componentDefinition as componentDefinition$55 } from "../core/shaders/LensFlare/index.js";
+import { componentDefinition as componentDefinition$56 } from "../core/shaders/LinearBlur/index.js";
+import { componentDefinition as componentDefinition$57 } from "../core/shaders/LinearGradient/index.js";
+import { componentDefinition as componentDefinition$58 } from "../core/shaders/Liquify/index.js";
+import { componentDefinition as componentDefinition$59 } from "../core/shaders/Mirror/index.js";
+import { componentDefinition as componentDefinition$60 } from "../core/shaders/MultiPointGradient/index.js";
+import { componentDefinition as componentDefinition$61 } from "../core/shaders/Neon/index.js";
+import { componentDefinition as componentDefinition$62 } from "../core/shaders/Paper/index.js";
+import { componentDefinition as componentDefinition$63 } from "../core/shaders/Perspective/index.js";
+import { componentDefinition as componentDefinition$64 } from "../core/shaders/Pixelate/index.js";
+import { componentDefinition as componentDefinition$65 } from "../core/shaders/Plasma/index.js";
+import { componentDefinition as componentDefinition$66 } from "../core/shaders/PolarCoordinates/index.js";
+import { componentDefinition as componentDefinition$67 } from "../core/shaders/Polygon/index.js";
+import { componentDefinition as componentDefinition$68 } from "../core/shaders/Posterize/index.js";
+import { componentDefinition as componentDefinition$69 } from "../core/shaders/ProgressiveBlur/index.js";
+import { componentDefinition as componentDefinition$70 } from "../core/shaders/RadialGradient/index.js";
+import { componentDefinition as componentDefinition$71 } from "../core/shaders/RectangularCoordinates/index.js";
+import { componentDefinition as componentDefinition$72 } from "../core/shaders/Ring/index.js";
+import { componentDefinition as componentDefinition$73 } from "../core/shaders/Ripples/index.js";
+import { componentDefinition as componentDefinition$74 } from "../core/shaders/RoundedRect/index.js";
+import { componentDefinition as componentDefinition$75 } from "../core/shaders/Saturation/index.js";
+import { componentDefinition as componentDefinition$76 } from "../core/shaders/Sharpness/index.js";
+import { componentDefinition as componentDefinition$77 } from "../core/shaders/Shatter/index.js";
+import { componentDefinition as componentDefinition$78 } from "../core/shaders/SimplexNoise/index.js";
+import { componentDefinition as componentDefinition$79 } from "../core/shaders/SineWave/index.js";
+import { componentDefinition as componentDefinition$80 } from "../core/shaders/Smoke/index.js";
+import { componentDefinition as componentDefinition$81 } from "../core/shaders/SmokeFill/index.js";
+import { componentDefinition as componentDefinition$82 } from "../core/shaders/Solarize/index.js";
+import { componentDefinition as componentDefinition$83 } from "../core/shaders/SolidColor/index.js";
+import { componentDefinition as componentDefinition$84 } from "../core/shaders/Spherize/index.js";
+import { componentDefinition as componentDefinition$85 } from "../core/shaders/Spiral/index.js";
+import { componentDefinition as componentDefinition$86 } from "../core/shaders/Star/index.js";
+import { componentDefinition as componentDefinition$87 } from "../core/shaders/Strands/index.js";
+import { componentDefinition as componentDefinition$88 } from "../core/shaders/Stretch/index.js";
+import { componentDefinition as componentDefinition$89 } from "../core/shaders/Stripes/index.js";
+import { componentDefinition as componentDefinition$90 } from "../core/shaders/StudioBackground/index.js";
+import { componentDefinition as componentDefinition$91 } from "../core/shaders/Swirl/index.js";
+import { componentDefinition as componentDefinition$92 } from "../core/shaders/TiltShift/index.js";
+import { componentDefinition as componentDefinition$93 } from "../core/shaders/Tint/index.js";
+import { componentDefinition as componentDefinition$94 } from "../core/shaders/Trapezoid/index.js";
+import { componentDefinition as componentDefinition$95 } from "../core/shaders/Tritone/index.js";
+import { componentDefinition as componentDefinition$96 } from "../core/shaders/Truchet/index.js";
+import { componentDefinition as componentDefinition$97 } from "../core/shaders/Twirl/index.js";
+import { componentDefinition as componentDefinition$98 } from "../core/shaders/VHS/index.js";
+import { componentDefinition as componentDefinition$99 } from "../core/shaders/Vesica/index.js";
+import { componentDefinition as componentDefinition$100 } from "../core/shaders/Vibrance/index.js";
+import { componentDefinition as componentDefinition$101 } from "../core/shaders/VideoTexture/index.js";
+import { componentDefinition as componentDefinition$102 } from "../core/shaders/Vignette/index.js";
+import { componentDefinition as componentDefinition$103 } from "../core/shaders/Voronoi/index.js";
+import { componentDefinition as componentDefinition$104 } from "../core/shaders/WaveDistortion/index.js";
+import { componentDefinition as componentDefinition$105 } from "../core/shaders/Weave/index.js";
+import { componentDefinition as componentDefinition$106 } from "../core/shaders/WebcamTexture/index.js";
+import { componentDefinition as componentDefinition$107 } from "../core/shaders/ZoomBlur/index.js";
 import { vec4 } from "three/tsl";
 import { isExternalUser, startTelemetry } from "../core/telemetry/index.js";
-var root_2$106 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$107 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$107 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$108 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function AngularBlur($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -279,7 +280,7 @@ function AngularBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$107();
+	var fragment = root$108();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -292,7 +293,7 @@ function AngularBlur($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$106();
+		var canvas = root_2$107();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -311,8 +312,8 @@ function AngularBlur($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$105 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$106 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$106 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$107 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Ascii($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -477,7 +478,7 @@ function Ascii($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$106();
+	var fragment = root$107();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -490,7 +491,7 @@ function Ascii($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$105();
+		var canvas = root_2$106();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -509,8 +510,8 @@ function Ascii($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$104 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$105 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$105 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$106 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Aurora($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -675,7 +676,7 @@ function Aurora($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$105();
+	var fragment = root$106();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -688,7 +689,7 @@ function Aurora($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$104();
+		var canvas = root_2$105();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -707,8 +708,8 @@ function Aurora($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$103 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$104 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$104 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$105 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Beam($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -873,7 +874,7 @@ function Beam($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$104();
+	var fragment = root$105();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -886,7 +887,7 @@ function Beam($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$103();
+		var canvas = root_2$104();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -905,8 +906,8 @@ function Beam($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$102 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$103 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$103 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$104 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Blob($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -1071,7 +1072,7 @@ function Blob($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$103();
+	var fragment = root$104();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -1084,7 +1085,7 @@ function Blob($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$102();
+		var canvas = root_2$103();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -1103,8 +1104,8 @@ function Blob($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$101 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$102 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$102 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$103 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Blur($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -1269,7 +1270,7 @@ function Blur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$102();
+	var fragment = root$103();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -1282,7 +1283,7 @@ function Blur($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$101();
+		var canvas = root_2$102();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -1301,8 +1302,8 @@ function Blur($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$100 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$101 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$101 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$102 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function BrightnessContrast($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -1467,7 +1468,7 @@ function BrightnessContrast($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$101();
+	var fragment = root$102();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -1480,7 +1481,7 @@ function BrightnessContrast($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$100();
+		var canvas = root_2$101();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -1499,8 +1500,8 @@ function BrightnessContrast($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$99 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$100 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$100 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$101 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Bulge($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -1665,7 +1666,7 @@ function Bulge($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$100();
+	var fragment = root$101();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -1678,7 +1679,7 @@ function Bulge($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$99();
+		var canvas = root_2$100();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -1697,8 +1698,8 @@ function Bulge($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$98 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$99 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$99 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$100 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function CRTScreen($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -1863,7 +1864,7 @@ function CRTScreen($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$99();
+	var fragment = root$100();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -1876,7 +1877,7 @@ function CRTScreen($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$98();
+		var canvas = root_2$99();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -1895,8 +1896,8 @@ function CRTScreen($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$97 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$98 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$98 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$99 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function ChannelBlur($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -2061,7 +2062,7 @@ function ChannelBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$98();
+	var fragment = root$99();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -2074,7 +2075,7 @@ function ChannelBlur($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$97();
+		var canvas = root_2$98();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -2093,8 +2094,8 @@ function ChannelBlur($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$96 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$97 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$97 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$98 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Checkerboard($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -2259,7 +2260,7 @@ function Checkerboard($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$97();
+	var fragment = root$98();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -2272,7 +2273,7 @@ function Checkerboard($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$96();
+		var canvas = root_2$97();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -2291,8 +2292,8 @@ function Checkerboard($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$95 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$96 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$96 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$97 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function ChromaFlow($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -2457,7 +2458,7 @@ function ChromaFlow($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$96();
+	var fragment = root$97();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -2470,7 +2471,7 @@ function ChromaFlow($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$95();
+		var canvas = root_2$96();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -2489,8 +2490,8 @@ function ChromaFlow($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$94 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$95 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$95 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$96 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function ChromaticAberration($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -2655,7 +2656,7 @@ function ChromaticAberration($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$95();
+	var fragment = root$96();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -2668,7 +2669,7 @@ function ChromaticAberration($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$94();
+		var canvas = root_2$95();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -2687,8 +2688,8 @@ function ChromaticAberration($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$93 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$94 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$94 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$95 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Circle($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -2853,7 +2854,7 @@ function Circle($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$94();
+	var fragment = root$95();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -2866,7 +2867,7 @@ function Circle($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$93();
+		var canvas = root_2$94();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -2885,8 +2886,8 @@ function Circle($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$92 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$93 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$93 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$94 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function ConcentricSpin($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -3051,7 +3052,7 @@ function ConcentricSpin($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$93();
+	var fragment = root$94();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -3064,7 +3065,7 @@ function ConcentricSpin($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$92();
+		var canvas = root_2$93();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -3083,8 +3084,8 @@ function ConcentricSpin($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$91 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$92 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$92 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$93 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function ConicGradient($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -3249,7 +3250,7 @@ function ConicGradient($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$92();
+	var fragment = root$93();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -3262,7 +3263,7 @@ function ConicGradient($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$91();
+		var canvas = root_2$92();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -3281,8 +3282,8 @@ function ConicGradient($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$90 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$91 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$91 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$92 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function ContourLines($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -3447,7 +3448,7 @@ function ContourLines($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$91();
+	var fragment = root$92();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -3460,7 +3461,7 @@ function ContourLines($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$90();
+		var canvas = root_2$91();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -3479,8 +3480,8 @@ function ContourLines($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$89 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$90 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$90 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$91 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Crescent($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -3645,7 +3646,7 @@ function Crescent($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$90();
+	var fragment = root$91();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -3658,7 +3659,7 @@ function Crescent($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$89();
+		var canvas = root_2$90();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -3677,8 +3678,8 @@ function Crescent($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$88 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$89 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$89 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$90 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Cross($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -3843,7 +3844,7 @@ function Cross($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$89();
+	var fragment = root$90();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -3856,7 +3857,7 @@ function Cross($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$88();
+		var canvas = root_2$89();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -3875,8 +3876,8 @@ function Cross($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$87 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$88 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$88 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$89 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Crystal($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -4041,7 +4042,7 @@ function Crystal($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$88();
+	var fragment = root$89();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -4054,7 +4055,7 @@ function Crystal($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$87();
+		var canvas = root_2$88();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -4073,8 +4074,8 @@ function Crystal($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$86 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$87 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$87 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$88 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function CursorRipples($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -4239,7 +4240,7 @@ function CursorRipples($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$87();
+	var fragment = root$88();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -4252,7 +4253,7 @@ function CursorRipples($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$86();
+		var canvas = root_2$87();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -4271,8 +4272,8 @@ function CursorRipples($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$85 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$86 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$86 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$87 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function CursorTrail($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -4437,7 +4438,7 @@ function CursorTrail($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$86();
+	var fragment = root$87();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -4450,7 +4451,7 @@ function CursorTrail($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$85();
+		var canvas = root_2$86();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -4469,8 +4470,8 @@ function CursorTrail($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$84 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$85 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$85 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$86 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function DOMTexture($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -4635,7 +4636,7 @@ function DOMTexture($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$85();
+	var fragment = root$86();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -4648,7 +4649,7 @@ function DOMTexture($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$84();
+		var canvas = root_2$85();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -4667,8 +4668,8 @@ function DOMTexture($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$83 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$84 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$84 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$85 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function DiamondGradient($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -4833,7 +4834,7 @@ function DiamondGradient($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$84();
+	var fragment = root$85();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -4846,7 +4847,7 @@ function DiamondGradient($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$83();
+		var canvas = root_2$84();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -4865,8 +4866,8 @@ function DiamondGradient($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$82 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$83 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$83 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$84 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function DiffuseBlur($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -5031,7 +5032,7 @@ function DiffuseBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$83();
+	var fragment = root$84();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -5044,7 +5045,7 @@ function DiffuseBlur($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$82();
+		var canvas = root_2$83();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -5063,8 +5064,8 @@ function DiffuseBlur($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$81 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$82 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$82 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$83 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Dither($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -5229,7 +5230,7 @@ function Dither($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$82();
+	var fragment = root$83();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -5242,7 +5243,7 @@ function Dither($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$81();
+		var canvas = root_2$82();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -5261,8 +5262,8 @@ function Dither($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$80 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$81 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$81 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$82 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function DotGrid($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -5427,7 +5428,7 @@ function DotGrid($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$81();
+	var fragment = root$82();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -5440,7 +5441,7 @@ function DotGrid($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$80();
+		var canvas = root_2$81();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -5459,8 +5460,8 @@ function DotGrid($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$79 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$80 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$80 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$81 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function DropShadow($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -5625,7 +5626,7 @@ function DropShadow($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$80();
+	var fragment = root$81();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -5638,7 +5639,7 @@ function DropShadow($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$79();
+		var canvas = root_2$80();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -5657,8 +5658,8 @@ function DropShadow($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$78 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$79 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$79 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$80 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Duotone($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -5823,7 +5824,7 @@ function Duotone($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$79();
+	var fragment = root$80();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -5836,7 +5837,7 @@ function Duotone($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$78();
+		var canvas = root_2$79();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -5855,8 +5856,8 @@ function Duotone($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$77 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$78 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$78 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$79 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Ellipse($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -6021,7 +6022,7 @@ function Ellipse($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$78();
+	var fragment = root$79();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -6034,7 +6035,7 @@ function Ellipse($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$77();
+		var canvas = root_2$78();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -6053,8 +6054,8 @@ function Ellipse($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$76 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$77 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$77 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$78 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Emboss($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -6219,7 +6220,7 @@ function Emboss($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$77();
+	var fragment = root$78();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -6232,7 +6233,7 @@ function Emboss($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$76();
+		var canvas = root_2$77();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -6251,8 +6252,8 @@ function Emboss($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$75 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$76 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$76 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$77 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function FallingLines($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -6417,7 +6418,7 @@ function FallingLines($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$76();
+	var fragment = root$77();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -6430,7 +6431,7 @@ function FallingLines($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$75();
+		var canvas = root_2$76();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -6449,8 +6450,8 @@ function FallingLines($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$74 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$75 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$75 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$76 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function FilmGrain($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -6615,7 +6616,7 @@ function FilmGrain($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$75();
+	var fragment = root$76();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -6628,7 +6629,7 @@ function FilmGrain($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$74();
+		var canvas = root_2$75();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -6647,8 +6648,8 @@ function FilmGrain($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$73 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$74 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$74 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$75 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function FloatingParticles($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -6813,7 +6814,7 @@ function FloatingParticles($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$74();
+	var fragment = root$75();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -6826,7 +6827,7 @@ function FloatingParticles($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$73();
+		var canvas = root_2$74();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -6845,8 +6846,8 @@ function FloatingParticles($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$72 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$73 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$73 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$74 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function FlowField($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -7011,7 +7012,7 @@ function FlowField($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$73();
+	var fragment = root$74();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -7024,7 +7025,7 @@ function FlowField($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$72();
+		var canvas = root_2$73();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -7043,8 +7044,8 @@ function FlowField($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$71 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$72 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$72 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$73 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function Flower($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -7209,7 +7210,7 @@ function Flower($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$72();
+	var fragment = root$73();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -7222,7 +7223,7 @@ function Flower($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$71();
+		var canvas = root_2$72();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -7241,8 +7242,8 @@ function Flower($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$70 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$71 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+var root_2$71 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$72 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
 function FlowingGradient($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
@@ -7407,7 +7408,7 @@ function FlowingGradient($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$71();
+	var fragment = root$72();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -7420,7 +7421,7 @@ function FlowingGradient($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$70();
+		var canvas = root_2$71();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -7439,9 +7440,9 @@ function FlowingGradient($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$69 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$70 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Fog($$anchor, $$props) {
+var root_2$70 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$71 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function FlutedGlass($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$37.experimental && !_experimentalWarnedOnce) {
@@ -7605,7 +7606,7 @@ function Fog($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$70();
+	var fragment = root$71();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -7618,7 +7619,7 @@ function Fog($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$69();
+		var canvas = root_2$70();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -7637,9 +7638,9 @@ function Fog($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$68 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$69 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Form3D($$anchor, $$props) {
+var root_2$69 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$70 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Fog($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$38.experimental && !_experimentalWarnedOnce) {
@@ -7803,7 +7804,7 @@ function Form3D($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$69();
+	var fragment = root$70();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -7816,7 +7817,7 @@ function Form3D($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$68();
+		var canvas = root_2$69();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -7835,9 +7836,9 @@ function Form3D($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$67 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$68 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Glass($$anchor, $$props) {
+var root_2$68 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$69 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Form3D($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$39.experimental && !_experimentalWarnedOnce) {
@@ -8001,7 +8002,7 @@ function Glass($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$68();
+	var fragment = root$69();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -8014,7 +8015,7 @@ function Glass($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$67();
+		var canvas = root_2$68();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -8033,9 +8034,9 @@ function Glass($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$66 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$67 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function GlassTiles($$anchor, $$props) {
+var root_2$67 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$68 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Glass($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$40.experimental && !_experimentalWarnedOnce) {
@@ -8199,7 +8200,7 @@ function GlassTiles($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$67();
+	var fragment = root$68();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -8212,7 +8213,7 @@ function GlassTiles($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$66();
+		var canvas = root_2$67();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -8231,9 +8232,9 @@ function GlassTiles($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$65 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$66 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Glitch($$anchor, $$props) {
+var root_2$66 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$67 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function GlassTiles($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$41.experimental && !_experimentalWarnedOnce) {
@@ -8397,7 +8398,7 @@ function Glitch($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$66();
+	var fragment = root$67();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -8410,7 +8411,7 @@ function Glitch($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$65();
+		var canvas = root_2$66();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -8429,9 +8430,9 @@ function Glitch($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$64 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$65 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Glow($$anchor, $$props) {
+var root_2$65 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$66 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Glitch($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$42.experimental && !_experimentalWarnedOnce) {
@@ -8595,7 +8596,7 @@ function Glow($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$65();
+	var fragment = root$66();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -8608,7 +8609,7 @@ function Glow($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$64();
+		var canvas = root_2$65();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -8627,9 +8628,9 @@ function Glow($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$63 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$64 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Godrays($$anchor, $$props) {
+var root_2$64 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$65 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Glow($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$43.experimental && !_experimentalWarnedOnce) {
@@ -8793,7 +8794,7 @@ function Godrays($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$64();
+	var fragment = root$65();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -8806,7 +8807,7 @@ function Godrays($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$63();
+		var canvas = root_2$64();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -8825,9 +8826,9 @@ function Godrays($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$62 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$63 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Grayscale($$anchor, $$props) {
+var root_2$63 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$64 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Godrays($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$44.experimental && !_experimentalWarnedOnce) {
@@ -8991,7 +8992,7 @@ function Grayscale($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$63();
+	var fragment = root$64();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -9004,7 +9005,7 @@ function Grayscale($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$62();
+		var canvas = root_2$63();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -9023,9 +9024,9 @@ function Grayscale($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$61 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$62 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Grid($$anchor, $$props) {
+var root_2$62 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$63 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Grayscale($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$45.experimental && !_experimentalWarnedOnce) {
@@ -9189,7 +9190,7 @@ function Grid($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$62();
+	var fragment = root$63();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -9202,7 +9203,7 @@ function Grid($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$61();
+		var canvas = root_2$62();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -9221,9 +9222,9 @@ function Grid($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$60 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$61 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function GridDistortion($$anchor, $$props) {
+var root_2$61 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$62 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Grid($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$46.experimental && !_experimentalWarnedOnce) {
@@ -9387,7 +9388,7 @@ function GridDistortion($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$61();
+	var fragment = root$62();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -9400,7 +9401,7 @@ function GridDistortion($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$60();
+		var canvas = root_2$61();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -9419,9 +9420,9 @@ function GridDistortion($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$59 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$60 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Group($$anchor, $$props) {
+var root_2$60 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$61 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function GridDistortion($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$47.experimental && !_experimentalWarnedOnce) {
@@ -9585,7 +9586,7 @@ function Group($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$60();
+	var fragment = root$61();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -9598,7 +9599,7 @@ function Group($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$59();
+		var canvas = root_2$60();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -9617,9 +9618,9 @@ function Group($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$58 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$59 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Halftone($$anchor, $$props) {
+var root_2$59 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$60 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Group($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$48.experimental && !_experimentalWarnedOnce) {
@@ -9783,7 +9784,7 @@ function Halftone($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$59();
+	var fragment = root$60();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -9796,7 +9797,7 @@ function Halftone($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$58();
+		var canvas = root_2$59();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -9815,9 +9816,9 @@ function Halftone($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$57 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$58 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function HexGrid($$anchor, $$props) {
+var root_2$58 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$59 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Halftone($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$49.experimental && !_experimentalWarnedOnce) {
@@ -9981,7 +9982,7 @@ function HexGrid($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$58();
+	var fragment = root$59();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -9994,7 +9995,7 @@ function HexGrid($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$57();
+		var canvas = root_2$58();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -10013,9 +10014,9 @@ function HexGrid($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$56 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$57 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function HueShift($$anchor, $$props) {
+var root_2$57 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$58 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function HexGrid($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$50.experimental && !_experimentalWarnedOnce) {
@@ -10179,7 +10180,7 @@ function HueShift($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$57();
+	var fragment = root$58();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -10192,7 +10193,7 @@ function HueShift($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$56();
+		var canvas = root_2$57();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -10211,9 +10212,9 @@ function HueShift($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$55 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$56 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function ImageTexture($$anchor, $$props) {
+var root_2$56 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$57 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function HueShift($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$51.experimental && !_experimentalWarnedOnce) {
@@ -10377,7 +10378,7 @@ function ImageTexture($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$56();
+	var fragment = root$57();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -10390,7 +10391,7 @@ function ImageTexture($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$55();
+		var canvas = root_2$56();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -10409,9 +10410,9 @@ function ImageTexture($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$54 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$55 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Invert($$anchor, $$props) {
+var root_2$55 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$56 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function ImageTexture($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$52.experimental && !_experimentalWarnedOnce) {
@@ -10575,7 +10576,7 @@ function Invert($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$55();
+	var fragment = root$56();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -10588,7 +10589,7 @@ function Invert($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$54();
+		var canvas = root_2$55();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -10607,9 +10608,9 @@ function Invert($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$53 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$54 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Kaleidoscope($$anchor, $$props) {
+var root_2$54 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$55 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Invert($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$53.experimental && !_experimentalWarnedOnce) {
@@ -10773,7 +10774,7 @@ function Kaleidoscope($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$54();
+	var fragment = root$55();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -10786,7 +10787,7 @@ function Kaleidoscope($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$53();
+		var canvas = root_2$54();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -10805,9 +10806,9 @@ function Kaleidoscope($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$52 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$53 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function LensFlare($$anchor, $$props) {
+var root_2$53 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$54 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Kaleidoscope($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$54.experimental && !_experimentalWarnedOnce) {
@@ -10971,7 +10972,7 @@ function LensFlare($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$53();
+	var fragment = root$54();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -10984,7 +10985,7 @@ function LensFlare($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$52();
+		var canvas = root_2$53();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -11003,9 +11004,9 @@ function LensFlare($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$51 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$52 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function LinearBlur($$anchor, $$props) {
+var root_2$52 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$53 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function LensFlare($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$55.experimental && !_experimentalWarnedOnce) {
@@ -11169,7 +11170,7 @@ function LinearBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$52();
+	var fragment = root$53();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -11182,7 +11183,7 @@ function LinearBlur($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$51();
+		var canvas = root_2$52();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -11201,9 +11202,9 @@ function LinearBlur($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$50 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$51 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function LinearGradient($$anchor, $$props) {
+var root_2$51 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$52 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function LinearBlur($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$56.experimental && !_experimentalWarnedOnce) {
@@ -11367,7 +11368,7 @@ function LinearGradient($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$51();
+	var fragment = root$52();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -11380,7 +11381,7 @@ function LinearGradient($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$50();
+		var canvas = root_2$51();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -11399,9 +11400,9 @@ function LinearGradient($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$49 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$50 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Liquify($$anchor, $$props) {
+var root_2$50 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$51 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function LinearGradient($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$57.experimental && !_experimentalWarnedOnce) {
@@ -11565,7 +11566,7 @@ function Liquify($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$50();
+	var fragment = root$51();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -11578,7 +11579,7 @@ function Liquify($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$49();
+		var canvas = root_2$50();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -11597,9 +11598,9 @@ function Liquify($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$48 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$49 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Mirror($$anchor, $$props) {
+var root_2$49 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$50 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Liquify($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$58.experimental && !_experimentalWarnedOnce) {
@@ -11763,7 +11764,7 @@ function Mirror($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$49();
+	var fragment = root$50();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -11776,7 +11777,7 @@ function Mirror($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$48();
+		var canvas = root_2$49();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -11795,9 +11796,9 @@ function Mirror($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$47 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$48 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function MultiPointGradient($$anchor, $$props) {
+var root_2$48 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$49 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Mirror($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$59.experimental && !_experimentalWarnedOnce) {
@@ -11961,7 +11962,7 @@ function MultiPointGradient($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$48();
+	var fragment = root$49();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -11974,7 +11975,7 @@ function MultiPointGradient($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$47();
+		var canvas = root_2$48();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -11993,9 +11994,9 @@ function MultiPointGradient($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$46 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$47 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Neon($$anchor, $$props) {
+var root_2$47 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$48 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function MultiPointGradient($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$60.experimental && !_experimentalWarnedOnce) {
@@ -12159,7 +12160,7 @@ function Neon($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$47();
+	var fragment = root$48();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -12172,7 +12173,7 @@ function Neon($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$46();
+		var canvas = root_2$47();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -12191,9 +12192,9 @@ function Neon($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$45 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$46 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Paper($$anchor, $$props) {
+var root_2$46 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$47 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Neon($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$61.experimental && !_experimentalWarnedOnce) {
@@ -12357,7 +12358,7 @@ function Paper($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$46();
+	var fragment = root$47();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -12370,7 +12371,7 @@ function Paper($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$45();
+		var canvas = root_2$46();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -12389,9 +12390,9 @@ function Paper($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$44 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$45 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Perspective($$anchor, $$props) {
+var root_2$45 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$46 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Paper($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$62.experimental && !_experimentalWarnedOnce) {
@@ -12555,7 +12556,7 @@ function Perspective($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$45();
+	var fragment = root$46();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -12568,7 +12569,7 @@ function Perspective($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$44();
+		var canvas = root_2$45();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -12587,9 +12588,9 @@ function Perspective($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$43 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$44 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Pixelate($$anchor, $$props) {
+var root_2$44 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$45 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Perspective($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$63.experimental && !_experimentalWarnedOnce) {
@@ -12753,7 +12754,7 @@ function Pixelate($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$44();
+	var fragment = root$45();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -12766,7 +12767,7 @@ function Pixelate($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$43();
+		var canvas = root_2$44();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -12785,9 +12786,9 @@ function Pixelate($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$42 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$43 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Plasma($$anchor, $$props) {
+var root_2$43 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$44 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Pixelate($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$64.experimental && !_experimentalWarnedOnce) {
@@ -12951,7 +12952,7 @@ function Plasma($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$43();
+	var fragment = root$44();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -12964,7 +12965,7 @@ function Plasma($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$42();
+		var canvas = root_2$43();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -12983,9 +12984,9 @@ function Plasma($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$41 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$42 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function PolarCoordinates($$anchor, $$props) {
+var root_2$42 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$43 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Plasma($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$65.experimental && !_experimentalWarnedOnce) {
@@ -13149,7 +13150,7 @@ function PolarCoordinates($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$42();
+	var fragment = root$43();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -13162,7 +13163,7 @@ function PolarCoordinates($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$41();
+		var canvas = root_2$42();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -13181,9 +13182,9 @@ function PolarCoordinates($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$40 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$41 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Polygon($$anchor, $$props) {
+var root_2$41 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$42 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function PolarCoordinates($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$66.experimental && !_experimentalWarnedOnce) {
@@ -13347,7 +13348,7 @@ function Polygon($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$41();
+	var fragment = root$42();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -13360,7 +13361,7 @@ function Polygon($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$40();
+		var canvas = root_2$41();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -13379,9 +13380,9 @@ function Polygon($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$39 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$40 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Posterize($$anchor, $$props) {
+var root_2$40 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$41 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Polygon($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$67.experimental && !_experimentalWarnedOnce) {
@@ -13545,7 +13546,7 @@ function Posterize($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$40();
+	var fragment = root$41();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -13558,7 +13559,7 @@ function Posterize($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$39();
+		var canvas = root_2$40();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -13577,9 +13578,9 @@ function Posterize($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$38 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$39 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function ProgressiveBlur($$anchor, $$props) {
+var root_2$39 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$40 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Posterize($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$68.experimental && !_experimentalWarnedOnce) {
@@ -13743,7 +13744,7 @@ function ProgressiveBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$39();
+	var fragment = root$40();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -13756,7 +13757,7 @@ function ProgressiveBlur($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$38();
+		var canvas = root_2$39();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -13775,9 +13776,9 @@ function ProgressiveBlur($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$37 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$38 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function RadialGradient($$anchor, $$props) {
+var root_2$38 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$39 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function ProgressiveBlur($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$69.experimental && !_experimentalWarnedOnce) {
@@ -13941,7 +13942,7 @@ function RadialGradient($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$38();
+	var fragment = root$39();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -13954,7 +13955,7 @@ function RadialGradient($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$37();
+		var canvas = root_2$38();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -13973,9 +13974,9 @@ function RadialGradient($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$36 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$37 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function RectangularCoordinates($$anchor, $$props) {
+var root_2$37 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$38 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function RadialGradient($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$70.experimental && !_experimentalWarnedOnce) {
@@ -14139,7 +14140,7 @@ function RectangularCoordinates($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$37();
+	var fragment = root$38();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -14152,7 +14153,7 @@ function RectangularCoordinates($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$36();
+		var canvas = root_2$37();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -14171,9 +14172,9 @@ function RectangularCoordinates($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$35 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$36 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Ring($$anchor, $$props) {
+var root_2$36 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$37 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function RectangularCoordinates($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$71.experimental && !_experimentalWarnedOnce) {
@@ -14337,7 +14338,7 @@ function Ring($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$36();
+	var fragment = root$37();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -14350,7 +14351,7 @@ function Ring($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$35();
+		var canvas = root_2$36();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -14369,9 +14370,9 @@ function Ring($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$34 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$35 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Ripples($$anchor, $$props) {
+var root_2$35 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$36 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Ring($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$72.experimental && !_experimentalWarnedOnce) {
@@ -14535,7 +14536,7 @@ function Ripples($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$35();
+	var fragment = root$36();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -14548,7 +14549,7 @@ function Ripples($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$34();
+		var canvas = root_2$35();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -14567,9 +14568,9 @@ function Ripples($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$33 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$34 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function RoundedRect($$anchor, $$props) {
+var root_2$34 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$35 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Ripples($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$73.experimental && !_experimentalWarnedOnce) {
@@ -14733,7 +14734,7 @@ function RoundedRect($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$34();
+	var fragment = root$35();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -14746,7 +14747,7 @@ function RoundedRect($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$33();
+		var canvas = root_2$34();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -14765,9 +14766,9 @@ function RoundedRect($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$32 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$33 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Saturation($$anchor, $$props) {
+var root_2$33 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$34 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function RoundedRect($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$74.experimental && !_experimentalWarnedOnce) {
@@ -14931,7 +14932,7 @@ function Saturation($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$33();
+	var fragment = root$34();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -14944,7 +14945,7 @@ function Saturation($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$32();
+		var canvas = root_2$33();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -14963,9 +14964,9 @@ function Saturation($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$31 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$32 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Sharpness($$anchor, $$props) {
+var root_2$32 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$33 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Saturation($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$75.experimental && !_experimentalWarnedOnce) {
@@ -15129,7 +15130,7 @@ function Sharpness($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$32();
+	var fragment = root$33();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -15142,7 +15143,7 @@ function Sharpness($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$31();
+		var canvas = root_2$32();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -15161,9 +15162,9 @@ function Sharpness($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$30 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$31 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Shatter($$anchor, $$props) {
+var root_2$31 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$32 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Sharpness($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$76.experimental && !_experimentalWarnedOnce) {
@@ -15327,7 +15328,7 @@ function Shatter($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$31();
+	var fragment = root$32();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -15340,7 +15341,7 @@ function Shatter($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$30();
+		var canvas = root_2$31();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -15359,9 +15360,9 @@ function Shatter($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$29 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$30 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function SimplexNoise($$anchor, $$props) {
+var root_2$30 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$31 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Shatter($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$77.experimental && !_experimentalWarnedOnce) {
@@ -15525,7 +15526,7 @@ function SimplexNoise($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$30();
+	var fragment = root$31();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -15538,7 +15539,7 @@ function SimplexNoise($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$29();
+		var canvas = root_2$30();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -15557,9 +15558,9 @@ function SimplexNoise($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$28 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$29 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function SineWave($$anchor, $$props) {
+var root_2$29 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$30 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function SimplexNoise($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$78.experimental && !_experimentalWarnedOnce) {
@@ -15723,7 +15724,7 @@ function SineWave($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$29();
+	var fragment = root$30();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -15736,7 +15737,7 @@ function SineWave($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$28();
+		var canvas = root_2$29();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -15755,9 +15756,9 @@ function SineWave($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$27 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$28 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Smoke($$anchor, $$props) {
+var root_2$28 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$29 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function SineWave($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$79.experimental && !_experimentalWarnedOnce) {
@@ -15921,7 +15922,7 @@ function Smoke($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$28();
+	var fragment = root$29();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -15934,7 +15935,7 @@ function Smoke($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$27();
+		var canvas = root_2$28();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -15953,9 +15954,9 @@ function Smoke($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$26 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$27 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function SmokeFill($$anchor, $$props) {
+var root_2$27 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$28 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Smoke($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$80.experimental && !_experimentalWarnedOnce) {
@@ -16119,7 +16120,7 @@ function SmokeFill($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$27();
+	var fragment = root$28();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -16132,7 +16133,7 @@ function SmokeFill($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$26();
+		var canvas = root_2$27();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -16151,9 +16152,9 @@ function SmokeFill($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$25 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$26 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Solarize($$anchor, $$props) {
+var root_2$26 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$27 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function SmokeFill($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$81.experimental && !_experimentalWarnedOnce) {
@@ -16317,7 +16318,7 @@ function Solarize($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$26();
+	var fragment = root$27();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -16330,7 +16331,7 @@ function Solarize($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$25();
+		var canvas = root_2$26();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -16349,9 +16350,9 @@ function Solarize($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$24 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$25 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function SolidColor($$anchor, $$props) {
+var root_2$25 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$26 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Solarize($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$82.experimental && !_experimentalWarnedOnce) {
@@ -16515,7 +16516,7 @@ function SolidColor($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$25();
+	var fragment = root$26();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -16528,7 +16529,7 @@ function SolidColor($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$24();
+		var canvas = root_2$25();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -16547,9 +16548,9 @@ function SolidColor($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$23 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$24 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Spherize($$anchor, $$props) {
+var root_2$24 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$25 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function SolidColor($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$83.experimental && !_experimentalWarnedOnce) {
@@ -16713,7 +16714,7 @@ function Spherize($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$24();
+	var fragment = root$25();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -16726,7 +16727,7 @@ function Spherize($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$23();
+		var canvas = root_2$24();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -16745,9 +16746,9 @@ function Spherize($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$22 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$23 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Spiral($$anchor, $$props) {
+var root_2$23 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$24 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Spherize($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$84.experimental && !_experimentalWarnedOnce) {
@@ -16911,7 +16912,7 @@ function Spiral($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$23();
+	var fragment = root$24();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -16924,7 +16925,7 @@ function Spiral($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$22();
+		var canvas = root_2$23();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -16943,9 +16944,9 @@ function Spiral($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$21 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$22 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Star($$anchor, $$props) {
+var root_2$22 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$23 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Spiral($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$85.experimental && !_experimentalWarnedOnce) {
@@ -17109,7 +17110,7 @@ function Star($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$22();
+	var fragment = root$23();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -17122,7 +17123,7 @@ function Star($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$21();
+		var canvas = root_2$22();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -17141,9 +17142,9 @@ function Star($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$20 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$21 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Strands($$anchor, $$props) {
+var root_2$21 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$22 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Star($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$86.experimental && !_experimentalWarnedOnce) {
@@ -17307,7 +17308,7 @@ function Strands($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$21();
+	var fragment = root$22();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -17320,7 +17321,7 @@ function Strands($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$20();
+		var canvas = root_2$21();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -17339,9 +17340,9 @@ function Strands($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$19 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$20 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Stretch($$anchor, $$props) {
+var root_2$20 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$21 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Strands($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$87.experimental && !_experimentalWarnedOnce) {
@@ -17505,7 +17506,7 @@ function Stretch($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$20();
+	var fragment = root$21();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -17518,7 +17519,7 @@ function Stretch($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$19();
+		var canvas = root_2$20();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -17537,9 +17538,9 @@ function Stretch($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$18 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$19 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Stripes($$anchor, $$props) {
+var root_2$19 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$20 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Stretch($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$88.experimental && !_experimentalWarnedOnce) {
@@ -17703,7 +17704,7 @@ function Stripes($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$19();
+	var fragment = root$20();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -17716,7 +17717,7 @@ function Stripes($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$18();
+		var canvas = root_2$19();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -17735,9 +17736,9 @@ function Stripes($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$17 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$18 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function StudioBackground($$anchor, $$props) {
+var root_2$18 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$19 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Stripes($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$89.experimental && !_experimentalWarnedOnce) {
@@ -17901,7 +17902,7 @@ function StudioBackground($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$18();
+	var fragment = root$19();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -17914,7 +17915,7 @@ function StudioBackground($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$17();
+		var canvas = root_2$18();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -17933,9 +17934,9 @@ function StudioBackground($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$16 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$17 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Swirl($$anchor, $$props) {
+var root_2$17 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$18 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function StudioBackground($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$90.experimental && !_experimentalWarnedOnce) {
@@ -18099,7 +18100,7 @@ function Swirl($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$17();
+	var fragment = root$18();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -18112,7 +18113,7 @@ function Swirl($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$16();
+		var canvas = root_2$17();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -18131,9 +18132,9 @@ function Swirl($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$15 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$16 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function TiltShift($$anchor, $$props) {
+var root_2$16 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$17 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Swirl($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$91.experimental && !_experimentalWarnedOnce) {
@@ -18297,7 +18298,7 @@ function TiltShift($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$16();
+	var fragment = root$17();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -18310,7 +18311,7 @@ function TiltShift($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$15();
+		var canvas = root_2$16();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -18329,9 +18330,9 @@ function TiltShift($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$14 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$15 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Tint($$anchor, $$props) {
+var root_2$15 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$16 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function TiltShift($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$92.experimental && !_experimentalWarnedOnce) {
@@ -18495,7 +18496,7 @@ function Tint($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$15();
+	var fragment = root$16();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -18508,7 +18509,7 @@ function Tint($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$14();
+		var canvas = root_2$15();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -18527,9 +18528,9 @@ function Tint($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$13 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$14 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Trapezoid($$anchor, $$props) {
+var root_2$14 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$15 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Tint($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$93.experimental && !_experimentalWarnedOnce) {
@@ -18693,7 +18694,7 @@ function Trapezoid($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$14();
+	var fragment = root$15();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -18706,7 +18707,7 @@ function Trapezoid($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$13();
+		var canvas = root_2$14();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -18725,9 +18726,9 @@ function Trapezoid($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$12 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$13 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Tritone($$anchor, $$props) {
+var root_2$13 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$14 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Trapezoid($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$94.experimental && !_experimentalWarnedOnce) {
@@ -18891,7 +18892,7 @@ function Tritone($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$13();
+	var fragment = root$14();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -18904,7 +18905,7 @@ function Tritone($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$12();
+		var canvas = root_2$13();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -18923,9 +18924,9 @@ function Tritone($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$11 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$12 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Truchet($$anchor, $$props) {
+var root_2$12 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$13 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Tritone($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$95.experimental && !_experimentalWarnedOnce) {
@@ -19089,7 +19090,7 @@ function Truchet($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$12();
+	var fragment = root$13();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -19102,7 +19103,7 @@ function Truchet($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$11();
+		var canvas = root_2$12();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -19121,9 +19122,9 @@ function Truchet($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$10 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$11 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Twirl($$anchor, $$props) {
+var root_2$11 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$12 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Truchet($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$96.experimental && !_experimentalWarnedOnce) {
@@ -19287,7 +19288,7 @@ function Twirl($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$11();
+	var fragment = root$12();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -19300,7 +19301,7 @@ function Twirl($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$10();
+		var canvas = root_2$11();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -19319,9 +19320,9 @@ function Twirl($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$9 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$10 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function VHS($$anchor, $$props) {
+var root_2$10 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$11 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Twirl($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$97.experimental && !_experimentalWarnedOnce) {
@@ -19485,7 +19486,7 @@ function VHS($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$10();
+	var fragment = root$11();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -19498,7 +19499,7 @@ function VHS($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$9();
+		var canvas = root_2$10();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -19517,9 +19518,9 @@ function VHS($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$8 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$9 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Vesica($$anchor, $$props) {
+var root_2$9 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$10 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function VHS($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$98.experimental && !_experimentalWarnedOnce) {
@@ -19683,7 +19684,7 @@ function Vesica($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$9();
+	var fragment = root$10();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -19696,7 +19697,7 @@ function Vesica($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$8();
+		var canvas = root_2$9();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -19715,9 +19716,9 @@ function Vesica($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$7 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$8 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Vibrance($$anchor, $$props) {
+var root_2$8 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$9 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Vesica($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$99.experimental && !_experimentalWarnedOnce) {
@@ -19881,7 +19882,7 @@ function Vibrance($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$8();
+	var fragment = root$9();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -19894,7 +19895,7 @@ function Vibrance($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$7();
+		var canvas = root_2$8();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -19913,9 +19914,9 @@ function Vibrance($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$6 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$7 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function VideoTexture($$anchor, $$props) {
+var root_2$7 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$8 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Vibrance($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$100.experimental && !_experimentalWarnedOnce) {
@@ -20079,7 +20080,7 @@ function VideoTexture($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$7();
+	var fragment = root$8();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -20092,7 +20093,7 @@ function VideoTexture($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$6();
+		var canvas = root_2$7();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -20111,9 +20112,9 @@ function VideoTexture($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$5 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$6 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Vignette($$anchor, $$props) {
+var root_2$6 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$7 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function VideoTexture($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$101.experimental && !_experimentalWarnedOnce) {
@@ -20277,7 +20278,7 @@ function Vignette($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$6();
+	var fragment = root$7();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -20290,7 +20291,7 @@ function Vignette($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$5();
+		var canvas = root_2$6();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -20309,9 +20310,9 @@ function Vignette($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$4 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$5 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Voronoi($$anchor, $$props) {
+var root_2$5 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$6 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Vignette($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$102.experimental && !_experimentalWarnedOnce) {
@@ -20475,7 +20476,7 @@ function Voronoi($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$5();
+	var fragment = root$6();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -20488,7 +20489,7 @@ function Voronoi($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$4();
+		var canvas = root_2$5();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -20507,9 +20508,9 @@ function Voronoi($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$3 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$4 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function WaveDistortion($$anchor, $$props) {
+var root_2$4 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$5 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Voronoi($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$103.experimental && !_experimentalWarnedOnce) {
@@ -20673,7 +20674,7 @@ function WaveDistortion($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$4();
+	var fragment = root$5();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -20686,7 +20687,7 @@ function WaveDistortion($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$3();
+		var canvas = root_2$4();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -20705,9 +20706,9 @@ function WaveDistortion($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$2 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$3 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function Weave($$anchor, $$props) {
+var root_2$3 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$4 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function WaveDistortion($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$104.experimental && !_experimentalWarnedOnce) {
@@ -20871,7 +20872,7 @@ function Weave($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$3();
+	var fragment = root$4();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -20884,7 +20885,7 @@ function Weave($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$2();
+		var canvas = root_2$3();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -20903,9 +20904,9 @@ function Weave($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2$1 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$2 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function WebcamTexture($$anchor, $$props) {
+var root_2$2 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$3 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function Weave($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$105.experimental && !_experimentalWarnedOnce) {
@@ -21069,7 +21070,7 @@ function WebcamTexture($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
-	var fragment = root$2();
+	var fragment = root$3();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
 	var consequent = ($$anchor$1) => {
@@ -21082,7 +21083,7 @@ function WebcamTexture($$anchor, $$props) {
 	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
 	var node_2 = $.sibling(span, 2);
 	var consequent_1 = ($$anchor$1) => {
-		var canvas = root_2$1();
+		var canvas = root_2$2();
 		var node_3 = $.child(canvas);
 		children?.(node_3);
 		$.reset(canvas);
@@ -21101,9 +21102,9 @@ function WebcamTexture($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-var root_2 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
-var root$1 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
-function ZoomBlur($$anchor, $$props) {
+var root_2$1 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$2 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function WebcamTexture($$anchor, $$props) {
 	$.push($$props, true);
 	let _experimentalWarnedOnce = false;
 	if (componentDefinition$106.experimental && !_experimentalWarnedOnce) {
@@ -21267,6 +21268,204 @@ function ZoomBlur($$anchor, $$props) {
 		$.set(isRegistered, false);
 		parentRegister(instanceId, null, null, null, null);
 	});
+	var fragment = root$2();
+	var span = $.first_child(fragment);
+	var node_1 = $.child(span);
+	var consequent = ($$anchor$1) => {
+		children?.($$anchor$1);
+	};
+	$.if(node_1, ($$render) => {
+		if (!isCapturesDOM) $$render(consequent);
+	});
+	$.reset(span);
+	$.bind_this(span, ($$value) => orderMarker = $$value, () => orderMarker);
+	var node_2 = $.sibling(span, 2);
+	var consequent_1 = ($$anchor$1) => {
+		var canvas = root_2$1();
+		var node_3 = $.child(canvas);
+		children?.(node_3);
+		$.reset(canvas);
+		$.action(canvas, ($$node) => teleportToBody?.($$node));
+		$.bind_this(canvas, ($$value) => captureCanvas = $$value, () => captureCanvas);
+		$.template_effect(() => {
+			$.set_attribute(canvas, "width", $.get(captureW));
+			$.set_attribute(canvas, "height", $.get(captureH));
+		});
+		$.append($$anchor$1, canvas);
+	};
+	$.if(node_2, ($$render) => {
+		if (isCapturesDOM) $$render(consequent_1);
+	});
+	$.template_effect(() => $.set_attribute(span, "data-shader-id", instanceId));
+	$.append($$anchor, fragment);
+	$.pop();
+}
+var root_2 = $.from_html(`<canvas layoutsubtree="" style="position:fixed;inset:0;width:100vw;height:100vh;z-index:-9999"><!></canvas>`);
+var root$1 = $.from_html(`<span style="display:contents"><!></span> <!>`, 1);
+function ZoomBlur($$anchor, $$props) {
+	$.push($$props, true);
+	let _experimentalWarnedOnce = false;
+	if (componentDefinition$107.experimental && !_experimentalWarnedOnce) {
+		_experimentalWarnedOnce = true;
+		const _e = componentDefinition$107.experimental;
+		console.info(`%c⚠ [Shaders] ${componentDefinition$107.name} is experimental: ${_e.message}`, "color: #f59e0b; font-weight: bold");
+	}
+	function isPropDriver(value) {
+		return typeof value === "object" && value !== null && "type" in value && (value.type === "map" || value.type === "mouse" || value.type === "mouse-position" || value.type === "auto-animate");
+	}
+	const DEFAULT_TRANSFORM = {
+		offsetX: 0,
+		offsetY: 0,
+		rotation: 0,
+		scale: 1,
+		anchorX: .5,
+		anchorY: .5,
+		edges: "transparent"
+	};
+	const componentDefaults = {
+		blendMode: "normal",
+		visible: true,
+		...Object.entries(componentDefinition$107.props).reduce((acc, [key, config]) => {
+			acc[key] = config.default;
+			return acc;
+		}, {})
+	};
+	const props = $.rest_props($$props, [
+		"$$slots",
+		"$$events",
+		"$$legacy"
+	]);
+	const blendMode = $.derived(() => $$props.blendMode ?? componentDefaults.blendMode);
+	const opacity = $.derived(() => $$props.opacity);
+	const visible = $.derived(() => $$props.visible ?? componentDefaults.visible);
+	const id = $.derived(() => $$props.id);
+	const maskSource = $.derived(() => $$props.maskSource);
+	const maskType = $.derived(() => $$props.maskType);
+	const renderOrder = $.derived(() => $$props.renderOrder);
+	const { children } = props;
+	const mapsFromProps = $.derived(() => {
+		const maps = {};
+		for (const key of Object.keys(componentDefinition$107.props)) {
+			const val = props[key];
+			if (isPropDriver(val)) maps[key] = val;
+		}
+		return Object.keys(maps).length > 0 ? maps : void 0;
+	});
+	const effectiveTransform = $.derived(() => ({
+		...DEFAULT_TRANSFORM,
+		...$$props.transform
+	}));
+	const parentId = getContext("shaderParentId");
+	if (parentId === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
+	const instanceId = ($.get(id) ? $.get(id).replace(/[^a-zA-Z0-9_]/g, "_") : null) || Math.random().toString(36).substring(2, 10);
+	setContext("shaderParentId", instanceId);
+	const shaderReadyProps = $.derived(() => {
+		let baseProps = { ...componentDefaults };
+		for (const key in props) if (key !== "blendMode" && key !== "opacity" && key !== "visible" && key !== "id" && key !== "maskSource" && key !== "maskType" && key !== "renderOrder" && key !== "transform" && key !== "children") {
+			const propValue = props[key];
+			if (isPropDriver(propValue)) continue;
+			const defaultValue = componentDefaults[key];
+			if (propValue !== void 0 && propValue !== defaultValue) baseProps[key] = propValue;
+		}
+		return baseProps;
+	});
+	const shaderColorSpace = getContext("shaderColorSpace");
+	if (shaderColorSpace) setColorSpaceMode(shaderColorSpace());
+	const uniforms = createUniformsMap(componentDefinition$107, $.get(shaderReadyProps), instanceId);
+	const parentRegister = getContext("shaderNodeRegister");
+	if (parentRegister === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
+	const parentUniformUpdate = getContext("shaderUniformUpdate");
+	if (parentUniformUpdate === void 0) throw new Error("Shader components require shaderUniformUpdate from parent");
+	const parentMetadataUpdate = getContext("shaderMetadataUpdate");
+	if (parentMetadataUpdate === void 0) throw new Error("Shader components require shaderMetadataUpdate from parent");
+	const isCapturesDOM = !!componentDefinition$107.capturesDOM;
+	let captureCanvas;
+	let captureW = $.state($.proxy(typeof window !== "undefined" ? Math.round(window.innerWidth * Math.min(window.devicePixelRatio, 2)) : 0));
+	let captureH = $.state($.proxy(typeof window !== "undefined" ? Math.round(window.innerHeight * Math.min(window.devicePixelRatio, 2)) : 0));
+	function teleportToBody(node) {
+		document.body.appendChild(node);
+		return { destroy() {
+			node.remove();
+		} };
+	}
+	if (isCapturesDOM) {
+		const onWinResize = () => {
+			const d = Math.min(window.devicePixelRatio, 2);
+			$.set(captureW, Math.round(window.innerWidth * d), true);
+			$.set(captureH, Math.round(window.innerHeight * d), true);
+		};
+		onMount(() => {
+			window.addEventListener("resize", onWinResize);
+		});
+		onDestroy(() => {
+			window.removeEventListener("resize", onWinResize);
+		});
+	}
+	let orderMarker;
+	let detectedRenderOrder = void 0;
+	let isRegistered = $.state(false);
+	Object.entries(uniforms).forEach(([propName, { uniform, transform }]) => {
+		$.user_effect(() => {
+			if (!$.get(isRegistered)) return;
+			if (uniform && uniform.value !== void 0) {
+				const newValue = props[propName];
+				if (newValue !== void 0 && !isPropDriver(newValue)) parentUniformUpdate(instanceId, propName, newValue);
+			}
+		});
+	});
+	$.user_effect(() => {
+		if (!$.get(isRegistered)) return;
+		parentMetadataUpdate(instanceId, {
+			blendMode: $.get(blendMode),
+			opacity: $.get(opacity),
+			visible: $.get(visible) === false ? false : true,
+			id: $.get(id),
+			mask: $.get(maskSource) ? {
+				source: $.get(maskSource),
+				type: $.get(maskType) || "alpha"
+			} : void 0,
+			maps: $.get(mapsFromProps),
+			renderOrder: $.get(renderOrder) ?? detectedRenderOrder,
+			transform: $.get(effectiveTransform)
+		});
+	});
+	onMount(() => {
+		if (componentDefinition$107 && typeof componentDefinition$107.fragmentNode === "function") {
+			parentRegister(instanceId, componentDefinition$107.fragmentNode, parentId, {
+				blendMode: $.get(blendMode),
+				opacity: $.get(opacity),
+				visible: $.get(visible) !== false ? true : false,
+				id: $.get(id),
+				mask: $.get(maskSource) ? {
+					source: $.get(maskSource),
+					type: $.get(maskType) || "alpha"
+				} : void 0,
+				maps: $.get(mapsFromProps),
+				renderOrder: $.get(renderOrder) ?? detectedRenderOrder,
+				transform: $.get(effectiveTransform)
+			}, uniforms, componentDefinition$107, isCapturesDOM ? captureCanvas : void 0);
+			$.set(isRegistered, true);
+			if ($.get(renderOrder) === void 0 && orderMarker) {
+				const parent = orderMarker.parentElement;
+				if (parent) {
+					const siblings = parent.querySelectorAll(":scope > [data-shader-id]");
+					const position = Array.from(siblings).indexOf(orderMarker);
+					if (position >= 0) {
+						detectedRenderOrder = position;
+						parentMetadataUpdate(instanceId, { renderOrder: position });
+					}
+				}
+			}
+		} else console.error("componentDefinition.fragmentNode is not a function:", {
+			componentDefinition: componentDefinition$107,
+			fragmentNode: componentDefinition$107?.fragmentNode,
+			type: typeof componentDefinition$107?.fragmentNode
+		});
+	});
+	onDestroy(() => {
+		$.set(isRegistered, false);
+		parentRegister(instanceId, null, null, null, null);
+	});
 	var fragment = root$1();
 	var span = $.first_child(fragment);
 	var node_1 = $.child(span);
@@ -21342,7 +21541,7 @@ function Shader($$anchor, $$props) {
 		const checkRendering = () => {
 			if (!rendererInstance) return;
 			if (rendererInstance.getPerformanceStats().fps > 0) {
-				telemetryCollector = startTelemetry(rendererInstance, "2.5.110", disableTelemetry(), isPreview());
+				telemetryCollector = startTelemetry(rendererInstance, "2.5.112", disableTelemetry(), isPreview());
 				if (telemetryCollector) telemetryCollector.start();
 				telemetryStartTimeout = null;
 			} else telemetryStartTimeout = window.setTimeout(checkRendering, 500);
@@ -21561,6 +21760,7 @@ function Preview($$anchor, $$props) {
 		FlowField,
 		Flower,
 		FlowingGradient,
+		FlutedGlass,
 		Fog,
 		Form3D,
 		Glass,
@@ -21781,4 +21981,4 @@ function Preview($$anchor, $$props) {
 	$.append($$anchor, fragment);
 	$.pop();
 }
-export { AngularBlur, Ascii, Aurora, Beam, Blob, Blur, BrightnessContrast, Bulge, CRTScreen, ChannelBlur, Checkerboard, ChromaFlow, ChromaticAberration, Circle, ConcentricSpin, ConicGradient, ContourLines, Crescent, Cross, Crystal, CursorRipples, CursorTrail, DOMTexture, DiamondGradient, DiffuseBlur, Dither, DotGrid, DropShadow, Duotone, Ellipse, Emboss, FallingLines, FilmGrain, FloatingParticles, FlowField, Flower, FlowingGradient, Fog, Form3D, Glass, GlassTiles, Glitch, Glow, Godrays, Grayscale, Grid, GridDistortion, Group, Halftone, HexGrid, HueShift, ImageTexture, Invert, Kaleidoscope, LensFlare, LinearBlur, LinearGradient, Liquify, Mirror, MultiPointGradient, Neon, Paper, Perspective, Pixelate, Plasma, PolarCoordinates, Polygon, Posterize, Preview, ProgressiveBlur, RadialGradient, RectangularCoordinates, Ring, Ripples, RoundedRect, Saturation, Shader, Sharpness, Shatter, SimplexNoise, SineWave, Smoke, SmokeFill, Solarize, SolidColor, Spherize, Spiral, Star, Strands, Stretch, Stripes, StudioBackground, Swirl, TiltShift, Tint, Trapezoid, Tritone, Truchet, Twirl, VHS, Vesica, Vibrance, VideoTexture, Vignette, Voronoi, WaveDistortion, Weave, WebcamTexture, ZoomBlur, generatePresetCode };
+export { AngularBlur, Ascii, Aurora, Beam, Blob, Blur, BrightnessContrast, Bulge, CRTScreen, ChannelBlur, Checkerboard, ChromaFlow, ChromaticAberration, Circle, ConcentricSpin, ConicGradient, ContourLines, Crescent, Cross, Crystal, CursorRipples, CursorTrail, DOMTexture, DiamondGradient, DiffuseBlur, Dither, DotGrid, DropShadow, Duotone, Ellipse, Emboss, FallingLines, FilmGrain, FloatingParticles, FlowField, Flower, FlowingGradient, FlutedGlass, Fog, Form3D, Glass, GlassTiles, Glitch, Glow, Godrays, Grayscale, Grid, GridDistortion, Group, Halftone, HexGrid, HueShift, ImageTexture, Invert, Kaleidoscope, LensFlare, LinearBlur, LinearGradient, Liquify, Mirror, MultiPointGradient, Neon, Paper, Perspective, Pixelate, Plasma, PolarCoordinates, Polygon, Posterize, Preview, ProgressiveBlur, RadialGradient, RectangularCoordinates, Ring, Ripples, RoundedRect, Saturation, Shader, Sharpness, Shatter, SimplexNoise, SineWave, Smoke, SmokeFill, Solarize, SolidColor, Spherize, Spiral, Star, Strands, Stretch, Stripes, StudioBackground, Swirl, TiltShift, Tint, Trapezoid, Tritone, Truchet, Twirl, VHS, Vesica, Vibrance, VideoTexture, Vignette, Voronoi, WaveDistortion, Weave, WebcamTexture, ZoomBlur, generatePresetCode };