git-hash-art 0.2.0 → 0.4.0

package/dist/browser.js

@@ -8,9 +8,21 @@ import $4wRzV$colorscheme from "color-scheme";
  */ /**
  * Pure rendering logic — environment-agnostic.
  *
- * This module only uses the standard CanvasRenderingContext2D API,
- * so it works identically in Node (@napi-rs/canvas) and browsers
- * (HTMLCanvasElement).
+ * Uses only the standard CanvasRenderingContext2D API so it works
+ * identically in Node (@napi-rs/canvas) and browsers.
+ *
+ * Generation pipeline:
+ *   1.  Background — radial gradient from hash-derived dark palette
+ *   1b. Layered background — large faint shapes / subtle pattern for depth
+ *   2.  Composition mode — hash selects: radial, flow-field, spiral, grid-subdivision, or clustered
+ *   3.  Focal points + void zones (negative space)
+ *   4.  Flow field seed values
+ *   5.  Shape layers — blend modes, render styles, weighted selection,
+ *       focal-point placement, atmospheric depth, organic edges
+ *   5b. Recursive nesting
+ *   6.  Flow-line pass — tapered brush-stroke curves
+ *   7.  Noise texture overlay
+ *   8.  Organic connecting curves
  */ 
  // declare module 'color-scheme';
 
@@ -68,46 +80,61 @@ class $616009579e3d72c5$export$da2372f11bc66b3f {
 }
 
 
