config.css

:root {
    --color: #294770;
    --rows: 10;
    --cols: 10;
    --h1-color: #ffd662ff;
    --cell-width: calc(80vh/var(--rows));
}

@font-face {
    font-family: 'Lucida Sans';
    src: url('Lucida Sans.ttf');
}

body {
    font-family: 'Lucida Sans';
}

nav h1 {
    color: var(--h1-color);
}

nav {
    background-color: var(--color);
}

nav img {
    opacity: 0.4;
}

#stats {
    color: var(--h1-color);
}

#grid {
    display: grid;
    grid-template-rows: repeat(var(--rows), 1fr);
    grid-template-columns: repeat(var(--cols), 1fr);
    gap: 3px 3px;
    background-color: var(--h1-color);
    border-color: var(--h1-color) !important;
    width: calc(var(--cell-width)*var(--cols));
    height: calc(var(--cell-width)*var(--rows));
}

#grid div {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: white;
    text-align: center;
    cursor: pointer;
    transition: all 200ms;
}

#grid div:hover {
    background-color: var(--h1-color);
}

#grid div[data-state='1'] {
    background-color: var(--color);
}

#library-modal img {
    cursor: pointer;
    opacity: 0.5;
}

.modal-content {
    background-color: var(--color);
    color: var(--h1-color);
}

div.pickr button {
    border: 2px solid var(--h1-color);
}

footer {
    background-color: var(--color);
    color: var(--h1-color);
}

svg {
    color: var(--h1-color);
    transition: all 400ms;
}

svg:hover {
    transform: scale(1.20);
    filter: drop-shadow(1px 2px 4px);
}

input[type='range']::-webkit-slider-thumb,
input[type='range']:focus::-webkit-slider-thumb {
    background-color: var(--color);
    border: 2px solid var(--h1-color);
    box-shadow: none;
}

input[type='range']::-moz-range-thumb,
input[type='range']:focus::-moz-range-thumb {
    background-color: var(--color);
    border: 2px solid var(--h1-color);
    box-shadow: none;
}

input[type='range']::-webkit-slider-runnable-track {
    background-color: var(--h1-color);
}

input[type='range']::-moz-range-track {
    background-color: var(--h1-color);
}