#sds-tapeDoorGroup {
  transform-origin: bottom center;
  position: absolute;
  transition: transform 0.25s, filter 0.4s;
  transition-timing-function: ease-in-out;
  z-index: 1;
}

.openTapeDoor {
  transform: perspective(3000px) rotateX(-50deg);
  filter: drop-shadow(0px 0px 14px #00000041);
}

.unclickable {
  pointer-events: none;
}

#sds-tapeDoorImg {
  pointer-events: all;
}

#sds-tapeDoorHitbox {
  position: absolute;
  cursor: pointer;
  width: 200px;
  height: 35px;
  transform: translate(24px, 24px);
}

#sds-cartHelper {
  max-width: 290px;
  top: 34px;
  position: relative;
  z-index: 0;
}

#sds-tapeDeckDots {
  position: absolute;
  width: 434px;
  aspect-ratio: 1/1;
  transform: translateY(18px);
  pointer-events: none;

  background-image: radial-gradient(
    rgba(79, 79, 79, 0.463) 10%,
    transparent 10%
  );
  background-position: 8px 8px;
  background-size: 12px 12px;
  opacity: 0.7;
}

/*  */
/* cartridge */
/*  */

.sds-cart {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 380px;
  pointer-events: all;
  user-select: none;

  position: absolute;
  z-index: 1;

  cursor: grab;

  transform: scale(0.7);

  filter: drop-shadow(0 5px 8px #0000003d);
}

.inDeck {
  transition: transform 1s;
}

.inDeck:hover {
  transform: translateY(5px);
}

.sds-cartBackground {
  z-index: -2;
  pointer-events: all;
}

.sds-cartArtwork {
  width: 305px;
  height: 240px;
  object-fit: cover;
  position: absolute;
  /* z-index: 1; */
}

.sds-cartOverlay {
  position: absolute;
  opacity: 0.8;
}

.sds-cartBranding {
  position: absolute;
  transform: translateY(-8px);
  width: 306px;
}

.sds-cartText {
  position: absolute;
  color: var(--color-white);

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.sds-cartIcon {
  width: 60px;
  margin-bottom: 10px;
}

.sds-cartTitle {
  font-size: 1.9rem;
  font-family: Chakra Petch;
  font-weight: bold;
  line-height: 2rem;
  text-align: center;
}

.sds-cartCaption {
  font-family: Barlow Condensed;
  line-height: 1rem;
  text-align: center;
  text-transform: uppercase;
}

.sds-cartSerial {
  position: absolute;
  width: 280px;
  text-align: end;
  white-space: nowrap;
  transform: translate(0, 138px);
  font-family: space mono;
  text-transform: uppercase;
}