/* ══════════════════════════════════════════════════
   Vista estantería (lomos)
══════════════════════════════════════════════════ */
.books-shelf {
  display: flex; flex-wrap: wrap; align-items: flex-end;
  gap: 26px 6px; padding: 0 4px 24px;
  background: repeating-linear-gradient(to bottom,
    transparent 0 190px,
    var(--shelf-board) 190px 198px,
    rgba(30,26,20,.12) 198px 200px,
    transparent 200px 216px);
}
.shelf-book {
  height: 190px; flex-shrink: 0; position: relative; cursor: pointer;
  border-radius: 2px 3px 0 0; background-size: cover; background-position: center;
  background-color: var(--bg3);
  box-shadow: inset -2px 0 3px rgba(0,0,0,.28), inset 2px 0 2px rgba(255,255,255,.18),
              2px 3px 6px rgba(30,26,20,.28);
  display: flex; align-items: center; justify-content: center;
  animation: cardIn .3s ease both;
}
.shelf-book::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(100deg, rgba(0,0,0,.4), rgba(0,0,0,.1) 55%, rgba(0,0,0,.34));
}
.shelf-title {
  position: relative; z-index: 1;
  writing-mode: vertical-rl;
  color: #fff; font-weight: 700; font-size: .95rem; letter-spacing: .01em;
  text-shadow: 0 1px 3px rgba(0,0,0,.8);
  max-height: 170px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  padding: 8px 0;
}
.shelf-eye {
  position: absolute; top: 6px; left: 50%; transform: translateX(-50%); z-index: 2;
  color: #fff; opacity: .92; filter: drop-shadow(0 1px 2px rgba(0,0,0,.6));
}
.shelf-eye svg { width: 14px; height: 14px; display: block; }

.shelf-popup {
  position: fixed; z-index: 600; width: 232px; display: flex; gap: 10px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r); box-shadow: var(--shadow-lg); padding: 10px;
  pointer-events: none;
}
.shelf-pop-cover {
  width: 50px; height: 75px; border-radius: 4px; overflow: hidden;
  background: var(--bg3); flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.shelf-pop-cover img { width: 100%; height: 100%; object-fit: cover; }
.shelf-pop-nc { font-size: .55rem; text-align: center; color: var(--ink2); padding: 3px; line-height: 1.2; }
.shelf-pop-info { flex: 1; min-width: 0; }
.shelf-pop-title { font-weight: 700; font-size: .85rem; color: var(--ink); line-height: 1.25; margin-bottom: 3px; }
.shelf-pop-author { font-size: .76rem; color: var(--gold); margin-bottom: 5px; }
.shelf-pop-meta { font-size: .72rem; color: var(--muted); line-height: 1.4; }