.grid-3x3 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
}
.grid-3x4 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
.grid-3x5 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.grid-3x6 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(6, 1fr);
}
.grid-3x7 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(7, 1fr);
}
.grid-3x8 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(8, 1fr);
}
.grid-3x9 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(9, 1fr);
}
.grid-3x10 {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(10, 1fr);
}

.grid-4x3 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
}
.grid-4x4 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
.grid-4x5 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.grid-4x6 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(6, 1fr);
}
.grid-4x7 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(7, 1fr);
}
.grid-4x8 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(8, 1fr);
}
.grid-4x9 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(9, 1fr);
}
.grid-4x10 {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(10, 1fr);
}

.grid-5x3 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(3, 1fr);
}
.grid-5x4 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
.grid-5x5 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.grid-5x6 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(6, 1fr);
}
.grid-5x7 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(7, 1fr);
}
.grid-5x8 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(8, 1fr);
}
.grid-5x9 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(9, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-5x10 {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(10, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}

.grid-6x3 {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(3, 1fr);
}
.grid-6x4 {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
.grid-6x5 {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.grid-6x6 {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(6, 1fr);
}
.grid-6x7 {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(7, 1fr);
}
.grid-6x8 {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(8, 1fr);
}
.grid-6x9 {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(9, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-6x10 {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(10, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}

.grid-7x3 {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(3, 1fr);
}
.grid-7x4 {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
.grid-7x5 {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.grid-7x6 {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(6, 1fr);
}
.grid-7x7 {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(7, 1fr);
}
.grid-7x8 {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(8, 1fr);
}
.grid-7x9 {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(9, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-7x10 {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(10, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}

.grid-8x3 {
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(3, 1fr);
}
.grid-8x4 {
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
.grid-8x5 {
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.grid-8x6 {
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(6, 1fr);
}
.grid-8x7 {
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(7, 1fr);
}
.grid-8x8 {
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(8, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-8x9 {
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(9, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-8x10 {
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(10, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}

.grid-9x3 {
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(3, 1fr);
}
.grid-9x4 {
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
.grid-9x5 {
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.grid-9x6 {
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(6, 1fr);
}
.grid-9x7 {
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(7, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-9x8 {
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(8, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-9x9 {
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(9, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-9x10 {
    grid-template-columns: repeat(9, 1fr);
    grid-template-rows: repeat(10, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}

.grid-10x3 {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(3, 1fr);
}
.grid-10x4 {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
.grid-10x5 {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.grid-10x6 {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(6, 1fr);
}
.grid-10x7 {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(7, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-10x8 {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(8, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-10x9 {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(9, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}
.grid-10x10 {
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(10, 1fr);
    gap: 6px !important;

    & .occupied {
        font-size: 1.75rem !important;
    }
}