TITLE: Market Pulse — Synthetic Tape
PROMPT: Build a single self-contained HTML page that is a live data-art trading dashboard for twelve fictional tickers, with all data generated in-page by a seeded random walk and zero network access. Layout: a full-viewport dark terminal grid (background #0a0f14) with five rows — header, scrolling ticker tape, main dashboard, watchlist strip, footer. Header: "Market Pulse" set in Georgia italic with the word "Pulse" in amber #eab308, a monospace uppercase subtitle, a pulsing green LIVE dot, a 1x/2x/4x/8x timeframe button group, a Pause/Resume button, an amber speed slider (2–26 ticks per second) and a live tabular-nums clock. Ticker tape: a duplicate-pair marquee translating -50% over 38s, each entry a monospace symbol, last price and a green/red percentage. Main grid: left a chart panel with a canvas candlestick chart (56px right axis, four gridlines, price labels, per-candle volume histogram in the lower 16%, an amber dashed last-price line, crosshair on hover, candle bodies at least 3px tall with wicks) plus a 52–86px momentum strip canvas showing a 150-tick area+line with a head dot; right a heatmap panel of twelve buttons whose background colour is interpolated from #131c26 through green #22c55e or red #ef4444 by percentage change, four stat tiles (session high, session low, ticks, volatility) and a breadth counter. Bottom: a horizontal watchlist of twelve clickable cards with symbol, last, signed change and a scaleX magnitude bar. Palette #0a0f14 background, #22c55e up, #ef4444 down, #eab308 amber, #94a3b8 grid grey. Interaction: hover a candle for an OHLC tooltip and crosshair; click any watchlist card or heatmap cell to focus that symbol; Pause freezes the tape; the slider sets tick rate; keys 1–4 change the candle aggregation (3/6/12/24 ticks per candle) and space toggles the tape. Dirty-gated rAF: the canvas only redraws when data or hover changes.
DESCRIPTION: A terminal-grade market monitor where every number is invented but the behaviour is real: a seeded random walk with slowly rotating drift and mean-reverting volatility drives twelve series that grow tick by tick. The chart aggregates ticks into real candlesticks, the heatmap breathes between red and green as breadth shifts, the momentum strip redraws with each tick and the tape scrolls continuously underneath a live clock. Nothing is fetched; the whole market lives in the page.
TECHNIQUES: mulberry32 seeded PRNG with per-symbol seeds; random walk with mean-reverting volatility and regime drift; tick-to-OHLC aggregation with right-aligned layout; DPR-scaled canvas with ctx.setTransform and ResizeObserver refit; dirty-gated rAF loop (idle = no canvas writes); interpolated RGB heatmap colouring; marquee built from duplicated nodes and updated by textContent so the animation never restarts; tabular-nums monospace typography; CSS-only range slider.
INTERACTION: Hovering the chart draws a dashed crosshair and shows an OHLC tooltip that flips sides near the right edge; clicking a heatmap cell or watchlist card focuses that symbol in the chart, the momentum strip and the header; Pause/Resume stops or restarts the simulated tape and switches the LIVE badge to HELD; the speed slider sets ticks per second from 2 to 26; keys 1, 2, 4 and 8 switch the candle aggregation and space toggles playback; reduced motion only slows the ticker marquee and stops the LIVE pulse.