@lichess-org/pgn-viewer 2.5.1 → 2.5.3

package/demo/lichess-pgn-viewer.js

@@ -917,8 +917,8 @@ var Position = class {
       return this.board[color].size() <= 2 && this.board[opposite(color)].diff(this.board.king).diff(this.board.queen).isEmpty();
     }
     if (this.board[color].intersects(this.board.bishop)) {
-      const sameColor = !this.board.bishop.intersects(SquareSet.darkSquares()) || !this.board.bishop.intersects(SquareSet.lightSquares());
-      return sameColor && this.board.pawn.isEmpty() && this.board.knight.isEmpty();
+      const sameColor2 = !this.board.bishop.intersects(SquareSet.darkSquares()) || !this.board.bishop.intersects(SquareSet.lightSquares());
+      return sameColor2 && this.board.pawn.isEmpty() && this.board.knight.isEmpty();
     }
     return true;
   }
@@ -2698,15 +2698,16 @@ var defaultTranslations = {
   "san.shortCastling": "short castling"
 };
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/types.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/types.js
 var colors = ["white", "black"];
 var files = ["a", "b", "c", "d", "e", "f", "g", "h"];
 var ranks = ["1", "2", "3", "4", "5", "6", "7", "8"];
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/util.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/util.js
 var invRanks = [...ranks].reverse();
