@promptbook/browser 0.113.0-1 → 0.113.0-11

package/umd/index.umd.js

@@ -29,7 +29,7 @@
      * @generated
      * @see https://github.com/webgptorg/promptbook
      */
-    const PROMPTBOOK_ENGINE_VERSION = '0.113.0-1';
+    const PROMPTBOOK_ENGINE_VERSION = '0.113.0-11';
     /**
      * TODO: string_promptbook_version should be constrained to the all versions of Promptbook engine
      * Note: [💞] Ignore a discrepancy between file name and entity name
@@ -92,6 +92,127 @@
         });
     }
 
+    /**
+     * Validates that a channel value is a valid number within the range of 0 to 255.
+     * Throws an error if the value is not valid.
+     *
+     * @param channelName - The name of the channel being validated.
+     * @param value - The value of the channel to validate.
+     * @throws Will throw an error if the value is not a valid channel number.
+     *
+     * @private util of `@promptbook/color`
+     */
+    function checkChannelValue(channelName, value) {
+        if (typeof value !== 'number') {
+            throw new Error(`${channelName} channel value is not number but ${typeof value}`);
+        }
+        if (isNaN(value)) {
+            throw new Error(`${channelName} channel value is NaN`);
+        }
+        if (Math.round(value) !== value) {
+            throw new Error(`${channelName} channel is not whole number, it is ${value}`);
+        }
+        if (value < 0) {
+            throw new Error(`${channelName} channel is lower than 0, it is ${value}`);
+        }
+        if (value > 255) {
+            throw new Error(`${channelName} channel is greater than 255, it is ${value}`);
+        }
+    }
+
+    /**
+     * Shared immutable channel storage and serialization helpers for `Color`.
+     *
+     * @private base class of Color
+     */
+    class ColorValue {
+        constructor(red, green, blue, alpha = 255) {
+            this.red = red;
+            this.green = green;
+            this.blue = blue;
+            this.alpha = alpha;
+            checkChannelValue('Red', red);
+            checkChannelValue('Green', green);
+            checkChannelValue('Blue', blue);
+            checkChannelValue('Alpha', alpha);
+        }
+        /**
+         * Shortcut for `red` property
+         * Number from 0 to 255
+         * @alias red
+         */
+        get r() {
+            return this.red;
+        }
+        /**
+         * Shortcut for `green` property
+         * Number from 0 to 255
+         * @alias green
+         */
+        get g() {
+            return this.green;
+        }
+        /**
+         * Shortcut for `blue` property
+         * Number from 0 to 255
+         * @alias blue
+         */
+        get b() {
+            return this.blue;
+        }
+        /**
+         * Shortcut for `alpha` property
+         * Number from 0 (transparent) to 255 (opaque)
+         * @alias alpha
+         */
+        get a() {
+            return this.alpha;
+        }
+        /**
+         * Shortcut for `alpha` property
+         * Number from 0 (transparent) to 255 (opaque)
+         * @alias alpha
+         */
+        get opacity() {
+            return this.alpha;
+        }
+        /**
+         * Shortcut for 1-`alpha` property
+         */
+        get transparency() {
+            return 255 - this.alpha;
+        }
+        clone() {
+            return take(this.createColor(this.red, this.green, this.blue, this.alpha));
+        }
+        toString() {
+            return this.toHex();
+        }
+        toHex() {
+            if (this.alpha === 255) {
+                return `#${this.red.toString(16).padStart(2, '0')}${this.green.toString(16).padStart(2, '0')}${this.blue
+                .toString(16)
+                .padStart(2, '0')}`;
+            }
+            else {
+                return `#${this.red.toString(16).padStart(2, '0')}${this.green.toString(16).padStart(2, '0')}${this.blue
+                .toString(16)
+                .padStart(2, '0')}${this.alpha.toString(16).padStart(2, '0')}`;
+            }
+        }
+        toRgb() {
+            if (this.alpha === 255) {
+                return `rgb(${this.red}, ${this.green}, ${this.blue})`;
+            }
+            else {
+                return `rgba(${this.red}, ${this.green}, ${this.blue}, ${Math.round((this.alpha / 255) * 100)}%)`;
+            }
+        }
+        toHsl() {
+            throw new Error(`Getting HSL is not implemented`);
+        }
+    }
+
     /**
      * 🎨 List of all 140 color names which are supported by CSS
      *
@@ -251,127 +372,6 @@
     };
     // Note: [💞] Ignore a discrepancy between file name and entity name
 
-    /**
-     * Validates that a channel value is a valid number within the range of 0 to 255.
-     * Throws an error if the value is not valid.
-     *
-     * @param channelName - The name of the channel being validated.
-     * @param value - The value of the channel to validate.
-     * @throws Will throw an error if the value is not a valid channel number.
-     *
-     * @private util of `@promptbook/color`
-     */
-    function checkChannelValue(channelName, value) {
-        if (typeof value !== 'number') {
-            throw new Error(`${channelName} channel value is not number but ${typeof value}`);
-        }
-        if (isNaN(value)) {
-            throw new Error(`${channelName} channel value is NaN`);
-        }
-        if (Math.round(value) !== value) {
-            throw new Error(`${channelName} channel is not whole number, it is ${value}`);
-        }
-        if (value < 0) {
-            throw new Error(`${channelName} channel is lower than 0, it is ${value}`);
-        }
-        if (value > 255) {
-            throw new Error(`${channelName} channel is greater than 255, it is ${value}`);
-        }
-    }
-
-    /**
-     * Shared immutable channel storage and serialization helpers for `Color`.
-     *
-     * @private base class of Color
-     */
-    class ColorValue {
-        constructor(red, green, blue, alpha = 255) {
-            this.red = red;
-            this.green = green;
-            this.blue = blue;
-            this.alpha = alpha;
-            checkChannelValue('Red', red);
-            checkChannelValue('Green', green);
-            checkChannelValue('Blue', blue);
-            checkChannelValue('Alpha', alpha);
-        }
-        /**
-         * Shortcut for `red` property
-         * Number from 0 to 255
-         * @alias red
-         */
-        get r() {
-            return this.red;
-        }
-        /**
-         * Shortcut for `green` property
-         * Number from 0 to 255
-         * @alias green
-         */
-        get g() {
-            return this.green;
-        }
-        /**
-         * Shortcut for `blue` property
-         * Number from 0 to 255
-         * @alias blue
-         */
-        get b() {
-            return this.blue;
-        }
-        /**
-         * Shortcut for `alpha` property
-         * Number from 0 (transparent) to 255 (opaque)
-         * @alias alpha
-         */
-        get a() {
-            return this.alpha;
-        }
-        /**
-         * Shortcut for `alpha` property
-         * Number from 0 (transparent) to 255 (opaque)
-         * @alias alpha
-         */
-        get opacity() {
-            return this.alpha;
-        }
-        /**
-         * Shortcut for 1-`alpha` property
-         */
-        get transparency() {
-            return 255 - this.alpha;
-        }
-        clone() {
-            return take(this.createColor(this.red, this.green, this.blue, this.alpha));
-        }
-        toString() {
-            return this.toHex();
-        }
-        toHex() {
-            if (this.alpha === 255) {
-                return `#${this.red.toString(16).padStart(2, '0')}${this.green.toString(16).padStart(2, '0')}${this.blue
-                .toString(16)
-                .padStart(2, '0')}`;
-            }
-            else {
-                return `#${this.red.toString(16).padStart(2, '0')}${this.green.toString(16).padStart(2, '0')}${this.blue
-                .toString(16)
-                .padStart(2, '0')}${this.alpha.toString(16).padStart(2, '0')}`;
-            }
-        }
-        toRgb() {
-            if (this.alpha === 255) {
-                return `rgb(${this.red}, ${this.green}, ${this.blue})`;
-            }
-            else {
-                return `rgba(${this.red}, ${this.green}, ${this.blue}, ${Math.round((this.alpha / 255) * 100)}%)`;
-            }
-        }
-        toHsl() {
-            throw new Error(`Getting HSL is not implemented`);
-        }
-    }
-
     /**
      * Checks if the given value is a valid hex color string
      *
@@ -4816,7 +4816,7 @@
      * META commitment definition
      *
      * The META commitment handles all meta-information about the agent such as:
-     * - META AVATAR: Sets the agent's built-in default avatar visual
+     * - META AVATAR / META VISUAL: Sets the agent's built-in default avatar visual
      * - META IMAGE: Sets the agent's avatar/profile image URL
      * - META LINK: Provides profile/source links for the person the agent models
      * - META DOMAIN: Sets the canonical custom domain/host of the agent
@@ -4831,7 +4831,7 @@
      * Example usage in agent source:
      *
      * ```book
-     * META AVATAR pixel-art
+     * META VISUAL pixel-art
      * META IMAGE https://example.com/avatar.jpg
      * META LINK https://twitter.com/username
      * META DOMAIN my-agent.com
@@ -4871,7 +4871,7 @@
 
             ## Supported META types
 
-            - **META AVATAR** - Sets the agent's built-in default avatar visual
+            - **META AVATAR** / **META VISUAL** - Sets the agent's built-in default avatar visual
             - **META IMAGE** - Sets the agent's avatar/profile image URL
             - **META LINK** - Provides profile/source links for the person the agent models
             - **META DOMAIN** - Sets the canonical custom domain/host of the agent
@@ -4895,7 +4895,7 @@
             \`\`\`book
             Professional Assistant
 
-            META AVATAR octopus3
+            META VISUAL octopus3
             META IMAGE https://example.com/professional-avatar.jpg
             META TITLE Senior Business Consultant
             META DESCRIPTION Specialized in strategic planning and project management
@@ -8068,212 +8068,149 @@
 
     /* eslint-disable no-magic-numbers */
     /**
-     * Light direction used by the organic 3D octopus shading.
+     * Light direction used by the single-mesh octopus shading.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d2AvatarVisual`
      */
     const LIGHT_DIRECTION$3 = normalizeVector3({
-        x: 0.48,
-        y: -0.62,
-        z: 0.94,
+        x: 0.38,
+        y: -0.6,
+        z: 0.98,
     });
     /**
      * Cache keyed by the `createRandom` factory reference (stable per mounted `<Avatar/>`).
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d2AvatarVisual`
      */
-    const octopus3dStableStateCache = new WeakMap();
+    const octopus3d2StableStateCache = new WeakMap();
     /**
      * Returns the stable per-avatar state, computing it on first access and caching for subsequent frames.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d2AvatarVisual`
      */
-    function getOctopus3dStableState(createRandom) {
-        const cached = octopus3dStableStateCache.get(createRandom);
+    function getOctopus3d2StableState(createRandom) {
+        const cached = octopus3d2StableStateCache.get(createRandom);
         if (cached !== undefined) {
             return cached;
         }
-        const animationRandom = createRandom('octopus3d-animation-profile');
-        const eyeRandom = createRandom('octopus3d-eye-profile');
-        const leftEyePhaseOffset = eyeRandom() * 0.6;
-        const rightEyePhaseOffset = eyeRandom() * 0.6;
+        const animationRandom = createRandom('octopus3d2-animation-profile');
+        const eyeRandom = createRandom('octopus3d2-eye-profile');
+        const leftEyePhaseOffset = eyeRandom() * 0.7;
+        const rightEyePhaseOffset = eyeRandom() * 0.7;
         const state = {
             morphologyProfile: createOctopus3MorphologyProfile(createRandom),
             animationPhase: animationRandom() * Math.PI * 2,
             leftEyePhaseOffset,
             rightEyePhaseOffset,
         };
-        octopus3dStableStateCache.set(createRandom, state);
+        octopus3d2StableStateCache.set(createRandom, state);
         return state;
     }
     /**
-     * Proper 3D Octopus visual built from projected organic meshes and tentacles.
+     * Octopus 3D 2 avatar visual.
      *
      * @private built-in avatar visual
      */
-    const octopus3dAvatarVisual = {
-        id: 'octopus3d',
-        title: 'Octopus 3D',
-        description: 'Proper 3D octopus portrait with a turning silhouette, expressive eyes, and depth-sorted tentacles.',
+    const octopus3d2AvatarVisual = {
+        id: 'octopus3d2',
+        title: 'Octopus 3D 2',
+        description: 'Continuous blobby 3D octopus portrait with one soft mesh, turning silhouette, and cursor-aware eyes.',
         isAnimated: true,
         supportsPointerTracking: true,
         render({ context, size, palette, createRandom, timeMs, interaction }) {
-            const { morphologyProfile, animationPhase, leftEyePhaseOffset, rightEyePhaseOffset } = getOctopus3dStableState(createRandom);
+            const { morphologyProfile, animationPhase, leftEyePhaseOffset, rightEyePhaseOffset } = getOctopus3d2StableState(createRandom);
             const sceneCenterX = size * 0.5;
-            const sceneCenterY = size * 0.56;
-            const bob = Math.sin(timeMs / 920 + animationPhase) * size * 0.014;
-            const mantleCenter = {
-                x: interaction.bodyOffsetX * size * 0.042 + size * morphologyProfile.body.centerXJitterRatio * 0.65,
-                y: -size * 0.09 + interaction.bodyOffsetY * size * 0.028 + bob,
-                z: interaction.intensity * size * 0.012,
-            };
-            const underbodyCenter = {
-                x: mantleCenter.x * 0.86,
-                y: mantleCenter.y + size * 0.168,
-                z: mantleCenter.z - size * 0.018,
+            const sceneCenterY = size * 0.575;
+            const bob = Math.sin(timeMs / 940 + animationPhase) * size * 0.013;
+            const meshCenter = {
+                x: interaction.bodyOffsetX * size * 0.044 + size * morphologyProfile.body.centerXJitterRatio * 0.5,
+                y: -size * 0.03 + interaction.bodyOffsetY * size * 0.026 + bob,
+                z: interaction.intensity * size * 0.018,
             };
-            const mantleRadiusX = size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch;
-            const mantleRadiusY = size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.1;
-            const mantleRadiusZ = size *
-                morphologyProfile.body.bodyRadiusRatio *
-                (0.9 + (morphologyProfile.body.horizontalStretch - 1) * 0.3);
-            const underbodyRadiusX = mantleRadiusX * (0.9 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.08);
-            const underbodyRadiusY = mantleRadiusY * (0.44 + morphologyProfile.body.lowerDropRatio * 3.1);
-            const underbodyRadiusZ = mantleRadiusZ * 0.78;
-            const bodyYaw = -0.18 +
-                Math.sin(timeMs / 2400 + animationPhase) * 0.05 +
-                interaction.bodyOffsetX * 0.18 +
-                interaction.gazeX * 0.22;
-            const bodyPitch = -0.08 +
-                Math.cos(timeMs / 2700 + animationPhase * 0.6) * 0.025 -
+            const rotationY = -0.14 +
+                Math.sin(timeMs / 2600 + animationPhase) * 0.04 +
+                interaction.bodyOffsetX * 0.2 +
+                interaction.gazeX * 0.78;
+            const rotationX = -0.06 +
+                Math.cos(timeMs / 3000 + animationPhase * 0.7) * 0.02 -
                 interaction.bodyOffsetY * 0.08 -
-                interaction.gazeY * 0.08;
-            const headYaw = bodyYaw - 0.04 + interaction.gazeX * 0.56;
-            const headPitch = bodyPitch - 0.02 - interaction.gazeY * 0.32;
-            const mantlePatches = resolveVisibleEllipsoidPatches({
-                center: mantleCenter,
-                radiusX: mantleRadiusX,
-                radiusY: mantleRadiusY,
-                radiusZ: mantleRadiusZ,
-                rotationX: headPitch,
-                rotationY: headYaw,
-                sceneCenterX,
-                sceneCenterY,
-                size,
-                palette,
-                verticalColorBias: 0,
-                outlineColor: `${palette.highlight}7a`,
-            });
-            const underbodyPatches = resolveVisibleEllipsoidPatches({
-                center: underbodyCenter,
-                radiusX: underbodyRadiusX,
-                radiusY: underbodyRadiusY,
-                radiusZ: underbodyRadiusZ,
-                rotationX: bodyPitch,
-                rotationY: bodyYaw,
-                sceneCenterX,
-                sceneCenterY,
-                size,
-                palette,
-                verticalColorBias: 0.18,
-                outlineColor: `${palette.shadow}8f`,
-            });
-            const tentacleStrokes = createOctopusTentacleStrokes({
-                createRandom,
+                interaction.gazeY * 0.34;
+            const surfaceOptions = {
+                radiusX: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch * 1.02,
+                radiusY: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.22,
+                radiusZ: size *
+                    morphologyProfile.body.bodyRadiusRatio *
+                    (0.98 + (morphologyProfile.body.horizontalStretch - 1) * 0.2),
                 morphologyProfile,
                 timeMs,
-                size,
-                center: underbodyCenter,
-                radiusX: underbodyRadiusX,
-                radiusY: underbodyRadiusY,
-                radiusZ: underbodyRadiusZ,
-                rotationX: bodyPitch,
-                rotationY: bodyYaw,
+                animationPhase,
+            };
+            const surfacePatches = resolveVisibleBlobbyOctopusPatches({
+                ...surfaceOptions,
+                center: meshCenter,
+                rotationX,
+                rotationY,
                 sceneCenterX,
                 sceneCenterY,
-                animationPhase,
+                size,
+                palette,
             });
-            const faceEyeSpacing = size * morphologyProfile.face.eyeSpacingRatio * 0.92;
-            const faceEyeYOffset = size * morphologyProfile.face.eyeCenterYOffsetRatio - mantleRadiusY * 0.02;
-            const faceEyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.82;
-            const faceEyeRadiusY = faceEyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.96;
-            const mouthHalfWidth = size * morphologyProfile.face.mouthWidthRatio * 0.92;
-            const mouthY = size * morphologyProfile.face.mouthYOffsetRatio + mantleRadiusY * 0.08;
+            const eyeLatitude = clampNumber$1(morphologyProfile.face.eyeCenterYOffsetRatio * 4.4, -0.16, 0.11);
+            const eyeLongitude = clampNumber$1(morphologyProfile.face.eyeSpacingRatio * 3.25, 0.2, 0.34);
+            const mouthLatitude = clampNumber$1(eyeLatitude + 0.19 + morphologyProfile.face.mouthYOffsetRatio * 1.08, 0.08, 0.34);
+            const mouthCenterLongitude = clampNumber$1(morphologyProfile.face.mouthCenterOffsetRatio * 5.8, -0.08, 0.08);
+            const mouthHalfLongitude = clampNumber$1(eyeLongitude * 0.82, 0.16, 0.29);
+            const mouthCurveLatitude = clampNumber$1(mouthLatitude + morphologyProfile.face.mouthCurveDepthRatio * 0.85, mouthLatitude + 0.03, 0.42);
             drawAvatarFrame(context, size, palette);
-            drawOctopus3dAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
-            drawOctopus3dShadow(context, size, palette, interaction, timeMs);
-            for (const tentacleStroke of tentacleStrokes.filter((candidateTentacleStroke) => !candidateTentacleStroke.isFrontFacing)) {
-                drawTentacleStroke(context, tentacleStroke, palette);
-            }
-            for (const surfacePatch of [...mantlePatches, ...underbodyPatches].sort((firstSurfacePatch, secondSurfacePatch) => firstSurfacePatch.averageDepth - secondSurfacePatch.averageDepth)) {
-                drawSurfacePatch(context, surfacePatch);
-            }
-            for (const tentacleStroke of tentacleStrokes.filter((candidateTentacleStroke) => candidateTentacleStroke.isFrontFacing)) {
-                drawTentacleStroke(context, tentacleStroke, palette);
+            drawBlobbyOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
+            drawBlobbyOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile);
+            for (const surfacePatch of surfacePatches.sort((firstSurfacePatch, secondSurfacePatch) => firstSurfacePatch.averageDepth - secondSurfacePatch.averageDepth)) {
+                drawBlobbySurfacePatch(context, surfacePatch);
             }
-            drawProjectedOrganicEye(context, {
-                x: -faceEyeSpacing,
-                y: faceEyeYOffset,
-                z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, -faceEyeSpacing, faceEyeYOffset),
-            }, faceEyeRadiusX, faceEyeRadiusY, mantleCenter, headPitch, headYaw, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + leftEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
-            drawProjectedOrganicEye(context, {
-                x: faceEyeSpacing,
-                y: faceEyeYOffset,
-                z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, faceEyeSpacing, faceEyeYOffset),
-            }, faceEyeRadiusX, faceEyeRadiusY, mantleCenter, headPitch, headYaw, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.7 + rightEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
+            const leftEyeLocalCenter = sampleBlobbyOctopusSurfacePoint(surfaceOptions, eyeLatitude, -eyeLongitude);
+            const rightEyeLocalCenter = sampleBlobbyOctopusSurfacePoint(surfaceOptions, eyeLatitude, eyeLongitude);
+            const eyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.78;
+            const eyeRadiusY = eyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.92;
+            drawProjectedOrganicEye(context, leftEyeLocalCenter, eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + leftEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
+            drawProjectedOrganicEye(context, rightEyeLocalCenter, eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.9 + rightEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
             drawProjectedOrganicMouth(context, [
-                {
-                    x: -mouthHalfWidth,
-                    y: mouthY,
-                    z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, -mouthHalfWidth, mouthY),
-                },
-                {
-                    x: size * morphologyProfile.face.mouthCenterOffsetRatio,
-                    y: mouthY +
-                        size * morphologyProfile.face.mouthCurveDepthRatio * 0.38 +
-                        Math.sin(timeMs / 760 + animationPhase) * size * 0.01 +
-                        interaction.gazeY * size * 0.01,
-                    z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, size * morphologyProfile.face.mouthCenterOffsetRatio, mouthY),
-                },
-                {
-                    x: mouthHalfWidth,
-                    y: mouthY,
-                    z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, mouthHalfWidth, mouthY),
-                },
-            ], mantleCenter, headPitch, headYaw, sceneCenterX, sceneCenterY, palette, size);
+                sampleBlobbyOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude - mouthHalfLongitude),
+                sampleBlobbyOctopusSurfacePoint(surfaceOptions, mouthCurveLatitude, mouthCenterLongitude),
+                sampleBlobbyOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude + mouthHalfLongitude),
+            ], meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, palette, size);
         },
     };
     /**
-     * Draws the atmospheric underwater glow behind the octopus mesh.
+     * Draws the deep-water glow behind the continuous octopus mesh.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d2AvatarVisual`
      */
-    function drawOctopus3dAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
-        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.1, sceneCenterY - size * 0.2 + interaction.gazeY * size * 0.05, size * 0.04, sceneCenterX, sceneCenterY - size * 0.04, size * 0.62);
-        glowGradient.addColorStop(0, `${palette.highlight}5c`);
-        glowGradient.addColorStop(0.36, `${palette.accent}24`);
+    function drawBlobbyOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
+        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.11, sceneCenterY - size * 0.17 + interaction.gazeY * size * 0.05, size * 0.05, sceneCenterX, sceneCenterY - size * 0.03, size * 0.66);
+        glowGradient.addColorStop(0, `${palette.highlight}5e`);
+        glowGradient.addColorStop(0.38, `${palette.accent}26`);
         glowGradient.addColorStop(1, `${palette.highlight}00`);
         context.fillStyle = glowGradient;
         context.fillRect(0, 0, size, size);
-        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1700) * size * 0.05, sceneCenterY + size * 0.23, size * 0.08, sceneCenterX, sceneCenterY + size * 0.28, size * 0.5);
-        lowerGradient.addColorStop(0, `${palette.secondary}1d`);
+        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1650) * size * 0.045, sceneCenterY + size * 0.28, size * 0.06, sceneCenterX, sceneCenterY + size * 0.28, size * 0.52);
+        lowerGradient.addColorStop(0, `${palette.secondary}22`);
         lowerGradient.addColorStop(1, `${palette.secondary}00`);
         context.fillStyle = lowerGradient;
         context.fillRect(0, 0, size, size);
     }
     /**
-     * Draws the soft ground shadow below the octopus.
+     * Draws the soft floor shadow that anchors the single mesh in the frame.
      *
      * Uses a scaled radial gradient instead of `context.filter = 'blur()'` to approximate the
      * blurry ellipse without triggering a costly software rasterization pass on every frame.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d2AvatarVisual`
      */
-    function drawOctopus3dShadow(context, size, palette, interaction, timeMs) {
-        const cx = size * 0.5 + interaction.gazeX * size * 0.04;
-        const cy = size * 0.87 + Math.sin(timeMs / 920) * size * 0.008;
-        const rx = size * (0.18 + interaction.intensity * 0.02);
-        const ry = size * 0.06;
+    function drawBlobbyOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile) {
+        const cx = size * 0.5 + interaction.gazeX * size * 0.045;
+        const cy = size * 0.88 + Math.sin(timeMs / 940) * size * 0.008;
+        const rx = size * (0.18 + (morphologyProfile.body.horizontalStretch - 1) * 0.04 + interaction.intensity * 0.018);
+        const ry = size * 0.062;
         context.save();
         context.translate(cx, cy);
         context.scale(1, ry / rx);
@@ -8290,86 +8227,181 @@
         context.restore();
     }
     /**
-     * Resolves visible projected patches for one rotated ellipsoid mesh.
+     * Number of latitude segments used by the single blobby octopus mesh.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d2AvatarVisual`
      */
-    function resolveVisibleEllipsoidPatches(options) {
-        const { center, radiusX, radiusY, radiusZ, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, verticalColorBias, outlineColor, } = options;
-        const latitudePatchCount = 10;
-        const longitudePatchCount = 18;
+    const LATITUDE_PATCH_COUNT$2 = 12;
+    /**
+     * Number of longitude segments used by the single blobby octopus mesh.
+     *
+     * @private helper of `octopus3d2AvatarVisual`
+     */
+    const LONGITUDE_PATCH_COUNT$2 = 24;
+    /**
+     * Resolves all visible projected patches for the single blobby octopus mesh.
+     *
+     * Within a single frame, mesh corner samples and longitude-only lobe-wave values are
+     * quantized to the patch grid and computed once each rather than re-evaluated for every
+     * patch corner — the patch loop alone would call `sampleBlobbyOctopusSurfacePoint`
+     * `latitudePatchCount * longitudePatchCount * 4` times without caching, even though most
+     * corners are shared between neighboring patches.
+     *
+     * @private helper of `octopus3d2AvatarVisual`
+     */
+    function resolveVisibleBlobbyOctopusPatches(options) {
+        const { center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, morphologyProfile, animationPhase, timeMs, } = options;
+        const latitudePatchCount = LATITUDE_PATCH_COUNT$2;
+        const longitudePatchCount = LONGITUDE_PATCH_COUNT$2;
         const surfacePatches = [];
-        for (let latitudeIndex = 0; latitudeIndex < latitudePatchCount; latitudeIndex++) {
-            const startLatitude = -Math.PI / 2 + (latitudeIndex / latitudePatchCount) * Math.PI;
-            const endLatitude = -Math.PI / 2 + ((latitudeIndex + 1) / latitudePatchCount) * Math.PI;
-            const verticalProgress = (latitudeIndex + 0.5) / latitudePatchCount;
-            for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
-                const startLongitude = -Math.PI + (longitudeIndex / longitudePatchCount) * Math.PI * 2;
-                const endLongitude = -Math.PI + ((longitudeIndex + 1) / longitudePatchCount) * Math.PI * 2;
-                const localCorners = [
-                    sampleEllipsoidPoint(radiusX, radiusY, radiusZ, startLatitude, startLongitude),
-                    sampleEllipsoidPoint(radiusX, radiusY, radiusZ, startLatitude, endLongitude),
-                    sampleEllipsoidPoint(radiusX, radiusY, radiusZ, endLatitude, endLongitude),
-                    sampleEllipsoidPoint(radiusX, radiusY, radiusZ, endLatitude, startLongitude),
+        const latitudeBoundaries = new Float64Array(latitudePatchCount + 1);
+        const longitudeBoundaries = new Float64Array(longitudePatchCount + 1);
+        for (let boundaryIndex = 0; boundaryIndex <= latitudePatchCount; boundaryIndex++) {
+            latitudeBoundaries[boundaryIndex] = -Math.PI / 2 + (boundaryIndex / latitudePatchCount) * Math.PI;
+        }
+        for (let boundaryIndex = 0; boundaryIndex <= longitudePatchCount; boundaryIndex++) {
+            longitudeBoundaries[boundaryIndex] = -Math.PI + (boundaryIndex / longitudePatchCount) * Math.PI * 2;
+        }
+        const cachedLobeWavesByCornerLongitude = new Float64Array(longitudePatchCount + 1);
+        for (let boundaryIndex = 0; boundaryIndex <= longitudePatchCount; boundaryIndex++) {
+            cachedLobeWavesByCornerLongitude[boundaryIndex] = resolveLowerLobeWave(longitudeBoundaries[boundaryIndex], morphologyProfile, animationPhase, timeMs);
+        }
+        const cornerCount = (latitudePatchCount + 1) * (longitudePatchCount + 1);
+        const transformedCornerSamples = new Array(cornerCount);
+        for (let latitudeBoundaryIndex = 0; latitudeBoundaryIndex <= latitudePatchCount; latitudeBoundaryIndex++) {
+            const cornerLatitude = latitudeBoundaries[latitudeBoundaryIndex];
+            for (let longitudeBoundaryIndex = 0; longitudeBoundaryIndex <= longitudePatchCount; longitudeBoundaryIndex++) {
+                const cornerLongitude = longitudeBoundaries[longitudeBoundaryIndex];
+                const cornerIndex = latitudeBoundaryIndex * (longitudePatchCount + 1) + longitudeBoundaryIndex;
+                const cornerSample = sampleBlobbyOctopusSurfacePointWithLongitudeCache(options, cornerLatitude, cornerLongitude, cachedLobeWavesByCornerLongitude[longitudeBoundaryIndex]);
+                transformedCornerSamples[cornerIndex] = transformScenePoint(cornerSample, center, rotationX, rotationY);
+            }
+        }
+        for (let latitudeIndex = 0; latitudeIndex < latitudePatchCount; latitudeIndex++) {
+            const startLatitude = latitudeBoundaries[latitudeIndex];
+            const endLatitude = latitudeBoundaries[latitudeIndex + 1];
+            const centerLatitude = (startLatitude + endLatitude) / 2;
+            const verticalProgress = (Math.sin(centerLatitude) + 1) / 2;
+            const startCornerRowOffset = latitudeIndex * (longitudePatchCount + 1);
+            const endCornerRowOffset = (latitudeIndex + 1) * (longitudePatchCount + 1);
+            for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
+                const startLongitude = longitudeBoundaries[longitudeIndex];
+                const endLongitude = longitudeBoundaries[longitudeIndex + 1];
+                const centerLongitude = (startLongitude + endLongitude) / 2;
+                const transformedCorners = [
+                    transformedCornerSamples[startCornerRowOffset + longitudeIndex],
+                    transformedCornerSamples[startCornerRowOffset + longitudeIndex + 1],
+                    transformedCornerSamples[endCornerRowOffset + longitudeIndex + 1],
+                    transformedCornerSamples[endCornerRowOffset + longitudeIndex],
                 ];
-                const transformedCorners = localCorners.map((localCorner) => transformScenePoint(localCorner, center, rotationX, rotationY));
                 const surfaceNormal = normalizeVector3(crossProduct3D(subtractPoint3D(transformedCorners[1], transformedCorners[0]), subtractPoint3D(transformedCorners[2], transformedCorners[0])));
                 if (surfaceNormal.z <= 0.01) {
                     continue;
                 }
-                const projectedCorners = transformedCorners.map((transformedCorner) => projectScenePoint(transformedCorner, size, sceneCenterX, sceneCenterY));
+                const projectedCorners = [
+                    projectScenePoint(transformedCorners[0], size, sceneCenterX, sceneCenterY),
+                    projectScenePoint(transformedCorners[1], size, sceneCenterX, sceneCenterY),
+                    projectScenePoint(transformedCorners[2], size, sceneCenterX, sceneCenterY),
+                    projectScenePoint(transformedCorners[3], size, sceneCenterX, sceneCenterY),
+                ];
                 surfacePatches.push({
                     corners: projectedCorners,
-                    averageDepth: transformedCorners.reduce((depthSum, transformedCorner) => depthSum + transformedCorner.z, 0) /
-                        transformedCorners.length,
+                    averageDepth: (transformedCorners[0].z +
+                        transformedCorners[1].z +
+                        transformedCorners[2].z +
+                        transformedCorners[3].z) /
+                        4,
                     lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION$3), -1, 1),
-                    fillStyle: resolveSurfacePatchFillStyle(palette, verticalProgress + verticalColorBias),
-                    outlineColor,
+                    fillStyle: resolveBlobbySurfacePatchFillStyle$1(palette, verticalProgress, Math.max(0, Math.cos(centerLongitude)), resolveLowerLobeWave(centerLongitude, morphologyProfile, animationPhase, timeMs)),
+                    outlineColor: verticalProgress < 0.58 ? `${palette.highlight}73` : `${palette.shadow}8a`,
                 });
             }
         }
         return surfacePatches;
     }
     /**
-     * Samples one point on an ellipsoid aligned to the local axes.
+     * Samples one point on the continuous Octopus 3D 2 surface.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * The lower hemisphere widens and falls into soft lobe waves so the octopus stays one connected mesh
+     * instead of switching to separately rendered tentacles.
+     *
+     * @private helper of `octopus3d2AvatarVisual`
      */
