shaders 3.2.464 → 3.2.465

package/dist/registry.js

@@ -25016,110 +25016,242 @@ export const shaderRegistry = [
     }
   },
   {
-    "name": "IsometricCubes",
-    "category": "Textures",
-    "description": "Isometric tumbling-blocks tiling — a 3D cube illusion (rhombille pattern)",
-    "fileName": "IsometricCubes",
+    "name": "Irradiance",
+    "category": "Shape Effects",
+    "description": "Photorealistic light spilling around the edge of any 2D, SVG, or 3D shape — any number of movable coloured point lights strike the silhouette and the lit edges irradiate their surroundings, gathered in a compute pass with real cast shadows, mixing where they meet and burning to white at the rim",
+    "fileName": "Irradiance",
     "definition": {
-      "name": "IsometricCubes",
+      "name": "Irradiance",
       "boundingBoxDeclaration": {
-        "aspectRatio": null,
-        "supportsResizeFit": true
+        "propBindings": {
+          "x": {
+            "prop": "center",
+            "as": "position-x"
+          },
+          "y": {
+            "prop": "center",
+            "as": "position-y"
+          },
+          "rotation": {
+            "prop": "rotation",
+            "as": "degrees"
+          }
+        }
+      },
+      "category": "Shape Effects",
+      "description": "Photorealistic light spilling around the edge of any 2D, SVG, or 3D shape — any number of movable coloured point lights strike the silhouette and the lit edges irradiate their surroundings, gathered in a compute pass with real cast shadows, mixing where they meet and burning to white at the rim",
+      "extraFields": {
+        "_vfOriginX": {
+          "initial": 0
+        },
+        "_vfOriginY": {
+          "initial": 0
+        },
+        "_vfSpanX": {
+          "initial": 1
+        },
+        "_vfSpanY": {
+          "initial": 1
+        },
+        "_vfActiveRes": {
+          "initial": 1
+        },
+        "_vfRBound": {
+          "initial": 0.6
+        },
+        "_saRadius": {
+          "initial": 0.35
+        },
+        "_saSides": {
+          "initial": 6
+        },
+        "_saRounding": {
+          "initial": 0
+        },
+        "_saInnerRatio": {
+          "initial": 0.4
+        },
+        "_saRotation": {
+          "initial": 0
+        },
+        "_saHeight": {
+          "initial": 0.25
+        },
+        "_saOffset": {
+          "initial": 0.2
+        },
+        "_saAperture": {
+          "initial": 270
+        }
       },
-      "category": "Textures",
-      "description": "Isometric tumbling-blocks tiling — a 3D cube illusion (rhombille pattern)",
-      "acceptsUVContext": true,
       "props": {
-        "colorA": {
-          "default": "#7c5cff",
-          "description": "Base cube color",
+        "origin": {
+          "default": "center",
+          "description": "Reference edge the center position is measured from (center default). Lets you pin the shape relative to a corner or the canvas centre.",
           "ui": {
-            "type": "color",
-            "label": "Color A",
-            "group": "Colors"
+            "type": "origin",
+            "label": "Origin",
+            "group": "Position"
           }
         },
-        "colorB": {
-          "default": "#ff5c9d",
-          "description": "Second cube color, mixed in per-cube for variation",
+        "center": {
+          "default": {
+            "x": 0.5,
+            "y": 0.5
+          },
+          "description": "Center position of the shape",
           "ui": {
-            "type": "color",
-            "label": "Color B",
-            "group": "Colors"
+            "type": "position",
+            "label": "Center",
+            "group": "Position",
+            "units": [
+              "%",
+              "px"
+            ]
           }
         },
-        "lineColor": {
-          "default": "#000000",
-          "description": "Color of the cube edge lines",
+        "scale": {
+          "default": 1,
+          "description": "Scale of the shape (1 = default size)",
           "ui": {
-            "type": "color",
-            "label": "Edges",
-            "group": "Colors"
+            "type": "range",
+            "min": 0.1,
+            "max": 3,
+            "step": 0.01,
+            "label": "Scale",
+            "group": "Position"
           }
         },
-        "cells": {
-          "default": 6,
-          "description": "Number of cubes across the shortest canvas edge",
+        "rotation": {
+          "default": 0,
+          "description": "Rotation of the shape in degrees",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 360,
+            "step": 1,
+            "label": "Rotation",
+            "group": "Position"
+          }
+        },
+        "lights": {
+          "default": [
+            {
+              "position": {
+                "x": 0.3,
+                "y": 0.3
+              },
+              "color": "#ffb347",
+              "intensity": 3
+            },
+            {
+              "position": {
+                "x": 0.72,
+                "y": 0.7
+              },
+              "color": "#7a5cff",
+              "intensity": 2
+            }
+          ],
+          "description": "The point lights striking the shape — each with its own position, colour and brightness",
+          "ui": {
+            "type": "list",
+            "label": "Lights",
+            "group": "Lights",
+            "item": {
+              "position": {
+                "kind": "position",
+                "default": {
+                  "x": 0.3,
+                  "y": 0.3
+                },
+                "label": "Position",
+                "description": "Where this light sits — the edges facing it are struck and spill light outward. Map it to the mouse to carry the light around the shape."
+              },
+              "color": {
+                "kind": "color",
+                "default": "#ffb347",
+                "label": "Color",
+                "description": "The colour this light casts"
+              },
+              "intensity": {
+                "kind": "number",
+                "default": 3,
+                "label": "Intensity",
+                "min": 0,
+                "max": 8,
+                "step": 0.01,
+                "description": "Brightness of this light — past ~2 the rim it strikes overexposes to white"
+              }
+            },
+            "maxItems": 6,
+            "minItems": 1,
+            "itemLabel": "Light"
+          }
+        },
+        "lightHeight": {
+          "default": 0.5,
+          "description": "Height of the lights above the shape plane, relative to the shape — low lights graze the body, high lights flood it evenly",
           "ui": {
             "type": [
               "range",
               "map"
             ],
-            "min": 1,
-            "max": 30,
-            "step": 1,
-            "label": "Cells",
-            "group": "Effect"
+            "min": 0.05,
+            "max": 3,
+            "step": 0.01,
+            "label": "Light Height",
+            "group": "Light"
           }
         },
-        "thickness": {
-          "default": 1,
-          "description": "Thickness of the cube edge lines (0 = no edges)",
+        "lightRange": {
+          "default": 1.2,
+          "description": "Reach of each light — the distance at which it has fallen to half strength, relative to the shape",
           "ui": {
             "type": [
               "range",
               "map"
             ],
-            "min": 0,
-            "max": 10,
-            "step": 0.1,
-            "label": "Thickness",
-            "group": "Effect"
+            "min": 0.1,
+            "max": 4,
+            "step": 0.01,
+            "label": "Range",
+            "group": "Light"
           }
         },
-        "rotation": {
-          "default": 0,
-          "description": "Rotation of the tiling in degrees",
+        "reach": {
+          "default": 3,
+          "description": "How far from the shape the spilled light is gathered, relative to the shape — the glow fades out toward this distance",
           "ui": {
             "type": [
               "range",
               "map"
             ],
-            "min": 0,
-            "max": 360,
-            "step": 1,
-            "label": "Rotation",
-            "group": "Effect"
+            "min": 0.5,
+            "max": 8,
+            "step": 0.01,
+            "label": "Reach",
+            "group": "Glow"
           }
         },
-        "softness": {
-          "default": 0,
-          "description": "Softness of the edge lines (0 = crisp, 1 = very soft)",
+        "core": {
+          "default": 1,
+          "description": "The lit edge seen directly — the white-hot line along the rim where the lights strike",
           "ui": {
             "type": [
               "range",
               "map"
             ],
             "min": 0,
-            "max": 1,
+            "max": 2,
             "step": 0.01,
-            "label": "Softness",
-            "group": "Effect"
+            "label": "Core",
+            "group": "Glow"
           }
         },
-        "colorVariation": {
-          "default": 1,
-          "description": "Per-cube random blend between the two colors (0 = uniform cubes, the clean 3D look)",
+        "wrap": {
+          "default": 0.1,
+          "description": "How far light wraps around edges that face away from it — 0 leaves the far side dark",
           "ui": {
             "type": [
               "range",
@@ -25128,122 +25260,276 @@ export const shaderRegistry = [
             "min": 0,
             "max": 1,
             "step": 0.01,
-            "label": "Variation",
-            "group": "Colors"
+            "label": "Wrap",
+            "group": "Glow"
           }
         },
-        "colorSpace": {
-          "default": "linear",
+        "shadows": {
+          "default": true,
           "compileTime": true,
-          "description": "Color space for color interpolation",
+          "description": "Cast shadows — the body blocks each light from edges it stands in front of (keeps holes and concave pockets dark)",
           "ui": {
-            "type": "select",
-            "options": [
-              {
-                "label": "Linear RGB",
-                "value": "linear"
-              },
-              {
-                "label": "OKLCh",
-                "value": "oklch"
-              },
-              {
-                "label": "OKLAB",
-                "value": "oklab"
-              },
-              {
-                "label": "HSL",
-                "value": "hsl"
-              },
-              {
-                "label": "HSV",
-                "value": "hsv"
-              },
-              {
-                "label": "LCH",
-                "value": "lch"
-              }
+            "type": "checkbox",
+            "label": "Shadows",
+            "group": "Glow"
+          }
+        },
+        "shadowSoftness": {
+          "default": 0.15,
+          "description": "Penumbra width of the cast shadows — 0 is razor sharp",
+          "ui": {
+            "type": [
+              "range",
+              "map"
             ],
-            "label": "Color Space",
-            "group": "Colors"
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Shadow Softness",
+            "group": "Glow"
           }
-        }
-      }
-    },
-    "propsMetadata": {
-      "colorA": {
-        "ui": {
-          "type": "color",
-          "label": "Color A",
-          "group": "Colors"
         },
-        "default": "#7c5cff",
-        "description": "Base cube color"
+        "bodyColor": {
+          "default": "#000000",
+          "description": "Color of the shape itself — black for a pure occluder, lighter to see the lights land on its form",
+          "ui": {
+            "type": "color",
+            "label": "Body Color",
+            "group": "Body"
+          }
+        },
+        "bodyLight": {
+          "default": 0.6,
+          "description": "How much the lights illuminate the body — the bevel of a flat shape or the form of a 3D one",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 2,
+            "step": 0.01,
+            "label": "Body Light",
+            "group": "Body"
+          }
+        },
+        "bevelWidth": {
+          "default": 0.01,
+          "description": "Width of the rounded edge a flat shape catches the light on, relative to the shape",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0.005,
+            "max": 0.2,
+            "step": 0.001,
+            "label": "Bevel Width",
+            "group": "Body"
+          }
+        },
+        "edgeSoftness": {
+          "default": 0.05,
+          "description": "Softness of the shape boundary edge",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Edge Softness",
+            "group": "Body"
+          }
+        },
+        "shape": {
+          "default": "{\"type\":\"circleSDF\",\"radius\":0.35}",
+          "description": "Serialized shape configuration (JSON)",
+          "ui": {
+            "type": "shape",
+            "label": "Shape",
+            "group": "Shape"
+          }
+        },
+        "shapeSdfUrl": {
+          "default": "",
+          "compileTime": true,
+          "description": "URL to a pre-generated SDF .bin file"
+        },
+        "shapeType": {
+          "default": "",
+          "compileTime": true,
+          "description": "Active SDF shape type"
+        }
+      }
+    },
+    "propsMetadata": {
+      "origin": {
+        "ui": {
+          "type": "origin",
+          "label": "Origin",
+          "group": "Position"
+        },
+        "default": "center",
+        "description": "Reference edge the center position is measured from (center default). Lets you pin the shape relative to a corner or the canvas centre."
       },
-      "colorB": {
+      "center": {
         "ui": {
-          "type": "color",
-          "label": "Color B",
-          "group": "Colors"
+          "type": "position",
+          "label": "Center",
+          "group": "Position",
+          "units": [
+            "%",
+            "px"
+          ]
         },
-        "default": "#ff5c9d",
-        "description": "Second cube color, mixed in per-cube for variation"
+        "default": {
+          "x": 0.5,
+          "y": 0.5
+        },
+        "description": "Center position of the shape"
       },
-      "lineColor": {
+      "scale": {
         "ui": {
-          "type": "color",
-          "label": "Edges",
-          "group": "Colors"
+          "type": "range",
+          "min": 0.1,
+          "max": 3,
+          "step": 0.01,
+          "label": "Scale",
+          "group": "Position"
         },
-        "default": "#000000",
-        "description": "Color of the cube edge lines"
+        "default": 1,
+        "description": "Scale of the shape (1 = default size)"
       },
-      "cells": {
+      "rotation": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 360,
+          "step": 1,
+          "label": "Rotation",
+          "group": "Position"
+        },
+        "default": 0,
+        "description": "Rotation of the shape in degrees"
+      },
+      "lights": {
+        "ui": {
+          "type": "list",
+          "label": "Lights",
+          "group": "Lights",
+          "item": {
+            "position": {
+              "kind": "position",
+              "default": {
+                "x": 0.3,
+                "y": 0.3
+              },
+              "label": "Position",
+              "description": "Where this light sits — the edges facing it are struck and spill light outward. Map it to the mouse to carry the light around the shape."
+            },
+            "color": {
+              "kind": "color",
+              "default": "#ffb347",
+              "label": "Color",
+              "description": "The colour this light casts"
+            },
+            "intensity": {
+              "kind": "number",
+              "default": 3,
+              "label": "Intensity",
+              "min": 0,
+              "max": 8,
+              "step": 0.01,
+              "description": "Brightness of this light — past ~2 the rim it strikes overexposes to white"
+            }
+          },
+          "maxItems": 6,
+          "minItems": 1,
+          "itemLabel": "Light"
+        },
+        "default": [
+          {
+            "position": {
+              "x": 0.3,
+              "y": 0.3
+            },
+            "color": "#ffb347",
+            "intensity": 3
+          },
+          {
+            "position": {
+              "x": 0.72,
+              "y": 0.7
+            },
+            "color": "#7a5cff",
+            "intensity": 2
+          }
+        ],
+        "description": "The point lights striking the shape — each with its own position, colour and brightness"
+      },
+      "lightHeight": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
-          "min": 1,
-          "max": 30,
-          "step": 1,
-          "label": "Cells",
-          "group": "Effect"
+          "min": 0.05,
+          "max": 3,
+          "step": 0.01,
+          "label": "Light Height",
+          "group": "Light"
         },
-        "default": 6,
-        "description": "Number of cubes across the shortest canvas edge"
+        "default": 0.5,
+        "description": "Height of the lights above the shape plane, relative to the shape — low lights graze the body, high lights flood it evenly"
       },
-      "thickness": {
+      "lightRange": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
-          "min": 0,
-          "max": 10,
-          "step": 0.1,
-          "label": "Thickness",
-          "group": "Effect"
+          "min": 0.1,
+          "max": 4,
+          "step": 0.01,
+          "label": "Range",
+          "group": "Light"
         },
-        "default": 1,
-        "description": "Thickness of the cube edge lines (0 = no edges)"
+        "default": 1.2,
+        "description": "Reach of each light — the distance at which it has fallen to half strength, relative to the shape"
       },
-      "rotation": {
+      "reach": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0.5,
+          "max": 8,
+          "step": 0.01,
+          "label": "Reach",
+          "group": "Glow"
+        },
+        "default": 3,
+        "description": "How far from the shape the spilled light is gathered, relative to the shape — the glow fades out toward this distance"
+      },
+      "core": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
           "min": 0,
-          "max": 360,
-          "step": 1,
-          "label": "Rotation",
-          "group": "Effect"
+          "max": 2,
+          "step": 0.01,
+          "label": "Core",
+          "group": "Glow"
         },
-        "default": 0,
-        "description": "Rotation of the tiling in degrees"
+        "default": 1,
+        "description": "The lit edge seen directly — the white-hot line along the rim where the lights strike"
       },
-      "softness": {
+      "wrap": {
         "ui": {
           "type": [
             "range",
@@ -25252,13 +25538,22 @@ export const shaderRegistry = [
           "min": 0,
           "max": 1,
           "step": 0.01,
-          "label": "Softness",
-          "group": "Effect"
+          "label": "Wrap",
+          "group": "Glow"
         },
-        "default": 0,
-        "description": "Softness of the edge lines (0 = crisp, 1 = very soft)"
+        "default": 0.1,
+        "description": "How far light wraps around edges that face away from it — 0 leaves the far side dark"
       },
-      "colorVariation": {
+      "shadows": {
+        "ui": {
+          "type": "checkbox",
+          "label": "Shadows",
+          "group": "Glow"
+        },
+        "default": true,
+        "description": "Cast shadows — the body blocks each light from edges it stands in front of (keeps holes and concave pockets dark)"
+      },
+      "shadowSoftness": {
         "ui": {
           "type": [
             "range",
@@ -25267,93 +25562,152 @@ export const shaderRegistry = [
           "min": 0,
           "max": 1,
           "step": 0.01,
-          "label": "Variation",
-          "group": "Colors"
+          "label": "Shadow Softness",
+          "group": "Glow"
         },
-        "default": 1,
-        "description": "Per-cube random blend between the two colors (0 = uniform cubes, the clean 3D look)"
+        "default": 0.15,
+        "description": "Penumbra width of the cast shadows — 0 is razor sharp"
       },
-      "colorSpace": {
+      "bodyColor": {
         "ui": {
-          "type": "select",
-          "options": [
-            {
-              "label": "Linear RGB",
-              "value": "linear"
-            },
-            {
-              "label": "OKLCh",
-              "value": "oklch"
-            },
-            {
-              "label": "OKLAB",
-              "value": "oklab"
-            },
-            {
-              "label": "HSL",
-              "value": "hsl"
-            },
-            {
-              "label": "HSV",
-              "value": "hsv"
-            },
-            {
-              "label": "LCH",
-              "value": "lch"
-            }
+          "type": "color",
+          "label": "Body Color",
+          "group": "Body"
+        },
+        "default": "#000000",
+        "description": "Color of the shape itself — black for a pure occluder, lighter to see the lights land on its form"
+      },
+      "bodyLight": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
           ],
-          "label": "Color Space",
-          "group": "Colors"
+          "min": 0,
+          "max": 2,
+          "step": 0.01,
+          "label": "Body Light",
+          "group": "Body"
         },
-        "default": "linear",
-        "description": "Color space for color interpolation"
-      }
-    }
+        "default": 0.6,
+        "description": "How much the lights illuminate the body — the bevel of a flat shape or the form of a 3D one"
+      },
+      "bevelWidth": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0.005,
+          "max": 0.2,
+          "step": 0.001,
+          "label": "Bevel Width",
+          "group": "Body"
+        },
+        "default": 0.01,
+        "description": "Width of the rounded edge a flat shape catches the light on, relative to the shape"
+      },
+      "edgeSoftness": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Edge Softness",
+          "group": "Body"
+        },
+        "default": 0.05,
+        "description": "Softness of the shape boundary edge"
+      },
+      "shape": {
+        "ui": {
+          "type": "shape",
+          "label": "Shape",
+          "group": "Shape"
+        },
+        "default": "{\"type\":\"circleSDF\",\"radius\":0.35}",
+        "description": "Serialized shape configuration (JSON)"
+      }
+    }
   },
   {
-    "name": "Kaleidoscope",
-    "category": "Distortions",
-    "description": "Create a kaleidoscope effect with radial mirrored segments",
-    "fileName": "Kaleidoscope",
-    "requiresChild": true,
+    "name": "IsometricCubes",
+    "category": "Textures",
+    "description": "Isometric tumbling-blocks tiling — a 3D cube illusion (rhombille pattern)",
+    "fileName": "IsometricCubes",
     "definition": {
-      "name": "Kaleidoscope",
-      "category": "Distortions",
-      "description": "Create a kaleidoscope effect with radial mirrored segments",
+      "name": "IsometricCubes",
       "boundingBoxDeclaration": {
-        "aspectRatio": null
+        "aspectRatio": null,
+        "supportsResizeFit": true
       },
+      "category": "Textures",
+      "description": "Isometric tumbling-blocks tiling — a 3D cube illusion (rhombille pattern)",
+      "acceptsUVContext": true,
       "props": {
-        "center": {
-          "default": {
-            "x": 0.5,
-            "y": 0.5
-          },
-          "description": "The center point of the kaleidoscope effect",
+        "colorA": {
+          "default": "#7c5cff",
+          "description": "Base cube color",
           "ui": {
-            "type": "position",
-            "label": "Center",
-            "group": "Position"
+            "type": "color",
+            "label": "Color A",
+            "group": "Colors"
           }
         },
-        "segments": {
+        "colorB": {
+          "default": "#ff5c9d",
+          "description": "Second cube color, mixed in per-cube for variation",
+          "ui": {
+            "type": "color",
+            "label": "Color B",
+            "group": "Colors"
+          }
+        },
+        "lineColor": {
+          "default": "#000000",
+          "description": "Color of the cube edge lines",
+          "ui": {
+            "type": "color",
+            "label": "Edges",
+            "group": "Colors"
+          }
+        },
+        "cells": {
           "default": 6,
-          "description": "Number of radial segments in the kaleidoscope",
+          "description": "Number of cubes across the shortest canvas edge",
           "ui": {
             "type": [
               "range",
               "map"
             ],
-            "min": 2,
-            "max": 24,
+            "min": 1,
+            "max": 30,
             "step": 1,
-            "label": "Segments",
+            "label": "Cells",
             "group": "Effect"
           }
         },
-        "angle": {
+        "thickness": {
+          "default": 1,
+          "description": "Thickness of the cube edge lines (0 = no edges)",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 10,
+            "step": 0.1,
+            "label": "Thickness",
+            "group": "Effect"
+          }
+        },
+        "rotation": {
           "default": 0,
-          "description": "Rotation offset for the entire kaleidoscope pattern",
+          "description": "Rotation of the tiling in degrees",
           "ui": {
             "type": [
               "range",
@@ -25362,71 +25716,137 @@ export const shaderRegistry = [
             "min": 0,
             "max": 360,
             "step": 1,
-            "label": "Angle",
+            "label": "Rotation",
             "group": "Effect"
           }
         },
-        "edges": {
-          "default": "mirror",
-          "description": "How to handle edges when distortion pushes content out of bounds",
+        "softness": {
+          "default": 0,
+          "description": "Softness of the edge lines (0 = crisp, 1 = very soft)",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Softness",
+            "group": "Effect"
+          }
+        },
+        "colorVariation": {
+          "default": 1,
+          "description": "Per-cube random blend between the two colors (0 = uniform cubes, the clean 3D look)",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Variation",
+            "group": "Colors"
+          }
+        },
+        "colorSpace": {
+          "default": "linear",
           "compileTime": true,
+          "description": "Color space for color interpolation",
           "ui": {
             "type": "select",
             "options": [
               {
-                "label": "Stretch",
-                "value": "stretch"
+                "label": "Linear RGB",
+                "value": "linear"
               },
               {
-                "label": "Transparent",
-                "value": "transparent"
+                "label": "OKLCh",
+                "value": "oklch"
               },
               {
-                "label": "Mirror",
-                "value": "mirror"
+                "label": "OKLAB",
+                "value": "oklab"
               },
               {
-                "label": "Wrap",
-                "value": "wrap"
+                "label": "HSL",
+                "value": "hsl"
+              },
+              {
+                "label": "HSV",
+                "value": "hsv"
+              },
+              {
+                "label": "LCH",
+                "value": "lch"
               }
             ],
-            "label": "Edges",
-            "group": "Effect"
+            "label": "Color Space",
+            "group": "Colors"
           }
         }
-      },
-      "requiresRTT": true,
-      "requiresChild": true
+      }
     },
     "propsMetadata": {
-      "center": {
+      "colorA": {
         "ui": {
-          "type": "position",
-          "label": "Center",
-          "group": "Position"
+          "type": "color",
+          "label": "Color A",
+          "group": "Colors"
         },
-        "default": {
-          "x": 0.5,
-          "y": 0.5
+        "default": "#7c5cff",
+        "description": "Base cube color"
+      },
+      "colorB": {
+        "ui": {
+          "type": "color",
+          "label": "Color B",
+          "group": "Colors"
         },
-        "description": "The center point of the kaleidoscope effect"
+        "default": "#ff5c9d",
+        "description": "Second cube color, mixed in per-cube for variation"
       },
-      "segments": {
+      "lineColor": {
+        "ui": {
+          "type": "color",
+          "label": "Edges",
+          "group": "Colors"
+        },
+        "default": "#000000",
+        "description": "Color of the cube edge lines"
+      },
+      "cells": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
-          "min": 2,
-          "max": 24,
+          "min": 1,
+          "max": 30,
           "step": 1,
-          "label": "Segments",
+          "label": "Cells",
           "group": "Effect"
         },
         "default": 6,
-        "description": "Number of radial segments in the kaleidoscope"
+        "description": "Number of cubes across the shortest canvas edge"
       },
-      "angle": {
+      "thickness": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 10,
+          "step": 0.1,
+          "label": "Thickness",
+          "group": "Effect"
+        },
+        "default": 1,
+        "description": "Thickness of the cube edge lines (0 = no edges)"
+      },
+      "rotation": {
         "ui": {
           "type": [
             "range",
@@ -25435,16 +25855,214 @@ export const shaderRegistry = [
           "min": 0,
           "max": 360,
           "step": 1,
-          "label": "Angle",
+          "label": "Rotation",
           "group": "Effect"
         },
         "default": 0,
-        "description": "Rotation offset for the entire kaleidoscope pattern"
+        "description": "Rotation of the tiling in degrees"
       },
-      "edges": {
+      "softness": {
         "ui": {
-          "type": "select",
-          "options": [
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Softness",
+          "group": "Effect"
+        },
+        "default": 0,
+        "description": "Softness of the edge lines (0 = crisp, 1 = very soft)"
+      },
+      "colorVariation": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Variation",
+          "group": "Colors"
+        },
+        "default": 1,
+        "description": "Per-cube random blend between the two colors (0 = uniform cubes, the clean 3D look)"
+      },
+      "colorSpace": {
+        "ui": {
+          "type": "select",
+          "options": [
+            {
+              "label": "Linear RGB",
+              "value": "linear"
+            },
+            {
+              "label": "OKLCh",
+              "value": "oklch"
+            },
+            {
+              "label": "OKLAB",
+              "value": "oklab"
+            },
+            {
+              "label": "HSL",
+              "value": "hsl"
+            },
+            {
+              "label": "HSV",
+              "value": "hsv"
+            },
+            {
+              "label": "LCH",
+              "value": "lch"
+            }
+          ],
+          "label": "Color Space",
+          "group": "Colors"
+        },
+        "default": "linear",
+        "description": "Color space for color interpolation"
+      }
+    }
+  },
+  {
+    "name": "Kaleidoscope",
+    "category": "Distortions",
+    "description": "Create a kaleidoscope effect with radial mirrored segments",
+    "fileName": "Kaleidoscope",
+    "requiresChild": true,
+    "definition": {
+      "name": "Kaleidoscope",
+      "category": "Distortions",
+      "description": "Create a kaleidoscope effect with radial mirrored segments",
+      "boundingBoxDeclaration": {
+        "aspectRatio": null
+      },
+      "props": {
+        "center": {
+          "default": {
+            "x": 0.5,
+            "y": 0.5
+          },
+          "description": "The center point of the kaleidoscope effect",
+          "ui": {
+            "type": "position",
+            "label": "Center",
+            "group": "Position"
+          }
+        },
+        "segments": {
+          "default": 6,
+          "description": "Number of radial segments in the kaleidoscope",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 2,
+            "max": 24,
+            "step": 1,
+            "label": "Segments",
+            "group": "Effect"
+          }
+        },
+        "angle": {
+          "default": 0,
+          "description": "Rotation offset for the entire kaleidoscope pattern",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 360,
+            "step": 1,
+            "label": "Angle",
+            "group": "Effect"
+          }
+        },
+        "edges": {
+          "default": "mirror",
+          "description": "How to handle edges when distortion pushes content out of bounds",
+          "compileTime": true,
+          "ui": {
+            "type": "select",
+            "options": [
+              {
+                "label": "Stretch",
+                "value": "stretch"
+              },
+              {
+                "label": "Transparent",
+                "value": "transparent"
+              },
+              {
+                "label": "Mirror",
+                "value": "mirror"
+              },
+              {
+                "label": "Wrap",
+                "value": "wrap"
+              }
+            ],
+            "label": "Edges",
+            "group": "Effect"
+          }
+        }
+      },
+      "requiresRTT": true,
+      "requiresChild": true
+    },
+    "propsMetadata": {
+      "center": {
+        "ui": {
+          "type": "position",
+          "label": "Center",
+          "group": "Position"
+        },
+        "default": {
+          "x": 0.5,
+          "y": 0.5
+        },
+        "description": "The center point of the kaleidoscope effect"
+      },
+      "segments": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 2,
+          "max": 24,
+          "step": 1,
+          "label": "Segments",
+          "group": "Effect"
+        },
+        "default": 6,
+        "description": "Number of radial segments in the kaleidoscope"
+      },
+      "angle": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 360,
+          "step": 1,
+          "label": "Angle",
+          "group": "Effect"
+        },
+        "default": 0,
+        "description": "Rotation offset for the entire kaleidoscope pattern"
+      },
+      "edges": {
+        "ui": {
+          "type": "select",
+          "options": [
             {
               "label": "Stretch",
               "value": "stretch"
@@ -33319,80 +33937,238 @@ export const shaderRegistry = [
     }
   },
   {
-    "name": "PagePeel",
-    "category": "Transitions",
-    "description": "Curl the content up from a corner like a peeling page",
-    "fileName": "PagePeel",
-    "requiresChild": true,
+    "name": "Obsidian",
+    "category": "Shape Effects",
+    "description": "Dark tinted glass whose faces stay near-black while every surface turning away from the viewer ignites with a flowing iridescent gradient — vivid colour living only on the oblique walls and bevels",
+    "fileName": "Obsidian",
     "definition": {
-      "name": "PagePeel",
-      "category": "Transitions",
-      "description": "Curl the content up from a corner like a peeling page",
+      "name": "Obsidian",
       "boundingBoxDeclaration": {
-        "aspectRatio": null
-      },
-      "props": {
-        "corner": {
-          "default": "bottom-right",
-          "description": "Which corner the page peels from",
-          "compileTime": true,
-          "ui": {
-            "type": "select",
-            "options": [
-              {
-                "label": "Top Left",
-                "value": "top-left"
-              },
-              {
-                "label": "Top Right",
-                "value": "top-right"
-              },
-              {
-                "label": "Bottom Left",
-                "value": "bottom-left"
-              },
-              {
-                "label": "Bottom Right",
-                "value": "bottom-right"
-              }
-            ],
-            "label": "Corner",
-            "group": "Effect"
+        "propBindings": {
+          "x": {
+            "prop": "center",
+            "as": "position-x"
+          },
+          "y": {
+            "prop": "center",
+            "as": "position-y"
+          },
+          "rotation": {
+            "prop": "rotation",
+            "as": "degrees"
           }
-        },
-        "amount": {
-          "default": 0.2,
-          "description": "How far the peel has progressed across the page (0 = flat, 1 = fully peeled)",
-          "ui": {
-            "type": [
-              "range",
-              "map"
-            ],
-            "min": 0,
-            "max": 1,
+        }
+      },
+      "category": "Shape Effects",
+      "description": "Dark tinted glass whose faces stay near-black while every surface turning away from the viewer ignites with a flowing iridescent gradient — vivid colour living only on the oblique walls and bevels",
+      "animatedTime": {
+        "speed": "speed"
+      },
+      "extraFields": {
+        "_vfOriginX": {
+          "initial": 0
+        },
+        "_vfOriginY": {
+          "initial": 0
+        },
+        "_vfSpanX": {
+          "initial": 1
+        },
+        "_vfSpanY": {
+          "initial": 1
+        },
+        "_vfActiveRes": {
+          "initial": 1
+        },
+        "_vfRBound": {
+          "initial": 0.6
+        },
+        "_saRadius": {
+          "initial": 0.35
+        },
+        "_saSides": {
+          "initial": 6
+        },
+        "_saRounding": {
+          "initial": 0
+        },
+        "_saInnerRatio": {
+          "initial": 0.4
+        },
+        "_saRotation": {
+          "initial": 0
+        },
+        "_saHeight": {
+          "initial": 0.25
+        },
+        "_saOffset": {
+          "initial": 0.2
+        },
+        "_saAperture": {
+          "initial": 270
+        }
+      },
+      "props": {
+        "origin": {
+          "default": "center",
+          "description": "Reference edge the center position is measured from (center default). Lets you pin the shape relative to a corner or the canvas centre.",
+          "ui": {
+            "type": "origin",
+            "label": "Origin",
+            "group": "Position"
+          }
+        },
+        "center": {
+          "default": {
+            "x": 0.5,
+            "y": 0.5
+          },
+          "description": "Center position of the glass shape",
+          "ui": {
+            "type": "position",
+            "label": "Center",
+            "group": "Position",
+            "units": [
+              "%",
+              "px"
+            ]
+          }
+        },
+        "scale": {
+          "default": 1,
+          "description": "Scale of the glass shape (1 = default size)",
+          "ui": {
+            "type": "range",
+            "min": 0.1,
+            "max": 3,
             "step": 0.01,
-            "label": "Amount",
-            "group": "Effect"
+            "label": "Scale",
+            "group": "Position"
           }
         },
-        "radius": {
-          "default": 0.2,
-          "description": "Tightness of the curl (fraction of the page diagonal)",
+        "rotation": {
+          "default": 0,
+          "description": "Rotation of the glass shape in degrees",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 360,
+            "step": 1,
+            "label": "Rotation",
+            "group": "Position"
+          }
+        },
+        "bodyColor": {
+          "default": "#06071a",
+          "description": "The dark body of the glass — what the faces looking straight at you show. Keep it deep for the iridescence to pop.",
+          "ui": {
+            "type": "color",
+            "label": "Body Color",
+            "group": "Colors"
+          }
+        },
+        "colorA": {
+          "default": "#ff2f7a",
+          "description": "First iridescent color (two-color fallback when stops are cleared)",
+          "ui": {
+            "type": "color",
+            "label": "Color A",
+            "group": "Colors"
+          }
+        },
+        "colorB": {
+          "default": "#5fe6ff",
+          "description": "Second iridescent color (two-color fallback when stops are cleared)",
+          "ui": {
+            "type": "color",
+            "label": "Color B",
+            "group": "Colors"
+          }
+        },
+        "stops": {
+          "default": [
+            {
+              "color": "#ff2f7a",
+              "position": 0
+            },
+            {
+              "color": "#2a2cff",
+              "position": 0.3
+            },
+            {
+              "color": "#5fe6ff",
+              "position": 0.55
+            },
+            {
+              "color": "#a6ffd8",
+              "position": 0.75
+            },
+            {
+              "color": "#ffb3e6",
+              "position": 1
+            }
+          ],
+          "description": "Multi-stop gradient colors (overrides Color A / Color B when set)",
+          "ui": {
+            "type": "gradient-stops",
+            "label": "Colors",
+            "group": "Colors"
+          }
+        },
+        "colorSpace": {
+          "default": "oklab",
+          "compileTime": true,
+          "description": "Color space for color interpolation",
+          "ui": {
+            "type": "select",
+            "options": [
+              {
+                "label": "Linear RGB",
+                "value": "linear"
+              },
+              {
+                "label": "OKLCh",
+                "value": "oklch"
+              },
+              {
+                "label": "OKLAB",
+                "value": "oklab"
+              },
+              {
+                "label": "HSL",
+                "value": "hsl"
+              },
+              {
+                "label": "HSV",
+                "value": "hsv"
+              },
+              {
+                "label": "LCH",
+                "value": "lch"
+              }
+            ],
+            "label": "Color Space",
+            "group": "Colors"
+          }
+        },
+        "iridescence": {
+          "default": 1,
+          "description": "Strength of the colour on the oblique surfaces — 0 = plain dark glass, above 1 = saturated neon walls",
           "ui": {
             "type": [
               "range",
               "map"
             ],
-            "min": 0.02,
-            "max": 0.4,
+            "min": 0,
+            "max": 1.5,
             "step": 0.01,
-            "label": "Curl Radius",
-            "group": "Effect"
+            "label": "Iridescence",
+            "group": "Iridescence"
           }
         },
-        "shading": {
+        "rimWidth": {
           "default": 0.55,
-          "description": "How much the underside of the curl is shaded for depth",
+          "description": "How far in from edge-on the colour reaches — small keeps it to the steepest walls, large lets it creep across gently turning faces",
           "ui": {
             "type": [
               "range",
@@ -33401,163 +34177,426 @@ export const shaderRegistry = [
             "min": 0,
             "max": 1,
             "step": 0.01,
-            "label": "Shading",
-            "group": "Effect"
+            "label": "Rim Width",
+            "group": "Iridescence"
           }
         },
-        "highlight": {
-          "default": 0.4,
-          "description": "Strength of the specular sheen running along the curl",
+        "rimSoftness": {
+          "default": 0.25,
+          "description": "Softness of the transition from dark face to coloured wall",
           "ui": {
             "type": [
               "range",
               "map"
             ],
-            "min": 0,
-            "max": 1,
+            "min": 0.02,
+            "max": 0.6,
             "step": 0.01,
-            "label": "Highlight",
-            "group": "Effect"
+            "label": "Rim Softness",
+            "group": "Iridescence"
           }
         },
-        "highlightSoftness": {
-          "default": 0.2,
-          "description": "Width of the specular highlight band (low = tight gloss, high = broad satin)",
+        "flowAngle": {
+          "default": 30,
+          "description": "Direction the gradient flows across the surface, in degrees",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 360,
+            "step": 1,
+            "label": "Flow Angle",
+            "group": "Iridescence"
+          }
+        },
+        "flowScale": {
+          "default": 1,
+          "description": "How many times the palette cycles across the shape — higher = tighter colour bands",
           "ui": {
             "type": [
               "range",
               "map"
             ],
+            "min": 0.2,
+            "max": 4,
+            "step": 0.01,
+            "label": "Flow Scale",
+            "group": "Iridescence"
+          }
+        },
+        "speed": {
+          "default": 0.5,
+          "description": "Speed the gradient flows along the walls. 0 pauses.",
+          "ui": {
+            "type": "range",
             "min": 0,
-            "max": 1,
+            "max": 4,
             "step": 0.01,
-            "label": "Highlight Softness",
-            "group": "Effect"
+            "label": "Speed",
+            "group": "Iridescence"
           }
         },
-        "shadow": {
-          "default": 1,
-          "description": "Strength of the contact shadow the curl casts on the page",
+        "gloss": {
+          "default": 0.35,
+          "description": "Strength of the studio softboxes reflected in the glass — the pale highlights riding the top edges",
           "ui": {
             "type": [
               "range",
               "map"
             ],
             "min": 0,
-            "max": 1,
+            "max": 2,
             "step": 0.01,
-            "label": "Shadow",
-            "group": "Effect"
+            "label": "Gloss",
+            "group": "Surface"
           }
-        }
-      },
-      "requiresRTT": true,
-      "requiresChild": true
-    },
-    "propsMetadata": {
-      "corner": {
-        "ui": {
-          "type": "select",
-          "options": [
-            {
-              "label": "Top Left",
-              "value": "top-left"
+        },
+        "envRotation": {
+          "default": 0,
+          "description": "Rotates the reflected studio — spins where the bright reflections fall",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 360,
+            "step": 1,
+            "label": "Env Rotation",
+            "group": "Surface"
+          }
+        },
+        "bevelWidth": {
+          "default": 0.08,
+          "description": "Width of the edge bevel on flat shapes — the band that turns away from the viewer and catches the colour",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0.005,
+            "max": 0.3,
+            "step": 0.001,
+            "label": "Bevel Width",
+            "group": "Surface"
+          }
+        },
+        "bevelShape": {
+          "default": 0,
+          "description": "Bevel profile — 0 = one smooth round fillet, 1 = machined: a steep outer fillet, a chamfer plateau and an inner knee",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Bevel Profile",
+            "group": "Surface"
+          }
+        },
+        "edgeSoftness": {
+          "default": 0.05,
+          "description": "Softness of the shape boundary edge",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Edge Softness",
+            "group": "Surface"
+          }
+        },
+        "shape": {
+          "default": "{\"type\":\"circleSDF\",\"radius\":0.35}",
+          "description": "Serialized shape configuration (JSON)",
+          "ui": {
+            "type": "shape",
+            "label": "Shape",
+            "group": "Shape"
+          }
+        },
+        "shapeSdfUrl": {
+          "default": "",
+          "compileTime": true,
+          "description": "URL to a pre-generated SDF .bin file"
+        },
+        "shapeType": {
+          "default": "",
+          "compileTime": true,
+          "description": "Active SDF shape type"
+        }
+      }
+    },
+    "propsMetadata": {
+      "origin": {
+        "ui": {
+          "type": "origin",
+          "label": "Origin",
+          "group": "Position"
+        },
+        "default": "center",
+        "description": "Reference edge the center position is measured from (center default). Lets you pin the shape relative to a corner or the canvas centre."
+      },
+      "center": {
+        "ui": {
+          "type": "position",
+          "label": "Center",
+          "group": "Position",
+          "units": [
+            "%",
+            "px"
+          ]
+        },
+        "default": {
+          "x": 0.5,
+          "y": 0.5
+        },
+        "description": "Center position of the glass shape"
+      },
+      "scale": {
+        "ui": {
+          "type": "range",
+          "min": 0.1,
+          "max": 3,
+          "step": 0.01,
+          "label": "Scale",
+          "group": "Position"
+        },
+        "default": 1,
+        "description": "Scale of the glass shape (1 = default size)"
+      },
+      "rotation": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 360,
+          "step": 1,
+          "label": "Rotation",
+          "group": "Position"
+        },
+        "default": 0,
+        "description": "Rotation of the glass shape in degrees"
+      },
+      "bodyColor": {
+        "ui": {
+          "type": "color",
+          "label": "Body Color",
+          "group": "Colors"
+        },
+        "default": "#06071a",
+        "description": "The dark body of the glass — what the faces looking straight at you show. Keep it deep for the iridescence to pop."
+      },
+      "colorA": {
+        "ui": {
+          "type": "color",
+          "label": "Color A",
+          "group": "Colors"
+        },
+        "default": "#ff2f7a",
+        "description": "First iridescent color (two-color fallback when stops are cleared)"
+      },
+      "colorB": {
+        "ui": {
+          "type": "color",
+          "label": "Color B",
+          "group": "Colors"
+        },
+        "default": "#5fe6ff",
+        "description": "Second iridescent color (two-color fallback when stops are cleared)"
+      },
+      "stops": {
+        "ui": {
+          "type": "gradient-stops",
+          "label": "Colors",
+          "group": "Colors"
+        },
+        "default": [
+          {
+            "color": "#ff2f7a",
+            "position": 0
+          },
+          {
+            "color": "#2a2cff",
+            "position": 0.3
+          },
+          {
+            "color": "#5fe6ff",
+            "position": 0.55
+          },
+          {
+            "color": "#a6ffd8",
+            "position": 0.75
+          },
+          {
+            "color": "#ffb3e6",
+            "position": 1
+          }
+        ],
+        "description": "Multi-stop gradient colors (overrides Color A / Color B when set)"
+      },
+      "colorSpace": {
+        "ui": {
+          "type": "select",
+          "options": [
+            {
+              "label": "Linear RGB",
+              "value": "linear"
             },
             {
-              "label": "Top Right",
-              "value": "top-right"
+              "label": "OKLCh",
+              "value": "oklch"
             },
             {
-              "label": "Bottom Left",
-              "value": "bottom-left"
+              "label": "OKLAB",
+              "value": "oklab"
             },
             {
-              "label": "Bottom Right",
-              "value": "bottom-right"
+              "label": "HSL",
+              "value": "hsl"
+            },
+            {
+              "label": "HSV",
+              "value": "hsv"
+            },
+            {
+              "label": "LCH",
+              "value": "lch"
             }
           ],
-          "label": "Corner",
-          "group": "Effect"
+          "label": "Color Space",
+          "group": "Colors"
         },
-        "default": "bottom-right",
-        "description": "Which corner the page peels from"
+        "default": "oklab",
+        "description": "Color space for color interpolation"
       },
-      "amount": {
+      "iridescence": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
           "min": 0,
-          "max": 1,
+          "max": 1.5,
           "step": 0.01,
-          "label": "Amount",
-          "group": "Effect"
+          "label": "Iridescence",
+          "group": "Iridescence"
         },
-        "default": 0.2,
-        "description": "How far the peel has progressed across the page (0 = flat, 1 = fully peeled)"
+        "default": 1,
+        "description": "Strength of the colour on the oblique surfaces — 0 = plain dark glass, above 1 = saturated neon walls"
       },
-      "radius": {
+      "rimWidth": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
-          "min": 0.02,
-          "max": 0.4,
+          "min": 0,
+          "max": 1,
           "step": 0.01,
-          "label": "Curl Radius",
-          "group": "Effect"
+          "label": "Rim Width",
+          "group": "Iridescence"
         },
-        "default": 0.2,
-        "description": "Tightness of the curl (fraction of the page diagonal)"
+        "default": 0.55,
+        "description": "How far in from edge-on the colour reaches — small keeps it to the steepest walls, large lets it creep across gently turning faces"
       },
-      "shading": {
+      "rimSoftness": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
-          "min": 0,
-          "max": 1,
+          "min": 0.02,
+          "max": 0.6,
           "step": 0.01,
-          "label": "Shading",
-          "group": "Effect"
+          "label": "Rim Softness",
+          "group": "Iridescence"
         },
-        "default": 0.55,
-        "description": "How much the underside of the curl is shaded for depth"
+        "default": 0.25,
+        "description": "Softness of the transition from dark face to coloured wall"
       },
-      "highlight": {
+      "flowAngle": {
         "ui": {
-          "type": [
-            "range",
-            "map"
-          ],
+          "type": "range",
           "min": 0,
-          "max": 1,
-          "step": 0.01,
-          "label": "Highlight",
-          "group": "Effect"
+          "max": 360,
+          "step": 1,
+          "label": "Flow Angle",
+          "group": "Iridescence"
         },
-        "default": 0.4,
-        "description": "Strength of the specular sheen running along the curl"
+        "default": 30,
+        "description": "Direction the gradient flows across the surface, in degrees"
       },
-      "highlightSoftness": {
+      "flowScale": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
-          "min": 0,
-          "max": 1,
+          "min": 0.2,
+          "max": 4,
           "step": 0.01,
-          "label": "Highlight Softness",
-          "group": "Effect"
+          "label": "Flow Scale",
+          "group": "Iridescence"
         },
-        "default": 0.2,
-        "description": "Width of the specular highlight band (low = tight gloss, high = broad satin)"
+        "default": 1,
+        "description": "How many times the palette cycles across the shape — higher = tighter colour bands"
       },
-      "shadow": {
+      "speed": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 4,
+          "step": 0.01,
+          "label": "Speed",
+          "group": "Iridescence"
+        },
+        "default": 0.5,
+        "description": "Speed the gradient flows along the walls. 0 pauses."
+      },
+      "gloss": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 2,
+          "step": 0.01,
+          "label": "Gloss",
+          "group": "Surface"
+        },
+        "default": 0.35,
+        "description": "Strength of the studio softboxes reflected in the glass — the pale highlights riding the top edges"
+      },
+      "envRotation": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 360,
+          "step": 1,
+          "label": "Env Rotation",
+          "group": "Surface"
+        },
+        "default": 0,
+        "description": "Rotates the reflected studio — spins where the bright reflections fall"
+      },
+      "bevelWidth": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0.005,
+          "max": 0.3,
+          "step": 0.001,
+          "label": "Bevel Width",
+          "group": "Surface"
+        },
+        "default": 0.08,
+        "description": "Width of the edge bevel on flat shapes — the band that turns away from the viewer and catches the colour"
+      },
+      "bevelShape": {
         "ui": {
           "type": [
             "range",
@@ -33566,105 +34605,385 @@ export const shaderRegistry = [
           "min": 0,
           "max": 1,
           "step": 0.01,
-          "label": "Shadow",
-          "group": "Effect"
+          "label": "Bevel Profile",
+          "group": "Surface"
         },
-        "default": 1,
-        "description": "Strength of the contact shadow the curl casts on the page"
+        "default": 0,
+        "description": "Bevel profile — 0 = one smooth round fillet, 1 = machined: a steep outer fillet, a chamfer plateau and an inner knee"
+      },
+      "edgeSoftness": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Edge Softness",
+          "group": "Surface"
+        },
+        "default": 0.05,
+        "description": "Softness of the shape boundary edge"
+      },
+      "shape": {
+        "ui": {
+          "type": "shape",
+          "label": "Shape",
+          "group": "Shape"
+        },
+        "default": "{\"type\":\"circleSDF\",\"radius\":0.35}",
+        "description": "Serialized shape configuration (JSON)"
       }
     }
   },
   {
-    "name": "Paper",
-    "category": "Stylize",
-    "description": "Applies realistic paper grain and surface roughness to child content",
-    "fileName": "Paper",
+    "name": "PagePeel",
+    "category": "Transitions",
+    "description": "Curl the content up from a corner like a peeling page",
+    "fileName": "PagePeel",
     "requiresChild": true,
     "definition": {
-      "name": "Paper",
+      "name": "PagePeel",
+      "category": "Transitions",
+      "description": "Curl the content up from a corner like a peeling page",
       "boundingBoxDeclaration": {
         "aspectRatio": null
       },
-      "category": "Stylize",
-      "description": "Applies realistic paper grain and surface roughness to child content",
-      "requiresRTT": true,
-      "requiresChild": true,
       "props": {
-        "roughness": {
-          "default": 0.3,
-          "description": "Surface roughness — higher values create more pronounced brightness variation",
+        "corner": {
+          "default": "bottom-right",
+          "description": "Which corner the page peels from",
+          "compileTime": true,
           "ui": {
-            "type": "range",
+            "type": "select",
+            "options": [
+              {
+                "label": "Top Left",
+                "value": "top-left"
+              },
+              {
+                "label": "Top Right",
+                "value": "top-right"
+              },
+              {
+                "label": "Bottom Left",
+                "value": "bottom-left"
+              },
+              {
+                "label": "Bottom Right",
+                "value": "bottom-right"
+              }
+            ],
+            "label": "Corner",
+            "group": "Effect"
+          }
+        },
+        "amount": {
+          "default": 0.2,
+          "description": "How far the peel has progressed across the page (0 = flat, 1 = fully peeled)",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
             "min": 0,
             "max": 1,
             "step": 0.01,
-            "label": "Roughness",
-            "group": "Texture"
+            "label": "Amount",
+            "group": "Effect"
           }
         },
-        "grainScale": {
-          "default": 1,
-          "description": "Scale of the paper grain — lower = coarser, higher = finer",
+        "radius": {
+          "default": 0.2,
+          "description": "Tightness of the curl (fraction of the page diagonal)",
           "ui": {
-            "type": "range",
-            "min": 0.1,
-            "max": 3,
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0.02,
+            "max": 0.4,
             "step": 0.01,
-            "label": "Grain Scale",
-            "group": "Texture"
+            "label": "Curl Radius",
+            "group": "Effect"
           }
         },
-        "displacement": {
-          "default": 0.15,
-          "description": "Surface micro-roughness — shifts pixels at grain scale like real paper fiber bumps",
+        "shading": {
+          "default": 0.55,
+          "description": "How much the underside of the curl is shaded for depth",
           "ui": {
-            "type": "range",
+            "type": [
+              "range",
+              "map"
+            ],
             "min": 0,
             "max": 1,
             "step": 0.01,
-            "label": "Displacement",
-            "group": "Texture"
+            "label": "Shading",
+            "group": "Effect"
           }
         },
-        "seed": {
-          "default": 0,
-          "description": "Random seed for pattern variation",
+        "highlight": {
+          "default": 0.4,
+          "description": "Strength of the specular sheen running along the curl",
           "ui": {
-            "type": "range",
+            "type": [
+              "range",
+              "map"
+            ],
             "min": 0,
-            "max": 100,
-            "step": 1,
-            "label": "Seed",
-            "group": "Texture"
+            "max": 1,
+            "step": 0.01,
+            "label": "Highlight",
+            "group": "Effect"
+          }
+        },
+        "highlightSoftness": {
+          "default": 0.2,
+          "description": "Width of the specular highlight band (low = tight gloss, high = broad satin)",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Highlight Softness",
+            "group": "Effect"
+          }
+        },
+        "shadow": {
+          "default": 1,
+          "description": "Strength of the contact shadow the curl casts on the page",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Shadow",
+            "group": "Effect"
           }
         }
-      }
+      },
+      "requiresRTT": true,
+      "requiresChild": true
     },
     "propsMetadata": {
-      "roughness": {
-        "ui": {
-          "type": "range",
-          "min": 0,
-          "max": 1,
-          "step": 0.01,
-          "label": "Roughness",
-          "group": "Texture"
-        },
-        "default": 0.3,
-        "description": "Surface roughness — higher values create more pronounced brightness variation"
-      },
-      "grainScale": {
+      "corner": {
         "ui": {
-          "type": "range",
-          "min": 0.1,
-          "max": 3,
-          "step": 0.01,
-          "label": "Grain Scale",
-          "group": "Texture"
-        },
-        "default": 1,
-        "description": "Scale of the paper grain — lower = coarser, higher = finer"
-      },
+          "type": "select",
+          "options": [
+            {
+              "label": "Top Left",
+              "value": "top-left"
+            },
+            {
+              "label": "Top Right",
+              "value": "top-right"
+            },
+            {
+              "label": "Bottom Left",
+              "value": "bottom-left"
+            },
+            {
+              "label": "Bottom Right",
+              "value": "bottom-right"
+            }
+          ],
+          "label": "Corner",
+          "group": "Effect"
+        },
+        "default": "bottom-right",
+        "description": "Which corner the page peels from"
+      },
+      "amount": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Amount",
+          "group": "Effect"
+        },
+        "default": 0.2,
+        "description": "How far the peel has progressed across the page (0 = flat, 1 = fully peeled)"
+      },
+      "radius": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0.02,
+          "max": 0.4,
+          "step": 0.01,
+          "label": "Curl Radius",
+          "group": "Effect"
+        },
+        "default": 0.2,
+        "description": "Tightness of the curl (fraction of the page diagonal)"
+      },
+      "shading": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Shading",
+          "group": "Effect"
+        },
+        "default": 0.55,
+        "description": "How much the underside of the curl is shaded for depth"
+      },
+      "highlight": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Highlight",
+          "group": "Effect"
+        },
+        "default": 0.4,
+        "description": "Strength of the specular sheen running along the curl"
+      },
+      "highlightSoftness": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Highlight Softness",
+          "group": "Effect"
+        },
+        "default": 0.2,
+        "description": "Width of the specular highlight band (low = tight gloss, high = broad satin)"
+      },
+      "shadow": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Shadow",
+          "group": "Effect"
+        },
+        "default": 1,
+        "description": "Strength of the contact shadow the curl casts on the page"
+      }
+    }
+  },
+  {
+    "name": "Paper",
+    "category": "Stylize",
+    "description": "Applies realistic paper grain and surface roughness to child content",
+    "fileName": "Paper",
+    "requiresChild": true,
+    "definition": {
+      "name": "Paper",
+      "boundingBoxDeclaration": {
+        "aspectRatio": null
+      },
+      "category": "Stylize",
+      "description": "Applies realistic paper grain and surface roughness to child content",
+      "requiresRTT": true,
+      "requiresChild": true,
+      "props": {
+        "roughness": {
+          "default": 0.3,
+          "description": "Surface roughness — higher values create more pronounced brightness variation",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Roughness",
+            "group": "Texture"
+          }
+        },
+        "grainScale": {
+          "default": 1,
+          "description": "Scale of the paper grain — lower = coarser, higher = finer",
+          "ui": {
+            "type": "range",
+            "min": 0.1,
+            "max": 3,
+            "step": 0.01,
+            "label": "Grain Scale",
+            "group": "Texture"
+          }
+        },
+        "displacement": {
+          "default": 0.15,
+          "description": "Surface micro-roughness — shifts pixels at grain scale like real paper fiber bumps",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Displacement",
+            "group": "Texture"
+          }
+        },
+        "seed": {
+          "default": 0,
+          "description": "Random seed for pattern variation",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 100,
+            "step": 1,
+            "label": "Seed",
+            "group": "Texture"
+          }
+        }
+      }
+    },
+    "propsMetadata": {
+      "roughness": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Roughness",
+          "group": "Texture"
+        },
+        "default": 0.3,
+        "description": "Surface roughness — higher values create more pronounced brightness variation"
+      },
+      "grainScale": {
+        "ui": {
+          "type": "range",
+          "min": 0.1,
+          "max": 3,
+          "step": 0.01,
+          "label": "Grain Scale",
+          "group": "Texture"
+        },
+        "default": 1,
+        "description": "Scale of the paper grain — lower = coarser, higher = finer"
+      },
       "displacement": {
         "ui": {
           "type": "range",
@@ -54558,53 +55877,640 @@ export const shaderRegistry = [
             "group": "Effect"
           }
         },
-        "edges": {
-          "default": "stretch",
-          "description": "How to handle edges when distortion pushes content out of bounds",
-          "compileTime": true,
-          "ui": {
-            "type": "select",
-            "options": [
-              {
-                "label": "Stretch",
-                "value": "stretch"
-              },
-              {
-                "label": "Transparent",
-                "value": "transparent"
-              },
-              {
-                "label": "Mirror",
-                "value": "mirror"
-              },
-              {
-                "label": "Wrap",
-                "value": "wrap"
-              }
-            ],
-            "label": "Edges",
-            "group": "Effect"
-          }
-        }
+        "edges": {
+          "default": "stretch",
+          "description": "How to handle edges when distortion pushes content out of bounds",
+          "compileTime": true,
+          "ui": {
+            "type": "select",
+            "options": [
+              {
+                "label": "Stretch",
+                "value": "stretch"
+              },
+              {
+                "label": "Transparent",
+                "value": "transparent"
+              },
+              {
+                "label": "Mirror",
+                "value": "mirror"
+              },
+              {
+                "label": "Wrap",
+                "value": "wrap"
+              }
+            ],
+            "label": "Edges",
+            "group": "Effect"
+          }
+        }
+      },
+      "requiresRTT": true,
+      "requiresChild": true
+    },
+    "propsMetadata": {
+      "strength": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Strength",
+          "group": "Effect"
+        },
+        "default": 0.3,
+        "description": "Distortion intensity"
+      },
+      "frequency": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0.1,
+          "max": 10,
+          "step": 0.1,
+          "label": "Frequency",
+          "group": "Effect"
+        },
+        "default": 1,
+        "description": "Number of bends/waves"
+      },
+      "speed": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 5,
+          "step": 0.1,
+          "label": "Speed",
+          "group": "Animation"
+        },
+        "default": 1,
+        "description": "Animation speed"
+      },
+      "angle": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 360,
+          "step": 1,
+          "label": "Angle",
+          "group": "Effect"
+        },
+        "default": 0,
+        "description": "Direction of wave distortion in degrees"
+      },
+      "waveType": {
+        "ui": {
+          "type": "select",
+          "options": [
+            {
+              "label": "Sine",
+              "value": "sine"
+            },
+            {
+              "label": "Triangle",
+              "value": "triangle"
+            },
+            {
+              "label": "Square",
+              "value": "square"
+            },
+            {
+              "label": "Sawtooth",
+              "value": "sawtooth"
+            },
+            {
+              "label": "Bounce",
+              "value": "bounce"
+            }
+          ],
+          "label": "Wave Type",
+          "group": "Effect"
+        },
+        "default": "sine",
+        "description": "Shape of the distortion wave"
+      },
+      "edges": {
+        "ui": {
+          "type": "select",
+          "options": [
+            {
+              "label": "Stretch",
+              "value": "stretch"
+            },
+            {
+              "label": "Transparent",
+              "value": "transparent"
+            },
+            {
+              "label": "Mirror",
+              "value": "mirror"
+            },
+            {
+              "label": "Wrap",
+              "value": "wrap"
+            }
+          ],
+          "label": "Edges",
+          "group": "Effect"
+        },
+        "default": "stretch",
+        "description": "How to handle edges when distortion pushes content out of bounds"
+      }
+    }
+  },
+  {
+    "name": "Waveform",
+    "category": "Textures",
+    "description": "Audio-visualizer waveform — equalizer bars, a filled wave, an oscilloscope line, or a dot matrix — driven by a simulated signal whose amplitude you can map to your own audio level",
+    "fileName": "Waveform",
+    "definition": {
+      "name": "Waveform",
+      "boundingBoxDeclaration": {
+        "aspectRatio": null,
+        "supportsResizeFit": true
+      },
+      "category": "Textures",
+      "description": "Audio-visualizer waveform — equalizer bars, a filled wave, an oscilloscope line, or a dot matrix — driven by a simulated signal whose amplitude you can map to your own audio level",
+      "acceptsUVContext": true,
+      "animatedTime": {
+        "speed": "speed"
+      },
+      "props": {
+        "style": {
+          "default": "bars",
+          "compileTime": true,
+          "description": "Visualizer style: equalizer bars, a filled wave envelope, an oscilloscope line, or a dot matrix",
+          "ui": {
+            "type": "select",
+            "options": [
+              {
+                "label": "Bars",
+                "value": "bars"
+              },
+              {
+                "label": "Wave",
+                "value": "wave"
+              },
+              {
+                "label": "Line",
+                "value": "line"
+              },
+              {
+                "label": "Dots",
+                "value": "dots"
+              }
+            ],
+            "label": "Style",
+            "group": "Style"
+          }
+        },
+        "colorA": {
+          "default": "#3b5bff",
+          "description": "Color at the start",
+          "ui": {
+            "type": "color",
+            "label": "Color A",
+            "group": "Colors"
+          }
+        },
+        "colorB": {
+          "default": "#ff3bd4",
+          "description": "Color at the end",
+          "ui": {
+            "type": "color",
+            "label": "Color B",
+            "group": "Colors"
+          }
+        },
+        "stops": {
+          "default": null,
+          "description": "Multi-stop gradient colors (overrides Color A / Color B when set)",
+          "ui": {
+            "type": "gradient-stops",
+            "label": "Colors",
+            "group": "Colors"
+          }
+        },
+        "colorSpace": {
+          "default": "oklab",
+          "compileTime": true,
+          "description": "Color space for the start→end gradient",
+          "ui": {
+            "type": "select",
+            "options": [
+              {
+                "label": "Linear RGB",
+                "value": "linear"
+              },
+              {
+                "label": "OKLCh",
+                "value": "oklch"
+              },
+              {
+                "label": "OKLAB",
+                "value": "oklab"
+              },
+              {
+                "label": "HSL",
+                "value": "hsl"
+              },
+              {
+                "label": "HSV",
+                "value": "hsv"
+              },
+              {
+                "label": "LCH",
+                "value": "lch"
+              }
+            ],
+            "label": "Color Space",
+            "group": "Colors"
+          }
+        },
+        "from": {
+          "default": {
+            "x": 0,
+            "y": 0.5
+          },
+          "description": "Where the waveform starts (Color A end)",
+          "ui": {
+            "type": "position",
+            "label": "Start",
+            "group": "Position",
+            "units": [
+              "%",
+              "px"
+            ]
+          }
+        },
+        "to": {
+          "default": {
+            "x": 1,
+            "y": 0.5
+          },
+          "description": "Where the waveform ends (Color B end)",
+          "ui": {
+            "type": "position",
+            "label": "End",
+            "group": "Position",
+            "units": [
+              "%",
+              "px"
+            ]
+          }
+        },
+        "amplitude": {
+          "default": 1,
+          "description": "Overall signal level (0 = silence). Map this to your own audio level to make the waveform react to real sound.",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 2,
+            "step": 0.01,
+            "label": "Amplitude",
+            "group": "Signal"
+          }
+        },
+        "frequency": {
+          "default": 1,
+          "description": "How busy the signal is across the width (higher = more peaks)",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0.2,
+            "max": 3,
+            "step": 0.01,
+            "label": "Frequency",
+            "group": "Signal"
+          }
+        },
+        "height": {
+          "default": 0.6,
+          "description": "Maximum vertical extent of the waveform as a fraction of the canvas height",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0.05,
+            "max": 1,
+            "step": 0.01,
+            "label": "Height",
+            "group": "Effect"
+          }
+        },
+        "align": {
+          "default": "mirrored",
+          "compileTime": true,
+          "description": "Which side of the start→end baseline the waveform grows on: mirrored around it, above it (top), or below it (bottom)",
+          "ui": {
+            "type": "select",
+            "options": [
+              {
+                "label": "Mirrored",
+                "value": "mirrored"
+              },
+              {
+                "label": "Top",
+                "value": "top"
+              },
+              {
+                "label": "Bottom",
+                "value": "bottom"
+              }
+            ],
+            "label": "Align",
+            "group": "Effect"
+          }
+        },
+        "count": {
+          "default": 32,
+          "description": "Number of bars (or dot columns) across the width",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 4,
+            "max": 128,
+            "step": 1,
+            "label": "Count",
+            "group": "Effect",
+            "condition": {
+              "style": [
+                "bars",
+                "dots"
+              ]
+            }
+          }
+        },
+        "barWidth": {
+          "default": 0.6,
+          "description": "Bar thickness as a fraction of its column (1 = bars touch)",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0.1,
+            "max": 1,
+            "step": 0.01,
+            "label": "Bar Width",
+            "group": "Effect",
+            "condition": {
+              "style": "bars"
+            }
+          }
+        },
+        "rounding": {
+          "default": 1,
+          "description": "Rounds the bar ends (0 = square, 1 = fully rounded caps)",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Rounding",
+            "group": "Effect",
+            "condition": {
+              "style": "bars"
+            }
+          }
+        },
+        "dotSize": {
+          "default": 0.7,
+          "description": "Dot diameter as a fraction of its cell",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0.2,
+            "max": 1,
+            "step": 0.01,
+            "label": "Dot Size",
+            "group": "Effect",
+            "condition": {
+              "style": "dots"
+            }
+          }
+        },
+        "lineWidth": {
+          "default": 0.006,
+          "description": "Stroke thickness of the line. A value of one (1) matches the canvas height.",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0.001,
+            "max": 0.05,
+            "step": 0.001,
+            "label": "Line Width",
+            "group": "Effect",
+            "dimensional": "canvas-height",
+            "condition": {
+              "style": "line"
+            }
+          }
+        },
+        "softness": {
+          "default": 0,
+          "description": "Feathers the wave's edge into a glow",
+          "ui": {
+            "type": [
+              "range",
+              "map"
+            ],
+            "min": 0,
+            "max": 1,
+            "step": 0.01,
+            "label": "Softness",
+            "group": "Effect",
+            "condition": {
+              "style": "wave"
+            }
+          }
+        },
+        "speed": {
+          "default": 1,
+          "description": "Animation speed of the simulated signal",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 3,
+            "step": 0.01,
+            "label": "Speed",
+            "group": "Animation"
+          }
+        },
+        "seed": {
+          "default": 1,
+          "description": "Adjusts the starting state, useful for variation",
+          "ui": {
+            "type": "range",
+            "min": 0,
+            "max": 100,
+            "step": 1,
+            "label": "Seed",
+            "group": "Animation"
+          }
+        }
+      }
+    },
+    "propsMetadata": {
+      "style": {
+        "ui": {
+          "type": "select",
+          "options": [
+            {
+              "label": "Bars",
+              "value": "bars"
+            },
+            {
+              "label": "Wave",
+              "value": "wave"
+            },
+            {
+              "label": "Line",
+              "value": "line"
+            },
+            {
+              "label": "Dots",
+              "value": "dots"
+            }
+          ],
+          "label": "Style",
+          "group": "Style"
+        },
+        "default": "bars",
+        "description": "Visualizer style: equalizer bars, a filled wave envelope, an oscilloscope line, or a dot matrix"
+      },
+      "colorA": {
+        "ui": {
+          "type": "color",
+          "label": "Color A",
+          "group": "Colors"
+        },
+        "default": "#3b5bff",
+        "description": "Color at the start"
+      },
+      "colorB": {
+        "ui": {
+          "type": "color",
+          "label": "Color B",
+          "group": "Colors"
+        },
+        "default": "#ff3bd4",
+        "description": "Color at the end"
+      },
+      "stops": {
+        "ui": {
+          "type": "gradient-stops",
+          "label": "Colors",
+          "group": "Colors"
+        },
+        "default": null,
+        "description": "Multi-stop gradient colors (overrides Color A / Color B when set)"
+      },
+      "colorSpace": {
+        "ui": {
+          "type": "select",
+          "options": [
+            {
+              "label": "Linear RGB",
+              "value": "linear"
+            },
+            {
+              "label": "OKLCh",
+              "value": "oklch"
+            },
+            {
+              "label": "OKLAB",
+              "value": "oklab"
+            },
+            {
+              "label": "HSL",
+              "value": "hsl"
+            },
+            {
+              "label": "HSV",
+              "value": "hsv"
+            },
+            {
+              "label": "LCH",
+              "value": "lch"
+            }
+          ],
+          "label": "Color Space",
+          "group": "Colors"
+        },
+        "default": "oklab",
+        "description": "Color space for the start→end gradient"
+      },
+      "from": {
+        "ui": {
+          "type": "position",
+          "label": "Start",
+          "group": "Position",
+          "units": [
+            "%",
+            "px"
+          ]
+        },
+        "default": {
+          "x": 0,
+          "y": 0.5
+        },
+        "description": "Where the waveform starts (Color A end)"
       },
-      "requiresRTT": true,
-      "requiresChild": true
-    },
-    "propsMetadata": {
-      "strength": {
+      "to": {
+        "ui": {
+          "type": "position",
+          "label": "End",
+          "group": "Position",
+          "units": [
+            "%",
+            "px"
+          ]
+        },
+        "default": {
+          "x": 1,
+          "y": 0.5
+        },
+        "description": "Where the waveform ends (Color B end)"
+      },
+      "amplitude": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
           "min": 0,
-          "max": 1,
+          "max": 2,
           "step": 0.01,
-          "label": "Strength",
-          "group": "Effect"
+          "label": "Amplitude",
+          "group": "Signal"
         },
-        "default": 0.3,
-        "description": "Distortion intensity"
+        "default": 1,
+        "description": "Overall signal level (0 = silence). Map this to your own audio level to make the waveform react to real sound."
       },
       "frequency": {
         "ui": {
@@ -54612,99 +56518,188 @@ export const shaderRegistry = [
             "range",
             "map"
           ],
-          "min": 0.1,
-          "max": 10,
-          "step": 0.1,
+          "min": 0.2,
+          "max": 3,
+          "step": 0.01,
           "label": "Frequency",
-          "group": "Effect"
-        },
-        "default": 1,
-        "description": "Number of bends/waves"
-      },
-      "speed": {
-        "ui": {
-          "type": "range",
-          "min": 0,
-          "max": 5,
-          "step": 0.1,
-          "label": "Speed",
-          "group": "Animation"
+          "group": "Signal"
         },
         "default": 1,
-        "description": "Animation speed"
+        "description": "How busy the signal is across the width (higher = more peaks)"
       },