-var allKeys = Array.prototype.concat(...files.map((c) => ranks.map((r) => c + r)));
-var pos2key = (pos) => allKeys[8 * pos[0] + pos[1]];
+var allKeys = files.flatMap((f) => ranks.map((r) => f + r));
+var pos2key = (pos) => pos.every((x) => x >= 0 && x <= 7) ? allKeys[8 * pos[0] + pos[1]] : void 0;
+var pos2keyUnsafe = (pos) => pos2key(pos);
 var key2pos = (k) => [k.charCodeAt(0) - 97, k.charCodeAt(1) - 49];
 var uciToMove = (uci) => {
   if (!uci)
@@ -2716,6 +2717,7 @@ var uciToMove = (uci) => {
   return [uci.slice(0, 2), uci.slice(2, 4)];
 };
 var allPos = allKeys.map(key2pos);
+var allPosAndKey = allKeys.map((key, i) => ({ key, pos: allPos[i] }));
 function memo(f) {
   let v;
   const ret = () => {
@@ -2747,11 +2749,9 @@ var timer = () => {
   };
 };
 var opposite2 = (c) => c === "white" ? "black" : "white";
-var distanceSq = (pos1, pos2) => {
-  const dx = pos1[0] - pos2[0], dy = pos1[1] - pos2[1];
-  return dx * dx + dy * dy;
-};
+var distanceSq = (pos1, pos2) => (pos1[0] - pos2[0]) ** 2 + (pos1[1] - pos2[1]) ** 2;
 var samePiece = (p1, p2) => p1.role === p2.role && p1.color === p2.color;
+var samePos = (p1, p2) => p1[0] === p2[0] && p1[1] === p2[1];
 var posToTranslate = (bounds) => (pos, asWhite) => [
   (asWhite ? pos[0] : 7 - pos[0]) * bounds.width / 8,
   (asWhite ? 7 - pos[1] : pos[1]) * bounds.height / 8
@@ -2766,14 +2766,14 @@ var setVisible = (el, v) => {
   el.style.visibility = v ? "visible" : "hidden";
 };
 var eventPosition = (e) => {
-  var _a;
   if (e.clientX || e.clientX === 0)
     return [e.clientX, e.clientY];
-  if ((_a = e.targetTouches) === null || _a === void 0 ? void 0 : _a[0])
+  if (e.targetTouches?.[0])
     return [e.targetTouches[0].clientX, e.targetTouches[0].clientY];
   return;
 };
-var isRightButton = (e) => e.button === 2;
+var isFireMac = memo(() => !("ontouchstart" in window) && ["macintosh", "firefox"].every((x) => navigator.userAgent.toLowerCase().includes(x)));
+var isRightButton = (e) => e.button === 2 && !(e.ctrlKey && isFireMac());
 var createEl = (tagName2, className) => {
   const el = document.createElement(tagName2);
   if (className)
@@ -2791,6 +2791,47 @@ function computeSquareCenter(key, asWhite, bounds) {
     bounds.top + bounds.height * (7 - pos[1]) / 8 + bounds.height / 16
   ];
 }
+var diff = (a, b) => Math.abs(a - b);
+var knightDir = (x1, y1, x2, y2) => diff(x1, x2) * diff(y1, y2) === 2;
+var rookDir = (x1, y1, x2, y2) => x1 === x2 !== (y1 === y2);
+var bishopDir = (x1, y1, x2, y2) => diff(x1, x2) === diff(y1, y2) && x1 !== x2;
+var queenDir = (x1, y1, x2, y2) => rookDir(x1, y1, x2, y2) || bishopDir(x1, y1, x2, y2);
+var kingDirNonCastling = (x1, y1, x2, y2) => Math.max(diff(x1, x2), diff(y1, y2)) === 1;
+var pawnDirCapture = (x1, y1, x2, y2, isDirectionUp) => diff(x1, x2) === 1 && y2 === y1 + (isDirectionUp ? 1 : -1);
+var pawnDirAdvance = (x1, y1, x2, y2, isDirectionUp) => {
+  const step2 = isDirectionUp ? 1 : -1;
+  return x1 === x2 && (y2 === y1 + step2 || // allow 2 squares from first two ranks, for horde
+  y2 === y1 + 2 * step2 && (isDirectionUp ? y1 <= 1 : y1 >= 6));
+};
+var squaresBetween = (x1, y1, x2, y2) => {
+  const dx = x2 - x1;
+  const dy = y2 - y1;
+  if (dx && dy && Math.abs(dx) !== Math.abs(dy))
+    return [];
+  const stepX = Math.sign(dx), stepY = Math.sign(dy);
+  const squares = [];
+  let x = x1 + stepX, y = y1 + stepY;
+  while (x !== x2 || y !== y2) {
+    squares.push([x, y]);
+    x += stepX;
+    y += stepY;
+  }
+  return squares.map(pos2key).filter((k) => k !== void 0);
+};
+var adjacentSquares = (square) => {
+  const pos = key2pos(square);
+  const adjacentSquares2 = [];
+  if (pos[0] > 0)
+    adjacentSquares2.push([pos[0] - 1, pos[1]]);
+  if (pos[0] < 7)
+    adjacentSquares2.push([pos[0] + 1, pos[1]]);
+  return adjacentSquares2.map(pos2key).filter((k) => k !== void 0);
+};
+var squareShiftedVertically = (square, delta) => {
+  const pos = key2pos(square);
+  pos[1] += delta;
+  return pos2key(pos);
+};
 
 // src/path.ts
 var Path = class _Path {
@@ -3042,46 +3083,125 @@ var PgnViewer = class {
   }
 };
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/premove.js
-var diff = (a, b) => Math.abs(a - b);
-var pawn = (color) => (x1, y1, x2, y2) => diff(x1, x2) < 2 && (color === "white" ? (
-  // allow 2 squares from first two ranks, for horde
-  y2 === y1 + 1 || y1 <= 1 && y2 === y1 + 2 && x1 === x2
-) : y2 === y1 - 1 || y1 >= 6 && y2 === y1 - 2 && x1 === x2);
-var knight = (x1, y1, x2, y2) => {
-  const xd = diff(x1, x2);
-  const yd = diff(y1, y2);
-  return xd === 1 && yd === 2 || xd === 2 && yd === 1;
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/premove.js
+var isDestOccupiedByFriendly = (ctx) => ctx.friendlies.has(ctx.dest.key);
+var isDestOccupiedByEnemy = (ctx) => ctx.enemies.has(ctx.dest.key);
+var anyPieceBetween = (orig, dest, pieces) => squaresBetween(...orig, ...dest).some((s) => pieces.has(s));
+var canEnemyPawnAdvanceToSquare = (pawnStart, dest, ctx) => {
+  const piece = ctx.enemies.get(pawnStart);
+  if (piece?.role !== "pawn")
+    return false;
+  const step2 = piece.color === "white" ? 1 : -1;
+  const startPos = key2pos(pawnStart);
+  const destPos = key2pos(dest);
+  return pawnDirAdvance(...startPos, ...destPos, piece.color === "white") && !anyPieceBetween(startPos, [destPos[0], destPos[1] + step2], ctx.allPieces);
 };
-var bishop = (x1, y1, x2, y2) => {
-  return diff(x1, x2) === diff(y1, y2);
+var canEnemyPawnCaptureOnSquare = (pawnStart, dest, ctx) => {
+  const enemyPawn = ctx.enemies.get(pawnStart);
+  return enemyPawn?.role === "pawn" && pawnDirCapture(...key2pos(pawnStart), ...key2pos(dest), enemyPawn.color === "white") && (ctx.friendlies.has(dest) || canBeCapturedBySomeEnemyEnPassant(squareShiftedVertically(dest, enemyPawn.color === "white" ? -1 : 1), ctx.friendlies, ctx.enemies, ctx.lastMove));
 };
-var rook = (x1, y1, x2, y2) => {
-  return x1 === x2 || y1 === y2;
+var canSomeEnemyPawnAdvanceToDest = (ctx) => [...ctx.enemies.keys()].some((key) => canEnemyPawnAdvanceToSquare(key, ctx.dest.key, ctx));
+var isDestControlledByEnemy = (ctx, pieceRolesExclude) => {
+  const square = ctx.dest.pos;
+  return [...ctx.enemies].some(([key, piece]) => {
+    const piecePos = key2pos(key);
+    return !pieceRolesExclude?.includes(piece.role) && (piece.role === "pawn" && pawnDirCapture(...piecePos, ...square, piece.color === "white") || piece.role === "knight" && knightDir(...piecePos, ...square) || piece.role === "bishop" && bishopDir(...piecePos, ...square) || piece.role === "rook" && rookDir(...piecePos, ...square) || piece.role === "queen" && queenDir(...piecePos, ...square) || piece.role === "king" && kingDirNonCastling(...piecePos, ...square)) && (!["bishop", "rook", "queen"].includes(piece.role) || !anyPieceBetween(piecePos, square, ctx.allPieces));
+  });
 };
-var queen = (x1, y1, x2, y2) => {
-  return bishop(x1, y1, x2, y2) || rook(x1, y1, x2, y2);
+var isFriendlyOnDestAndAttacked = (ctx) => isDestOccupiedByFriendly(ctx) && (canBeCapturedBySomeEnemyEnPassant(ctx.dest.key, ctx.friendlies, ctx.enemies, ctx.lastMove) || isDestControlledByEnemy(ctx));
+var canBeCapturedBySomeEnemyEnPassant = (potentialSquareOfFriendlyPawn, friendlies, enemies, lastMove) => {
+  if (!potentialSquareOfFriendlyPawn || lastMove && potentialSquareOfFriendlyPawn !== lastMove[1])
+    return false;
+  const pos = key2pos(potentialSquareOfFriendlyPawn);
+  const friendly = friendlies.get(potentialSquareOfFriendlyPawn);
+  return friendly?.role === "pawn" && pos[1] === (friendly.color === "white" ? 3 : 4) && (!lastMove || diff(key2pos(lastMove[0])[1], pos[1]) === 2) && [1, -1].some((delta) => {
+    const k = pos2key([pos[0] + delta, pos[1]]);
+    return !!k && enemies.get(k)?.role === "pawn";
+  });
 };
-var king = (color, rookFiles, canCastle) => (x1, y1, x2, y2) => diff(x1, x2) < 2 && diff(y1, y2) < 2 || canCastle && y1 === y2 && y1 === (color === "white" ? 0 : 7) && (x1 === 4 && (x2 === 2 && rookFiles.includes(0) || x2 === 6 && rookFiles.includes(7)) || rookFiles.includes(x2));
-function rookFilesOf(pieces, color) {
-  const backrank = color === "white" ? "1" : "8";
-  const files2 = [];
-  for (const [key, piece] of pieces) {
-    if (key[1] === backrank && piece.color === color && piece.role === "rook") {
-      files2.push(key2pos(key)[0]);
-    }
-  }
-  return files2;
-}
-function premove(pieces, key, canCastle) {
+var isPathClearEnoughOfFriendliesForPremove = (ctx, isPawnAdvance) => {
+  if (ctx.unrestrictedPremoves)
+    return true;
+  const squaresBetween2 = squaresBetween(...ctx.orig.pos, ...ctx.dest.pos);
+  if (isPawnAdvance)
+    squaresBetween2.push(ctx.dest.key);
+  const squaresOfFriendliesBetween = squaresBetween2.filter((s) => ctx.friendlies.has(s));
+  if (!squaresOfFriendliesBetween.length)
+    return true;
+  const firstSquareOfFriendliesBetween = squaresOfFriendliesBetween[0];
+  const nextSquare = squareShiftedVertically(firstSquareOfFriendliesBetween, ctx.color === "white" ? -1 : 1);
+  return squaresOfFriendliesBetween.length === 1 && canBeCapturedBySomeEnemyEnPassant(firstSquareOfFriendliesBetween, ctx.friendlies, ctx.enemies, ctx.lastMove) && !!nextSquare && !squaresBetween2.includes(nextSquare);
+};
+var isPathClearEnoughOfEnemiesForPremove = (ctx, isPawnAdvance) => {
+  if (ctx.unrestrictedPremoves)
+    return true;
+  const squaresBetween2 = squaresBetween(...ctx.orig.pos, ...ctx.dest.pos);
+  if (isPawnAdvance)
+    squaresBetween2.push(ctx.dest.key);
+  const squaresOfEnemiesBetween = squaresBetween2.filter((s) => ctx.enemies.has(s));
+  if (squaresOfEnemiesBetween.length > 1)
+    return false;
+  if (!squaresOfEnemiesBetween.length)
+    return true;
+  const enemySquare = squaresOfEnemiesBetween[0];
+  const enemy = ctx.enemies.get(enemySquare);
+  if (!enemy || enemy.role !== "pawn")
+    return true;
+  const enemyStep = enemy.color === "white" ? 1 : -1;
+  const squareAbove = squareShiftedVertically(enemySquare, enemyStep);
+  const enemyPawnDests = squareAbove ? [
+    ...adjacentSquares(squareAbove).filter((s) => canEnemyPawnCaptureOnSquare(enemySquare, s, ctx)),
+    ...[squareAbove, squareShiftedVertically(squareAbove, enemyStep)].filter((s) => !!s).filter((s) => canEnemyPawnAdvanceToSquare(enemySquare, s, ctx))
+  ] : [];
+  const badSquares = [...squaresBetween2, ctx.orig.key];
+  return enemyPawnDests.some((square) => !badSquares.includes(square));
+};
+var isPathClearEnoughForPremove = (ctx, isPawnAdvance) => isPathClearEnoughOfFriendliesForPremove(ctx, isPawnAdvance) && isPathClearEnoughOfEnemiesForPremove(ctx, isPawnAdvance);
+var pawn = (ctx) => {
+  const step2 = ctx.color === "white" ? 1 : -1;
+  if (diff(ctx.orig.pos[0], ctx.dest.pos[0]) > 1)
+    return false;
+  if (!diff(ctx.orig.pos[0], ctx.dest.pos[0]))
+    return pawnDirAdvance(...ctx.orig.pos, ...ctx.dest.pos, ctx.color === "white") && isPathClearEnoughForPremove(ctx, true);
+  if (ctx.dest.pos[1] !== ctx.orig.pos[1] + step2)
+    return false;
+  if (ctx.unrestrictedPremoves || isDestOccupiedByEnemy(ctx))
+    return true;
+  if (isDestOccupiedByFriendly(ctx))
+    return isDestControlledByEnemy(ctx);
+  else
+    return canSomeEnemyPawnAdvanceToDest(ctx) || canBeCapturedBySomeEnemyEnPassant(pos2key([ctx.dest.pos[0], ctx.dest.pos[1] + step2]), ctx.friendlies, ctx.enemies, ctx.lastMove) || isDestControlledByEnemy(ctx, ["pawn"]);
+};
+var knight = (ctx) => knightDir(...ctx.orig.pos, ...ctx.dest.pos) && (ctx.unrestrictedPremoves || !isDestOccupiedByFriendly(ctx) || isFriendlyOnDestAndAttacked(ctx));
+var bishop = (ctx) => bishopDir(...ctx.orig.pos, ...ctx.dest.pos) && isPathClearEnoughForPremove(ctx, false) && (ctx.unrestrictedPremoves || !isDestOccupiedByFriendly(ctx) || isFriendlyOnDestAndAttacked(ctx));
+var rook = (ctx) => rookDir(...ctx.orig.pos, ...ctx.dest.pos) && isPathClearEnoughForPremove(ctx, false) && (ctx.unrestrictedPremoves || !isDestOccupiedByFriendly(ctx) || isFriendlyOnDestAndAttacked(ctx));
+var queen = (ctx) => bishop(ctx) || rook(ctx);
+var king = (ctx) => kingDirNonCastling(...ctx.orig.pos, ...ctx.dest.pos) && (ctx.unrestrictedPremoves || !isDestOccupiedByFriendly(ctx) || isFriendlyOnDestAndAttacked(ctx)) || ctx.canCastle && ctx.orig.pos[1] === ctx.dest.pos[1] && ctx.orig.pos[1] === (ctx.color === "white" ? 0 : 7) && (ctx.orig.pos[0] === 4 && (ctx.dest.pos[0] === 2 && ctx.rookFilesFriendlies.includes(0) || ctx.dest.pos[0] === 6 && ctx.rookFilesFriendlies.includes(7)) || ctx.rookFilesFriendlies.includes(ctx.dest.pos[0])) && (ctx.unrestrictedPremoves || /* The following checks if no non-rook friendly piece is in the way between the king and its castling destination.
+   Note that for the Chess960 edge case of Kb1 "long castling", the check passes even if there is a piece in the way
+   on c1. But this is fine, since premoving from b1 to a1 as a normal move would have already returned true. */
+squaresBetween(...ctx.orig.pos, ctx.dest.pos[0] > ctx.orig.pos[0] ? 7 : 1, ctx.dest.pos[1]).map((s) => ctx.allPieces.get(s)).every((p) => !p || samePiece(p, { role: "rook", color: ctx.color })));
+var mobilityByRole = { pawn, knight, bishop, rook, queen, king };
+function premove(state, key) {
+  const pieces = state.pieces, canCastle = state.premovable.castle, unrestrictedPremoves = !!state.premovable.unrestrictedPremoves;
   const piece = pieces.get(key);
-  if (!piece)
+  if (!piece || piece.color === state.turnColor)
     return [];
-  const pos = key2pos(key), r = piece.role, mobility = r === "pawn" ? pawn(piece.color) : r === "knight" ? knight : r === "bishop" ? bishop : r === "rook" ? rook : r === "queen" ? queen : king(piece.color, rookFilesOf(pieces, piece.color), canCastle);
-  return allPos.filter((pos2) => (pos[0] !== pos2[0] || pos[1] !== pos2[1]) && mobility(pos[0], pos[1], pos2[0], pos2[1])).map(pos2key);
+  const color = piece.color, friendlies = new Map([...pieces].filter(([_, p]) => p.color === color)), enemies = new Map([...pieces].filter(([_, p]) => p.color === opposite2(color))), orig = { key, pos: key2pos(key) }, mobility = (ctx) => mobilityByRole[piece.role](ctx) && state.premovable.additionalPremoveRequirements(ctx), partialCtx = {
+    orig,
+    role: piece.role,
+    allPieces: pieces,
+    friendlies,
+    enemies,
+    unrestrictedPremoves,
+    color,
+    canCastle,
+    rookFilesFriendlies: Array.from(pieces).filter(([k, p]) => k[1] === (color === "white" ? "1" : "8") && p.color === color && p.role === "rook").map(([k]) => key2pos(k)[0]),
+    lastMove: state.lastMove
+  };
+  return allPosAndKey.filter((dest) => mobility({ ...partialCtx, dest })).map((pk) => pk.key);
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/board.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/board.js
 function callUserFunction(f, ...args) {
   if (f)
     setTimeout(() => f(...args), 1);
@@ -3144,9 +3264,9 @@ function tryAutoCastle(state, orig, dest) {
     return false;
   if (origPos[0] === 4 && !state.pieces.has(dest)) {
     if (destPos[0] === 6)
-      dest = pos2key([7, destPos[1]]);
+      dest = pos2keyUnsafe([7, destPos[1]]);
     else if (destPos[0] === 2)
-      dest = pos2key([0, destPos[1]]);
+      dest = pos2keyUnsafe([0, destPos[1]]);
   }
   const rook2 = state.pieces.get(dest);
   if (!rook2 || rook2.color !== king2.color || rook2.role !== "rook")
@@ -3154,11 +3274,11 @@ function tryAutoCastle(state, orig, dest) {
   state.pieces.delete(orig);
   state.pieces.delete(dest);
   if (origPos[0] < destPos[0]) {
-    state.pieces.set(pos2key([6, destPos[1]]), king2);
-    state.pieces.set(pos2key([5, destPos[1]]), rook2);
+    state.pieces.set(pos2keyUnsafe([6, destPos[1]]), king2);
+    state.pieces.set(pos2keyUnsafe([5, destPos[1]]), rook2);
   } else {
-    state.pieces.set(pos2key([2, destPos[1]]), king2);
-    state.pieces.set(pos2key([3, destPos[1]]), rook2);
+    state.pieces.set(pos2keyUnsafe([2, destPos[1]]), king2);
+    state.pieces.set(pos2keyUnsafe([3, destPos[1]]), rook2);
   }
   return true;
 }
@@ -3269,12 +3389,10 @@ function selectSquare(state, key, force) {
 }
 function setSelected(state, key) {
   state.selected = key;
-  if (isPremovable(state, key)) {
-    if (!state.premovable.customDests) {
-      state.premovable.dests = premove(state.pieces, key, state.premovable.castle);
-    }
-  } else
+  if (!isPremovable(state, key))
     state.premovable.dests = void 0;
+  else if (!state.premovable.customDests)
+    state.premovable.dests = premove(state, key);
 }
 function unselect(state) {
   state.selected = void 0;
@@ -3285,10 +3403,7 @@ function isMovable(state, orig) {
   const piece = state.pieces.get(orig);
   return !!piece && (state.movable.color === "both" || state.movable.color === piece.color && state.turnColor === piece.color);
 }
-var canMove = (state, orig, dest) => {
-  var _a, _b;
-  return orig !== dest && isMovable(state, orig) && (state.movable.free || !!((_b = (_a = state.movable.dests) === null || _a === void 0 ? void 0 : _a.get(orig)) === null || _b === void 0 ? void 0 : _b.includes(dest)));
-};
+var canMove = (state, orig, dest) => orig !== dest && isMovable(state, orig) && (state.movable.free || !!state.movable.dests?.get(orig)?.includes(dest));
 function canDrop(state, orig, dest) {
   const piece = state.pieces.get(orig);
   return !!piece && (orig === dest || !state.pieces.has(dest)) && (state.movable.color === "both" || state.movable.color === piece.color && state.turnColor === piece.color);
@@ -3297,11 +3412,7 @@ function isPremovable(state, orig) {
   const piece = state.pieces.get(orig);
   return !!piece && state.premovable.enabled && state.movable.color === piece.color && state.turnColor !== piece.color;
 }
-function canPremove(state, orig, dest) {
-  var _a, _b;
-  const validPremoves = (_b = (_a = state.premovable.customDests) === null || _a === void 0 ? void 0 : _a.get(orig)) !== null && _b !== void 0 ? _b : premove(state.pieces, orig, state.premovable.castle);
-  return orig !== dest && isPremovable(state, orig) && validPremoves.includes(dest);
-}
+var canPremove = (state, orig, dest) => orig !== dest && isPremovable(state, orig) && (state.premovable.customDests?.get(orig) ?? premove(state, orig)).includes(dest);
 function canPredrop(state, orig, dest) {
   const piece = state.pieces.get(orig);
   const destPiece = state.pieces.get(dest);
@@ -3371,15 +3482,15 @@ function getKeyAtDomPos(pos, asWhite, bounds) {
 }
 function getSnappedKeyAtDomPos(orig, pos, asWhite, bounds) {
   const origPos = key2pos(orig);
-  const validSnapPos = allPos.filter((pos2) => queen(origPos[0], origPos[1], pos2[0], pos2[1]) || knight(origPos[0], origPos[1], pos2[0], pos2[1]));
-  const validSnapCenters = validSnapPos.map((pos2) => computeSquareCenter(pos2key(pos2), asWhite, bounds));
+  const validSnapPos = allPos.filter((pos2) => samePos(origPos, pos2) || queenDir(origPos[0], origPos[1], pos2[0], pos2[1]) || knightDir(origPos[0], origPos[1], pos2[0], pos2[1]));
+  const validSnapCenters = validSnapPos.map((pos2) => computeSquareCenter(pos2keyUnsafe(pos2), asWhite, bounds));
   const validSnapDistances = validSnapCenters.map((pos2) => distanceSq(pos, pos2));
   const [, closestSnapIndex] = validSnapDistances.reduce((a, b, index) => a[0] < b ? a : [b, index], [validSnapDistances[0], 0]);
   return pos2key(validSnapPos[closestSnapIndex]);
 }
 var whitePov = (s) => s.orientation === "white";
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/fen.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/fen.js
 var initial = "rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR";
 var roles = {
   p: "pawn",
@@ -3414,7 +3525,8 @@ function read(fen) {
         col = 0;
         break;
       case "~": {
-        const piece = pieces.get(pos2key([col - 1, row]));
+        const k = pos2key([col - 1, row]);
+        const piece = k && pieces.get(k);
         if (piece)
           piece.promoted = true;
         break;
@@ -3425,10 +3537,12 @@ function read(fen) {
           col += nb - 48;
         else {
           const role = c.toLowerCase();
-          pieces.set(pos2key([col, row]), {
-            role: roles[role],
-            color: c === role ? "black" : "white"
-          });
+          const key = pos2key([col, row]);
+          if (key)
+            pieces.set(key, {
+              role: roles[role],
+              color: c === role ? "black" : "white"
+            });
           ++col;
         }
       }
@@ -3451,7 +3565,7 @@ function write(pieces) {
   }).join("")).join("/").replace(/1{2,}/g, (s) => s.length.toString());
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/config.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/config.js
 function applyAnimation(state, config) {
   if (config.animation) {
     deepMerge(state.animation, config.animation);
@@ -3460,15 +3574,14 @@ function applyAnimation(state, config) {
   }
 }
 function configure(state, config) {
-  var _a, _b, _c;
-  if ((_a = config.movable) === null || _a === void 0 ? void 0 : _a.dests)
+  if (config.movable?.dests)
     state.movable.dests = void 0;
-  if ((_b = config.drawable) === null || _b === void 0 ? void 0 : _b.autoShapes)
+  if (config.drawable?.autoShapes)
     state.drawable.autoShapes = [];
   deepMerge(state, config);
   if (config.fen) {
     state.pieces = read(config.fen);
-    state.drawable.shapes = ((_c = config.drawable) === null || _c === void 0 ? void 0 : _c.shapes) || [];
+    state.drawable.shapes = config.drawable?.shapes || [];
   }
   if ("check" in config)
     setCheck(state, config.check || false);
@@ -3503,7 +3616,7 @@ function isPlainObject(o) {
   return proto === Object.prototype || proto === null;
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/anim.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/anim.js
 var anim = (mutation, state) => state.animation.enabled ? animate(mutation, state) : render(mutation, state);
 function render(mutation, state) {
   const result = mutation(state);
@@ -3594,7 +3707,7 @@ function animate(mutation, state) {
 }
 var easing = (t) => t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1;
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/draw.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/draw.js
 var brushes = ["green", "red", "blue", "yellow"];
 function start(state, e) {
   if (e.touches && e.touches.length > 1)
@@ -3656,18 +3769,18 @@ function clear(state) {
     onChange(state.drawable);
   }
 }
+var sameEndpoints = (s1, s2) => s1.orig === s2.orig && s1.dest === s2.dest;
+var sameColor = (s1, s2) => s1.brush === s2.brush;
 function eventBrush(e) {
-  var _a;
   const modA = (e.shiftKey || e.ctrlKey) && isRightButton(e);
-  const modB = e.altKey || e.metaKey || ((_a = e.getModifierState) === null || _a === void 0 ? void 0 : _a.call(e, "AltGraph"));
+  const modB = e.altKey || e.metaKey || e.getModifierState?.("AltGraph");
   return brushes[(modA ? 1 : 0) + (modB ? 2 : 0)];
 }
 function addShape(drawable, cur) {
-  const sameShape = (s) => s.orig === cur.orig && s.dest === cur.dest;
-  const similar = drawable.shapes.find(sameShape);
+  const similar = drawable.shapes.find((s) => sameEndpoints(s, cur));
   if (similar)
-    drawable.shapes = drawable.shapes.filter((s) => !sameShape(s));
-  if (!similar || similar.brush !== cur.brush)
+    drawable.shapes = drawable.shapes.filter((s) => !sameEndpoints(s, cur));
+  if (!similar || !sameColor(similar, cur))
     drawable.shapes.push({
       orig: cur.orig,
       dest: cur.dest,
@@ -3680,7 +3793,7 @@ function onChange(drawable) {
     drawable.onChange(drawable.shapes);
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/drag.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/drag.js
 function start2(s, e) {
   if (!(s.trustAllEvents || e.isTrusted))
     return;
@@ -3693,7 +3806,7 @@ function start2(s, e) {
     return;
   const piece = s.pieces.get(orig);
   const previouslySelected = s.selected;
-  if (!previouslySelected && s.drawable.enabled && (s.drawable.eraseOnClick || !piece || piece.color !== s.turnColor))
+  if (!previouslySelected && s.drawable.enabled && (s.drawable.eraseOnMovablePieceClick || !piece || piece.color !== s.turnColor))
     clear(s);
   if (e.cancelable !== false && (!e.touches || s.blockTouchScroll || piece || previouslySelected || pieceCloseTo(s, position)))
     e.preventDefault();
@@ -3739,7 +3852,7 @@ function start2(s, e) {
   s.dom.redraw();
 }
 function pieceCloseTo(s, pos) {
-  const asWhite = whitePov(s), bounds = s.dom.bounds(), radiusSq = Math.pow(bounds.width / 8, 2);
+  const asWhite = whitePov(s), bounds = s.dom.bounds(), radiusSq = Math.pow(s.touchIgnoreRadius * bounds.width / 16, 2) * 2;
   for (const key of s.pieces.keys()) {
     const center = computeSquareCenter(key, asWhite, bounds);
     if (distanceSq(center, pos) <= radiusSq)
@@ -3768,11 +3881,10 @@ function dragNewPiece(s, piece, e, force) {
 }
 function processDrag(s) {
   requestAnimationFrame(() => {
-    var _a;
     const cur = s.draggable.current;
     if (!cur)
       return;
-    if ((_a = s.animation.current) === null || _a === void 0 ? void 0 : _a.plan.anims.has(cur.orig))
+    if (s.animation.current?.plan.anims.has(cur.orig))
       s.animation.current = void 0;
     const origPiece = s.pieces.get(cur.orig);
     if (!origPiece || !samePiece(origPiece, cur.piece))
@@ -3867,7 +3979,7 @@ function pieceElementByKey(s, key) {
   return;
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/explosion.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/explosion.js
 function explosion(state, keys) {
   state.exploding = { stage: 1, keys };
   state.dom.redraw();
@@ -3886,7 +3998,7 @@ function setStage(state, stage) {
   }
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/api.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/api.js
 function start3(state, redrawAll) {
   function toggleOrientation2() {
     toggleOrientation(state);
@@ -3960,7 +4072,7 @@ function start3(state, redrawAll) {
       render((state2) => state2.drawable.autoShapes = shapes, state);
     },
     setShapes(shapes) {
-      render((state2) => state2.drawable.shapes = shapes, state);
+      render((state2) => state2.drawable.shapes = shapes.slice(), state);
     },
     getKeyAtDomPos(pos) {
       return getKeyAtDomPos(pos, whitePov(state), state.dom.bounds());
@@ -3977,7 +4089,7 @@ function start3(state, redrawAll) {
   };
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/state.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/state.js
 function defaults() {
   return {
     pieces: read(initial),
@@ -3991,6 +4103,7 @@ function defaults() {
     disableContextMenu: false,
     addPieceZIndex: false,
     blockTouchScroll: false,
+    touchIgnoreRadius: 1,
     pieceKey: false,
     trustAllEvents: false,
     highlight: {
@@ -4012,6 +4125,7 @@ function defaults() {
       enabled: true,
       showDests: true,
       castle: true,
+      additionalPremoveRequirements: (_) => true,
       events: {}
     },
     predroppable: {
@@ -4043,7 +4157,7 @@ function defaults() {
       visible: true,
       // can view
       defaultSnapToValidMove: true,
-      eraseOnClick: true,
+      eraseOnMovablePieceClick: true,
       shapes: [],
       autoShapes: [],
       brushes: {
@@ -4062,7 +4176,8 @@ function defaults() {
         },
         purple: { key: "purple", color: "#68217a", opacity: 0.65, lineWidth: 10 },
         pink: { key: "pink", color: "#ee2080", opacity: 0.5, lineWidth: 10 },
-        white: { key: "white", color: "white", opacity: 1, lineWidth: 10 }
+        white: { key: "white", color: "white", opacity: 1, lineWidth: 10 },
+        paleWhite: { key: "pwhite", color: "white", opacity: 0.6, lineWidth: 10 }
       },
       prevSvgHash: ""
     },
@@ -4070,118 +4185,128 @@ function defaults() {
   };
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/svg.js
-var hilites = {
-  hilitePrimary: { key: "hilitePrimary", color: "#3291ff", opacity: 1, lineWidth: 1 },
-  hiliteWhite: { key: "hiliteWhite", color: "#ffffff", opacity: 1, lineWidth: 1 }
-};
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/svg.js
 function createDefs() {
   const defs = createElement("defs");
   const filter = setAttributes(createElement("filter"), { id: "cg-filter-blur" });
-  filter.appendChild(setAttributes(createElement("feGaussianBlur"), { stdDeviation: "0.019" }));
+  filter.appendChild(setAttributes(createElement("feGaussianBlur"), { stdDeviation: "0.013" }));
   defs.appendChild(filter);
   return defs;
 }
-function renderSvg(state, shapesEl, customsEl) {
-  var _a;
+function renderSvg(state, els) {
   const d = state.drawable, curD = d.current, cur = curD && curD.mouseSq ? curD : void 0, dests = /* @__PURE__ */ new Map(), bounds = state.dom.bounds(), nonPieceAutoShapes = d.autoShapes.filter((autoShape) => !autoShape.piece);
   for (const s of d.shapes.concat(nonPieceAutoShapes).concat(cur ? [cur] : [])) {
     if (!s.dest)
       continue;
-    const sources = (_a = dests.get(s.dest)) !== null && _a !== void 0 ? _a : /* @__PURE__ */ new Set(), from = pos2user(orient(key2pos(s.orig), state.orientation), bounds), to = pos2user(orient(key2pos(s.dest), state.orientation), bounds);
+    const sources = dests.get(s.dest) ?? /* @__PURE__ */ new Set(), from = pos2user(orient(key2pos(s.orig), state.orientation), bounds), to = pos2user(orient(key2pos(s.dest), state.orientation), bounds);
     sources.add(moveAngle(from, to));
     dests.set(s.dest, sources);
   }
-  const shapes = d.shapes.concat(nonPieceAutoShapes).map((s) => {
-    return {
+  const shapes = [];
+  const pendingEraseIdx = cur ? d.shapes.findIndex((s) => sameEndpoints(s, cur) && sameColor(s, cur)) : -1;
+  for (const [idx, s] of d.shapes.concat(nonPieceAutoShapes).entries()) {
+    const isPendingErase = pendingEraseIdx !== -1 && pendingEraseIdx === idx;
+    shapes.push({
       shape: s,
       current: false,
-      hash: shapeHash(s, isShort(s.dest, dests), false, bounds)
-    };
-  });
-  if (cur)
+      pendingErase: isPendingErase,
+      hash: shapeHash(s, isShort(s.dest, dests), false, bounds, isPendingErase)
+    });
+  }
+  if (cur && pendingEraseIdx === -1)
     shapes.push({
       shape: cur,
       current: true,
-      hash: shapeHash(cur, isShort(cur.dest, dests), true, bounds)
+      hash: shapeHash(cur, isShort(cur.dest, dests), true, bounds, false),
+      pendingErase: false
     });
   const fullHash = shapes.map((sc) => sc.hash).join(";");
   if (fullHash === state.drawable.prevSvgHash)
     return;
   state.drawable.prevSvgHash = fullHash;
-  const defsEl = shapesEl.querySelector("defs");
-  syncDefs(d, shapes, defsEl);
-  syncShapes(shapes, shapesEl.querySelector("g"), customsEl.querySelector("g"), (s) => renderShape(state, s, d.brushes, dests, bounds));
-}
-function syncDefs(d, shapes, defsEl) {
-  var _a;
-  const brushes2 = /* @__PURE__ */ new Map();
-  let brush;
-  for (const s of shapes.filter((s2) => s2.shape.dest && s2.shape.brush)) {
-    brush = makeCustomBrush(d.brushes[s.shape.brush], s.shape.modifiers);
-    if ((_a = s.shape.modifiers) === null || _a === void 0 ? void 0 : _a.hilite)
-      brushes2.set(hilite(brush).key, hilite(brush));
-    brushes2.set(brush.key, brush);
-  }
-  const keysInDom = /* @__PURE__ */ new Set();
-  let el = defsEl.firstElementChild;
-  while (el) {
-    keysInDom.add(el.getAttribute("cgKey"));
-    el = el.nextElementSibling;
-  }
-  for (const [key, brush2] of brushes2.entries()) {
-    if (!keysInDom.has(key))
-      defsEl.appendChild(renderMarker(brush2));
-  }
-}
-function syncShapes(syncables, shapes, customs, renderShape3) {
-  const hashesInDom = /* @__PURE__ */ new Map();
-  for (const sc of syncables)
-    hashesInDom.set(sc.hash, false);
-  for (const root of [shapes, customs]) {
-    const toRemove = [];
-    let el = root.firstElementChild, elHash;
+  syncDefs(d, shapes, els);
+  syncShapes(shapes, els, (s) => renderShape(state, s, d.brushes, dests, bounds));
+}
+function syncDefs(d, shapes, els) {
+  for (const shapesEl of [els.shapes, els.shapesBelow]) {
+    const defsEl = shapesEl.querySelector("defs");
+    const thisPlane = shapes.filter((s) => shapesEl === els.shapesBelow === !!s.shape.below);
+    const brushes2 = /* @__PURE__ */ new Map();
+    for (const s of thisPlane.filter((s2) => s2.shape.dest && s2.shape.brush)) {
+      const brush = makeCustomBrush(d.brushes[s.shape.brush], s.shape.modifiers);
+      const { key, color } = hiliteOf(s.shape);
+      if (key && color)
+        brushes2.set(key, { key, color, opacity: 1, lineWidth: 1 });
+      brushes2.set(brush.key, brush);
+    }
+    const keysInDom = /* @__PURE__ */ new Set();
+    let el = defsEl.firstElementChild;
     while (el) {
-      elHash = el.getAttribute("cgHash");
-      if (hashesInDom.has(elHash))
-        hashesInDom.set(elHash, true);
-      else
-        toRemove.push(el);
+      keysInDom.add(el.getAttribute("cgKey"));
       el = el.nextElementSibling;
     }
-    for (const el2 of toRemove)
-      root.removeChild(el2);
-  }
-  for (const sc of syncables.filter((s) => !hashesInDom.get(s.hash))) {
-    for (const svg of renderShape3(sc)) {
-      if (svg.isCustom)
-        customs.appendChild(svg.el);
-      else
-        shapes.appendChild(svg.el);
+    for (const [key, brush] of brushes2.entries()) {
+      if (!keysInDom.has(key))
+        defsEl.appendChild(renderMarker(brush));
+    }
+  }
+}
+function syncShapes(shapes, els, renderShape3) {
+  for (const [shapesEl, customEl] of [
+    [els.shapes, els.custom],
+    [els.shapesBelow, els.customBelow]
+  ]) {
+    const [shapesG, customG] = [shapesEl, customEl].map((el) => el.querySelector("g"));
+    const thisPlane = shapes.filter((s) => shapesEl === els.shapesBelow === !!s.shape.below);
+    const hashesInDom = /* @__PURE__ */ new Map();
+    for (const sc of thisPlane)
+      hashesInDom.set(sc.hash, false);
+    for (const root of [shapesG, customG]) {
+      const toRemove = [];
+      let el = root.firstElementChild, elHash;
+      while (el) {
+        elHash = el.getAttribute("cgHash");
+        if (hashesInDom.has(elHash))
+          hashesInDom.set(elHash, true);
+        else
+          toRemove.push(el);
+        el = el.nextElementSibling;
+      }
+      for (const el2 of toRemove)
+        root.removeChild(el2);
+    }
+    for (const sc of thisPlane.filter((s) => !hashesInDom.get(s.hash))) {
+      for (const svg of renderShape3(sc)) {
+        if (svg.isCustom)
+          customG.appendChild(svg.el);
+        else
+          shapesG.appendChild(svg.el);
+      }
     }
   }
 }
-function shapeHash({ orig, dest, brush, piece, modifiers, customSvg, label }, shorten, current, bounds) {
-  var _a, _b;
+function shapeHash({ orig, dest, brush, piece, modifiers, customSvg, label, below }, shorten, current, bounds, pendingErase) {
   return [
     bounds.width,
     bounds.height,
     current,
+    pendingErase && "pendingErase",
     orig,
     dest,
     brush,
     shorten && "-",
     piece && pieceHash(piece),
     modifiers && modifiersHash(modifiers),
-    customSvg && `custom-${textHash(customSvg.html)},${(_b = (_a = customSvg.center) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : "o"}`,
-    label && `label-${textHash(label.text)}`
+    customSvg && `custom-${textHash(customSvg.html)},${customSvg.center?.[0] ?? "o"}`,
+    label && `label-${textHash(label.text)}`,
+    below && "below"
   ].filter((x) => x).join(",");
 }
 function pieceHash(piece) {
   return [piece.color, piece.role, piece.scale].filter((x) => x).join(",");
 }
 function modifiersHash(m) {
-  return [m.lineWidth, m.hilite && "*"].filter((x) => x).join(",");
+  return [m.lineWidth, m.hilite].filter((x) => x).join(",");
 }
 function textHash(s) {
   let h2 = 0;
@@ -4190,25 +4315,24 @@ function textHash(s) {
   }
   return h2.toString();
 }
-function renderShape(state, { shape, current, hash: hash2 }, brushes2, dests, bounds) {
-  var _a, _b;
+function renderShape(state, { shape, current, pendingErase, hash: hash2 }, brushes2, dests, bounds) {
   const from = pos2user(orient(key2pos(shape.orig), state.orientation), bounds), to = shape.dest ? pos2user(orient(key2pos(shape.dest), state.orientation), bounds) : from, brush = shape.brush && makeCustomBrush(brushes2[shape.brush], shape.modifiers), slots = dests.get(shape.dest), svgs = [];
   if (brush) {
     const el = setAttributes(createElement("g"), { cgHash: hash2 });
     svgs.push({ el });
     if (from[0] !== to[0] || from[1] !== to[1])
-      el.appendChild(renderArrow(shape, brush, from, to, current, isShort(shape.dest, dests)));
+      el.appendChild(renderArrow(shape, brush, from, to, current, isShort(shape.dest, dests), pendingErase));
     else
-      el.appendChild(renderCircle(brushes2[shape.brush], from, current, bounds));
+      el.appendChild(renderCircle(brushes2[shape.brush], from, current, bounds, pendingErase));
   }
   if (shape.label) {
     const label = shape.label;
-    (_a = label.fill) !== null && _a !== void 0 ? _a : label.fill = shape.brush && brushes2[shape.brush].color;
+    label.fill ?? (label.fill = shape.brush && brushes2[shape.brush].color);
     const corner = shape.brush ? void 0 : "tr";
     svgs.push({ el: renderLabel(label, hash2, from, to, slots, corner), isCustom: true });
   }
   if (shape.customSvg) {
-    const on = (_b = shape.customSvg.center) !== null && _b !== void 0 ? _b : "orig";
+    const on = shape.customSvg.center ?? "orig";
     const [x, y] = on === "label" ? labelCoords(from, to, slots).map((c) => c - 0.5) : on === "dest" ? to : from;
     const el = setAttributes(createElement("g"), { transform: `translate(${x},${y})`, cgHash: hash2 });
     el.innerHTML = `<svg width="1" height="1" viewBox="0 0 100 100">${shape.customSvg.html}</svg>`;
@@ -4216,41 +4340,37 @@ function renderShape(state, { shape, current, hash: hash2 }, brushes2, dests, bo
   }
   return svgs;
 }
-function renderCircle(brush, at, current, bounds) {
+function renderCircle(brush, at, current, bounds, pendingErase) {
   const widths = circleWidth(), radius = (bounds.width + bounds.height) / (4 * Math.max(bounds.width, bounds.height));
   return setAttributes(createElement("circle"), {
     stroke: brush.color,
     "stroke-width": widths[current ? 0 : 1],
     fill: "none",
-    opacity: opacity(brush, current),
+    opacity: opacity(brush, current, pendingErase),
     cx: at[0],
     cy: at[1],
     r: radius - widths[1] / 2
   });
 }
-function hilite(brush) {
-  return ["#ffffff", "#fff", "white"].includes(brush.color) ? hilites["hilitePrimary"] : hilites["hiliteWhite"];
-}
-function renderArrow(s, brush, from, to, current, shorten) {
-  var _a;
+function renderArrow(s, brush, from, to, current, shorten, pendingErase) {
   function renderLine(isHilite) {
-    var _a2;
     const m = arrowMargin(shorten && !current), dx = to[0] - from[0], dy = to[1] - from[1], angle = Math.atan2(dy, dx), xo = Math.cos(angle) * m, yo = Math.sin(angle) * m;
+    const hilite = hiliteOf(s);
     return setAttributes(createElement("line"), {
-      stroke: isHilite ? hilite(brush).color : brush.color,
-      "stroke-width": lineWidth(brush, current) + (isHilite ? 0.04 : 0),
+      stroke: isHilite ? hilite.color : brush.color,
+      "stroke-width": lineWidth(brush, current) * (isHilite ? 1.14 : 1),
       "stroke-linecap": "round",
-      "marker-end": `url(#arrowhead-${isHilite ? hilite(brush).key : brush.key})`,
-      opacity: ((_a2 = s.modifiers) === null || _a2 === void 0 ? void 0 : _a2.hilite) ? 1 : opacity(brush, current),
+      "marker-end": `url(#arrowhead-${isHilite ? hilite.key : brush.key})`,
+      opacity: s.modifiers?.hilite && !pendingErase ? 1 : opacity(brush, current, pendingErase),
       x1: from[0],
       y1: from[1],
       x2: to[0] - xo,
       y2: to[1] - yo
     });
   }
-  if (!((_a = s.modifiers) === null || _a === void 0 ? void 0 : _a.hilite))
+  if (!s.modifiers?.hilite)
     return renderLine(false);
-  const g = createElement("g");
+  const g = setAttributes(createElement("g"), { opacity: brush.opacity });
   const blurred = setAttributes(createElement("g"), { filter: "url(#cg-filter-blur)" });
   blurred.appendChild(filterBox(from, to));
   blurred.appendChild(renderLine(true));
@@ -4276,7 +4396,6 @@ function renderMarker(brush) {
   return marker;
 }
 function renderLabel(label, hash2, from, to, slots, corner) {
-  var _a;
   const labelSize = 0.4, fontSize = labelSize * 0.75 ** label.text.length, at = labelCoords(from, to, slots), cornerOff = corner === "tr" ? 0.4 : 0, g = setAttributes(createElement("g"), {
     transform: `translate(${at[0] + cornerOff},${at[1] - cornerOff})`,
     cgHash: hash2
@@ -4286,7 +4405,7 @@ function renderLabel(label, hash2, from, to, slots, corner) {
     "fill-opacity": corner ? 1 : 0.8,
     "stroke-opacity": corner ? 1 : 0.7,
     "stroke-width": 0.03,
-    fill: (_a = label.fill) !== null && _a !== void 0 ? _a : "#666",
+    fill: label.fill ?? "#666",
     stroke: "white"
   }));
   const labelEl = setAttributes(createElement("text"), {
@@ -4330,8 +4449,12 @@ function circleWidth() {
 function lineWidth(brush, current) {
   return (brush.lineWidth || 10) * (current ? 0.85 : 1) / 64;
 }
-function opacity(brush, current) {
-  return (brush.opacity || 1) * (current ? 0.9 : 1);
+function hiliteOf(shape) {
+  const hilite = shape.modifiers?.hilite;
+  return { key: hilite && `hilite-${hilite.replace("#", "")}`, color: hilite };
+}
+function opacity(brush, current, pendingErase) {
+  return (brush.opacity || 1) * (pendingErase ? 0.6 : current ? 0.9 : 1);
 }
 function arrowMargin(shorten) {
   return (shorten ? 20 : 10) / 64;
@@ -4379,7 +4502,7 @@ function labelCoords(from, to, slots) {
   return [from[0] - Math.cos(angle) * mag, from[1] - Math.sin(angle) * mag].map((c) => c + 0.5);
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/wrap.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/wrap.js
 function renderWrap(element, s) {
   element.innerHTML = "";
   element.classList.add("cg-wrap");
@@ -4390,26 +4513,19 @@ function renderWrap(element, s) {
   element.appendChild(container);
   const board = createEl("cg-board");
   container.appendChild(board);
-  let svg;
-  let customSvg;
+  let shapesBelow;
+  let shapes;
+  let customBelow;
+  let custom;
   let autoPieces;
   if (s.drawable.visible) {
-    svg = setAttributes(createElement("svg"), {
-      class: "cg-shapes",
-      viewBox: "-4 -4 8 8",
-      preserveAspectRatio: "xMidYMid slice"
-    });
-    svg.appendChild(createDefs());
-    svg.appendChild(createElement("g"));
-    customSvg = setAttributes(createElement("svg"), {
-      class: "cg-custom-svgs",
-      viewBox: "-3.5 -3.5 8 8",
-      preserveAspectRatio: "xMidYMid slice"
-    });
-    customSvg.appendChild(createElement("g"));
+    [shapesBelow, shapes] = ["cg-shapes-below", "cg-shapes"].map((cls) => svgContainer(cls, true));
+    [customBelow, custom] = ["cg-custom-below", "cg-custom-svgs"].map((cls) => svgContainer(cls, false));
     autoPieces = createEl("cg-auto-pieces");
-    container.appendChild(svg);
-    container.appendChild(customSvg);
+    container.appendChild(shapesBelow);
+    container.appendChild(customBelow);
+    container.appendChild(shapes);
+    container.appendChild(custom);
     container.appendChild(autoPieces);
   }
   if (s.coordinates) {
@@ -4429,15 +4545,18 @@ function renderWrap(element, s) {
     setVisible(ghost, false);
     container.appendChild(ghost);
   }
-  return {
-    board,
-    container,
-    wrap: element,
-    ghost,
-    svg,
-    customSvg,
-    autoPieces
-  };
+  return { board, container, wrap: element, ghost, shapes, shapesBelow, custom, customBelow, autoPieces };
+}
+function svgContainer(cls, isShapes) {
+  const svg = setAttributes(createElement("svg"), {
+    class: cls,
+    viewBox: isShapes ? "-4 -4 8 8" : "-3.5 -3.5 8 8",
+    preserveAspectRatio: "xMidYMid slice"
+  });
+  if (isShapes)
+    svg.appendChild(createDefs());
+  svg.appendChild(createElement("g"));
+  return svg;
 }
 function renderCoords(elems, className) {
   const el = createEl("coords", className);
@@ -4450,7 +4569,7 @@ function renderCoords(elems, className) {
   return el;
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/drop.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/drop.js
 function drop(s, e) {
   if (!s.dropmode.active)
     return;
@@ -4467,7 +4586,7 @@ function drop(s, e) {
   s.dom.redraw();
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/events.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/events.js
 function bindBoard(s, onResize) {
   const boardEl = s.dom.elements.board;
   if ("ResizeObserver" in window)
@@ -4529,7 +4648,7 @@ var dragOrDraw = (s, withDrag, withDraw) => (e) => {
     withDrag(s, e);
 };
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/render.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/render.js
 function render2(s) {
   const asWhite = whitePov(s), posToTranslate2 = posToTranslate(s.dom.bounds()), boardEl = s.dom.elements.board, pieces = s.pieces, curAnim = s.animation.current, anims = curAnim ? curAnim.plan.anims : /* @__PURE__ */ new Map(), fadings = curAnim ? curAnim.plan.fadings : /* @__PURE__ */ new Map(), curDrag = s.draggable.current, squares = computeSquareClasses(s), samePieces = /* @__PURE__ */ new Set(), sameSquares = /* @__PURE__ */ new Set(), movedPieces = /* @__PURE__ */ new Map(), movedSquares = /* @__PURE__ */ new Map();
   let k, el, pieceAtKey, elPieceName, anim2, fading, pMvdset, pMvd, sMvdset, sMvd;
@@ -4655,7 +4774,6 @@ function renderResized(s) {
   }
 }
 function updateBounds(s) {
-  var _a, _b;
   const bounds = s.dom.elements.wrap.getBoundingClientRect();
   const container = s.dom.elements.container;
   const ratio = bounds.height / bounds.width;
@@ -4664,8 +4782,8 @@ function updateBounds(s) {
   container.style.width = width + "px";
   container.style.height = height + "px";
   s.dom.bounds.clear();
-  (_a = s.addDimensionsCssVarsTo) === null || _a === void 0 ? void 0 : _a.style.setProperty("---cg-width", width + "px");
-  (_b = s.addDimensionsCssVarsTo) === null || _b === void 0 ? void 0 : _b.style.setProperty("---cg-height", height + "px");
+  s.addDimensionsCssVarsTo?.style.setProperty("---cg-width", width + "px");
+  s.addDimensionsCssVarsTo?.style.setProperty("---cg-height", height + "px");
 }
 var isPieceNode = (el) => el.tagName === "PIECE";
 var isSquareNode = (el) => el.tagName === "SQUARE";
@@ -4681,7 +4799,6 @@ function posZIndex(pos, asWhite) {
 }
 var pieceNameOf = (piece) => `${piece.color} ${piece.role}`;
 function computeSquareClasses(s) {
-  var _a, _b, _c;
   const squares = /* @__PURE__ */ new Map();
   if (s.lastMove && s.highlight.lastMove)
     for (const k of s.lastMove) {
@@ -4692,12 +4809,12 @@ function computeSquareClasses(s) {
   if (s.selected) {
     addSquare(squares, s.selected, "selected");
     if (s.movable.showDests) {
-      const dests = (_a = s.movable.dests) === null || _a === void 0 ? void 0 : _a.get(s.selected);
+      const dests = s.movable.dests?.get(s.selected);
       if (dests)
         for (const k of dests) {
           addSquare(squares, k, "move-dest" + (s.pieces.has(k) ? " oc" : ""));
         }
-      const pDests = (_c = (_b = s.premovable.customDests) === null || _b === void 0 ? void 0 : _b.get(s.selected)) !== null && _c !== void 0 ? _c : s.premovable.dests;
+      const pDests = s.premovable.customDests?.get(s.selected) ?? s.premovable.dests;
       if (pDests)
         for (const k of pDests) {
           addSquare(squares, k, "premove-dest" + (s.pieces.has(k) ? " oc" : ""));
@@ -4736,7 +4853,7 @@ function appendValue(map, key, value) {
     map.set(key, [value]);
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/sync.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/sync.js
 function syncShapes2(shapes, root, renderShape3) {
   const hashesInDom = /* @__PURE__ */ new Map(), toRemove = [];
   for (const sc of shapes)
@@ -4758,33 +4875,32 @@ function syncShapes2(shapes, root, renderShape3) {
   }
 }
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/autoPieces.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/autoPieces.js
 function render3(state, autoPieceEl) {
   const autoPieces = state.drawable.autoShapes.filter((autoShape) => autoShape.piece);
   const autoPieceShapes = autoPieces.map((s) => {
     return {
       shape: s,
       hash: hash(s),
-      current: false
+      current: false,
+      pendingErase: false
     };
   });
   syncShapes2(autoPieceShapes, autoPieceEl, (shape) => renderShape2(state, shape, state.dom.bounds()));
 }
 function renderResized2(state) {
-  var _a;
   const asWhite = whitePov(state), posToTranslate2 = posToTranslate(state.dom.bounds());
-  let el = (_a = state.dom.elements.autoPieces) === null || _a === void 0 ? void 0 : _a.firstChild;
+  let el = state.dom.elements.autoPieces?.firstChild;
   while (el) {
     translateAndScale(el, posToTranslate2(key2pos(el.cgKey), asWhite), el.cgScale);
     el = el.nextSibling;
   }
 }
 function renderShape2(state, { shape, hash: hash2 }, bounds) {
-  var _a, _b, _c;
   const orig = shape.orig;
-  const role = (_a = shape.piece) === null || _a === void 0 ? void 0 : _a.role;
-  const color = (_b = shape.piece) === null || _b === void 0 ? void 0 : _b.color;
-  const scale = (_c = shape.piece) === null || _c === void 0 ? void 0 : _c.scale;
+  const role = shape.piece?.role;
+  const color = shape.piece?.color;
+  const scale = shape.piece?.scale;
   const pieceEl = createEl("piece", `${role} ${color}`);
   pieceEl.setAttribute("cgHash", hash2);
   pieceEl.cgKey = orig;
@@ -4792,12 +4908,9 @@ function renderShape2(state, { shape, hash: hash2 }, bounds) {
   translateAndScale(pieceEl, posToTranslate(bounds)(key2pos(orig), whitePov(state)), scale);
   return pieceEl;
 }
-var hash = (autoPiece) => {
-  var _a, _b, _c;
-  return [autoPiece.orig, (_a = autoPiece.piece) === null || _a === void 0 ? void 0 : _a.role, (_b = autoPiece.piece) === null || _b === void 0 ? void 0 : _b.color, (_c = autoPiece.piece) === null || _c === void 0 ? void 0 : _c.scale].join(",");
-};
+var hash = (autoPiece) => [autoPiece.orig, autoPiece.piece?.role, autoPiece.piece?.color, autoPiece.piece?.scale].join(",");
 
-// node_modules/.pnpm/chessground@9.2.1/node_modules/chessground/dist/chessground.js
+// node_modules/.pnpm/@lichess-org+chessground@9.8.5/node_modules/@lichess-org/chessground/dist/chessground.js
 function Chessground(element, config) {
   const maybeState = defaults();
   configure(maybeState, config || {});
@@ -4807,8 +4920,8 @@ function Chessground(element, config) {
       render2(state);
       if (elements.autoPieces)
         render3(state, elements.autoPieces);
-      if (!skipSvg && elements.svg)
-        renderSvg(state, elements.svg, elements.customSvg);
+      if (!skipSvg && elements.shapes)
+        renderSvg(state, elements);
     }, onResize = () => {
       updateBounds(state);
       renderResized(state);