.grid-cell.blank {
    background: rgba(148,163,184,.08);
    border-color: rgba(148,163,184,.18);
    box-shadow: none;
    color: transparent;
    cursor: default;
    pointer-events: none;
}
.grid-cell.correct {
    border-color: rgba(147,197,253,.75);
    box-shadow: 0 0 8px rgba(147,197,253,.25);
    cursor: default;
}
.grid-cell.wrong {
    background: rgba(239,68,68,.4);
    border-color: rgba(248,113,113,.8);
    box-shadow: 0 0 20px rgba(239,68,68,.4);
    color: #fff;
    animation: shake .35s ease-in-out;
}
.grid-cell.target-hint {
    border-color: rgba(251,191,36,.6);
    box-shadow: 0 0 16px rgba(245,158,11,.2);
}
.grid-row-label {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 14px; color: #94a3b8;
    pointer-events: none;
}