#board.cg-wrap,
#board .cg-wrap {
  width: 100%;
  aspect-ratio: 1;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
}

/* Prevent page scrolling, text selection, callouts and drag ghosts while moving pieces. */
#board,
#board *,
#board.cg-wrap,
#board .cg-wrap,
#board cg-board,
#board piece,
#board square {
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
}

/* Chessground renders one cg-board element. A 25% tile contains a correct 2x2
   checker pattern, producing an exact 8x8 board without the former star artefacts. */
#board cg-board {
  width: 100%;
  height: 100%;
  background-color: var(--board-light, #f0d9b5);
  background-image: conic-gradient(
    from 90deg,
    var(--board-dark, #b58863) 25%,
    var(--board-light, #f0d9b5) 0 50%,
    var(--board-dark, #b58863) 0 75%,
    var(--board-light, #f0d9b5) 0
  );
  background-size: 25% 25%;
  background-position: 0 0;
}

#board piece {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

#board[data-board-theme="brown"] { --board-light: #f0d9b5; --board-dark: #b58863; }
#board[data-board-theme="blue"] { --board-light: #dee3e6; --board-dark: #8ca2ad; }
#board[data-board-theme="green"] { --board-light: #eeeed2; --board-dark: #769656; }

#board[data-piece-theme="merida"] piece.white.king { background-image: url('/vendor/lichess-pieces/merida/wK.svg'); }
#board[data-piece-theme="merida"] piece.white.queen { background-image: url('/vendor/lichess-pieces/merida/wQ.svg'); }
#board[data-piece-theme="merida"] piece.white.rook { background-image: url('/vendor/lichess-pieces/merida/wR.svg'); }
#board[data-piece-theme="merida"] piece.white.bishop { background-image: url('/vendor/lichess-pieces/merida/wB.svg'); }
#board[data-piece-theme="merida"] piece.white.knight { background-image: url('/vendor/lichess-pieces/merida/wN.svg'); }
#board[data-piece-theme="merida"] piece.white.pawn { background-image: url('/vendor/lichess-pieces/merida/wP.svg'); }
#board[data-piece-theme="merida"] piece.black.king { background-image: url('/vendor/lichess-pieces/merida/bK.svg'); }
#board[data-piece-theme="merida"] piece.black.queen { background-image: url('/vendor/lichess-pieces/merida/bQ.svg'); }
#board[data-piece-theme="merida"] piece.black.rook { background-image: url('/vendor/lichess-pieces/merida/bR.svg'); }
#board[data-piece-theme="merida"] piece.black.bishop { background-image: url('/vendor/lichess-pieces/merida/bB.svg'); }
#board[data-piece-theme="merida"] piece.black.knight { background-image: url('/vendor/lichess-pieces/merida/bN.svg'); }
#board[data-piece-theme="merida"] piece.black.pawn { background-image: url('/vendor/lichess-pieces/merida/bP.svg'); }

#board[data-piece-theme="cburnett"] piece.white.king { background-image: url('/vendor/lichess-pieces/cburnett/wK.svg'); }
#board[data-piece-theme="cburnett"] piece.white.queen { background-image: url('/vendor/lichess-pieces/cburnett/wQ.svg'); }
#board[data-piece-theme="cburnett"] piece.white.rook { background-image: url('/vendor/lichess-pieces/cburnett/wR.svg'); }
#board[data-piece-theme="cburnett"] piece.white.bishop { background-image: url('/vendor/lichess-pieces/cburnett/wB.svg'); }
#board[data-piece-theme="cburnett"] piece.white.knight { background-image: url('/vendor/lichess-pieces/cburnett/wN.svg'); }
#board[data-piece-theme="cburnett"] piece.white.pawn { background-image: url('/vendor/lichess-pieces/cburnett/wP.svg'); }
#board[data-piece-theme="cburnett"] piece.black.king { background-image: url('/vendor/lichess-pieces/cburnett/bK.svg'); }
#board[data-piece-theme="cburnett"] piece.black.queen { background-image: url('/vendor/lichess-pieces/cburnett/bQ.svg'); }
#board[data-piece-theme="cburnett"] piece.black.rook { background-image: url('/vendor/lichess-pieces/cburnett/bR.svg'); }
#board[data-piece-theme="cburnett"] piece.black.bishop { background-image: url('/vendor/lichess-pieces/cburnett/bB.svg'); }
#board[data-piece-theme="cburnett"] piece.black.knight { background-image: url('/vendor/lichess-pieces/cburnett/bN.svg'); }
#board[data-piece-theme="cburnett"] piece.black.pawn { background-image: url('/vendor/lichess-pieces/cburnett/bP.svg'); }

#board[data-piece-theme="alpha"] piece.white.king { background-image: url('/vendor/lichess-pieces/alpha/wK.svg'); }
#board[data-piece-theme="alpha"] piece.white.queen { background-image: url('/vendor/lichess-pieces/alpha/wQ.svg'); }
#board[data-piece-theme="alpha"] piece.white.rook { background-image: url('/vendor/lichess-pieces/alpha/wR.svg'); }
#board[data-piece-theme="alpha"] piece.white.bishop { background-image: url('/vendor/lichess-pieces/alpha/wB.svg'); }
#board[data-piece-theme="alpha"] piece.white.knight { background-image: url('/vendor/lichess-pieces/alpha/wN.svg'); }
#board[data-piece-theme="alpha"] piece.white.pawn { background-image: url('/vendor/lichess-pieces/alpha/wP.svg'); }
#board[data-piece-theme="alpha"] piece.black.king { background-image: url('/vendor/lichess-pieces/alpha/bK.svg'); }
#board[data-piece-theme="alpha"] piece.black.queen { background-image: url('/vendor/lichess-pieces/alpha/bQ.svg'); }
#board[data-piece-theme="alpha"] piece.black.rook { background-image: url('/vendor/lichess-pieces/alpha/bR.svg'); }
#board[data-piece-theme="alpha"] piece.black.bishop { background-image: url('/vendor/lichess-pieces/alpha/bB.svg'); }
#board[data-piece-theme="alpha"] piece.black.knight { background-image: url('/vendor/lichess-pieces/alpha/bN.svg'); }
#board[data-piece-theme="alpha"] piece.black.pawn { background-image: url('/vendor/lichess-pieces/alpha/bP.svg'); }

#board square.last-move { background-color: rgba(255, 170, 0, 0.35); }
#board square.selected { background-color: rgba(240, 138, 46, 0.42); }
#board square.move-dest { background: radial-gradient(rgba(16, 67, 79, 0.45) 18%, transparent 20%); }
#board square.move-dest.oc { background: radial-gradient(transparent 0%, transparent 79%, rgba(16, 67, 79, 0.5) 80%); }
#board square.check { background: radial-gradient(ellipse at center, rgba(220, 38, 38, 0.9) 0%, rgba(220, 38, 38, 0) 70%); }