-      "angle": {
+      "height": {
         "ui": {
           "type": [
             "range",
             "map"
           ],
-          "min": 0,
-          "max": 360,
-          "step": 1,
-          "label": "Angle",
+          "min": 0.05,
+          "max": 1,
+          "step": 0.01,
+          "label": "Height",
           "group": "Effect"
         },
-        "default": 0,
-        "description": "Direction of wave distortion in degrees"
+        "default": 0.6,
+        "description": "Maximum vertical extent of the waveform as a fraction of the canvas height"
       },
-      "waveType": {
+      "align": {
         "ui": {
           "type": "select",
           "options": [
             {
-              "label": "Sine",
-              "value": "sine"
-            },
-            {
-              "label": "Triangle",
-              "value": "triangle"
-            },
-            {
-              "label": "Square",
-              "value": "square"
+              "label": "Mirrored",
+              "value": "mirrored"
             },
             {
-              "label": "Sawtooth",
-              "value": "sawtooth"
+              "label": "Top",
+              "value": "top"
             },
             {
-              "label": "Bounce",
-              "value": "bounce"
+              "label": "Bottom",
+              "value": "bottom"
             }
           ],
-          "label": "Wave Type",
+          "label": "Align",
           "group": "Effect"
         },
-        "default": "sine",
-        "description": "Shape of the distortion wave"
+        "default": "mirrored",
+        "description": "Which side of the start→end baseline the waveform grows on: mirrored around it, above it (top), or below it (bottom)"
       },
-      "edges": {
+      "count": {
         "ui": {
-          "type": "select",
-          "options": [
-            {
-              "label": "Stretch",
-              "value": "stretch"
-            },
-            {
-              "label": "Transparent",
-              "value": "transparent"
-            },
-            {
-              "label": "Mirror",
-              "value": "mirror"
-            },
-            {
-              "label": "Wrap",
-              "value": "wrap"
-            }
+          "type": [
+            "range",
+            "map"
           ],
-          "label": "Edges",
-          "group": "Effect"
+          "min": 4,
+          "max": 128,
+          "step": 1,
+          "label": "Count",
+          "group": "Effect",
+          "condition": {
+            "style": [
+              "bars",
+              "dots"
+            ]
+          }
         },
-        "default": "stretch",
-        "description": "How to handle edges when distortion pushes content out of bounds"
+        "default": 32,
+        "description": "Number of bars (or dot columns) across the width"
+      },
+      "barWidth": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0.1,
+          "max": 1,
+          "step": 0.01,
+          "label": "Bar Width",
+          "group": "Effect",
+          "condition": {
+            "style": "bars"
+          }
+        },
+        "default": 0.6,
+        "description": "Bar thickness as a fraction of its column (1 = bars touch)"
+      },
+      "rounding": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Rounding",
+          "group": "Effect",
+          "condition": {
+            "style": "bars"
+          }
+        },
+        "default": 1,
+        "description": "Rounds the bar ends (0 = square, 1 = fully rounded caps)"
+      },
+      "dotSize": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0.2,
+          "max": 1,
+          "step": 0.01,
+          "label": "Dot Size",
+          "group": "Effect",
+          "condition": {
+            "style": "dots"
+          }
+        },
+        "default": 0.7,
+        "description": "Dot diameter as a fraction of its cell"
+      },
+      "lineWidth": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0.001,
+          "max": 0.05,
+          "step": 0.001,
+          "label": "Line Width",
+          "group": "Effect",
+          "dimensional": "canvas-height",
+          "condition": {
+            "style": "line"
+          }
+        },
+        "default": 0.006,
+        "description": "Stroke thickness of the line. A value of one (1) matches the canvas height."
+      },
+      "softness": {
+        "ui": {
+          "type": [
+            "range",
+            "map"
+          ],
+          "min": 0,
+          "max": 1,
+          "step": 0.01,
+          "label": "Softness",
+          "group": "Effect",
+          "condition": {
+            "style": "wave"
+          }
+        },
+        "default": 0,
+        "description": "Feathers the wave's edge into a glow"
+      },
+      "speed": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 3,
+          "step": 0.01,
+          "label": "Speed",
+          "group": "Animation"
+        },
+        "default": 1,
+        "description": "Animation speed of the simulated signal"
+      },
+      "seed": {
+        "ui": {
+          "type": "range",
+          "min": 0,
+          "max": 100,
+          "step": 1,
+          "label": "Seed",
+          "group": "Animation"
+        },
+        "default": 1,
+        "description": "Adjusts the starting state, useful for variation"
       }
     }
   },