body {
    text-align: center;
    font-family: Arial;
}

table {
    margin: auto;
    border-collapse: collapse;
    border: 3px solid #888;
}

td {
    width: 42px;
    height: 42px;
    border: 1px solid #777;
    font-size: 24px;
    text-align: center;
}

td.bold {
    background: #eee;
    font-weight: bold;
}

td.cell {
    cursor: pointer;
}

td.ok {
    background: #c8f7c5;
}

td.err {
    background: #f7c5c5;
}

td.active {
    outline: 2px solid #2196f3;
}

td.locked {
    pointer-events: none;
    opacity: 0.6;
}

/* dicke Linien für 9x9 */
td:nth-child(3),
td:nth-child(6) {
    border-right: 3px solid #888;
}

tr:nth-child(3) td,
tr:nth-child(6) td {
    border-bottom: 3px solid #888;
}