/* Dark Duja blue backdrops for the login and guest pages. */
:is(.login-screen,.invite-page,.ticket-page){
  isolation:isolate;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 13% 12%,#2b68a0a8,transparent 37%),
    radial-gradient(circle at 88% 78%,#1e5088a8,transparent 39%),
    linear-gradient(145deg,#091c35,#123a66 53%,#07182e)!important;
}
.login-screen{position:relative}
:is(.login-screen,.invite-page,.ticket-page)::before,
:is(.login-screen,.invite-page,.ticket-page)::after{
  content:"";
  position:fixed;
  inset:-12%;
  z-index:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  pointer-events:none;
}
:is(.login-screen,.invite-page,.ticket-page)::before{
  background:
    radial-gradient(circle 270px at var(--duja-pointer-x,50%) var(--duja-pointer-y,50%),#79b4e433,transparent 76%),
    radial-gradient(ellipse at 15% 20%,#387bb875,transparent 34%),
    radial-gradient(ellipse at 86% 76%,#225b9870,transparent 32%);
  animation:duja-background-drift 23s ease-in-out infinite;
  will-change:transform;
}
:is(.login-screen,.invite-page,.ticket-page)::after{
  background:
    radial-gradient(ellipse at 78% 18%,#5c9ed555,transparent 30%),
    radial-gradient(ellipse at 20% 84%,#3279b14d,transparent 35%);
  opacity:.65;
  animation:duja-background-light 19s ease-in-out infinite;
}
.login-screen>.login-card,.invite-page>.invite-shell,.ticket-page>.guest-card{position:relative;z-index:1}
.invite-page .invite-intro{
  background:
    radial-gradient(ellipse at 88% 10%,#76add34f,transparent 45%),
    radial-gradient(ellipse at 10% 86%,#3a78ae70,transparent 44%),
    linear-gradient(150deg,#0b2343,#17477d 60%,#245d9b)!important;
}
.invite-page .invite-intro::after{content:none}
.ticket-page .guest-card::before{
  background:
    radial-gradient(ellipse at 84% 12%,#7ab2d65c,transparent 38%),
    linear-gradient(145deg,#0b2648,#174b80 62%,#245d9b)!important;
}
@keyframes duja-background-drift{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(2.5vw,-2vh,0) scale(1.055)}
}
@keyframes duja-background-light{
  0%,100%{opacity:.5;transform:translate3d(0,0,0)}
  50%{opacity:.76;transform:translate3d(-12px,9px,0)}
}
@media(max-width:600px){
  :is(.login-screen,.invite-page,.ticket-page)::before{inset:-8%}
  :is(.login-screen,.invite-page,.ticket-page)::after{opacity:.5}
}
@media(prefers-reduced-motion:reduce){
  :is(.login-screen,.invite-page,.ticket-page)::before,
  :is(.login-screen,.invite-page,.ticket-page)::after{animation:none;will-change:auto}
}