/* The sign-in background, lifted verbatim from edge.dolvero.com.
   Sign-in and the app are one space, and the Board is the third door into it; the ground must not change
   tone when somebody crosses between them. This is the same layer stack edge uses — a WebGL aurora with
   CSS blobs underneath as the fallback — with only the auth page's own form styling left behind.
   The tokens the layers reference are declared here so the file does not depend on auth.css. */
:root{--ink:#070b13;--theme-dur:900ms;--theme-ease:cubic-bezier(.32,.72,0,1)}
:root[data-theme="light"]{--ink:#eef3fd}
.bg,.bg__scrim,.bg__vignette,.bg__grid{
  transition:background-color var(--theme-dur) var(--theme-ease),
             opacity var(--theme-dur) var(--theme-ease),
             filter var(--theme-dur) var(--theme-ease)}

:root[data-theme="light"] .bg__grid{
  background-image:radial-gradient(circle, rgba(20,45,110,.10) 1px, transparent 1px)}
:root[data-theme="light"] .bg__aurora{opacity:1;filter:blur(64px) saturate(1.45)}
:root[data-theme="light"] .bg__canvas{opacity:0}
:root[data-theme="light"] .bg__canvas.is-live{opacity:1;filter:saturate(1.6) contrast(1.08)}
.bg{position:fixed;inset:0;z-index:0;overflow:hidden;
  
  background:radial-gradient(125% 95% at 50% 4%, #16294a 0%, #0e1b35 40%, #0a1222 74%, var(--ink) 100%)}
.bg__canvas{position:absolute;inset:0;width:100%;height:100%;display:block;
  opacity:0;transition:opacity 1.1s ease}
.bg__canvas.is-live{opacity:1}
body.gl-on .bg__aurora{display:none}
.bg__scrim{position:absolute;inset:0;background:
  radial-gradient(58% 46% at 50% 46%, rgba(7,17,42,.78) 0%, rgba(7,17,42,.40) 48%, transparent 76%)}
.bg__aurora{position:absolute;inset:-25%;filter:blur(90px);opacity:.92}
:root[data-theme="light"] .bg__scrim,
:root[data-theme="light"] .bg__vignette{background:none}
.bg__day{position:absolute;inset:0;opacity:0;
  transition:opacity var(--theme-dur) var(--theme-ease);
  background:
    
    radial-gradient(125% 92% at 50% 40%, transparent 22%, rgba(96,142,222,.66) 100%),
    
    radial-gradient(54% 42% at 50% 44%,
      rgba(255,255,255,.40) 0%, rgba(255,255,255,.20) 50%, rgba(255,255,255,0) 80%),
    
    radial-gradient(120% 95% at 50% -10%,
      rgba(233,242,255,.44) 0%,
      rgba(203,224,252,.42) 38%,
      rgba(172,203,248,.38) 72%,
      rgba(146,185,243,.34) 100%);
}
:root[data-theme="light"] .bg__day{opacity:1}
@media (prefers-reduced-motion: reduce){
.bg__day{transition:none}
}
.blob{position:absolute;border-radius:50%;mix-blend-mode:screen;
  will-change:transform;transform:translateZ(0);backface-visibility:hidden}
.blob--a{width:68vmax;height:68vmax;left:-14%;top:-16%;
  background:radial-gradient(circle at 34% 34%, rgba(37,84,212,.92) 0%, rgba(37,84,212,.34) 42%, transparent 68%);
  animation:driftA 52s ease-in-out infinite}
.blob--b{width:58vmax;height:58vmax;right:-12%;top:6%;
  background:radial-gradient(circle at 60% 40%, rgba(79,125,240,.78) 0%, rgba(79,125,240,.24) 44%, transparent 70%);
  animation:driftB 64s ease-in-out infinite}
.blob--c{width:52vmax;height:52vmax;left:16%;bottom:-24%;
  background:radial-gradient(circle at 50% 50%, rgba(147,184,255,.44) 0%, rgba(74,111,165,.18) 46%, transparent 72%);
  animation:driftC 46s ease-in-out infinite}
.blob--d{width:38vmax;height:38vmax;left:44%;top:26%;
  background:radial-gradient(circle at 50% 50%, rgba(28,47,79,.9) 0%, rgba(28,47,79,.3) 50%, transparent 74%);
  animation:driftD 58s ease-in-out infinite}
@keyframes driftA{0%,100%{transform:translate3d(0,0,0) scale(1)}33%{transform:translate3d(7vw,5vh,0) scale(1.12)}66%{transform:translate3d(-4vw,9vh,0) scale(.94)}}
@keyframes driftB{0%,100%{transform:translate3d(0,0,0) scale(1.04)}40%{transform:translate3d(-9vw,7vh,0) scale(.9)}70%{transform:translate3d(-3vw,-6vh,0) scale(1.16)}}
@keyframes driftC{0%,100%{transform:translate3d(0,0,0) scale(.98)}50%{transform:translate3d(9vw,-8vh,0) scale(1.18)}}
@keyframes driftD{0%,100%{transform:translate3d(0,0,0) scale(1)}45%{transform:translate3d(-8vw,4vh,0) scale(1.2)}80%{transform:translate3d(5vw,-5vh,0) scale(.92)}}
.bg__grid{position:absolute;inset:0;
  background-image:radial-gradient(circle, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:22px 22px;
  -webkit-mask-image:radial-gradient(115% 85% at 50% 45%, #000 35%, transparent 78%);
  mask-image:radial-gradient(115% 85% at 50% 45%, #000 35%, transparent 78%)}
.bg__vignette{position:absolute;inset:0;
  background:radial-gradient(105% 75% at 50% 45%, transparent 38%, rgba(5,12,30,.74) 100%)}
body.is-paused .blob{animation-play-state:paused}
@media (prefers-reduced-motion: reduce){
.blob{animation:none}
}
@keyframes v2Rise {from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none}}
@keyframes v2Mark {from{opacity:0;transform:translateY(9px) scale(.9)} to{opacity:1;transform:none}}
@keyframes v2Fwd  {from{opacity:0;transform:translateX(18px)} to{opacity:1;transform:none}}
@keyframes v2Back {from{opacity:0;transform:translateX(-18px)} to{opacity:1;transform:none}}
@keyframes v2Text {from{opacity:0;transform:translateY(5px)} to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes v2Tick{to{stroke-dashoffset:0}}
@keyframes v2Recede{to{opacity:0;transform:translateY(-8px) scale(.985)}}
@keyframes v2WelcomeIn{from{opacity:0;transform:translateY(7px)} to{opacity:1;transform:none}}

/* The Board's own sign-in card sits on top of it. login.css paints its own ground, which would hide the
   whole stack, so here it steps aside and the card lifts above the canvas. */
body{background:transparent !important}
body::before{display:none !important}
.login-container{position:relative;z-index:1}
