.stage{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;isolation:isolate;transform:translate3d(0,0,0);will-change:transform;background:linear-gradient(180deg,var(--sky-top,#a8c8e8) 0%,var(--sky-mid,#d6e8f5) 42%,var(--sky-bottom,#fff4dc) 64%,var(--sea-top,#7ba0c0) 65%,var(--sea-mid,#4d7398) 82%,var(--sea-bottom,#1a3658) 100%);transition:background 0.5s ease-out}.stage::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(255,255,255,0.35) 0 1px,transparent 1px 11%),linear-gradient(180deg,transparent 0%,var(--ambient,rgba(5,46,96,0.18)) 75%,var(--ambient,rgba(5,46,96,0.34)) 100%);mask-image:linear-gradient(180deg,rgba(0,0,0,0.7),transparent 55%);opacity:0.28;z-index:0}.stage::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 30%,var(--ambient,rgba(2,26,61,0.26)) 100%);opacity:var(--vignette-opacity,0.6);z-index:19;transition:opacity 0.5s ease-out}.sky{position:absolute;inset:0 0 32% 0;background:radial-gradient(ellipse 60% 46% at 48% 104%,var(--horizon-glow,rgba(255,232,164,0.55)) 0%,transparent 62%),linear-gradient(180deg,var(--sky-top,#a8c8e8) 0%,var(--sky-mid,#d6e8f5) 64%,var(--sky-bottom,#fff4dc) 100%);z-index:1;transition:background 0.5s ease-out}.scene-canvas{position:absolute;inset:0;z-index:15;pointer-events:none;contain:strict}.cloud{position:absolute;background:radial-gradient(ellipse at center,var(--cloud-tint,rgba(255,255,255,0.62)) 0%,var(--cloud-tint-soft,rgba(255,255,255,0.28)) 42%,transparent 75%);border-radius:999px;z-index:3;opacity:var(--cloud-opacity,0.7);transition:opacity 0.5s ease-out,background 0.5s ease-out}.cloud-1{top:13%;left:-18%;width:460px;height:90px;animation:drift-cloud 110s linear infinite}.cloud-2{top:31%;left:4%;width:360px;height:64px;animation:drift-cloud-slow 140s linear infinite}.cloud-3{top:9%;right:-16%;width:420px;height:76px;animation:drift-cloud-rev 128s linear infinite}.cloud-4{top:22%;left:28%;width:280px;height:56px;animation:drift-cloud-slow 160s linear infinite;opacity:calc(var(--cloud-opacity,0.7) * 0.85)}@keyframes drift-cloud{from{transform:translateX(0)}to{transform:translateX(140vw)}}@keyframes drift-cloud-slow{from{transform:translateX(0)}to{transform:translateX(120vw)}}@keyframes drift-cloud-rev{from{transform:translateX(0)}to{transform:translateX(-140vw)}}.sun-disc{position:absolute;left:var(--sun-x,50%);top:var(--sun-y,22%);width:clamp(120px,12vw,200px);height:clamp(120px,12vw,200px);margin-left:clamp(-100px,-6vw,-60px);margin-top:clamp(-100px,-6vw,-60px);border-radius:50%;background:radial-gradient(circle at 38% 38%,#ffffff 0%,var(--sun-color-core,#ffeeb2) 25%,var(--sun-color-edge,rgba(216,111,69,0.55)) 70%,transparent 100%);z-index:4;box-shadow:0 0 80px var(--sun-glow,rgba(255,232,164,0.55));opacity:var(--sun-opacity,1);transition:left 0.55s cubic-bezier(0.25,0.8,0.25,1),top 0.55s cubic-bezier(0.25,0.8,0.25,1),opacity 0.5s ease-out,background 0.5s ease-out,box-shadow 0.5s ease-out}.sun-disc::after{content:"";position:absolute;inset:-150px;border-radius:50%;background:radial-gradient(circle,var(--sun-glow,rgba(255,232,164,0.48)) 0%,var(--sun-glow-soft,rgba(216,111,69,0.10)) 44%,transparent 70%);z-index:-1;animation:sun-glow-pulse 8s ease-in-out infinite}@keyframes sun-glow-pulse{0%,100%{transform:scale(1);opacity:0.6}50%{transform:scale(1.08);opacity:0.9}}.moon-disc{position:absolute;left:var(--moon-x,50%);top:var(--moon-y,22%);width:clamp(90px,9vw,150px);height:clamp(90px,9vw,150px);margin-left:clamp(-75px,-4.5vw,-45px);margin-top:clamp(-75px,-4.5vw,-45px);border-radius:50%;background:radial-gradient(circle at 35% 35%,#f8fbff 0%,#dfe6f2 60%,#aab8d0 100%);z-index:4;box-shadow:0 0 60px rgba(220,232,255,0.4),inset -8px -10px 20px rgba(80,100,140,0.35);opacity:var(--moon-opacity,0);transition:left 0.55s cubic-bezier(0.25,0.8,0.25,1),top 0.55s cubic-bezier(0.25,0.8,0.25,1),opacity 0.5s ease-out}.moon-disc::before,.moon-disc::after{content:"";position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(140,156,184,0.5),transparent 70%)}.moon-disc::before{width:22%;height:22%;top:28%;left:22%}.moon-disc::after{width:14%;height:14%;top:58%;left:60%}.mountains{position:absolute;left:-5%;right:-5%;top:57.2%;width:110%;height:11%;min-height:88px;z-index:6;filter:drop-shadow(0 8px 18px rgba(2,16,38,0.10))}.mountains svg{width:100%;height:100%;display:block}.mountains svg path{fill:var(--silhouette,rgba(5,46,96,0.22));transition:fill 0.5s ease-out}.mountains svg .mountain-haze{fill:var(--silhouette,rgba(5,46,96,0.16));opacity:0.64}.mountains svg .mountain-front{fill:var(--silhouette-strong,rgba(5,46,96,0.32));opacity:0.68}.islands-mid{position:absolute;left:-5%;right:-5%;top:62.7%;width:110%;height:7%;min-height:56px;z-index:8;filter:blur(0.1px)}.islands-mid svg{width:100%;height:100%;display:block}.islands-mid svg path{fill:var(--silhouette-strong,rgba(5,46,96,0.36));transition:fill 0.5s ease-out}.sea-bg{position:absolute;inset:66% 0 0 0;background:radial-gradient(ellipse 38% 28% at var(--reflection-x,50%) 1%,var(--reflection-color,rgba(255,232,164,0.26)),transparent 58%),radial-gradient(ellipse 68% 20% at 22% 18%,rgba(255,255,255,0.18),transparent 62%),radial-gradient(ellipse 52% 18% at 88% 28%,rgba(255,255,255,0.12),transparent 64%),repeating-linear-gradient(176deg,rgba(255,255,255,0.18) 0 1px,transparent 1px 14px),repeating-linear-gradient(92deg,rgba(255,255,255,0.07) 0 2px,transparent 2px 38px),linear-gradient(180deg,var(--sea-top,#9eb6ca) 0%,var(--sea-mid,#6686a5) 44%,var(--sea-bottom,#244b72) 100%);z-index:9;transition:background 0.5s ease-out}.sea-bg::before,.sea-bg::after{content:"";position:absolute;inset:0;pointer-events:none}.sea-bg::before{background:linear-gradient(180deg,rgba(255,255,255,0.28),transparent 12%),repeating-linear-gradient(184deg,transparent 0 18px,rgba(255,255,255,0.13) 18px 20px,transparent 20px 46px),repeating-linear-gradient(96deg,transparent 0 42px,rgba(255,255,255,0.08) 42px 45px,transparent 45px 86px);opacity:0.52;animation:sea-glint 16s ease-in-out infinite}.sea-bg::after{background:radial-gradient(ellipse 72% 18% at 52% 7%,rgba(255,255,255,0.22),transparent 58%),radial-gradient(ellipse 86% 20% at 48% 42%,rgba(2,26,61,0.12),transparent 68%),linear-gradient(180deg,transparent 0 68%,rgba(2,16,38,0.2) 100%);opacity:0.62}@keyframes sea-glint{0%,100%{transform:translate3d(-1.5%,0,0);opacity:0.36}50%{transform:translate3d(1.5%,0,0);opacity:0.55}}.sea{position:absolute;left:-10%;right:-10%;bottom:0;width:120%;display:block}.wave-1{height:210px;bottom:0;z-index:10}.wave-1 path{fill:var(--wave-1-color,rgba(222,235,244,0.28));animation:wave-shift-1 28s ease-in-out infinite;transform-origin:center bottom;transition:fill 0.5s ease-out}.wave-2{height:175px;bottom:0;z-index:11}.wave-2 path{fill:var(--wave-2-color,rgba(5,46,96,0.26));animation:wave-shift-2 34s ease-in-out infinite;transform-origin:center bottom;transition:fill 0.5s ease-out}.wave-3{height:120px;bottom:0;z-index:13}.wave-3 path{fill:var(--wave-3-color,rgba(2,26,61,0.88));animation:wave-shift-3 40s ease-in-out infinite;transform-origin:center bottom;transition:fill 0.5s ease-out}@keyframes wave-shift-1{0%,100%{transform:translateX(-1%) scaleY(1)}50%{transform:translateX(1%) scaleY(1.02)}}@keyframes wave-shift-2{0%,100%{transform:translateX(1.2%) scaleY(1)}50%{transform:translateX(-1.2%) scaleY(1.025)}}@keyframes wave-shift-3{0%,100%{transform:translateX(-0.7%) scaleY(1)}50%{transform:translateX(0.9%) scaleY(1.018)}}.celestial-reflection{position:absolute;left:var(--reflection-x,50%);top:70%;width:clamp(220px,24vw,360px);height:56px;margin-left:clamp(-180px,-12vw,-110px);background:repeating-linear-gradient(90deg,transparent 0 16px,var(--reflection-color,rgba(255,232,164,0.22)) 16px 30px,transparent 30px 48px),radial-gradient(ellipse at center,var(--reflection-color,rgba(255,232,164,0.62)) 0%,var(--reflection-color-soft,rgba(255,232,164,0.16)) 50%,transparent 78%);border-radius:50%;animation:shimmer 7s ease-in-out infinite;opacity:var(--reflection-opacity,0.62);z-index:12;transform:translateZ(0);transition:left 0.55s cubic-bezier(0.25,0.8,0.25,1),opacity 0.5s ease-out,background 0.5s ease-out}@keyframes shimmer{0%,100%{opacity:var(--reflection-opacity,0.45);transform:scaleX(1)}50%{opacity:calc(var(--reflection-opacity,0.45) * 1.4);transform:scaleX(1.08)}}.palm{position:absolute;right:-120px;bottom:-60px;height:92%;transform-origin:70% 100%;animation:palm-sway 14s ease-in-out infinite;z-index:14;opacity:0.55;pointer-events:none}.palm svg{height:100%;width:auto;display:block}.palm .trunk{fill:var(--silhouette-strong,rgba(2,26,61,0.85));transition:fill 0.5s ease-out}.palm .frond{fill:var(--silhouette-strong,rgba(2,26,61,0.78));transform-origin:50% 12%;transition:fill 0.5s ease-out}.palm .coconut{fill:var(--silhouette-strong,rgba(2,26,61,0.92));transition:fill 0.5s ease-out}@keyframes palm-sway{0%,100%{transform:rotate(-1deg)}50%{transform:rotate(1deg)}}.palm .frond.f1{animation:frond-1 5.5s ease-in-out infinite}.palm .frond.f2{animation:frond-2 6.5s ease-in-out infinite}.palm .frond.f3{animation:frond-3 7.0s ease-in-out infinite}.palm .frond.f4{animation:frond-4 6.0s ease-in-out infinite}.palm .frond.f5{animation:frond-5 7.5s ease-in-out infinite}.palm .frond.f6{animation:frond-6 8.0s ease-in-out infinite}.palm .frond.f7{animation:frond-3 6.8s ease-in-out infinite}.palm .frond.f8{animation:frond-1 7.2s ease-in-out infinite}@keyframes frond-1{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(2deg)}}@keyframes frond-2{0%,100%{transform:rotate(2deg)}50%{transform:rotate(-3deg)}}@keyframes frond-3{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(3deg)}}@keyframes frond-4{0%,100%{transform:rotate(3deg)}50%{transform:rotate(-2deg)}}@keyframes frond-5{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}@keyframes frond-6{0%,100%{transform:rotate(2.5deg)}50%{transform:rotate(-2.5deg)}}@media (max-width:980px){.palm{right:-160px;bottom:-100px;height:70%;opacity:0.32}}@media (max-width:680px){.palm{right:-180px;height:56%;opacity:0.22}}.grain{position:absolute;inset:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.024  0 0 0 0 0.102  0 0 0 0 0.227  0 0 0 0.06 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");opacity:0.22;z-index:17;pointer-events:none}.stage-overlay{position:absolute;inset:0;z-index:18;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,0.10) 0%,transparent 36%);opacity:0.6}@media (prefers-reduced-motion:reduce){.stage,.stage::after,.sky,.cloud,.sun-disc,.sun-disc::after,.moon-disc,.mountains svg path,.islands-mid svg path,.sea-bg,.wave-1 path,.wave-2 path,.wave-3 path,.celestial-reflection,.palm .trunk,.palm .frond,.palm .coconut{transition-duration:0.2s!important}.cloud,.sun-disc::after,.sea-bg::before,.palm,.palm .frond,.wave-1 path,.wave-2 path,.wave-3 path,.celestial-reflection{animation:none!important}}