Build thepressure first.

The page is the descent. Scrolling is treated as pressure, not pagination. The reader begins at 18 metres with the last surface light framed by an attack periscope, passes through a red-lit control room, settles into a warm-water acoustic shadow at 288 metres, and reaches an unidentified return at 384. The final movement climbs back to 42 metres: the gauge retreats, two vessels surface, and the story releases its pressure.

The drama deliberately avoids hardware worship. Tension comes from restraint: 74 careful people, a hull that repeats every mistake, and one signal that changes from possible threat to someone asking for help. Red is alarm and obligation; green is information; ice blue is the world outside. Because green appears sparingly, every acquired contact feels consequential.

Periscope and atmosphere. In styles.css, the hero image sits inside an elliptical clip-path with bearing marks, crosshairs, scanlines, an irregular CSS ice ceiling, radial optical falloff, and a steel bezel. scopeDriftPass2 supplies slow camera creep; requestScrollUpdate() adds a small, requestAnimationFrame-throttled vertical drift. Grain, fine structural lines, red spill, and deep vignettes make the page feel like one continuous compartment.

Depth and chapter acquisition. An IntersectionObserver watches each .contact-section. setContact() updates classification, bearing, range, narrative phase, alert color, and target depth. The gauge fill is derived from displayedDepth, not generic document progress, so the epilogue visibly ascends. Each state change restarts .chapter-ping: two expanding rings and a terse acquisition label that make the next chapter feel discovered.

Sonar and consent. drawSonar() paints calibrated circles, rays, a conic sweep, three returns, and the active trace on a DPR-capped canvas. tick() eases the gauge and stops whenever the document is hidden. Audio remains off until the switch invokes ensureAudio(); playPing() shapes a descending sine tone and playGroan() adds a filtered low hull voice. Reduced motion removes drift, pulses, grain movement, and chapter flashes while retaining all information.

Sora is set heavy, tight, and deliberately oversized; outlined second lines suggest light falling away with depth. Chivo Mono owns measurements, times, bearings, classifications, and orders. Body copy stays cool and bright enough for long reading, while low-priority instrument marks recede without becoming illegible.

The periscope begins with a frame, not a stock clip. GPT Image 2 created the 1600 × 904 under-ice still; Higgsfield then passed that exact composition to Kling 3.0 for a five-second ambient loop. Both files live locally in /assets/gen/silentrunning/. The .scope-film video uses the still as its poster, pauses through an IntersectionObserver when offscreen, and yields to .scope-poster for reduced motion or playback failure. Bearing marks, ice geometry, scanlines, grading, sonar, and every other visual remain code-generated.

Ask for a narrative mechanism before naming an aesthetic. Define what the reader’s movement means, which instrument proves that movement, how every chapter changes system state, and what must remain when animation is removed. Require invented operational detail so the atmosphere is carried by believable measurements rather than generic “cinematic” decoration.