main {
    width: 500px;
    height: 310px;
    position: relative;
  }
  div {
    display: none;
    position: absolute;
    will-change: offset-distance;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: hsl(313,100%,50%);
    offset-path: path("M250 397l-6-5C115 287 80 250 80 190c0-50 40-90 90-90 41 0 64 23 80 41 16-18 39-41 80-41 50 0 90 40 90 90 0 60-35 97-164 202l-6 5z"); 
  }
  
  
  div:nth-of-type(3n+2) {
    background: rgb(43, 1, 13)
  }
  div:nth-of-type(3n+3) {
    background: rgb(24, 5, 0)
  }
  
  
  body {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    min-height: 100vh;
    background: #09099b;
    background: radial-gradient(circle, #cf2c9e, #0e0ead);
    color: #efefff;
    font-family: -apple-system, "Segoe UI", "Roboto", sans-serif;
    overflow-x: hidden;
  }
  main {
    transform: scale(.5);
    transform-origin: 50% 25%;
    animation: spin 10s 0s infinite alternate ease-in-out;
    z-index: -1;
  }
  
  @keyframes spin {
    0% {
      transform: translateY(-20%) scale(.75) rotateZ(-12deg);
    }
    100% {
      transform: translateY(-20%) scale(.75) rotateZ(12deg);
    }
  }
  aside {
    color: #efefff;
    position: absolute;
    bottom: 0;
    padding: .5rem 1rem;
    line-height: 1.4;
    left: 0;
    text-align: center;
    width: 100%;
  }
  
  form {
    display: flex;
    flex-direction: column;
    align-items: center;
    display: none;
  }
  label {
    padding-bottom: .5rem;
  }
  input {
    width: 15rem;
    position: relative;
  }
  input::before {
    content: '1x';
    position: absolute;
    left: -1.25rem;
    color: #efefff;
    opacity: .8;
  }
  input::after {
    content: attr(max) 'x';
    position: absolute;
    left: calc(100% + 0.5rem);
    color: #efefff;
    opacity: .8;
  }
  @supports (motion-offset: 100%) or (offset-distance: 100%) {
    svg, aside {
      display: none;
    }
    div {
      display: block;
    }
    form {
      display: flex;
    }
  }
  
  * {
    box-sizing: border-box;
  }