.c4-board {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px;
  background: #2563eb; padding: 8px; border-radius: 14px;
  width: 322px; max-width: 100%; margin: 0 auto 12px;
}
.c4-cell {
  aspect-ratio: 1; background: #eef2fb; border-radius: 50%;
  cursor: pointer; transition: background 0.12s; position: relative;
}
.c4-cell:hover { background: #dbe6fb; }
.c4-cell.p1 { background: #ef4444; }
.c4-cell.p2 { background: #eab308; }
.c4-cell.win { box-shadow: 0 0 0 3px #16181d inset; }
.msg { min-height: 1.4em; font-weight: 700; color: var(--primary); margin: 4px 0 10px; }