#puzzle-board {
    width: 100%;
    aspect-ratio: 1;
}

#puzzle-move-list li {
    height: 18px !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
}

@media (pointer: coarse) {
    .cm-chessboard {
        touch-action: none;
    }
    #puzzle-controls button {
        min-height: 44px;
        min-width: 44px;
    }
}

@media (max-width: 767px) {
    #puzzle-board {
        border-radius: 2px;
    }
}

/* Match Opening Trainer last-move highlight (overrides markers.css which loads before this file) */
.cm-chessboard .markers .marker.marker-square {
    fill: #cdd16a;
    opacity: 0.42;
}