/* Original paper artwork stays intact. Natural details are isolated inside
   stationary masks, so wind never drags a trunk, road, bridge or shoreline. */
.city-art>.city-cell{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:hidden;pointer-events:none}
.city-art .scene-foreground{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:visible;--scene-cut:polygon(0 74%,13%71%,27%73%,43%69%,59%72%,74%70%,88%73%,100%71%,100%100%,0 100%);transform:translateY(-1px) scale(1.012);transform-origin:50% 100%;filter:drop-shadow(0 4px 3px #173f302b)}
.city-art .scene-foreground>img,.city-art .scene-foreground>.city-cell{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;clip-path:var(--scene-cut,none)}
.city-art[data-city-slug="hong-kong"] .scene-foreground{--scene-cut:none;transform:none;filter:drop-shadow(0 5px 2px #164b3c60)}
.city-art[data-city-slug="london"] .scene-foreground{--scene-cut:polygon(0 79%,16%78%,31%80%,47%77%,61%80%,76%78%,91%80%,100%78%,100%100%,0 100%);filter:drop-shadow(0 5px 3px #164b3c40)}
/* Keep broad copies off these scenes: Paris uses crown texture only, and
   Riyadh's original skyline must remain clear, without a softened lower layer. */
.city-art[data-city-slug="paris"] .scene-foreground,.city-art[data-city-slug="riyadh"] .scene-foreground{display:none}
.city-art .scene-detail{position:absolute;inset:0;z-index:3;width:100%;height:100%;overflow:hidden;pointer-events:none}
.city-art[data-city-slug="hong-kong"] .scene-detail{z-index:1}
.city-art[data-motion~="water"] .scene-foreground{z-index:0;opacity:.7}
.city-art .scene-water-band{transform-box:view-box;opacity:.94}
.city-art .scene-water-shimmer{opacity:.03}
.city-art .scene-foliage-canopy{transform-origin:var(--scene-canopy-origin);transform-box:view-box;opacity:.93}
.city-art .scene-existing-cloud{transform-box:view-box}
.city-art .scene-glass-glint{opacity:0;transform-box:view-box}
.city-art .scene-flower-petals{transform-box:view-box;transform-origin:var(--scene-flower-origin);opacity:.97}
.city-art .scene-surf-foam{transform-box:view-box;opacity:.88}
.city-art.scene-playing .scene-water-band{animation:scene-water-current 2.8s ease-in-out infinite alternate}
.city-art.scene-playing .scene-water-band-1{animation-name:scene-water-counter;animation-duration:3.3s;animation-delay:-1.6s}
.city-art.scene-playing .scene-water-band-2{animation-duration:4.1s;animation-delay:-2.5s}
.city-art.scene-playing .scene-water-shimmer{animation:scene-water-shimmer 2.2s ease-in-out infinite alternate;animation-delay:-.8s}
.city-art.scene-playing .scene-existing-cloud{animation:scene-cloud-breeze 12s ease-in-out infinite alternate;animation-delay:-3s}
.city-art.scene-playing .scene-foliage-canopy{animation:scene-canopy-breeze 2.4s ease-in-out infinite alternate;animation-delay:var(--scene-canopy-phase,-.7s)}
.city-art.scene-playing .scene-glass-glint{animation:scene-glass-sunshine 5.2s ease-in-out infinite;animation-delay:-1.1s}
.city-art.scene-playing .scene-flower-petals{animation:scene-flower-breeze 2.65s ease-in-out infinite alternate;animation-delay:var(--scene-flower-phase,-.5s)}
.city-art.scene-playing .scene-surf-foam{animation:scene-surf-break 1.85s ease-in-out infinite;animation-delay:-.6s}
.city-art.scene-playing .scene-surf-foam-1{animation-duration:2.35s;animation-delay:-1.5s}
.city-art.scene-offscreen .scene-detail *,body.motion-paused .scene-detail *,.scene-document-hidden .scene-detail *{animation-play-state:paused!important}
@keyframes scene-water-current{from{transform:translate(calc(var(--scene-water-distance)*-.65),0);filter:brightness(.98)}to{transform:translate(var(--scene-water-distance),calc(var(--scene-water-lift)*-1));filter:brightness(1.12)}}
@keyframes scene-water-counter{from{transform:translate(var(--scene-water-distance),0);filter:brightness(1.12)}to{transform:translate(calc(var(--scene-water-distance)*-.65),var(--scene-water-lift));filter:brightness(.99)}}
@keyframes scene-water-shimmer{from{opacity:.015}to{opacity:.11}}
@keyframes scene-cloud-breeze{from{transform:translateX(0)}to{transform:translateX(var(--scene-cloud-distance))}}
@keyframes scene-canopy-breeze{0%{transform:translate(calc(var(--scene-canopy-x)*-.45),0) rotate(-1.15deg);filter:brightness(.99)}45%{transform:translate(var(--scene-canopy-x),calc(var(--scene-canopy-y)*-.45)) rotate(.65deg);filter:brightness(1.045)}100%{transform:translate(calc(var(--scene-canopy-x)*-.65),var(--scene-canopy-y)) rotate(1.5deg);filter:brightness(1.015)}}
@keyframes scene-glass-sunshine{0%{opacity:0;transform:translateX(0)}18%{opacity:.25}62%{opacity:.32}85%,100%{opacity:0;transform:translateX(var(--scene-glint-distance))}}
@keyframes scene-flower-breeze{0%{transform:translate(calc(var(--scene-flower-x)*-.45),0) rotate(-1.35deg);filter:brightness(1)}48%{transform:translate(var(--scene-flower-x),calc(var(--scene-flower-y)*-.55)) rotate(.8deg);filter:brightness(1.035)}100%{transform:translate(calc(var(--scene-flower-x)*-.55),var(--scene-flower-y)) rotate(1.65deg);filter:brightness(1.01)}}
@keyframes scene-surf-break{0%,100%{transform:translate(calc(var(--scene-surf-x)*-.3),var(--scene-surf-y));opacity:.42;filter:brightness(1)}42%{transform:translate(var(--scene-surf-x),calc(var(--scene-surf-y)*-.75));opacity:1;filter:brightness(1.13)}68%{transform:translate(calc(var(--scene-surf-x)*.55),calc(var(--scene-surf-y)*-.25));opacity:.9;filter:brightness(1.07)}}
@media(prefers-reduced-motion:reduce){.city-art .scene-detail{display:none}.city-art .scene-foreground{transform:none!important}.city-art.scene-playing .scene-detail *{animation:none!important}}