body {
    margin: 0;
    height: 100vh;
    background: #050816;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* base */
.absolute {
    position: absolute;
}

.inline-block {
    display: inline-block;
}

.loader {
    display: flex;
    align-items: center;
}

.w-2 {
    width: 0.6em;
}

/* FAST stroke animation */
.dash {
    animation: dashArray 1.4s ease-in-out infinite,
        dashOffset 1.4s linear infinite;
}

/* slight 3D depth */
.depth {
    transform: translateY(-2px);
}

/* DARK FIXED GLOW */
path {
    filter:
        drop-shadow(0 2px 4px rgba(0, 0, 0, 0.9)) drop-shadow(0 0 8px rgba(0, 0, 0, 0.8));
}

/* keyframes */
@keyframes dashArray {
    0% {
        stroke-dasharray: 0 1 359 0;
    }

    50% {
        stroke-dasharray: 0 359 1 0;
    }

    100% {
        stroke-dasharray: 359 1 0 0;
    }
}

@keyframes dashOffset {
    0% {
        stroke-dashoffset: 365;
    }

    100% {
        stroke-dashoffset: 5;
    }
}