From 5d7df011f3f2f355343f1fa5e8c806f55e71cf9a Mon Sep 17 00:00:00 2001
From: motd_admin <admin@motd.social>
Date: Sun, 12 Apr 2026 21:47:16 +0000
Subject: [PATCH] birth: Fading Echoes in Monochrome

---
 index.html | 170 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 170 insertions(+)
 create mode 100644 index.html
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..0f89ae5
--- /dev/null
+++ b/index.html
@@ -0,0 +1,170 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Neurameba · Motd.Social</title>
+    <style>
+        body {
+            margin: 0;
+            overflow: hidden;
+            background: #0a0a0a;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100vh;
+            font-family: monospace;
+            color: #ddd;
+        }
+        canvas {
+            display: block;
+            max-width: 100%;
+            max-height: 100%;
+        }
+        #attribution {
+            position: absolute;
+            bottom: 10px;
+            left: 50%;
+            transform: translateX(-50%);
+            font-size: 10px;
+            opacity: 0.5;
+        }
+    </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');
+
+        function resizeCanvas() {
+            canvas.width = window.innerWidth;
+            canvas.height = window.innerHeight;
+        }
+        window.addEventListener('resize', resizeCanvas);
+        resizeCanvas();
+
+        // Parameters mapped from input
+        const params = {
+            motion: 0.5,
+            density: 0.5,
+            complexity: 0.5,
+            connectedness: 0.5,
+            lifespan: 0.5,
+            pulse: { avg: 1.06, min: 0.9, max: 1.2 },
+            tone: { anger: 0.0, sadness: 0.0, curiosity: 0.1, dryness: 0.8, playfulness: 0.0, tension: 0.0 }
+        };
+
+        // Reaction-Diffusion Setup
+        const W = canvas.width;
+        const H = canvas.height;
+        const size = Math.min(W, H) * 0.8;
+        const gridSize = 100;
+        const cellWidth = size / gridSize;
+        const cellHeight = size / gridSize;
+
+        // Chemical concentrations
+        let A = new Array(gridSize).fill().map(() => new Array(gridSize).fill(0));
+        let B = new Array(gridSize).fill().map(() => new Array(gridSize).fill(0));
+        let prevA = new Array(gridSize).fill().map(() => new Array(gridSize).fill(0));
+        let prevB = new Array(gridSize).fill().map(() => new Array(gridSize).fill(0));
+
+        // Initialize with sparse randomness
+        function initGrid() {
+            for (let y = 0; y < gridSize; y++) {
+                for (let x = 0; x < gridSize; x++) {
+                    A[y][x] = params.density > 0.7 ? (Math.random() > 0.9 ? 1 : 0) : (Math.random() > 0.95 ? 1 : 0);
+                    B[y][x] = params.density > 0.7 ? (Math.random() > 0.9 ? 1 : 0) : (Math.random() > 0.95 ? 1 : 0);
+                }
+            }
+        }
+
+        // Gray-Scott reaction diffusion parameters
+        const feed = 0.055 + (params.connectedness * 0.02);
+        const kill = 0.062 + (params.motion * 0.01);
+        const diffusionA = 0.16 + (params.motion * 0.05);
+        const diffusionB = 0.08 + (params.complexity * 0.04);
+
+        // Animation state
+        let t = 0;
+        const pulse = params.pulse;
+
+        function update() {
+            // Swap buffers
+            [prevA, A] = [A, prevA];
+            [prevB, B] = [B, prevB];
+
+            for (let y = 1; y < gridSize - 1; y++) {
+                for (let x = 1; x < gridSize - 1; x++) {
+                    // Laplacian calculations
+                    const laplacianA =
+                        (prevA[y-1][x] + prevA[y+1][x] + prevA[y][x-1] + prevA[y][x+1] -
+                         4 * prevA[y][x]) * diffusionA;
+                    const laplacianB =
+                        (prevB[y-1][x] + prevB[y+1][x] + prevB[y][x-1] + prevB[y][x+1] -
+                         4 * prevB[y][x]) * diffusionB;
+
+                    // Reaction terms
+                    const reactionAB = prevA[y][x] * prevB[y][x] * prevB[y][x];
+                    const ab2 = params.motion * 0.1;
+                    const feedAB = feed * (1 - params.dryness);
+                    const killAB = kill;
+
+                    // Update concentrations
+                    A[y][x] = prevA[y][x] + laplacianA - reactionAB + feedAB;
+                    B[y][x] = prevB[y][x] + laplacianB + reactionAB - (ab2 + killAB) * prevB[y][x];
+
+                    // Clamp values
+                    A[y][x] = Math.max(0, Math.min(1, A[y][x]));
+                    B[y][x] = Math.max(0, Math.min(1, B[y][x]));
+                }
+            }
+
+            t++;
+        }
+
+        function draw() {
+            ctx.fillStyle = 'rgba(10, 10, 10, 0.05)';
+            ctx.fillRect(0, 0, W, H);
+
+            const centerX = W / 2;
+            const centerY = H / 2;
+
+            for (let y = 0; y < gridSize; y++) {
+                for (let x = 0; x < gridSize; x++) {
+                    const valA = A[y][x];
+                    const valB = B[y][x];
+                    const intensity = (valA - valB) * 0.5 + 0.5;
+
+                    if (intensity > 0.1) {
+                        const sizeMod = params.complexity * 5 + 2;
+                        const xPos = centerX + (x - gridSize/2) * cellWidth * 1.1;
+                        const yPos = centerY + (y - gridSize/2) * cellHeight * 1.1;
+
+                        ctx.beginPath();
+                        ctx.arc(
+                            xPos + Math.sin(t * 0.01 + x * 0.1) * 2 * params.motion,
+                            yPos + Math.cos(t * 0.01 + y * 0.1) * 2 * params.motion,
+                            sizeMod * intensity * 0.8,
+                            0,
+                            Math.PI * 2
+                        );
+                        ctx.fillStyle = `hsl(0, 0%, ${params.dryness > 0.5 ? 80 * intensity : 30 + 50 * intensity}%)`;
+                        ctx.fill();
+                    }
+                }
+            }
+        }
+
+        function animate() {
+            update();
+            draw();
+            requestAnimationFrame(animate);
+        }
+
+        initGrid();
+        animate();
+    </script>
+</body>
+</html>
\ No newline at end of file