-    function sampleEllipsoidPoint(radiusX, radiusY, radiusZ, latitude, longitude) {
-        const cosineLatitude = Math.cos(latitude);
+    function sampleBlobbyOctopusSurfacePoint(options, latitude, longitude) {
+        const { morphologyProfile, animationPhase, timeMs } = options;
+        return sampleBlobbyOctopusSurfacePointWithLongitudeCache(options, latitude, longitude, resolveLowerLobeWave(longitude, morphologyProfile, animationPhase, timeMs));
+    }
+    /**
+     * Samples one point on the continuous Octopus 3D 2 surface using a precomputed lower-lobe wave
+     * to skip the per-call trig evaluation for `latitudePatchCount + 1` longitude-shared corners.
+     *
+     * @private helper of `octopus3d2AvatarVisual`
+     */
+    function sampleBlobbyOctopusSurfacePointWithLongitudeCache(options, latitude, longitude, lowerLobeWave) {
+        const { radiusX, radiusY, radiusZ, morphologyProfile, timeMs, animationPhase } = options;
+        const cosineLatitude = Math.max(0, Math.cos(latitude));
+        const verticalProgress = (Math.sin(latitude) + 1) / 2;
+        const upperBlend = Math.pow(1 - verticalProgress, 1.2);
+        const lowerBlend = Math.pow(verticalProgress, 1.42);
+        const skirtEnvelope = Math.pow(cosineLatitude, 0.5) * lowerBlend;
+        const horizontalScale = 1.02 +
+            skirtEnvelope * (0.34 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.22 + lowerLobeWave * 0.22) -
+            upperBlend * 0.08;
+        const depthScale = 1.04 +
+            upperBlend * 0.16 +
+            Math.max(0, Math.cos(longitude)) * 0.1 +
+            skirtEnvelope * (0.08 + lowerLobeWave * 0.06) -
+            Math.max(0, -Math.cos(longitude)) * 0.04;
+        const lowerDrop = skirtEnvelope *
+            radiusY *
+            (0.28 + lowerLobeWave * 0.14 + (morphologyProfile.tentacles.flowLengthScale - 1) * 0.12);
+        const swayX = Math.sin(timeMs / 1250 + longitude * 1.8 + animationPhase) * skirtEnvelope * radiusX * 0.05;
+        const swayZ = Math.cos(timeMs / 1480 + longitude * 1.2 - animationPhase * 0.7) * skirtEnvelope * radiusZ * 0.03;
         return {
-            x: Math.sin(longitude) * cosineLatitude * radiusX,
-            y: Math.sin(latitude) * radiusY,
-            z: Math.cos(longitude) * cosineLatitude * radiusZ,
+            x: Math.sin(longitude) * cosineLatitude * radiusX * horizontalScale + swayX,
+            y: Math.sin(latitude) * radiusY * (1 + upperBlend * 0.14) -
+                upperBlend * radiusY * 0.1 +
+                lowerDrop +
+                Math.sin(timeMs / 1780 + animationPhase + latitude * 1.4) * skirtEnvelope * radiusY * 0.02,
+            z: Math.cos(longitude) * cosineLatitude * radiusZ * depthScale + swayZ,
         };
     }
     /**
-     * Resolves one base fill tone for a surface patch across the octopus body.
+     * Resolves the soft lower-lobe wave that makes the silhouette read more like a real octopus.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d2AvatarVisual`
      */
-    function resolveSurfacePatchFillStyle(palette, verticalProgress) {
-        const clampedVerticalProgress = clampNumber$1(verticalProgress, 0, 1);
-        if (clampedVerticalProgress < 0.2) {
+    function resolveLowerLobeWave(longitude, morphologyProfile, animationPhase, timeMs) {
+        const lobeCount = Math.max(4, Math.round((morphologyProfile.body.lobeCount + morphologyProfile.tentacles.count) / 2));
+        return (Math.cos(longitude * lobeCount + animationPhase + timeMs / 1040) + 1) / 2;
+    }
+    /**
+     * Resolves one base fill tone for a surface patch on the single octopus mesh.
+     *
+     * @private helper of `octopus3d2AvatarVisual`
+     */
+    function resolveBlobbySurfacePatchFillStyle$1(palette, verticalProgress, forwardness, lowerLobeWave) {
+        const tonalProgress = clampNumber$1(verticalProgress + lowerLobeWave * 0.12 - forwardness * 0.07, 0, 1);
+        if (tonalProgress < 0.16) {
             return palette.highlight;
         }
-        if (clampedVerticalProgress < 0.45) {
+        if (tonalProgress < 0.34) {
             return palette.secondary;
         }
-        if (clampedVerticalProgress < 0.8) {
-            return palette.primary;
+        if (tonalProgress < 0.72) {
+            return forwardness > 0.58 ? palette.secondary : palette.primary;
         }
         return `${palette.shadow}f2`;
     }
     /**
-     * Draws one projected mesh patch with organic shading.
+     * Draws one projected patch with soft octopus shading.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d2AvatarVisual`
      */
-    function drawSurfacePatch(context, surfacePatch) {
+    function drawBlobbySurfacePatch(context, surfacePatch) {
         drawProjectedQuad(context, surfacePatch.corners, surfacePatch.fillStyle);
         if (surfacePatch.lightIntensity > 0) {
-            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.15 * surfacePatch.lightIntensity})`);
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.16 * surfacePatch.lightIntensity})`);
         }
         else if (surfacePatch.lightIntensity < 0) {
             drawProjectedQuad(context, surfacePatch.corners, `rgba(0, 0, 0, ${0.24 * Math.abs(surfacePatch.lightIntensity)})`);
@@ -8382,209 +8414,104 @@
         }
         context.closePath();
         context.strokeStyle = surfacePatch.outlineColor;
-        context.lineWidth = Math.max(1, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0044);
+        context.lineWidth = Math.max(1, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0042);
         context.lineJoin = 'round';
         context.stroke();
         context.restore();
     }
+
+    /* eslint-disable no-magic-numbers */
     /**
-     * Creates the projected 3D tentacle strokes orbiting around the lower octopus body.
+     * Light direction used by the continuous octopus mesh shading.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function createOctopusTentacleStrokes(options) {
-        const { createRandom, morphologyProfile, timeMs, size, center, radiusX, radiusY, radiusZ, rotationX, rotationY, sceneCenterX, sceneCenterY, animationPhase, } = options;
-        return Array.from({ length: morphologyProfile.tentacles.count }, (_, tentacleIndex) => {
-            const tentacleRandom = createRandom(`octopus3d-tentacle-${tentacleIndex}`);
-            const spreadProgress = morphologyProfile.tentacles.count === 1 ? 0.5 : tentacleIndex / (morphologyProfile.tentacles.count - 1);
-            const orbitAngle = -Math.PI * 0.92 + spreadProgress * Math.PI * 1.84 + (tentacleRandom() - 0.5) * 0.16;
-            const flowLength = size * (0.19 + morphologyProfile.tentacles.flowLengthScale * 0.075 + tentacleRandom() * 0.018);
-            const lateralReach = size *
-                (0.08 + morphologyProfile.tentacles.lateralReachScale * 0.05 + Math.abs(Math.sin(orbitAngle)) * 0.018);
-            const depthReach = size * (0.028 + morphologyProfile.tentacles.tipReachScale * 0.032);
-            const sway = Math.sin(timeMs / (760 + tentacleIndex * 36) + animationPhase + tentacleRandom() * Math.PI * 2);
-            const anchorPoint = {
-                x: Math.sin(orbitAngle) * radiusX * (0.84 + tentacleRandom() * 0.08),
-                y: radiusY * (0.22 + tentacleRandom() * 0.18),
-                z: Math.cos(orbitAngle) * radiusZ * (0.72 + tentacleRandom() * 0.12),
-            };
-            const controlPointOne = {
-                x: anchorPoint.x + Math.sin(orbitAngle) * lateralReach * 0.44,
-                y: anchorPoint.y + flowLength * 0.26,
-                z: anchorPoint.z + Math.cos(orbitAngle) * depthReach * 0.3 + sway * size * 0.012,
-            };
-            const controlPointTwo = {
-                x: anchorPoint.x +
-                    Math.sin(orbitAngle) * lateralReach * (0.82 + morphologyProfile.tentacles.swayScale * 0.12),
-                y: anchorPoint.y + flowLength * 0.66,
-                z: anchorPoint.z + Math.cos(orbitAngle) * depthReach * 0.72 + sway * size * 0.02,
-            };
-            const endPoint = {
-                x: anchorPoint.x +
-                    Math.sin(orbitAngle) * lateralReach * (1.02 + morphologyProfile.tentacles.tipWidthScale * 0.12) +
-                    sway * size * 0.028,
-                y: anchorPoint.y + flowLength,
-                z: anchorPoint.z + Math.cos(orbitAngle) * depthReach + sway * size * 0.016,
-            };
-            const scenePoints = Array.from({ length: 12 }, (_, sampleIndex) => transformScenePoint(sampleCubicBezierPoint3D(anchorPoint, controlPointOne, controlPointTwo, endPoint, sampleIndex / 11), center, rotationX, rotationY));
-            const projectedPoints = scenePoints.map((scenePoint) => projectScenePoint(scenePoint, size, sceneCenterX, sceneCenterY));
-            const averageDepth = scenePoints.reduce((depthSum, scenePoint) => depthSum + scenePoint.z, 0) / scenePoints.length;
-            return {
-                projectedPoints,
-                averageDepth,
-                isFrontFacing: averageDepth >= center.z - size * 0.006,
-                baseWidth: size *
-                    (0.019 +
-                        morphologyProfile.tentacles.baseWidthScale * 0.007 +
-                        tentacleRandom() * 0.003 +
-                        Math.abs(Math.sin(orbitAngle)) * 0.002),
-                tipWidth: size * (0.0046 + morphologyProfile.tentacles.tipWidthScale * 0.0018),
-                colorBias: tentacleRandom(),
-            };
-        });
-    }
+    const LIGHT_DIRECTION$2 = normalizeVector3({
+        x: 0.34,
+        y: -0.62,
+        z: 1,
+    });
     /**
-     * Samples one point on a cubic Bezier curve in 3D.
+     * Real-octopus tentacle count used by the continuous lower mesh.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function sampleCubicBezierPoint3D(startPoint, controlPointOne, controlPointTwo, endPoint, progress) {
-        const inverseProgress = 1 - progress;
-        return {
-            x: inverseProgress * inverseProgress * inverseProgress * startPoint.x +
-                3 * inverseProgress * inverseProgress * progress * controlPointOne.x +
-                3 * inverseProgress * progress * progress * controlPointTwo.x +
-                progress * progress * progress * endPoint.x,
-            y: inverseProgress * inverseProgress * inverseProgress * startPoint.y +
-                3 * inverseProgress * inverseProgress * progress * controlPointOne.y +
-                3 * inverseProgress * progress * progress * controlPointTwo.y +
-                progress * progress * progress * endPoint.y,
-            z: inverseProgress * inverseProgress * inverseProgress * startPoint.z +
-                3 * inverseProgress * inverseProgress * progress * controlPointOne.z +
-                3 * inverseProgress * progress * progress * controlPointTwo.z +
-                progress * progress * progress * endPoint.z,
-        };
-    }
+    const OCTOPUS_TENTACLE_COUNT$1 = 8;
     /**
-     * Draws one projected tentacle stroke with a slim highlight ridge.
+     * Cache keyed by the `createRandom` factory reference, which is stable for the lifetime of one
+     * mounted `<Avatar/>` component (created inside `resolveAvatarRenderDefinition` and held in a
+     * React `useMemo`).  Using a `WeakMap` ensures the entry is collected when the component unmounts.
      *
-     * @private helper of `octopus3dAvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function drawTentacleStroke(context, tentacleStroke, palette) {
-        const projectedSegments = tentacleStroke.projectedPoints.length - 1;
-        for (let segmentIndex = 0; segmentIndex < projectedSegments; segmentIndex++) {
-            const startPoint = tentacleStroke.projectedPoints[segmentIndex];
-            const endPoint = tentacleStroke.projectedPoints[segmentIndex + 1];
-            const progress = segmentIndex / projectedSegments;
-            const width = tentacleStroke.baseWidth + (tentacleStroke.tipWidth - tentacleStroke.baseWidth) * progress;
-            context.beginPath();
-            context.moveTo(startPoint.x, startPoint.y);
-            context.lineTo(endPoint.x, endPoint.y);
-            context.strokeStyle = tentacleStroke.colorBias > 0.6 ? `${palette.secondary}f0` : `${palette.primary}f0`;
-            context.lineWidth = width;
-            context.lineCap = 'round';
-            context.stroke();
-            context.beginPath();
-            context.moveTo(startPoint.x, startPoint.y);
-            context.lineTo(endPoint.x, endPoint.y);
-            context.strokeStyle = tentacleStroke.isFrontFacing ? `${palette.highlight}80` : `${palette.highlight}40`;
-            context.lineWidth = Math.max(1, width * 0.34);
-            context.lineCap = 'round';
-            context.stroke();
-        }
-    }
-    /**
-     * Resolves the front surface depth on an ellipsoid for one local face point.
-     *
-     * @private helper of `octopus3dAvatarVisual`
-     */
-    function resolveEllipsoidSurfaceDepth(radiusX, radiusY, radiusZ, x, y) {
-        const normalizedX = x / radiusX;
-        const normalizedY = y / radiusY;
-        const remainingDepthRatio = Math.max(0, 1 - normalizedX * normalizedX - normalizedY * normalizedY);
-        return Math.sqrt(remainingDepthRatio) * radiusZ;
-    }
-
-    /* eslint-disable no-magic-numbers */
-    /**
-     * Light direction used by the single-mesh octopus shading.
-     *
-     * @private helper of `octopus3d2AvatarVisual`
-     */
-    const LIGHT_DIRECTION$2 = normalizeVector3({
-        x: 0.38,
-        y: -0.6,
-        z: 0.98,
-    });
-    /**
-     * Cache keyed by the `createRandom` factory reference (stable per mounted `<Avatar/>`).
-     *
-     * @private helper of `octopus3d2AvatarVisual`
-     */
-    const octopus3d2StableStateCache = new WeakMap();
+    const stableStateCache = new WeakMap();
     /**
-     * Returns the stable per-avatar state, computing it on first access and caching for subsequent frames.
+     * Returns the stable per-avatar state, computing it on first access and returning the cached
+     * result on every subsequent call within the same `<Avatar/>` mount.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function getOctopus3d2StableState(createRandom) {
-        const cached = octopus3d2StableStateCache.get(createRandom);
+    function getOctopus3d3StableState(createRandom) {
+        const cached = stableStateCache.get(createRandom);
         if (cached !== undefined) {
             return cached;
         }
-        const animationRandom = createRandom('octopus3d2-animation-profile');
-        const eyeRandom = createRandom('octopus3d2-eye-profile');
+        const morphologyProfile = createOctopus3MorphologyProfile(createRandom);
+        const animationRandom = createRandom('octopus3d3-animation-profile');
+        const eyeRandom = createRandom('octopus3d3-eye-profile');
         const leftEyePhaseOffset = eyeRandom() * 0.7;
         const rightEyePhaseOffset = eyeRandom() * 0.7;
         const state = {
-            morphologyProfile: createOctopus3MorphologyProfile(createRandom),
+            morphologyProfile,
             animationPhase: animationRandom() * Math.PI * 2,
             leftEyePhaseOffset,
             rightEyePhaseOffset,
+            tentacleProfiles: createContinuousTentacleProfiles(createRandom, morphologyProfile),
         };
-        octopus3d2StableStateCache.set(createRandom, state);
+        stableStateCache.set(createRandom, state);
         return state;
     }
     /**
-     * Octopus 3D 2 avatar visual.
+     * Octopus 3D 3 avatar visual.
      *
      * @private built-in avatar visual
      */
-    const octopus3d2AvatarVisual = {
-        id: 'octopus3d2',
-        title: 'Octopus 3D 2',
-        description: 'Continuous blobby 3D octopus portrait with one soft mesh, turning silhouette, and cursor-aware eyes.',
+    const octopus3d3AvatarVisual = {
+        id: 'octopus3d3',
+        title: 'Octopus 3D 3',
+        description: 'Cute continuous 3D octopus with a blobby single mesh, waving tentacle lobes, rich shading, and cursor-aware eyes.',
         isAnimated: true,
         supportsPointerTracking: true,
         render({ context, size, palette, createRandom, timeMs, interaction }) {
-            const { morphologyProfile, animationPhase, leftEyePhaseOffset, rightEyePhaseOffset } = getOctopus3d2StableState(createRandom);
+            const { morphologyProfile, animationPhase, leftEyePhaseOffset, rightEyePhaseOffset, tentacleProfiles } = getOctopus3d3StableState(createRandom);
             const sceneCenterX = size * 0.5;
-            const sceneCenterY = size * 0.575;
-            const bob = Math.sin(timeMs / 940 + animationPhase) * size * 0.013;
+            const sceneCenterY = size * 0.535;
+            const bob = Math.sin(timeMs / 960 + animationPhase) * size * 0.012;
             const meshCenter = {
-                x: interaction.bodyOffsetX * size * 0.044 + size * morphologyProfile.body.centerXJitterRatio * 0.5,
-                y: -size * 0.03 + interaction.bodyOffsetY * size * 0.026 + bob,
+                x: interaction.bodyOffsetX * size * 0.048 + size * morphologyProfile.body.centerXJitterRatio * 0.44,
+                y: -size * 0.07 + interaction.bodyOffsetY * size * 0.026 + bob,
                 z: interaction.intensity * size * 0.018,
             };
-            const rotationY = -0.14 +
-                Math.sin(timeMs / 2600 + animationPhase) * 0.04 +
-                interaction.bodyOffsetX * 0.2 +
-                interaction.gazeX * 0.78;
-            const rotationX = -0.06 +
-                Math.cos(timeMs / 3000 + animationPhase * 0.7) * 0.02 -
+            const rotationY = -0.1 +
+                Math.sin(timeMs / 2700 + animationPhase) * 0.035 +
+                interaction.bodyOffsetX * 0.22 +
+                interaction.gazeX * 0.88;
+            const rotationX = -0.07 +
+                Math.cos(timeMs / 3100 + animationPhase * 0.7) * 0.018 -
                 interaction.bodyOffsetY * 0.08 -
-                interaction.gazeY * 0.34;
+                interaction.gazeY * 0.38;
             const surfaceOptions = {
-                radiusX: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch * 1.02,
-                radiusY: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.22,
+                radiusX: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch * 1.1,
+                radiusY: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.08,
                 radiusZ: size *
                     morphologyProfile.body.bodyRadiusRatio *
-                    (0.98 + (morphologyProfile.body.horizontalStretch - 1) * 0.2),
+                    (1.02 + (morphologyProfile.body.horizontalStretch - 1) * 0.18),
                 morphologyProfile,
                 timeMs,
                 animationPhase,
+                tentacleProfiles,
             };
-            const surfacePatches = resolveVisibleBlobbyOctopusPatches({
+            const surfacePatches = resolveVisibleContinuousOctopusPatches({
                 ...surfaceOptions,
                 center: meshCenter,
                 rotationX,
@@ -8594,62 +8521,109 @@
                 size,
                 palette,
             });
-            const eyeLatitude = clampNumber$1(morphologyProfile.face.eyeCenterYOffsetRatio * 4.4, -0.16, 0.11);
-            const eyeLongitude = clampNumber$1(morphologyProfile.face.eyeSpacingRatio * 3.25, 0.2, 0.34);
-            const mouthLatitude = clampNumber$1(eyeLatitude + 0.19 + morphologyProfile.face.mouthYOffsetRatio * 1.08, 0.08, 0.34);
-            const mouthCenterLongitude = clampNumber$1(morphologyProfile.face.mouthCenterOffsetRatio * 5.8, -0.08, 0.08);
-            const mouthHalfLongitude = clampNumber$1(eyeLongitude * 0.82, 0.16, 0.29);
-            const mouthCurveLatitude = clampNumber$1(mouthLatitude + morphologyProfile.face.mouthCurveDepthRatio * 0.85, mouthLatitude + 0.03, 0.42);
+            const eyeLatitude = clampNumber$1(morphologyProfile.face.eyeCenterYOffsetRatio * 4.2 - 0.03, -0.22, 0.08);
+            const eyeLongitude = clampNumber$1(morphologyProfile.face.eyeSpacingRatio * 3.1, 0.18, 0.32);
+            const mouthLatitude = clampNumber$1(eyeLatitude + 0.2 + morphologyProfile.face.mouthYOffsetRatio, 0.08, 0.34);
+            const mouthCenterLongitude = clampNumber$1(morphologyProfile.face.mouthCenterOffsetRatio * 5.6, -0.08, 0.08);
+            const mouthHalfLongitude = clampNumber$1(eyeLongitude * 0.78, 0.15, 0.28);
+            const mouthCurveLatitude = clampNumber$1(mouthLatitude + morphologyProfile.face.mouthCurveDepthRatio * 0.78, mouthLatitude + 0.03, 0.42);
+            const eyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.76;
+            const eyeRadiusY = eyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.9;
             drawAvatarFrame(context, size, palette);
-            drawBlobbyOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
-            drawBlobbyOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile);
+            drawContinuousOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
+            drawContinuousOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile);
             for (const surfacePatch of surfacePatches.sort((firstSurfacePatch, secondSurfacePatch) => firstSurfacePatch.averageDepth - secondSurfacePatch.averageDepth)) {
-                drawBlobbySurfacePatch(context, surfacePatch);
+                drawContinuousSurfacePatch(context, surfacePatch);
             }
-            const leftEyeLocalCenter = sampleBlobbyOctopusSurfacePoint(surfaceOptions, eyeLatitude, -eyeLongitude);
-            const rightEyeLocalCenter = sampleBlobbyOctopusSurfacePoint(surfaceOptions, eyeLatitude, eyeLongitude);
-            const eyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.78;
-            const eyeRadiusY = eyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.92;
-            drawProjectedOrganicEye(context, leftEyeLocalCenter, eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + leftEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
-            drawProjectedOrganicEye(context, rightEyeLocalCenter, eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.9 + rightEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
+            drawProjectedSurfaceCurrents({
+                context,
+                surfaceOptions,
+                center: meshCenter,
+                rotationX,
+                rotationY,
+                sceneCenterX,
+                sceneCenterY,
+                size,
+                palette,
+                morphologyProfile,
+                timeMs,
+                animationPhase,
+            });
+            drawProjectedTentacleSuckers({
+                context,
+                surfaceOptions,
+                center: meshCenter,
+                rotationX,
+                rotationY,
+                sceneCenterX,
+                sceneCenterY,
+                size,
+                palette,
+            });
+            drawProjectedOrganicEye(context, sampleContinuousOctopusSurfacePoint(surfaceOptions, eyeLatitude, -eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + leftEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
+            drawProjectedOrganicEye(context, sampleContinuousOctopusSurfacePoint(surfaceOptions, eyeLatitude, eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.85 + rightEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
             drawProjectedOrganicMouth(context, [
-                sampleBlobbyOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude - mouthHalfLongitude),
-                sampleBlobbyOctopusSurfacePoint(surfaceOptions, mouthCurveLatitude, mouthCenterLongitude),
-                sampleBlobbyOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude + mouthHalfLongitude),
+                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude - mouthHalfLongitude),
+                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthCurveLatitude, mouthCenterLongitude),
+                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude + mouthHalfLongitude),
             ], meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, palette, size);
         },
     };
     /**
-     * Draws the deep-water glow behind the continuous octopus mesh.
+     * Creates seeded tentacle-lobe profiles around the visible lower octopus body.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function drawBlobbyOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
-        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.11, sceneCenterY - size * 0.17 + interaction.gazeY * size * 0.05, size * 0.05, sceneCenterX, sceneCenterY - size * 0.03, size * 0.66);
-        glowGradient.addColorStop(0, `${palette.highlight}5e`);
-        glowGradient.addColorStop(0.38, `${palette.accent}26`);
+    function createContinuousTentacleProfiles(createRandom, morphologyProfile) {
+        return Array.from({ length: OCTOPUS_TENTACLE_COUNT$1 }, (_, tentacleIndex) => {
+            const tentacleRandom = createRandom(`octopus3d3-tentacle-${tentacleIndex}`);
+            const progress = tentacleIndex / (OCTOPUS_TENTACLE_COUNT$1 - 1);
+            return {
+                centerLongitude: -Math.PI * 0.86 +
+                    progress * Math.PI * 1.72 +
+                    (tentacleRandom() - 0.5) * (0.08 + morphologyProfile.tentacles.rootSpreadScale * 0.03),
+                widthScale: 0.86 + tentacleRandom() * 0.34 + (morphologyProfile.tentacles.baseWidthScale - 1) * 0.16,
+                lengthScale: 0.86 + tentacleRandom() * 0.36 + (morphologyProfile.tentacles.flowLengthScale - 1) * 0.22,
+                swayScale: 0.82 + tentacleRandom() * 0.38 + (morphologyProfile.tentacles.swayScale - 1) * 0.2,
+                depthScale: 0.86 + tentacleRandom() * 0.32 + (morphologyProfile.tentacles.tipReachScale - 1) * 0.2,
+                phase: tentacleRandom() * Math.PI * 2,
+                suckerSide: tentacleRandom() > 0.5 ? 1 : -1,
+            };
+        });
+    }
+    /**
+     * Draws the soft underwater atmosphere behind the continuous octopus mesh.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function drawContinuousOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
+        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.11, sceneCenterY - size * 0.17 + interaction.gazeY * size * 0.05, size * 0.04, sceneCenterX, sceneCenterY, size * (0.66 + interaction.intensity * 0.02));
+        glowGradient.addColorStop(0, `${palette.highlight}66`);
+        glowGradient.addColorStop(0.34, `${palette.accent}2e`);
         glowGradient.addColorStop(1, `${palette.highlight}00`);
         context.fillStyle = glowGradient;
         context.fillRect(0, 0, size, size);
-        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1650) * size * 0.045, sceneCenterY + size * 0.28, size * 0.06, sceneCenterX, sceneCenterY + size * 0.28, size * 0.52);
-        lowerGradient.addColorStop(0, `${palette.secondary}22`);
+        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1550) * size * 0.05, sceneCenterY + size * 0.29, size * 0.06, sceneCenterX, sceneCenterY + size * 0.3, size * 0.54);
+        lowerGradient.addColorStop(0, `${palette.secondary}25`);
         lowerGradient.addColorStop(1, `${palette.secondary}00`);
         context.fillStyle = lowerGradient;
         context.fillRect(0, 0, size, size);
     }
     /**
-     * Draws the soft floor shadow that anchors the single mesh in the frame.
+     * Draws the soft lower shadow that anchors the octopus in the avatar frame.
      *
      * Uses a scaled radial gradient instead of `context.filter = 'blur()'` to approximate the
      * blurry ellipse without triggering a costly software rasterization pass on every frame.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function drawBlobbyOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile) {
+    function drawContinuousOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile) {
         const cx = size * 0.5 + interaction.gazeX * size * 0.045;
-        const cy = size * 0.88 + Math.sin(timeMs / 940) * size * 0.008;
-        const rx = size * (0.18 + (morphologyProfile.body.horizontalStretch - 1) * 0.04 + interaction.intensity * 0.018);
-        const ry = size * 0.062;
+        const cy = size * 0.9 + Math.sin(timeMs / 980) * size * 0.007;
+        const rx = size * (0.19 + morphologyProfile.tentacles.rootSpreadScale * 0.022 + interaction.intensity * 0.02);
+        const ry = size * 0.06;
+        // Scale the context so that drawing a circle produces the correct ellipse aspect ratio,
+        // then fill with a radial gradient that approximates the blurry edge without context.filter.
         context.save();
         context.translate(cx, cy);
         context.scale(1, ry / rx);
@@ -8666,32 +8640,32 @@
         context.restore();
     }
     /**
-     * Number of latitude segments used by the single blobby octopus mesh.
+     * Number of latitude segments used by the continuous Octopus 3D 3 mesh.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    const LATITUDE_PATCH_COUNT$2 = 12;
+    const LATITUDE_PATCH_COUNT$1 = 16;
     /**
-     * Number of longitude segments used by the single blobby octopus mesh.
+     * Number of longitude segments used by the continuous Octopus 3D 3 mesh.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    const LONGITUDE_PATCH_COUNT$2 = 24;
+    const LONGITUDE_PATCH_COUNT$1 = 40;
     /**
-     * Resolves all visible projected patches for the single blobby octopus mesh.
+     * Resolves visible projected patches for the continuous octopus mesh.
      *
-     * Within a single frame, mesh corner samples and longitude-only lobe-wave values are
-     * quantized to the patch grid and computed once each rather than re-evaluated for every
-     * patch corner — the patch loop alone would call `sampleBlobbyOctopusSurfacePoint`
-     * `latitudePatchCount * longitudePatchCount * 4` times without caching, even though most
-     * corners are shared between neighboring patches.
+     * Within a single frame, mesh corner samples and longitude-only computations (tentacle
+     * influence and lobe wave) are quantized to the patch grid and computed once each rather
+     * than re-evaluated for every patch corner — the patch loop alone calls `sampleContinuousOctopusSurfacePoint`
+     * for `latitudePatchCount * longitudePatchCount * 4` corners without caching, and each call
+     * triggers an inner 8-iteration `Math.exp` loop, which dominates the per-frame cost.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function resolveVisibleBlobbyOctopusPatches(options) {
-        const { center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, morphologyProfile, animationPhase, timeMs, } = options;
-        const latitudePatchCount = LATITUDE_PATCH_COUNT$2;
-        const longitudePatchCount = LONGITUDE_PATCH_COUNT$2;
+    function resolveVisibleContinuousOctopusPatches(options) {
+        const { center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette } = options;
+        const latitudePatchCount = LATITUDE_PATCH_COUNT$1;
+        const longitudePatchCount = LONGITUDE_PATCH_COUNT$1;
         const surfacePatches = [];
         const latitudeBoundaries = new Float64Array(latitudePatchCount + 1);
         const longitudeBoundaries = new Float64Array(longitudePatchCount + 1);
@@ -8701,9 +8675,21 @@
         for (let boundaryIndex = 0; boundaryIndex <= longitudePatchCount; boundaryIndex++) {
             longitudeBoundaries[boundaryIndex] = -Math.PI + (boundaryIndex / longitudePatchCount) * Math.PI * 2;
         }
+        const cachedTentacleInfluencesByCornerLongitude = new Array(longitudePatchCount + 1);
         const cachedLobeWavesByCornerLongitude = new Float64Array(longitudePatchCount + 1);
+        const cachedTentacleInfluencesByPatchCenterLongitude = new Array(longitudePatchCount);
+        const cachedLobeWavesByPatchCenterLongitude = new Float64Array(longitudePatchCount);
+        const cachedCosByPatchCenterLongitude = new Float64Array(longitudePatchCount);
         for (let boundaryIndex = 0; boundaryIndex <= longitudePatchCount; boundaryIndex++) {
-            cachedLobeWavesByCornerLongitude[boundaryIndex] = resolveLowerLobeWave(longitudeBoundaries[boundaryIndex], morphologyProfile, animationPhase, timeMs);
+            const cornerLongitude = longitudeBoundaries[boundaryIndex];
+            cachedTentacleInfluencesByCornerLongitude[boundaryIndex] = resolveContinuousTentacleInfluence(options, cornerLongitude);
+            cachedLobeWavesByCornerLongitude[boundaryIndex] = resolveContinuousLobeWave(options, cornerLongitude);
+        }
+        for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
+            const patchCenterLongitude = (longitudeBoundaries[longitudeIndex] + longitudeBoundaries[longitudeIndex + 1]) / 2;
+            cachedTentacleInfluencesByPatchCenterLongitude[longitudeIndex] = resolveContinuousTentacleInfluence(options, patchCenterLongitude);
+            cachedLobeWavesByPatchCenterLongitude[longitudeIndex] = resolveContinuousLobeWave(options, patchCenterLongitude);
+            cachedCosByPatchCenterLongitude[longitudeIndex] = Math.max(0, Math.cos(patchCenterLongitude));
         }
         const cornerCount = (latitudePatchCount + 1) * (longitudePatchCount + 1);
         const transformedCornerSamples = new Array(cornerCount);
@@ -8712,7 +8698,7 @@
             for (let longitudeBoundaryIndex = 0; longitudeBoundaryIndex <= longitudePatchCount; longitudeBoundaryIndex++) {
                 const cornerLongitude = longitudeBoundaries[longitudeBoundaryIndex];
                 const cornerIndex = latitudeBoundaryIndex * (longitudePatchCount + 1) + longitudeBoundaryIndex;
-                const cornerSample = sampleBlobbyOctopusSurfacePointWithLongitudeCache(options, cornerLatitude, cornerLongitude, cachedLobeWavesByCornerLongitude[longitudeBoundaryIndex]);
+                const cornerSample = sampleContinuousOctopusSurfacePointWithLongitudeCache(options, cornerLatitude, cornerLongitude, cachedTentacleInfluencesByCornerLongitude[longitudeBoundaryIndex], cachedLobeWavesByCornerLongitude[longitudeBoundaryIndex]);
                 transformedCornerSamples[cornerIndex] = transformScenePoint(cornerSample, center, rotationX, rotationY);
             }
         }
@@ -8724,9 +8710,6 @@
             const startCornerRowOffset = latitudeIndex * (longitudePatchCount + 1);
             const endCornerRowOffset = (latitudeIndex + 1) * (longitudePatchCount + 1);
             for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
-                const startLongitude = longitudeBoundaries[longitudeIndex];
-                const endLongitude = longitudeBoundaries[longitudeIndex + 1];
-                const centerLongitude = (startLongitude + endLongitude) / 2;
                 const transformedCorners = [
                     transformedCornerSamples[startCornerRowOffset + longitudeIndex],
                     transformedCornerSamples[startCornerRowOffset + longitudeIndex + 1],
@@ -8734,7 +8717,7 @@
                     transformedCornerSamples[endCornerRowOffset + longitudeIndex],
                 ];
                 const surfaceNormal = normalizeVector3(crossProduct3D(subtractPoint3D(transformedCorners[1], transformedCorners[0]), subtractPoint3D(transformedCorners[2], transformedCorners[0])));
-                if (surfaceNormal.z <= 0.01) {
+                if (surfaceNormal.z <= 0.008) {
                     continue;
                 }
                 const projectedCorners = [
@@ -8751,99 +8734,183 @@
                         transformedCorners[3].z) /
                         4,
                     lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION$2), -1, 1),
-                    fillStyle: resolveBlobbySurfacePatchFillStyle$1(palette, verticalProgress, Math.max(0, Math.cos(centerLongitude)), resolveLowerLobeWave(centerLongitude, morphologyProfile, animationPhase, timeMs)),
-                    outlineColor: verticalProgress < 0.58 ? `${palette.highlight}73` : `${palette.shadow}8a`,
+                    fillStyle: resolveContinuousSurfacePatchFillStyle(palette, verticalProgress, cachedCosByPatchCenterLongitude[longitudeIndex], cachedTentacleInfluencesByPatchCenterLongitude[longitudeIndex].core, cachedLobeWavesByPatchCenterLongitude[longitudeIndex]),
+                    outlineColor: verticalProgress < 0.54 ? `${palette.highlight}69` : `${palette.shadow}78`,
                 });
             }
         }
         return surfacePatches;
     }
     /**
-     * Samples one point on the continuous Octopus 3D 2 surface.
+     * Samples one point on the continuous Octopus 3D 3 surface.
      *
-     * The lower hemisphere widens and falls into soft lobe waves so the octopus stays one connected mesh
-     * instead of switching to separately rendered tentacles.
+     * The lower hemisphere is pulled into eight seeded waving lobes, so the portrait reads as
+     * tentacled while still being rendered as one connected blobby mesh.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function sampleBlobbyOctopusSurfacePoint(options, latitude, longitude) {
-        const { morphologyProfile, animationPhase, timeMs } = options;
-        return sampleBlobbyOctopusSurfacePointWithLongitudeCache(options, latitude, longitude, resolveLowerLobeWave(longitude, morphologyProfile, animationPhase, timeMs));
+    function sampleContinuousOctopusSurfacePoint(options, latitude, longitude) {
+        return sampleContinuousOctopusSurfacePointWithLongitudeCache(options, latitude, longitude, resolveContinuousTentacleInfluence(options, longitude), resolveContinuousLobeWave(options, longitude));
     }
     /**
-     * Samples one point on the continuous Octopus 3D 2 surface using a precomputed lower-lobe wave
-     * to skip the per-call trig evaluation for `latitudePatchCount + 1` longitude-shared corners.
+     * Samples one point on the continuous Octopus 3D 3 surface using precomputed longitude-only
+     * values to skip the per-call `Math.exp` tentacle-influence loop and the lobe-wave trig call.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * The patch loop quantizes the mesh into a fixed `(latitudePatchCount + 1) * (longitudePatchCount + 1)`
+     * corner grid, so the same longitude is reused across every latitude row and each
+     * tentacle/lobe value can be computed once per frame instead of `latitudePatchCount * 4` times.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function sampleBlobbyOctopusSurfacePointWithLongitudeCache(options, latitude, longitude, lowerLobeWave) {
+    function sampleContinuousOctopusSurfacePointWithLongitudeCache(options, latitude, longitude, tentacleInfluence, lowerLobeWave) {
         const { radiusX, radiusY, radiusZ, morphologyProfile, timeMs, animationPhase } = options;
         const cosineLatitude = Math.max(0, Math.cos(latitude));
         const verticalProgress = (Math.sin(latitude) + 1) / 2;
-        const upperBlend = Math.pow(1 - verticalProgress, 1.2);
-        const lowerBlend = Math.pow(verticalProgress, 1.42);
-        const skirtEnvelope = Math.pow(cosineLatitude, 0.5) * lowerBlend;
-        const horizontalScale = 1.02 +
-            skirtEnvelope * (0.34 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.22 + lowerLobeWave * 0.22) -
+        const upperBlend = Math.pow(1 - verticalProgress, 1.28);
+        const lowerBlend = smoothStep$1(0.38, 1, verticalProgress);
+        const tipBlend = smoothStep$1(0.68, 1, verticalProgress);
+        const centerPull = resolveSignedAngularDistance$1(longitude, tentacleInfluence.centerLongitude);
+        const effectiveLongitude = longitude + centerPull * lowerBlend * tentacleInfluence.core * (0.24 + tipBlend * 0.2);
+        const mantleRipple = Math.sin(longitude * morphologyProfile.body.lobeCount +
+            animationPhase * 0.6 +
+            timeMs / (1750 + morphologyProfile.body.lobeCount * 30)) *
+            (0.018 + morphologyProfile.body.wobbleAmplitudeRatio * 0.8) *
+            (0.3 + lowerBlend * 0.7);
+        const tentacleWave = Math.sin(timeMs / 760 + tentacleInfluence.phase + verticalProgress * 2.4) *
+            lowerBlend *
+            tentacleInfluence.core *
+            tentacleInfluence.swayScale;
+        const horizontalScale = 1.04 +
+            mantleRipple +
+            lowerBlend * (0.16 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.1) +
+            lowerBlend * tentacleInfluence.core * (0.2 + lowerLobeWave * 0.12) -
             upperBlend * 0.08;
-        const depthScale = 1.04 +
+        const depthScale = 1.06 +
             upperBlend * 0.16 +
-            Math.max(0, Math.cos(longitude)) * 0.1 +
-            skirtEnvelope * (0.08 + lowerLobeWave * 0.06) -
-            Math.max(0, -Math.cos(longitude)) * 0.04;
-        const lowerDrop = skirtEnvelope *
+            Math.max(0, Math.cos(effectiveLongitude)) * 0.1 +
+            lowerBlend * tentacleInfluence.core * (0.1 + tentacleInfluence.depthScale * 0.06) -
+            Math.max(0, -Math.cos(effectiveLongitude)) * 0.05;
+        const tentacleTubeRadius = lowerBlend * tentacleInfluence.core * (0.11 + tipBlend * 0.06 + tentacleInfluence.widthScale * 0.025) * radiusX;
+        const planarRadiusX = cosineLatitude * radiusX * horizontalScale + tentacleTubeRadius;
+        const planarRadiusZ = cosineLatitude * radiusZ * depthScale + tentacleTubeRadius * 0.72;
+        const lowerDrop = lowerBlend *
             radiusY *
-            (0.28 + lowerLobeWave * 0.14 + (morphologyProfile.tentacles.flowLengthScale - 1) * 0.12);
-        const swayX = Math.sin(timeMs / 1250 + longitude * 1.8 + animationPhase) * skirtEnvelope * radiusX * 0.05;
-        const swayZ = Math.cos(timeMs / 1480 + longitude * 1.2 - animationPhase * 0.7) * skirtEnvelope * radiusZ * 0.03;
+            (0.18 +
+                tentacleInfluence.core *
+                    (0.38 +
+                        tentacleInfluence.lengthScale * 0.22 +
+                        (morphologyProfile.tentacles.flowLengthScale - 1) * 0.08));
         return {
-            x: Math.sin(longitude) * cosineLatitude * radiusX * horizontalScale + swayX,
-            y: Math.sin(latitude) * radiusY * (1 + upperBlend * 0.14) -
+            x: Math.sin(effectiveLongitude) * planarRadiusX + tentacleWave * radiusX * (0.052 + tipBlend * 0.05),
+            y: Math.sin(latitude) * radiusY * (1 + upperBlend * 0.12) -
                 upperBlend * radiusY * 0.1 +
                 lowerDrop +
-                Math.sin(timeMs / 1780 + animationPhase + latitude * 1.4) * skirtEnvelope * radiusY * 0.02,
-            z: Math.cos(longitude) * cosineLatitude * radiusZ * depthScale + swayZ,
+                Math.sin(timeMs / 1420 + animationPhase + latitude * 1.6) * lowerBlend * radiusY * 0.018 +
+                Math.cos(timeMs / 880 + tentacleInfluence.phase) *
+                    lowerBlend *
+                    tipBlend *
+                    tentacleInfluence.core *
+                    radiusY *
+                    0.034,
+            z: Math.cos(effectiveLongitude) * planarRadiusZ +
+                Math.cos(timeMs / 980 + tentacleInfluence.phase + verticalProgress) *
+                    lowerBlend *
+                    tentacleInfluence.core *
+                    radiusZ *
+                    0.04,
         };
     }
     /**
-     * Resolves the soft lower-lobe wave that makes the silhouette read more like a real octopus.
+     * Blends nearby seeded tentacle profiles at one mesh longitude.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function resolveLowerLobeWave(longitude, morphologyProfile, animationPhase, timeMs) {
-        const lobeCount = Math.max(4, Math.round((morphologyProfile.body.lobeCount + morphologyProfile.tentacles.count) / 2));
-        return (Math.cos(longitude * lobeCount + animationPhase + timeMs / 1040) + 1) / 2;
+    function resolveContinuousTentacleInfluence(options, longitude) {
+        let totalWeight = 0;
+        let weightedSin = 0;
+        let weightedCos = 0;
+        let weightedWidthScale = 0;
+        let weightedLengthScale = 0;
+        let weightedSwayScale = 0;
+        let weightedDepthScale = 0;
+        let weightedPhase = 0;
+        for (const tentacleProfile of options.tentacleProfiles) {
+            const distance = Math.abs(resolveSignedAngularDistance$1(longitude, tentacleProfile.centerLongitude));
+            const width = 0.2 * tentacleProfile.widthScale;
+            const weight = Math.exp(-(distance * distance) / (width * width));
+            totalWeight += weight;
+            weightedSin += Math.sin(tentacleProfile.centerLongitude) * weight;
+            weightedCos += Math.cos(tentacleProfile.centerLongitude) * weight;
+            weightedWidthScale += tentacleProfile.widthScale * weight;
+            weightedLengthScale += tentacleProfile.lengthScale * weight;
+            weightedSwayScale += tentacleProfile.swayScale * weight;
+            weightedDepthScale += tentacleProfile.depthScale * weight;
+            weightedPhase += tentacleProfile.phase * weight;
+        }
+        if (totalWeight < 0.0001) {
+            return {
+                core: 0,
+                centerLongitude: longitude,
+                widthScale: 1,
+                lengthScale: 1,
+                swayScale: 1,
+                depthScale: 1,
+                phase: 0,
+            };
+        }
+        return {
+            core: clampNumber$1(totalWeight, 0, 1),
+            centerLongitude: Math.atan2(weightedSin / totalWeight, weightedCos / totalWeight),
+            widthScale: weightedWidthScale / totalWeight,
+            lengthScale: weightedLengthScale / totalWeight,
+            swayScale: weightedSwayScale / totalWeight,
+            depthScale: weightedDepthScale / totalWeight,
+            phase: weightedPhase / totalWeight,
+        };
     }
     /**
-     * Resolves one base fill tone for a surface patch on the single octopus mesh.
+     * Resolves the soft lower wave that makes the continuous mesh read as a set of tentacles.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function resolveBlobbySurfacePatchFillStyle$1(palette, verticalProgress, forwardness, lowerLobeWave) {
-        const tonalProgress = clampNumber$1(verticalProgress + lowerLobeWave * 0.12 - forwardness * 0.07, 0, 1);
-        if (tonalProgress < 0.16) {
+    function resolveContinuousLobeWave(options, longitude) {
+        const { morphologyProfile, animationPhase, timeMs } = options;
+        return ((Math.cos(longitude * OCTOPUS_TENTACLE_COUNT$1 +
+            animationPhase +
+            timeMs / (980 + morphologyProfile.body.lobeCount * 18)) +
+            1) /
+            2);
+    }
+    /**
+     * Resolves one base fill tone for a patch on the continuous octopus mesh.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function resolveContinuousSurfacePatchFillStyle(palette, verticalProgress, forwardness, tentacleCore, lowerLobeWave) {
+        const tonalProgress = clampNumber$1(verticalProgress + lowerLobeWave * 0.1 + tentacleCore * 0.08 - forwardness * 0.08, 0, 1);
+        if (tonalProgress < 0.14) {
             return palette.highlight;
         }
-        if (tonalProgress < 0.34) {
+        if (tonalProgress < 0.32) {
             return palette.secondary;
         }
         if (tonalProgress < 0.72) {
-            return forwardness > 0.58 ? palette.secondary : palette.primary;
+            return forwardness > 0.55 ? palette.secondary : palette.primary;
         }
-        return `${palette.shadow}f2`;
+        return tentacleCore > 0.44 ? `${palette.primary}f4` : `${palette.shadow}ee`;
     }
     /**
-     * Draws one projected patch with soft octopus shading.
+     * Draws one projected mesh patch with soft shading and a subtle edge.
      *
-     * @private helper of `octopus3d2AvatarVisual`
+     * @private helper of `octopus3d3AvatarVisual`
      */
-    function drawBlobbySurfacePatch(context, surfacePatch) {
+    function drawContinuousSurfacePatch(context, surfacePatch) {
         drawProjectedQuad(context, surfacePatch.corners, surfacePatch.fillStyle);
         if (surfacePatch.lightIntensity > 0) {
-            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.16 * surfacePatch.lightIntensity})`);
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.18 * surfacePatch.lightIntensity})`);
         }
         else if (surfacePatch.lightIntensity < 0) {
-            drawProjectedQuad(context, surfacePatch.corners, `rgba(0, 0, 0, ${0.24 * Math.abs(surfacePatch.lightIntensity)})`);
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(0, 0, 0, ${0.25 * Math.abs(surfacePatch.lightIntensity)})`);
         }
         context.save();
         context.beginPath();
@@ -8853,51 +8920,180 @@
         }
         context.closePath();
         context.strokeStyle = surfacePatch.outlineColor;
-        context.lineWidth = Math.max(1, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0042);
+        context.lineWidth = Math.max(0.7, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0032);
         context.lineJoin = 'round';
         context.stroke();
         context.restore();
     }
-
-    /* eslint-disable no-magic-numbers */
     /**
-     * Light direction used by the continuous octopus mesh shading.
+     * Draws projected mantle-current lines on the front of the mesh.
      *
      * @private helper of `octopus3d3AvatarVisual`
      */
-    const LIGHT_DIRECTION$1 = normalizeVector3({
-        x: 0.34,
-        y: -0.62,
-        z: 1,
-    });
+    function drawProjectedSurfaceCurrents(options) {
+        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, morphologyProfile, timeMs, animationPhase, } = options;
+        const currentCount = Math.min(6, morphologyProfile.details.mantleCurrentCount);
+        const centerIndex = (currentCount - 1) / 2;
+        context.save();
+        context.lineCap = 'round';
+        context.lineJoin = 'round';
+        for (let currentIndex = 0; currentIndex < currentCount; currentIndex++) {
+            const baseLongitude = (currentIndex - centerIndex) * 0.15;
+            const projectedPoints = [];
+            for (let sampleIndex = 0; sampleIndex < 8; sampleIndex++) {
+                const progress = sampleIndex / 7;
+                const latitude = -0.46 + progress * 0.74;
+                const longitude = baseLongitude + Math.sin(timeMs / 1160 + animationPhase + currentIndex * 0.7 + progress * 2) * 0.035;
+                const scenePoint = transformScenePoint(sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude), center, rotationX, rotationY);
+                if (scenePoint.z > center.z - size * 0.016) {
+                    projectedPoints.push(projectScenePoint(scenePoint, size, sceneCenterX, sceneCenterY));
+                }
+            }
+            if (projectedPoints.length < 3) {
+                continue;
+            }
+            context.beginPath();
+            context.moveTo(projectedPoints[0].x, projectedPoints[0].y);
+            for (const projectedPoint of projectedPoints.slice(1)) {
+                context.lineTo(projectedPoint.x, projectedPoint.y);
+            }
+            context.strokeStyle = currentIndex % 2 === 0 ? `${palette.highlight}3d` : `${palette.accent}33`;
+            context.lineWidth = size * (0.0055 + currentIndex * 0.00045);
+            context.stroke();
+        }
+        context.restore();
+    }
     /**
-     * Real-octopus tentacle count used by the continuous lower mesh.
+     * Draws small projected sucker highlights on the waving lower mesh lobes.
      *
      * @private helper of `octopus3d3AvatarVisual`
      */
-    const OCTOPUS_TENTACLE_COUNT$1 = 8;
+    function drawProjectedTentacleSuckers(options) {
+        const { surfaceOptions, size } = options;
+        const { timeMs } = surfaceOptions;
+        for (const tentacleProfile of surfaceOptions.tentacleProfiles) {
+            if (Math.cos(tentacleProfile.centerLongitude) < -0.12) {
+                continue;
+            }
+            for (let suckerIndex = 0; suckerIndex < 3; suckerIndex++) {
+                const latitude = 0.52 + suckerIndex * 0.14;
+                const sideOffset = tentacleProfile.suckerSide * (0.035 + suckerIndex * 0.012) * tentacleProfile.widthScale;
+                const waveOffset = Math.sin(timeMs / 900 + tentacleProfile.phase + suckerIndex * 0.8) * 0.018;
+                drawProjectedSurfaceSpot({
+                    ...options,
+                    latitude,
+                    longitude: tentacleProfile.centerLongitude + sideOffset + waveOffset,
+                    radiusScale: size * (0.0065 - suckerIndex * 0.0007),
+                });
+            }
+        }
+    }
     /**
-     * Cache keyed by the `createRandom` factory reference, which is stable for the lifetime of one
-     * mounted `<Avatar/>` component (created inside `resolveAvatarRenderDefinition` and held in a
-     * React `useMemo`).  Using a `WeakMap` ensures the entry is collected when the component unmounts.
+     * Draws one tiny projected surface spot by sampling local mesh tangents.
      *
      * @private helper of `octopus3d3AvatarVisual`
      */
-    const stableStateCache = new WeakMap();
-    /**
-     * Returns the stable per-avatar state, computing it on first access and returning the cached
-     * result on every subsequent call within the same `<Avatar/>` mount.
+    function drawProjectedSurfaceSpot(options) {
+        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, latitude, longitude, radiusScale, } = options;
+        const localCenter = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude);
+        const localHorizontal = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude + 0.018);
+        const localVertical = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude + 0.018, longitude);
+        const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
+        if (sceneCenterPoint.z <= center.z - size * 0.012) {
+            return;
+        }
+        const projectedCenterPoint = projectScenePoint(sceneCenterPoint, size, sceneCenterX, sceneCenterY);
+        const projectedHorizontalPoint = projectScenePoint(transformScenePoint(localHorizontal, center, rotationX, rotationY), size, sceneCenterX, sceneCenterY);
+        const projectedVerticalPoint = projectScenePoint(transformScenePoint(localVertical, center, rotationX, rotationY), size, sceneCenterX, sceneCenterY);
+        const horizontalRadius = clampNumber$1(Math.hypot(projectedHorizontalPoint.x - projectedCenterPoint.x, projectedHorizontalPoint.y - projectedCenterPoint.y) *
+            radiusScale *
+            0.74, size * 0.003, size * 0.018);
+        const verticalRadius = clampNumber$1(Math.hypot(projectedVerticalPoint.x - projectedCenterPoint.x, projectedVerticalPoint.y - projectedCenterPoint.y) *
+            radiusScale *
+            0.52, size * 0.0024, size * 0.014);
+        const rotation = Math.atan2(projectedHorizontalPoint.y - projectedCenterPoint.y, projectedHorizontalPoint.x - projectedCenterPoint.x);
+        context.save();
+        context.translate(projectedCenterPoint.x, projectedCenterPoint.y);
+        context.rotate(rotation);
+        context.beginPath();
+        context.ellipse(0, 0, horizontalRadius, verticalRadius, 0, 0, Math.PI * 2);
+        context.fillStyle = `${palette.highlight}73`;
+        context.fill();
+        context.strokeStyle = `${palette.highlight}99`;
+        context.lineWidth = Math.max(0.7, size * 0.0028);
+        context.stroke();
+        context.restore();
+    }
+    /**
+     * Resolves a signed angular distance from the source longitude to the target longitude.
      *
      * @private helper of `octopus3d3AvatarVisual`
      */
-    function getOctopus3d3StableState(createRandom) {
-        const cached = stableStateCache.get(createRandom);
+    function resolveSignedAngularDistance$1(sourceLongitude, targetLongitude) {
+        return Math.atan2(Math.sin(targetLongitude - sourceLongitude), Math.cos(targetLongitude - sourceLongitude));
+    }
+    /**
+     * Smoothly maps a value between two bounds into `[0, 1]`.
+     *
+     * @private helper of `octopus3d3AvatarVisual`
+     */
+    function smoothStep$1(edgeStart, edgeEnd, value) {
+        const progress = clampNumber$1((value - edgeStart) / (edgeEnd - edgeStart), 0, 1);
+        return progress * progress * (3 - 2 * progress);
+    }
+
+    /* eslint-disable no-magic-numbers */
+    /**
+     * Light direction used by the continuous Octopus 3D 4 mesh shading.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    const LIGHT_DIRECTION$1 = normalizeVector3({
+        x: 0.32,
+        y: -0.66,
+        z: 1,
+    });
+    /**
+     * Rim-light direction used to brighten the side of the silhouette.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    const RIM_LIGHT_DIRECTION = normalizeVector3({
+        x: -0.7,
+        y: -0.18,
+        z: 0.55,
+    });
+    /**
+     * Real-octopus tentacle count used by the continuous lower mesh.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    const OCTOPUS_TENTACLE_COUNT = 8;
+    /**
+     * Number of seeded skin spots painted across the octopus body.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    const SKIN_SPOT_COUNT = 14;
+    /**
+     * Cache keyed by the `createRandom` factory reference, stable per mounted `<Avatar/>` component.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    const octopus3d4StableStateCache = new WeakMap();
+    /**
+     * Returns the stable per-avatar state, computing it on first access and caching afterwards.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    function getOctopus3d4StableState(createRandom) {
+        const cached = octopus3d4StableStateCache.get(createRandom);
         if (cached !== undefined) {
             return cached;
         }
         const morphologyProfile = createOctopus3MorphologyProfile(createRandom);
-        const animationRandom = createRandom('octopus3d3-animation-profile');
-        const eyeRandom = createRandom('octopus3d3-eye-profile');
+        const animationRandom = createRandom('octopus3d4-animation-profile');
+        const eyeRandom = createRandom('octopus3d4-eye-profile');
         const leftEyePhaseOffset = eyeRandom() * 0.7;
         const rightEyePhaseOffset = eyeRandom() * 0.7;
         const state = {
@@ -8905,52 +9101,53 @@
             animationPhase: animationRandom() * Math.PI * 2,
             leftEyePhaseOffset,
             rightEyePhaseOffset,
-            tentacleProfiles: createContinuousTentacleProfiles(createRandom, morphologyProfile),
+            tentacleProfiles: createBlobbyContinuousTentacleProfiles(createRandom, morphologyProfile),
+            skinSpots: createBlobbySkinSpots(createRandom),
         };
-        stableStateCache.set(createRandom, state);
+        octopus3d4StableStateCache.set(createRandom, state);
         return state;
     }
     /**
-     * Octopus 3D 3 avatar visual.
+     * Octopus 3D 4 avatar visual.
      *
      * @private built-in avatar visual
      */
-    const octopus3d3AvatarVisual = {
-        id: 'octopus3d3',
-        title: 'Octopus 3D 3',
-        description: 'Cute continuous 3D octopus with a blobby single mesh, waving tentacle lobes, rich shading, and cursor-aware eyes.',
+    const octopus3d4AvatarVisual = {
+        id: 'octopus3d4',
+        title: 'Octopus 3D 4',
+        description: 'Cute blobby 3D octopus rendered as one smooth continuous mesh with naturally undulating tentacles, rich multi-pass shading, pigment spots, and cursor-aware head and eyes.',
         isAnimated: true,
         supportsPointerTracking: true,
         render({ context, size, palette, createRandom, timeMs, interaction }) {
-            const { morphologyProfile, animationPhase, leftEyePhaseOffset, rightEyePhaseOffset, tentacleProfiles } = getOctopus3d3StableState(createRandom);
+            const { morphologyProfile, animationPhase, leftEyePhaseOffset, rightEyePhaseOffset, tentacleProfiles, skinSpots, } = getOctopus3d4StableState(createRandom);
             const sceneCenterX = size * 0.5;
             const sceneCenterY = size * 0.535;
-            const bob = Math.sin(timeMs / 960 + animationPhase) * size * 0.012;
+            const bob = Math.sin(timeMs / 980 + animationPhase) * size * 0.013;
             const meshCenter = {
-                x: interaction.bodyOffsetX * size * 0.048 + size * morphologyProfile.body.centerXJitterRatio * 0.44,
-                y: -size * 0.07 + interaction.bodyOffsetY * size * 0.026 + bob,
-                z: interaction.intensity * size * 0.018,
+                x: interaction.bodyOffsetX * size * 0.052 + size * morphologyProfile.body.centerXJitterRatio * 0.44,
+                y: -size * 0.07 + interaction.bodyOffsetY * size * 0.028 + bob,
+                z: interaction.intensity * size * 0.02,
             };
-            const rotationY = -0.1 +
-                Math.sin(timeMs / 2700 + animationPhase) * 0.035 +
-                interaction.bodyOffsetX * 0.22 +
-                interaction.gazeX * 0.88;
+            const rotationY = -0.08 +
+                Math.sin(timeMs / 2800 + animationPhase) * 0.04 +
+                interaction.bodyOffsetX * 0.24 +
+                interaction.gazeX * 0.98;
             const rotationX = -0.07 +
-                Math.cos(timeMs / 3100 + animationPhase * 0.7) * 0.018 -
+                Math.cos(timeMs / 3200 + animationPhase * 0.7) * 0.02 -
                 interaction.bodyOffsetY * 0.08 -
-                interaction.gazeY * 0.38;
+                interaction.gazeY * 0.42;
             const surfaceOptions = {
-                radiusX: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch * 1.1,
-                radiusY: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.08,
+                radiusX: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch * 1.12,
+                radiusY: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.1,
                 radiusZ: size *
                     morphologyProfile.body.bodyRadiusRatio *
-                    (1.02 + (morphologyProfile.body.horizontalStretch - 1) * 0.18),
+                    (1.04 + (morphologyProfile.body.horizontalStretch - 1) * 0.2),
                 morphologyProfile,
                 timeMs,
                 animationPhase,
                 tentacleProfiles,
             };
-            const surfacePatches = resolveVisibleContinuousOctopusPatches({
+            const surfacePatches = resolveVisibleBlobbyContinuousPatches({
                 ...surfaceOptions,
                 center: meshCenter,
                 rotationX,
@@ -8960,21 +9157,33 @@
                 size,
                 palette,
             });
-            const eyeLatitude = clampNumber$1(morphologyProfile.face.eyeCenterYOffsetRatio * 4.2 - 0.03, -0.22, 0.08);
-            const eyeLongitude = clampNumber$1(morphologyProfile.face.eyeSpacingRatio * 3.1, 0.18, 0.32);
-            const mouthLatitude = clampNumber$1(eyeLatitude + 0.2 + morphologyProfile.face.mouthYOffsetRatio, 0.08, 0.34);
+            const eyeLatitude = clampNumber$1(morphologyProfile.face.eyeCenterYOffsetRatio * 4.4 - 0.04, -0.24, 0.08);
+            const eyeLongitude = clampNumber$1(morphologyProfile.face.eyeSpacingRatio * 3.0, 0.18, 0.32);
+            const mouthLatitude = clampNumber$1(eyeLatitude + 0.21 + morphologyProfile.face.mouthYOffsetRatio, 0.08, 0.34);
             const mouthCenterLongitude = clampNumber$1(morphologyProfile.face.mouthCenterOffsetRatio * 5.6, -0.08, 0.08);
             const mouthHalfLongitude = clampNumber$1(eyeLongitude * 0.78, 0.15, 0.28);
             const mouthCurveLatitude = clampNumber$1(mouthLatitude + morphologyProfile.face.mouthCurveDepthRatio * 0.78, mouthLatitude + 0.03, 0.42);
-            const eyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.76;
-            const eyeRadiusY = eyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.9;
+            const eyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.78;
+            const eyeRadiusY = eyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.92;
             drawAvatarFrame(context, size, palette);
-            drawContinuousOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
-            drawContinuousOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile);
+            drawBlobbyContinuousAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
+            drawBlobbyContinuousShadow(context, size, palette, interaction, timeMs, morphologyProfile);
             for (const surfacePatch of surfacePatches.sort((firstSurfacePatch, secondSurfacePatch) => firstSurfacePatch.averageDepth - secondSurfacePatch.averageDepth)) {
-                drawContinuousSurfacePatch(context, surfacePatch);
+                drawBlobbyContinuousSurfacePatch(context, surfacePatch);
             }
-            drawProjectedSurfaceCurrents({
+            drawBlobbySkinSpots({
+                context,
+                surfaceOptions,
+                center: meshCenter,
+                rotationX,
+                rotationY,
+                sceneCenterX,
+                sceneCenterY,
+                size,
+                palette,
+                skinSpots,
+            });
+            drawBlobbyContinuousCurrents({
                 context,
                 surfaceOptions,
                 center: meshCenter,
@@ -8988,7 +9197,7 @@
                 timeMs,
                 animationPhase,
             });
-            drawProjectedTentacleSuckers({
+            drawBlobbyContinuousSuckers({
                 context,
                 surfaceOptions,
                 center: meshCenter,
@@ -8999,51 +9208,78 @@
                 size,
                 palette,
             });
-            drawProjectedOrganicEye(context, sampleContinuousOctopusSurfacePoint(surfaceOptions, eyeLatitude, -eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + leftEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
-            drawProjectedOrganicEye(context, sampleContinuousOctopusSurfacePoint(surfaceOptions, eyeLatitude, eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.85 + rightEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
+            drawBlobbyContinuousGloss({
+                context,
+                surfaceOptions,
+                center: meshCenter,
+                rotationX,
+                rotationY,
+                sceneCenterX,
+                sceneCenterY,
+                size,
+                palette,
+            });
+            drawProjectedOrganicEye(context, sampleBlobbyContinuousSurfacePoint(surfaceOptions, eyeLatitude, -eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + leftEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
+            drawProjectedOrganicEye(context, sampleBlobbyContinuousSurfacePoint(surfaceOptions, eyeLatitude, eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.85 + rightEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
             drawProjectedOrganicMouth(context, [
-                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude - mouthHalfLongitude),
-                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthCurveLatitude, mouthCenterLongitude),
-                sampleContinuousOctopusSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude + mouthHalfLongitude),
+                sampleBlobbyContinuousSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude - mouthHalfLongitude),
+                sampleBlobbyContinuousSurfacePoint(surfaceOptions, mouthCurveLatitude, mouthCenterLongitude),
+                sampleBlobbyContinuousSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude + mouthHalfLongitude),
             ], meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, palette, size);
         },
     };
     /**
      * Creates seeded tentacle-lobe profiles around the visible lower octopus body.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function createContinuousTentacleProfiles(createRandom, morphologyProfile) {
-        return Array.from({ length: OCTOPUS_TENTACLE_COUNT$1 }, (_, tentacleIndex) => {
-            const tentacleRandom = createRandom(`octopus3d3-tentacle-${tentacleIndex}`);
-            const progress = tentacleIndex / (OCTOPUS_TENTACLE_COUNT$1 - 1);
+    function createBlobbyContinuousTentacleProfiles(createRandom, morphologyProfile) {
+        return Array.from({ length: OCTOPUS_TENTACLE_COUNT }, (_, tentacleIndex) => {
+            const tentacleRandom = createRandom(`octopus3d4-tentacle-${tentacleIndex}`);
+            const progress = tentacleIndex / (OCTOPUS_TENTACLE_COUNT - 1);
             return {
-                centerLongitude: -Math.PI * 0.86 +
-                    progress * Math.PI * 1.72 +
-                    (tentacleRandom() - 0.5) * (0.08 + morphologyProfile.tentacles.rootSpreadScale * 0.03),
-                widthScale: 0.86 + tentacleRandom() * 0.34 + (morphologyProfile.tentacles.baseWidthScale - 1) * 0.16,
-                lengthScale: 0.86 + tentacleRandom() * 0.36 + (morphologyProfile.tentacles.flowLengthScale - 1) * 0.22,
-                swayScale: 0.82 + tentacleRandom() * 0.38 + (morphologyProfile.tentacles.swayScale - 1) * 0.2,
-                depthScale: 0.86 + tentacleRandom() * 0.32 + (morphologyProfile.tentacles.tipReachScale - 1) * 0.2,
-                phase: tentacleRandom() * Math.PI * 2,
+                centerLongitude: -Math.PI * 0.9 +
+                    progress * Math.PI * 1.8 +
+                    (tentacleRandom() - 0.5) * (0.06 + morphologyProfile.tentacles.rootSpreadScale * 0.025),
+                widthScale: 0.92 + tentacleRandom() * 0.3 + (morphologyProfile.tentacles.baseWidthScale - 1) * 0.18,
+                lengthScale: 0.9 + tentacleRandom() * 0.34 + (morphologyProfile.tentacles.flowLengthScale - 1) * 0.24,
+                swayScale: 0.86 + tentacleRandom() * 0.4 + (morphologyProfile.tentacles.swayScale - 1) * 0.22,
+                depthScale: 0.9 + tentacleRandom() * 0.3 + (morphologyProfile.tentacles.tipReachScale - 1) * 0.22,
+                curlScale: 0.62 + tentacleRandom() * 0.46,
+                primaryPhase: tentacleRandom() * Math.PI * 2,
+                secondaryPhase: tentacleRandom() * Math.PI * 2,
                 suckerSide: tentacleRandom() > 0.5 ? 1 : -1,
             };
         });
     }
+    /**
+     * Creates seeded skin pigment spots distributed across the upper octopus mesh.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    function createBlobbySkinSpots(createRandom) {
+        const spotRandom = createRandom('octopus3d4-skin-spots');
+        return Array.from({ length: SKIN_SPOT_COUNT }, () => ({
+            latitude: -0.45 + spotRandom() * 0.7,
+            longitude: -0.5 + spotRandom() * 1.0,
+            radiusScale: 0.0028 + spotRandom() * 0.0052,
+            opacity: 0.16 + spotRandom() * 0.22,
+        }));
+    }
     /**
      * Draws the soft underwater atmosphere behind the continuous octopus mesh.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function drawContinuousOctopusAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
-        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.11, sceneCenterY - size * 0.17 + interaction.gazeY * size * 0.05, size * 0.04, sceneCenterX, sceneCenterY, size * (0.66 + interaction.intensity * 0.02));
-        glowGradient.addColorStop(0, `${palette.highlight}66`);
-        glowGradient.addColorStop(0.34, `${palette.accent}2e`);
+    function drawBlobbyContinuousAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
+        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.12, sceneCenterY - size * 0.18 + interaction.gazeY * size * 0.05, size * 0.04, sceneCenterX, sceneCenterY, size * (0.68 + interaction.intensity * 0.025));
+        glowGradient.addColorStop(0, `${palette.highlight}74`);
+        glowGradient.addColorStop(0.32, `${palette.accent}32`);
         glowGradient.addColorStop(1, `${palette.highlight}00`);
         context.fillStyle = glowGradient;
         context.fillRect(0, 0, size, size);
-        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1550) * size * 0.05, sceneCenterY + size * 0.29, size * 0.06, sceneCenterX, sceneCenterY + size * 0.3, size * 0.54);
-        lowerGradient.addColorStop(0, `${palette.secondary}25`);
+        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1500) * size * 0.05, sceneCenterY + size * 0.3, size * 0.06, sceneCenterX, sceneCenterY + size * 0.3, size * 0.56);
+        lowerGradient.addColorStop(0, `${palette.secondary}28`);
         lowerGradient.addColorStop(1, `${palette.secondary}00`);
         context.fillStyle = lowerGradient;
         context.fillRect(0, 0, size, size);
@@ -9051,26 +9287,21 @@
     /**
      * Draws the soft lower shadow that anchors the octopus in the avatar frame.
      *
-     * Uses a scaled radial gradient instead of `context.filter = 'blur()'` to approximate the
-     * blurry ellipse without triggering a costly software rasterization pass on every frame.
-     *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function drawContinuousOctopusShadow(context, size, palette, interaction, timeMs, morphologyProfile) {
-        const cx = size * 0.5 + interaction.gazeX * size * 0.045;
+    function drawBlobbyContinuousShadow(context, size, palette, interaction, timeMs, morphologyProfile) {
+        const cx = size * 0.5 + interaction.gazeX * size * 0.046;
         const cy = size * 0.9 + Math.sin(timeMs / 980) * size * 0.007;
-        const rx = size * (0.19 + morphologyProfile.tentacles.rootSpreadScale * 0.022 + interaction.intensity * 0.02);
-        const ry = size * 0.06;
-        // Scale the context so that drawing a circle produces the correct ellipse aspect ratio,
-        // then fill with a radial gradient that approximates the blurry edge without context.filter.
+        const rx = size * (0.2 + morphologyProfile.tentacles.rootSpreadScale * 0.024 + interaction.intensity * 0.022);
+        const ry = size * 0.062;
         context.save();
         context.translate(cx, cy);
         context.scale(1, ry / rx);
-        const blurRadius = rx * 1.4;
+        const blurRadius = rx * 1.42;
         const shadowGradient = context.createRadialGradient(0, 0, 0, 0, 0, blurRadius);
-        shadowGradient.addColorStop(0, `${palette.shadow}7a`);
-        shadowGradient.addColorStop(0.45, `${palette.shadow}44`);
-        shadowGradient.addColorStop(0.8, `${palette.shadow}1a`);
+        shadowGradient.addColorStop(0, `${palette.shadow}82`);
+        shadowGradient.addColorStop(0.45, `${palette.shadow}4a`);
+        shadowGradient.addColorStop(0.8, `${palette.shadow}1c`);
         shadowGradient.addColorStop(1, `${palette.shadow}00`);
         context.fillStyle = shadowGradient;
         context.beginPath();
@@ -9079,32 +9310,30 @@
         context.restore();
     }
     /**
-     * Number of latitude segments used by the continuous Octopus 3D 3 mesh.
+     * Number of latitude segments used by the continuous Octopus 3D 4 mesh.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    const LATITUDE_PATCH_COUNT$1 = 16;
+    const LATITUDE_PATCH_COUNT = 20;
     /**
-     * Number of longitude segments used by the continuous Octopus 3D 3 mesh.
+     * Number of longitude segments used by the continuous Octopus 3D 4 mesh.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    const LONGITUDE_PATCH_COUNT$1 = 40;
+    const LONGITUDE_PATCH_COUNT = 48;
     /**
-     * Resolves visible projected patches for the continuous octopus mesh.
+     * Resolves visible projected patches for the continuous Octopus 3D 4 mesh.
      *
      * Within a single frame, mesh corner samples and longitude-only computations (tentacle
      * influence and lobe wave) are quantized to the patch grid and computed once each rather
-     * than re-evaluated for every patch corner — the patch loop alone calls `sampleContinuousOctopusSurfacePoint`
-     * for `latitudePatchCount * longitudePatchCount * 4` corners without caching, and each call
-     * triggers an inner 8-iteration `Math.exp` loop, which dominates the per-frame cost.
+     * than re-evaluated for every patch corner.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function resolveVisibleContinuousOctopusPatches(options) {
+    function resolveVisibleBlobbyContinuousPatches(options) {
         const { center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette } = options;
-        const latitudePatchCount = LATITUDE_PATCH_COUNT$1;
-        const longitudePatchCount = LONGITUDE_PATCH_COUNT$1;
+        const latitudePatchCount = LATITUDE_PATCH_COUNT;
+        const longitudePatchCount = LONGITUDE_PATCH_COUNT;
         const surfacePatches = [];
         const latitudeBoundaries = new Float64Array(latitudePatchCount + 1);
         const longitudeBoundaries = new Float64Array(longitudePatchCount + 1);
@@ -9121,13 +9350,13 @@
         const cachedCosByPatchCenterLongitude = new Float64Array(longitudePatchCount);
         for (let boundaryIndex = 0; boundaryIndex <= longitudePatchCount; boundaryIndex++) {
             const cornerLongitude = longitudeBoundaries[boundaryIndex];
-            cachedTentacleInfluencesByCornerLongitude[boundaryIndex] = resolveContinuousTentacleInfluence(options, cornerLongitude);
-            cachedLobeWavesByCornerLongitude[boundaryIndex] = resolveContinuousLobeWave(options, cornerLongitude);
+            cachedTentacleInfluencesByCornerLongitude[boundaryIndex] = resolveBlobbyTentacleInfluence(options, cornerLongitude);
+            cachedLobeWavesByCornerLongitude[boundaryIndex] = resolveBlobbyLobeWave(options, cornerLongitude);
         }
         for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
             const patchCenterLongitude = (longitudeBoundaries[longitudeIndex] + longitudeBoundaries[longitudeIndex + 1]) / 2;
-            cachedTentacleInfluencesByPatchCenterLongitude[longitudeIndex] = resolveContinuousTentacleInfluence(options, patchCenterLongitude);
-            cachedLobeWavesByPatchCenterLongitude[longitudeIndex] = resolveContinuousLobeWave(options, patchCenterLongitude);
+            cachedTentacleInfluencesByPatchCenterLongitude[longitudeIndex] = resolveBlobbyTentacleInfluence(options, patchCenterLongitude);
+            cachedLobeWavesByPatchCenterLongitude[longitudeIndex] = resolveBlobbyLobeWave(options, patchCenterLongitude);
             cachedCosByPatchCenterLongitude[longitudeIndex] = Math.max(0, Math.cos(patchCenterLongitude));
         }
         const cornerCount = (latitudePatchCount + 1) * (longitudePatchCount + 1);
@@ -9137,7 +9366,7 @@
             for (let longitudeBoundaryIndex = 0; longitudeBoundaryIndex <= longitudePatchCount; longitudeBoundaryIndex++) {
                 const cornerLongitude = longitudeBoundaries[longitudeBoundaryIndex];
                 const cornerIndex = latitudeBoundaryIndex * (longitudePatchCount + 1) + longitudeBoundaryIndex;
-                const cornerSample = sampleContinuousOctopusSurfacePointWithLongitudeCache(options, cornerLatitude, cornerLongitude, cachedTentacleInfluencesByCornerLongitude[longitudeBoundaryIndex], cachedLobeWavesByCornerLongitude[longitudeBoundaryIndex]);
+                const cornerSample = sampleBlobbyContinuousSurfacePointWithLongitudeCache(options, cornerLatitude, cornerLongitude, cachedTentacleInfluencesByCornerLongitude[longitudeBoundaryIndex], cachedLobeWavesByCornerLongitude[longitudeBoundaryIndex]);
                 transformedCornerSamples[cornerIndex] = transformScenePoint(cornerSample, center, rotationX, rotationY);
             }
         }
@@ -9156,7 +9385,7 @@
                     transformedCornerSamples[endCornerRowOffset + longitudeIndex],
                 ];
                 const surfaceNormal = normalizeVector3(crossProduct3D(subtractPoint3D(transformedCorners[1], transformedCorners[0]), subtractPoint3D(transformedCorners[2], transformedCorners[0])));
-                if (surfaceNormal.z <= 0.008) {
+                if (surfaceNormal.z <= 0.006) {
                     continue;
                 }
                 const projectedCorners = [
@@ -9165,6 +9394,8 @@
                     projectScenePoint(transformedCorners[2], size, sceneCenterX, sceneCenterY),
                     projectScenePoint(transformedCorners[3], size, sceneCenterX, sceneCenterY),
                 ];
+                const lightIntensity = clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION$1), -1, 1);
+                const rimLightIntensity = Math.pow(clampNumber$1(dotProduct3D(surfaceNormal, RIM_LIGHT_DIRECTION), 0, 1), 2.6);
                 surfacePatches.push({
                     corners: projectedCorners,
                     averageDepth: (transformedCorners[0].z +
@@ -9172,99 +9403,108 @@
                         transformedCorners[2].z +
                         transformedCorners[3].z) /
                         4,
-                    lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION$1), -1, 1),
-                    fillStyle: resolveContinuousSurfacePatchFillStyle(palette, verticalProgress, cachedCosByPatchCenterLongitude[longitudeIndex], cachedTentacleInfluencesByPatchCenterLongitude[longitudeIndex].core, cachedLobeWavesByPatchCenterLongitude[longitudeIndex]),
-                    outlineColor: verticalProgress < 0.54 ? `${palette.highlight}69` : `${palette.shadow}78`,
+                    lightIntensity,
+                    rimLightIntensity,
+                    fillStyle: resolveBlobbySurfacePatchFillStyle(palette, verticalProgress, cachedCosByPatchCenterLongitude[longitudeIndex], cachedTentacleInfluencesByPatchCenterLongitude[longitudeIndex].core, cachedLobeWavesByPatchCenterLongitude[longitudeIndex]),
+                    outlineColor: verticalProgress < 0.52 ? `${palette.highlight}5c` : `${palette.shadow}66`,
                 });
             }
         }
         return surfacePatches;
     }
     /**
-     * Samples one point on the continuous Octopus 3D 3 surface.
-     *
-     * The lower hemisphere is pulled into eight seeded waving lobes, so the portrait reads as
-     * tentacled while still being rendered as one connected blobby mesh.
+     * Samples one point on the continuous Octopus 3D 4 surface.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function sampleContinuousOctopusSurfacePoint(options, latitude, longitude) {
-        return sampleContinuousOctopusSurfacePointWithLongitudeCache(options, latitude, longitude, resolveContinuousTentacleInfluence(options, longitude), resolveContinuousLobeWave(options, longitude));
+    function sampleBlobbyContinuousSurfacePoint(options, latitude, longitude) {
+        return sampleBlobbyContinuousSurfacePointWithLongitudeCache(options, latitude, longitude, resolveBlobbyTentacleInfluence(options, longitude), resolveBlobbyLobeWave(options, longitude));
     }
     /**
-     * Samples one point on the continuous Octopus 3D 3 surface using precomputed longitude-only
-     * values to skip the per-call `Math.exp` tentacle-influence loop and the lobe-wave trig call.
+     * Samples one point on the continuous Octopus 3D 4 surface using precomputed longitude-only values.
      *
-     * The patch loop quantizes the mesh into a fixed `(latitudePatchCount + 1) * (longitudePatchCount + 1)`
-     * corner grid, so the same longitude is reused across every latitude row and each
-     * tentacle/lobe value can be computed once per frame instead of `latitudePatchCount * 4` times.
+     * The patch loop quantizes the mesh into a fixed corner grid, so the same longitude is reused
+     * across every latitude row and each tentacle/lobe value is computed once per frame instead
+     * of `latitudePatchCount * 4` times.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function sampleContinuousOctopusSurfacePointWithLongitudeCache(options, latitude, longitude, tentacleInfluence, lowerLobeWave) {
+    function sampleBlobbyContinuousSurfacePointWithLongitudeCache(options, latitude, longitude, tentacleInfluence, lowerLobeWave) {
         const { radiusX, radiusY, radiusZ, morphologyProfile, timeMs, animationPhase } = options;
         const cosineLatitude = Math.max(0, Math.cos(latitude));
         const verticalProgress = (Math.sin(latitude) + 1) / 2;
-        const upperBlend = Math.pow(1 - verticalProgress, 1.28);
-        const lowerBlend = smoothStep$1(0.38, 1, verticalProgress);
-        const tipBlend = smoothStep$1(0.68, 1, verticalProgress);
-        const centerPull = resolveSignedAngularDistance$1(longitude, tentacleInfluence.centerLongitude);
-        const effectiveLongitude = longitude + centerPull * lowerBlend * tentacleInfluence.core * (0.24 + tipBlend * 0.2);
+        const upperBlend = Math.pow(1 - verticalProgress, 1.32);
+        const lowerBlend = smoothStep(0.34, 1, verticalProgress);
+        const tipBlend = smoothStep(0.66, 1, verticalProgress);
+        const centerPull = resolveSignedAngularDistance(longitude, tentacleInfluence.centerLongitude);
+        const effectiveLongitude = longitude + centerPull * lowerBlend * tentacleInfluence.core * (0.26 + tipBlend * 0.22);
         const mantleRipple = Math.sin(longitude * morphologyProfile.body.lobeCount +
             animationPhase * 0.6 +
-            timeMs / (1750 + morphologyProfile.body.lobeCount * 30)) *
-            (0.018 + morphologyProfile.body.wobbleAmplitudeRatio * 0.8) *
-            (0.3 + lowerBlend * 0.7);
-        const tentacleWave = Math.sin(timeMs / 760 + tentacleInfluence.phase + verticalProgress * 2.4) *
+            timeMs / (1700 + morphologyProfile.body.lobeCount * 28)) *
+            (0.018 + morphologyProfile.body.wobbleAmplitudeRatio * 0.78) *
+            (0.32 + lowerBlend * 0.7);
+        const primaryTentacleWave = Math.sin(timeMs / 740 + tentacleInfluence.primaryPhase + verticalProgress * 2.6) *
             lowerBlend *
             tentacleInfluence.core *
             tentacleInfluence.swayScale;
-        const horizontalScale = 1.04 +
+        const secondaryTentacleWave = Math.sin(timeMs / 470 + tentacleInfluence.secondaryPhase + verticalProgress * 4.2) *
+            lowerBlend *
+            tentacleInfluence.core *
+            tentacleInfluence.swayScale *
+            0.42;
+        const tentacleCurl = Math.sin(timeMs / 1180 + tentacleInfluence.primaryPhase * 0.6 + verticalProgress * 3.2) *
+            tipBlend *
+            tentacleInfluence.core *
+            tentacleInfluence.curlScale *
+            0.36;
+        const horizontalScale = 1.06 +
             mantleRipple +
-            lowerBlend * (0.16 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.1) +
-            lowerBlend * tentacleInfluence.core * (0.2 + lowerLobeWave * 0.12) -
+            lowerBlend * (0.18 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.12) +
+            lowerBlend * tentacleInfluence.core * (0.22 + lowerLobeWave * 0.14) -
             upperBlend * 0.08;
-        const depthScale = 1.06 +
+        const depthScale = 1.08 +
             upperBlend * 0.16 +
-            Math.max(0, Math.cos(effectiveLongitude)) * 0.1 +
-            lowerBlend * tentacleInfluence.core * (0.1 + tentacleInfluence.depthScale * 0.06) -
+            Math.max(0, Math.cos(effectiveLongitude)) * 0.12 +
+            lowerBlend * tentacleInfluence.core * (0.12 + tentacleInfluence.depthScale * 0.07) -
             Math.max(0, -Math.cos(effectiveLongitude)) * 0.05;
-        const tentacleTubeRadius = lowerBlend * tentacleInfluence.core * (0.11 + tipBlend * 0.06 + tentacleInfluence.widthScale * 0.025) * radiusX;
+        const tentacleTubeRadius = lowerBlend * tentacleInfluence.core * (0.12 + tipBlend * 0.07 + tentacleInfluence.widthScale * 0.028) * radiusX;
         const planarRadiusX = cosineLatitude * radiusX * horizontalScale + tentacleTubeRadius;
-        const planarRadiusZ = cosineLatitude * radiusZ * depthScale + tentacleTubeRadius * 0.72;
+        const planarRadiusZ = cosineLatitude * radiusZ * depthScale + tentacleTubeRadius * 0.74;
         const lowerDrop = lowerBlend *
             radiusY *
-            (0.18 +
+            (0.2 +
                 tentacleInfluence.core *
-                    (0.38 +
-                        tentacleInfluence.lengthScale * 0.22 +
-                        (morphologyProfile.tentacles.flowLengthScale - 1) * 0.08));
+                    (0.42 +
+                        tentacleInfluence.lengthScale * 0.24 +
+                        (morphologyProfile.tentacles.flowLengthScale - 1) * 0.1));
+        const combinedTentacleSway = (primaryTentacleWave + secondaryTentacleWave) * radiusX * (0.06 + tipBlend * 0.06);
         return {
-            x: Math.sin(effectiveLongitude) * planarRadiusX + tentacleWave * radiusX * (0.052 + tipBlend * 0.05),
-            y: Math.sin(latitude) * radiusY * (1 + upperBlend * 0.12) -
-                upperBlend * radiusY * 0.1 +
+            x: Math.sin(effectiveLongitude) * planarRadiusX + combinedTentacleSway + tentacleCurl * radiusX * 0.18,
+            y: Math.sin(latitude) * radiusY * (1 + upperBlend * 0.14) -
+                upperBlend * radiusY * 0.12 +
                 lowerDrop +
-                Math.sin(timeMs / 1420 + animationPhase + latitude * 1.6) * lowerBlend * radiusY * 0.018 +
-                Math.cos(timeMs / 880 + tentacleInfluence.phase) *
+                Math.sin(timeMs / 1380 + animationPhase + latitude * 1.5) * lowerBlend * radiusY * 0.022 +
+                Math.cos(timeMs / 820 + tentacleInfluence.primaryPhase) *
                     lowerBlend *
                     tipBlend *
                     tentacleInfluence.core *
                     radiusY *
-                    0.034,
+                    0.04,
             z: Math.cos(effectiveLongitude) * planarRadiusZ +
-                Math.cos(timeMs / 980 + tentacleInfluence.phase + verticalProgress) *
+                Math.cos(timeMs / 960 + tentacleInfluence.primaryPhase + verticalProgress) *
                     lowerBlend *
                     tentacleInfluence.core *
                     radiusZ *
-                    0.04,
+                    0.044 +
+                tentacleCurl * radiusZ * 0.14,
         };
     }
     /**
      * Blends nearby seeded tentacle profiles at one mesh longitude.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function resolveContinuousTentacleInfluence(options, longitude) {
+    function resolveBlobbyTentacleInfluence(options, longitude) {
         let totalWeight = 0;
         let weightedSin = 0;
         let weightedCos = 0;
@@ -9272,10 +9512,12 @@
         let weightedLengthScale = 0;
         let weightedSwayScale = 0;
         let weightedDepthScale = 0;
-        let weightedPhase = 0;
+        let weightedCurlScale = 0;
+        let weightedPrimaryPhase = 0;
+        let weightedSecondaryPhase = 0;
         for (const tentacleProfile of options.tentacleProfiles) {
-            const distance = Math.abs(resolveSignedAngularDistance$1(longitude, tentacleProfile.centerLongitude));
-            const width = 0.2 * tentacleProfile.widthScale;
+            const distance = Math.abs(resolveSignedAngularDistance(longitude, tentacleProfile.centerLongitude));
+            const width = 0.22 * tentacleProfile.widthScale;
             const weight = Math.exp(-(distance * distance) / (width * width));
             totalWeight += weight;
             weightedSin += Math.sin(tentacleProfile.centerLongitude) * weight;
@@ -9284,7 +9526,9 @@
             weightedLengthScale += tentacleProfile.lengthScale * weight;
             weightedSwayScale += tentacleProfile.swayScale * weight;
             weightedDepthScale += tentacleProfile.depthScale * weight;
-            weightedPhase += tentacleProfile.phase * weight;
+            weightedCurlScale += tentacleProfile.curlScale * weight;
+            weightedPrimaryPhase += tentacleProfile.primaryPhase * weight;
+            weightedSecondaryPhase += tentacleProfile.secondaryPhase * weight;
         }
         if (totalWeight < 0.0001) {
             return {
@@ -9294,7 +9538,9 @@
                 lengthScale: 1,
                 swayScale: 1,
                 depthScale: 1,
-                phase: 0,
+                curlScale: 1,
+                primaryPhase: 0,
+                secondaryPhase: 0,
             };
         }
         return {
@@ -9304,52 +9550,57 @@
             lengthScale: weightedLengthScale / totalWeight,
             swayScale: weightedSwayScale / totalWeight,
             depthScale: weightedDepthScale / totalWeight,
-            phase: weightedPhase / totalWeight,
+            curlScale: weightedCurlScale / totalWeight,
+            primaryPhase: weightedPrimaryPhase / totalWeight,
+            secondaryPhase: weightedSecondaryPhase / totalWeight,
         };
     }
     /**
      * Resolves the soft lower wave that makes the continuous mesh read as a set of tentacles.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function resolveContinuousLobeWave(options, longitude) {
+    function resolveBlobbyLobeWave(options, longitude) {
         const { morphologyProfile, animationPhase, timeMs } = options;
-        return ((Math.cos(longitude * OCTOPUS_TENTACLE_COUNT$1 +
+        return ((Math.cos(longitude * OCTOPUS_TENTACLE_COUNT +
             animationPhase +
-            timeMs / (980 + morphologyProfile.body.lobeCount * 18)) +
+            timeMs / (940 + morphologyProfile.body.lobeCount * 18)) +
             1) /
             2);
     }
     /**
      * Resolves one base fill tone for a patch on the continuous octopus mesh.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function resolveContinuousSurfacePatchFillStyle(palette, verticalProgress, forwardness, tentacleCore, lowerLobeWave) {
+    function resolveBlobbySurfacePatchFillStyle(palette, verticalProgress, forwardness, tentacleCore, lowerLobeWave) {
         const tonalProgress = clampNumber$1(verticalProgress + lowerLobeWave * 0.1 + tentacleCore * 0.08 - forwardness * 0.08, 0, 1);
-        if (tonalProgress < 0.14) {
+        if (tonalProgress < 0.12) {
             return palette.highlight;
         }
-        if (tonalProgress < 0.32) {
+        if (tonalProgress < 0.3) {
             return palette.secondary;
         }
         if (tonalProgress < 0.72) {
-            return forwardness > 0.55 ? palette.secondary : palette.primary;
+            return forwardness > 0.56 ? palette.secondary : palette.primary;
         }
         return tentacleCore > 0.44 ? `${palette.primary}f4` : `${palette.shadow}ee`;
     }
     /**
-     * Draws one projected mesh patch with soft shading and a subtle edge.
+     * Draws one projected mesh patch with multi-pass shading and a soft edge.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function drawContinuousSurfacePatch(context, surfacePatch) {
+    function drawBlobbyContinuousSurfacePatch(context, surfacePatch) {
         drawProjectedQuad(context, surfacePatch.corners, surfacePatch.fillStyle);
         if (surfacePatch.lightIntensity > 0) {
-            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.18 * surfacePatch.lightIntensity})`);
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.2 * surfacePatch.lightIntensity})`);
         }
         else if (surfacePatch.lightIntensity < 0) {
-            drawProjectedQuad(context, surfacePatch.corners, `rgba(0, 0, 0, ${0.25 * Math.abs(surfacePatch.lightIntensity)})`);
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(0, 0, 0, ${0.26 * Math.abs(surfacePatch.lightIntensity)})`);
+        }
+        if (surfacePatch.rimLightIntensity > 0.04) {
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 247, 230, ${0.22 * surfacePatch.rimLightIntensity})`);
         }
         context.save();
         context.beginPath();
@@ -9359,7 +9610,7 @@
         }
         context.closePath();
         context.strokeStyle = surfacePatch.outlineColor;
-        context.lineWidth = Math.max(0.7, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0032);
+        context.lineWidth = Math.max(0.6, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0026);
         context.lineJoin = 'round';
         context.stroke();
         context.restore();
@@ -9367,9 +9618,9 @@
     /**
      * Draws projected mantle-current lines on the front of the mesh.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function drawProjectedSurfaceCurrents(options) {
+    function drawBlobbyContinuousCurrents(options) {
         const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, morphologyProfile, timeMs, animationPhase, } = options;
         const currentCount = Math.min(6, morphologyProfile.details.mantleCurrentCount);
         const centerIndex = (currentCount - 1) / 2;
@@ -9379,11 +9630,11 @@
         for (let currentIndex = 0; currentIndex < currentCount; currentIndex++) {
             const baseLongitude = (currentIndex - centerIndex) * 0.15;
             const projectedPoints = [];
-            for (let sampleIndex = 0; sampleIndex < 8; sampleIndex++) {
-                const progress = sampleIndex / 7;
-                const latitude = -0.46 + progress * 0.74;
-                const longitude = baseLongitude + Math.sin(timeMs / 1160 + animationPhase + currentIndex * 0.7 + progress * 2) * 0.035;
-                const scenePoint = transformScenePoint(sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude), center, rotationX, rotationY);
+            for (let sampleIndex = 0; sampleIndex < 9; sampleIndex++) {
+                const progress = sampleIndex / 8;
+                const latitude = -0.48 + progress * 0.78;
+                const longitude = baseLongitude + Math.sin(timeMs / 1140 + animationPhase + currentIndex * 0.7 + progress * 2) * 0.038;
+                const scenePoint = transformScenePoint(sampleBlobbyContinuousSurfacePoint(surfaceOptions, latitude, longitude), center, rotationX, rotationY);
                 if (scenePoint.z > center.z - size * 0.016) {
                     projectedPoints.push(projectScenePoint(scenePoint, size, sceneCenterX, sceneCenterY));
                 }
@@ -9405,39 +9656,62 @@
     /**
      * Draws small projected sucker highlights on the waving lower mesh lobes.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function drawProjectedTentacleSuckers(options) {
+    function drawBlobbyContinuousSuckers(options) {
         const { surfaceOptions, size } = options;
         const { timeMs } = surfaceOptions;
         for (const tentacleProfile of surfaceOptions.tentacleProfiles) {
-            if (Math.cos(tentacleProfile.centerLongitude) < -0.12) {
+            if (Math.cos(tentacleProfile.centerLongitude) < -0.16) {
                 continue;
             }
-            for (let suckerIndex = 0; suckerIndex < 3; suckerIndex++) {
-                const latitude = 0.52 + suckerIndex * 0.14;
-                const sideOffset = tentacleProfile.suckerSide * (0.035 + suckerIndex * 0.012) * tentacleProfile.widthScale;
-                const waveOffset = Math.sin(timeMs / 900 + tentacleProfile.phase + suckerIndex * 0.8) * 0.018;
-                drawProjectedSurfaceSpot({
+            for (let suckerIndex = 0; suckerIndex < 4; suckerIndex++) {
+                const latitude = 0.5 + suckerIndex * 0.12;
+                const sideOffset = tentacleProfile.suckerSide * (0.038 + suckerIndex * 0.014) * tentacleProfile.widthScale;
+                const waveOffset = Math.sin(timeMs / 880 + tentacleProfile.primaryPhase + suckerIndex * 0.78) * 0.02;
+                drawBlobbyContinuousSurfaceSpot({
                     ...options,
                     latitude,
                     longitude: tentacleProfile.centerLongitude + sideOffset + waveOffset,
-                    radiusScale: size * (0.0065 - suckerIndex * 0.0007),
+                    radiusScale: size * (0.0068 - suckerIndex * 0.0006),
                 });
             }
         }
     }
     /**
-     * Draws one tiny projected surface spot by sampling local mesh tangents.
+     * Draws seeded pigment spots across the upper mesh for a richer skin texture.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function drawProjectedSurfaceSpot(options) {
-        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, latitude, longitude, radiusScale, } = options;
-        const localCenter = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude);
-        const localHorizontal = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude, longitude + 0.018);
-        const localVertical = sampleContinuousOctopusSurfacePoint(surfaceOptions, latitude + 0.018, longitude);
-        const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
+    function drawBlobbySkinSpots(options) {
+        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, skinSpots, } = options;
+        for (const skinSpot of skinSpots) {
+            const localCenter = sampleBlobbyContinuousSurfacePoint(surfaceOptions, skinSpot.latitude, skinSpot.longitude);
+            const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
+            if (sceneCenterPoint.z <= center.z - size * 0.01) {
+                continue;
+            }
+            const projectedCenterPoint = projectScenePoint(sceneCenterPoint, size, sceneCenterX, sceneCenterY);
+            const spotRadius = size * skinSpot.radiusScale;
+            context.save();
+            context.beginPath();
+            context.arc(projectedCenterPoint.x, projectedCenterPoint.y, spotRadius, 0, Math.PI * 2);
+            context.fillStyle = `${palette.shadow}${formatAlphaHex(skinSpot.opacity)}`;
+            context.fill();
+            context.restore();
+        }
+    }
+    /**
+     * Draws one tiny projected surface spot by sampling local mesh tangents.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    function drawBlobbyContinuousSurfaceSpot(options) {
+        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, latitude, longitude, radiusScale, } = options;
+        const localCenter = sampleBlobbyContinuousSurfacePoint(surfaceOptions, latitude, longitude);
+        const localHorizontal = sampleBlobbyContinuousSurfacePoint(surfaceOptions, latitude, longitude + 0.018);
+        const localVertical = sampleBlobbyContinuousSurfacePoint(surfaceOptions, latitude + 0.018, longitude);
+        const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
         if (sceneCenterPoint.z <= center.z - size * 0.012) {
             return;
         }
@@ -9446,301 +9720,295 @@
         const projectedVerticalPoint = projectScenePoint(transformScenePoint(localVertical, center, rotationX, rotationY), size, sceneCenterX, sceneCenterY);
         const horizontalRadius = clampNumber$1(Math.hypot(projectedHorizontalPoint.x - projectedCenterPoint.x, projectedHorizontalPoint.y - projectedCenterPoint.y) *
             radiusScale *
-            0.74, size * 0.003, size * 0.018);
+            0.78, size * 0.003, size * 0.02);
         const verticalRadius = clampNumber$1(Math.hypot(projectedVerticalPoint.x - projectedCenterPoint.x, projectedVerticalPoint.y - projectedCenterPoint.y) *
             radiusScale *
-            0.52, size * 0.0024, size * 0.014);
+            0.54, size * 0.0024, size * 0.015);
         const rotation = Math.atan2(projectedHorizontalPoint.y - projectedCenterPoint.y, projectedHorizontalPoint.x - projectedCenterPoint.x);
         context.save();
         context.translate(projectedCenterPoint.x, projectedCenterPoint.y);
         context.rotate(rotation);
         context.beginPath();
         context.ellipse(0, 0, horizontalRadius, verticalRadius, 0, 0, Math.PI * 2);
-        context.fillStyle = `${palette.highlight}73`;
+        context.fillStyle = `${palette.highlight}80`;
         context.fill();
-        context.strokeStyle = `${palette.highlight}99`;
+        context.strokeStyle = `${palette.highlight}a8`;
         context.lineWidth = Math.max(0.7, size * 0.0028);
         context.stroke();
         context.restore();
     }
+    /**
+     * Draws a soft, slowly drifting gloss highlight on the front of the mesh.
+     *
+     * @private helper of `octopus3d4AvatarVisual`
+     */
+    function drawBlobbyContinuousGloss(options) {
+        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size } = options;
+        const { timeMs, animationPhase } = surfaceOptions;
+        const glossLatitude = -0.3 + Math.sin(timeMs / 2700 + animationPhase) * 0.04;
+        const glossLongitude = -0.18 + Math.cos(timeMs / 2300 + animationPhase * 0.8) * 0.05;
+        const localCenter = sampleBlobbyContinuousSurfacePoint(surfaceOptions, glossLatitude, glossLongitude);
+        const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
+        if (sceneCenterPoint.z <= center.z) {
+            return;
+        }
+        const projectedCenterPoint = projectScenePoint(sceneCenterPoint, size, sceneCenterX, sceneCenterY);
+        const glossRadius = size * 0.058;
+        context.save();
+        const glossGradient = context.createRadialGradient(projectedCenterPoint.x - glossRadius * 0.3, projectedCenterPoint.y - glossRadius * 0.4, glossRadius * 0.04, projectedCenterPoint.x, projectedCenterPoint.y, glossRadius);
+        glossGradient.addColorStop(0, 'rgba(255, 255, 255, 0.34)');
+        glossGradient.addColorStop(0.5, 'rgba(255, 255, 255, 0.1)');
+        glossGradient.addColorStop(1, 'rgba(255, 255, 255, 0)');
+        context.fillStyle = glossGradient;
+        context.beginPath();
+        context.ellipse(projectedCenterPoint.x, projectedCenterPoint.y, glossRadius * 1.05, glossRadius * 0.78, 0, 0, Math.PI * 2);
+        context.fill();
+        context.restore();
+    }
     /**
      * Resolves a signed angular distance from the source longitude to the target longitude.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function resolveSignedAngularDistance$1(sourceLongitude, targetLongitude) {
+    function resolveSignedAngularDistance(sourceLongitude, targetLongitude) {
         return Math.atan2(Math.sin(targetLongitude - sourceLongitude), Math.cos(targetLongitude - sourceLongitude));
     }
     /**
      * Smoothly maps a value between two bounds into `[0, 1]`.
      *
-     * @private helper of `octopus3d3AvatarVisual`
+     * @private helper of `octopus3d4AvatarVisual`
      */
-    function smoothStep$1(edgeStart, edgeEnd, value) {
+    function smoothStep(edgeStart, edgeEnd, value) {
         const progress = clampNumber$1((value - edgeStart) / (edgeEnd - edgeStart), 0, 1);
         return progress * progress * (3 - 2 * progress);
     }
-
-    /* eslint-disable no-magic-numbers */
     /**
-     * Light direction used by the continuous Octopus 3D 4 mesh shading.
+     * Converts an opacity ratio into a two-digit hexadecimal alpha suffix.
      *
      * @private helper of `octopus3d4AvatarVisual`
      */
-    const LIGHT_DIRECTION = normalizeVector3({
-        x: 0.32,
-        y: -0.66,
-        z: 1,
-    });
+    function formatAlphaHex(opacity) {
+        return Math.round(clampNumber$1(opacity, 0, 1) * 255)
+            .toString(16)
+            .padStart(2, '0');
+    }
+
+    /* eslint-disable no-magic-numbers */
     /**
-     * Rim-light direction used to brighten the side of the silhouette.
+     * Light direction used by the organic 3D octopus shading.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    const RIM_LIGHT_DIRECTION = normalizeVector3({
-        x: -0.7,
-        y: -0.18,
-        z: 0.55,
+    const LIGHT_DIRECTION = normalizeVector3({
+        x: 0.48,
+        y: -0.62,
+        z: 0.94,
     });
     /**
-     * Real-octopus tentacle count used by the continuous lower mesh.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    const OCTOPUS_TENTACLE_COUNT = 8;
-    /**
-     * Number of seeded skin spots painted across the octopus body.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    const SKIN_SPOT_COUNT = 14;
-    /**
-     * Cache keyed by the `createRandom` factory reference, stable per mounted `<Avatar/>` component.
+     * Cache keyed by the `createRandom` factory reference (stable per mounted `<Avatar/>`).
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    const octopus3d4StableStateCache = new WeakMap();
+    const octopus3dStableStateCache = new WeakMap();
     /**
-     * Returns the stable per-avatar state, computing it on first access and caching afterwards.
+     * Returns the stable per-avatar state, computing it on first access and caching for subsequent frames.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function getOctopus3d4StableState(createRandom) {
-        const cached = octopus3d4StableStateCache.get(createRandom);
+    function getOctopus3dStableState(createRandom) {
+        const cached = octopus3dStableStateCache.get(createRandom);
         if (cached !== undefined) {
             return cached;
         }
-        const morphologyProfile = createOctopus3MorphologyProfile(createRandom);
-        const animationRandom = createRandom('octopus3d4-animation-profile');
-        const eyeRandom = createRandom('octopus3d4-eye-profile');
-        const leftEyePhaseOffset = eyeRandom() * 0.7;
-        const rightEyePhaseOffset = eyeRandom() * 0.7;
+        const animationRandom = createRandom('octopus3d-animation-profile');
+        const eyeRandom = createRandom('octopus3d-eye-profile');
+        const leftEyePhaseOffset = eyeRandom() * 0.6;
+        const rightEyePhaseOffset = eyeRandom() * 0.6;
         const state = {
-            morphologyProfile,
+            morphologyProfile: createOctopus3MorphologyProfile(createRandom),
             animationPhase: animationRandom() * Math.PI * 2,
             leftEyePhaseOffset,
             rightEyePhaseOffset,
-            tentacleProfiles: createBlobbyContinuousTentacleProfiles(createRandom, morphologyProfile),
-            skinSpots: createBlobbySkinSpots(createRandom),
         };
-        octopus3d4StableStateCache.set(createRandom, state);
+        octopus3dStableStateCache.set(createRandom, state);
         return state;
     }
     /**
-     * Octopus 3D 4 avatar visual.
+     * Proper 3D Octopus visual built from projected organic meshes and tentacles.
      *
      * @private built-in avatar visual
      */
-    const octopus3d4AvatarVisual = {
-        id: 'octopus3d4',
-        title: 'Octopus 3D 4',
-        description: 'Cute blobby 3D octopus rendered as one smooth continuous mesh with naturally undulating tentacles, rich multi-pass shading, pigment spots, and cursor-aware head and eyes.',
+    const octopus3dAvatarVisual = {
+        id: 'octopus3d',
+        title: 'Octopus 3D',
+        description: 'Proper 3D octopus portrait with a turning silhouette, expressive eyes, and depth-sorted tentacles.',
         isAnimated: true,
         supportsPointerTracking: true,
         render({ context, size, palette, createRandom, timeMs, interaction }) {
-            const { morphologyProfile, animationPhase, leftEyePhaseOffset, rightEyePhaseOffset, tentacleProfiles, skinSpots } = getOctopus3d4StableState(createRandom);
+            const { morphologyProfile, animationPhase, leftEyePhaseOffset, rightEyePhaseOffset } = getOctopus3dStableState(createRandom);
             const sceneCenterX = size * 0.5;
-            const sceneCenterY = size * 0.535;
-            const bob = Math.sin(timeMs / 980 + animationPhase) * size * 0.013;
-            const meshCenter = {
-                x: interaction.bodyOffsetX * size * 0.052 + size * morphologyProfile.body.centerXJitterRatio * 0.44,
-                y: -size * 0.07 + interaction.bodyOffsetY * size * 0.028 + bob,
-                z: interaction.intensity * size * 0.02,
+            const sceneCenterY = size * 0.56;
+            const bob = Math.sin(timeMs / 920 + animationPhase) * size * 0.014;
+            const mantleCenter = {
+                x: interaction.bodyOffsetX * size * 0.042 + size * morphologyProfile.body.centerXJitterRatio * 0.65,
+                y: -size * 0.09 + interaction.bodyOffsetY * size * 0.028 + bob,
+                z: interaction.intensity * size * 0.012,
             };
-            const rotationY = -0.08 +
-                Math.sin(timeMs / 2800 + animationPhase) * 0.04 +
-                interaction.bodyOffsetX * 0.24 +
-                interaction.gazeX * 0.98;
-            const rotationX = -0.07 +
-                Math.cos(timeMs / 3200 + animationPhase * 0.7) * 0.02 -
-                interaction.bodyOffsetY * 0.08 -
-                interaction.gazeY * 0.42;
-            const surfaceOptions = {
-                radiusX: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch * 1.12,
-                radiusY: size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.1,
-                radiusZ: size *
-                    morphologyProfile.body.bodyRadiusRatio *
-                    (1.04 + (morphologyProfile.body.horizontalStretch - 1) * 0.2),
-                morphologyProfile,
-                timeMs,
-                animationPhase,
-                tentacleProfiles,
+            const underbodyCenter = {
+                x: mantleCenter.x * 0.86,
+                y: mantleCenter.y + size * 0.168,
+                z: mantleCenter.z - size * 0.018,
             };
-            const surfacePatches = resolveVisibleBlobbyContinuousPatches({
-                ...surfaceOptions,
-                center: meshCenter,
-                rotationX,
-                rotationY,
+            const mantleRadiusX = size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.horizontalStretch;
+            const mantleRadiusY = size * morphologyProfile.body.bodyRadiusRatio * morphologyProfile.body.verticalStretch * 1.1;
+            const mantleRadiusZ = size *
+                morphologyProfile.body.bodyRadiusRatio *
+                (0.9 + (morphologyProfile.body.horizontalStretch - 1) * 0.3);
+            const underbodyRadiusX = mantleRadiusX * (0.9 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.08);
+            const underbodyRadiusY = mantleRadiusY * (0.44 + morphologyProfile.body.lowerDropRatio * 3.1);
+            const underbodyRadiusZ = mantleRadiusZ * 0.78;
+            const bodyYaw = -0.18 +
+                Math.sin(timeMs / 2400 + animationPhase) * 0.05 +
+                interaction.bodyOffsetX * 0.18 +
+                interaction.gazeX * 0.22;
+            const bodyPitch = -0.08 +
+                Math.cos(timeMs / 2700 + animationPhase * 0.6) * 0.025 -
+                interaction.bodyOffsetY * 0.08 -
+                interaction.gazeY * 0.08;
+            const headYaw = bodyYaw - 0.04 + interaction.gazeX * 0.56;
+            const headPitch = bodyPitch - 0.02 - interaction.gazeY * 0.32;
+            const mantlePatches = resolveVisibleEllipsoidPatches({
+                center: mantleCenter,
+                radiusX: mantleRadiusX,
+                radiusY: mantleRadiusY,
+                radiusZ: mantleRadiusZ,
+                rotationX: headPitch,
+                rotationY: headYaw,
                 sceneCenterX,
                 sceneCenterY,
                 size,
                 palette,
+                verticalColorBias: 0,
+                outlineColor: `${palette.highlight}7a`,
             });
-            const eyeLatitude = clampNumber$1(morphologyProfile.face.eyeCenterYOffsetRatio * 4.4 - 0.04, -0.24, 0.08);
-            const eyeLongitude = clampNumber$1(morphologyProfile.face.eyeSpacingRatio * 3.0, 0.18, 0.32);
-            const mouthLatitude = clampNumber$1(eyeLatitude + 0.21 + morphologyProfile.face.mouthYOffsetRatio, 0.08, 0.34);
-            const mouthCenterLongitude = clampNumber$1(morphologyProfile.face.mouthCenterOffsetRatio * 5.6, -0.08, 0.08);
-            const mouthHalfLongitude = clampNumber$1(eyeLongitude * 0.78, 0.15, 0.28);
-            const mouthCurveLatitude = clampNumber$1(mouthLatitude + morphologyProfile.face.mouthCurveDepthRatio * 0.78, mouthLatitude + 0.03, 0.42);
-            const eyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.78;
-            const eyeRadiusY = eyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.92;
-            drawAvatarFrame(context, size, palette);
-            drawBlobbyContinuousAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
-            drawBlobbyContinuousShadow(context, size, palette, interaction, timeMs, morphologyProfile);
-            for (const surfacePatch of surfacePatches.sort((firstSurfacePatch, secondSurfacePatch) => firstSurfacePatch.averageDepth - secondSurfacePatch.averageDepth)) {
-                drawBlobbyContinuousSurfacePatch(context, surfacePatch);
-            }
-            drawBlobbySkinSpots({
-                context,
-                surfaceOptions,
-                center: meshCenter,
-                rotationX,
-                rotationY,
+            const underbodyPatches = resolveVisibleEllipsoidPatches({
+                center: underbodyCenter,
+                radiusX: underbodyRadiusX,
+                radiusY: underbodyRadiusY,
+                radiusZ: underbodyRadiusZ,
+                rotationX: bodyPitch,
+                rotationY: bodyYaw,
                 sceneCenterX,
                 sceneCenterY,
                 size,
                 palette,
-                skinSpots,
+                verticalColorBias: 0.18,
+                outlineColor: `${palette.shadow}8f`,
             });
-            drawBlobbyContinuousCurrents({
-                context,
-                surfaceOptions,
-                center: meshCenter,
-                rotationX,
-                rotationY,
-                sceneCenterX,
-                sceneCenterY,
-                size,
-                palette,
+            const tentacleStrokes = createOctopusTentacleStrokes({
+                createRandom,
                 morphologyProfile,
                 timeMs,
-                animationPhase,
-            });
-            drawBlobbyContinuousSuckers({
-                context,
-                surfaceOptions,
-                center: meshCenter,
-                rotationX,
-                rotationY,
-                sceneCenterX,
-                sceneCenterY,
                 size,
-                palette,
-            });
-            drawBlobbyContinuousGloss({
-                context,
-                surfaceOptions,
-                center: meshCenter,
-                rotationX,
-                rotationY,
+                center: underbodyCenter,
+                radiusX: underbodyRadiusX,
+                radiusY: underbodyRadiusY,
+                radiusZ: underbodyRadiusZ,
+                rotationX: bodyPitch,
+                rotationY: bodyYaw,
                 sceneCenterX,
                 sceneCenterY,
-                size,
-                palette,
+                animationPhase,
             });
-            drawProjectedOrganicEye(context, sampleBlobbyContinuousSurfacePoint(surfaceOptions, eyeLatitude, -eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + leftEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
-            drawProjectedOrganicEye(context, sampleBlobbyContinuousSurfacePoint(surfaceOptions, eyeLatitude, eyeLongitude), eyeRadiusX, eyeRadiusY, meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.85 + rightEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
+            const faceEyeSpacing = size * morphologyProfile.face.eyeSpacingRatio * 0.92;
+            const faceEyeYOffset = size * morphologyProfile.face.eyeCenterYOffsetRatio - mantleRadiusY * 0.02;
+            const faceEyeRadiusX = size * morphologyProfile.face.eyeRadiusXRatio * 0.82;
+            const faceEyeRadiusY = faceEyeRadiusX * morphologyProfile.face.eyeHeightRatio * 0.96;
+            const mouthHalfWidth = size * morphologyProfile.face.mouthWidthRatio * 0.92;
+            const mouthY = size * morphologyProfile.face.mouthYOffsetRatio + mantleRadiusY * 0.08;
+            drawAvatarFrame(context, size, palette);
+            drawOctopus3dAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs);
+            drawOctopus3dShadow(context, size, palette, interaction, timeMs);
+            for (const tentacleStroke of tentacleStrokes.filter((candidateTentacleStroke) => !candidateTentacleStroke.isFrontFacing)) {
+                drawTentacleStroke(context, tentacleStroke, palette);
+            }
+            for (const surfacePatch of [...mantlePatches, ...underbodyPatches].sort((firstSurfacePatch, secondSurfacePatch) => firstSurfacePatch.averageDepth - secondSurfacePatch.averageDepth)) {
+                drawSurfacePatch(context, surfacePatch);
+            }
+            for (const tentacleStroke of tentacleStrokes.filter((candidateTentacleStroke) => candidateTentacleStroke.isFrontFacing)) {
+                drawTentacleStroke(context, tentacleStroke, palette);
+            }
+            drawProjectedOrganicEye(context, {
+                x: -faceEyeSpacing,
+                y: faceEyeYOffset,
+                z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, -faceEyeSpacing, faceEyeYOffset),
+            }, faceEyeRadiusX, faceEyeRadiusY, mantleCenter, headPitch, headYaw, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + leftEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
+            drawProjectedOrganicEye(context, {
+                x: faceEyeSpacing,
+                y: faceEyeYOffset,
+                z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, faceEyeSpacing, faceEyeYOffset),
+            }, faceEyeRadiusX, faceEyeRadiusY, mantleCenter, headPitch, headYaw, sceneCenterX, sceneCenterY, size, palette, timeMs, animationPhase + 0.7 + rightEyePhaseOffset, interaction, morphologyProfile.face.eyeStyle);
             drawProjectedOrganicMouth(context, [
-                sampleBlobbyContinuousSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude - mouthHalfLongitude),
-                sampleBlobbyContinuousSurfacePoint(surfaceOptions, mouthCurveLatitude, mouthCenterLongitude),
-                sampleBlobbyContinuousSurfacePoint(surfaceOptions, mouthLatitude, mouthCenterLongitude + mouthHalfLongitude),
-            ], meshCenter, rotationX, rotationY, sceneCenterX, sceneCenterY, palette, size);
+                {
+                    x: -mouthHalfWidth,
+                    y: mouthY,
+                    z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, -mouthHalfWidth, mouthY),
+                },
+                {
+                    x: size * morphologyProfile.face.mouthCenterOffsetRatio,
+                    y: mouthY +
+                        size * morphologyProfile.face.mouthCurveDepthRatio * 0.38 +
+                        Math.sin(timeMs / 760 + animationPhase) * size * 0.01 +
+                        interaction.gazeY * size * 0.01,
+                    z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, size * morphologyProfile.face.mouthCenterOffsetRatio, mouthY),
+                },
+                {
+                    x: mouthHalfWidth,
+                    y: mouthY,
+                    z: resolveEllipsoidSurfaceDepth(mantleRadiusX, mantleRadiusY, mantleRadiusZ, mouthHalfWidth, mouthY),
+                },
+            ], mantleCenter, headPitch, headYaw, sceneCenterX, sceneCenterY, palette, size);
         },
     };
     /**
-     * Creates seeded tentacle-lobe profiles around the visible lower octopus body.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function createBlobbyContinuousTentacleProfiles(createRandom, morphologyProfile) {
-        return Array.from({ length: OCTOPUS_TENTACLE_COUNT }, (_, tentacleIndex) => {
-            const tentacleRandom = createRandom(`octopus3d4-tentacle-${tentacleIndex}`);
-            const progress = tentacleIndex / (OCTOPUS_TENTACLE_COUNT - 1);
-            return {
-                centerLongitude: -Math.PI * 0.9 +
-                    progress * Math.PI * 1.8 +
-                    (tentacleRandom() - 0.5) * (0.06 + morphologyProfile.tentacles.rootSpreadScale * 0.025),
-                widthScale: 0.92 + tentacleRandom() * 0.3 + (morphologyProfile.tentacles.baseWidthScale - 1) * 0.18,
-                lengthScale: 0.9 + tentacleRandom() * 0.34 + (morphologyProfile.tentacles.flowLengthScale - 1) * 0.24,
-                swayScale: 0.86 + tentacleRandom() * 0.4 + (morphologyProfile.tentacles.swayScale - 1) * 0.22,
-                depthScale: 0.9 + tentacleRandom() * 0.3 + (morphologyProfile.tentacles.tipReachScale - 1) * 0.22,
-                curlScale: 0.62 + tentacleRandom() * 0.46,
-                primaryPhase: tentacleRandom() * Math.PI * 2,
-                secondaryPhase: tentacleRandom() * Math.PI * 2,
-                suckerSide: tentacleRandom() > 0.5 ? 1 : -1,
-            };
-        });
-    }
-    /**
-     * Creates seeded skin pigment spots distributed across the upper octopus mesh.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function createBlobbySkinSpots(createRandom) {
-        const spotRandom = createRandom('octopus3d4-skin-spots');
-        return Array.from({ length: SKIN_SPOT_COUNT }, () => ({
-            latitude: -0.45 + spotRandom() * 0.7,
-            longitude: -0.5 + spotRandom() * 1.0,
-            radiusScale: 0.0028 + spotRandom() * 0.0052,
-            opacity: 0.16 + spotRandom() * 0.22,
-        }));
-    }
-    /**
-     * Draws the soft underwater atmosphere behind the continuous octopus mesh.
+     * Draws the atmospheric underwater glow behind the octopus mesh.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function drawBlobbyContinuousAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
-        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.12, sceneCenterY - size * 0.18 + interaction.gazeY * size * 0.05, size * 0.04, sceneCenterX, sceneCenterY, size * (0.68 + interaction.intensity * 0.025));
-        glowGradient.addColorStop(0, `${palette.highlight}74`);
-        glowGradient.addColorStop(0.32, `${palette.accent}32`);
+    function drawOctopus3dAtmosphere(context, size, palette, sceneCenterX, sceneCenterY, interaction, timeMs) {
+        const glowGradient = context.createRadialGradient(sceneCenterX + interaction.gazeX * size * 0.1, sceneCenterY - size * 0.2 + interaction.gazeY * size * 0.05, size * 0.04, sceneCenterX, sceneCenterY - size * 0.04, size * 0.62);
+        glowGradient.addColorStop(0, `${palette.highlight}5c`);
+        glowGradient.addColorStop(0.36, `${palette.accent}24`);
         glowGradient.addColorStop(1, `${palette.highlight}00`);
         context.fillStyle = glowGradient;
         context.fillRect(0, 0, size, size);
-        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1500) * size * 0.05, sceneCenterY + size * 0.3, size * 0.06, sceneCenterX, sceneCenterY + size * 0.3, size * 0.56);
-        lowerGradient.addColorStop(0, `${palette.secondary}28`);
+        const lowerGradient = context.createRadialGradient(sceneCenterX + Math.sin(timeMs / 1700) * size * 0.05, sceneCenterY + size * 0.23, size * 0.08, sceneCenterX, sceneCenterY + size * 0.28, size * 0.5);
+        lowerGradient.addColorStop(0, `${palette.secondary}1d`);
         lowerGradient.addColorStop(1, `${palette.secondary}00`);
         context.fillStyle = lowerGradient;
         context.fillRect(0, 0, size, size);
     }
     /**
-     * Draws the soft lower shadow that anchors the octopus in the avatar frame.
+     * Draws the soft ground shadow below the octopus.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * Uses a scaled radial gradient instead of `context.filter = 'blur()'` to approximate the
+     * blurry ellipse without triggering a costly software rasterization pass on every frame.
+     *
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function drawBlobbyContinuousShadow(context, size, palette, interaction, timeMs, morphologyProfile) {
-        const cx = size * 0.5 + interaction.gazeX * size * 0.046;
-        const cy = size * 0.9 + Math.sin(timeMs / 980) * size * 0.007;
-        const rx = size * (0.2 + morphologyProfile.tentacles.rootSpreadScale * 0.024 + interaction.intensity * 0.022);
-        const ry = size * 0.062;
+    function drawOctopus3dShadow(context, size, palette, interaction, timeMs) {
+        const cx = size * 0.5 + interaction.gazeX * size * 0.04;
+        const cy = size * 0.87 + Math.sin(timeMs / 920) * size * 0.008;
+        const rx = size * (0.18 + interaction.intensity * 0.02);
+        const ry = size * 0.06;
         context.save();
         context.translate(cx, cy);
         context.scale(1, ry / rx);
-        const blurRadius = rx * 1.42;
+        const blurRadius = rx * 1.4;
         const shadowGradient = context.createRadialGradient(0, 0, 0, 0, 0, blurRadius);
-        shadowGradient.addColorStop(0, `${palette.shadow}82`);
-        shadowGradient.addColorStop(0.45, `${palette.shadow}4a`);
-        shadowGradient.addColorStop(0.8, `${palette.shadow}1c`);
+        shadowGradient.addColorStop(0, `${palette.shadow}7a`);
+        shadowGradient.addColorStop(0.45, `${palette.shadow}44`);
+        shadowGradient.addColorStop(0.8, `${palette.shadow}1a`);
         shadowGradient.addColorStop(1, `${palette.shadow}00`);
         context.fillStyle = shadowGradient;
         context.beginPath();
@@ -9749,302 +10017,89 @@
         context.restore();
     }
     /**
-     * Number of latitude segments used by the continuous Octopus 3D 4 mesh.
+     * Resolves visible projected patches for one rotated ellipsoid mesh.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    const LATITUDE_PATCH_COUNT = 20;
+    function resolveVisibleEllipsoidPatches(options) {
+        const { center, radiusX, radiusY, radiusZ, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, verticalColorBias, outlineColor, } = options;
+        const latitudePatchCount = 10;
+        const longitudePatchCount = 18;
+        const surfacePatches = [];
+        for (let latitudeIndex = 0; latitudeIndex < latitudePatchCount; latitudeIndex++) {
+            const startLatitude = -Math.PI / 2 + (latitudeIndex / latitudePatchCount) * Math.PI;
+            const endLatitude = -Math.PI / 2 + ((latitudeIndex + 1) / latitudePatchCount) * Math.PI;
+            const verticalProgress = (latitudeIndex + 0.5) / latitudePatchCount;
+            for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
+                const startLongitude = -Math.PI + (longitudeIndex / longitudePatchCount) * Math.PI * 2;
+                const endLongitude = -Math.PI + ((longitudeIndex + 1) / longitudePatchCount) * Math.PI * 2;
+                const localCorners = [
+                    sampleEllipsoidPoint(radiusX, radiusY, radiusZ, startLatitude, startLongitude),
+                    sampleEllipsoidPoint(radiusX, radiusY, radiusZ, startLatitude, endLongitude),
+                    sampleEllipsoidPoint(radiusX, radiusY, radiusZ, endLatitude, endLongitude),
+                    sampleEllipsoidPoint(radiusX, radiusY, radiusZ, endLatitude, startLongitude),
+                ];
+                const transformedCorners = localCorners.map((localCorner) => transformScenePoint(localCorner, center, rotationX, rotationY));
+                const surfaceNormal = normalizeVector3(crossProduct3D(subtractPoint3D(transformedCorners[1], transformedCorners[0]), subtractPoint3D(transformedCorners[2], transformedCorners[0])));
+                if (surfaceNormal.z <= 0.01) {
+                    continue;
+                }
+                const projectedCorners = transformedCorners.map((transformedCorner) => projectScenePoint(transformedCorner, size, sceneCenterX, sceneCenterY));
+                surfacePatches.push({
+                    corners: projectedCorners,
+                    averageDepth: transformedCorners.reduce((depthSum, transformedCorner) => depthSum + transformedCorner.z, 0) /
+                        transformedCorners.length,
+                    lightIntensity: clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION), -1, 1),
+                    fillStyle: resolveSurfacePatchFillStyle(palette, verticalProgress + verticalColorBias),
+                    outlineColor,
+                });
+            }
+        }
+        return surfacePatches;
+    }
     /**
-     * Number of longitude segments used by the continuous Octopus 3D 4 mesh.
+     * Samples one point on an ellipsoid aligned to the local axes.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    const LONGITUDE_PATCH_COUNT = 48;
+    function sampleEllipsoidPoint(radiusX, radiusY, radiusZ, latitude, longitude) {
+        const cosineLatitude = Math.cos(latitude);
+        return {
+            x: Math.sin(longitude) * cosineLatitude * radiusX,
+            y: Math.sin(latitude) * radiusY,
+            z: Math.cos(longitude) * cosineLatitude * radiusZ,
+        };
+    }
     /**
-     * Resolves visible projected patches for the continuous Octopus 3D 4 mesh.
-     *
-     * Within a single frame, mesh corner samples and longitude-only computations (tentacle
-     * influence and lobe wave) are quantized to the patch grid and computed once each rather
-     * than re-evaluated for every patch corner.
+     * Resolves one base fill tone for a surface patch across the octopus body.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function resolveVisibleBlobbyContinuousPatches(options) {
-        const { center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette } = options;
-        const latitudePatchCount = LATITUDE_PATCH_COUNT;
-        const longitudePatchCount = LONGITUDE_PATCH_COUNT;
-        const surfacePatches = [];
-        const latitudeBoundaries = new Float64Array(latitudePatchCount + 1);
-        const longitudeBoundaries = new Float64Array(longitudePatchCount + 1);
-        for (let boundaryIndex = 0; boundaryIndex <= latitudePatchCount; boundaryIndex++) {
-            latitudeBoundaries[boundaryIndex] = -Math.PI / 2 + (boundaryIndex / latitudePatchCount) * Math.PI;
+    function resolveSurfacePatchFillStyle(palette, verticalProgress) {
+        const clampedVerticalProgress = clampNumber$1(verticalProgress, 0, 1);
+        if (clampedVerticalProgress < 0.2) {
+            return palette.highlight;
         }
-        for (let boundaryIndex = 0; boundaryIndex <= longitudePatchCount; boundaryIndex++) {
-            longitudeBoundaries[boundaryIndex] = -Math.PI + (boundaryIndex / longitudePatchCount) * Math.PI * 2;
+        if (clampedVerticalProgress < 0.45) {
+            return palette.secondary;
         }
-        const cachedTentacleInfluencesByCornerLongitude = new Array(longitudePatchCount + 1);
-        const cachedLobeWavesByCornerLongitude = new Float64Array(longitudePatchCount + 1);
-        const cachedTentacleInfluencesByPatchCenterLongitude = new Array(longitudePatchCount);
-        const cachedLobeWavesByPatchCenterLongitude = new Float64Array(longitudePatchCount);
-        const cachedCosByPatchCenterLongitude = new Float64Array(longitudePatchCount);
-        for (let boundaryIndex = 0; boundaryIndex <= longitudePatchCount; boundaryIndex++) {
-            const cornerLongitude = longitudeBoundaries[boundaryIndex];
-            cachedTentacleInfluencesByCornerLongitude[boundaryIndex] = resolveBlobbyTentacleInfluence(options, cornerLongitude);
-            cachedLobeWavesByCornerLongitude[boundaryIndex] = resolveBlobbyLobeWave(options, cornerLongitude);
+        if (clampedVerticalProgress < 0.8) {
+            return palette.primary;
         }
-        for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
-            const patchCenterLongitude = (longitudeBoundaries[longitudeIndex] + longitudeBoundaries[longitudeIndex + 1]) / 2;
-            cachedTentacleInfluencesByPatchCenterLongitude[longitudeIndex] = resolveBlobbyTentacleInfluence(options, patchCenterLongitude);
-            cachedLobeWavesByPatchCenterLongitude[longitudeIndex] = resolveBlobbyLobeWave(options, patchCenterLongitude);
-            cachedCosByPatchCenterLongitude[longitudeIndex] = Math.max(0, Math.cos(patchCenterLongitude));
-        }
-        const cornerCount = (latitudePatchCount + 1) * (longitudePatchCount + 1);
-        const transformedCornerSamples = new Array(cornerCount);
-        for (let latitudeBoundaryIndex = 0; latitudeBoundaryIndex <= latitudePatchCount; latitudeBoundaryIndex++) {
-            const cornerLatitude = latitudeBoundaries[latitudeBoundaryIndex];
-            for (let longitudeBoundaryIndex = 0; longitudeBoundaryIndex <= longitudePatchCount; longitudeBoundaryIndex++) {
-                const cornerLongitude = longitudeBoundaries[longitudeBoundaryIndex];
-                const cornerIndex = latitudeBoundaryIndex * (longitudePatchCount + 1) + longitudeBoundaryIndex;
-                const cornerSample = sampleBlobbyContinuousSurfacePointWithLongitudeCache(options, cornerLatitude, cornerLongitude, cachedTentacleInfluencesByCornerLongitude[longitudeBoundaryIndex], cachedLobeWavesByCornerLongitude[longitudeBoundaryIndex]);
-                transformedCornerSamples[cornerIndex] = transformScenePoint(cornerSample, center, rotationX, rotationY);
-            }
-        }
-        for (let latitudeIndex = 0; latitudeIndex < latitudePatchCount; latitudeIndex++) {
-            const startLatitude = latitudeBoundaries[latitudeIndex];
-            const endLatitude = latitudeBoundaries[latitudeIndex + 1];
-            const centerLatitude = (startLatitude + endLatitude) / 2;
-            const verticalProgress = (Math.sin(centerLatitude) + 1) / 2;
-            const startCornerRowOffset = latitudeIndex * (longitudePatchCount + 1);
-            const endCornerRowOffset = (latitudeIndex + 1) * (longitudePatchCount + 1);
-            for (let longitudeIndex = 0; longitudeIndex < longitudePatchCount; longitudeIndex++) {
-                const transformedCorners = [
-                    transformedCornerSamples[startCornerRowOffset + longitudeIndex],
-                    transformedCornerSamples[startCornerRowOffset + longitudeIndex + 1],
-                    transformedCornerSamples[endCornerRowOffset + longitudeIndex + 1],
-                    transformedCornerSamples[endCornerRowOffset + longitudeIndex],
-                ];
-                const surfaceNormal = normalizeVector3(crossProduct3D(subtractPoint3D(transformedCorners[1], transformedCorners[0]), subtractPoint3D(transformedCorners[2], transformedCorners[0])));
-                if (surfaceNormal.z <= 0.006) {
-                    continue;
-                }
-                const projectedCorners = [
-                    projectScenePoint(transformedCorners[0], size, sceneCenterX, sceneCenterY),
-                    projectScenePoint(transformedCorners[1], size, sceneCenterX, sceneCenterY),
-                    projectScenePoint(transformedCorners[2], size, sceneCenterX, sceneCenterY),
-                    projectScenePoint(transformedCorners[3], size, sceneCenterX, sceneCenterY),
-                ];
-                const lightIntensity = clampNumber$1(dotProduct3D(surfaceNormal, LIGHT_DIRECTION), -1, 1);
-                const rimLightIntensity = Math.pow(clampNumber$1(dotProduct3D(surfaceNormal, RIM_LIGHT_DIRECTION), 0, 1), 2.6);
-                surfacePatches.push({
-                    corners: projectedCorners,
-                    averageDepth: (transformedCorners[0].z +
-                        transformedCorners[1].z +
-                        transformedCorners[2].z +
-                        transformedCorners[3].z) /
-                        4,
-                    lightIntensity,
-                    rimLightIntensity,
-                    fillStyle: resolveBlobbySurfacePatchFillStyle(palette, verticalProgress, cachedCosByPatchCenterLongitude[longitudeIndex], cachedTentacleInfluencesByPatchCenterLongitude[longitudeIndex].core, cachedLobeWavesByPatchCenterLongitude[longitudeIndex]),
-                    outlineColor: verticalProgress < 0.52 ? `${palette.highlight}5c` : `${palette.shadow}66`,
-                });
-            }
-        }
-        return surfacePatches;
-    }
-    /**
-     * Samples one point on the continuous Octopus 3D 4 surface.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function sampleBlobbyContinuousSurfacePoint(options, latitude, longitude) {
-        return sampleBlobbyContinuousSurfacePointWithLongitudeCache(options, latitude, longitude, resolveBlobbyTentacleInfluence(options, longitude), resolveBlobbyLobeWave(options, longitude));
-    }
-    /**
-     * Samples one point on the continuous Octopus 3D 4 surface using precomputed longitude-only values.
-     *
-     * The patch loop quantizes the mesh into a fixed corner grid, so the same longitude is reused
-     * across every latitude row and each tentacle/lobe value is computed once per frame instead
-     * of `latitudePatchCount * 4` times.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function sampleBlobbyContinuousSurfacePointWithLongitudeCache(options, latitude, longitude, tentacleInfluence, lowerLobeWave) {
-        const { radiusX, radiusY, radiusZ, morphologyProfile, timeMs, animationPhase } = options;
-        const cosineLatitude = Math.max(0, Math.cos(latitude));
-        const verticalProgress = (Math.sin(latitude) + 1) / 2;
-        const upperBlend = Math.pow(1 - verticalProgress, 1.32);
-        const lowerBlend = smoothStep(0.34, 1, verticalProgress);
-        const tipBlend = smoothStep(0.66, 1, verticalProgress);
-        const centerPull = resolveSignedAngularDistance(longitude, tentacleInfluence.centerLongitude);
-        const effectiveLongitude = longitude + centerPull * lowerBlend * tentacleInfluence.core * (0.26 + tipBlend * 0.22);
-        const mantleRipple = Math.sin(longitude * morphologyProfile.body.lobeCount +
-            animationPhase * 0.6 +
-            timeMs / (1700 + morphologyProfile.body.lobeCount * 28)) *
-            (0.018 + morphologyProfile.body.wobbleAmplitudeRatio * 0.78) *
-            (0.32 + lowerBlend * 0.7);
-        const primaryTentacleWave = Math.sin(timeMs / 740 + tentacleInfluence.primaryPhase + verticalProgress * 2.6) *
-            lowerBlend *
-            tentacleInfluence.core *
-            tentacleInfluence.swayScale;
-        const secondaryTentacleWave = Math.sin(timeMs / 470 + tentacleInfluence.secondaryPhase + verticalProgress * 4.2) *
-            lowerBlend *
-            tentacleInfluence.core *
-            tentacleInfluence.swayScale *
-            0.42;
-        const tentacleCurl = Math.sin(timeMs / 1180 + tentacleInfluence.primaryPhase * 0.6 + verticalProgress * 3.2) *
-            tipBlend *
-            tentacleInfluence.core *
-            tentacleInfluence.curlScale *
-            0.36;
-        const horizontalScale = 1.06 +
-            mantleRipple +
-            lowerBlend * (0.18 + (morphologyProfile.tentacles.rootSpreadScale - 1) * 0.12) +
-            lowerBlend * tentacleInfluence.core * (0.22 + lowerLobeWave * 0.14) -
-            upperBlend * 0.08;
-        const depthScale = 1.08 +
-            upperBlend * 0.16 +
-            Math.max(0, Math.cos(effectiveLongitude)) * 0.12 +
-            lowerBlend * tentacleInfluence.core * (0.12 + tentacleInfluence.depthScale * 0.07) -
-            Math.max(0, -Math.cos(effectiveLongitude)) * 0.05;
-        const tentacleTubeRadius = lowerBlend *
-            tentacleInfluence.core *
-            (0.12 + tipBlend * 0.07 + tentacleInfluence.widthScale * 0.028) *
-            radiusX;
-        const planarRadiusX = cosineLatitude * radiusX * horizontalScale + tentacleTubeRadius;
-        const planarRadiusZ = cosineLatitude * radiusZ * depthScale + tentacleTubeRadius * 0.74;
-        const lowerDrop = lowerBlend *
-            radiusY *
-            (0.2 +
-                tentacleInfluence.core *
-                    (0.42 +
-                        tentacleInfluence.lengthScale * 0.24 +
-                        (morphologyProfile.tentacles.flowLengthScale - 1) * 0.1));
-        const combinedTentacleSway = (primaryTentacleWave + secondaryTentacleWave) * radiusX * (0.06 + tipBlend * 0.06);
-        return {
-            x: Math.sin(effectiveLongitude) * planarRadiusX +
-                combinedTentacleSway +
-                tentacleCurl * radiusX * 0.18,
-            y: Math.sin(latitude) * radiusY * (1 + upperBlend * 0.14) -
-                upperBlend * radiusY * 0.12 +
-                lowerDrop +
-                Math.sin(timeMs / 1380 + animationPhase + latitude * 1.5) * lowerBlend * radiusY * 0.022 +
-                Math.cos(timeMs / 820 + tentacleInfluence.primaryPhase) *
-                    lowerBlend *
-                    tipBlend *
-                    tentacleInfluence.core *
-                    radiusY *
-                    0.04,
-            z: Math.cos(effectiveLongitude) * planarRadiusZ +
-                Math.cos(timeMs / 960 + tentacleInfluence.primaryPhase + verticalProgress) *
-                    lowerBlend *
-                    tentacleInfluence.core *
-                    radiusZ *
-                    0.044 +
-                tentacleCurl * radiusZ * 0.14,
-        };
-    }
-    /**
-     * Blends nearby seeded tentacle profiles at one mesh longitude.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function resolveBlobbyTentacleInfluence(options, longitude) {
-        let totalWeight = 0;
-        let weightedSin = 0;
-        let weightedCos = 0;
-        let weightedWidthScale = 0;
-        let weightedLengthScale = 0;
-        let weightedSwayScale = 0;
-        let weightedDepthScale = 0;
-        let weightedCurlScale = 0;
-        let weightedPrimaryPhase = 0;
-        let weightedSecondaryPhase = 0;
-        for (const tentacleProfile of options.tentacleProfiles) {
-            const distance = Math.abs(resolveSignedAngularDistance(longitude, tentacleProfile.centerLongitude));
-            const width = 0.22 * tentacleProfile.widthScale;
-            const weight = Math.exp(-(distance * distance) / (width * width));
-            totalWeight += weight;
-            weightedSin += Math.sin(tentacleProfile.centerLongitude) * weight;
-            weightedCos += Math.cos(tentacleProfile.centerLongitude) * weight;
-            weightedWidthScale += tentacleProfile.widthScale * weight;
-            weightedLengthScale += tentacleProfile.lengthScale * weight;
-            weightedSwayScale += tentacleProfile.swayScale * weight;
-            weightedDepthScale += tentacleProfile.depthScale * weight;
-            weightedCurlScale += tentacleProfile.curlScale * weight;
-            weightedPrimaryPhase += tentacleProfile.primaryPhase * weight;
-            weightedSecondaryPhase += tentacleProfile.secondaryPhase * weight;
-        }
-        if (totalWeight < 0.0001) {
-            return {
-                core: 0,
-                centerLongitude: longitude,
-                widthScale: 1,
-                lengthScale: 1,
-                swayScale: 1,
-                depthScale: 1,
-                curlScale: 1,
-                primaryPhase: 0,
-                secondaryPhase: 0,
-            };
-        }
-        return {
-            core: clampNumber$1(totalWeight, 0, 1),
-            centerLongitude: Math.atan2(weightedSin / totalWeight, weightedCos / totalWeight),
-            widthScale: weightedWidthScale / totalWeight,
-            lengthScale: weightedLengthScale / totalWeight,
-            swayScale: weightedSwayScale / totalWeight,
-            depthScale: weightedDepthScale / totalWeight,
-            curlScale: weightedCurlScale / totalWeight,
-            primaryPhase: weightedPrimaryPhase / totalWeight,
-            secondaryPhase: weightedSecondaryPhase / totalWeight,
-        };
-    }
-    /**
-     * Resolves the soft lower wave that makes the continuous mesh read as a set of tentacles.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function resolveBlobbyLobeWave(options, longitude) {
-        const { morphologyProfile, animationPhase, timeMs } = options;
-        return ((Math.cos(longitude * OCTOPUS_TENTACLE_COUNT +
-            animationPhase +
-            timeMs / (940 + morphologyProfile.body.lobeCount * 18)) +
-            1) /
-            2);
-    }
-    /**
-     * Resolves one base fill tone for a patch on the continuous octopus mesh.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function resolveBlobbySurfacePatchFillStyle(palette, verticalProgress, forwardness, tentacleCore, lowerLobeWave) {
-        const tonalProgress = clampNumber$1(verticalProgress + lowerLobeWave * 0.1 + tentacleCore * 0.08 - forwardness * 0.08, 0, 1);
-        if (tonalProgress < 0.12) {
-            return palette.highlight;
-        }
-        if (tonalProgress < 0.3) {
-            return palette.secondary;
-        }
-        if (tonalProgress < 0.72) {
-            return forwardness > 0.56 ? palette.secondary : palette.primary;
-        }
-        return tentacleCore > 0.44 ? `${palette.primary}f4` : `${palette.shadow}ee`;
+        return `${palette.shadow}f2`;
     }
     /**
-     * Draws one projected mesh patch with multi-pass shading and a soft edge.
+     * Draws one projected mesh patch with organic shading.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function drawBlobbyContinuousSurfacePatch(context, surfacePatch) {
+    function drawSurfacePatch(context, surfacePatch) {
         drawProjectedQuad(context, surfacePatch.corners, surfacePatch.fillStyle);
         if (surfacePatch.lightIntensity > 0) {
-            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.2 * surfacePatch.lightIntensity})`);
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 255, 255, ${0.15 * surfacePatch.lightIntensity})`);
         }
         else if (surfacePatch.lightIntensity < 0) {
-            drawProjectedQuad(context, surfacePatch.corners, `rgba(0, 0, 0, ${0.26 * Math.abs(surfacePatch.lightIntensity)})`);
-        }
-        if (surfacePatch.rimLightIntensity > 0.04) {
-            drawProjectedQuad(context, surfacePatch.corners, `rgba(255, 247, 230, ${0.22 * surfacePatch.rimLightIntensity})`);
+            drawProjectedQuad(context, surfacePatch.corners, `rgba(0, 0, 0, ${0.24 * Math.abs(surfacePatch.lightIntensity)})`);
         }
         context.save();
         context.beginPath();
@@ -10054,187 +10109,127 @@
         }
         context.closePath();
         context.strokeStyle = surfacePatch.outlineColor;
-        context.lineWidth = Math.max(0.6, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0026);
+        context.lineWidth = Math.max(1, getProjectedQuadPerimeter(surfacePatch.corners) * 0.0044);
         context.lineJoin = 'round';
         context.stroke();
         context.restore();
     }
     /**
-     * Draws projected mantle-current lines on the front of the mesh.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function drawBlobbyContinuousCurrents(options) {
-        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, morphologyProfile, timeMs, animationPhase, } = options;
-        const currentCount = Math.min(6, morphologyProfile.details.mantleCurrentCount);
-        const centerIndex = (currentCount - 1) / 2;
-        context.save();
-        context.lineCap = 'round';
-        context.lineJoin = 'round';
-        for (let currentIndex = 0; currentIndex < currentCount; currentIndex++) {
-            const baseLongitude = (currentIndex - centerIndex) * 0.15;
-            const projectedPoints = [];
-            for (let sampleIndex = 0; sampleIndex < 9; sampleIndex++) {
-                const progress = sampleIndex / 8;
-                const latitude = -0.48 + progress * 0.78;
-                const longitude = baseLongitude + Math.sin(timeMs / 1140 + animationPhase + currentIndex * 0.7 + progress * 2) * 0.038;
-                const scenePoint = transformScenePoint(sampleBlobbyContinuousSurfacePoint(surfaceOptions, latitude, longitude), center, rotationX, rotationY);
-                if (scenePoint.z > center.z - size * 0.016) {
-                    projectedPoints.push(projectScenePoint(scenePoint, size, sceneCenterX, sceneCenterY));
-                }
-            }
-            if (projectedPoints.length < 3) {
-                continue;
-            }
-            context.beginPath();
-            context.moveTo(projectedPoints[0].x, projectedPoints[0].y);
-            for (const projectedPoint of projectedPoints.slice(1)) {
-                context.lineTo(projectedPoint.x, projectedPoint.y);
-            }
-            context.strokeStyle = currentIndex % 2 === 0 ? `${palette.highlight}3d` : `${palette.accent}33`;
-            context.lineWidth = size * (0.0055 + currentIndex * 0.00045);
-            context.stroke();
-        }
-        context.restore();
-    }
-    /**
-     * Draws small projected sucker highlights on the waving lower mesh lobes.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function drawBlobbyContinuousSuckers(options) {
-        const { surfaceOptions, size } = options;
-        const { timeMs } = surfaceOptions;
-        for (const tentacleProfile of surfaceOptions.tentacleProfiles) {
-            if (Math.cos(tentacleProfile.centerLongitude) < -0.16) {
-                continue;
-            }
-            for (let suckerIndex = 0; suckerIndex < 4; suckerIndex++) {
-                const latitude = 0.5 + suckerIndex * 0.12;
-                const sideOffset = tentacleProfile.suckerSide * (0.038 + suckerIndex * 0.014) * tentacleProfile.widthScale;
-                const waveOffset = Math.sin(timeMs / 880 + tentacleProfile.primaryPhase + suckerIndex * 0.78) * 0.02;
-                drawBlobbyContinuousSurfaceSpot({
-                    ...options,
-                    latitude,
-                    longitude: tentacleProfile.centerLongitude + sideOffset + waveOffset,
-                    radiusScale: size * (0.0068 - suckerIndex * 0.0006),
-                });
-            }
-        }
-    }
-    /**
-     * Draws seeded pigment spots across the upper mesh for a richer skin texture.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function drawBlobbySkinSpots(options) {
-        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, skinSpots, } = options;
-        for (const skinSpot of skinSpots) {
-            const localCenter = sampleBlobbyContinuousSurfacePoint(surfaceOptions, skinSpot.latitude, skinSpot.longitude);
-            const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
-            if (sceneCenterPoint.z <= center.z - size * 0.01) {
-                continue;
-            }
-            const projectedCenterPoint = projectScenePoint(sceneCenterPoint, size, sceneCenterX, sceneCenterY);
-            const spotRadius = size * skinSpot.radiusScale;
-            context.save();
-            context.beginPath();
-            context.arc(projectedCenterPoint.x, projectedCenterPoint.y, spotRadius, 0, Math.PI * 2);
-            context.fillStyle = `${palette.shadow}${formatAlphaHex(skinSpot.opacity)}`;
-            context.fill();
-            context.restore();
-        }
-    }
-    /**
-     * Draws one tiny projected surface spot by sampling local mesh tangents.
-     *
-     * @private helper of `octopus3d4AvatarVisual`
-     */
-    function drawBlobbyContinuousSurfaceSpot(options) {
-        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size, palette, latitude, longitude, radiusScale, } = options;
-        const localCenter = sampleBlobbyContinuousSurfacePoint(surfaceOptions, latitude, longitude);
-        const localHorizontal = sampleBlobbyContinuousSurfacePoint(surfaceOptions, latitude, longitude + 0.018);
-        const localVertical = sampleBlobbyContinuousSurfacePoint(surfaceOptions, latitude + 0.018, longitude);
-        const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
-        if (sceneCenterPoint.z <= center.z - size * 0.012) {
-            return;
-        }
-        const projectedCenterPoint = projectScenePoint(sceneCenterPoint, size, sceneCenterX, sceneCenterY);
-        const projectedHorizontalPoint = projectScenePoint(transformScenePoint(localHorizontal, center, rotationX, rotationY), size, sceneCenterX, sceneCenterY);
-        const projectedVerticalPoint = projectScenePoint(transformScenePoint(localVertical, center, rotationX, rotationY), size, sceneCenterX, sceneCenterY);
-        const horizontalRadius = clampNumber$1(Math.hypot(projectedHorizontalPoint.x - projectedCenterPoint.x, projectedHorizontalPoint.y - projectedCenterPoint.y) *
-            radiusScale *
-            0.78, size * 0.003, size * 0.02);
-        const verticalRadius = clampNumber$1(Math.hypot(projectedVerticalPoint.x - projectedCenterPoint.x, projectedVerticalPoint.y - projectedCenterPoint.y) *
-            radiusScale *
-            0.54, size * 0.0024, size * 0.015);
-        const rotation = Math.atan2(projectedHorizontalPoint.y - projectedCenterPoint.y, projectedHorizontalPoint.x - projectedCenterPoint.x);
-        context.save();
-        context.translate(projectedCenterPoint.x, projectedCenterPoint.y);
-        context.rotate(rotation);
-        context.beginPath();
-        context.ellipse(0, 0, horizontalRadius, verticalRadius, 0, 0, Math.PI * 2);
-        context.fillStyle = `${palette.highlight}80`;
-        context.fill();
-        context.strokeStyle = `${palette.highlight}a8`;
-        context.lineWidth = Math.max(0.7, size * 0.0028);
-        context.stroke();
-        context.restore();
-    }
-    /**
-     * Draws a soft, slowly drifting gloss highlight on the front of the mesh.
+     * Creates the projected 3D tentacle strokes orbiting around the lower octopus body.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function drawBlobbyContinuousGloss(options) {
-        const { context, surfaceOptions, center, rotationX, rotationY, sceneCenterX, sceneCenterY, size } = options;
-        const { timeMs, animationPhase } = surfaceOptions;
-        const glossLatitude = -0.3 + Math.sin(timeMs / 2700 + animationPhase) * 0.04;
-        const glossLongitude = -0.18 + Math.cos(timeMs / 2300 + animationPhase * 0.8) * 0.05;
-        const localCenter = sampleBlobbyContinuousSurfacePoint(surfaceOptions, glossLatitude, glossLongitude);
-        const sceneCenterPoint = transformScenePoint(localCenter, center, rotationX, rotationY);
-        if (sceneCenterPoint.z <= center.z) {
-            return;
-        }
-        const projectedCenterPoint = projectScenePoint(sceneCenterPoint, size, sceneCenterX, sceneCenterY);
-        const glossRadius = size * 0.058;
-        context.save();
-        const glossGradient = context.createRadialGradient(projectedCenterPoint.x - glossRadius * 0.3, projectedCenterPoint.y - glossRadius * 0.4, glossRadius * 0.04, projectedCenterPoint.x, projectedCenterPoint.y, glossRadius);
-        glossGradient.addColorStop(0, 'rgba(255, 255, 255, 0.34)');
-        glossGradient.addColorStop(0.5, 'rgba(255, 255, 255, 0.1)');
-        glossGradient.addColorStop(1, 'rgba(255, 255, 255, 0)');
-        context.fillStyle = glossGradient;
-        context.beginPath();
-        context.ellipse(projectedCenterPoint.x, projectedCenterPoint.y, glossRadius * 1.05, glossRadius * 0.78, 0, 0, Math.PI * 2);
-        context.fill();
-        context.restore();
+    function createOctopusTentacleStrokes(options) {
+        const { createRandom, morphologyProfile, timeMs, size, center, radiusX, radiusY, radiusZ, rotationX, rotationY, sceneCenterX, sceneCenterY, animationPhase, } = options;
+        return Array.from({ length: morphologyProfile.tentacles.count }, (_, tentacleIndex) => {
+            const tentacleRandom = createRandom(`octopus3d-tentacle-${tentacleIndex}`);
+            const spreadProgress = morphologyProfile.tentacles.count === 1 ? 0.5 : tentacleIndex / (morphologyProfile.tentacles.count - 1);
+            const orbitAngle = -Math.PI * 0.92 + spreadProgress * Math.PI * 1.84 + (tentacleRandom() - 0.5) * 0.16;
+            const flowLength = size * (0.19 + morphologyProfile.tentacles.flowLengthScale * 0.075 + tentacleRandom() * 0.018);
+            const lateralReach = size *
+                (0.08 + morphologyProfile.tentacles.lateralReachScale * 0.05 + Math.abs(Math.sin(orbitAngle)) * 0.018);
+            const depthReach = size * (0.028 + morphologyProfile.tentacles.tipReachScale * 0.032);
+            const sway = Math.sin(timeMs / (760 + tentacleIndex * 36) + animationPhase + tentacleRandom() * Math.PI * 2);
+            const anchorPoint = {
+                x: Math.sin(orbitAngle) * radiusX * (0.84 + tentacleRandom() * 0.08),
+                y: radiusY * (0.22 + tentacleRandom() * 0.18),
+                z: Math.cos(orbitAngle) * radiusZ * (0.72 + tentacleRandom() * 0.12),
+            };
+            const controlPointOne = {
+                x: anchorPoint.x + Math.sin(orbitAngle) * lateralReach * 0.44,
+                y: anchorPoint.y + flowLength * 0.26,
+                z: anchorPoint.z + Math.cos(orbitAngle) * depthReach * 0.3 + sway * size * 0.012,
+            };
+            const controlPointTwo = {
+                x: anchorPoint.x +
+                    Math.sin(orbitAngle) * lateralReach * (0.82 + morphologyProfile.tentacles.swayScale * 0.12),
+                y: anchorPoint.y + flowLength * 0.66,
+                z: anchorPoint.z + Math.cos(orbitAngle) * depthReach * 0.72 + sway * size * 0.02,
+            };
+            const endPoint = {
+                x: anchorPoint.x +
+                    Math.sin(orbitAngle) * lateralReach * (1.02 + morphologyProfile.tentacles.tipWidthScale * 0.12) +
+                    sway * size * 0.028,
+                y: anchorPoint.y + flowLength,
+                z: anchorPoint.z + Math.cos(orbitAngle) * depthReach + sway * size * 0.016,
+            };
+            const scenePoints = Array.from({ length: 12 }, (_, sampleIndex) => transformScenePoint(sampleCubicBezierPoint3D(anchorPoint, controlPointOne, controlPointTwo, endPoint, sampleIndex / 11), center, rotationX, rotationY));
+            const projectedPoints = scenePoints.map((scenePoint) => projectScenePoint(scenePoint, size, sceneCenterX, sceneCenterY));
+            const averageDepth = scenePoints.reduce((depthSum, scenePoint) => depthSum + scenePoint.z, 0) / scenePoints.length;
+            return {
+                projectedPoints,
+                averageDepth,
+                isFrontFacing: averageDepth >= center.z - size * 0.006,
+                baseWidth: size *
+                    (0.019 +
+                        morphologyProfile.tentacles.baseWidthScale * 0.007 +
+                        tentacleRandom() * 0.003 +
+                        Math.abs(Math.sin(orbitAngle)) * 0.002),
+                tipWidth: size * (0.0046 + morphologyProfile.tentacles.tipWidthScale * 0.0018),
+                colorBias: tentacleRandom(),
+            };
+        });
     }
     /**
-     * Resolves a signed angular distance from the source longitude to the target longitude.
+     * Samples one point on a cubic Bezier curve in 3D.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function resolveSignedAngularDistance(sourceLongitude, targetLongitude) {
-        return Math.atan2(Math.sin(targetLongitude - sourceLongitude), Math.cos(targetLongitude - sourceLongitude));
+    function sampleCubicBezierPoint3D(startPoint, controlPointOne, controlPointTwo, endPoint, progress) {
+        const inverseProgress = 1 - progress;
+        return {
+            x: inverseProgress * inverseProgress * inverseProgress * startPoint.x +
+                3 * inverseProgress * inverseProgress * progress * controlPointOne.x +
+                3 * inverseProgress * progress * progress * controlPointTwo.x +
+                progress * progress * progress * endPoint.x,
+            y: inverseProgress * inverseProgress * inverseProgress * startPoint.y +
+                3 * inverseProgress * inverseProgress * progress * controlPointOne.y +
+                3 * inverseProgress * progress * progress * controlPointTwo.y +
+                progress * progress * progress * endPoint.y,
+            z: inverseProgress * inverseProgress * inverseProgress * startPoint.z +
+                3 * inverseProgress * inverseProgress * progress * controlPointOne.z +
+                3 * inverseProgress * progress * progress * controlPointTwo.z +
+                progress * progress * progress * endPoint.z,
+        };
     }
     /**
-     * Smoothly maps a value between two bounds into `[0, 1]`.
+     * Draws one projected tentacle stroke with a slim highlight ridge.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function smoothStep(edgeStart, edgeEnd, value) {
-        const progress = clampNumber$1((value - edgeStart) / (edgeEnd - edgeStart), 0, 1);
-        return progress * progress * (3 - 2 * progress);
+    function drawTentacleStroke(context, tentacleStroke, palette) {
+        const projectedSegments = tentacleStroke.projectedPoints.length - 1;
+        for (let segmentIndex = 0; segmentIndex < projectedSegments; segmentIndex++) {
+            const startPoint = tentacleStroke.projectedPoints[segmentIndex];
+            const endPoint = tentacleStroke.projectedPoints[segmentIndex + 1];
+            const progress = segmentIndex / projectedSegments;
+            const width = tentacleStroke.baseWidth + (tentacleStroke.tipWidth - tentacleStroke.baseWidth) * progress;
+            context.beginPath();
+            context.moveTo(startPoint.x, startPoint.y);
+            context.lineTo(endPoint.x, endPoint.y);
+            context.strokeStyle = tentacleStroke.colorBias > 0.6 ? `${palette.secondary}f0` : `${palette.primary}f0`;
+            context.lineWidth = width;
+            context.lineCap = 'round';
+            context.stroke();
+            context.beginPath();
+            context.moveTo(startPoint.x, startPoint.y);
+            context.lineTo(endPoint.x, endPoint.y);
+            context.strokeStyle = tentacleStroke.isFrontFacing ? `${palette.highlight}80` : `${palette.highlight}40`;
+            context.lineWidth = Math.max(1, width * 0.34);
+            context.lineCap = 'round';
+            context.stroke();
+        }
     }
     /**
-     * Converts an opacity ratio into a two-digit hexadecimal alpha suffix.
+     * Resolves the front surface depth on an ellipsoid for one local face point.
      *
-     * @private helper of `octopus3d4AvatarVisual`
+     * @private helper of `octopus3dAvatarVisual`
      */
-    function formatAlphaHex(opacity) {
-        return Math.round(clampNumber$1(opacity, 0, 1) * 255)
-            .toString(16)
-            .padStart(2, '0');
+    function resolveEllipsoidSurfaceDepth(radiusX, radiusY, radiusZ, x, y) {
+        const normalizedX = x / radiusX;
+        const normalizedY = y / radiusY;
+        const remainingDepthRatio = Math.max(0, 1 - normalizedX * normalizedX - normalizedY * normalizedY);
+        return Math.sqrt(remainingDepthRatio) * radiusZ;
     }
 
     /* eslint-disable no-magic-numbers */
@@ -11057,14 +11052,14 @@
     /**
      * META AVATAR commitment definition
      *
-     * The `META AVATAR` commitment sets the built-in default avatar visual used when
-     * the agent does not provide an explicit `META IMAGE`.
+     * The `META AVATAR` and `META VISUAL` commitments set the built-in default avatar visual
+     * used when the agent does not provide an explicit `META IMAGE`.
      *
      * @private [🪔] Maybe export the commitments through some package
      */
     class MetaAvatarCommitmentDefinition extends BaseCommitmentDefinition {
-        constructor() {
-            super('META AVATAR');
+        constructor(type = 'META AVATAR') {
+            super(type);
         }
         /**
          * Short one-line description of META AVATAR.
@@ -11084,14 +11079,15 @@
         get documentation() {
             const supportedVisuals = AVATAR_VISUALS.map((avatarVisual) => `\`${avatarVisual.id}\``).join(', ');
             return spacetrim.spaceTrim(`
-            # META AVATAR
+            # ${this.type}
 
             Sets the built-in avatar visual used for the agent when no explicit \`META IMAGE\` is provided.
+            \`META AVATAR\` and \`META VISUAL\` are equivalent.
 
             ## Key aspects
 
             - Does not modify the agent's behavior or responses.
-            - Only one \`META AVATAR\` should be used per agent.
+            - Only one \`META AVATAR\` or \`META VISUAL\` should be used per agent.
             - If multiple are specified, the last one takes precedence.
             - Values are matched case-insensitively and spaces, hyphens, and underscores are normalized.
             - Supported visuals are derived from the shared avatar registry: ${supportedVisuals}.
@@ -11106,15 +11102,15 @@
             \`\`\`
 
             \`\`\`book
-            Orb Assistant
+            Minecraft Assistant
 
-            META AVATAR orb
+            META VISUAL Minecraft2
             GOAL Answer in a calm and focused way.
             \`\`\`
         `);
         }
         applyToAgentModelRequirements(requirements, content) {
-            // META AVATAR doesn't modify the system message or model requirements.
+            // META AVATAR and META VISUAL don't modify the system message or model requirements.
             // It's handled separately in the parsing logic for profile avatar resolution.
             return requirements;
         }
