.reference-main {
  padding-top:32px;
}
.reference-cover {
  padding:56px;
  margin-bottom:48px;
  background:var(--bg-panel-2);
  color:var(--on-dark);
  border-radius:var(--r-canvas);
}
.reference-cover .badge {
  background:var(--on-dark-fill);
  color:var(--on-dark);
  border-color:var(--on-dark-line);
}
.reference-cover h1 {
  max-width:20em;
  margin-top:28px;
  margin-bottom:24px;
}
.reference-cover h1 .key {
  color:var(--accent);
}
.reference-lead {
  max-width:38em;
  font-size:var(--size-body);
  color:var(--on-dark);
}
.reference-intro {
  max-width:46em;
  color:var(--on-dark-muted);
}
.reference-intro a {
  color:var(--on-dark);
}
.reference-cover .chip-row {
  margin-top:28px;
}
.reference-document {
  max-width:920px;
}
.reference-document > section {
  padding-top:32px;
  padding-bottom:24px;
  scroll-margin-top:160px;
}
.reference-document > section + section {
  border-top:1px solid var(--border);
}
.reference-document > section > h2 {
  margin-top:24px;
}
.reference-document h2 .key {
  color:var(--accent-dark);
}
.reference-document h3 {
  margin-top:32px;
  font-size:var(--size-h3);
}
.reference-document p {
  overflow-wrap:break-word;
}
.reference-document .table-wrap {
  margin-block:28px;
}
.reference-document .table-wrap .data-table {
  display:table;
  overflow:visible;
}
.reference-document pre {
  margin-block:24px;
}
@media (max-width:768px) {
  .reference-cover {
    padding:32px;
  }
  .reference-cover h1 {
    font-size:30px;
  }
  .reference-document > section {
    scroll-margin-top:180px;
  }
}
@media (max-width:640px) {
  .reference-main {
    padding-top:16px;
  }
  .reference-cover {
    padding:28px 24px;
    margin-bottom:32px;
  }
  .reference-cover h1 {
    font-size:28px;
  }
  .reference-document > section {
    padding-top:20px;
    scroll-margin-top:24px;
  }
}