.board {
  --cell: 60px;
  display: grid;
  gap: 8px;
  justify-content: center;
  margin: 16px auto 24px;
}
.board[data-size="5"] { grid-template-columns: repeat(5, var(--cell)); }
.board[data-size="6"] { grid-template-columns: repeat(6, var(--cell)); }
.board[data-size="7"] { grid-template-columns: repeat(7, var(--cell)); }

.cell {
  width: var(--cell);
  height: var(--cell);
  border-radius: 10px;
  border: 2px solid #444;
  background: #1c1c1c;
  color: #f5f5f5;
  font-weight: 700;
  font-size: 1.1rem;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.cell.hidden { background: #151515; }
.cell.safe   { background: #1f3d28; border-color: #2d6a3f; }
.cell.bomb   { background: #3d1f1f; border-color: #6a2d2d; }

.cashout-pulse {
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 300ms ease;
  box-shadow: inset 0 0 0 4px rgba(0,255,150,0.35), 0 0 40px rgba(0,255,160,0.18) inset;
}
.cashout-pulse.active {
  opacity: 1;
  animation: pulse 600ms ease;
}
@keyframes pulse {
  0%   { box-shadow: inset 0 0 0 0 rgba(0,255,160,0.0); }
  40%  { box-shadow: inset 0 0 0 12px rgba(0,255,160,0.25); }
  100% { box-shadow: inset 0 0 0 0 rgba(0,255,160,0.0); }
}