:nth-child(11n + 2 of .board-space) {
    --column-offset: 2;
}

:nth-child(11n + 3 of .board-space) {
    --column-offset: 4;
}

:nth-child(11n + 4 of .board-space) {
    --column-offset: 6;
}

:nth-child(11n + 5 of .board-space) {
    --column-offset: 8;
}

:nth-child(11n + 6 of .board-space) {
    --column-offset: 10;
}

:nth-child(11n + 7 of .board-space) {
    --column-offset: 12;
}

:nth-child(11n + 8 of .board-space) {
    --column-offset: 14;
}

:nth-child(11n + 9 of .board-space) {
    --column-offset: 16;
}

:nth-child(11n + 10 of .board-space) {
    --column-offset: 18;
}

:nth-child(11n + 11 of .board-space) {
    --column-offset: 20;
}

:nth-child(n + 1 of .board-space) {
    --row-offset: 2;
    /* margin-top: -1rem; */
}

:nth-child(n + 12 of .board-space) {
    --row-offset: 4;
    --row-shift: 1;
    margin-top: 0.4rem;
}

:nth-child(n + 23 of .board-space) {
    --row-offset: 6;
    --row-shift: 2;
}

:nth-child(n + 34 of .board-space) {
    --row-offset: 8;
    --row-shift: 3;
}

:nth-child(n + 45 of .board-space) {
    --row-offset: 10;
    --row-shift: 4;
}

:nth-child(n + 56 of .board-space) {
    --row-offset: 12;
    --row-shift: 5;
}

:nth-child(n + 67 of .board-space) {
    --row-offset: 14;
    --row-shift: 6;
}

:nth-child(n + 78 of .board-space) {
    --row-offset: 16;
    --row-shift: 7;
}

:nth-child(n + 89 of .board-space) {
    --row-offset: 18;
    --row-shift: 8;
}

:nth-child(n + 100 of .board-space) {
    --row-offset: 20;
    --row-shift: 9;
}

:nth-child(n + 111 of .board-space) {
    --row-offset: 22;
    --row-shift: 10;
    margin-bottom: -1rem;
}

.board-space {
    position: relative;
    grid-column: calc(1 + var(--column-offset) + var(--row-shift)) / span 2;
    grid-row: calc(1 + var(--row-offset)) / span 3;
    background-color: var(--grey);
    margin-top: 0.4rem;
    margin-right: -0.6rem;
    margin-bottom: 0.4rem;
    margin-left: -0.6rem;
    z-index: 3;
}

#board {
    display: grid;
    grid-template-columns: repeat(32, 1fr);
    grid-template-rows: repeat(13, 1fr, 2fr) 1fr;
    gap: 0px;
    font-size: 0;
    margin-top: calc(var(--size) / 1.5);
    margin-left: calc(var(--size) / 2);
    grid-area: board;
}