/* Effetti stagionali: caricato solo quando una stagione e' attiva dal pannello. */
.season-layer{display:contents}
.season-canvas{position:fixed;inset:0;width:100vw;height:100vh;z-index:25;pointer-events:none}
.season-layer *{pointer-events:none}
body.retro .season-canvas{z-index:9990}

/* --- Natale: luci --- */
.xl{position:fixed;top:0;left:0;right:0;height:34px;z-index:35;display:flex;justify-content:space-around;align-items:flex-start;overflow:hidden}
.xl::before{content:"";position:absolute;left:-4%;right:-4%;top:-14px;height:26px;border-bottom:2px solid rgba(20,50,35,.9);border-radius:50%}
.xl i{position:relative;display:block;width:9px;height:14px;margin-top:11px;border-radius:50% 50% 55% 55%/45% 45% 60% 60%;background:var(--c);box-shadow:0 0 12px 3px var(--c);animation:twinkle 1.7s ease-in-out infinite;animation-delay:calc(var(--i) * -.23s)}
.xl i::before{content:"";position:absolute;left:2px;top:-5px;width:5px;height:6px;background:#1c3a2b;border-radius:1px}
.xl .c0{--c:#ff3b3b}.xl .c1{--c:#ffd24a}.xl .c2{--c:#3ddc84}.xl .c3{--c:#4aa3ff}.xl .c4{--c:#ff7ac8}
@keyframes twinkle{0%,100%{opacity:1}50%{opacity:.35}}
body.retro .xl{z-index:9991}

/* --- Halloween --- */
.vignette{position:fixed;inset:0;z-index:23;background:radial-gradient(ellipse at 50% 40%,transparent 52%,rgba(25,0,35,.5) 100%)}
.fog{position:fixed;left:-25%;right:-25%;bottom:-5vh;height:36vh;z-index:24}
.fog1{background:radial-gradient(55% 80% at 22% 95%,rgba(200,170,230,.2),transparent 70%),radial-gradient(45% 70% at 62% 100%,rgba(255,150,80,.13),transparent 70%);animation:fogdrift 38s ease-in-out infinite alternate}
.fog2{height:28vh;background:radial-gradient(50% 80% at 78% 100%,rgba(190,150,230,.17),transparent 70%),radial-gradient(40% 70% at 30% 105%,rgba(255,140,60,.1),transparent 70%);animation:fogdrift 52s ease-in-out infinite alternate-reverse}
@keyframes fogdrift{from{transform:translateX(-6%)}to{transform:translateX(6%)}}
.spider{position:fixed;top:0;right:9%;z-index:36;display:flex;flex-direction:column;align-items:center;transform-origin:50% 0;animation:spiderdrop 9s ease-in-out infinite,sway 4.6s ease-in-out infinite}
.spider .thread{width:1.5px;height:15vh;background:rgba(255,255,255,.35)}
@keyframes spiderdrop{0%,100%{transform:translateY(-6vh)}50%{transform:translateY(2vh)}}
@keyframes sway{0%,100%{rotate:-4deg}50%{rotate:4deg}}
body.retro .spider,body.retro .vignette{z-index:9991}

/* --- Estate --- */
.sun{position:fixed;top:-130px;right:-130px;width:440px;height:440px;border-radius:50%;z-index:-1;background:radial-gradient(circle,rgba(255,210,70,.55),rgba(255,160,40,.2) 45%,transparent 70%);animation:sunpulse 9s ease-in-out infinite}
@keyframes sunpulse{50%{transform:scale(1.08);opacity:.85}}
.waves{position:fixed;left:0;right:0;bottom:0;height:64px;z-index:24;overflow:hidden}
.wave{position:absolute;left:0;bottom:0;width:calc(100% + 1200px);height:64px;background-repeat:repeat-x;background-size:1200px 64px;animation:wave 16s linear infinite}
.w1{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 64' preserveAspectRatio='none'><path d='M0 30 Q150 4 300 30 T600 30 T900 30 T1200 30 V64 H0Z' fill='rgba(46,230,214,.2)'/></svg>")}
.w2{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 64' preserveAspectRatio='none'><path d='M0 38 Q150 12 300 38 T600 38 T900 38 T1200 38 V64 H0Z' fill='rgba(255,184,28,.16)'/></svg>");animation-duration:23s;animation-direction:reverse}
@keyframes wave{to{transform:translateX(-1200px)}}
body.retro .waves{z-index:9990}body.retro .sun{z-index:1}

/* --- Primavera e Pasqua --- */
.glow-spring{position:fixed;inset:0;z-index:-1;background:radial-gradient(40% 50% at 12% 18%,rgba(255,127,168,.18),transparent 70%),radial-gradient(45% 55% at 90% 80%,rgba(155,229,100,.14),transparent 70%)}
.glow-easter{position:fixed;inset:0;z-index:-1;background:radial-gradient(40% 50% at 85% 15%,rgba(255,226,122,.16),transparent 70%),radial-gradient(45% 55% at 10% 85%,rgba(143,227,207,.14),transparent 70%),radial-gradient(35% 45% at 50% 50%,rgba(255,158,199,.1),transparent 70%)}
body.retro .glow-spring,body.retro .glow-easter{z-index:1}

/* --- Chuseok: luna piena --- */
.moon{position:fixed;top:5vh;right:8vw;width:min(21vw,230px);aspect-ratio:1;border-radius:50%;z-index:-1;background:radial-gradient(circle at 38% 36%,#fff8da,#ffe8a4 55%,#ebbd55 100%);box-shadow:0 0 60px 22px rgba(255,214,120,.34),0 0 170px 70px rgba(255,190,80,.16);opacity:.92;animation:moonglow 8s ease-in-out infinite}
@keyframes moonglow{50%{box-shadow:0 0 74px 30px rgba(255,214,120,.42),0 0 200px 85px rgba(255,190,80,.2)}}
body.retro .moon{z-index:1}

/* --- Capodanno lunare: lanterne --- */
.lantern{position:fixed;top:0;left:var(--x);z-index:36;width:calc(54px * var(--s));display:flex;flex-direction:column;align-items:center;transform-origin:50% 0;animation:sway 5.2s ease-in-out infinite;animation-delay:var(--d)}
.lantern .cord{width:2px;height:calc(14px * var(--s));background:#d9a62e}
.lantern .lbody{position:relative;width:100%;height:calc(52px * var(--s));border-radius:48%;background:radial-gradient(circle at 38% 30%,#ff6a5a,#d3202f 55%,#8f0f1c);box-shadow:0 0 26px 6px rgba(255,70,60,.45);display:grid;place-items:center;color:#ffd96a;font:700 calc(20px * var(--s))/1 serif}
.lantern .lbody::before,.lantern .lbody::after{content:"";position:absolute;left:22%;right:22%;height:calc(7px * var(--s));background:linear-gradient(#f6c542,#c98a12);border-radius:3px}
.lantern .lbody::before{top:calc(-3px * var(--s))}.lantern .lbody::after{bottom:calc(-3px * var(--s))}
.lantern .tassel{width:3px;height:calc(20px * var(--s));margin-top:calc(3px * var(--s));background:linear-gradient(#e8283a,#ffcf4a);border-radius:2px}
body.retro .lantern{z-index:9991}

@media(prefers-reduced-motion:reduce){.season-layer *{animation:none!important}}