.sources-hero,
.sources-section {
  width: 100%;
  max-width: var(--layout-box-page);
  margin-inline: auto;
  padding-inline: var(--layout-gutter);
}

.sources-hero {
  padding-top: calc(var(--rhythm-page-top-clear) + var(--rhythm-section-compact));
  padding-bottom: var(--rhythm-section);
}

.sources-eyebrow,
.sources-section-number,
.sources-section-label,
.sources-designated dt,
.sources-definitions dt,
.sources-treatment span,
.sources-history-class h3,
.sources-lineage-root {
  font-family: var(--mono);
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  letter-spacing: var(--type-label-ls);
  line-height: var(--type-label-lh);
  text-transform: uppercase;
}

.sources-eyebrow {
  margin: 0;
  color: var(--theme-provenance-ink);
}

.sources-hero-index {
  display: flex;
  align-items: baseline;
  gap: var(--rhythm-title-content);
  margin-bottom: var(--rhythm-title-content);
}

.sources-hero-index .sources-section-number {
  margin: 0;
}

.sources-hero h1 {
  max-width: 12ch;
  margin: 0;
  color: var(--theme-ink-primary);
  font-family: var(--serif-display);
  font-size: clamp(3.25rem, 7vw, 6rem);
  font-weight: 300;
  letter-spacing: -0.045em;
  line-height: 0.98;
}

.sources-standfirst {
  max-width: 48rem;
  margin: var(--rhythm-title-content) 0 0;
  color: var(--theme-ink-secondary);
  font-size: clamp(1.05rem, 1.6vw, 1.28rem);
  line-height: 1.58;
}

.sources-principle {
  max-width: 25ch;
  margin: var(--rhythm-section-compact) 0 0;
  padding-block: var(--rhythm-title-content);
  border-top: 1px solid var(--theme-rule-strong);
  border-bottom: 1px solid var(--theme-rule-strong);
  color: var(--theme-ink-primary);
  font-family: var(--serif-display);
  font-size: clamp(1.7rem, 3vw, 2.75rem);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1.16;
}

.sources-section {
  display: grid;
  grid-template-columns: minmax(10rem, var(--layout-sidehead)) minmax(0, 50rem);
  column-gap: var(--layout-sidehead-gap);
  justify-content: start;
  padding-top: var(--rhythm-section);
  padding-bottom: var(--rhythm-section);
  border-top: 1px solid var(--theme-rule-standard);
}

.sources-section-head {
  align-self: start;
}

.sources-section-number {
  margin: 0 0 var(--rhythm-title-content);
  color: var(--theme-provenance-ink);
}

.sources-section h2 {
  margin: 0;
  color: var(--theme-ink-primary);
  font-family: var(--serif-display);
  font-size: var(--type-section-title-size);
  font-weight: var(--type-section-title-weight);
  letter-spacing: var(--type-section-title-ls);
  line-height: var(--type-section-title-lh);
}

.sources-section h2.sources-section-label {
  color: var(--theme-provenance-ink);
  font-family: var(--mono);
  font-size: var(--type-label-size);
  font-weight: var(--type-label-weight);
  letter-spacing: var(--type-label-ls);
  line-height: var(--type-label-lh);
}

.sources-section-body,
.sources-designated,
.sources-exits {
  min-width: 0;
}

.sources-designated {
  padding: var(--rhythm-title-content);
  border-top: 2px solid var(--theme-rule-strong);
  border-bottom: 1px solid var(--theme-rule-standard);
  background: var(--theme-surface-raised);
}

.sources-designated-fields {
  display: grid;
  grid-template-columns: 0.8fr 1.25fr 1fr;
  margin: 0;
}

.sources-designated-fields > div {
  min-width: 0;
  padding-right: var(--rhythm-title-content);
}

.sources-designated-fields > div + div {
  padding-left: var(--rhythm-title-content);
  border-left: 1px solid var(--theme-rule-standard);
}

.sources-designated dt,
.sources-definitions dt,
.sources-treatment span,
.sources-history-class h3,
.sources-lineage-root {
  color: var(--theme-provenance-ink);
}

.sources-designated dd {
  margin: 0.55rem 0 0;
  color: var(--theme-ink-primary);
  font-family: var(--serif-display);
  font-size: var(--type-subsection-title-size);
  line-height: var(--type-subsection-title-lh);
}

.sources-designated > p {
  max-width: 62ch;
  margin: var(--rhythm-title-content) 0 0;
  padding-top: var(--rhythm-title-content);
  border-top: 1px solid var(--theme-rule-subtle);
  color: var(--theme-ink-secondary);
  font-size: var(--type-body-size);
  line-height: var(--type-body-lh);
}

.sources-definitions {
  margin: 0;
  border-bottom: 1px solid var(--theme-rule-standard);
}

.sources-definitions > div {
  display: grid;
  grid-template-columns: minmax(9rem, 11rem) minmax(0, 1fr);
  gap: var(--rhythm-title-content);
  padding: var(--rhythm-title-content) 0;
  border-top: 1px solid var(--theme-rule-standard);
}

.sources-definitions dd {
  max-width: 62ch;
  margin: 0;
  color: var(--theme-ink-secondary);
  font-size: var(--type-body-size);
  line-height: var(--type-body-lh);
}

.sources-closing-line {
  max-width: 65ch;
  margin: var(--rhythm-title-content) 0 0;
  color: var(--theme-ink-primary);
  font-size: var(--type-body-size);
  line-height: var(--type-body-lh);
}

.sources-quantity {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  column-gap: var(--rhythm-section-compact);
  padding: var(--rhythm-title-content) 0;
  border-top: 2px solid var(--theme-rule-strong);
  border-bottom: 1px solid var(--theme-rule-standard);
}

