Quran Stream TV

Show the display live, changing as a design is picked

The grid showed thirty swatches but not what any of them looked like on a
screen. Above it now sits the app's own display: the Kaaba background
running, the four panels at the positions LAYOUT gives them, and the
opening of al-Fatihah with one word carrying the highlight. Clicking a
design repaints it.

The data is generated from src/design/presets.ts by extract.mjs rather
than transcribed, so the site cannot quietly drift from the app. Panel
fill, gradient angle, border width and style, corner radius and all four
text colours are the real ones.

Panel opacity goes into the fill colour, not onto the element: the app
draws a translucent plate under opaque text, and setting opacity on the
box would have faded the scripture with it.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>