.fact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  margin: 28px 0 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f8f7f0;
  overflow: hidden;
}
.fact-grid div { padding: 16px 18px; border-right: 1px solid var(--line); }
.fact-grid dt { font: 700 11px var(--font-ui); color: #68756c; }
.fact-grid dd { margin: 7px 0 0; font-weight: 800; }
.connections { margin-bottom: 64px; }
.connection-head { display: flex; justify-content: space-between; align-items: end; border-bottom: 1px solid var(--line); padding-bottom: 16px; }
.connection-head h2 { margin: 7px 0 0; }
.connection-head > span { font: 13px var(--font-ui); color: var(--muted); }
.connection-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding-top: 16px; }
.connection { display: flex; flex-direction: column; min-height: 132px; padding: 17px; border: 1px solid #afc3b2; border-radius: 13px; background: #eef3eb; box-shadow: 0 4px 14px #27452f0a; transition: .18s transform, .18s box-shadow; }
.connection:hover { transform: translateY(-3px); box-shadow: 0 12px 24px #27452f18; }
.connection > span { font: 700 11px var(--font-ui); color: #54705e; }
.connection strong { font-size: 19px; margin: 13px 0; }
.connection small { display: flex; justify-content: space-between; margin-top: auto; font: 700 12px var(--font-ui); color: #315f43; }
.connection.pending { background: #f4f2e9; border-style: dashed; }
.connection.pending small { color: #867e6a; }
.source-title { display: flex; justify-content: space-between; gap: 16px; }
.source-title span { font: 700 11px var(--font-ui); color: #58725f; }
.source-lane { display: inline-block; margin-top: 9px; border-radius: 20px; background: #dbe5d9; padding: 5px 9px; font: 700 10px var(--font-ui); color: #486553; }
.source cite { display: block; font: 12px/1.6 var(--font-ui); color: #6c746e; }
.source-provider { display: block; margin-top: 7px; font: 11px var(--font-ui); color: #7b827c; }
.source-link { display: inline-block; margin-top: 13px; font: 700 12px var(--font-ui); color: var(--green); }
@media (max-width: 720px) {
  .connection-grid { grid-template-columns: 1fr; }
  .fact-grid { grid-template-columns: repeat(2, 1fr); }
}
