/* Стиль для канваса */
canvas {
  display: block;
  margin: 0 auto;
}

#controls {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 10px;
}

.controls__leftright {
  gap: 160px;
}

#controls div {
  display: flex;
  justify-content: center;
}

.up,
.down,
.left,
.right {
  background-color: green;
  width: 100px;
  height: 100px;
  margin: 15px auto 0 auto;
  display: block;
  background: rgb(57, 90, 60);
  color: white;
  border: none;
  font-size: 16px;
  cursor: pointer;
  font-family: 'Roboto', sans-serif;
  font-size: 19px;
  font-weight: 700;
  line-height: 24.32px;
}

.up:active,
.down:active,
.left:active,
.right:active {
  background: rgb(80, 120, 80);
}

/* Адаптація для мобільних пристроїв */
@media screen and (max-width: 750px) {

  .up,
  .down,
  .left,
  .right {
    height: 70px;
    width: 70px;
  }

  .canva {
    width: 100%;
    max-width: 608px;
  }

  .controls__leftright {
    gap: 80px;
  }

  .wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}