/* library.css - the Library index (/resources/) and the "More in <topic>" cluster
   block that build_library.py writes at the end of every mapped page's main content.
   Generated regions reference this as /assets/css/library.css?v=1; bump the token in
   .github/scripts/build_library.py (CSS_HREF) whenever this file changes, then run
   `python .github/scripts/asset_version_lint.py --update`.

   Palette: the site's own dark register. Contrast measured against the page
   background #0a0b0f - body text #cfc6b0 = 11.4:1, links #d9b877 = 9.5:1,
   muted blurbs #a89e88 = 7.2:1. All above AA for normal text. The public pages
   have no light mode (no prefers-color-scheme rule anywhere in styles.css or
   chrome.css as of 2026-09-27), so there is nothing to invert; the one rule below
   only keeps the block readable if a browser forces colors. */

/* ============================ the Library index ============================ */

.lib-index {
  max-width: 920px;
  margin: 40px auto 8px;
  padding: 22px 24px 18px;
  border: 1px solid #2a2620;
  background: #0e0f14;
}
.lib-index-lede {
  font-family: 'Cinzel', serif;
  font-size: .74rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #a89e88;
  margin: 0 0 14px;
}
.lib-index-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px 28px;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) { .lib-index-list { grid-template-columns: 1fr 1fr; } }
@media (min-width: 960px) { .lib-index-list { grid-template-columns: 1fr 1fr 1fr; } }
.lib-index-list li {
  font-family: 'EB Garamond', serif;
  font-size: 1.02rem;
  line-height: 1.45;
}
.lib-index-list a { color: #d9b877; text-decoration: none; }
.lib-index-list a:hover,
.lib-index-list a:focus-visible { text-decoration: underline; }
.lib-index-count {
  color: #a89e88;
  font-size: .86rem;
  margin-left: .35em;
}

.lib-topic {
  max-width: 920px;
  margin: 56px auto 0;
  padding: 0 4px;
}
.lib-topic-h {
  font-family: 'Cinzel', serif;
  font-weight: 700;
  font-size: clamp(1.35rem, 3vw, 1.75rem);
  line-height: 1.2;
  letter-spacing: .03em;
  color: #e8e2d3;
  margin: 0 0 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #2a2620;
}
.lib-topic-intro {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.08rem;
  line-height: 1.5;
  color: #cfc6b0;
  margin: 0 0 18px;
  max-width: 44rem;
}
.lib-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
  grid-template-columns: 1fr;
}
@media (min-width: 760px) { .lib-list { grid-template-columns: 1fr 1fr; gap: 16px 32px; } }
.lib-item { min-width: 0; }
.lib-item-link {
  display: block;
  font-family: 'Cinzel', serif;
  font-size: 1rem;
  line-height: 1.35;
  letter-spacing: .02em;
  color: #d9b877;
  text-decoration: none;
  overflow-wrap: break-word;
}
.lib-item-link:hover,
.lib-item-link:focus-visible { text-decoration: underline; }
.lib-item-blurb {
  display: block;
  font-family: 'EB Garamond', serif;
  font-size: .96rem;
  line-height: 1.5;
  color: #a89e88;
  margin-top: 4px;
  overflow-wrap: break-word;
}

/* ===================== the "More in <topic>" cluster block ===================== */

.lib-cluster {
  max-width: 760px;
  margin: 56px auto 8px;
  padding: 22px 24px 18px;
  border-top: 1px solid #2a2620;
  border-bottom: 1px solid #2a2620;
  background: #0e0f14;
  box-sizing: border-box;
}
.lib-cluster-h {
  font-family: 'Cinzel', serif;
  font-size: .76rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #a89e88;
  margin: 0 0 14px;
}
.lib-cluster-list {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: grid;
  gap: 9px 28px;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) { .lib-cluster-list { grid-template-columns: 1fr 1fr; } }
.lib-cluster-list li {
  font-family: 'EB Garamond', serif;
  font-size: 1.02rem;
  line-height: 1.45;
  min-width: 0;
}
.lib-cluster-list a,
.lib-cluster-all a { color: #d9b877; text-decoration: none; overflow-wrap: break-word; }
.lib-cluster-list a:hover,
.lib-cluster-list a:focus-visible,
.lib-cluster-all a:hover,
.lib-cluster-all a:focus-visible { text-decoration: underline; }
.lib-cluster-all {
  font-family: 'Cinzel', serif;
  font-size: .8rem;
  letter-spacing: .12em;
  margin: 0;
  padding-top: 12px;
  border-top: 1px solid #211e18;
}

@media (forced-colors: active) {
  .lib-index, .lib-cluster { border-color: CanvasText; background: Canvas; }
  .lib-index-list a, .lib-item-link, .lib-cluster-list a, .lib-cluster-all a { color: LinkText; }
}

@media print {
  .lib-cluster { display: none !important; }
}
