/* === tictactoe.css === */

#status {
  margin-bottom: 20px;
  font-size: 1.2em;
}

table#board {
  border-collapse: separate;
  border-spacing: 10px;
  user-select: none;
  margin: 0 auto; /* <— Das zentriert die Tabelle horizontal */
}

#board td {
  width: 100px;
  height: 100px;
  font-size: 3em;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border-radius: 15px;
  background-color: #456;
  transition: transform 0.1s, background 0.2s;
}

#board td:hover { 
  transform: scale(1.05); 
  background-color: #333; 
}
.X { color: #ff4d4d; }
.O { color: #4dff4d; }