* {
    /* Fonts */
    --monospace: monospace, 'Courier New', Courier;
    --default-font: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-family: var(--default-font);

    /* Misc Colors */
    --off-black: rgb(3, 2, 3);
    --dark-overlay: rgba(0, 0, 0, 0.4);

    /* Background Colors */
    --root-bg: rgb(29, 31, 36);
    --bg: rgb(36, 36, 40);
    --semi-offset-bg: rgba(25, 25, 26, 0.7);
    --dark-bg: rgb(28, 28, 29);
    --dark2-bg: rgb(25, 24, 27);
    --dark3-bg: rgb(22, 22, 23);
    --dark5-bg: rgb(17, 17, 19);

    /* Text Colors */
    --text-main: white;

    /* Chess Colors */
    --light-square: #eceff1;
    --dark-square: #90a4ae;
}

button {
    border-radius: 1em;
    color: white;
    border-color: transparent;
    background-color: rgb(25, 24, 27);
    cursor: pointer;
    padding: 0.5em 1.5em;
    font-family: var(--monospace);

    transition: background-color 0.25s;
}

button:hover {
    background-color: rgb(17, 17, 19);
}

*::-webkit-scrollbar {
    width: 0.2em;
}

*::-webkit-scrollbar-thumb {
    background-color: rgb(38, 38, 42);
    border-radius: 2px;
}
*::-webkit-scrollbar-thumb:hover {
    background-color: rgb(46, 46, 49);
}