@@ -13167,10 +13163,10 @@
      *
      * @private
      */
-    const TEAM_SYSTEM_MESSAGE_GUIDANCE_LINES = [
-        '-   If a teammate is relevant to the request, consult that teammate using the matching tool.',
-        '-   Do not ask the user for information that a listed teammate can provide directly.',
-    ];
+    const TEAM_SYSTEM_MESSAGE_GUIDANCE = spacetrim.spaceTrim(`
+    -   If a teammate is relevant to the request, consult that teammate using the matching tool.
+    -   Do not ask the user for information that a listed teammate can provide directly.
+`);
     /**
      * Constant for remote agents by Url.
      */
@@ -13352,7 +13348,7 @@
             `);
         });
         return spacetrim.spaceTrim((block) => `
-            ${block(TEAM_SYSTEM_MESSAGE_GUIDANCE_LINES.join('\n'))}
+            ${block(TEAM_SYSTEM_MESSAGE_GUIDANCE)}
 
             ${block(teammateSections.join('\n\n'))}
         `);
@@ -20633,6 +20629,7 @@
         new ActionCommitmentDefinition('ACTIONS'),
         new ComponentCommitmentDefinition(),
         new MetaAvatarCommitmentDefinition(),
+        new MetaAvatarCommitmentDefinition('META VISUAL'),
         new MetaImageCommitmentDefinition(),
         new MetaColorCommitmentDefinition(),
         new MetaFontCommitmentDefinition(),
@@ -22285,6 +22282,7 @@
      */
     const META_COMMITMENT_APPLIERS = {
         'META AVATAR': applyMetaAvatarContent,
+        'META VISUAL': applyMetaAvatarContent,
         'META LINK': applyMetaLinkContent,
         'META DOMAIN': applyMetaDomainContent,
         'META IMAGE': applyMetaImageContent,
@@ -22333,7 +22331,7 @@
         state.meta[metaType] = metaValue;
     }
     /**
-     * Applies META AVATAR content into the canonical `meta.avatar` field.
+     * Applies META AVATAR / META VISUAL content into the canonical `meta.avatar` field.
      */
     function applyMetaAvatarContent(state, content) {
         const avatarVisualId = resolveAvatarVisualId(content);
@@ -24505,89 +24503,299 @@
         if (max !== undefined) {
             commands.push(`EXPECT MAX ${max} ${formatExpectationUnit(unit, max)}`);
         }
-        return commands;
+        return commands;
+    }
+    /**
+     * Formats the expectation unit exactly as the legacy serializer does.
+     *
+     * @private internal utility of `createTaskSerialization`
+     */
+    function formatExpectationUnit(unit, amount) {
+        return capitalize(unit + (amount > 1 ? 's' : ''));
+    }
+    /**
+     * Collects format commands.
+     *
+     * @private internal utility of `createTaskSerialization`
+     */
+    function createFormatCommands(task) {
+        if (task.format === 'JSON') {
+            // TODO: @deprecated remove
+            return ['FORMAT JSON'];
+        }
+        return [];
+    }
+
+    /**
+     * Stringifies one task section of the pipeline.
+     *
+     * @private internal utility of `pipelineJsonToString`
+     */
+    function stringifyTask(task) {
+        const { title, description, content, resultingParameterName } = task;
+        const { commands, contentLanguage } = createTaskSerialization(task);
+        return spacetrim.spaceTrim((block) => `
+            ## ${title}
+
+            ${block(description || '')}
+
+            ${block(stringifyCommands(commands))}
+
+            \`\`\`${contentLanguage}
+            ${block(spacetrim.spaceTrim(content))}
+            \`\`\`
+
+            \`-> {${resultingParameterName}}\`
+        `); // <- TODO: [main] !!3 If the parameter here has description, add it and use taskParameterJsonToString
+        // <- TODO: [main] !!3 Escape
+        // <- TODO: [🧠] Some clear strategy how to spaceTrim the blocks
+    }
+
+    /**
+     * Converts promptbook in JSON format to string format
+     *
+     * @deprecated TODO: [🥍][🧠] Backup original files in `PipelineJson` same as in Promptbook.studio
+     * @param pipelineJson Promptbook in JSON format (.bookc)
+     * @returns Promptbook in string format (.book.md)
+     *
+     * @public exported from `@promptbook/core`
+     */
+    function pipelineJsonToString(pipelineJson) {
+        let pipelineString = createPipelineIntroduction(pipelineJson);
+        const pipelineCommands = createPipelineCommands(pipelineJson);
+        pipelineString = appendMarkdownBlock(pipelineString, stringifyCommands(pipelineCommands));
+        for (const task of pipelineJson.tasks) {
+            pipelineString = appendMarkdownBlock(pipelineString, stringifyTask(task));
+        }
+        return validatePipelineString(pipelineString);
+    }
+    // TODO: [🛋] Implement new features and commands into `pipelineJsonToString` + `taskParameterJsonToString` , use `stringifyCommand`
+    // TODO: [🧠] Is there a way to auto-detect missing features in pipelineJsonToString
+    // TODO: [🏛] Maybe make some markdown builder
+    // TODO: [🏛] Escape all
+    // TODO: [🧠] Should be in generated .book.md file GENERATOR_WARNING
+
+    /**
+     * This error indicates that the promptbook object has valid syntax (=can be parsed) but contains logical errors (like circular dependencies)
+     *
+     * @public exported from `@promptbook/core`
+     */
+    class PipelineLogicError extends Error {
+        constructor(message) {
+            super(message);
+            this.name = 'PipelineLogicError';
+            Object.setPrototypeOf(this, PipelineLogicError.prototype);
+        }
+    }
+
+    /**
+     * Creates the shared validation context for one pipeline.
+     *
+     * @private function of `validatePipeline`
+     */
+    function createPipelineValidationContext(pipeline) {
+        return {
+            pipeline,
+            pipelineIdentification: getPipelineIdentification(pipeline),
+        };
+    }
+    /**
+     * Builds a short file/url identification block for validation errors.
+     *
+     * @private internal utility of `validatePipeline`
+     */
+    function getPipelineIdentification(pipeline) {
+        // Note: This is a 😐 implementation of [🚞]
+        const pipelineIdentificationParts = [];
+        if (pipeline.sourceFile !== undefined) {
+            pipelineIdentificationParts.push(`File: ${pipeline.sourceFile}`);
+        }
+        if (pipeline.pipelineUrl !== undefined) {
+            pipelineIdentificationParts.push(`Url: ${pipeline.pipelineUrl}`);
+        }
+        return pipelineIdentificationParts.join('\n');
+    }
+
+    /**
+     * Validates that the expected top-level collections have array structure.
+     *
+     * @private function of `validatePipeline`
+     */
+    function validatePipelineCollectionsStructure({ pipeline, pipelineIdentification, }) {
+        validatePipelineParametersCollection(pipeline, pipelineIdentification);
+        validatePipelineTasksCollection(pipeline, pipelineIdentification);
+    }
+    /**
+     * Validates that `pipeline.parameters` is an array.
+     *
+     * @private internal utility of `validatePipelineCollectionsStructure`
+     */
+    function validatePipelineParametersCollection(pipeline, pipelineIdentification) {
+        // TODO: [🧠] Maybe do here some proper JSON-schema / ZOD checking
+        if (Array.isArray(pipeline.parameters)) {
+            return;
+        }
+        // TODO: [🧠] what is the correct error tp throw - maybe PromptbookSchemaError
+        throw new ParseError(spacetrim.spaceTrim((block) => `
+                Pipeline is valid JSON but with wrong structure
+
+                \`PipelineJson.parameters\` expected to be an array, but got ${typeof pipeline.parameters}
+
+                ${block(pipelineIdentification)}
+            `));
+    }
+    /**
+     * Validates that `pipeline.tasks` is an array.
+     *
+     * @private internal utility of `validatePipelineCollectionsStructure`
+     */
+    function validatePipelineTasksCollection(pipeline, pipelineIdentification) {
+        // TODO: [🧠] Maybe do here some proper JSON-schema / ZOD checking
+        if (Array.isArray(pipeline.tasks)) {
+            return;
+        }
+        // TODO: [🧠] what is the correct error tp throw - maybe PromptbookSchemaError
+        throw new ParseError(spacetrim.spaceTrim((block) => `
+                Pipeline is valid JSON but with wrong structure
+
+                \`PipelineJson.tasks\` expected to be an array, but got ${typeof pipeline.tasks}
+
+                ${block(pipelineIdentification)}
+            `));
+    }
+
+    /**
+     * Validates that task dependencies can be resolved without cycles or missing definitions.
+     *
+     * @private function of `validatePipeline`
+     */
+    function validatePipelineDependencyResolution({ pipeline, pipelineIdentification, }) {
+        let dependencyResolutionState = createInitialDependencyResolutionState(pipeline);
+        let loopLimit = LOOP_LIMIT;
+        while (hasUnresolvedTasks(dependencyResolutionState)) {
+            if (loopLimit-- < 0) {
+                throw createDependencyResolutionLoopLimitError(pipelineIdentification);
+            }
+            dependencyResolutionState = resolveNextDependencyResolutionState(dependencyResolutionState, pipelineIdentification);
+        }
+    }
+    /**
+     * Collects the parameter names that are already resolvable before dependency traversal starts.
+     *
+     * @private internal utility of `validatePipelineDependencyResolution`
+     */
+    function createInitialDependencyResolutionState(pipeline) {
+        return {
+            resolvedParameterNames: createInitiallyResolvedParameterNames(pipeline),
+            unresolvedTasks: [...pipeline.tasks],
+        };
+    }
+    /**
+     * Checks whether dependency resolution still has tasks left to process.
+     *
+     * @private internal utility of `validatePipelineDependencyResolution`
+     */
+    function hasUnresolvedTasks({ unresolvedTasks }) {
+        return unresolvedTasks.length > 0;
+    }
+    /**
+     * Resolves the next batch of currently satisfiable tasks.
+     *
+     * @private internal utility of `validatePipelineDependencyResolution`
+     */
+    function resolveNextDependencyResolutionState(dependencyResolutionState, pipelineIdentification) {
+        const currentlyResolvedTasks = getCurrentlyResolvedTasks(dependencyResolutionState.unresolvedTasks, dependencyResolutionState.resolvedParameterNames);
+        if (currentlyResolvedTasks.length === 0) {
+            throw createUnresolvedTasksError(dependencyResolutionState.unresolvedTasks, dependencyResolutionState.resolvedParameterNames, pipelineIdentification);
+        }
+        return {
+            resolvedParameterNames: appendResolvedTaskParameterNames(dependencyResolutionState.resolvedParameterNames, currentlyResolvedTasks),
+            unresolvedTasks: dependencyResolutionState.unresolvedTasks.filter((task) => !currentlyResolvedTasks.includes(task)),
+        };
+    }
+    /**
+     * Collects the parameter names that are already resolvable before dependency traversal starts.
+     *
+     * @private internal utility of `validatePipelineDependencyResolution`
+     */
+    function createInitiallyResolvedParameterNames(pipeline) {
+        let resolvedParameterNames = pipeline.parameters
+            .filter(({ isInput }) => isInput)
+            .map(({ name }) => name);
+        for (const reservedParameterName of RESERVED_PARAMETER_NAMES) {
+            resolvedParameterNames = [...resolvedParameterNames, reservedParameterName];
+        }
+        return resolvedParameterNames;
     }
     /**
-     * Formats the expectation unit exactly as the legacy serializer does.
+     * Adds newly resolved task outputs to the resolved parameter list.
      *
-     * @private internal utility of `createTaskSerialization`
+     * @private internal utility of `validatePipelineDependencyResolution`
      */
