body{margin: 0; padding: 0; box-sizing: border-box; background-color: #aaaaaa00;}
body * {
    color: #fff;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
}
body .primary{
    color: #f1cdab
}
body.load{
    overflow: hidden;
}

a {text-decoration: none; color: unset; outline: none}
a:hover,
a:active {text-decoration: none; color: unset; }
canvas{z-index: -1; position: fixed; top: 0; left: 0; width: 100%; height: 100%;}

.loading{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 1;
    background-color: #fff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
.loading svg{
    width: 20vw;
    max-width: 335px;
    aspect-ratio: 1/1;
}
.loading svg *{
    stroke:#000;

}
.loading svg path,
.loading svg circle,
.loading svg ellipse{
    animation: loading-progress 2s infinite;
}

@keyframes loading-progress {
    to{
        stroke-dashoffset: 0;
        fill-opacity: 1;
    }
}