.city-atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1;contain:strict}
.city-atmosphere *{pointer-events:none}
.city-smoke-source{position:absolute;left:var(--x);top:var(--y);width:30px;height:8px}
.city-smoke-source i{position:absolute;bottom:0;left:0;width:30px;height:44px;border-radius:48%;background:radial-gradient(ellipse,#ddc9ac55 0%,#d1c3b02a 30%,transparent 69%);opacity:0;animation:city-smoke-rise 10s linear infinite;animation-delay:var(--delay);transform-origin:50% 100%}
@keyframes city-smoke-rise{0%{transform:translate(0,0) scale(.3);opacity:0}15%{opacity:.5}65%{opacity:.23}100%{transform:translate(var(--drift),-100px) scale(2.6);opacity:0}}
.city-lantern-glow{position:absolute;left:var(--x);top:var(--y);width:38px;height:35px;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#ffd79666, #f8a94a22 34%,transparent 70%);mix-blend-mode:screen;animation:city-lamp-breathe 3.7s ease-in-out infinite alternate;animation-delay:var(--delay)}
@keyframes city-lamp-breathe{0%,100%{opacity:.35;scale:.8}38%{opacity:.7;scale:1.05}72%{opacity:.46;scale:.9}}
.city-mote{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:#edcf90;opacity:0;animation:city-dust-drift var(--duration) linear infinite;animation-delay:var(--delay)}
@keyframes city-dust-drift{0%{transform:translate(0,20px);opacity:0}25%{opacity:.45}70%{opacity:.22}100%{transform:translate(var(--drift),-65px);opacity:0}}
.city-bird-flight{position:absolute;left:-15%;top:12%;width:100px;height:40px;animation:city-flock-cross 34s linear infinite;animation-delay:-8s;opacity:.65}
.city-bird-flight svg{width:100%;height:100%}.city-bird{animation:city-wing-beat .85s ease-in-out infinite alternate}
@keyframes city-wing-beat{to{transform:scaleY(-.55)}}
@keyframes city-flock-cross{0%{left:-15%;transform:translateY(0)}65%,100%{left:110%;transform:translateY(-25px)}}
.city-experience .city-standard{transform-origin:50% 0;animation:city-cloth-wind 5.8s ease-in-out infinite alternate}
.city-experience .city-standard:nth-of-type(2n){animation-delay:-2s}
@keyframes city-cloth-wind{0%,100%{transform:skewX(-2deg) rotate(-.8deg)}50%{transform:skewX(3deg) rotate(1deg)}}
.city-animation-paused::before,.city-animation-paused *{animation-play-state:paused!important}
.city-experience:not(.is-lobby) .city-atmosphere{display:none}
@media(max-width:700px){.city-mote:nth-of-type(even){display:none}.city-smoke-source i{width:18px;height:28px}.city-lantern-glow{width:22px;height:24px}.city-bird-flight{width:60px}.city-bird-flight{top:23%}}
@media(prefers-reduced-motion:reduce){.city-atmosphere{display:none}.city-experience .city-standard{animation:none}}

.city-atmosphere::before{content:"";position:absolute;inset:-20% -35%;background:radial-gradient(ellipse at 25% 20%,#18263426,transparent 43%);animation:city-cloud-shadow 38s ease-in-out infinite alternate;pointer-events:none}
@keyframes city-cloud-shadow{from{transform:translateX(-8%);opacity:.35}to{transform:translateX(12%);opacity:.7}}
.city-experience.is-lobby .city-panorama{inset:-4px;transform:translate(calc(var(--room-dx,0px)*.35),calc(var(--room-dy,0px)*.35));transition:transform .5s ease-out}
.city-experience:not(.is-lobby) .palace-scene{animation:city-room-arrive .45s ease-out both}
@keyframes city-room-arrive{from{opacity:.5;scale:1.025}to{opacity:1;scale:1}}
@media(max-width:700px){.city-atmosphere::before{display:none}.city-experience.is-lobby .city-panorama{inset:0;transform:none}}
@media(prefers-reduced-motion:reduce){.city-experience.is-lobby .city-panorama{transform:none;transition:none}.city-experience:not(.is-lobby) .palace-scene{animation:none}}


.city-bird-art{position:absolute;width:18px;height:12px;object-fit:contain;transform:translate(-50%,-50%)}