-    function formatExpectationUnit(unit, amount) {
-        return capitalize(unit + (amount > 1 ? 's' : ''));
+    function appendResolvedTaskParameterNames(resolvedParameterNames, currentlyResolvedTasks) {
+        return [
+            ...resolvedParameterNames,
+            ...currentlyResolvedTasks.map(({ resultingParameterName }) => resultingParameterName),
+        ];
     }
     /**
-     * Collects format commands.
+     * Selects tasks whose dependencies are already resolved.
      *
-     * @private internal utility of `createTaskSerialization`
+     * @private internal utility of `validatePipelineDependencyResolution`
      */
-    function createFormatCommands(task) {
-        if (task.format === 'JSON') {
-            // TODO: @deprecated remove
-            return ['FORMAT JSON'];
-        }
-        return [];
+    function getCurrentlyResolvedTasks(unresolvedTasks, resolvedParameterNames) {
+        return unresolvedTasks.filter((task) => task.dependentParameterNames.every((name) => resolvedParameterNames.includes(name)));
     }
+    /**
+     * Creates the unexpected loop-limit error for dependency resolution.
+     *
+     * @private internal utility of `validatePipelineDependencyResolution`
+     */
+    function createDependencyResolutionLoopLimitError(pipelineIdentification) {
+        // Note: Really UnexpectedError not LimitReachedError - this should not happen and be caught below
+        return new UnexpectedError(spacetrim.spaceTrim((block) => `
+                Loop limit reached during detection of circular dependencies in \`validatePipeline\`
 
+                ${block(pipelineIdentification)}
+            `));
+    }
     /**
-     * Stringifies one task section of the pipeline.
+     * Creates the detailed error for unresolved or circular task dependencies.
      *
-     * @private internal utility of `pipelineJsonToString`
+     * @private internal utility of `validatePipelineDependencyResolution`
      */
-    function stringifyTask(task) {
-        const { title, description, content, resultingParameterName } = task;
-        const { commands, contentLanguage } = createTaskSerialization(task);
-        return spacetrim.spaceTrim((block) => `
-            ## ${title}
+    function createUnresolvedTasksError(unresolvedTasks, resolvedParameterNames, pipelineIdentification) {
+        return new PipelineLogicError(
+        // TODO: [🐎] DRY
+        spacetrim.spaceTrim((block) => `
 
-            ${block(description || '')}
+                Can not resolve some parameters:
+                Either you are using a parameter that is not defined, or there are some circular dependencies.
 
-            ${block(stringifyCommands(commands))}
+                ${block(pipelineIdentification)}
 
-            \`\`\`${contentLanguage}
-            ${block(spacetrim.spaceTrim(content))}
-            \`\`\`
+                **Can not resolve:**
+                ${block(unresolvedTasks
+        .map(({ resultingParameterName, dependentParameterNames }) => `- Parameter \`{${resultingParameterName}}\` which depends on ${dependentParameterNames
+        .map((dependentParameterName) => `\`{${dependentParameterName}}\``)
+        .join(' and ')}`)
+        .join('\n'))}
 
-            \`-> {${resultingParameterName}}\`
-        `); // <- TODO: [main] !!3 If the parameter here has description, add it and use taskParameterJsonToString
-        // <- TODO: [main] !!3 Escape
-        // <- TODO: [🧠] Some clear strategy how to spaceTrim the blocks
-    }
+                **Resolved:**
+                ${block(resolvedParameterNames
+        .filter((name) => !RESERVED_PARAMETER_NAMES.includes(name))
+        .map((name) => `- Parameter \`{${name}}\``)
+        .join('\n'))}
 
