From 2e55dd6a444653b73bef7a4f7be34c946c8b5f64 Mon Sep 17 00:00:00 2001
From: motd_admin <admin@motd.social>
Date: Sat, 28 Mar 2026 09:47:17 +0000
Subject: [PATCH] birth: Fractal Bloom in Deep Space

---
 index.html | 218 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 218 insertions(+)
 create mode 100644 index.html
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..0ac0f59
--- /dev/null
+++ b/index.html
@@ -0,0 +1,218 @@
+```html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Fractal Bloom</title>
+    <style>
+        body {
+            margin: 0;
+            overflow: hidden;
+            background: #0a0a1a;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100vh;
+            font-family: 'Courier New', monospace;
+        }
+        canvas {
+            display: block;
+        }
+        #attribution {
+            position: absolute;
+            bottom: 20px;
+            color: rgba(255, 255, 255, 0.3);
+            font-size: 12px;
+            text-align: center;
+            width: 100%;
+        }
+    </style>
+</head>
+<body>
+    <canvas id="canvas"></canvas>
+    <div id="attribution">neurameba · motd.social</div>
+    <script>
+        const canvas = document.getElementById('canvas');
+        const ctx = canvas.getContext('2d');
+
+        // Set canvas to full window size
+        function resizeCanvas() {
+            canvas.width = window.innerWidth;
+            canvas.height = window.innerHeight;
+        }
+        window.addEventListener('resize', resizeCanvas);
+        resizeCanvas();
+
+        // Parameters derived from input
+        const params = {
+            motion: 0.554,
+            density: 0.530,
+            complexity: 0.489,
+            connectedness: 0.552,
+            lifespan: 0.526,
+            pulse: { avg: 0.80, min: 0.30, max: 2.00 },
+            tone: {
+                anger: 0.00,
+                sadness: 0.00,
+                curiosity: 0.80,
+                dryness: 0.90,
+                playfulness: 0.10,
+                tension: 0.00
+            },
+            topology: {
+                survivingNodes: 82,
+                branchCount: 56,
+                loops: 179,
+                maxDepth: 18,
+                thicknessRatio: 1.50,
+                fractalDimension: 1.632,
+                finalEnergy: 404.0
+            }
+        };
+
+        // Fractal system
+        const fractals = [];
+        const maxDepth = Math.floor(params.topology.maxDepth * 2);
+        const branches = Math.max(3, Math.floor(params.topology.branchCount * 2));
+        const branchesPerLevel = Math.max(2, Math.floor(branches / (maxDepth / 2)));
+
+        // Color palette based on tone
+        const hue = 160; // teal for curiosity
+        const saturation = 30 + Math.floor(params.tone.curiosity * 60);
+        const brightness = 80;
+        const baseColor = `hsl(${hue}, ${saturation}%, ${brightness}%)`;
+        const secondaryColor = `hsl(${hue}, ${Math.min(90, saturation + 20)}%, ${Math.min(95, brightness + 15)}%)`;
+
+        class FractalBranch {
+            constructor(x, y, angle, depth, length, width, parent = null) {
+                this.x = x;
+                this.y = y;
+                this.angle = angle;
+                this.depth = depth;
+                this.length = length;
+                this.width = width * (0.7 + 0.3 * (1 - params.tone.dryness));
+                this.parent = parent;
+                this.children = [];
+                this.lifespan = params.lifespan * 1000 * (0.5 + Math.random() * 0.5);
+                this.age = 0;
+                this.energy = params.topology.finalEnergy / 100;
+                this.pulse = params.pulse.avg;
+
+                // Randomize some parameters for organic feel
+                this.randomness = (Math.random() - 0.5) * 0.3 * params.motion;
+                this.branchiness = 1 + (Math.random() - 0.5) * 0.4 * params.connectedness;
+
+                // Create children if not at max depth
+                if (depth < maxDepth) {
+                    const numChildren = Math.floor(branchesPerLevel * this.branchiness);
+                    for (let i = 0; i < numChildren; i++) {
+                        const childAngle = angle + (Math.random() - 0.5) * Math.PI * 0.5 * params.motion;
+                        const childLength = length * (0.6 + 0.3 * (1 - params.density)) * this.pulse;
+                        const childWidth = width * (0.5 + 0.3 * params.connectedness);
+                        const child = new FractalBranch(
+                            x + Math.cos(childAngle) * childLength,
+                            y + Math.sin(childAngle) * childLength,
+                            childAngle + this.randomness,
+                            depth + 1,
+                            childLength,
+                            childWidth,
+                            this
+                        );
+                        this.children.push(child);
+                        fractals.push(child);
+                    }
+                }
+            }
+
+            update() {
+                this.age += 16; // ~60fps
+                this.pulse = params.pulse.avg + (Math.sin(Date.now() * 0.001) * 0.5 * (params.pulse.max - params.pulse.min));
+
+                // Fade out if lifespan is low
+                if (params.lifespan < 0.5) {
+                    this.energy *= 0.995;
+                }
+
+                // Update children
+                this.children.forEach(child => child.update());
+            }
+
+            draw() {
+                ctx.strokeStyle = `hsla(${hue}, ${saturation}%, ${brightness}%, ${this.energy})`;
+                ctx.lineWidth = this.width * (0.5 + 0.5 * this.pulse);
+                ctx.lineCap = 'round';
+
+                ctx.beginPath();
+                ctx.moveTo(this.x, this.y);
+
+                // Calculate end point with pulse and randomness
+                const endX = this.x + Math.cos(this.angle + this.randomness) * this.length * this.pulse;
+                const endY = this.y + Math.sin(this.angle + this.randomness) * this.length * this.pulse;
+
+                ctx.lineTo(endX, endY);
+                ctx.stroke();
+
+                // Draw children
+                this.children.forEach(child => child.draw());
+            }
+        }
+
+        // Initialize fractals
+        const centerX = canvas.width / 2;
+        const centerY = canvas.height / 2;
+        const initialLength = Math.min(canvas.width, canvas.height) * 0.2 * params.density;
+
+        for (let i = 0; i < params.topology.survivingNodes; i++) {
+            const angle = (i / params.topology.survivingNodes) * Math.PI * 2;
+            fractals.push(new FractalBranch(
+                centerX,
+                centerY,
+                angle,
+                0,
+                initialLength,
+                2 + params.topology.thicknessRatio * 3,
+                null
+            ));
+        }
+
+        // Animation loop
+        function animate() {
+            // Fade background slightly
+            ctx.fillStyle = 'rgba(10, 10, 26, 0.05)';
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+            // Update and draw all fractals
+            fractals.forEach(fractal => {
+                fractal.update();
+                fractal.draw();
+
+                // Remove dead branches if lifespan is low
+                if (fractal.age > fractal.lifespan && params.lifespan < 0.5) {
+                    const index = fractals.indexOf(fractal);
+                    if (index > -1) fractals.splice(index, 1);
+                }
+            });
+
+            // Occasionally add new branches for organic growth
+            if (Math.random() < 0.02 * params.connectedness * params.motion) {
+                const angle = Math.random() * Math.PI * 2;
+                fractals.push(new FractalBranch(
+                    centerX,
+                    centerY,
+                    angle,
+                    0,
+                    initialLength * (0.7 + 0.3 * Math.random()),
+                    1 + params.topology.thicknessRatio * 2,
+                    null
+                ));
+            }
+
+            requestAnimationFrame(animate);
+        }
+
+        animate();
+    </script>
+</body>
+</html>
+```
\ No newline at end of file
