/* 吃子与将军的画面反馈。整层铺在棋盘自己的坐标系里，棋盘翻转时跟着转，
   只有印面文字反向摆正。尺寸全部跟着 --board-effect-unit（棋盘宽度）走，
   从 320px 的手机到桌面宽屏都是同一套比例。 */
.board-effects { position: absolute; inset: 0; z-index: 6; overflow: hidden; pointer-events: none; }
.board-effects * { pointer-events: none; }

.board-effect { position: absolute; display: block; transform: translate(-50%, -50%); }
.board.is-flipped .board-effect { transform: translate(-50%, -50%) rotate(180deg); }
.board-effect-body { display: flex; align-items: center; justify-content: center;
  gap: calc(var(--board-effect-unit, 360px) * .01); }

/* 将军：一方朱印压在棋盘正中，红底白字，任何棋盘皮肤上都压得住。 */
.board-effect-check .board-effect-body {
  padding: calc(var(--board-effect-unit, 360px) * .026) calc(var(--board-effect-unit, 360px) * .042);
  border: 2px solid #7d1a12; border-radius: calc(var(--board-effect-unit, 360px) * .032);
  background: linear-gradient(160deg, #d8473a, #a92a1e 62%, #8d1f16);
  box-shadow: 0 0 0 2px #ffe7b4, 0 calc(var(--board-effect-unit, 360px) * .018) calc(var(--board-effect-unit, 360px) * .045) #1e080480;
  color: #fff6e2;
}
.board-effect-check .board-effect-glyph { width: calc(var(--board-effect-unit, 360px) * .155); height: calc(var(--board-effect-unit, 360px) * .155); }

/* 吃：同一枚印，小一号，落在被吃掉的格子上。 */
.board-effect-capture .board-effect-body {
  padding: calc(var(--board-effect-unit, 360px) * .015) calc(var(--board-effect-unit, 360px) * .021);
  border: 1.5px solid #7d1a12; border-radius: calc(var(--board-effect-unit, 360px) * .018);
  background: linear-gradient(160deg, #e2604f, #b5301f 60%, #93200f);
  box-shadow: 0 0 0 1.5px #ffe7b4, 0 calc(var(--board-effect-unit, 360px) * .012) calc(var(--board-effect-unit, 360px) * .028) #1e080473;
  color: #fff6e2;
}
.board-effect-capture .board-effect-glyph { width: calc(var(--board-effect-unit, 360px) * .095); height: calc(var(--board-effect-unit, 360px) * .095); }

/* 被吃掉的棋子：留在原地发红、放大、散开，落子到位前后刚好收干净。 */
.capture-ring { grid-area: 1 / 1; width: 88%; height: 88%; border: 2px solid #c8342a; border-radius: 50%;
  box-shadow: inset 0 0 8px #ffb28a99, 0 0 10px #c8342a88; }
