* {
  user-select: none;
}

html {
    background-color: #393B75
}

body {
  margin: 0;
  padding: 0;
}

main {
    height: 100vh;

    display: flex;
    align-items: center;
    justify-content: center;
}

.loader {
    background-color: transparent;
    border: 35px solid #342D62;
    border-radius: 100%;
    height: 20vh;
    aspect-ratio: 1/1;

     animation: spin 1s linear infinite; 

    -webkit-mask: linear-gradient(
        50deg,
         #342D62 0%,
         #342D62 40%,
        transparent 70%,
        transparent 100%
    );

    mask: linear-gradient(
        50deg,
         #342D62 0%,
         #342D62 40%,
        transparent 70%,
        transparent 100%
    );

}

@keyframes spin {
  100% {
        transform: rotate(360deg);
}
}