.key-moves {
display: block;
max-width: 700px;
}
.key-moves tbody {
display: grid;
grid-template-columns: auto repeat(6, 1fr);
grid-auto-rows: auto;
align-items: center;
gap: 2px;
}
.key-moves tr {
display: contents;
}
.key-moves td:first-of-type {
text-align: center;
grid-column: 1;
}
.key-moves th {
overflow: hidden;
white-space: nowrap;
text-overflow: '·';
}
.key-move-cell {
width: 30px;
}
@supports (display: grid) {
.key-moves .key-move-cell {
width: 100%;
}
}
.key-move-cell.primary { height: 1em; }
.key-move-cell.secondary { height: 0.7em; }
.key-move-cell.extra { height: 0.4em; }