.sudoku-grid {
    display: grid;
    gap: var(--gap);
    background: #1e1e1e;
    padding: 3px;
    border-radius: 14px;
    justify-content: center;
    margin: 10px auto;
    width: fit-content;
}
.cell {
    background: var(--cell-bg);
    aspect-ratio: 1;
    width: var(--cell-size);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(var(--cell-size) * 0.5);
    font-weight: 700;
    color: #33691e;
    border-radius: 5px;
    cursor: pointer;
    transition: 0.12s;
}
.cell.fixed {
    color: #558b2f;
    background: #dcedc8;
    cursor: default;
}
.cell.selected {
    box-shadow: 0 0 0 3px #43a047;
    background: #c8e6c9;
    z-index: 2;
}
.cell.error {
    background: #ffcdd2;
    color: #b71c1c;
}
.number-pad {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 12px 0;
    flex-wrap: wrap;
}
.num-btn {
    background: #81c784;
    border: none;
    color: white;
    font-size: 1.4rem;
    width: 48px;
    height: 48px;
    border-radius: 16px;
    font-weight: bold;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0,40,0,0.2);
}
.num-btn:active {
    background: #2e7d32;
    transform: scale(0.92);
}