/* Sky town behind the landing's bots (sky.js). Outlines are solid mixes of ink into paper, so overlapping
   shapes never double up; fills use paper so nearer shapes hide farther ones. */
.sky{position:absolute;inset:0;overflow:hidden;pointer-events:none;
 --sky-far:color-mix(in srgb,var(--ink) 9%,var(--paper));
 --sky-mid:color-mix(in srgb,var(--ink) 14%,var(--paper));
 --sky-near:color-mix(in srgb,var(--ink) 20%,var(--paper));
 --sky-town:color-mix(in srgb,var(--ink) 12%,var(--paper));
 --sky-window:color-mix(in srgb,var(--eye) 28%,var(--paper))}
@media (prefers-color-scheme: dark){
 .sky{--sky-far:color-mix(in srgb,var(--ink) 11%,var(--paper));
  --sky-mid:color-mix(in srgb,var(--ink) 16%,var(--paper));
  --sky-near:color-mix(in srgb,var(--ink) 22%,var(--paper));
  --sky-town:color-mix(in srgb,var(--ink) 15%,var(--paper));
  --sky-window:color-mix(in srgb,var(--eye) 75%,var(--paper))}
}
.sky-layer{position:absolute;inset:0;transform:translate(calc(var(--px,0) * var(--depth) * 1px),calc(var(--py,0) * var(--depth) * .5px));transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.sky-line{fill:var(--sky-color);stroke:var(--sky-color)}
.sky-fill{fill:var(--paper)}

.sky-cloud{position:absolute;left:0;top:0;translate:var(--rest) var(--y);animation:sky-drift var(--dur) linear var(--delay) infinite}
.sky-depth-0{--sky-color:var(--sky-far)}
.sky-depth-1{--sky-color:var(--sky-mid)}
.sky-depth-2{--sky-color:var(--sky-near)}
@keyframes sky-drift{from{translate:var(--from) var(--y)}to{translate:var(--to) var(--y)}}

.sky-town{position:absolute;left:0;bottom:0;overflow:visible;--sky-color:var(--sky-town)}
.sky-win{fill:var(--sky-window);opacity:0}
.sky-win.is-on{opacity:1}
.sky-blink{animation:sky-blink var(--dur) steps(1) var(--delay) infinite}
@keyframes sky-blink{50%{opacity:0}}
.sky.is-party .sky-win{opacity:1;fill:var(--eye);animation:none}

/* Stars only at night. */
.sky-stars{display:none}
@media (prefers-color-scheme: dark){.sky-stars{display:block}}
.sky-star{position:absolute;width:var(--s);height:var(--s);background:var(--ink);opacity:.55;animation:sky-twinkle var(--dur) steps(1) var(--delay) infinite}
.sky-star.is-plus{box-shadow:var(--s) 0 0 0 var(--ink),calc(var(--s) * -1) 0 0 0 var(--ink),0 var(--s) 0 0 var(--ink),0 calc(var(--s) * -1) 0 0 var(--ink)}
@keyframes sky-twinkle{50%{opacity:.12}}

@media (prefers-reduced-motion: reduce){
 .sky-cloud,.sky-blink,.sky-star{animation:none}
}