.bk-book-cover {
  position: relative;
  aspect-ratio: 5 / 7;
  container-type: size;
  overflow: hidden;
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .35), 0 0 0 1px rgba(0, 0, 0, .35);
  background: #2f4d70;
  isolation: isolate;
}
.bk-book-cover::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url("cover-bg.svg") center / 100% 100% no-repeat;
  filter: var(--bk-tone, none);
}
.bk-book-cover[data-tone="1"] { --bk-tone: hue-rotate(-165deg) saturate(.75) brightness(1.08); }
.bk-book-cover[data-tone="2"] { --bk-tone: hue-rotate(-75deg) saturate(.7) brightness(.95); }
.bk-book-cover[data-tone="3"] { --bk-tone: hue-rotate(20deg) saturate(.5) brightness(.8); }
.bk-book-title {
  position: absolute;
  left: 14.7%;
  top: 7%;
  width: 19.3%;
  height: 71%;
  box-sizing: border-box;
  padding: 3% 0;
  display: flex;
  align-items: center;
  justify-content: center;
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-family: "Songti SC", "STSong", "SimSun", "Noto Serif CJK SC", "Noto Serif SC", serif;
  font-weight: 700;
  font-size: 14px;
  font-size: min(9cqw, calc(60cqh / var(--n, 8)));
  line-height: 1.05;
  letter-spacing: .06em;
  color: #2a1f12;
  background: linear-gradient(180deg, #efe3c3, #e4d4aa);
  border: 1px solid #6f5d38;
  box-shadow: inset 0 0 0 2px #efe3c3, inset 0 0 0 3px #8d7a4f, 0 1px 3px rgba(0, 0, 0, .35);
  overflow: hidden;
  white-space: nowrap;
}
.bk-locked::before { filter: var(--bk-tone, none) grayscale(.55) brightness(.7); }
.bk-lock {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 7%;
  text-align: center;
  font: 700 clamp(10px, 8cqw, 14px) "Songti SC", "SimSun", serif;
  color: #f1e6c3;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .8);
  letter-spacing: .1em;
}
.bk-lock::before { content: "🔒 "; }
.bk-gear {
  position: absolute;
  top: 4px;
  left: 4px;
  z-index: 5;
  width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  font-size: 14px;
  border-radius: 50%;
  background: rgba(0, 0, 0, .55);
  color: #f1e6c3;
  cursor: pointer;
  user-select: none;
}
.bk-gear:hover, .bk-gear:focus-visible { background: #b3402c; outline: none; }
.bk-hidden-tag {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 4;
  padding: 1px 6px;
  font: 700 11px/1.5 "Songti SC", "SimSun", serif;
  color: #fff;
  background: rgba(179, 64, 44, .9);
  border-radius: 3px;
}
