.rhso{
  position:fixed;
  inset:0;
  z-index:200;
  display:grid;
  place-items:center;
  padding:24px;
  background:
    radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px) 0 0 / 3px 3px,
    rgba(7,12,21,.72);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  opacity:0;
  transition:opacity .28s ease;
}

.rhso.is-open{
  opacity:1;
}

.rhso[hidden]{
  display:none !important;
}

.rhso__card{
  width:min(420px, 100%);
  text-align:center;
  padding:38px 32px 32px;
  border-radius:24px;
  border:1px solid var(--rh-line2, rgba(255,255,255,.14));
  background:linear-gradient(165deg, #141E33, #0E1626);
  box-shadow:0 40px 110px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.06);
  transform:translateY(14px) scale(.97);
  transition:transform .38s cubic-bezier(.22,1,.36,1);
}

.rhso.is-open .rhso__card{
  transform:none;
}

.rhso__scan{
  position:relative;
  width:132px;
  height:132px;
  margin:0 auto 26px;
  border-radius:50%;
}

.rhso__rings{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  color:var(--rh-blue, #3B8BF6);
  opacity:.42;
}

.rhso__sweep{
  position:absolute;
  inset:0;
  border-radius:50%;
  background:conic-gradient(from 0deg,
    rgba(59,139,246,0) 0deg,
    rgba(59,139,246,0) 250deg,
    rgba(59,139,246,.16) 320deg,
    rgba(59,139,246,.55) 358deg,
    rgba(120,190,255,.85) 360deg);
  -webkit-mask:radial-gradient(circle at 50% 50%, #000 0 63%, transparent 64%);
          mask:radial-gradient(circle at 50% 50%, #000 0 63%, transparent 64%);
  animation:rhso-sweep 1.5s linear infinite;
}

@keyframes rhso-sweep{
  to{ transform:rotate(360deg); }
}

.rhso__blip{
  position:absolute;
  left:50%;
  top:50%;
  width:9px;
  height:9px;
  margin:-4.5px 0 0 -4.5px;
  border-radius:50%;
  background:var(--rh-green, #2FCB72);
  box-shadow:0 0 0 0 rgba(47,203,114,.5);
  transform:translate(var(--bx), var(--by)) scale(0);
  animation:rhso-blip 1.5s ease-out infinite;
  animation-delay:var(--bd);
}

@keyframes rhso-blip{
  0%   { transform:translate(var(--bx), var(--by)) scale(0); opacity:0; }
  14%  { transform:translate(var(--bx), var(--by)) scale(1); opacity:1; box-shadow:0 0 0 0 rgba(47,203,114,.5); }
  60%  { opacity:1; box-shadow:0 0 0 11px rgba(47,203,114,0); }
  100% { transform:translate(var(--bx), var(--by)) scale(1); opacity:.15; }
}

.rhso__core{
  position:absolute;
  left:50%;
  top:50%;
  width:42px;
  height:42px;
  margin:-21px 0 0 -21px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(59,139,246,.16);
  border:1px solid rgba(59,139,246,.4);
  color:var(--rh-blue2, #8FBCFF);
}

.rhso__core svg{
  width:20px;
  height:20px;
  display:block;
}

.rhso__title{
  font-family:var(--rh-display, 'Poppins', sans-serif);
  font-weight:600;
  font-size:20px;
  line-height:1.3;
  letter-spacing:-.01em;
  color:var(--rh-text, #F4F7FC);
  margin:0 0 8px;
}

.rhso__sub{
  font-size:14.5px;
  line-height:1.55;
  color:var(--rh-muted, #A6B1C6);
  margin:0 0 22px;
}

.rhso__bar{
  height:4px;
  border-radius:99px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
}

.rhso__bar i{
  display:block;
  height:100%;
  width:32%;
  border-radius:99px;
  background:linear-gradient(90deg, var(--rh-blue, #3B8BF6), var(--rh-green, #2FCB72));
  animation:rhso-bar 1.25s cubic-bezier(.5,0,.5,1) infinite;
}

@keyframes rhso-bar{
  0%   { transform:translateX(-105%); }
  100% { transform:translateX(320%); }
}

.rhso__step{
  margin:16px 0 0;
  font-family:var(--rh-mono, ui-monospace, monospace);
  font-size:10.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--rh-muted2, #7C889F);
  min-height:1em;
}

@media (max-width: 480px){
  .rhso__card{
    padding:32px 22px 26px;
  }

  .rhso__scan{
    width:112px;
    height:112px;
    margin-bottom:22px;
  }

  .rhso__title{
    font-size:18px;
  }
}

@media (prefers-reduced-motion: reduce){
  .rhso,
  .rhso__card{
    transition:none;
  }

  .rhso__sweep,
  .rhso__blip,
  .rhso__bar i{
    animation:none;
  }

  .rhso__blip{
    transform:translate(var(--bx), var(--by)) scale(1);
    opacity:1;
  }

  .rhso__bar i{
    width:100%;
  }
}