/* Night sky backdrop behind Selected Work, Philosophy and the footer.
   Fixed behind the page; those sections are see-through so it shows. */
.night-bg {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  bottom: auto; height: 100vh; height: 100lvh;   /* one height, so the phone address bar doesn't resize it (see temple.css) */
  opacity: 0; transition: opacity .6s ease;
}
.night-bg.is-on { opacity: 1; }
.night-bg canvas { display: block; width: 100%; height: 100%; }
/* keep text readable: a soft veil over the sky */
.night-bg::after { content: ""; position: absolute; inset: 0; background: rgba(7,7,10,.2); }

.site, .footer { position: relative; z-index: 1; }
.site { background: transparent; }
.footer { background: linear-gradient(to bottom, rgba(7,7,10,.2), rgba(5,4,6,.75)); }
/* the philosophy veil used to fade to solid black at its edges, which cut
   hard bands into the sky; fade to clear instead */
.philosophy::before {
  background: linear-gradient(to bottom, rgba(7,7,10,0) 0%, rgba(7,7,10,0.35) 22%, rgba(7,7,10,0.5) 70%, rgba(7,7,10,0) 100%),
              radial-gradient(ellipse at 30% 50%, rgba(7,7,10,0.1), rgba(7,7,10,0.55) 70%);
}