TITLE: TYPE RUNNER
PROMPT: Design 'TYPE RUNNER', a brutalist typing arcade: a stark slab layout (bone white, ink black, signal red, heavy 4px rules, marching labels) where words stream in a huge condensed stack and you destroy them by typing — each correct letter stamps over the word like a punch, completed words shatter into falling glyph debris with screen kick. A 30-second dash scores WPM, accuracy, and best streak on a flip-up card; mistyped letters flash the border and shake. Interactions: pure keyboard (plus on-screen for touch), Enter restarts, difficulty chips change word font size/speed, a live tape of last five words runs at the footer. Aggressive, rhythmic, weirdly elegant.
DESCRIPTION: A bone-white slab under heavy 4px ink rules with marching typographic labels scrolling the top and bottom edges. Huge condensed uppercase words stream upward in a column stack; typed letters stamp over each word in signal red with a per-letter punch click, and completed words shatter into individual falling glyphs — every character spins off as physics debris with a randomized red/ink color — while the main panel kicks downward. Mistypes flash a red inset border and shake the slab. A 30-second dash ends in a flip-up result card scoring WPM, accuracy, and best streak with a taunt graded to performance. The footer runs a live tape of the last five destroyed words.
TECHNIQUES: Strict three-color brutalist system with 4px borders, hard offset box-shadows, and CSS keyframe marching-label marquees (duplicated content translated -50% for seamless loop); column-reverse word stack so newest words rise from the bottom; per-letter typewriter state machine tracking typed prefix; Web Animations API glyph debris with randomized cubic-bezier trajectories, rotations and fill:forwards cleanup; screen kick and step-timed border flash on error; aria-pressed difficulty chips altering font size and spawn interval; coarse-pointer media query reveals a generated on-screen QWERTY row; WebAudio square/saw punch, kill and error tones (gesture-gated, mutable with Space); prefers-reduced-motion swaps debris for instant removal.
INTERACTION: Press the start button or Enter to begin a 30-second dash. Type letters to punch through the bottom-most word; finish it to shatter it into debris. Mistypes flash the border red and shake the frame. Difficulty chips (slow / standard / brutal) change word size and rise rate at any time. Enter restarts instantly; Space toggles sound. On touch devices an on-screen letter row plays the same way. The footer tape logs the last five destroyed words.