/* Only these small decorative layers move. No transform is applied to wallpaper. */
.wallpaper-atmosphere {
  position: fixed;
  inset: calc(var(--top) + var(--tabs)) 0 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  contain: layout paint style;
  opacity: 0;
  --wm-bird-ink: #182c42;
  --wm-mote-ink: #fff2b8;
}
.wallpaper-atmosphere[data-active="true"] { opacity: 1; }
.wallpaper-atmosphere *, .wallpaper-atmosphere *::before, .wallpaper-atmosphere *::after { animation-play-state: paused !important; }
.wallpaper-atmosphere[data-active="true"] *, .wallpaper-atmosphere[data-active="true"] *::before, .wallpaper-atmosphere[data-active="true"] *::after { animation-play-state: running !important; }
.wm-clouds { position: absolute; inset: 0; overflow: hidden; }
.wallpaper-atmosphere .wm-cloud { position: absolute; width: 65%; height: 21%; fill: #fff; stroke: none; filter: blur(4px); opacity: .34; transform-origin: center; }
.wm-cloud-1 { top: 2%; left: -10%; animation: wm-cloud-drift 29s ease-in-out -9s infinite alternate; }
.wm-cloud-2 { top: 15%; left: 45%; width: 58% !important; opacity: .25 !important; animation: wm-cloud-drift 37s ease-in-out -20s infinite alternate-reverse; }
@keyframes wm-cloud-drift { from { transform: translate3d(-7vw,0,0); } to { transform: translate3d(13vw,-1.8vh,0); } }
.wm-flock { position: absolute; top: 15%; left: 52%; width: clamp(135px,17vw,235px); height: 65px; opacity: .62; animation: wm-flock-travel 26s linear -8s infinite alternate; }
.wallpaper-atmosphere .wm-bird { position: absolute; width: 15px; height: 12px; fill: none; stroke: var(--wm-bird-ink); stroke-width: 1.35; stroke-linecap: round; overflow: visible; animation: wm-bird-bob 4s ease-in-out infinite alternate; }
.wm-bird-1 { left: 0; top: 22px; }
.wm-bird-2 { left: 38px; top: 9px; width: 12px !important; animation-delay: -.7s !important; }
.wm-bird-3 { left: 77px; top: 30px; width: 13px !important; animation-delay: -1.5s !important; }
.wm-bird-4 { left: 117px; top: 6px; width: 11px !important; animation-delay: -2.1s !important; }
.wm-bird-5 { left: 153px; top: 21px; width: 10px !important; animation-delay: -.4s !important; }
.wm-wing { transform-box: view-box; }
.wm-wing-left { transform-origin: 50% 72%; animation: wm-wing-left 1.35s ease-in-out infinite; }
.wm-wing-right { transform-origin: 50% 72%; animation: wm-wing-right 1.35s ease-in-out infinite; }
.wm-bird-2 .wm-wing, .wm-bird-5 .wm-wing { animation-delay: -.45s; }
.wm-bird-3 .wm-wing, .wm-bird-4 .wm-wing { animation-delay: -.85s; }
@keyframes wm-flock-travel { from { transform: translate3d(-20vw,0,0); } to { transform: translate3d(14vw,-2.5vh,0); } }
@keyframes wm-bird-bob { to { translate: 0 -5px; } }
@keyframes wm-wing-left { 0%,100% { rotate: -13deg; } 50% { rotate: 23deg; } }
@keyframes wm-wing-right { 0%,100% { rotate: 13deg; } 50% { rotate: -23deg; } }
.wm-mist { position: absolute; left: 15%; top: 48%; width: 77%; height: 14%; opacity: .21; background: radial-gradient(ellipse at 33% 55%,#e5f0f5a6,transparent 49%),radial-gradient(ellipse at 72% 35%,#e1edf066,transparent 47%); filter: blur(10px); animation: wm-mist-drift 23s ease-in-out -7s infinite alternate; }
@keyframes wm-mist-drift { from { transform: translate3d(-3vw,0,0); opacity: .14; } to { transform: translate3d(6vw,-1.2vh,0); opacity: .3; } }
.wm-motes, .wm-glints { position: absolute; inset: 0; }
.wm-mote { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: var(--wm-mote-ink); box-shadow: 0 0 5px var(--wm-mote-ink); opacity: .35; animation: wm-mote-float 14s ease-in-out infinite alternate; }
.wm-mote-1 { left: 8%; top: 39%; animation-delay: -3s; }
.wm-mote-2 { left: 18%; top: 68%; width: 2px; height: 2px; animation-delay: -9s; }
.wm-mote-3 { left: 35%; top: 21%; animation-delay: -5s; }
.wm-mote-4 { left: 70%; top: 44%; width: 2px; height: 2px; animation-delay: -11s; }
.wm-mote-5 { left: 85%; top: 69%; animation-delay: -6s; }
.wm-mote-6 { left: 93%; top: 28%; width: 2px; height: 2px; animation-delay: -1s; }
@keyframes wm-mote-float { 0% { transform: translate3d(-7px,25px,0); opacity: .12; } 52% { opacity: .62; } 100% { transform: translate3d(19px,-30px,0); opacity: .3; } }
.wm-glint { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--wm-mote-ink); box-shadow: 0 0 9px var(--wm-mote-ink); animation: wm-glint 5s ease-in-out infinite alternate; }
.wm-glint-1 { left: 14%; top: 15%; animation-delay: -2s; }
.wm-glint-2 { left: 46%; top: 8%; animation-delay: -4s; width: 2px; height: 2px; }
.wm-glint-3 { left: 78%; top: 20%; animation-delay: -1s; width: 2px; height: 2px; }
.wm-glint-4 { left: 91%; top: 11%; animation-delay: -3s; }
@keyframes wm-glint { from { opacity: .12; transform: scale(.6); } to { opacity: .75; transform: scale(1.2); } }
.wallpaper-atmosphere .wm-strokes { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: var(--accent); stroke-width: 1.6; opacity: .33; overflow: visible; }
.wm-strokes path { stroke-dasharray: 90 1100; animation: wm-stroke-flow 13s linear infinite; }
.wm-strokes path:nth-child(2) { animation-duration: 19s; animation-direction: reverse; opacity: .55; }
.wm-strokes path:nth-child(3) { animation-duration: 17s; animation-delay: -8s; opacity: .4; }
@keyframes wm-stroke-flow { from { stroke-dashoffset: 1190; } to { stroke-dashoffset: 0; } }
.wallpaper-atmosphere[data-profile="dusk"] { --wm-bird-ink: #4b2849; }
.wallpaper-atmosphere[data-profile="dusk"] .wm-cloud { fill: #ffdab5; opacity: .22; }
.wallpaper-atmosphere[data-profile="night"] { --wm-mote-ink: #c6dbff; }
.wallpaper-atmosphere[data-profile="night"] .wm-mist { top: 59%; opacity: .12; }
.wallpaper-atmosphere[data-profile="abstract"] .wm-glints { opacity: .5; }
.wallpaper-atmosphere[data-profile="courtyard"], .wallpaper-atmosphere[data-profile="earth"] { --wm-mote-ink: #ffd59b; }
.wallpaper-atmosphere[data-profile="courtyard"] .wm-glint { width: 5px; height: 5px; opacity: .2; box-shadow: 0 0 16px 3px #f3d38d55; }
.wallpaper-atmosphere[data-profile="earth"] .wm-glints { opacity: .35; }
.wallpaper-atmosphere[data-sky="right"] .wm-cloud-1 { left: 42%; top: 1%; width: 42%; height: 18%; }
.wallpaper-atmosphere[data-sky="right"] .wm-cloud-2 { display: none; }
.wallpaper-atmosphere[data-sky="right"] .wm-flock { left: 64%; top: 13%; animation-name: wm-flock-right; }
@keyframes wm-flock-right { from { transform: translate3d(-4vw,0,0); } to { transform: translate3d(12vw,-1.2vh,0); } }
.wallpaper-atmosphere[data-sky="shallow"] .wm-cloud { top: 0; height: 13%; }
.wallpaper-atmosphere[data-sky="shallow"] .wm-cloud-2 { top: 3%; }
.wallpaper-atmosphere[data-sky="shallow"] .wm-flock { top: 7%; }
@media (max-width: 600px) {
  .wallpaper-atmosphere .wm-cloud { width: 105%; height: 17%; opacity: .25; }
  .wm-cloud-2 { left: 45%; width: 90% !important; }
  .wm-flock { top: 12%; left: 32%; scale: .72; transform-origin: left center; }
  .wallpaper-atmosphere[data-sky="right"] .wm-flock { left: 47%; }
  .wallpaper-atmosphere[data-sky="right"] .wm-cloud-1 { left: 30%; width: 65%; }
  .wm-mote-2, .wm-mote-5, .wm-bird-5 { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .wallpaper-atmosphere { opacity: 0 !important; }
  .wallpaper-atmosphere *, .wallpaper-atmosphere *::before, .wallpaper-atmosphere *::after { animation: none !important; }
}