@import url("tokens.css");
@import url("fonts.css");

body {
    background-color: var(--background);
    color: var(--color);
    font-family: "JetBrainsMono", monospace;
}

* {
    /*z-index: -1;*/
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

h1 {
    color: var(--focus);
    text-align: center;
}

p {
    color: var(--accent);
    font-size: 20px;
}

.center {
    text-align: center;
}

.title {
    margin-top: 40px;
}

.container {
    display: grid;
    gap: 20px;
    z-index: 0;
}

button {
    padding: 10px 0;
    background-color: var(--sheet);
    color: var(--button);
    border: none;
    border-radius: var(--radius-default);
}

button:hover {
    color: var(--button-hover);
    cursor: pointer;
}