TITLE: The Paper Sea Remembers — a construction-paper shadow box in six layers

PROMPT: Build a single self-contained HTML artwork that reads as a physical paper-cutout shadow box. Use a bone card background (#efe7d7) as the mat: a fixed full-viewport stage inset by clamp(9px,2.1vw,34px) with a 5px radius, an inset box-shadow frame of card colour plus a hairline rgba(61,64,91,.20) rule, and a deep soft drop shadow, so the scene sits inside a real frame. Inside, place a perspective:1400px container holding nine absolutely positioned paper layers, each a div with a hand-authored jittered clip-path polygon that reads as a torn edge: sky (solid #2f7183 with a neutral white-to-black shading gradient), star field (twelve tiny radial-gradient dots, opacity driven by a --stars variable), moon (a button holding a sand #f2cc8f disc with a radial highlight, a 70px warm glow and a 1.8s rise-in), far ridge (rgba(61,64,91,.40) indigo, ridge line around 39-52%), mid ridge (#1f4e5f teal, 54-66%), treeline (rgba(23,44,56,.94), spiky 60-75%), sea (#1f4e5f with a mask-faded repeating stripe overlay), foreground bank (#e07a5f with a torn #f2cc8f shore strip) and a separate foreground layer of six swaying indigo clip-path pine triangles. Every layer carries filter: drop-shadow(0 12px 14px rgba(12,32,42,.26)) so the shadow follows the torn silhouette, and each is placed at a different translateZ depth from -170px to 86px with a z-index ladder. Typography: Georgia italic display for the title, ui-monospace 10px letterspaced uppercase for the eyebrow and metadata, system-ui for the hint, all inside a lower-right gallery label card (max 300px, rotated -1.1deg, card-coloured with a hairline border and a 6px card halo). Motion: rAF lerped pointer tilt on the whole box (rotateX/rotateY from pointer position), true scroll parallax where each layer moves at its own data-depth rate with a damped scroll rise for the moon, a paper bird built from inline SVG gliding across on a 27s loop with flapping wings (animation-delay -11s so it is mid-flight on first paint), and a 3px scroll-depth bar at the bottom scaling with scaleX. Interaction: clicking the moon toggles a night palette through CSS custom properties (sky #0b1c26, moon #ece5d8, stars to opacity 1, sea #0d222c, bank #9e5138) with 1.1s background-color cross-fades; hovering a paper layer lifts it 62px in Z and deepens its shadow. Respect prefers-reduced-motion by damping parallax to 18%, disabling the tilt, and parking the bird. One inline <style>, one inline IIFE <script> at the end of body, zero external references.

DESCRIPTION: A shadow box you can look into: construction-paper mountains, a treeline, a wavy sea and a coral shore stacked at different depths behind a bone mat, with a sand moon resting in a teal sky. Torn clip-path edges and drop shadows make each layer feel like cut card stock, and the pointer tilts the whole box in perspective while scroll slides the layers past one another at different speeds. Clicking the moon cross-fades the whole scene into a starry night, and the small gallery label card in the corner explains the piece like a museum placard.

TECHNIQUES: Hand-authored jittered clip-path polygons for torn paper edges; per-layer drop-shadow so the shadow traces the torn silhouette; CSS custom properties for a full palette cross-fade between day and night; 3D perspective tilt with rAF lerping; true multi-speed scroll parallax with a dirty-gated render loop; translateZ depth ladder with preserve-3d; inline SVG paper bird with transform-box wing flapping and a negative animation-delay so it is visible on first paint; radial-gradient star field and mask-faded stripe overlay; swaying clip-path pine triangles; transform-only entrance (moonRise) so frozen renders still show the whole page.

INTERACTION: Move the pointer over the box to tilt it in perspective (rotateX/rotateY, lerped, damped to 18% under reduced motion); scroll to parallax the eight layers at different rates and to rise the moon while the bottom depth bar fills; click the moon button (or focus and press Enter/Space) to cross-fade into the night palette and back, with aria-pressed kept in sync; hover any paper layer to lift it 62px in Z with a deeper shadow; hover the gallery label to straighten its rotation and nudge it upward.