/* The fall: the approved continuous background, scrolled through. claude, 2026-11-12.
   A fixed layer behind the page shows the approved scene. Native scrolling moves it from the
   stars at the top of the page to the woodland floor at the bottom. Nothing intercepts input. */

/* Without JavaScript there is no image layer: a plain gradient of the scene's own colours instead. */
html { background: #021011; }
body { background: linear-gradient(180deg, #021011 0%, #03202b 18%, #1b4f86 30%, #5a8fb4 38%, #f8f0e6 46%, #f8f0e6 54%, #c3dfe8 62%, #7ea77c 72%, #2e6b3c 80%, #3b6238 96%, #7a4b28 100%); }
html.js body { background: #021011; }

.fall { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; background: #021011; }
.fall__strip { position: absolute; left: 0; top: 0; width: 100%; will-change: transform; }
.fall__strip img { position: absolute; left: 0; width: 100%; max-width: none; display: block; user-select: none; }
html:not(.js) .fall { display: none; }

/* Page content sits above the scene. */
main { position: relative; z-index: 1; }

/* The header's night gives way to the top of the scene. Put this directly after the header. */
.fall-in { position: relative; z-index: 2; height: 46svh; margin-bottom: -46svh; pointer-events: none; background: linear-gradient(180deg, #07100c 0%, rgba(7,16,12,.82) 28%, rgba(4,16,15,.4) 64%, rgba(2,16,17,0) 100%); }
