/* ==========================================================================
   BIBLIOTECA
   ========================================================================== */
.library-list { display: grid; gap: var(--space-7); }

.testament-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--ink);
  margin-bottom: var(--space-5);
}
.testament-head h2 {
  font-family: var(--font-display);
  font-size: var(--fs-2xl);
  font-weight: 400;
  font-style: italic;
  letter-spacing: -.02em;
  line-height: 1;
}
.testament-head span { font-size: var(--fs-sm); color: var(--ink-3); font-variant-numeric: tabular-nums; }

.category { display: grid; grid-template-columns: 220px 1fr; gap: var(--space-5); padding: var(--space-4) 0 var(--space-5); border-bottom: 1px solid var(--line); }
.category:last-child { border-bottom: 0; }
.category-name { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); padding-top: .9em; }

.book-rows { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 2px var(--space-5); }
.book-row {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 2px var(--space-3);
  padding: .7em .2em .8em;
  border-bottom: 1px dashed transparent;
  transition: color var(--dur-1);
}
.book-row .bn {
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -.01em;
  transition: transform var(--dur-2) var(--ease-out), color var(--dur-1);
}
.book-row .bc { font-size: .72rem; color: var(--ink-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.book-row .bc b { color: var(--accent); font-weight: 700; }
.book-row .meter { height: 3px; background: color-mix(in oklab, var(--ink) 7%, transparent); }
.book-row .meter { grid-column: 1 / -1; height: 2px; }
.book-row .bm { position: absolute; right: .2em; top: .2em; display: flex; gap: 3px; color: var(--accent); }
.book-row .bm .icon { width: 12px; height: 12px; }
.book-row:hover .bn { color: var(--accent); transform: translateX(4px); }
.book-row.is-done .bn::after { content: " ✓"; font-family: var(--font-ui); font-size: .6em; color: var(--accent); }

/* ---------- Estantería ---------- */
.library-list.is-shelf .category { grid-template-columns: 1fr; gap: var(--space-4); }
.shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: var(--space-6) var(--space-5); padding-bottom: var(--space-3); }
.shelf-book { display: grid; gap: var(--space-3); perspective: 900px; }
.shelf-cover { position: relative; }
.shelf-cover .book-cover { transform-origin: left center; transition: transform .55s var(--ease-out), box-shadow .55s var(--ease-out); }
.shelf-book:hover .shelf-cover .book-cover { transform: rotateY(-16deg) translateY(-4px); }
.shelf-ribbon {
  position: absolute;
  top: 0;
  right: 16%;
  width: 9%;
  height: calc(10% + var(--p) * .78%);
  background: linear-gradient(90deg, color-mix(in oklab, var(--accent) 80%, #000), var(--accent) 45%, color-mix(in oklab, var(--accent) 75%, #000));
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% calc(100% - 7px), 0 100%);
  filter: drop-shadow(0 2px 2px rgb(0 0 0 / .3));
}
.shelf-seal {
  position: absolute;
  right: -8px;
  top: -8px;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--foil);
  color: #3a2a10;
  box-shadow: 0 4px 10px rgb(0 0 0 / .35);
}
.shelf-seal .icon { width: 18px; height: 18px; stroke-width: 2.6; }
.shelf-meta { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--space-2); font-size: .72rem; font-weight: 600; color: var(--ink-3); }
.shelf-meta .meter { height: 4px; }
.shelf-book.is-done .shelf-meta { color: var(--accent); }

/* ---------- Detalle de libro ---------- */
.book-detail { max-width: 1040px; }
.bd-back { margin-bottom: var(--space-5); }
.bd-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: var(--space-5);
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--ink);
  margin-bottom: var(--space-6);
}
.bd-title {
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: 400;
  line-height: .95;
  letter-spacing: -.035em;
  margin-top: var(--space-2);
}
.bd-meta { display: flex; gap: var(--space-5); margin-top: var(--space-4); flex-wrap: wrap; }
.bd-meta div { display: grid; }
.bd-meta b { font-family: var(--font-display); font-size: 1.8rem; font-weight: 400; line-height: 1; font-variant-numeric: lining-nums; }
.bd-meta span { font-size: .72rem; color: var(--ink-3); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.bd-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; justify-content: flex-end; }
.bd-section-title { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 var(--space-3); }
.book-detail .chapter-grid { grid-template-columns: repeat(auto-fill, minmax(60px, 1fr)); gap: 8px; }
.bd-legend { display: flex; gap: var(--space-4); margin-top: var(--space-4); font-size: .75rem; color: var(--ink-3); flex-wrap: wrap; }
.bd-legend span { display: inline-flex; align-items: center; gap: 6px; }
.bd-legend i { width: 12px; height: 12px; border-radius: 3px; border: 1px solid var(--line-2); }
.bd-legend i.read { background: var(--accent-soft); border-color: var(--accent-line); }
.bd-legend i.note { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); border: 0; }

@media (max-width: 900px) {
  .category { grid-template-columns: 1fr; gap: var(--space-2); }
  .category-name { padding-top: 0; }
}
@media (max-width: 760px) {
  .view-library .view-head { flex-direction: column; align-items: stretch; }
  .view-library .view-head-actions { justify-content: space-between; }
  .book-rows { grid-template-columns: 1fr 1fr; gap: 0 var(--space-4); }
  .book-row .bn { font-size: 1.2rem; }
  .shelf { grid-template-columns: repeat(3, 1fr); gap: var(--space-5) var(--space-3); }
  .bd-hero { grid-template-columns: 1fr; }
  .bd-actions { justify-content: flex-start; }
  .book-detail .chapter-grid { grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 6px; }
}