body {
  font-family: Arial, sans-serif;
}

#board {
  margin: auto;
  max-width: 100%;
}

#status {
  font-size: 1.2rem;
  color: #333;
}

/* Ajustes extra para móviles */
@media (max-width: 576px) {
  #board {
    width: 90%;
  }
}

/* Puedes añadir más estilos para secciones, listas, etc. */
/* —— Mejora táctil para móviles: impedir que el drag del tablero haga scroll —— */
@media (pointer: coarse) {
  /* Tableros renderizados por chessboard.js (incluimos varias clases/ids según versión) */
  #board, .board-b72b1, .chessboard-63f37, .chessboard,
  #board * , .board-b72b1 * , .chessboard-63f37 * , .chessboard * {
    touch-action: none;              /* Evita el pan/zoom por defecto durante el drag */
    -webkit-user-select: none;       /* iOS Safari: no seleccionar texto al tocar */
    user-select: none;
    -webkit-user-drag: none;         /* Evita arrastre de imágenes en iOS */
  }
}

/* Suaviza overscroll (rebote) para que no se lleve el gesto del tablero */
html, body { overscroll-behavior: contain; }