/* Architectural details stay fixed while weather gives the year its changing character. */
.wonder-front-door,
.wonder-door-wreath {
  transform-box: view-box;
  transform-origin: 559px 452px;
  transform: scaleX(1) skewY(0deg);
  transition: transform 1.05s cubic-bezier(.25,.7,.3,1);
}
.year-wonder[data-door="open"] .wonder-front-door,
.year-wonder[data-door="open"] .wonder-door-wreath {
  transform: scaleX(.23) skewY(-12deg);
}
.wonder-open-door-glow { opacity:0; transition:opacity .8s ease; }
.year-wonder[data-door="open"] .wonder-open-door-glow { opacity:1; }
.wonder-deep-snow,.wonder-ice-detail,.wonder-wet-surfaces,.wonder-weather-clouds,
.wonder-weather-blizzard,.wonder-weather-sleet,.wonder-downpour {
  opacity:0; pointer-events:none;
  transition:opacity 1.6s ease,filter 1.6s ease;
}
.wonder-weather-blizzard,.wonder-weather-sleet,.wonder-downpour { isolation:isolate; }
.wonder-house-galleries,.wonder-stone-foundation { transition:filter 1.6s ease; }
.year-wonder[data-season="holiday"] .wonder-deep-snow { opacity:.7; }
.year-wonder[data-weather="blizzard"] { --wind-from:-2deg; --wind-to:3deg; --wind-speed:2.2s; }
.year-wonder[data-weather="sleet"] { --wind-from:-1deg; --wind-to:1.6deg; --wind-speed:3.4s; }
.year-wonder[data-weather="thaw"] { --wind-from:-.3deg; --wind-to:.6deg; --wind-speed:6.2s; }
.year-wonder[data-weather="snow"] .wonder-deep-snow,
.year-wonder[data-weather="blizzard"] .wonder-deep-snow { opacity:1; }
.year-wonder[data-weather="sleet"] .wonder-deep-snow { opacity:.5; }
.year-wonder[data-weather="thaw"] .wonder-deep-snow { opacity:.26; }
.year-wonder[data-weather="sleet"] .wonder-ice-detail,
.year-wonder[data-weather="thaw"] .wonder-ice-detail { opacity:.85; }
.year-wonder[data-weather="sleet"] .wonder-snow-layer,
.year-wonder[data-weather="thaw"] .wonder-snow-layer { opacity:0!important; }
.year-wonder[data-weather="thaw"] .wonder-snow-caps { opacity:.45; }
.year-wonder[data-weather="blizzard"] .wonder-weather-blizzard { opacity:.95; }
.year-wonder[data-weather="snow"] .wonder-weather-blizzard { opacity:.35; }
.year-wonder[data-weather="sleet"] .wonder-weather-sleet { opacity:.65; }
.year-wonder[data-weather="rain"] .wonder-wet-surfaces,
.year-wonder[data-weather="storm"] .wonder-wet-surfaces,
.year-wonder[data-weather="sleet"] .wonder-wet-surfaces,
.year-wonder[data-weather="thaw"] .wonder-wet-surfaces { opacity:.9; }
.year-wonder[data-weather="rain"] .wonder-downpour { opacity:.2; }
.year-wonder[data-weather="storm"] .wonder-downpour { opacity:.82; }
.year-wonder[data-weather="storm"] .wonder-rain { opacity:.68; }
.year-wonder[data-weather="sleet"] .wonder-rain-sky,
.year-wonder[data-weather="blizzard"] .wonder-rain-sky { opacity:.65; }
.year-wonder[data-weather="rain"] .wonder-weather-clouds { opacity:.45; }
.year-wonder[data-weather="storm"] .wonder-weather-clouds { opacity:.85; }
.year-wonder[data-weather="blizzard"] .wonder-weather-clouds { opacity:.65; }
.year-wonder[data-weather="sleet"] .wonder-weather-clouds { opacity:.55; }
.year-wonder[data-weather="storm"] .wonder-blue-sky { opacity:.25; }
.year-wonder[data-weather="blizzard"] .wonder-sky-sun,
.year-wonder[data-weather="sleet"] .wonder-sky-sun { opacity:0; }
.year-wonder[data-weather="storm"] .wonder-garden-haze,
.year-wonder[data-weather="sleet"] .wonder-garden-haze { opacity:.18; }
.year-wonder[data-weather="blizzard"] .wonder-birds,
.year-wonder[data-weather="sleet"] .wonder-birds { opacity:0; }
.year-wonder[data-time="night"] .wonder-weather-clouds { filter:brightness(.47); }
.year-wonder[data-time="night"]:is([data-weather="rain"],[data-weather="storm"],[data-weather="blizzard"],[data-weather="sleet"]) .wonder-weather-clouds { opacity:.38; }
.year-wonder[data-time="night"] .wonder-deep-snow { filter:brightness(.71) saturate(.65); }
.year-wonder[data-time="night"] .wonder-ice-detail,
.year-wonder[data-time="night"] .wonder-wet-surfaces { filter:brightness(.75); }
.year-wonder[data-weather="storm"] .wonder-lightning { animation:wonder-world-lightning 3.5s .5s both; }
.wonder-storm-cloud { animation:wonder-storm-cloud-drift 12s ease-in-out infinite alternate; }
.wonder-storm-cloud:nth-child(2) { animation-delay:-5s; animation-direction:alternate-reverse; }
.wonder-hard-rain { animation:wonder-downpour-fall var(--rain-speed,.7s) var(--rain-delay,0s) linear infinite; }
.wonder-rain-splash { animation:wonder-rain-splash .9s var(--rain-delay,0s) ease-out infinite; }
.wonder-blizzard-flake { animation:wonder-blizzard-fall var(--flake-duration,4s) var(--flake-delay,0s) linear infinite; }
.wonder-sleet-drop { animation:wonder-sleet-fall var(--rain-speed,1s) var(--rain-delay,0s) linear infinite; }
/* Hide inactive precipitation and suspend its work, rather than animating invisible layers. */
.year-wonder:not([data-weather="snow"]):not([data-weather="blizzard"]) .wonder-weather-blizzard *,
.year-wonder:not([data-weather="sleet"]) .wonder-weather-sleet *,
.year-wonder:not([data-weather="rain"]):not([data-weather="storm"]) .wonder-downpour * { animation-play-state:paused; }
@keyframes wonder-storm-cloud-drift { from{translate:-6px 1px} to{translate:15px -2px} }
@keyframes wonder-downpour-fall { 0%{translate:9px -28px;opacity:0} 13%,80%{opacity:.8} 100%{translate:-27px 93px;opacity:0} }
@keyframes wonder-rain-splash { 0%,100%{opacity:0;translate:0 2px} 30%{opacity:.65;translate:0 -1px} 65%{opacity:.2;translate:0 0} }
@keyframes wonder-blizzard-fall { 0%{translate:24px -40px;opacity:0} 12%,84%{opacity:.9} 100%{translate:-59px 160px;opacity:0} }
@keyframes wonder-sleet-fall { 0%{translate:4px -12px;opacity:0} 15%,79%{opacity:.8} 100%{translate:-15px 89px;opacity:0} }
/* One distant, soft pulse. The section itself never flashes. */
@keyframes wonder-world-lightning { 0%,20%,100%{opacity:0} 31%{opacity:.5} 47%{opacity:.16} 68%{opacity:0} }
@media(prefers-reduced-motion:reduce) {
  .wonder-front-door,.wonder-door-wreath { transform:none!important; }
  .wonder-weather-blizzard,.wonder-weather-sleet,.wonder-downpour,.wonder-lightning { display:none!important; }
}
