#appBootSplash{
  position:fixed;
  inset:0;
  z-index:2147483647;
  display:grid;
  place-items:center;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 8% -18%, rgba(255,255,255,.18) 0 24%, rgba(255,255,255,0) 25%),
    linear-gradient(160deg, #7b54f7 0%, #7246f4 46%, #6b3ff1 100%);
  transition:opacity .62s ease, visibility .62s ease;
}

#appBootSplash.isDone{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.bootGhostMark{
  position:absolute;
  display:block;
  width:clamp(390px, 62vw, 860px);
  aspect-ratio:1;
  opacity:.1;
  pointer-events:none;
}

.bootGhostMark img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.bootGhostMark--top{
  left:clamp(-320px, -22vw, -110px);
  top:clamp(-250px, -22vw, -100px);
  transform:rotate(-9deg);
}

.bootGhostMark--bottom{
  right:clamp(-360px, -24vw, -130px);
  bottom:clamp(-350px, -28vw, -160px);
  transform:rotate(8deg);
}

.bootSplashInner{
  position:relative;
  z-index:1;
  width:100%;
  min-height:100vh;
  min-height:100svh;
  padding:clamp(28px, 7vw, 72px);
}

.bootLogoWrap{
  position:absolute;
  left:50%;
  top:48%;
  display:grid;
  place-items:center;
  width:clamp(220px, 34vw, 430px);
  aspect-ratio:1;
  opacity:1;
  transform:translate(-50%, -50%) scale(.94);
  animation:bootLogoIn .86s cubic-bezier(.22, 1, .36, 1) .12s forwards;
}

.bootMark{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 24px 44px rgba(36, 14, 126, .18));
}

.bootStepLoader{
  position:absolute;
  left:50%;
  bottom:clamp(58px, 9vh, 118px);
  display:grid;
  grid-template-columns:auto minmax(78px, 1fr) auto minmax(78px, 1fr) auto;
  align-items:center;
  width:min(68vw, 620px);
  min-width:320px;
  transform:translateX(-50%);
}

.bootStepIcon{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  width:clamp(74px, 9vw, 108px);
  aspect-ratio:208 / 178;
  opacity:1;
  transform:none;
  transform-origin:center;
}

.bootStepIcon img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 18px 34px rgba(48, 19, 142, .18));
}

.bootConnector{
  position:relative;
  height:22px;
  margin:0 -1px;
  overflow:hidden;
}

.bootConnectorFill{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:4px;
  border-radius:999px;
  transform:translateY(-50%);
}

.bootConnectorFill{
  display:block;
  background:repeating-linear-gradient(90deg, rgba(255,255,255,.98) 0 12px, rgba(255,255,255,0) 12px 24px);
  box-shadow:0 0 14px rgba(255,255,255,.28);
  clip-path:inset(0 100% 0 0);
  transform:translateY(-50%);
  animation:bootLineLoad 2.55s cubic-bezier(.45, 0, .2, 1) infinite;
  will-change:clip-path, opacity;
}

.bootConnector--two .bootConnectorFill{
  animation-delay:.85s;
}

@keyframes bootLogoIn{
  to{ transform:translate(-50%, -50%) scale(1); }
}

@keyframes bootLineLoad{
  0%{ clip-path:inset(0 100% 0 0); opacity:.35; }
  32%{ clip-path:inset(0 0 0 0); opacity:1; }
  55%, 100%{ clip-path:inset(0 0 0 0); opacity:.72; }
}

@media (max-width: 640px){
  .bootGhostMark{
    width:clamp(380px, 96vw, 720px);
  }

  .bootGhostMark--top{
    left:-46vw;
    top:-18vh;
  }

  .bootGhostMark--bottom{
    right:-54vw;
    bottom:-19vh;
  }

  .bootLogoWrap{
    top:47%;
    width:clamp(250px, 58vw, 390px);
  }

  .bootStepLoader{
    width:min(82vw, 470px);
    min-width:0;
    grid-template-columns:auto minmax(48px, 1fr) auto minmax(48px, 1fr) auto;
    bottom:clamp(70px, 9.5vh, 110px);
  }

  .bootStepIcon{
    width:clamp(70px, 18vw, 94px);
  }
}

@media (max-width: 380px){
  .bootStepLoader{
    width:88vw;
    grid-template-columns:auto minmax(34px, 1fr) auto minmax(34px, 1fr) auto;
  }

  .bootStepIcon{
    width:64px;
  }
}

@media (prefers-reduced-motion: reduce){
  #appBootSplash,
  .bootLogoWrap,
  .bootConnectorFill{
    animation:none;
    transition:opacity .2s ease, visibility .2s ease;
  }

  .bootLogoWrap{
    opacity:1;
    transform:translate(-50%, -50%) scale(1);
  }

  .bootConnectorFill{
    opacity:.85;
    clip-path:inset(0);
    transform:translateY(-50%) scaleX(1);
  }
}