.sources-quantity h3 {
  margin: 0;
  color: var(--theme-ink-primary);
  font-family: var(--serif-display);
  font-size: var(--type-subsection-title-size);
  font-weight: var(--type-subsection-title-weight);
  letter-spacing: var(--type-subsection-title-ls);
  line-height: var(--type-subsection-title-lh);
}

.sources-quantity-copy > p,
.sources-treatment {
  margin: 0.6rem 0 0;
  color: var(--theme-ink-secondary);
  font-size: var(--type-body-supporting-size);
  line-height: var(--type-body-supporting-lh);
}

.sources-treatment {
  margin-top: 0;
}

.sources-treatment span {
  display: block;
  margin-bottom: 0.55rem;
}

.sources-row-link {
  display: inline-flex;
  min-height: 44px;
  grid-column: 1 / -1;
  align-items: center;
  justify-self: start;
  margin-top: var(--rhythm-title-content);
  color: var(--theme-ink-link);
  font-family: var(--mono);
  font-size: var(--type-metadata-size);
  letter-spacing: var(--type-metadata-ls);
  text-decoration: underline;
  text-decoration-color: var(--theme-rule-interactive);
  text-underline-offset: 0.25em;
}

.sources-history-classes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--rhythm-title-content);
}

.sources-history-class {
  padding: var(--rhythm-title-content) 0;
  border-top: 2px solid var(--theme-rule-strong);
  border-bottom: 1px solid var(--theme-rule-standard);
}

.sources-history-class--reconstructed {
  border-top-style: dashed;
}

.sources-history-class h3 {
  margin: 0;
}

.sources-history-class p {
  margin: 0.7rem 0 0;
  color: var(--theme-ink-secondary);
  font-size: var(--type-body-size);
  line-height: var(--type-body-lh);
}

.sources-lineage {
  border-top: 2px solid var(--theme-rule-strong);
  border-bottom: 1px solid var(--theme-rule-standard);
}

.sources-lineage-root {
  margin: 0;
  padding: var(--rhythm-title-content) 0;
}

.sources-lineage ul {
  margin: 0 0 var(--rhythm-title-content) 0.45rem;
  padding: 0 0 0 var(--rhythm-title-content);
  border-left: 1px solid var(--theme-rule-strong);
  list-style: none;
}

.sources-lineage li {
  position: relative;
  display: grid;
  grid-template-columns: minmax(10rem, 1.1fr) minmax(11rem, 1fr) minmax(9rem, 0.85fr);
  gap: var(--rhythm-title-content);
  padding: var(--rhythm-title-content) 0;
  border-top: 1px solid var(--theme-rule-subtle);
}

.sources-lineage li::before {
  position: absolute;
  top: 50%;
  left: calc(-1 * var(--rhythm-title-content));
  width: calc(var(--rhythm-title-content) / 2);
  border-top: 1px solid var(--theme-rule-strong);
  content: "";
}

.sources-lineage strong {
  color: var(--theme-ink-primary);
  font-weight: 500;
}

.sources-lineage li span {
  color: var(--theme-ink-secondary);
  font-size: var(--type-body-supporting-size);
  line-height: var(--type-body-supporting-lh);
}

.sources-prose p {
  max-width: 65ch;
  margin: 0;
  color: var(--theme-ink-secondary);
  font-size: var(--type-body-size);
  line-height: var(--type-body-lh);
}

.sources-prose p + p {
  margin-top: var(--rhythm-title-content);
  color: var(--theme-ink-primary);
}

.sources-section--exits {
  padding-bottom: calc(var(--rhythm-section) + var(--rhythm-section-compact));
}

.sources-exits {
  border-bottom: 1px solid var(--theme-rule-standard);
}

.sources-exits a {
  display: flex;
  min-height: 56px;
  align-items: center;
  justify-content: space-between;
  gap: var(--rhythm-title-content);
  border-top: 1px solid var(--theme-rule-standard);
  color: var(--theme-ink-primary);
  text-decoration: none;
}

.sources-exits a:hover {
  color: var(--theme-ink-link-hover);
}

.sources-exits span {
  font-family: var(--serif-display);
  font-size: var(--type-subsection-title-size);
}

.sources-exits small {
  color: var(--theme-ink-secondary);
  font-family: var(--mono);
  font-size: var(--type-metadata-size);
  letter-spacing: var(--type-metadata-ls);
  line-height: var(--type-metadata-lh);
  text-align: right;
}

@media (max-width: 900px) {
  .sources-section {
    grid-template-columns: minmax(0, 1fr);
    row-gap: var(--rhythm-title-content);
  }

  .sources-section-number {
    margin-bottom: 0.6rem;
  }
}

@media (max-width: 640px) {
  .sources-hero {
    padding-top: calc(var(--rhythm-page-top-clear) + var(--rhythm-section-compact));
  }

  .sources-designated-fields,
  .sources-quantity,
  .sources-history-classes {
    grid-template-columns: minmax(0, 1fr);
  }

  .sources-designated-fields > div {
    padding: 0 0 var(--rhythm-title-content);
  }

  .sources-designated-fields > div + div {
    padding: var(--rhythm-title-content) 0;
    border-top: 1px solid var(--theme-rule-subtle);
    border-left: 0;
  }

  .sources-definitions > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.55rem;
  }

  .sources-treatment {
    margin-top: var(--rhythm-title-content);
    padding-top: var(--rhythm-title-content);
    border-top: 1px solid var(--theme-rule-subtle);
  }

  .sources-lineage li {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.45rem;
  }

  .sources-exits a {
    min-height: 72px;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    gap: 0.35rem;
  }

  .sources-exits small {
    text-align: left;
  }
}
