/* 「读过的」书单：海报墙、最爱大海报沿用 watched.css，这里只写书单自己的部分 */

/* 多卷 / 系列：封面右下角一个小角标 */
.b-vols {
  position: absolute; right: 6px; bottom: 6px; padding: 2px 8px; border-radius: 999px;
  background: rgba(20, 18, 24, .78); color: #fff; font-size: 11.5px; font-style: normal; letter-spacing: .04em; text-shadow: none;
}

/* ---------- 人生中第一本书：最爱下面一张横向的特别卡片 ---------- */
.first-book { grid-column: 1 / -1; list-style: none; }
.fb-card {
  display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 24px; align-items: center; padding: 16px 24px 16px 16px;
  transition: transform .2s ease;
}
.fb-card:hover { transform: translateY(-2px); }
.fb-img { display: block; aspect-ratio: 2 / 3; border-radius: 10px; overflow: hidden; border: 1.5px solid var(--card-line); box-shadow: 4px 4px 0 var(--card-shadow); transform: rotate(-3deg); }
.fb-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fb-text { display: grid; gap: 6px; min-width: 0; }
.fb-k { justify-self: start; padding: 3px 12px; border-radius: 999px; border: 1.5px solid var(--accent); color: var(--accent); font-size: 13px; letter-spacing: .1em; }
.fb-t { font-size: clamp(26px, 3.6vw, 38px); line-height: 1.1; }
.fb-o { font-size: 14px; color: var(--muted); }

@media (max-width: 640px) {
  .b-vols { font-size: 10px; padding: 1px 6px; right: 4px; bottom: 4px; }
  .fb-card { grid-template-columns: 76px minmax(0, 1fr); gap: 14px; padding: 12px; }
  .fb-k { font-size: 11.5px; padding: 2px 9px; }
  .fb-t { font-size: 24px; }
  .fb-o { font-size: 12px; }
}

/* 雨夜 */
@media (pointer: fine) and (min-aspect-ratio: 6/5), (pointer: none) and (min-aspect-ratio: 6/5), (pointer: coarse) and (min-aspect-ratio: 2/1) {
  .fb-img { box-shadow: 0 .5rem 1.2rem rgba(0, 0, 0, .45); border-color: rgba(255, 210, 122, .35); }
  .fb-k { border-color: #F2C46D; color: #F2C46D; }
  .fb-t { font-family: var(--serif); font-style: italic; font-weight: 600; color: #FFE3A3; }
  .b-vols { background: rgba(242, 196, 109, .92); color: #1A1D26; }
}
/* 绘梨衣 */
@media (pointer: coarse) and (min-aspect-ratio: 3/5) and (max-aspect-ratio: 2/1) {
  .fb-img { border: 2px solid #111; border-radius: .2rem; box-shadow: 4px 4px 0 #111; }
  .fb-k { border-radius: 0; border: 2px solid #111; color: #111; background: #FFD43B; }
  .b-vols { border-radius: 0; background: #111; color: #FFD43B; }
}
/* 幽香 */
@media (max-aspect-ratio: 3/5), (pointer: fine) and (max-aspect-ratio: 6/5), (pointer: none) and (max-aspect-ratio: 6/5) {
  .fb-img { border-radius: 14px; box-shadow: 0 .45rem 1.1rem rgba(120, 80, 0, .2), 0 0 0 3px #9BC53D; }
  .fb-k { border-color: #5E8C1F; color: #5E8C1F; }
  .b-vols { background: rgba(245, 184, 46, .95); color: #22170A; }
}
/* 射命丸文（Duo） */
html.aya .fb-card { border-radius: .3rem; }
html.aya .fb-img { border-radius: 0; border: 4px solid #FBF8F0; box-shadow: 0 .3rem .8rem rgba(31, 27, 22, .3); }
html.aya .fb-k { border-radius: .15rem; border: 2px solid var(--red); color: var(--red); transform: rotate(-3deg); }
html.aya .b-vols { border-radius: .15rem; background: rgba(251, 248, 240, .92); color: var(--red); border: 1.5px solid var(--red); }