.scene-space{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;overflow:hidden;z-index:3;isolation:isolate}.actor{position:absolute;background-image:url('assets/motion-atlas.png');background-repeat:no-repeat;will-change:transform;filter:brightness(calc(1 - var(--night-mix,0)*.4))}.ship{width:17%;aspect-ratio:940/280;background-size:163.404% 365.714%;background-position:0 14.785%;left:26%;top:45%;animation:ship-route 110s ease-in-out infinite alternate}.ship-wake{position:absolute;left:26%;top:56%;width:17%;height:1%;border-radius:50%;background:linear-gradient(90deg,transparent,#e9f6ec77,transparent);filter:blur(2px);animation:ship-route 110s ease-in-out infinite alternate}.broom{width:3.4%;aspect-ratio:420/240;background-size:365.714% 426.667%;background-position:96.774% 16.582%;left:40%;top:16%;animation:broom-route 74s linear infinite;opacity:0}.dragon{width:5.2%;aspect-ratio:760/480;background-size:202.105% 213.333%;background-position:10.31% 88.235%;left:52%;top:9%;animation:dragon-route 101s linear infinite;opacity:0}.orca{width:3.3%;aspect-ratio:460/510;background-size:333.913% 200.784%;background-position:90.892% 96.498%;left:80%;top:64%;transform-origin:bottom center;animation:orca-jump 39s ease-in-out infinite;opacity:0}.splash{position:absolute;left:80%;top:75%;width:4%;height:1%;border:1px solid #f5ffffb0;border-radius:50%;animation:splash 39s ease-in-out infinite;opacity:0}.water-ripples{position:absolute;left:22%;right:1%;top:54%;bottom:21%;background:repeating-linear-gradient(177deg,transparent 0 10px,#e0fffa24 11px,transparent 12px 23px);mask-image:linear-gradient(transparent,#0007,transparent);animation:ripple-flow 9s linear infinite;opacity:.45;pointer-events:none}.cloud-wisp{position:absolute;left:32%;top:8%;width:30%;height:12%;border-radius:50%;background:radial-gradient(ellipse at 20% 60%,#ffffff60,transparent 35%),radial-gradient(ellipse at 60% 40%,#ffffff45,transparent 50%);filter:blur(15px);opacity:calc(.5 - var(--night-mix,0)*.3);animation:cloud-drift 120s linear infinite alternate}.ambient-fireflies{position:absolute;inset:0;pointer-events:none;opacity:var(--night-mix,0);z-index:4}.ambient-fireflies i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;background:#ffe6a4;border-radius:50%;box-shadow:0 0 7px #ffe6a4;animation:firefly-flight var(--period) ease-in-out infinite;animation-delay:var(--delay)}.hero-art{transform:translateY(var(--hero-parallax,0px));will-change:transform}.hero{overflow:clip;overflow-clip-margin:120px}.hero-inner{transform:translateY(var(--copy-parallax,0px))}.bleed-branch{translate:0 var(--branch-parallax,0px)}.bleed-lantern{translate:0 var(--lamp-parallax,0px)}.window .pic img{transform:translateY(var(--portal-parallax,0px)) scale(1.07)}.window:hover .pic img{transform:translateY(var(--portal-parallax,0px)) scale(1.11)}.footer{position:relative}
@keyframes ship-route{from{transform:translateX(0)}to{transform:translateX(29%)}}
@keyframes broom-route{0%,8%{opacity:0;transform:translate(0,0) rotate(-5deg)}12%{opacity:.85}42%{opacity:.85}48%,100%{opacity:0;transform:translate(1000%,-80%) rotate(3deg)}}
@keyframes dragon-route{0%,36%{opacity:0;transform:translate(0,0) scale(.8)}40%{opacity:.75}68%{opacity:.75}74%,100%{opacity:0;transform:translate(720%,100%) scale(1)}}
@keyframes orca-jump{0%,65%,83%,100%{opacity:0;transform:translateY(60%) rotate(-15deg) scale(.7)}68%{opacity:1}72%{opacity:1;transform:translateY(-55%) rotate(4deg) scale(1)}76%{opacity:1;transform:translate(40%,0) rotate(32deg) scale(.8)}80%{opacity:0;transform:translate(70%,65%) rotate(50deg) scale(.65)}}
@keyframes splash{0%,65%,100%{opacity:0;transform:scale(.4)}68%,77%{opacity:.7}82%{opacity:0;transform:scale(2)}}
@keyframes ripple-flow{to{background-position:80px 23px}}
@keyframes cloud-drift{to{transform:translateX(65%)}}
@keyframes firefly-flight{0%,100%{opacity:0;transform:translate(0,0)}45%{opacity:.9;transform:translate(9px,-14px)}70%{opacity:.5;transform:translate(-6px,-22px)}}
@media(max-width:600px){.hero{overflow:visible}.hero-art{transform:none}.hero-inner{transform:none}.bleed-branch,.bleed-lantern{translate:none}}
@media(prefers-reduced-motion:reduce){.actor,.ship-wake,.water-ripples,.cloud-wisp,.ambient-fireflies i{animation:none!important}.broom,.dragon,.orca,.splash,.ambient-fireflies{display:none}.hero-art,.hero-inner{transform:none!important}.bleed-branch,.bleed-lantern{translate:none!important}.window .pic img{transform:none!important}}
.monorail{left:74%;top:46.3%;width:15%;aspect-ratio:12/1;background-image:url('assets/monorail.png');background-size:100% 400%;background-position:center;animation:monorail-route 58s ease-in-out infinite alternate;transform-origin:center}
@keyframes monorail-route{from{transform:translate(0,0) rotate(1deg)}to{transform:translate(62%,18%) rotate(1deg)}}

/* Homepage-only geometry: distant vessel stays below the rail and away from copy. */
.hero .ship{left:45%;top:62%;width:7%;animation:homepage-sailing 85s linear infinite alternate}
.hero .ship-wake{left:45%;top:66.8%;width:7%;height:.5%;animation:homepage-sailing 85s linear infinite alternate}
@keyframes homepage-sailing{to{transform:translateX(100%)}}
.hero .ship{left:34%;top:55%}.hero .ship-wake{left:34%;top:59.8%}

.sky-lanterns{position:absolute;left:58%;right:5%;top:3%;bottom:40%;overflow:hidden;opacity:clamp(0,calc((var(--night-mix,0) - .22)*2),1);pointer-events:none}
.paper-lantern{position:absolute;left:var(--lx);bottom:-25px;width:var(--size);height:calc(var(--size)*1.4);border-radius:25% 25% 18% 18%;background:linear-gradient(90deg,#c77729,#ffdc89 45%,#e99e3b);border-top:1px solid #ffe6ac;box-shadow:0 0 10px #ffd47785;animation:lantern-ascent var(--flight) linear infinite;animation-delay:var(--delay)}
.paper-lantern:after{content:'';position:absolute;left:35%;right:35%;bottom:1px;height:3px;border-radius:50%;background:#fff3b0;box-shadow:0 0 5px #fff1a0}
@keyframes lantern-ascent{0%{opacity:0;transform:translate(0,0) scale(.65)}12%{opacity:.9}75%{opacity:.85}100%{opacity:0;transform:translate(22px,-340px) scale(.35)}}
@media(max-width:600px){.sky-lanterns{left:64%;right:10%;top:4%;bottom:42%}}
@media(prefers-reduced-motion:reduce){.paper-lantern{animation:none;bottom:35%;opacity:.65}}