/* 책장 카드 모양, 투명 스티커(네모 종이 없이).
   css/ 의 파일은 index.html 에서 번호 순서대로 겹쳐 적용된다(뒤 파일이 앞 파일을 덮는다). 순서를 바꾸지 말 것. */
/* Uniform bookshelf cards: fixed cover crop, aligned copy and buttons. */
.books {
  grid-auto-rows: 1fr;
  align-items: stretch;
}
.book-card {
  display: flex;
  flex-direction: column;
}
.book-cover {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16/10;
  border-radius: 12px;
  background: #e9ecdd;
  flex: none;
}
.book-cover .scene-frame {
  position: absolute !important;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 0;
}
.book-cover.cover-wide .scene-frame {
  width: auto !important;
  height: 100%;
}
.book-cover.cover-tall .scene-frame {
  width: 100% !important;
  height: auto;
}
.book-card-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.book-card h2 {
  min-height: 34px;
}
/* Transparent die-cut stickers, like the original sticker app: no square sheet. */
#sticker-art {
  background: none;
  border-radius: 0;
}
.item-rail .sticker,
.item-rail .sticker.selected {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
.item-rail .sticker.selected:focus-visible {
  outline: 3px solid #d1ac57;
}
.paper-peel .die-c {
  color: white;
}
.paper-floating {
  transition: transform 0.09s ease-out;
}
.paper-peel.paper-press {
  transition: none;
}