.docs-page { background: #fafaf8; }
.docs-header { position: sticky; top: 0; z-index: 3; padding: 0 32px; }
.docs-header span { color: #777; font-weight: 400; }
.docs-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); max-width: 1320px; margin: auto; }
.docs-sidebar { position: sticky; top: 64px; height: calc(100vh - 64px); overflow-y: auto; padding: 28px 20px 40px; border-right: 1px solid #deded8; }
.docs-sidebar nav { display: flex; flex-direction: column; gap: 3px; }
.docs-sidebar a { display: block; padding: 7px 12px; text-decoration: none; color: #595955; font-size: 13px; border-left: 2px solid transparent; }
.docs-sidebar a:hover { background: #edede8; color: #111; }
.docs-sidebar a[aria-current="page"] { background: #e7e7e1; color: #111; border-left-color: #222; font-weight: 700; }
.nav-group { margin: 22px 12px 6px; font-size: 10px; letter-spacing: .12em; color: #777; }
.nav-group:first-child { margin-top: 0; }
.docs { width: 100%; max-width: 860px; margin: 0; padding: 54px 64px 80px; min-width: 0; }
.docs h1 { font-size: clamp(28px, 4vw, 40px); line-height: 1.2; letter-spacing: -.045em; }
.docs .intro { font-size: 17px; line-height: 1.8; margin-bottom: 28px; }
.docs h2 { margin: 36px 0 12px; font-size: 21px; }
.docs .eyebrow { margin: 0 0 18px; font-size: 10px; letter-spacing: .09em; color: #777; }
.docs p { line-height: 1.85; }
.docs pre { font-size: 13px; line-height: 1.7; }
.docs :not(pre) > code { overflow-wrap: anywhere; font-size: .9em; }
.docs th { text-align: left; padding: 10px 8px; font-size: 12px; color: #666; border-bottom: 1px solid #aaa; }
.docs td { font-size: 13px; }
.docs td:first-child { width: 42%; }
.docs a { text-underline-offset: 3px; }
kbd { border: 1px solid #ccc; background: #fff; padding: 2px 5px; font: 12px var(--font); }
.doc-topic[hidden], .doc-pager[hidden] { display: none; }
.doc-topic { scroll-margin-top: 90px; }
.doc-topic + .doc-topic { margin-top: 60px; }
.doc-topic[hidden] + .doc-topic { margin-top: 0; }
.doc-pager { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid #d8d8d4; margin-top: 48px; padding-top: 24px; font-size: 12px; }
#doc-next { margin-left: auto; text-align: right; }
.skip-link { position: fixed; top: -80px; left: 16px; z-index: 5; background: #fff; color: #111; padding: 12px; }
.skip-link:focus { top: 8px; }
:focus-visible { outline: 2px solid #555; outline-offset: 4px; }
@media (max-width: 800px) {
  .docs-layout { grid-template-columns: 210px minmax(0, 1fr); }
  .docs-sidebar { padding-inline: 10px; }
  .docs { padding: 36px 28px 60px; }
}
@media (max-width: 620px) {
  .docs-header { padding: 0 16px; font-size: 12px; }
  .docs-layout { display: block; }
  .docs-sidebar { position: static; height: auto; max-height: 210px; border-right: 0; border-bottom: 1px solid #deded8; padding: 16px; }
  .docs { padding: 30px 20px 60px; }
  .docs th { display: none; }
  .docs pre { padding: 16px; font-size: 12px; }
}