/* Vector scenery and room use one centred 2403 x 1180 cover projection. */
.backdrop .city-scene,.backdrop .room-scene{position:absolute;inset:0;width:100%;height:100%;object-position:50% 50%;pointer-events:none;user-select:none;overflow:hidden}
.backdrop .city-scene{z-index:0}.backdrop .room-scene{z-index:2}
#weather-canvas{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;pointer-events:none}
.app[data-weather="rain"] .city-scene,.app[data-weather="cloudy"] .city-scene{filter:saturate(.8) brightness(.94)}
.app[data-weather="snow"] .city-scene{filter:saturate(.72) brightness(1.06)}
.app.motion-paused #weather-canvas,.app.reduced-motion #weather-canvas{visibility:hidden}
.app.reduced-motion .backdrop *{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){#weather-canvas{visibility:hidden}.backdrop *{animation:none!important;transition:none!important}}
/* Light is painted once: avoid animating SVG offscreen surfaces on mobile GPUs. */
.backdrop{isolation:isolate;contain:layout paint}
.backdrop .room-sunlight,.backdrop .room-lamplight,.backdrop .room-night-shade{transition:none;animation:none}
@media(max-width:1000px),(hover:none) and (pointer:coarse){
  .backdrop .city-scene{filter:none}
  .stage,.page-nav,.live-weather,.view-toggle,.brand-symbol,.scene-settings,.toast{-webkit-backdrop-filter:none;backdrop-filter:none}
  .scene-settings::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}
  .stage{background:linear-gradient(135deg,#51574bef,#353c33f0)}
  .page-nav{background:#3d493fe8}
  .view-toggle{background:#3d493fdc}
  .scene-settings{background:#393f36}
}
#fireworks-canvas{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;pointer-events:none}
.app.scene-paused #fireworks-canvas,.app.reduced-motion #fireworks-canvas{visibility:hidden}
@media(prefers-reduced-motion:reduce){#fireworks-canvas{visibility:hidden}}