.container {
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 8rem;
  max-width: 10rem;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  pointer-events: none;
}

.banish,
.graveyard {
  left: 70%;
}

.field,
.extra-deck {
  right: 130%;
}

.op {
  transform: rotate(180deg);
}

.chain {
  position: relative;
  width: 50%;
  height: 50%;
  display: flex;

  img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    animation: rotate 5s linear infinite;
  }

  .text {
    position: absolute;
    font-size: 2rem;
    font-weight: bold;
    top: 50%;
    left: 50%;
    -webkit-text-stroke: 1px black;
    transform: translate(-50%, -50%);
  }

  @keyframes rotate {
    from {
      transform: rotate(0deg);
    }

    to {
      transform: rotate(360deg);
    }
  }
}
