.chess2d {
    display: grid;
    grid-template-columns: repeat(var(--board-size, 8), 1fr);
    max-width: 400px;
    margin: 1.5rem auto;
    border: 2px solid #8b7355;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

.chess2d-cell {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    font-size: 0;
    transition: filter 0.12s ease;
    user-select: none;
    -webkit-user-select: none;
}

.chess2d-cell--light {
    background: #f0d9b5;
}

.chess2d-cell--dark {
    background: #b58863;
}

.chess2d-cell--piece {
    font-size: min(2.2rem, calc(400px / var(--board-size, 8) * 0.7));
    line-height: 1;
    color: #1a1a2e;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.chess2d-cell--move.chess2d-cell--light {
    background: #c5e3de;
}

.chess2d-cell--move.chess2d-cell--dark {
    background: #88b8b0;
}

.chess2d-cell:hover:not(.chess2d-cell--piece) {
    filter: brightness(1.06);
}

.chess2d-caption {
    text-align: center;
    color: var(--subtext-a, #6c6f85);
    font-size: 0.88rem;
    margin: 0.4rem auto 1.5rem;
    max-width: 400px;
}