.doc-hero{
  overflow-x:clip;
  max-width:100%;
  margin-inline:24px;
  border-radius:0 0 var(--r-basin) var(--r-basin);
  background:radial-gradient(75% 90% at 85% 100%,var(--iris-a20),transparent),linear-gradient(180deg,var(--bg),var(--haze));
}
.doc-hero-inner{padding-top:64px;padding-bottom:72px}
.doc-hero h1{max-width:900px;margin:16px 0 20px;color:var(--accent-dark);font-weight:800}
.doc-intro{max-width:780px;margin:0 0 24px;font-size:19px;line-height:1.8;color:var(--text)}
.doc-article{padding-top:48px;padding-bottom:60px}
.doc-preface{
  max-width:880px;
  margin-bottom:34px;
  padding:24px 28px;
  border:1px solid var(--line-soft);
  border-radius:var(--r-card);
  background:var(--bg-panel);
  box-shadow:0 16px 36px -22px var(--iris-a28),inset 0 1px 0 var(--white-a90);
}
.doc-preface p:last-child{margin-bottom:0}
.doc-article a:not(.toc-tabs a){color:var(--accent-dark);text-decoration:underline;text-decoration-color:var(--iris-a40);text-underline-offset:4px}
.doc-article a:not(.toc-tabs a):hover{text-decoration-color:currentColor}
.doc-section{max-width:880px;padding-top:62px;padding-bottom:22px;border-bottom:1px solid var(--border)}
.doc-section:last-child{border-bottom:0}
.doc-section .kicker{margin-bottom:12px}
.doc-section h2{margin:0 0 32px;color:var(--accent-dark)}
.doc-section h3{margin:34px 0 14px;color:var(--text);font-size:22px}
.doc-section p,.doc-preface p{line-height:1.95}
.doc-section p{margin-bottom:19px}
.doc-section .callout{line-height:1.85}
.doc-section .table-scroll{margin:24px 0}
.doc-section .table-scroll table{min-width:740px}
.doc-section .table-scroll td{line-height:1.6}
.doc-section pre{
  margin:24px 0;
  padding:20px 22px;
  border:1px solid var(--border);
  border-radius:var(--r-card);
  background:var(--bg-panel2);
  color:var(--accent-dark);
  font-size:13px;
  line-height:1.8;
}
.doc-section pre code{white-space:pre}
.doc-section code:not(pre code){padding:2px 5px;border-radius:var(--r-geo);background:var(--bg-panel2);font-size:.9em}
@media(max-width:768px){
  .doc-hero{margin-inline:10px;border-radius:0 0 32px 32px}
  .doc-hero-inner{padding-top:42px;padding-bottom:48px}
  .doc-intro{font-size:16px}
  .doc-article{padding-top:32px}
  .doc-section{padding-top:48px}
}
@media(max-width:640px){
  .doc-preface{padding:20px}
  .doc-section h3{font-size:20px}
  .doc-section pre{padding:16px}
}