TITLE: CUT & PASTE — a paper-collage zine landing page

PROMPT: Design 'CUT & PASTE', a paper-collage zine landing page: torn paper edges (jagged clip-path borders, subtle drop shadows), washi-tape strips holding cards at jaunty angles, halftone-dot duotone art panels, ransom-note mixed typography (serif chunks against marker-style headings), graph-paper and newsprint background layers. Palette: newsprint cream, tomato, pool blue, marker black. Interactions: hovering cards lifts them with paper-curl shadow; clicking tape peels it; an ISSUE 01 header stamp thunks in on load; a red-string board mode draws conspiracy strings between pinned cards (pure delight). Handmade, anarchic, joyful.

DESCRIPTION: A zine promo built entirely from paper metaphors. The backdrop layers graph-paper grids over newsprint cream, dot grain and a soft vertical grade. A ransom-note masthead mixes ultra-black marker caps (CUT), an italic serif ampersand, and tracked-out mono small caps, each glyph chunk shadowed in tomato and paper. An ISSUE 01 rubber stamp thunks onto the page on load with a board-jolt shake. Five collage cards — cover art, contents, subscribe, submissions, masthead — sit at jaunty angles with three different jagged clip-path torn edges and hand-torn inset shadows. Each card is held by a washable washi strip (cream, pool, tomato) with dashed cut ends; clicking a tape peels it up and away, clicking again re-sticks it. The cover panel is a CSS-only halftone duotone: radial dot screens over a split pool/tomato field with a sunburst medallion. A red-string mode drops tomato pushpins into every card and draws a sagging Bézier conspiracy thread between them, animated as one drawn stroke with plucked-string tones. Shuffle re-angles every card with paper-slide noise; double-clicking the board resets the angles. A subscribe card validates the address field and stamps STAMPED ✓. The footer is an ink-black newsprint rail that scrolls zine slogans forever. All sound is off by default and enabled by the SOUND toggle (WebAudio, gesture-gated).

TECHNIQUES: Layered multiple background-images (radial dot grain x2, repeating graph grid x2, linear grade) for newsprint+graph paper depth; three distinct jagged polygon() clip-paths for torn edges with compound hover shadows to fake paper curl; CSS custom property --r per card so shuffle/rotate/hover compose in one transform; ransom-note typography from three system families (marker black, old-style serif italic, mono) with layered text-shadow offsets; halftone duotone via stacked radial-gradient dot screens at offset positions over a hard-split duotone field plus conic-gradient sunburst; washi tape as repeating-linear-gradient stripes with dashed clip edges and a cubic-bezier peel transform; SVG overlay with fixed-position full-viewport path strings recomputed from getBoundingClientRect of pins, stroke-dasharray draw-on animation with --len custom property; entrance choreography via staggered class removal and a cubic-bezier(.22,1.9,.36,1) stamp thunk keyframe with board jolt; WebAudio oscillator+noise-buffer SFX engine with master gain, try/catch everywhere, default-muted; prefers-reduced-motion disables all animation; seamless marquee by cloning the rail content; responsive from 360px (stamp becomes inline, cards full-width) to 4K via clamp() typography and fluid padding.

INTERACTION: Hover any card: it lifts with a two-layer paper-curl shadow and straightens its stack order. Click a washi-tape strip: it peels off with a rip noise; click again to re-stick with a pin tap. RED STRING MODE toggles conspiracy pins + a sagging red thread drawn between all cards, each segment plucking a tone; resizing redraws the thread. SHUFFLE re-angles all cards with paper-slide sounds; double-click empty board space to reset angles. SOUND OFF/ON gates every effect. Type an address and press the subscribe button to get a rubber-stamp confirmation. The ISSUE 01 stamp thunks in on load; the newsprint rail slides continuously.