-function $b5a262d09b87e373$export$f116a24fd288e742(gitHash) {
-    const seed = (0, $616009579e3d72c5$export$39a95c82b20fdf81)(gitHash);
-    const scheme = new (0, $4wRzV$colorscheme)();
-    scheme.from_hue(seed % 360).scheme("analogic").variation("soft");
-    let colors = scheme.colors().map((hex)=>`#${hex}`);
-    const contrastingHue = (seed + 180) % 360;
-    const contrastingScheme = new (0, $4wRzV$colorscheme)();
-    contrastingScheme.from_hue(contrastingHue).scheme("mono").variation("soft");
-    colors.push(`#${contrastingScheme.colors()[0]}`);
-    return colors;
+// ── Color variation modes ───────────────────────────────────────────
+// The hash deterministically selects a variation, producing dramatically
+// different palettes from the same hue.
+const $b5a262d09b87e373$var$COLOR_VARIATIONS = [
+    "soft",
+    "hard",
+    "pastel",
+    "light",
+    "dark",
+    "default"
+];
+/**
+ * Pick a color variation mode deterministically from a seed.
+ */ function $b5a262d09b87e373$var$pickVariation(seed) {
+    return $b5a262d09b87e373$var$COLOR_VARIATIONS[Math.abs(seed) % $b5a262d09b87e373$var$COLOR_VARIATIONS.length];
+}
+/**
+ * Scheme type also varies — some hashes get near-monochromatic palettes,
+ * others get high-contrast complementary schemes.
+ */ const $b5a262d09b87e373$var$SCHEME_TYPES = [
+    "analogic",
+    "mono",
+    "contrast",
+    "triade",
+    "tetrade"
+];
+function $b5a262d09b87e373$var$pickSchemeType(seed) {
+    return $b5a262d09b87e373$var$SCHEME_TYPES[Math.abs(seed >> 4) % $b5a262d09b87e373$var$SCHEME_TYPES.length];
 }
 class $b5a262d09b87e373$export$ab958c550f521376 {
     constructor(gitHash){
         this.seed = (0, $616009579e3d72c5$export$39a95c82b20fdf81)(gitHash);
+        this.rng = (0, $616009579e3d72c5$export$eaf9227667332084)((0, $616009579e3d72c5$export$e9cc707de01b7042)(gitHash, 42));
+        // Hash-driven variation and scheme type for palette diversity
+        this.variation = $b5a262d09b87e373$var$pickVariation(this.seed);
+        this.schemeType = $b5a262d09b87e373$var$pickSchemeType(this.seed);
         this.baseScheme = this.generateBaseScheme();
         this.complementaryScheme = this.generateComplementaryScheme();
         this.triadicScheme = this.generateTriadicScheme();
-        this.metallic = this.generateMetallicColors();
     }
     generateBaseScheme() {
         const scheme = new (0, $4wRzV$colorscheme)();
-        return scheme.from_hue(this.seed % 360).scheme("analogic").variation("soft").colors().map((hex)=>`#${hex}`);
+        return scheme.from_hue(this.seed % 360).scheme(this.schemeType).variation(this.variation).colors().map((hex)=>`#${hex}`);
     }
     generateComplementaryScheme() {
         const complementaryHue = (this.seed + 180) % 360;
+        // Complementary uses a contrasting variation for tension
+        const compVariation = this.variation === "soft" ? "hard" : this.variation === "dark" ? "light" : this.variation;
         const scheme = new (0, $4wRzV$colorscheme)();
-        return scheme.from_hue(complementaryHue).scheme("mono").variation("soft").colors().map((hex)=>`#${hex}`);
+        return scheme.from_hue(complementaryHue).scheme("mono").variation(compVariation).colors().map((hex)=>`#${hex}`);
     }
     generateTriadicScheme() {
         const triadicHue = (this.seed + 120) % 360;
         const scheme = new (0, $4wRzV$colorscheme)();
-        return scheme.from_hue(triadicHue).scheme("triade").variation("soft").colors().map((hex)=>`#${hex}`);
-    }
-    generateMetallicColors() {
-        return {
-            gold: "#FFD700",
-            silver: "#C0C0C0",
-            copper: "#B87333",
-            bronze: "#CD7F32"
-        };
+        return scheme.from_hue(triadicHue).scheme("triade").variation(this.variation).colors().map((hex)=>`#${hex}`);
     }
     /**
    * Returns a flat array of hash-derived colors suitable for art generation.
@@ -165,6 +192,12 @@ function $b5a262d09b87e373$export$59539d800dbe6858(hex, rng, amount = 0.1) {
     const jit = ()=>(rng() - 0.5) * 2 * amount * 255;
     return $b5a262d09b87e373$var$rgbToHex(r + jit(), g + jit(), b + jit());
 }
+function $b5a262d09b87e373$export$fb75607d98509d9(hex, amount) {
+    const [r, g, b] = $b5a262d09b87e373$var$hexToRgb(hex);
+    const gray = 0.299 * r + 0.587 * g + 0.114 * b;
+    const mix = (c)=>c + (gray - c) * amount;
+    return $b5a262d09b87e373$var$rgbToHex(mix(r), mix(g), mix(b));
+}
 
 
 
@@ -952,6 +985,32 @@ const $e41b41d8dcf837ad$export$4ff7fc6f1af248b5 = {
 };
 
 
+const $e0f99502ff383dd8$export$f821c68fe9beaecf = [
+    "source-over",
+    "screen",
+    "multiply",
+    "overlay",
+    "soft-light",
+    "color-dodge",
+    "color-burn",
+    "lighter"
+];
+function $e0f99502ff383dd8$export$7bb7bff4e26fa06b(rng) {
+    if (rng() < 0.4) return "source-over";
+    return $e0f99502ff383dd8$export$f821c68fe9beaecf[1 + Math.floor(rng() * ($e0f99502ff383dd8$export$f821c68fe9beaecf.length - 1))];
+}
+const $e0f99502ff383dd8$var$RENDER_STYLES = [
+    "fill-and-stroke",
+    "fill-and-stroke",
+    "fill-only",
+    "stroke-only",
+    "double-stroke",
+    "dashed",
+    "watercolor"
+];
+function $e0f99502ff383dd8$export$9fd4e64b2acd410e(rng) {
+    return $e0f99502ff383dd8$var$RENDER_STYLES[Math.floor(rng() * $e0f99502ff383dd8$var$RENDER_STYLES.length)];
+}
 function $e0f99502ff383dd8$export$71b514a25c47df50(ctx, shape, x, y, config) {
     const { fillColor: fillColor, strokeColor: strokeColor, strokeWidth: strokeWidth, size: size, rotation: rotation } = config;
     ctx.save();
@@ -968,8 +1027,71 @@ function $e0f99502ff383dd8$export$71b514a25c47df50(ctx, shape, x, y, config) {
     }
     ctx.restore();
 }
+/**
+ * Apply the chosen render style to the current path.
+ */ function $e0f99502ff383dd8$var$applyRenderStyle(ctx, style, fillColor, strokeColor, strokeWidth, size, rng) {
+    switch(style){
+        case "fill-only":
+            ctx.fill();
+            break;
+        case "stroke-only":
+            ctx.fill(); // transparent fill to define the path
+            ctx.globalAlpha *= 0.3; // ghost fill
+            ctx.fill();
+            ctx.globalAlpha /= 0.3;
+            ctx.stroke();
+            break;
+        case "double-stroke":
+            ctx.fill();
+            // Outer stroke
+            ctx.lineWidth = strokeWidth * 2;
+            ctx.globalAlpha *= 0.5;
+            ctx.stroke();
+            ctx.globalAlpha /= 0.5;
+            // Inner stroke
+            ctx.lineWidth = strokeWidth * 0.5;
+            ctx.strokeStyle = fillColor;
+            ctx.stroke();
+            break;
+        case "dashed":
+            ctx.fill();
+            ctx.setLineDash([
+                size * 0.05,
+                size * 0.03
+            ]);
+            ctx.stroke();
+            ctx.setLineDash([]);
+            break;
+        case "watercolor":
+            {
+                // Draw 3-4 slightly offset passes at low opacity for a bleed effect
+                const passes = 3 + (rng ? Math.floor(rng() * 2) : 0);
+                const savedAlpha = ctx.globalAlpha;
+                ctx.globalAlpha = savedAlpha * (0.3 / passes * 2);
+                for(let p = 0; p < passes; p++){
+                    const jx = rng ? (rng() - 0.5) * size * 0.06 : 0;
+                    const jy = rng ? (rng() - 0.5) * size * 0.06 : 0;
+                    ctx.save();
+                    ctx.translate(jx, jy);
+                    ctx.fill();
+                    ctx.restore();
+                }
+                ctx.globalAlpha = savedAlpha;
+                // Light stroke on top
+                ctx.globalAlpha *= 0.4;
+                ctx.stroke();
+                ctx.globalAlpha /= 0.4;
+                break;
+            }
+        case "fill-and-stroke":
+        default:
+            ctx.fill();
+            ctx.stroke();
+            break;
+    }
+}
 function $e0f99502ff383dd8$export$bb35a6995ddbf32d(ctx, shape, x, y, config) {
-    const { fillColor: fillColor, strokeColor: strokeColor, strokeWidth: strokeWidth, size: size, rotation: rotation, patterns: patterns = [], proportionType: proportionType = "GOLDEN_RATIO", baseOpacity: baseOpacity = 0.6, opacityReduction: opacityReduction = 0.1, glowRadius: glowRadius = 0, glowColor: glowColor, gradientFillEnd: gradientFillEnd } = config;
+    const { fillColor: fillColor, strokeColor: strokeColor, strokeWidth: strokeWidth, size: size, rotation: rotation, patterns: patterns = [], proportionType: proportionType = "GOLDEN_RATIO", baseOpacity: baseOpacity = 0.6, opacityReduction: opacityReduction = 0.1, glowRadius: glowRadius = 0, glowColor: glowColor, gradientFillEnd: gradientFillEnd, renderStyle: renderStyle = "fill-and-stroke", rng: rng } = config;
     ctx.save();
     ctx.translate(x, y);
     ctx.rotate(rotation * Math.PI / 180);
@@ -992,8 +1114,7 @@ function $e0f99502ff383dd8$export$bb35a6995ddbf32d(ctx, shape, x, y, config) {
     const drawFunction = (0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5)[shape];
     if (drawFunction) {
         drawFunction(ctx, size);
-        ctx.fill();
-        ctx.stroke();
+        $e0f99502ff383dd8$var$applyRenderStyle(ctx, renderStyle, fillColor, strokeColor, strokeWidth, size, rng);
     }
     // Reset shadow so patterns aren't double-glowed
     if (glowRadius > 0) ctx.shadowBlur = 0;
@@ -1025,6 +1146,138 @@ function $e0f99502ff383dd8$export$bb35a6995ddbf32d(ctx, shape, x, y, config) {
 };
 
 
+// ── Shape categories for weighted selection ─────────────────────────
+const $1f63dc64b5593c73$var$BASIC_SHAPES = [
+    "circle",
+    "square",
+    "triangle",
+    "hexagon",
+    "diamond",
+    "cube"
+];
+const $1f63dc64b5593c73$var$COMPLEX_SHAPES = [
+    "star",
+    "jacked-star",
+    "heart",
+    "platonicSolid",
+    "fibonacciSpiral",
+    "islamicPattern",
+    "celticKnot",
+    "merkaba",
+    "fractal"
+];
+const $1f63dc64b5593c73$var$SACRED_SHAPES = [
+    "mandala",
+    "flowerOfLife",
+    "treeOfLife",
+    "metatronsCube",
+    "sriYantra",
+    "seedOfLife",
+    "vesicaPiscis",
+    "torus",
+    "eggOfLife"
+];
+const $1f63dc64b5593c73$var$COMPOSITION_MODES = [
+    "radial",
+    "flow-field",
+    "spiral",
+    "grid-subdivision",
+    "clustered"
+];
+// ── Helper: pick shape with layer-aware weighting ───────────────────
+function $1f63dc64b5593c73$var$pickShape(rng, layerRatio, shapeNames) {
+    const basicW = 1 - layerRatio * 0.6;
+    const complexW = 0.3 + layerRatio * 0.3;
+    const sacredW = 0.1 + layerRatio * 0.4;
+    const total = basicW + complexW + sacredW;
+    const roll = rng() * total;
+    let pool;
+    if (roll < basicW) pool = $1f63dc64b5593c73$var$BASIC_SHAPES;
+    else if (roll < basicW + complexW) pool = $1f63dc64b5593c73$var$COMPLEX_SHAPES;
+    else pool = $1f63dc64b5593c73$var$SACRED_SHAPES;
+    const available = pool.filter((s)=>shapeNames.includes(s));
+    if (available.length === 0) return shapeNames[Math.floor(rng() * shapeNames.length)];
+    return available[Math.floor(rng() * available.length)];
+}
+// ── Helper: get position based on composition mode ──────────────────
+function $1f63dc64b5593c73$var$getCompositionPosition(mode, rng, width, height, shapeIndex, totalShapes, cx, cy) {
+    switch(mode){
+        case "radial":
+            {
+                const angle = rng() * Math.PI * 2;
+                const maxR = Math.min(width, height) * 0.45;
+                const r = Math.pow(rng(), 0.7) * maxR;
+                return {
+                    x: cx + Math.cos(angle) * r,
+                    y: cy + Math.sin(angle) * r
+                };
+            }
+        case "spiral":
+            {
+                const t = shapeIndex / totalShapes;
+                const turns = 3 + rng() * 2;
+                const angle = t * Math.PI * 2 * turns;
+                const maxR = Math.min(width, height) * 0.42;
+                const r = t * maxR + (rng() - 0.5) * maxR * 0.15;
+                return {
+                    x: cx + Math.cos(angle) * r,
+                    y: cy + Math.sin(angle) * r
+                };
+            }
+        case "grid-subdivision":
+            {
+                const cells = 3 + Math.floor(rng() * 3);
+                const cellW = width / cells;
+                const cellH = height / cells;
+                const gx = Math.floor(rng() * cells);
+                const gy = Math.floor(rng() * cells);
+                return {
+                    x: gx * cellW + rng() * cellW,
+                    y: gy * cellH + rng() * cellH
+                };
+            }
+        case "clustered":
+            {
+                const numClusters = 3 + Math.floor(rng() * 3);
+                const ci = Math.floor(rng() * numClusters);
+                const clusterRng = (0, $616009579e3d72c5$export$eaf9227667332084)((0, $616009579e3d72c5$export$e9cc707de01b7042)(String(ci), 999));
+                const clx = width * (0.15 + clusterRng() * 0.7);
+                const cly = height * (0.15 + clusterRng() * 0.7);
+                const spread = Math.min(width, height) * 0.18;
+                return {
+                    x: clx + (rng() - 0.5) * spread * 2,
+                    y: cly + (rng() - 0.5) * spread * 2
+                };
+            }
+        case "flow-field":
+        default:
+            return {
+                x: rng() * width,
+                y: rng() * height
+            };
+    }
+}
+// ── Helper: positional color blending ───────────────────────────────
+function $1f63dc64b5593c73$var$getPositionalColor(x, y, width, height, colors, rng) {
+    const nx = x / width;
+    const ny = y / height;
+    const posIndex = (nx * 0.6 + ny * 0.4) * (colors.length - 1);
+    const baseIdx = Math.floor(posIndex) % colors.length;
+    return (0, $b5a262d09b87e373$export$59539d800dbe6858)(colors[baseIdx], rng, 0.08);
+}
+// ── Helper: check if a position is inside a void zone (Feature E) ───
+function $1f63dc64b5593c73$var$isInVoidZone(x, y, voidZones) {
+    for (const zone of voidZones){
+        if (Math.hypot(x - zone.x, y - zone.y) < zone.radius) return true;
+    }
+    return false;
+}
+// ── Helper: density check for negative space (Feature E) ────────────
+function $1f63dc64b5593c73$var$localDensity(x, y, positions, radius) {
+    let count = 0;
+    for (const p of positions)if (Math.hypot(x - p.x, y - p.y) < radius) count++;
+    return count;
+}
 function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
     const finalConfig = {
         ...(0, $81c1b644006d48ec$export$c2f8e0cc249a8d8f),
@@ -1032,61 +1285,240 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
     };
     const { width: width, height: height, gridSize: gridSize, layers: layers, minShapeSize: minShapeSize, maxShapeSize: maxShapeSize, baseOpacity: baseOpacity, opacityReduction: opacityReduction } = finalConfig;
     finalConfig.shapesPerLayer = finalConfig.shapesPerLayer || Math.floor(gridSize * gridSize * 1.5);
-    // --- Color scheme derived from hash ---
     const colorScheme = new (0, $b5a262d09b87e373$export$ab958c550f521376)(gitHash);
     const colors = colorScheme.getColors();
     const [bgStart, bgEnd] = colorScheme.getBackgroundColors();
-    // --- Radial gradient background for depth ---
-    const cx = width / 2;
-    const cy = height / 2;
-    const bgRadius = Math.hypot(cx, cy);
-    const gradient = ctx.createRadialGradient(cx, cy, 0, cx, cy, bgRadius);
-    gradient.addColorStop(0, bgStart);
-    gradient.addColorStop(1, bgEnd);
-    ctx.fillStyle = gradient;
-    ctx.fillRect(0, 0, width, height);
     const shapeNames = Object.keys((0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5));
     const scaleFactor = Math.min(width, height) / 1024;
     const adjustedMinSize = minShapeSize * scaleFactor;
     const adjustedMaxSize = maxShapeSize * scaleFactor;
-    // One master RNG seeded from the full hash — all randomness flows from here
     const rng = (0, $616009579e3d72c5$export$eaf9227667332084)((0, $616009579e3d72c5$export$e9cc707de01b7042)(gitHash));
-    // Track shape positions for organic connecting curves later
+    const cx = width / 2;
+    const cy = height / 2;
+    // ── 1. Background ──────────────────────────────────────────────
+    const bgRadius = Math.hypot(cx, cy);
+    const bgGrad = ctx.createRadialGradient(cx, cy, 0, cx, cy, bgRadius);
+    bgGrad.addColorStop(0, bgStart);
+    bgGrad.addColorStop(1, bgEnd);
+    ctx.fillStyle = bgGrad;
+    ctx.fillRect(0, 0, width, height);
+    // ── 1b. Layered background (Feature G) ─────────────────────────
+    // Draw large, very faint shapes to give the background texture
+    const bgShapeCount = 3 + Math.floor(rng() * 4);
+    ctx.globalCompositeOperation = "soft-light";
+    for(let i = 0; i < bgShapeCount; i++){
+        const bx = rng() * width;
+        const by = rng() * height;
+        const bSize = width * 0.3 + rng() * width * 0.5;
+        const bColor = colors[Math.floor(rng() * colors.length)];
+        ctx.globalAlpha = 0.03 + rng() * 0.05;
+        ctx.fillStyle = (0, $b5a262d09b87e373$export$f2121afcad3d553f)(bColor, 0.15);
+        ctx.beginPath();
+        ctx.arc(bx, by, bSize / 2, 0, Math.PI * 2);
+        ctx.fill();
+    }
+    // Subtle concentric rings from center
+    const ringCount = 2 + Math.floor(rng() * 3);
+    ctx.globalAlpha = 0.02 + rng() * 0.03;
+    ctx.strokeStyle = (0, $b5a262d09b87e373$export$f2121afcad3d553f)(colors[0], 0.1);
+    ctx.lineWidth = 1 * scaleFactor;
+    for(let i = 1; i <= ringCount; i++){
+        const r = Math.min(width, height) * 0.15 * i;
+        ctx.beginPath();
+        ctx.arc(cx, cy, r, 0, Math.PI * 2);
+        ctx.stroke();
+    }
+    ctx.globalCompositeOperation = "source-over";
+    // ── 2. Composition mode ────────────────────────────────────────
+    const compositionMode = $1f63dc64b5593c73$var$COMPOSITION_MODES[Math.floor(rng() * $1f63dc64b5593c73$var$COMPOSITION_MODES.length)];
+    // ── 3. Focal points + void zones ───────────────────────────────
+    const numFocal = 1 + Math.floor(rng() * 2);
+    const focalPoints = [];
+    for(let f = 0; f < numFocal; f++)focalPoints.push({
+        x: width * (0.2 + rng() * 0.6),
+        y: height * (0.2 + rng() * 0.6),
+        strength: 0.3 + rng() * 0.4
+    });
+    // Feature E: 1-2 void zones where shapes are sparse (negative space)
+    const numVoids = Math.floor(rng() * 2) + 1;
+    const voidZones = [];
+    for(let v = 0; v < numVoids; v++)voidZones.push({
+        x: width * (0.15 + rng() * 0.7),
+        y: height * (0.15 + rng() * 0.7),
+        radius: Math.min(width, height) * (0.06 + rng() * 0.1)
+    });
+    function applyFocalBias(rx, ry) {
+        let nearest = focalPoints[0];
+        let minDist = Infinity;
+        for (const fp of focalPoints){
+            const d = Math.hypot(rx - fp.x, ry - fp.y);
+            if (d < minDist) {
+                minDist = d;
+                nearest = fp;
+            }
+        }
+        const pull = nearest.strength * rng() * 0.5;
+        return [
+            rx + (nearest.x - rx) * pull,
+            ry + (nearest.y - ry) * pull
+        ];
+    }
+    // ── 4. Flow field seed values ──────────────────────────────────
+    const fieldAngleBase = rng() * Math.PI * 2;
+    const fieldFreq = 0.5 + rng() * 2;
+    function flowAngle(x, y) {
+        return fieldAngleBase + Math.sin(x / width * fieldFreq * Math.PI * 2) * Math.PI * 0.5 + Math.cos(y / height * fieldFreq * Math.PI * 2) * Math.PI * 0.5;
+    }
+    // ── 5. Shape layers ────────────────────────────────────────────
     const shapePositions = [];
+    const densityCheckRadius = Math.min(width, height) * 0.08;
+    const maxLocalDensity = Math.ceil(finalConfig.shapesPerLayer * 0.15);
     for(let layer = 0; layer < layers; layer++){
+        const layerRatio = layers > 1 ? layer / (layers - 1) : 0;
         const numShapes = finalConfig.shapesPerLayer + Math.floor(rng() * finalConfig.shapesPerLayer * 0.3);
-        // Layer opacity decays gently so all layers remain visible
         const layerOpacity = Math.max(0.15, baseOpacity - layer * opacityReduction);
-        // Later layers use smaller shapes for depth
         const layerSizeScale = 1 - layer * 0.15;
+        // Feature B: per-layer blend mode
+        const layerBlend = (0, $e0f99502ff383dd8$export$7bb7bff4e26fa06b)(rng);
+        ctx.globalCompositeOperation = layerBlend;
+        // Feature C: per-layer render style bias
+        const layerRenderStyle = (0, $e0f99502ff383dd8$export$9fd4e64b2acd410e)(rng);
+        // Feature D: atmospheric desaturation for later layers
+        const atmosphericDesat = layerRatio * 0.3; // 0 for first layer, up to 0.3 for last
         for(let i = 0; i < numShapes; i++){
-            const x = rng() * width;
-            const y = rng() * height;
-            const shapeIdx = Math.floor(rng() * shapeNames.length);
-            const shape = shapeNames[shapeIdx];
-            // Shape size follows a power distribution — many small, few large
+            // Position from composition mode, then focal bias
+            const rawPos = $1f63dc64b5593c73$var$getCompositionPosition(compositionMode, rng, width, height, i, numShapes, cx, cy);
+            const [x, y] = applyFocalBias(rawPos.x, rawPos.y);
+            // Feature E: skip shapes in void zones, reduce in dense areas
+            if ($1f63dc64b5593c73$var$isInVoidZone(x, y, voidZones)) {
+                // 85% chance to skip — allows a few shapes to bleed in
+                if (rng() < 0.85) continue;
+            }
+            if ($1f63dc64b5593c73$var$localDensity(x, y, shapePositions, densityCheckRadius) > maxLocalDensity) {
+                if (rng() < 0.6) continue; // thin out dense areas
+            }
+            // Weighted shape selection
+            const shape = $1f63dc64b5593c73$var$pickShape(rng, layerRatio, shapeNames);
+            // Power distribution for size
             const sizeT = Math.pow(rng(), 1.8);
             const size = (adjustedMinSize + sizeT * (adjustedMaxSize - adjustedMinSize)) * layerSizeScale;
-            const rotation = rng() * 360;
-            const fillColor = colors[Math.floor(rng() * colors.length)];
-            const strokeColor = colors[Math.floor(rng() * colors.length)];
+            // Flow-field rotation in flow-field mode, random otherwise
+            const rotation = compositionMode === "flow-field" ? flowAngle(x, y) * 180 / Math.PI + (rng() - 0.5) * 30 : rng() * 360;
+            // Positional color blending + jitter
+            let fillBase = $1f63dc64b5593c73$var$getPositionalColor(x, y, width, height, colors, rng);
+            const strokeBase = colors[Math.floor(rng() * colors.length)];
+            // Feature D: desaturate colors on later layers for depth
+            if (atmosphericDesat > 0) fillBase = (0, $b5a262d09b87e373$export$fb75607d98509d9)(fillBase, atmosphericDesat);
+            const fillColor = (0, $b5a262d09b87e373$export$59539d800dbe6858)(fillBase, rng, 0.06);
+            const strokeColor = (0, $b5a262d09b87e373$export$59539d800dbe6858)(strokeBase, rng, 0.05);
+            // Semi-transparent fill
+            const fillAlpha = 0.2 + rng() * 0.5;
+            const transparentFill = (0, $b5a262d09b87e373$export$f2121afcad3d553f)(fillColor, fillAlpha);
             const strokeWidth = (0.5 + rng() * 2.0) * scaleFactor;
             ctx.globalAlpha = layerOpacity * (0.5 + rng() * 0.5);
+            // Glow on sacred shapes more often
+            const isSacred = $1f63dc64b5593c73$var$SACRED_SHAPES.includes(shape);
+            const glowChance = isSacred ? 0.45 : 0.2;
+            const hasGlow = rng() < glowChance;
+            const glowRadius = hasGlow ? (8 + rng() * 20) * scaleFactor : 0;
+            // Gradient fill on ~30%
+            const hasGradient = rng() < 0.3;
+            const gradientEnd = hasGradient ? (0, $b5a262d09b87e373$export$59539d800dbe6858)(colors[Math.floor(rng() * colors.length)], rng, 0.1) : undefined;
+            // Feature C: per-shape render style (70% use layer style, 30% pick their own)
+            const shapeRenderStyle = rng() < 0.7 ? layerRenderStyle : (0, $e0f99502ff383dd8$export$9fd4e64b2acd410e)(rng);
+            // Feature F: organic edge jitter — applied via watercolor style on ~15% of shapes
+            const useOrganicEdges = rng() < 0.15 && shapeRenderStyle === "fill-and-stroke";
+            const finalRenderStyle = useOrganicEdges ? "watercolor" : shapeRenderStyle;
             (0, $e0f99502ff383dd8$export$bb35a6995ddbf32d)(ctx, shape, x, y, {
-                fillColor: fillColor,
+                fillColor: transparentFill,
                 strokeColor: strokeColor,
                 strokeWidth: strokeWidth,
                 size: size,
                 rotation: rotation,
-                proportionType: "GOLDEN_RATIO"
+                proportionType: "GOLDEN_RATIO",
+                glowRadius: glowRadius,
+                glowColor: hasGlow ? (0, $b5a262d09b87e373$export$f2121afcad3d553f)(fillColor, 0.6) : undefined,
+                gradientFillEnd: gradientEnd,
+                renderStyle: finalRenderStyle,
+                rng: rng
             });
             shapePositions.push({
                 x: x,
-                y: y
+                y: y,
+                size: size
             });
+            // ── 5b. Recursive nesting ──────────────────────────────────
+            if (size > adjustedMaxSize * 0.4 && rng() < 0.15) {
+                const innerCount = 1 + Math.floor(rng() * 3);
+                for(let n = 0; n < innerCount; n++){
+                    const innerShape = $1f63dc64b5593c73$var$pickShape(rng, Math.min(1, layerRatio + 0.3), shapeNames);
+                    const innerSize = size * (0.15 + rng() * 0.25);
+                    const innerOffX = (rng() - 0.5) * size * 0.4;
+                    const innerOffY = (rng() - 0.5) * size * 0.4;
+                    const innerRot = rng() * 360;
+                    const innerFill = (0, $b5a262d09b87e373$export$f2121afcad3d553f)((0, $b5a262d09b87e373$export$59539d800dbe6858)(colors[Math.floor(rng() * colors.length)], rng, 0.1), 0.3 + rng() * 0.4);
+                    ctx.globalAlpha = layerOpacity * 0.7;
+                    (0, $e0f99502ff383dd8$export$bb35a6995ddbf32d)(ctx, innerShape, x + innerOffX, y + innerOffY, {
+                        fillColor: innerFill,
+                        strokeColor: (0, $b5a262d09b87e373$export$f2121afcad3d553f)(strokeColor, 0.5),
+                        strokeWidth: strokeWidth * 0.6,
+                        size: innerSize,
+                        rotation: innerRot,
+                        proportionType: "GOLDEN_RATIO",
+                        renderStyle: shapeRenderStyle,
+                        rng: rng
+                    });
+                }
+            }
+        }
+    }
+    // Reset blend mode for post-processing passes
+    ctx.globalCompositeOperation = "source-over";
+    // ── 6. Flow-line pass (Feature H: tapered brush strokes) ───────
+    const numFlowLines = 6 + Math.floor(rng() * 10);
+    for(let i = 0; i < numFlowLines; i++){
+        let fx = rng() * width;
+        let fy = rng() * height;
+        const steps = 30 + Math.floor(rng() * 40);
+        const stepLen = (3 + rng() * 5) * scaleFactor;
+        const startWidth = (1 + rng() * 3) * scaleFactor;
+        const lineColor = (0, $b5a262d09b87e373$export$f2121afcad3d553f)(colors[Math.floor(rng() * colors.length)], 0.4);
+        const lineAlpha = 0.06 + rng() * 0.1;
+        // Draw as individual segments with tapering width
+        let prevX = fx;
+        let prevY = fy;
+        for(let s = 0; s < steps; s++){
+            const angle = flowAngle(fx, fy) + (rng() - 0.5) * 0.3;
+            fx += Math.cos(angle) * stepLen;
+            fy += Math.sin(angle) * stepLen;
+            if (fx < 0 || fx > width || fy < 0 || fy > height) break;
+            // Taper: thick at start, thin at end
+            const taper = 1 - s / steps * 0.8;
+            ctx.globalAlpha = lineAlpha * taper;
+            ctx.strokeStyle = lineColor;
+            ctx.lineWidth = startWidth * taper;
+            ctx.lineCap = "round";
+            ctx.beginPath();
+            ctx.moveTo(prevX, prevY);
+            ctx.lineTo(fx, fy);
+            ctx.stroke();
+            prevX = fx;
+            prevY = fy;
         }
     }
-    // --- Organic connecting curves between nearby shapes ---
+    // ── 7. Noise texture overlay ───────────────────────────────────
+    const noiseRng = (0, $616009579e3d72c5$export$eaf9227667332084)((0, $616009579e3d72c5$export$e9cc707de01b7042)(gitHash, 777));
+    const noiseDensity = Math.floor(width * height / 800);
+    for(let i = 0; i < noiseDensity; i++){
+        const nx = noiseRng() * width;
+        const ny = noiseRng() * height;
+        const brightness = noiseRng() > 0.5 ? 255 : 0;
+        const alpha = 0.01 + noiseRng() * 0.03;
+        ctx.globalAlpha = alpha;
+        ctx.fillStyle = `rgba(${brightness},${brightness},${brightness},1)`;
+        ctx.fillRect(nx, ny, 1 * scaleFactor, 1 * scaleFactor);
+    }
+    // ── 8. Organic connecting curves ───────────────────────────────
     if (shapePositions.length > 1) {
         const numCurves = Math.floor(8 * (width * height) / 1048576);
         ctx.lineWidth = 0.8 * scaleFactor;
@@ -1104,8 +1536,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
             const bulge = (rng() - 0.5) * dist * 0.4;
             const cpx = mx + -dy / (dist || 1) * bulge;
             const cpy = my + dx / (dist || 1) * bulge;
-            ctx.globalAlpha = 0.08 + rng() * 0.12;
-            ctx.strokeStyle = colors[Math.floor(rng() * colors.length)];
+            ctx.globalAlpha = 0.06 + rng() * 0.1;
+            ctx.strokeStyle = (0, $b5a262d09b87e373$export$f2121afcad3d553f)(colors[Math.floor(rng() * colors.length)], 0.3);
             ctx.beginPath();
             ctx.moveTo(a.x, a.y);
             ctx.quadraticCurveTo(cpx, cpy, b.x, b.y);