body {
  display: flex;
  justify-content: center; /* в центр по горизонтали */
  min-height: 100vh;       /* растянуть body на высоту окна */
  margin: 0;               /* убрать лишние внешние отступы */
  align-items: center;     /* в центр по вертикали */
  font-size: 25px;         /* размер шрифта обозначений */
  /* переменные */
  --cell-size: 90px;
  --chess-border-size: 45px;
}

.chess-field-row {
  display: flex;
  /* flex-direction: row; */
}

.square {
  width: var(--cell-size);
  height: var(--cell-size);
}

.white-square {
  background-image: url("images/white-wood.webp");
}

.black-square {
  background-image: url("images/black-wood.webp");
}

/* обозначения рядов и столбцов */

.border-cell {
  display: flex;
  background-color: rgb(240, 224, 248);
  box-sizing: border-box; /* размер ячейки включает внутренние отступы */
  padding: 5px;           /* внутренние отступы */
}

.corner {
  width: var(--chess-border-size);
  height: var(--chess-border-size);
}

.letter {
  justify-content: center;
  align-items: start;
  width: var(--cell-size);
  height: var(--chess-border-size);
}

.digit {
  justify-content: end;
  align-items: center;
  width: var(--chess-border-size);
  height: var(--cell-size);
}

.top-letter {
  transform: rotate(180deg);
}

.right-digit {
  transform: rotate(180deg);
}