.back-link {
  border: 0;
  background: none;
  padding: 0;
  color: #637568;
  font-size: 13px;
  font-weight: 700;
}
.detail-page {
  padding-top: 33px;
  padding-bottom: 80px;
}
.detail-layout {
  display: grid;
  grid-template-columns: minmax(260px, 435px) 1fr;
  gap: clamp(50px, 8vw, 110px);
  margin-top: 45px;
}
.detail-art {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.detail-cover {
  width: 100%;
  max-width: 420px;
  height: 555px;
  box-shadow: 17px 20px 25px #56625722;
}
.detail-cover .cover__inner {
  padding: 37px;
}
.detail-cover .cover__inner strong {
  font-size: 49px;
}
.detail-art__caption {
  font-size: 10px;
  letter-spacing: 0.12em;
  color: #929991;
  margin-top: 24px;
}
.detail-copy {
  padding-top: 20px;
}
.detail-copy h1 {
  font-size: clamp(50px, 5.8vw, 80px);
  line-height: 1.02;
  margin: 17px 0 8px;
}
.detail-author {
  font-size: 19px;
  color: #536b58;
  margin: 0 0 36px;
}
.detail-description {
  font-size: 17px;
  line-height: 1.8;
  max-width: 585px;
  color: #58655c;
}
.detail-copy blockquote {
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 25px;
  line-height: 1.4;
  max-width: 520px;
  border-left: 2px solid #bf8b6e;
  padding-left: 25px;
  margin: 33px 0;
  color: #526d5c;
}
.detail-actions {
  display: flex;
  align-items: center;
  gap: 13px;
  flex-wrap: wrap;
}
.access-note {
  font-size: 13px;
  color: #477352;
}
.detail-facts {
  display: flex;
  gap: 35px;
  border-top: 1px solid var(--line);
  margin-top: 50px;
  padding-top: 21px;
}
.detail-facts div {
  display: grid;
  gap: 9px;
}
.detail-facts span {
  font-size: 10px;
  color: #90968d;
  letter-spacing: 0.12em;
}
.detail-facts strong {
  font-size: 13px;
}
.detail-next {
  border-top: 1px solid var(--line);
  margin-top: 90px;
  padding-top: 45px;
}
.related-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 240px));
  gap: 35px;
  margin-top: 20px;
}
.related-grid .cover {
  height: 260px;
}
.related-grid .cover__inner {
  padding: 20px;
}
.related-grid .cover__inner strong {
  font-size: 25px;
}
.library-page {
  min-height: 70vh;
  padding-top: 72px;
  padding-bottom: 100px;
}
.library-page h1 {
  font-size: 65px;
  margin: 18px 0 7px;
}
.library-count {
  font:
    500 17px Arial,
    sans-serif;
  display: inline-grid;
  place-items: center;
  background: #dce8dc;
  color: #406c50;
  border-radius: 50%;
  width: 34px;
  height: 34px;
  vertical-align: middle;
  margin-left: 18px;
  letter-spacing: 0;
}
.library-intro {
  color: var(--muted);
  line-height: 1.6;
}
.empty-library {
  text-align: center;
  border: 1px solid #dce1d8;
  background: #f9f8f3;
  max-width: 680px;
  margin: 65px auto 30px;
  padding: 60px 30px;
}
.empty-library__icon {
  font-size: 38px;
  color: #ab7a5c;
}
.empty-library h2 {
  font:
    400 32px Georgia,
    serif;
  margin: 15px;
}
.empty-library p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 25px;
}
.library-disclaimer {
  font-size: 12px;
  color: #999e95;
  margin-top: 40px;
}
.library-list {
  margin-top: 50px;
  display: grid;
  gap: 18px;
}
.library-item {
  display: grid;
  grid-template-columns: 125px 1fr auto;
  gap: 28px;
  align-items: center;
  border: 1px solid #e1e5dc;
  background: #fbfaf6;
  padding: 15px 22px 15px 15px;
}
.library-cover {
  height: 150px;
}
.library-cover .cover__inner {
  padding: 13px;
}
.library-cover .cover__inner strong {
  font-size: 16px;
}
.library-item h2 {
  font:
    400 31px Georgia,
    serif;
  margin: 8px 0 5px;
}
.library-item p {
  color: var(--muted);
  margin: 0 0 16px;
}
.reading-status {
  font-size: 12px;
  color: #4f6d56;
}