body {
    display: grid;
    justify-content: center;
    margin: 0;
    font-family: sans-serif;
    font-size: var(--font-size-l);
}
table {
    padding: 10px 0 20px 0;
}
thead > tr > th:not(:first-child),
tbody > tr:not(:first-child) > td:first-child {
    padding: 5px 10px;
    font-weight: bolder;
    color: var(--font-color-headers);
}
thead > tr:first-child > th:nth-child(2) {
    color: var(--font-color-title);
    font-size: 20px;
    letter-spacing: 8px;
}
td, th {
    text-align: center;
}
tbody > tr > td > span {
    margin-left: 10px;
    font-size: var(--font-size-s);
}
tbody > tr > td:not(:first-child) {
    font-weight: 600;
    padding: 10px 0;
    width: 100px;
    outline: 1px dashed var(--font-color-borders);
    color: var(--font-color-chars);
    transition: background 0.1s linear;
}
tbody > tr > td:not(:first-child):hover,
tbody > tr > td:not(:first-child):focus {
    background: var(--cell-color-focus);
}