-    /**
-     * Converts promptbook in JSON format to string format
-     *
-     * @deprecated TODO: [🥍][🧠] Backup original files in `PipelineJson` same as in Promptbook.studio
-     * @param pipelineJson Promptbook in JSON format (.bookc)
-     * @returns Promptbook in string format (.book.md)
-     *
-     * @public exported from `@promptbook/core`
-     */
-    function pipelineJsonToString(pipelineJson) {
-        let pipelineString = createPipelineIntroduction(pipelineJson);
-        const pipelineCommands = createPipelineCommands(pipelineJson);
-        pipelineString = appendMarkdownBlock(pipelineString, stringifyCommands(pipelineCommands));
-        for (const task of pipelineJson.tasks) {
-            pipelineString = appendMarkdownBlock(pipelineString, stringifyTask(task));
-        }
-        return validatePipelineString(pipelineString);
-    }
-    // TODO: [🛋] Implement new features and commands into `pipelineJsonToString` + `taskParameterJsonToString` , use `stringifyCommand`
-    // TODO: [🧠] Is there a way to auto-detect missing features in pipelineJsonToString
-    // TODO: [🏛] Maybe make some markdown builder
-    // TODO: [🏛] Escape all
-    // TODO: [🧠] Should be in generated .book.md file GENERATOR_WARNING
 
