body {
    background-color: #222;
    color: white;
}

.important {
    color: #dc3545;
}

.loader {
    width: 50px;
    padding: 8px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: #fff;
    --_m: 
        conic-gradient(#0000 10%,#000),
        linear-gradient(#000 0 0) content-box;
    -webkit-mask: var(--_m);
            mask: var(--_m);
    -webkit-mask-composite: source-out;
            mask-composite: subtract;
    animation: l3 1s infinite linear;
}
@keyframes l3 {to{transform: rotate(1turn)}}

#log {
    position: fixed;
    bottom: 5px;
}

#log > p {
    margin-bottom: 0px;
}

/* Container to clip the text */
.marquee-container {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}

/* The text itself */
.marquee {
    display: inline-block;
    padding-left: 100%;
    /* Space before animation starts */
    animation: scroll-marquee 8s linear infinite;
    /* Adjust time for speed */
}

/* Keyframes for scroll effect */
@keyframes scroll-marquee {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-100%);
    }
}