 body {
    overflow: hidden;
    height: 100vh;
    width: 100vw;
    margin: 0;
  }

  #sm-connect, #sm-loading {
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 999999;
    user-select: none;
    overflow: hidden;
    display: flex;
    justify-items: center;
    justify-content: center;
    align-items: center;
    background: white;
  }

  #sm-connect > div, #sm-loading > div {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    background: #fff;
    padding: 0 50px 8px;
    height: 100px !important;
    border-radius: 8px;
    width: 190px;
    box-shadow: 0 0 4px rgba(121, 90, 213, 0.5);
  }
  #sm-connect  {
    background: #ffffff9e !important;
  }
  
  #error {
    color: red;
    display: none;
  }

  .connect-block {
    --main-color: #7948a1;
    --highlight-color: #b89ee8;
    --bullet: 25%;
    --size: 7px;
  }

  .connect-block span {
    float: left;
    margin: 0 calc(var(--size) / 1.4);
    width: var(--size);
    height: var(--size);
    transition: transform .2s ease-in-out, background .2s ease;
    -webkit-transition: transform .2s ease-in-out, background .2s ease;
    -moz-transition: transform .2s ease-in-out, background .2s ease;
    animation-iteration-count: infinite;
    animation-name: highlight;
    animation-duration: 1.2s;
    border-radius: var(--bullet);
    background: var(--main-color);
  }

  .connect-block span:nth-of-type(1) {
    animation-delay: 0s;
  }

  .connect-block span:nth-of-type(2) {
    animation-delay: .1s;
  }

  .connect-block span:nth-of-type(3) {
    animation-delay: .2s;
  }

  .connect-block span:nth-of-type(4) {
    animation-delay: .3s;
  }

  .connect-block span:nth-of-type(5) {
    animation-delay: .4s;
  }

  .connect-block span:nth-of-type(6) {
    animation-delay: .5s;
  }

  .connect-block span:nth-of-type(7) {
    animation-delay: .6s;
  }

  .connect-block span:nth-of-type(8) {
    animation-delay: .7s;
  }

  .connect-block span:nth-of-type(9) {
    animation-delay: .8s;
  }

  .connect-block span:nth-of-type(10) {
    animation-delay: .9s;
  }

  .connect-block span:nth-of-type(11) {
    animation-delay: 1s;
  }

  .connect-block span:nth-of-type(12) {
    animation-delay: 1.1s;
  }

  @keyframes highlight {
    0% {
      transform: scale(1, 1);
    }
    50% {
      transform: scale(2.1, 2.1);
      background: var(--highlight-color);
    }
    100% {
      transform: scale(1, 1);
    }
  }
