:root {
    --bg-1: #334;
    --bg-2: #445;
    --bg-size: 20px;
    --square-size: calc(var(--bg-size) / 2);
}

@keyframes scroll-bg {
    from { background-position: 0 left; }
    to { background-position: var(--square-size) var(--square-size); }
}

body {
    background-image: conic-gradient(
        var(--bg-1) 0.00turn, var(--bg-1) 0.25turn,
        var(--bg-2) 0.25turn, var(--bg-2) 0.50turn,
        var(--bg-1) 0.50turn, var(--bg-1) 0.75turn,
        var(--bg-2) 0.75turn, var(--bg-2) 1.00turn
    );
    background-size: var(--bg-size) var(--bg-size);
    animation: scroll-bg 1s linear infinite;
    margin: 0;
}

canvas {
    position: absolute;
    width: 100vw;
    height: 100vh;
}