TITLE: Circuit Garden — A Generative PCB Vinery

PROMPT: Build a single self-contained HTML page: a full-bleed generative circuit board rendered on a DPR-scaled canvas (canvas.width = cssW * devicePixelRatio, ctx.setTransform(dpr,0,0,dpr,0,0) before every draw pass). Substrate is a linear gradient from #0c4531 through #0a3d2c to #072a1e with a 20-unit world grid drawn at 4.5% silk-green alpha, stronger every 100 units, plus a silk-screen registration cross at world origin — this whole static layer is cached into an offscreen canvas and only re-rendered when the view transform or size changes, then blitted with an identity transform. Traces are grown by a branching random walk on an 8-way lattice with a 10-unit cell: each branch steps 26-72 cells with a 58% chance to continue straight, 26% to turn 45 degrees, 11% to turn 90 degrees and 5% to turn 135, turning when blocked and stopping at the world bound of ±560; occupied cells are tracked in a plain-object set so traces never cross. Growth is round-robin over a pending-branch queue at 26 points/second, guarded at 60 steps per frame. Each completed trace drills a via, spawns up to two depth-2 child branches from a random mid-point, may blossom into a component pad (silk outline, dark body, four copper pads, a blinking LED in #ff5c39 and a 6px ui-monospace silk label), and starts a looping energy pulse. Traces are stroked as quadratic curves through segment midpoints (round cap/join) in rgba(201,162,39,.86) with a thin rgba(245,224,150,.28) inner highlight so the copper reads as raised; the hovered trace switches to #eafff5 with a wide soft under-glow and its via enlarges. Pulses are short bright segments walked along a precomputed cumulative-length polyline, drawn twice (wide silk glow then a near-white core) with a head dot. Occasional solder flashes expand and fade. A 96px procedural solder-mask speckle pattern and a cached radial vignette are composited over everything. HUD is a dark legend card upper-left with mono rows for traces / vias / pulses, a GROW THE BOARD button, a hover readout, a bottom-right plate stamp and bottom-centre key hints. Palette: pcb #0a3d2c, copper #c9a227, silk #9be8c0, substrate #1c1c1c, led #ff5c39. All CSS in one inline style, all JS in one IIFE at the end of body, no external assets.

DESCRIPTION: A living printed circuit board. Copper vines branch out from seed points like ivy over a green solder mask, refusing to cross each other, drilling a via wherever they stop and occasionally budding into a component with a blinking status LED. Once a trace is complete, light starts running along it — a bright bead with a soft silk halo that loops the whole path forever. The board keeps growing on its own, and you can take over: plant a seed with a click, drag the board around, zoom in until you can read the silk labels, or push the GROW button to hurry the vinery along. Hovering any trace isolates it in near-white and reports its length and state in the legend.

TECHNIQUES: seeded mulberry32 RNG so every reload builds the same board; branching random walk with directional bias, collision-aware occupancy set and 45/90/135-degree turn logic; round-robin growth queue with a per-second growth accumulator; offscreen-cached static layer (substrate + world grid + registration cross) invalidated only on transform/size change; quadratic-curve trace smoothing through midpoints; double-stroke copper with an inner highlight for a raised, plated look; arc-length parameterisation (binary search over a cumulative-length array) for pulse positions; procedural solder-mask speckle pattern built once into a 96px canvas; cached radial vignette; LED and pulse motion driven by wall-clock time; hover hit-testing by point-to-polyline distance with a scale-aware tolerance; DPR-correct canvas sizing at boot and on resize with view re-centring.

INTERACTION: Clicking an empty spot plants a new seed and grows a fresh branching trace from it. Hovering a trace (within 9 screen pixels) highlights it in near-white, widens its via and reports its index, length and growth state in the legend readout. Dragging pans the board (a 4px threshold distinguishes a drag from a click); the wheel zooms from 0.3x to 4x around the pointer; + and - zoom around the centre. GROW THE BOARD advances 70 growth steps immediately, or plants a seed near the centre when nothing is pending. Stats for traces, vias and pulses refresh every 900ms and after every interaction. Under prefers-reduced-motion the simulation pauses, growth stops, LEDs hold a steady brightness and pulses freeze, so the board renders as a static finished plate.