/* The scene belongs to the complete page, not the viewport. Both its content
   and symbols move together in the homepage and learner document scrollers. */
.volt-learning-backdrop {
  --volt-art-opacity:1;
  display:none;
  position:absolute;
  inset:0;
  z-index:-1;
  overflow:hidden;
  pointer-events:none;
  user-select:none;
  background:#14101e;
}
.kk-release > .volt-learning-backdrop--home { display:block; }
.volt-learning-backdrop__light {
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 60vw 900px at -10% 250px,#e8a95c12,transparent 85%),
    radial-gradient(ellipse 55vw 1100px at 110% 1900px,#b294e517,transparent 85%),
    radial-gradient(ellipse 70vw 1100px at -5% 4300px,#c78e5310,transparent 85%),
    radial-gradient(ellipse 60vw 1200px at 105% 6900px,#b294e512,transparent 85%),
    linear-gradient(110deg,#181320,#14101e 45%,#181222);
}
.volt-learning-backdrop__art {
  position:absolute;
  inset:0;
  background-image:url('/volt-learning-backdrop.svg');
  background-size:100% auto;
  background-position:center top;
  background-repeat:repeat-y;
  opacity:var(--volt-art-opacity);
}
@media(max-width:760px) {
  .volt-learning-backdrop { --volt-art-opacity:.58; }
  .volt-learning-backdrop__art { background-image:url('/volt-learning-backdrop-mobile.svg'); }
  .volt-learning-backdrop__light { background:radial-gradient(ellipse 110% 1000px at 100% 500px,#aa80ca12,transparent 85%),radial-gradient(ellipse 100% 1200px at 0% 2800px,#d39d5211,transparent 85%),#14101e; }
}
/* The long transparent artwork continues seamlessly on expanded chapters.
   It is never stretched to the page height, animated or attached to a viewport. */