/* Pixless Media: one wide, soft RGB light drifting slowly across a black background (all pages) */
.lights{position:fixed;inset:0;z-index:-1;overflow:hidden;background:#000;opacity:.2;pointer-events:none}

/* the old individual beams are not used any more */
.lights .rb{display:none}

/* the light: a wide red > green > blue band that fades out softly on both sides */
.lights::before{content:"";position:absolute;top:-10%;right:0;width:85vw;height:130%;transform-origin:top right;transform:translateX(30vw) rotate(10deg);will-change:transform;filter:blur(50px);
  background:linear-gradient(90deg,transparent 0,rgba(255,31,45,.95) 22%,rgba(18,224,74,.95) 50%,rgba(42,70,255,.95) 78%,transparent 100%);
  animation:lights-drift 90s ease-in-out infinite alternate}
@keyframes lights-drift{from{transform:translateX(30vw) rotate(10deg)}to{transform:translateX(-45vw) rotate(10deg)}}

/* soft black fade on the bottom and left edges: the light seems to come from the top-right corner */
.lights::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,#000 0,#000 12%,rgba(0,0,0,.8) 25%,rgba(0,0,0,.45) 40%,rgba(0,0,0,.18) 55%,transparent 68%),linear-gradient(to right,#000 0,#000 2%,rgba(0,0,0,.7) 12%,rgba(0,0,0,.3) 22%,transparent 32%)}

@media(prefers-reduced-motion:reduce){.lights::before{animation:none}}
:root[data-theme=light] .lights{background:#fff;opacity:.34}
:root[data-theme=light] .lights::after{background:linear-gradient(to top,#fff 0,#fff 12%,rgba(255,255,255,.8) 25%,rgba(255,255,255,.45) 40%,rgba(255,255,255,.18) 55%,transparent 68%),linear-gradient(to right,#fff 0,#fff 2%,rgba(255,255,255,.7) 12%,rgba(255,255,255,.3) 22%,transparent 32%)}