.docs { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 46px; padding: 30px 16px 0; }
.toc { position: sticky; top: 82px; align-self: start; display: grid; gap: 7px; }
.toc .label { margin-bottom: 6px; }
.toc a { font-size: 13.5px; color: var(--faint); }
.toc a:hover { color: var(--blue-soft); }

.prose { max-width: 72ch; }
.prose h1 { font-size: clamp(30px, 4.6vw, 46px); margin-bottom: 14px; }
.prose .lede { font-size: 17px; margin-bottom: 36px; }
.prose h2 { font-size: 23px; margin: 44px 0 14px; scroll-margin-top: 90px; }
.prose p { font-size: 15.5px; line-height: 1.68; }
.prose b { color: var(--text); font-weight: 600; }
.prose ol, .prose ul { color: var(--muted); font-size: 15.5px; line-height: 1.68; padding-left: 20px; margin: 0 0 14px; }
.prose li { margin-bottom: 7px; }
.prose pre {
  max-width: 100%;
  background: rgba(4, 7, 16, 0.82);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 18px;
  overflow-x: auto;
  margin: 0 0 18px;
}
.prose code { font-family: var(--mono); font-size: 12.8px; color: var(--blue-soft); line-height: 1.7; }
.facts { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin: 18px 0; }
.fact { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; background: var(--panel); }
.fact .v { font-family: var(--mono); font-size: 19px; }
.fact .k { font-size: 12px; color: var(--faint); margin-top: 2px; }
.contract-row { display: flex; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid rgba(118,150,220,.08); font-size: 13.5px; }
.contract-row:last-child { border-bottom: 0; }
.contract-row span { color: var(--muted); }
@media (max-width: 900px) {
  .docs { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .prose { max-width: 100%; }
  .toc { position: static; display: none; }
  .facts { grid-template-columns: 1fr; }
}

.contract-row { align-items: baseline; }
.contract-row a, .contract-row .mono { word-break: break-all; text-align: right; min-width: 0; }
@media (max-width: 560px) {
  .contract-row { flex-direction: column; gap: 2px; }
  .contract-row a, .contract-row .mono { text-align: left; font-size: 12px; }
}
