:root {
    --mid-color: rgb(208, 208, 208);
    --dark-mid-color: rgb(41, 44, 51);
    --border-color: rgb(165, 165, 165);
    --dark-border-color: rgb(30, 31, 35);
    --view-color: rgb(128, 128, 128);
    --dark-view-color: rgb(34, 37, 43);
    --scaling-type: pixelated;
    --scrollbar-width: 8px;
    --scrollbar-height: 8px;
    --system-font: BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
html, body {
    width: 100%;
    height: 100%;
}
body {
    margin: 0px;
    user-select: none;
    font-family: var(--system-font);
    color: black;
}
body.dark {
    color: white;
}
canvas {
    image-rendering: var(--scaling-type);
    vertical-align: bottom;
}

::-webkit-scrollbar {
    width: var(--scrollbar-width);
    height: var(--scrollbar-height);
}

::-webkit-scrollbar-corner {
    background: var(--dark-view-color);
}

::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0.5;
}