/* Decorative interactions stay inside the opening landscape. */
.wonder-atmosphere{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#263a8055,transparent 65%);opacity:0;transition:opacity 1.4s}.hero.is-lit .wonder-atmosphere{opacity:1}.hero.is-lit .world-town{filter:drop-shadow(0 0 16px #ffeaaa) drop-shadow(0 8px 30px #ffc260);transition:filter 1.4s}.hero .world-town{transition:filter 1.4s}
#wonder-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:2}.wonder-controls{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:5;display:flex;justify-content:center;flex-wrap:wrap;gap:7px;width:max-content;max-width:95%;padding:10px 14px;background:#fffdf2ed;border:1px solid #fff;border-radius:22px;box-shadow:0 8px 25px #254a2520}.wonder-controls button{border:1px solid #d3dec5;background:#fffdf3;border-radius:30px;padding:8px 12px;font-size:11px;min-height:40px}.wonder-controls button:hover{background:#eaf4da}.wonder-controls button[aria-pressed=true]{background:#354d65;color:#fff5d8;border-color:#354d65}.wonder-controls small{flex-basis:100%;text-align:center;font-size:9px;color:#567052}
.wonder-flower{position:absolute;width:34px;height:46px;transform-origin:50% 100%;animation:flower-grow .65s cubic-bezier(.2,.85,.3,1.3) both;filter:drop-shadow(0 3px 3px #416b2220)}.wonder-flower:before{content:'';position:absolute;height:25px;width:3px;background:#5e994f;bottom:0;left:16px;border-radius:5px;transform:rotate(-9deg)}.wonder-flower:after{content:'';position:absolute;left:18px;bottom:9px;width:12px;height:7px;background:#7dab56;border-radius:90% 0 90% 0}.wonder-flower b{position:absolute;top:0;left:5px;width:24px;height:24px;color:var(--petal);font-size:33px;line-height:24px;text-shadow:0 1px 0 #fff9;font-weight:400}.wonder-star{position:absolute;color:#fff9c7;text-shadow:0 0 12px #fff,0 0 25px #ffdd69;font-size:25px;animation:sky-wish 2.8s ease-out both}.wonder-lamp{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff8c3;box-shadow:0 0 10px 4px #ffd375,0 0 34px 10px #ffc77888;animation:lamp-glow 3s ease-in-out infinite alternate}.wonder-flower.is-fading{opacity:0;transition:opacity 1s}
@keyframes flower-grow{from{transform:scale(.1) rotate(-25deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}@keyframes sky-wish{0%{opacity:0;transform:translate(-45px,35px) scale(.3)}25%{opacity:1}80%{opacity:.9}100%{opacity:0;transform:translate(110px,-95px) scale(.6)}}@keyframes lamp-glow{from{opacity:.5}to{opacity:1}}
@media(max-width:760px){.hero{padding-bottom:235px}.world-town{bottom:78px}.wonder-controls{bottom:15px;padding:8px;gap:5px;width:calc(100% - 24px)}.wonder-controls button{font-size:10px;padding:7px 9px;min-height:42px}.wonder-controls small{font-size:8px}.wonder-flower{width:30px}}
.reduced-motion .wonder-star{animation:none;opacity:1}@media(prefers-reduced-motion:reduce){.wonder-star{animation:none;opacity:1}}

#reset-flowers{font-size:9px;background:transparent;border-color:transparent;color:#567052} .wonder-controls{max-width:96%}
@media(max-width:760px){.wonder-controls{gap:3px;padding:6px}.wonder-controls button{padding:7px 6px;font-size:9px}#reset-flowers{font-size:8px}}

.wonder-flower{width:24px;height:30px}.wonder-flower b{font-size:24px;line-height:20px;width:20px;height:20px;left:4px}.wonder-flower:before{height:17px;left:14px;width:2px}.wonder-flower:after{left:15px;bottom:5px;width:9px;height:5px}

/* Keep the invitation to play within the first-view copy. */
.hero-copy .wonder-controls{position:relative;left:auto;bottom:auto;transform:none;width:100%;max-width:390px;margin-top:14px;padding:9px;justify-content:flex-start;border-radius:17px;background:#fffdf3dc;gap:4px}
.hero-copy .wonder-controls button{min-height:36px;font-size:10px;padding:6px 9px}
.hero-copy .wonder-controls small{text-align:left;font-size:9px;line-height:1.6;padding:0 4px}
@media(max-width:760px){.hero-copy .wonder-controls{margin-top:12px}.hero-copy .wonder-controls button{min-height:40px;font-size:9px;padding:6px 8px}.hero{padding-bottom:205px}.world-town{bottom:0}.hero-copy .wonder-controls small{font-size:8px}}

/* Night scene: darken scenery only, keeping portfolio images unchanged. */
.wonder-atmosphere{background:radial-gradient(circle at 48% 9%,#fff9d8 0 1px,transparent 2px),radial-gradient(circle at 70% 7%,#fff9d8 0 1px,transparent 2px),radial-gradient(circle at 91% 20%,#fff9d8 0 1.5px,transparent 2.5px),radial-gradient(circle at 37% 28%,#e6edff 0 1px,transparent 2px),radial-gradient(circle at 59% 18%,#e6edff 0 1px,transparent 2px),linear-gradient(180deg,rgba(6,13,42,.94),rgba(10,23,52,.84) 55%,rgba(5,18,32,.77));transition:opacity 1.2s}
.wonder-atmosphere:after{content:'';position:absolute;top:32px;left:48%;width:34px;height:34px;border-radius:50%;background:#fff2bd;box-shadow:0 0 25px 8px #ffedac45,0 0 65px 20px #ffe9a51f}
.hero.is-lit .world-town{filter:brightness(.53) saturate(.82) drop-shadow(0 0 14px #f5c97570)}
.hero.is-lit .hero-copy h1,.hero.is-lit .hero-copy .intro,.hero.is-lit .hero-copy>.eyebrow,.hero.is-lit .play-note,.hero.is-lit .hero-actions>.text-link{color:#fff6e4;text-shadow:0 2px 12px #02071760}
.hero.is-lit .gallery-top,.hero.is-lit .gallery-bottom>span{color:#eef2ff;text-shadow:0 1px 5px #071327}
.hero.is-lit .gallery-top #counter{background:#152340dd;color:#fff3d6}
.hero.is-lit .gallery-caption{box-shadow:0 0 24px #fff1c31a}
.hero.is-lit .wonder-flower{filter:brightness(.8) drop-shadow(0 0 3px #ffebb36b)}
.wonder-lamp{width:8px;height:11px;border-radius:45% 45% 35% 35%;background:#fff7cc;box-shadow:0 0 5px 2px #fff2b9,0 0 17px 8px #ffc957b3,0 0 45px 19px #ffb83b45;animation:night-lamp 3s ease-in-out infinite alternate}
.wonder-lamp:after{content:'';position:absolute;left:-15px;top:8px;width:38px;height:27px;border-radius:50%;background:radial-gradient(ellipse,#ffc96955,transparent 70%);transform:scaleY(.45)}
@keyframes night-lamp{from{opacity:.8}to{opacity:1}}
@media(max-width:760px){.wonder-atmosphere:after{left:auto;right:25px;top:23px;width:26px;height:26px}}
.hero-copy .wonder-controls button{font-size:12px;min-height:44px}.hero-copy .wonder-controls small{font-size:12px}#reset-flowers{font-size:11px}
