/* Credits - one page for the attributions the licences ask for.

   Three of the site's borrowed parts are CC BY 4.0, which wants the credit
   somewhere a reader can find rather than on every page. The colophon carried
   one of them under every 法本 and none of the others; this carries all of them
   once, and the footer links here. */
.credits {
  margin: 0 auto;
  max-width: 720px;
  padding: 0 14px 32px;
  text-align: left;
}

.credits__head {
  border-bottom: 1px solid #ddddc8;
  padding: 14px 0 12px;
}

.credits__title {
  color: #4e0d0d;
  font-size: 1.45em;
  margin: 0;
}

.credits__lead {
  color: #6b6257;
  font-size: 0.95em;
  line-height: 1.7;
  margin: 8px 0 0;
}

/* The name set the way the home page sets it - the .home-mark__* rules in
   public.css are the original, and they are copied here rather than linked
   because this page would otherwise pull in the whole of public.css, hero and
   site cards and all, for three declarations. Two differences on purpose:
   inline-flex, because here the name opens a sentence rather than centring a
   page, and body size rather than the home page's viewport clamp - it is the
   subject of the sentence it is in, not a heading over it, so it takes the
   serif, the weight and the ochre and leaves the size alone. */
.credits__mark {
  align-items: baseline;
  color: #4e0d0d;
  display: inline-flex;
  font-family: "Noto Serif CJK SC", "Songti SC", "Source Han Serif SC", serif;
  font-size: 1em;
  font-weight: 700;
  gap: 0.16em;
  margin-right: 0.3em;
}

.credits__mark-latin {
  letter-spacing: 0.14em;
  /* The tracking pushes the last letter off centre; this puts it back. */
  text-indent: 0.14em;
}

/* A CJK glyph fills its em box, so 不离 hangs low beside Latin caps and reads
   bigger at the same nominal size. 0.76em matches its ink height to the cap
   height, and the shift lifts its optical centre onto theirs. */
.credits__mark-cn {
  color: #a53a2a;
  font-size: 0.76em;
  letter-spacing: 0.24em;
  text-indent: 0.24em;
  transform: translateY(-0.21em);
}

/* A definition list rather than a table: two of these entries wrap onto three
   lines on a phone, and a table makes that a column of one word. */
.credits__list {
  margin: 0;
  padding: 16px 0 0;
}

.credits__what {
  color: #4e0d0d;
  font-size: 0.95em;
  font-weight: 600;
  padding-top: 14px;
}

.credits__who {
  color: #4e3a2a;
  font-size: 0.92em;
  line-height: 1.8;
  margin: 2px 0 0;
}

.credits__who a {
  color: #7a1f1f;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 2px;
}

.credits__who a:hover {
  color: #4e0d0d;
}

/* The licence name is the fine print of the line, not part of the name. */
.credits__licence {
  color: #9a8f80;
  font-size: 0.85em;
  padding-left: 6px;
  white-space: nowrap;
}

.credits__via {
  color: #6b6257;
  display: inline-block;
  padding-left: 6px;
}