html.kpw-white-lock,
body.kpw-white-lock{
  overflow:hidden!important;
}

#kpw-white-preloader{
  --orange:#f45112;
  --orange2:#ff7132;
  position:fixed;
  inset:0;
  z-index:99999999;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 14% 16%,rgba(244,81,18,.22),transparent 26%),
    radial-gradient(circle at 86% 82%,rgba(255,255,255,.05),transparent 22%),
    linear-gradient(135deg,#071014 0%,#102129 52%,#081116 100%);
  opacity:1;
  visibility:visible;
  transition:opacity .55s ease,visibility .55s ease;
}

#kpw-white-preloader.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.kpw-white-grid{
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:46px 46px;
  animation:kpwWhiteGrid 22s linear infinite;
  opacity:.72;
}

.kpw-white-glow{
  position:absolute;
  border-radius:50%;
  filter:blur(14px);
  pointer-events:none;
}

.kpw-white-glow-one{
  width:360px;
  height:360px;
  left:-125px;
  top:-120px;
  background:radial-gradient(circle,rgba(244,81,18,.26),rgba(244,81,18,0));
  animation:kpwWhiteGlow 7s ease-in-out infinite;
}

.kpw-white-glow-two{
  width:420px;
  height:420px;
  right:-165px;
  bottom:-170px;
  background:radial-gradient(circle,rgba(244,81,18,.17),rgba(244,81,18,0));
  animation:kpwWhiteGlow 8.5s ease-in-out infinite reverse;
}

.kpw-white-content{
  position:relative;
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:28px;
}

.kpw-white-stage{
  position:relative;
  width:430px;
  height:270px;
  display:grid;
  place-items:center;
}

.kpw-white-ring{
  position:absolute;
  border-radius:50%;
}

.kpw-white-ring-outer{
  width:270px;
  height:270px;
  left:80px;
  top:0;
  background:
    conic-gradient(
      from 0deg,
      var(--orange) 0deg 62deg,
      transparent 62deg 104deg,
      #fff 104deg 148deg,
      transparent 148deg 205deg,
      var(--orange2) 205deg 260deg,
      transparent 260deg 308deg,
      #fff 308deg 348deg,
      transparent 348deg 360deg
    );
  padding:2px;
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  filter:drop-shadow(0 0 14px rgba(244,81,18,.28));
  animation:kpwWhiteSpin 3s linear infinite;
}

.kpw-white-ring-inner{
  width:220px;
  height:220px;
  left:105px;
  top:25px;
  border:1px dashed rgba(255,255,255,.24);
  animation:kpwWhiteSpin 6.8s linear infinite reverse;
}

.kpw-white-logo-card{
  position:relative;
  z-index:4;
  width:390px;
  min-height:155px;
  display:grid;
  place-items:center;
  padding:22px 28px;
  border-radius:28px;
  background:
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.07),transparent 34%),
    rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:
    0 26px 62px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(12px);
  animation:kpwWhiteLogoFloat 3.4s ease-in-out infinite;
}

.kpw-white-logo{
  width:100%;
  max-width:340px;
  height:auto;
  object-fit:contain;
}

.kpw-white-dot{
  position:absolute;
  z-index:5;
  width:9px;
  height:9px;
  border-radius:50%;
}

.kpw-white-dot-one{
  top:22px;
  left:90px;
  background:var(--orange);
  box-shadow:0 0 18px rgba(244,81,18,.95);
  animation:kpwWhitePulse 1.5s ease-in-out infinite;
}

.kpw-white-dot-two{
  right:94px;
  bottom:25px;
  background:#fff;
  box-shadow:0 0 18px rgba(255,255,255,.8);
  animation:kpwWhitePulse 1.5s ease-in-out infinite .65s;
}

.kpw-white-caption{
  margin-top:22px;
}

.kpw-white-caption strong{
  display:block;
  color:var(--orange);
  font:900 17px/1.2 Arial,sans-serif;
  letter-spacing:3px;
}

.kpw-white-caption span{
  display:block;
  margin-top:7px;
  color:#d3dbe0;
  font:400 12px/1.4 Arial,sans-serif;
  letter-spacing:.8px;
}

.kpw-white-progress{
  width:210px;
  height:3px;
  margin-top:20px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.09);
}

.kpw-white-progress span{
  display:block;
  width:46%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,transparent,var(--orange),#fff,var(--orange2),transparent);
  animation:kpwWhiteLoading 1.25s ease-in-out infinite;
}

@keyframes kpwWhiteSpin{
  to{transform:rotate(360deg)}
}

@keyframes kpwWhiteGrid{
  to{background-position:46px 46px,46px 46px}
}

@keyframes kpwWhiteGlow{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(24px,18px) scale(1.06)}
}

@keyframes kpwWhiteLogoFloat{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-7px) scale(1.012)}
}

@keyframes kpwWhitePulse{
  0%,100%{opacity:.5;transform:scale(.7)}
  50%{opacity:1;transform:scale(1.25)}
}

@keyframes kpwWhiteLoading{
  0%{transform:translateX(-130%)}
  100%{transform:translateX(330%)}
}

@media(max-width:600px){
  .kpw-white-stage{
    width:330px;
    height:225px;
  }

  .kpw-white-ring-outer{
    width:225px;
    height:225px;
    left:52px;
  }

  .kpw-white-ring-inner{
    width:185px;
    height:185px;
    left:72px;
    top:20px;
  }

  .kpw-white-logo-card{
    width:300px;
    min-height:125px;
    padding:18px 20px;
  }

  .kpw-white-logo{
    max-width:260px;
  }

  .kpw-white-dot-one{left:62px}
  .kpw-white-dot-two{right:65px}
}

@media(prefers-reduced-motion:reduce){
  #kpw-white-preloader *{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
  }
}