.loadingPage {
    background-color: #0a0b25;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
}

.spinner {
    width: 56px;
    height: 56px;
    display: grid;
}

.spinner::before,
.spinner::after {
    content: "";
    grid-area: 1/1;
    background: var(--c) 50% 0,
        var(--c) 50% 100%,
        var(--c) 100% 50%,
        var(--c) 0 50%;
    background-size: 13.4px 13.4px;
    background-repeat: no-repeat;
    animation: spinner-3hs4a3 1s infinite;
}

.spinner::before {
    --c: radial-gradient(farthest-side, #F51F99 92%, #0000);
    margin: 4.5px;
    background-size: 9px 9px;
    animation-timing-function: linear;
}

.spinner::after {
    --c: radial-gradient(farthest-side, #F51F99 92%, #0000);
}

@keyframes spinner-3hs4a3 {
    100% {
        transform: rotate(.5turn);
    }
}