-    /**
-     * This error indicates that the promptbook object has valid syntax (=can be parsed) but contains logical errors (like circular dependencies)
-     *
-     * @public exported from `@promptbook/core`
-     */
-    class PipelineLogicError extends Error {
-        constructor(message) {
-            super(message);
-            this.name = 'PipelineLogicError';
-            Object.setPrototypeOf(this, PipelineLogicError.prototype);
-        }
+                **Reserved (which are available):**
+                ${block(resolvedParameterNames
+        .filter((name) => RESERVED_PARAMETER_NAMES.includes(name))
+        .map((name) => `- Parameter \`{${name}}\``)
+        .join('\n'))}
+
+
+            `));
     }
 
     /**
@@ -24650,182 +24858,33 @@
         if (!url.startsWith('https://') && !url.startsWith('http://') /* <- Note: [👣] */) {
             return false;
         }
-        if (url.includes('#')) {
-            // TODO: [🐠]
-            return false;
-        }
-        /*
-        Note: [👣][🧠] Is it secure to allow pipeline URLs on private and unsecured networks?
-        if (isUrlOnPrivateNetwork(url)) {
-            return false;
-        }
-        */
-        return true;
-    }
-    // TODO: [🐠] Maybe more info why the URL is invalid
-
-    /**
-     * Validates PipelineJson if it is logically valid
-     *
-     * It checks:
-     * -   if it has correct parameters dependency
-     *
-     * It does NOT check:
-     * -   if it is valid json
-     * -   if it is meaningful
-     *
-     * Note: [🔂] This function is idempotent.
-     *
-     * @param pipeline valid or invalid PipelineJson
-     * @returns the same pipeline if it is logically valid
-     * @throws {PipelineLogicError} on logical error in the pipeline
-     *
-     * @public exported from `@promptbook/core`
-     */
-    function validatePipeline(pipeline) {
-        if (IS_PIPELINE_LOGIC_VALIDATED) {
-            validatePipeline_InnerFunction(pipeline);
-        }
-        else {
-            try {
-                validatePipeline_InnerFunction(pipeline);
-            }
-            catch (error) {
-                if (!(error instanceof PipelineLogicError)) {
-                    throw error;
-                }
-                console.error(spacetrim.spaceTrim((block) => `
-                        Pipeline is not valid but logic errors are temporarily disabled via \`IS_PIPELINE_LOGIC_VALIDATED\`
-
-                        ${block(error.message)}
-                    `));
-            }
-        }
-        return pipeline;
-    }
-    /**
-     * Validates pipeline inner function.
-     *
-     * @private internal function for `validatePipeline`
-     */
-    function validatePipeline_InnerFunction(pipeline) {
-        // TODO: [🧠] Maybe test if promptbook is a promise and make specific error case for that
-        const context = createPipelineValidationContext(pipeline);
-        validatePipelineMetadata(context);
-        validatePipelineCollectionsStructure(context);
-        validatePipelineParameters(context);
-        validatePipelineTasks(context);
-        validatePipelineDependencyResolution(context);
-        // Note: Check that formfactor is corresponding to the pipeline interface
-        // TODO: !!6 Implement this
-        // pipeline.formfactorName
-    }
-    /**
-     * Creates the shared validation context for one pipeline.
-     *
-     * @private internal utility of `validatePipeline`
-     */
-    function createPipelineValidationContext(pipeline) {
-        return {
-            pipeline,
-            pipelineIdentification: getPipelineIdentification(pipeline),
-        };
-    }
-    /**
-     * Builds a short file/url identification block for validation errors.
-     *
-     * @private internal utility of `validatePipeline`
-     */
-    function getPipelineIdentification(pipeline) {
-        // Note: This is a 😐 implementation of [🚞]
-        const pipelineIdentificationParts = [];
-        if (pipeline.sourceFile !== undefined) {
-            pipelineIdentificationParts.push(`File: ${pipeline.sourceFile}`);
-        }
-        if (pipeline.pipelineUrl !== undefined) {
-            pipelineIdentificationParts.push(`Url: ${pipeline.pipelineUrl}`);
-        }
-        return pipelineIdentificationParts.join('\n');
-    }
-    /**
-     * Validates pipeline-level metadata fields.
-     *
-     * @private internal step of `validatePipeline`
-     */
-    function validatePipelineMetadata({ pipeline, pipelineIdentification }) {
-        validatePipelineUrl(pipeline, pipelineIdentification);
-        validatePipelineBookVersion(pipeline, pipelineIdentification);
-    }
-    /**
-     * Validates that the expected top-level collections have array structure.
-     *
-     * @private internal step of `validatePipeline`
-     */
-    function validatePipelineCollectionsStructure({ pipeline, pipelineIdentification }) {
-        validatePipelineParametersCollection(pipeline, pipelineIdentification);
-        validatePipelineTasksCollection(pipeline, pipelineIdentification);
-    }
-    /**
-     * Validates all pipeline parameter declarations.
-     *
-     * @private internal step of `validatePipeline`
-     */
-    function validatePipelineParameters({ pipeline, pipelineIdentification }) {
-        for (const parameter of pipeline.parameters) {
-            validatePipelineParameter(parameter, pipeline, pipelineIdentification);
-        }
-    }
-    /**
-     * Validates all pipeline tasks and their per-task invariants.
-     *
-     * @private internal step of `validatePipeline`
-     */
-    function validatePipelineTasks({ pipeline, pipelineIdentification }) {
-        // Note: All input parameters are defined - so that they can be used as result of some task
-        const definedParameters = createInitiallyDefinedParameters(pipeline);
-        for (const task of pipeline.tasks) {
-            validatePipelineTask(task, definedParameters, pipelineIdentification);
-        }
-    }
-    /**
-     * Validates that task dependencies can be resolved without cycles or missing definitions.
-     *
-     * @private internal step of `validatePipeline`
-     */
-    function validatePipelineDependencyResolution({ pipeline, pipelineIdentification }) {
-        let dependencyResolutionState = createInitialDependencyResolutionState(pipeline);
-        let loopLimit = LOOP_LIMIT;
-        while (hasUnresolvedTasks(dependencyResolutionState)) {
-            if (loopLimit-- < 0) {
-                throw createDependencyResolutionLoopLimitError(pipelineIdentification);
-            }
-            dependencyResolutionState = resolveNextDependencyResolutionState(dependencyResolutionState, pipelineIdentification);
+        if (url.includes('#')) {
+            // TODO: [🐠]
+            return false;
         }
+        /*
+        Note: [👣][🧠] Is it secure to allow pipeline URLs on private and unsecured networks?
+        if (isUrlOnPrivateNetwork(url)) {
+            return false;
+        }
+        */
+        return true;
     }
+    // TODO: [🐠] Maybe more info why the URL is invalid
+
     /**
-     * Validates one pipeline parameter declaration.
-     *
-     * @private internal step of `validatePipeline`
-     */
-    function validatePipelineParameter(parameter, pipeline, pipelineIdentification) {
-        validateParameterDirection(parameter, pipelineIdentification);
-        validateParameterUsage(parameter, pipeline, pipelineIdentification);
-        validateParameterDefinition(parameter, pipeline, pipelineIdentification);
-    }
-    /**
-     * Validates one pipeline task and its invariants.
+     * Validates pipeline-level metadata fields.
      *
-     * @private internal step of `validatePipeline`
+     * @private function of `validatePipeline`
      */
-    function validatePipelineTask(task, definedParameters, pipelineIdentification) {
-        validateTaskResultingParameter(task, definedParameters, pipelineIdentification);
-        validateTaskJokers(task, pipelineIdentification);
-        validateTaskExpectations(task, pipelineIdentification);
+    function validatePipelineMetadata({ pipeline, pipelineIdentification }) {
+        validatePipelineUrl(pipeline, pipelineIdentification);
+        validatePipelineBookVersion(pipeline, pipelineIdentification);
     }
     /**
      * Validates the pipeline URL, when present.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineMetadata`
      */
     function validatePipelineUrl(pipeline, pipelineIdentification) {
         if (pipeline.pipelineUrl === undefined || isValidPipelineUrl(pipeline.pipelineUrl)) {
@@ -24841,7 +24900,7 @@
     /**
      * Validates the Promptbook version, when present.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineMetadata`
      */
     function validatePipelineBookVersion(pipeline, pipelineIdentification) {
         if (pipeline.bookVersion === undefined || isValidPromptbookVersion(pipeline.bookVersion)) {
@@ -24854,48 +24913,31 @@
                 ${block(pipelineIdentification)}
             `));
     }
+
     /**
-     * Validates that `pipeline.parameters` is an array.
+     * Validates all pipeline parameter declarations.
      *
-     * @private internal utility of `validatePipeline`
+     * @private function of `validatePipeline`
      */
-    function validatePipelineParametersCollection(pipeline, pipelineIdentification) {
-        // TODO: [🧠] Maybe do here some proper JSON-schema / ZOD checking
-        if (Array.isArray(pipeline.parameters)) {
-            return;
+    function validatePipelineParameters({ pipeline, pipelineIdentification }) {
+        for (const parameter of pipeline.parameters) {
+            validatePipelineParameter(parameter, pipeline, pipelineIdentification);
         }
-        // TODO: [🧠] what is the correct error tp throw - maybe PromptbookSchemaError
-        throw new ParseError(spacetrim.spaceTrim((block) => `
-                Pipeline is valid JSON but with wrong structure
-
-                \`PipelineJson.parameters\` expected to be an array, but got ${typeof pipeline.parameters}
-
-                ${block(pipelineIdentification)}
-            `));
     }
     /**
-     * Validates that `pipeline.tasks` is an array.
+     * Validates one pipeline parameter declaration.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineParameters`
      */
-    function validatePipelineTasksCollection(pipeline, pipelineIdentification) {
-        // TODO: [🧠] Maybe do here some proper JSON-schema / ZOD checking
-        if (Array.isArray(pipeline.tasks)) {
-            return;
-        }
-        // TODO: [🧠] what is the correct error tp throw - maybe PromptbookSchemaError
-        throw new ParseError(spacetrim.spaceTrim((block) => `
-                Pipeline is valid JSON but with wrong structure
-
-                \`PipelineJson.tasks\` expected to be an array, but got ${typeof pipeline.tasks}
-
-                ${block(pipelineIdentification)}
-            `));
+    function validatePipelineParameter(parameter, pipeline, pipelineIdentification) {
+        validateParameterDirection(parameter, pipelineIdentification);
+        validateParameterUsage(parameter, pipeline, pipelineIdentification);
+        validateParameterDefinition(parameter, pipeline, pipelineIdentification);
     }
     /**
      * Validates that one parameter does not declare incompatible directions.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineParameters`
      */
     function validateParameterDirection(parameter, pipelineIdentification) {
         if (!parameter.isInput || !parameter.isOutput) {
@@ -24912,7 +24954,7 @@
     /**
      * Validates that one intermediate parameter is actually consumed by at least one task.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineParameters`
      */
     function validateParameterUsage(parameter, pipeline, pipelineIdentification) {
         if (parameter.isInput || parameter.isOutput || isParameterUsedByAnyTask(parameter, pipeline.tasks)) {
@@ -24931,7 +24973,7 @@
     /**
      * Validates that one non-input parameter is produced by at least one task.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineParameters`
      */
     function validateParameterDefinition(parameter, pipeline, pipelineIdentification) {
         if (parameter.isInput || isParameterDefinedByAnyTask(parameter, pipeline.tasks)) {
@@ -24950,7 +24992,7 @@
     /**
      * Checks whether one parameter is consumed by at least one task dependency list.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineParameters`
      */
     function isParameterUsedByAnyTask(parameter, tasks) {
         return tasks.some((task) => task.dependentParameterNames.includes(parameter.name));
@@ -24958,23 +25000,46 @@
     /**
      * Checks whether one parameter is produced by at least one task.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineParameters`
      */
     function isParameterDefinedByAnyTask(parameter, tasks) {
         return tasks.some((task) => task.resultingParameterName === parameter.name);
     }
+
+    /**
+     * Validates all pipeline tasks and their per-task invariants.
+     *
+     * @private function of `validatePipeline`
+     */
+    function validatePipelineTasks({ pipeline, pipelineIdentification }) {
+        // Note: All input parameters are defined - so that they can be used as result of some task
+        const definedParameters = createInitiallyDefinedParameters(pipeline);
+        for (const task of pipeline.tasks) {
+            validatePipelineTask(task, definedParameters, pipelineIdentification);
+        }
+    }
     /**
      * Collects the parameter names that are already defined before task validation starts.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function createInitiallyDefinedParameters(pipeline) {
         return new Set(pipeline.parameters.filter(({ isInput }) => isInput).map(({ name }) => name));
     }
+    /**
+     * Validates one pipeline task and its invariants.
+     *
+     * @private internal utility of `validatePipelineTasks`
+     */
+    function validatePipelineTask(task, definedParameters, pipelineIdentification) {
+        validateTaskResultingParameter(task, definedParameters, pipelineIdentification);
+        validateTaskJokers(task, pipelineIdentification);
+        validateTaskExpectations(task, pipelineIdentification);
+    }
     /**
      * Validates one task result parameter declaration and marks it as defined.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function validateTaskResultingParameter(task, definedParameters, pipelineIdentification) {
         if (definedParameters.has(task.resultingParameterName)) {
@@ -24996,7 +25061,7 @@
     /**
      * Validates joker parameters for one task.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function validateTaskJokers(task, pipelineIdentification) {
         if (!hasTaskJokers(task)) {
@@ -25008,7 +25073,7 @@
     /**
      * Checks whether one task declares any joker parameters.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function hasTaskJokers(task) {
         return !!task.jokerParameterNames && task.jokerParameterNames.length > 0;
@@ -25016,7 +25081,7 @@
     /**
      * Validates that a task has the required supporting features when using jokers.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function validateTaskSupportsJokers(task, pipelineIdentification) {
         if (task.format || task.expectations /* <- TODO: Require at least 1 -> min <- expectation to use jokers */) {
@@ -25031,7 +25096,7 @@
     /**
      * Validates that every joker parameter is also listed among task dependencies.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function validateTaskJokerDependencies(task, pipelineIdentification) {
         for (const joker of task.jokerParameterNames) {
@@ -25048,7 +25113,7 @@
     /**
      * Validates all expectation bounds configured on one task.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function validateTaskExpectations(task, pipelineIdentification) {
         if (!task.expectations) {
@@ -25063,7 +25128,7 @@
     /**
      * Validates the minimum and maximum expectation ordering for one unit.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function validateTaskExpectationRange(unit, min, max, pipelineIdentification) {
         if (min === undefined || max === undefined || min <= max) {
@@ -25078,7 +25143,7 @@
     /**
      * Validates the minimum expectation bound for one unit.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function validateTaskExpectationMin(unit, min, pipelineIdentification) {
         if (min === undefined || min >= 0) {
@@ -25093,7 +25158,7 @@
     /**
      * Validates the maximum expectation bound for one unit.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal utility of `validatePipelineTasks`
      */
     function validateTaskExpectationMax(unit, max, pipelineIdentification) {
         if (max === undefined || max > 0) {
@@ -25105,123 +25170,62 @@
                 ${block(pipelineIdentification)}
             `));
     }
+
     /**
-     * Collects the parameter names that are already resolvable before dependency traversal starts.
-     *
-     * @private internal utility of `validatePipeline`
-     */
-    function createInitialDependencyResolutionState(pipeline) {
-        return {
-            resolvedParameterNames: createInitiallyResolvedParameterNames(pipeline),
-            unresolvedTasks: [...pipeline.tasks],
-        };
-    }
-    /**
-     * Checks whether dependency resolution still has tasks left to process.
-     *
-     * @private internal utility of `validatePipeline`
-     */
-    function hasUnresolvedTasks({ unresolvedTasks }) {
-        return unresolvedTasks.length > 0;
-    }
-    /**
-     * Resolves the next batch of currently satisfiable tasks.
+     * Validates PipelineJson if it is logically valid
      *
-     * @private internal utility of `validatePipeline`
-     */
-    function resolveNextDependencyResolutionState(dependencyResolutionState, pipelineIdentification) {
-        const currentlyResolvedTasks = getCurrentlyResolvedTasks(dependencyResolutionState.unresolvedTasks, dependencyResolutionState.resolvedParameterNames);
-        if (currentlyResolvedTasks.length === 0) {
-            throw createUnresolvedTasksError(dependencyResolutionState.unresolvedTasks, dependencyResolutionState.resolvedParameterNames, pipelineIdentification);
-        }
-        return {
-            resolvedParameterNames: appendResolvedTaskParameterNames(dependencyResolutionState.resolvedParameterNames, currentlyResolvedTasks),
-            unresolvedTasks: dependencyResolutionState.unresolvedTasks.filter((task) => !currentlyResolvedTasks.includes(task)),
-        };
-    }
-    /**
-     * Collects the parameter names that are already resolvable before dependency traversal starts.
+     * It checks:
+     * -   if it has correct parameters dependency
      *
-     * @private internal utility of `validatePipeline`
-     */
-    function createInitiallyResolvedParameterNames(pipeline) {
-        let resolvedParameterNames = pipeline.parameters
-            .filter(({ isInput }) => isInput)
-            .map(({ name }) => name);
-        for (const reservedParameterName of RESERVED_PARAMETER_NAMES) {
-            resolvedParameterNames = [...resolvedParameterNames, reservedParameterName];
-        }
-        return resolvedParameterNames;
-    }
-    /**
-     * Adds newly resolved task outputs to the resolved parameter list.
+     * It does NOT check:
+     * -   if it is valid json
+     * -   if it is meaningful
      *
-     * @private internal utility of `validatePipeline`
-     */
-    function appendResolvedTaskParameterNames(resolvedParameterNames, currentlyResolvedTasks) {
-        return [
-            ...resolvedParameterNames,
-            ...currentlyResolvedTasks.map(({ resultingParameterName }) => resultingParameterName),
-        ];
-    }
-    /**
-     * Selects tasks whose dependencies are already resolved.
+     * Note: [🔂] This function is idempotent.
      *
-     * @private internal utility of `validatePipeline`
-     */
-    function getCurrentlyResolvedTasks(unresolvedTasks, resolvedParameterNames) {
-        return unresolvedTasks.filter((task) => task.dependentParameterNames.every((name) => resolvedParameterNames.includes(name)));
-    }
-    /**
-     * Creates the unexpected loop-limit error for dependency resolution.
+     * @param pipeline valid or invalid PipelineJson
+     * @returns the same pipeline if it is logically valid
+     * @throws {PipelineLogicError} on logical error in the pipeline
      *
-     * @private internal utility of `validatePipeline`
+     * @public exported from `@promptbook/core`
      */
-    function createDependencyResolutionLoopLimitError(pipelineIdentification) {
-        // Note: Really UnexpectedError not LimitReachedError - this should not happen and be caught below
-        return new UnexpectedError(spacetrim.spaceTrim((block) => `
-                Loop limit reached during detection of circular dependencies in \`validatePipeline\`
+    function validatePipeline(pipeline) {
+        if (IS_PIPELINE_LOGIC_VALIDATED) {
+            validatePipeline_InnerFunction(pipeline);
+        }
+        else {
+            try {
+                validatePipeline_InnerFunction(pipeline);
+            }
+            catch (error) {
+                if (!(error instanceof PipelineLogicError)) {
+                    throw error;
+                }
+                console.error(spacetrim.spaceTrim((block) => `
+                        Pipeline is not valid but logic errors are temporarily disabled via \`IS_PIPELINE_LOGIC_VALIDATED\`
 
-                ${block(pipelineIdentification)}
-            `));
+                        ${block(error.message)}
+                    `));
+            }
+        }
+        return pipeline;
     }
     /**
-     * Creates the detailed error for unresolved or circular task dependencies.
+     * Validates pipeline inner function.
      *
-     * @private internal utility of `validatePipeline`
+     * @private internal function for `validatePipeline`
      */
-    function createUnresolvedTasksError(unresolvedTasks, resolvedParameterNames, pipelineIdentification) {
-        return new PipelineLogicError(
-        // TODO: [🐎] DRY
-        spacetrim.spaceTrim((block) => `
-
-                Can not resolve some parameters:
-                Either you are using a parameter that is not defined, or there are some circular dependencies.
-
-                ${block(pipelineIdentification)}
-
-                **Can not resolve:**
-                ${block(unresolvedTasks
-        .map(({ resultingParameterName, dependentParameterNames }) => `- Parameter \`{${resultingParameterName}}\` which depends on ${dependentParameterNames
-        .map((dependentParameterName) => `\`{${dependentParameterName}}\``)
-        .join(' and ')}`)
-        .join('\n'))}
-
-                **Resolved:**
-                ${block(resolvedParameterNames
-        .filter((name) => !RESERVED_PARAMETER_NAMES.includes(name))
-        .map((name) => `- Parameter \`{${name}}\``)
-        .join('\n'))}
-
-
-                **Reserved (which are available):**
-                ${block(resolvedParameterNames
-        .filter((name) => RESERVED_PARAMETER_NAMES.includes(name))
-        .map((name) => `- Parameter \`{${name}}\``)
-        .join('\n'))}
-
-
-            `));
+    function validatePipeline_InnerFunction(pipeline) {
+        // TODO: [🧠] Maybe test if promptbook is a promise and make specific error case for that
+        const context = createPipelineValidationContext(pipeline);
+        validatePipelineMetadata(context);
+        validatePipelineCollectionsStructure(context);
+        validatePipelineParameters(context);
+        validatePipelineTasks(context);
+        validatePipelineDependencyResolution(context);
+        // Note: Check that formfactor is corresponding to the pipeline interface
+        // TODO: !!6 Implement this
+        // pipeline.formfactorName
     }
     /**
      * TODO: [🧞‍♀️] Do not allow joker + foreach