TITLE Side A — A Turntable in CSS PROMPT A CSS-only (no JavaScript, no SVG images; shapes made from HTML elements, gradients, borders, transforms, clip-path and masks) illustration of a 1970s walnut hi-fi turntable seen from above at a slight angle (a real 3-D transform with mild perspective), which actually operates: the viewer can start the platter, cue the tonearm and change speed using only styled checkbox/radio inputs and labels. Concept: an object so carefully drawn in CSS that people inspect the source. Mood: warm, nostalgic, Sunday afternoon. Palette: walnut #5A3A22 (with lighter grain streaks #7A5232 and dark #3E2716), cream #E8DCC4 for the deck plate and page, burnt orange #E2711D for the record label and one accent, soft black #1A1A1A for vinyl and rubber, sage-grey #9FB3A8 for the dust-cover tint and secondary shapes; brushed aluminium built from conic and repeating gradients. Warm light page: the page background is cream with a large orange quarter-circle (with concentric rings) in the top-right corner and sage stripes in the 70s supergraphic manner that run under the hi-fi like a shelf and turn upward through a rounded corner on wide screens. The object: a plinth with wood grain (layered repeating-linear and repeating-radial gradients plus subtle noise from gradients) and a visible front face with a maker's badge, a cream top plate with corner screws, a platter with two rows of strobe dots around its rim, a rubber mat, a 12-inch record with fine grooves (repeating-radial-gradient), track gaps and a rotating wedge of light reflection (conic-gradient highlights) so the spin is visible, an orange centre label whose tiny text ("SIDE A · 33⅓ · MARGUERITE OKONKWO QUINTET · SLOW WEATHER") is set letter by letter around the rim and rotates with the disc, a spindle; a straight tonearm with counterweight, pivot gimbal, angled headshell, finger lift and sage cartridge, plus an arm rest; a cue lever; a speed selector (33 / 45) as radio buttons styled as a rocker; a start/stop control as a chunky square button with an orange pilot lamp; a strobe lamp housing that glows onto the rim; a 45 adaptor in a well; four rubber feet; a hinged smoked dust cover standing open at the back, built from four 3-D faces. Operation (signature moment), all via the :checked state of inputs placed first in the document and general-sibling selectors (so nothing depends on :has(); :has() is used only for one enhancement, bars of afternoon window light that fade across the page while a record is on): pressing start lights the pilot lamp and strobe, the platter spins up over about 2.4 s into a steady linear rotation (1.8 s per revolution for 33, 1.333 s for 45; the spin-up and run-down are a decelerating counter-rotation on a wrapper so there is never a jump in angle), then the tonearm lifts (small scale and shadow change), swings over the lead-in groove with a custom cubic-bezier, lowers, and slowly tracks inward across the record over four minutes while "sound" appears visually: a pair of VU meters on a slim brushed-aluminium amplifier under the turntable begin to dance (two different keyframe programmes) and thin concentric arcs pulse gently from two small walnut speakers flanking the composition. Pressing stop lifts the arm, returns it to its rest, lowers it, and the platter runs down with ease-out. The cue lever (checkbox) lifts the arm mid-record, parks it exactly where it is, drops the VU needles to rest and silences the arcs; lowering it resumes. The speed switch changes rotation rate without a jump and swaps which strobe row stands still and which drifts. Details: hover (or press) the record to see the room's reflection slide round; hover the dust cover, or click/tap it to latch, and it opens further; hover the 45 adaptor and the amplifier knobs; a record sleeve leans at the left with a designed cover (abstract orange/sage/black shapes and the album title in a fat 70s serif: Cooper Black falling back to Georgia bold italic with tight tracking), an inner sleeve that slides out on hover, and a track list of invented tunes with durations (Side A on the wide layout; Sides A and B plus personnel on the stacked layout). Liner copy in small type on the cream page: two sentences about the album in an authentic sleeve-note voice. A numbered "To play" list and a short specification list act as catalogue annotations and interaction hints; a one-line colophon closes the page. Typography: fat, tight, rounded-serif display for "Side A" (Cooper Black/Georgia bold italic) with stacked orange and sage offset shadows, small tracked sans caps for hardware legends (START · STOP · CUE · SPEED · STROBE · 33 · 45). Responsive: the whole hi-fi is drawn in em units driven by one viewport-derived unit, a catalogue spread on wide screens and a single stacked column down to 360px without overflow; controls keep roughly 40px touch targets through enlarged invisible hit areas. All inputs keyboard-focusable with visible orange focus rings on their labels. Reduced motion: platter turns very slowly, meters hold still, arm changes position without sweeping, speaker arcs are static. DESCRIPTION A catalogue-style spread for an invented 1974 turntable, the Marlowe PL·7, playing an invented jazz LP, "Slow Weather" by the Marguerite Okonkwo Quintet. A walnut plinth with a cream deck plate sits tilted in real perspective under a translucent sage dust cover, in front of a burnt-orange supergraphic sun and sage shelf stripes; a fat italic "Side A" headline, a sleeve note, a leaning record sleeve and a track list sit to the left, and a brushed-aluminium amplifier with two VU meters and a pair of walnut speakers complete the system. The page looks like a still illustration until the viewer presses START: the lamp and strobe light up, the record gathers speed, the arm rises, crosses to the lead-in groove, settles, and begins a four-minute walk toward the label while the meters dance, the speakers breathe arcs and slanted window light slowly warms the page. Everything is drawn from HTML elements and gradients and everything moves without a line of script. VISUAL TECHNIQUES - 3-D scene with perspective and preserve-3d: tilted deck plane, plinth front face, feet, ground shadow, and a four-face hinged dust cover that rotates about its back edge - Walnut veneer from stacked repeating-linear and repeating elliptical radial gradients at slightly different angles, plus fine pore noise - Brushed aluminium from conic gradients over fine repeating gradients (platter, pivot, knobs, amplifier face, button cap) - Vinyl from repeating-radial-gradient grooves, radial track-gap bands, a rotating conic glint masked to the groove area and a separate fixed sheen - Strobe rim: two repeating-conic-gradient dot rows cut to rings with radial masks, one standing still and one drifting according to speed - Record label text set around the rim letter by letter with per-letter rotation - Jump-free spin-up and run-down: a paused/running steady rotation nested inside a wrapper whose transition is a decelerating counter-turn of exactly one revolution; a second nested rotor adds the difference between 33⅓ and 45 - Tonearm choreography entirely from transitions: two nested rotors (swing, then four-minute tracking), with lift expressed through registered custom properties (@property) that drive scale and a drop-shadow offset - "Freeze in place" cue pause using a new transition target with an effectively endless delay - VU needles driven by an animated registered number multiplied by signal gates, so they rise after the stylus lands and fall when it lifts - Speaker arcs from single-sided circular borders scaled and faded on staggered loops - Supergraphic background: corner radial-gradient sun with rings, stripe set built from nested bordered boxes sharing a concentric rounded corner - Record sleeve artwork from circles and pill shapes, with ring wear and a sliding inner sleeve - Stacked hard offset text-shadows on the display type; paper tooth overlay from repeating radial gradients - Whole hi-fi sized in em from one viewport-derived unit, with two layouts and a reduced-motion variant INTERACTION MODEL There is no script: five real inputs (a start/stop checkbox, a 33/45 radio pair, a cue checkbox and a dust-cover checkbox) sit at the top of the document and their styled labels are the hardware on the deck. Click, tap, or focus with Tab and press Space (arrow keys for the speed pair); an orange ring shows which control has focus. START lights the pilot lamp and strobe, spins the platter up, then the arm lifts, swings to the lead-in groove, lowers and tracks inward for four minutes while the VU meters dance, the speakers emit arcs and window light fades in; pressing it again lifts and returns the arm and lets the platter coast to a stop. CUE raises the stylus and holds the arm where it is, the meters fall and the arcs stop, and lowering it resumes. The rocker switches between 33⅓ and 45, changing the spin rate and which strobe row appears stationary. Hovering or pressing the record slides its reflection; hovering the dust cover opens it further and clicking or tapping it latches it open; the 45 adaptor, amplifier knobs and record sleeve respond to hover. With reduced motion requested, the same controls work but the platter creeps, the arm jumps to position, and the meters and arcs hold still.