Build a complete, polished single-file HTML/CSS/JavaScript desktop-and-mobile interface for Daybreak FM, a fictional radio player for designers at work. This is a design evaluation fixture, not a real station; mark the interface "Interactive demo ยท no audio". Make it outstanding and distinctive in the supplied aesthetic family.
Required content:
Brand: Daybreak FM. Tagline: A little company for the workday.
Six tracks (title / artist / genre / duration):
Morning Window / Soft Signal / Ambient / 4:32
Paper Planes / Studio North / Beats / 3:18
Slow Current / Still Life / Ambient / 5:06
Side Street / Common Ground / Beats / 2:54
Blue Hour / Soft Signal / Ambient / 4:11
Almost Friday / Studio North / Beats / 3:42
Required interactions: the first track starts selected and paused. A button named Play changes to Pause and toggles the visual playback state (no real audio). Selecting a track updates the current title and artist. All, Ambient, and Beats buttons filter the six-track list without clearing the current selection. A native range input labelled Volume changes a displayed percentage. Keep controls reachable by keyboard with visible focus. Give the current title a data-testid="current-track", the track-list rows data-testid="track-row", and the volume percentage data-testid="volume-value" so the behavior can be verified.
You have no browser or filesystem tools in this generation call. Work from supplied notes; do not claim to have opened references or verified a render. You may use inline CSS, JS, SVG for functional visual elements, and system font stacks only. Do not fetch external fonts, images, libraries, audio, or network resources. The content and interactive player are the design material. Do not substitute decorative dashboard cards for the actual player and track list. Avoid invented listeners, reviews, or metrics.
Output ONLY the complete HTML document, including , all styles and scripts, and a closing