.hint { text-align: center; color: #64748B; font-size: 0.85rem; margin-bottom: 0.75rem; max-width: 340px; }
.pix-wrap { display: flex; flex-direction: column; align-items: center; }
.col-clues { display: flex; gap: 2px; margin-left: 36px; margin-bottom: 2px; }
.col-clues span { width: 32px; text-align: center; font-size: 0.7rem; font-weight: 800; color: #64748B; }
.pix-main { display: flex; }
.row-clues { display: flex; flex-direction: column; gap: 2px; margin-right: 4px; }
.row-clues span { height: 32px; width: 32px; display: flex; align-items: center; justify-content: center; font-size: 0.7rem; font-weight: 800; color: #64748B; }
.pix-grid { display: grid; gap: 2px; padding: 4px; background: #312E81; border-radius: 8px; }
.pix-cell { width: 32px; height: 32px; border: none; border-radius: 4px; background: #fff; cursor: pointer; }
.pix-cell.filled { background: #4338CA; }
.pix-cell.wrong { background: #FCA5A5; }