From e9abe4b036dcd25b2f13a7843d481f183d8df6c1 Mon Sep 17 00:00:00 2001
From: motd_admin <admin@motd.social>
Date: Wed, 5 Aug 2026 18:21:27 +0000
Subject: [PATCH] birth: Flowing Tendrils in Veins

---
 index.html | 224 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 224 insertions(+)
 create mode 100644 index.html
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..d0e1ff7
--- /dev/null
+++ b/index.html
@@ -0,0 +1,224 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Flow Field Tendrils</title>
+    <style>
+        body {
+            margin: 0;
+            overflow: hidden;
+            background: #0a0a0a;
+            font-family: monospace;
+            color: #4a4a4a;
+        }
+        #canvas {
+            display: block;
+        }
+        #attribution {
+            position: absolute;
+            bottom: 20px;
+            right: 20px;
+            font-size: 10px;
+            color: #666;
+            text-align: right;
+        }
+    </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;
+        }
+
+        resizeCanvas();
+        window.addEventListener('resize', resizeCanvas);
+
+        // Flow field parameters
+        const cols = Math.floor(canvas.width / 20);
+        const rows = Math.floor(canvas.height / 20);
+        const field = [];
+        const particles = [];
+        const maxParticles = Math.floor(1000 * (0.5 + 0.5 * 0.5)); // Density * motion adjustment
+
+        // Initialize flow field
+        function initField() {
+            for (let i = 0; i < cols; i++) {
+                field[i] = [];
+                for (let j = 0; j < rows; j++) {
+                    const angle = Math.random() * Math.PI * 2;
+                    const strength = 0.5 + Math.random() * 0.5; // Some variation in flow
+                    field[i][j] = {
+                        x: i,
+                        y: j,
+                        angle: angle,
+                        strength: strength,
+                        targetAngle: angle,
+                        speed: 0.01 + Math.random() * 0.02
+                    };
+                }
+            }
+        }
+
+        // Initialize particles
+        function initParticles() {
+            for (let i = 0; i < maxParticles; i++) {
+                particles.push({
+                    x: Math.random() * canvas.width,
+                    y: Math.random() * canvas.height,
+                    size: 1 + Math.random() * 2,
+                    speed: 0.2 + Math.random() * 0.3,
+                    lifespan: 100 + Math.random() * 200,
+                    life: 0,
+                    trail: [],
+                    color: `rgba(${180 + Math.floor(Math.random() * 75)}, ${180 + Math.floor(Math.random() * 75)}, ${180 + Math.floor(Math.random() * 75)}, 0.7)`
+                });
+            }
+        }
+
+        // Update flow field angles for organic motion
+        function updateField() {
+            for (let i = 0; i < cols; i++) {
+                for (let j = 0; j < rows; j++) {
+                    const cell = field[i][j];
+
+                    // Organic angle oscillation based on motion parameter
+                    cell.targetAngle += (Math.random() - 0.5) * 0.1 * (0.5 + 0.5 * 0.5);
+                    cell.targetAngle = (cell.targetAngle + Math.PI * 2) % (Math.PI * 2);
+
+                    // Smooth interpolation toward target
+                    cell.angle += (cell.targetAngle - cell.angle) * 0.05 * (0.5 + 0.5 * 0.5);
+
+                    // Add some local variation
+                    const neighbors = [];
+                    if (i > 0) neighbors.push(field[i-1][j]);
+                    if (i < cols-1) neighbors.push(field[i+1][j]);
+                    if (j > 0) neighbors.push(field[i][j-1]);
+                    if (j < rows-1) neighbors.push(field[i][j+1]);
+
+                    if (neighbors.length > 0) {
+                        const avgAngle = neighbors.reduce((sum, n) => sum + n.angle, 0) / neighbors.length;
+                        cell.targetAngle = (cell.targetAngle * 3 + avgAngle) / 4;
+                    }
+                }
+            }
+        }
+
+        // Update particles
+        function updateParticles() {
+            particles.forEach(particle => {
+                // Find nearest field cell
+                const cellX = Math.floor(particle.x / (canvas.width / cols));
+                const cellY = Math.floor(particle.y / (canvas.height / rows));
+                const cell = field[Math.max(0, Math.min(cols-1, cellX))][Math.max(0, Math.min(rows-1, cellY))];
+
+                // Move toward flow direction
+                const angle = cell.angle;
+                particle.x += Math.cos(angle) * particle.speed * (0.5 + 0.5 * 1.06); // Using pulse average
+                particle.y += Math.sin(angle) * particle.speed * (0.5 + 0.5 * 1.06);
+
+                // Add some randomness based on motion
+                if (Math.random() < 0.1 * (0.5 + 0.5 * 0.5)) {
+                    particle.x += (Math.random() - 0.5) * 5;
+                    particle.y += (Math.random() - 0.5) * 5;
+                }
+
+                // Wrap around edges
+                if (particle.x < 0) particle.x = canvas.width;
+                if (particle.x > canvas.width) particle.x = 0;
+                if (particle.y < 0) particle.y = canvas.height;
+                if (particle.y > canvas.height) particle.y = 0;
+
+                // Add to trail
+                particle.trail.push({x: particle.x, y: particle.y});
+                if (particle.trail.length > 20) {
+                    particle.trail.shift();
+                }
+
+                particle.life += 1;
+                particle.size = 1 + 1 * (particle.life / particle.lifespan);
+            });
+
+            // Occasionally add new particles
+            if (Math.random() < 0.02 * (0.5 + 0.5 * 0.5)) {
+                particles.push({
+                    x: Math.random() * canvas.width,
+                    y: Math.random() * canvas.height,
+                    size: 1 + Math.random() * 2,
+                    speed: 0.2 + Math.random() * 0.3,
+                    lifespan: 100 + Math.random() * 200,
+                    life: 0,
+                    trail: [],
+                    color: `rgba(${180 + Math.floor(Math.random() * 75)}, ${180 + Math.floor(Math.random() * 75)}, ${180 + Math.floor(Math.random() * 75)}, 0.7)`
+                });
+            }
+        }
+
+        // Draw
+        function draw() {
+            // Fade background slightly for trails
+            ctx.fillStyle = 'rgba(10, 10, 10, 0.05)';
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+            // Draw particles with trails
+            particles.forEach(particle => {
+                ctx.strokeStyle = particle.color;
+                ctx.lineWidth = 0.5;
+
+                if (particle.trail.length > 1) {
+                    ctx.beginPath();
+                    ctx.moveTo(particle.trail[0].x, particle.trail[0].y);
+                    for (let i = 1; i < particle.trail.length; i++) {
+                        const pos = particle.trail[i];
+                        const nextPos = particle.trail[i+1] || {x: particle.x, y: particle.y};
+                        const dist = Math.sqrt((nextPos.x - pos.x)**2 + (nextPos.y - pos.y)**2);
+
+                        if (dist > 1) {
+                            ctx.moveTo(pos.x, pos.y);
+                            ctx.lineTo(nextPos.x, nextPos.y);
+                        }
+                    }
+                    ctx.stroke();
+                }
+            });
+
+            // Draw some field vectors when motion is high
+            if (0.5 > 0.3) {
+                ctx.strokeStyle = 'rgba(100, 100, 100, 0.3)';
+                ctx.lineWidth = 1;
+
+                for (let i = 0; i < cols; i += 5) {
+                    for (let j = 0; j < rows; j += 5) {
+                        const cell = field[i][j];
+                        const x = i * (canvas.width / cols) + (canvas.width / cols)/2;
+                        const y = j * (canvas.height / rows) + (canvas.height / rows)/2;
+                        const len = 10 * cell.strength;
+
+                        ctx.beginPath();
+                        ctx.moveTo(x, y);
+                        ctx.lineTo(x + Math.cos(cell.angle) * len, y + Math.sin(cell.angle) * len);
+                        ctx.stroke();
+                    }
+                }
+            }
+        }
+
+        function animate() {
+            updateField();
+            updateParticles();
+            draw();
+            requestAnimationFrame(animate);
+        }
+
+        initField();
+        initParticles();
+        animate();
+    </script>
+</body>
+</html>
\ No newline at end of file
