html {
  scroll-padding-top: calc(var(--header-height) + var(--toolbar-occupied-height) + 8px);
}

.doc {
  --sticky-base: calc(var(--header-height) + var(--toolbar-occupied-height));
  --sticky-overlap: 6px;
  padding-bottom: 64px;
  color: var(--text-body);
  font: var(--body);
  hyphens: manual;
}

.doc h1,
.doc h2,
.doc h3,
.doc h4,
.doc h5,
.doc h6 {
  position: relative;
  margin: 32px 0 0;
  padding: 0;
  border: 0;
  color: var(--text-heading);
}

.doc > h1.page:first-child {
  margin: 40px 0 var(--page-lead-gap);
  color: var(--text-page-title);
  font: var(--title-1);
  letter-spacing: -.015em;
}

@media screen and (min-width: 1024px) {
  .doc > h1.page:first-child {
    margin-top: calc(var(--page-lead-gap) * 1.75);
  }
}

.doc h2,
.doc h2:not(.discrete) {
  margin: 0;
  padding: 0;
  border: 0;
  font: var(--title-2);
  letter-spacing: -.015em;
}

.doc h3,
.doc h3:not(.discrete) {
  font: var(--title-3);
  letter-spacing: -.01em;
}

.doc h4,
.doc h4:not(.discrete) {
  font: var(--title-4);
}

.doc h5 {
  font: var(--title-5);
}

.doc h6 {
  font: var(--body-accent);
}

#preamble + .sect1,
.doc .sect1 + .sect1 {
  margin-top: 40px;
  padding-top: 40px;
  border-top: var(--stroke) solid var(--border-layout);
}

.doc h2 + .sectionbody > :first-child {
  margin-top: var(--heading-text-gap);
}

.doc h1 .anchor,
.doc h2 .anchor,
.doc h3 .anchor,
.doc h4 .anchor,
.doc h5 .anchor,
.doc h6 .anchor {
  top: calc(.7em - 11px);
  left: -27px;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  color: var(--link);
  font-size: inherit;
  cursor: pointer;
}

.doc h1 .anchor::before,
.doc h2 .anchor::before,
.doc h3 .anchor::before,
.doc h4 .anchor::before,
.doc h5 .anchor::before,
.doc h6 .anchor::before {
  content: "";
  display: block;
  width: 22px;
  height: 22px;
  background: currentColor;
  -webkit-mask: url(../img/icon-chain.svg) center / 22px 22px no-repeat;
  mask: url(../img/icon-chain.svg) center / 22px 22px no-repeat;
}

.doc h1 .anchor:hover,
.doc h2 .anchor:hover,
.doc h3 .anchor:hover,
.doc h4 .anchor:hover,
.doc h5 .anchor:hover,
.doc h6 .anchor:hover {
  color: var(--link-hover);
}

.doc .is-link-copied .anchor {
  visibility: visible;
  color: var(--link);
}

.doc .is-link-copied .anchor::before {
  -webkit-mask-image: url(../img/icon-check.svg);
  mask-image: url(../img/icon-check.svg);
}

.doc .is-link-copied .anchor::after {
  content: "Ссылка скопирована!";
  position: absolute;
  bottom: calc(100% + 4px);
  left: 50%;
  padding: 0 4px;
  background: var(--overlay-80);
  border-radius: 2px;
  color: var(--text-inverse);
  font: var(--navigate-2-accent);
  white-space: nowrap;
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 30;
}

.doc .section-link-text {
  cursor: pointer;
}

.doc h1 {
  --opsz: 32;
}

.doc h2 {
  --opsz: 26;
}

.doc h3 {
  --opsz: 22;
}

.doc h4 {
  --opsz: 20;
}

.doc h5 {
  --opsz: 18;
}

.link-copied-toast {
  position: fixed;
  z-index: 45;
  display: none;
  padding: 4px 8px;
  background: var(--overlay-80);
  border-radius: var(--radius-inline);
  color: var(--text-inverse);
  font: var(--navigate-2-accent);
  white-space: nowrap;
  transform: translateX(-50%);
  pointer-events: none;
}

.link-copied-toast.is-visible {
  display: block;
}

@media screen and (max-width: 1023.5px) {
  .doc h1 .anchor,
  .doc h2 .anchor,
  .doc h3 .anchor,
  .doc h4 .anchor,
  .doc h5 .anchor,
  .doc h6 .anchor {
    display: none;
  }
}

.doc .dlist,
.doc .exampleblock,
.doc .hdlist,
.doc .imageblock,
.doc .listingblock,
.doc .literalblock,
.doc .olist,
.doc .paragraph,
.doc .partintro,
.doc .quoteblock,
.doc .sidebarblock,
.doc .tabs,
.doc .ulist,
.doc .verseblock,
.doc .videoblock,
.doc details,
.doc hr,
.doc .admonitionblock,
.doc .image-gallery,
.doc .tablecontainer,
.doc .tablecontainer + *,
.doc :not(.tablecontainer) > table.tableblock,
.doc :not(.tablecontainer) > table.tableblock + *,
.doc > table.tableblock,
.doc > table.tableblock + * {
  margin-top: 20px;
}

.doc hr {
  border-width: 1px 0 0;
  border-color: var(--border-strong);
}

.doc a {
  color: var(--link);
  text-decoration: underline;
  text-underline-position: from-font;
}

.doc a:hover {
  color: var(--link-hover);
}

.doc a.anchor {
  text-decoration: none;
}

.doc .paragraph.button {
  margin-top: 24px;
  text-align: center;
}

.doc .paragraph.button a {
  display: inline-block;
  padding: 12px 24px;
  background: var(--button-gradient);
  border-radius: 90px;
  color: var(--grey-900);
  font: 450 16px/1.4 var(--font-base);
  text-decoration: none;
}

.doc .paragraph.button a:hover {
  background: var(--orange-500);
  color: var(--white);
}

.doc a.unresolved {
  color: var(--status-important);
}

.doc b,
.doc strong,
.doc dt,
.doc th {
  font-weight: var(--weight-accent);
}

.doc code,
.doc pre {
  font-family: var(--font-mono);
}

.doc :not(pre) > code,
.doc .colist > table code,
.doc p code,
.doc thead code {
  padding: 0 4px;
  background: var(--overlay-5);
  border-radius: var(--radius-inline);
  color: inherit;
  font-size: .9375em;
}

.doc .paragraph.lead > p,
.doc .colist,
.doc .keyseq,
.doc table.tableblock,
.doc table.tableblock pre,
.doc .admonitionblock p,
.doc .admonitionblock td.content,
.doc .admonitionblock td.content pre,
.doc .quoteblock .attribution {
  font-size: inherit;
}

.doc ol,
.doc ul {
  padding-left: 24px;
}

.doc ol {
  padding-left: 20px;
}

.doc ol > li {
  padding-left: 4px;
}

.doc ol > li::marker {
  color: var(--link);
}

@counter-style decimal-paren {
  system: extends decimal;
  suffix: ") ";
}

.doc ol.loweralpha {
  list-style-type: decimal-paren;
}

.doc .ulist:not(.tablist) > ul:not(.checklist, .none, .no-bullet, .unstyled) {
  list-style: none;
}

.doc .ulist:not(.tablist) > ul:not(.checklist, .none, .no-bullet, .unstyled) > li {
  position: relative;
}

.doc .ulist:not(.tablist) > ul:not(.checklist, .none, .no-bullet, .unstyled) > li::before {
  content: "";
  position: absolute;
  top: calc((1.75em - 22px) / 2);
  left: -24px;
  width: 22px;
  height: 22px;
  background: var(--link);
  -webkit-mask: url(../img/icon-list-dot.svg) center / 16px 16px no-repeat;
  mask: url(../img/icon-list-dot.svg) center / 16px 16px no-repeat;
}

.doc .ulist .ulist:not(.tablist) > ul:not(.checklist, .none, .no-bullet, .unstyled) > li::before {
  -webkit-mask-image: url(../img/icon-list-triangle.svg);
  mask-image: url(../img/icon-list-triangle.svg);
}

.doc .olist li + li,
.doc .ulist:not(.tablist) li + li {
  margin-top: 8px;
}

.doc li .olist li + li,
.doc li .ulist:not(.tablist) li + li {
  margin-top: 8px;
}

.doc li > .paragraph,
.doc li > .openblock > .content > :first-child,
.doc li > .dlist,
.doc li > .olist,
.doc li > .ulist,
.doc li > .listingblock,
.doc li > .literalblock,
.doc li > .imageblock,
.doc li > .image-gallery,
.doc li > .exampleblock,
.doc li > .quoteblock,
.doc li > .tabs,
.doc li > details,
.doc li > .tablecontainer,
.doc li > .admonitionblock,
.doc .olist li > table.tableblock,
.doc .ulist li > table.tableblock {
  margin-top: 8px;
}

.doc .admonitionblock .listingblock,
.doc .olist .listingblock,
.doc .ulist .listingblock {
  padding: 0;
}

.doc .admonitionblock .title,
.doc .exampleblock .title,
.doc .imageblock .title,
.doc .listingblock .title,
.doc .literalblock .title,
.doc .openblock .title,
.doc .videoblock .title,
.doc .olist .title,
.doc .ulist .title,
.doc table.tableblock caption {
  padding-bottom: 8px;
  margin-bottom: 0;
  color: var(--text-body);
  font: var(--body-accent);
  letter-spacing: 0;
}

.doc .imageblock .title,
.doc .videoblock .title {
  margin-top: 8px;
  padding-bottom: 0;
}

.doc .admonitionblock {
  position: relative;
  padding: 8px 0 0 8px;
}

.doc .admonitionblock > table,
.doc .admonitionblock > table > tbody,
.doc .admonitionblock > table > tbody > tr {
  display: block;
  position: static;
  width: auto;
}

.doc .admonitionblock td.content,
.doc .admonitionblock.note > table > tbody > tr > td.content {
  --block-bg: var(--status-note-solid);
  display: block;
  width: auto;
  padding: 20px 20px 20px;
  background: var(--status-note-tint);
  border-radius: var(--radius-block);
}

.doc .admonitionblock.tip > table > tbody > tr > td.content {
  --block-bg: var(--status-tip-solid);
  background: var(--status-tip-tint);
}

.doc .admonitionblock.important > table > tbody > tr > td.content {
  --block-bg: var(--status-important-solid);
  background: var(--status-important-tint);
}

.doc .admonitionblock.warning > table > tbody > tr > td.content,
.doc .admonitionblock.caution > table > tbody > tr > td.content {
  --block-bg: var(--status-warning-solid);
  background: var(--status-warning-tint);
}

.doc .admonitionblock td.icon {
  display: block;
  top: 0;
  left: 0;
  padding: 0;
  font: var(--badge);
  transform: none;
  z-index: 1;
}

.doc .admonitionblock td.icon i,
.doc .admonitionblock td.icon i.icon-note {
  display: block;
  width: auto;
  height: auto;
  padding: 0 4px;
  background-color: var(--status-note);
  border-radius: 2px;
  color: var(--text-inverse);
  font-style: normal;
  white-space: nowrap;
}

.doc .admonitionblock td.icon i::after {
  font-size: inherit;
  font-weight: var(--weight-accent);
}

.doc .admonitionblock td.icon i.icon-tip {
  background-color: var(--status-tip);
}

.doc .admonitionblock td.icon i.icon-important {
  background-color: var(--status-important);
}

.doc .admonitionblock td.icon i.icon-warning,
.doc .admonitionblock td.icon i.icon-caution {
  background-color: var(--status-warning);
}

.doc .imageblock img,
.doc .gallery-image {
  border-radius: var(--radius-block);
}

.doc .image-gallery {
  margin-bottom: 0;
}

.doc .gallery-stage {
  gap: 8px;
}

.doc .gallery-item,
.doc .gallery-item.is-first,
.doc .gallery-item.is-middle,
.doc .gallery-item.is-last {
  flex: 1 1 0;
  max-width: none;
}

.doc .gallery-nav {
  flex: 0 0 32px;
  align-self: center;
  width: 32px;
  height: 32px;
  border-radius: 200px;
  color: var(--icon-strong);
}

.doc .gallery-nav svg {
  display: none;
}

.doc .gallery-nav::before {
  content: "";
  width: 8.28px;
  height: 17px;
  background: currentColor;
  -webkit-mask: url(../img/icon-carousel.svg) center / 8.28px 17px no-repeat;
  mask: url(../img/icon-carousel.svg) center / 8.28px 17px no-repeat;
}

.doc .gallery-prev::before {
  transform: scaleX(-1);
}

.doc .gallery-nav:hover {
  background: var(--surface-hover-accent);
  color: var(--orange-500);
}

.doc .gallery-thumbnails,
.doc .image-gallery[data-pos="first"] .gallery-thumbnails,
.doc .image-gallery[data-pos="last"] .gallery-thumbnails {
  gap: 8px;
  margin-top: 8px;
  padding: 0;
}

.doc .gallery-thumbnail {
  width: 80px;
  height: 60px;
  border-radius: var(--radius-inline);
}

.doc .gallery-thumbnail.active {
  border-color: var(--border-accent);
}

.doc pre,
.doc table.tableblock pre {
  font-size: 15px;
  line-height: 1.625;
}

.doc .listingblock pre:not(.highlight),
.doc .literalblock pre,
.doc pre.highlight > code {
  padding: 32px 16px 16px;
  background: var(--overlay-5);
  border-radius: var(--radius-block);
  box-shadow: none;
  color: var(--text-body);
}

.doc .source-toolbox {
  top: 8px;
  right: 8px;
  align-items: center;
  gap: 2px;
  visibility: visible;
  color: var(--text-annotation);
  font: var(--weight-accent) 10px/1.5 var(--font-base);
}

.doc .content.has-copy {
  position: relative;
}

.doc .source-toolbox .source-lang {
  letter-spacing: 0;
}

.doc .source-toolbox > :not(:last-child)::after {
  padding: 0 0 0 4px;
}

.doc .source-toolbox .copy-button {
  position: relative;
  width: 24px;
  height: 24px;
  color: var(--link);
}

.doc .source-toolbox .copy-button:hover {
  color: var(--link-hover);
}

.doc .source-toolbox .copy-button .copy-icon {
  display: none;
}

.doc .source-toolbox .copy-button::before {
  content: "";
  flex: none;
  width: 24px;
  height: 24px;
  background: currentColor;
  -webkit-mask: url(../img/icon-copy.svg) center / 18px 18px no-repeat;
  mask: url(../img/icon-copy.svg) center / 18px 18px no-repeat;
}

.doc .source-toolbox .copy-toast {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 4px;
  padding: 0 4px;
  background: var(--overlay-80);
  border-radius: 2px;
  color: var(--text-inverse);
  font: var(--navigate-2-accent);
}

.doc .source-toolbox .copy-toast::after {
  content: none;
}

.doc .hljs-comment,
.doc .hljs-quote {
  color: var(--code-comment);
}

.doc .hljs-keyword,
.doc .hljs-selector-tag,
.doc .hljs-subst {
  color: var(--code-keyword);
}

.doc .hljs-literal,
.doc .hljs-number,
.doc .hljs-tag .hljs-attr,
.doc .hljs-template-variable,
.doc .hljs-variable {
  color: var(--code-literal);
}

.doc .hljs-doctag,
.doc .hljs-string {
  color: var(--code-string);
}

.doc .hljs-section,
.doc .hljs-selector-id,
.doc .hljs-title {
  color: var(--code-title);
}

.doc .hljs-class .hljs-title,
.doc .hljs-type {
  color: var(--code-type);
}

.doc .hljs-attribute,
.doc .hljs-name,
.doc .hljs-tag {
  color: var(--code-attr);
}

.doc .hljs-link,
.doc .hljs-regexp {
  color: var(--code-link);
}

.doc .hljs-bullet,
.doc .hljs-symbol {
  color: var(--code-symbol);
}

.doc .hljs-built_in,
.doc .hljs-builtin-name {
  color: var(--code-builtin);
}

.doc .hljs-meta {
  color: var(--code-meta);
}

.doc .hljs-deletion {
  background: var(--status-important-tint);
}

.doc .hljs-addition {
  background: var(--status-tip-tint);
}

.doc pre .code-note {
  font-size: .8em;
}

.doc .tablecontainer {
  overflow-x: visible;
}

.doc table.tableblock,
.doc table.tableblock > * > tr > * {
  border-color: var(--border-strong);
}

.doc table.grid-all > thead th,
.doc table.grid-rows > thead th {
  border-bottom-width: 1px;
}

.doc table.tableblock {
  font-size: 14px;
  line-height: 1.75;
  /* Let long words and inline code fit the article without shifting its edge. */
  overflow-wrap: normal;
}

.doc table.tableblock td.tableblock > .content,
.doc table.tableblock th.tableblock > .content,
.doc table.tableblock .admonitionblock td.content {
  overflow-wrap: normal;
}

.doc table.tableblock.is-overflowing {
  display: block;
  overflow-x: auto;
}

.doc table.tableblock td,
.doc table.tableblock th {
  padding: 12px 16px;
  color: var(--text-heading);
}

.doc table.tableblock.is-compact > * > tr > td,
.doc table.tableblock.is-compact > * > tr > th {
  padding: 10px 12px;
}

.doc table.tableblock details > .content {
  padding-right: 16px;
  padding-left: 16px;
}

.doc table.tableblock.is-overflowing > thead th,
.doc table.tableblock.table-scroll-head-table > thead th {
  position: static;
}

.doc table.tableblock.is-overflowing .tabs .tablist,
.doc table.tableblock.is-overflowing details[open] > summary.title,
.doc table.tableblock.is-overflowing table.tableblock thead th {
  position: static;
}

@keyframes table-head-slide {
  to {
    transform: translateX(calc(-1 * var(--table-scroll-max, 0px)));
  }
}

.doc .table-scroll-head {
  position: sticky;
  top: calc(var(--sticky-base) + var(--sticky-offset, 0px) - var(--sticky-shift, 0px));
  z-index: calc(10 + var(--sticky-depth, 0));
  pointer-events: none;
}

.doc .table-scroll-head[hidden] {
  display: none;
}

.doc .table-scroll-head-clip {
  overflow: hidden;
}

.doc table.tableblock.table-scroll-head-table {
  display: table;
  max-width: none;
  margin: 0;
  table-layout: fixed;
  will-change: transform;
}

.doc table.tableblock.table-scroll-head-table > thead th {
  box-sizing: border-box;
  min-width: 0;
}

@media screen and (max-width: 1279.5px) {
  .doc table.tableblock {
    font-size: 14px;
  }

  .doc table.tableblock td,
  .doc table.tableblock th {
    padding: 10px 12px;
  }

  .doc table.tableblock p code,
  .doc table.tableblock thead code {
    font-size: .875em;
  }

  .doc table.tableblock pre {
    font-size: 14px;
  }
}

.doc table.tableblock.frame-all.grid-all {
  border-width: 0 0 0 1px;
  border-collapse: separate;
  border-spacing: 0;
}

.doc table.tableblock.frame-all.grid-all > * > tr > * {
  border-width: 0 1px 1px 0;
}

.doc table.tableblock.frame-all.grid-all > thead > tr:first-child > *,
.doc table.tableblock.frame-all.grid-all > colgroup + tbody > tr:first-child > *,
.doc table.tableblock.frame-all.grid-all > tbody:first-child > tr:first-child > * {
  border-top-width: 1px;
}

.doc table.tableblock thead th {
  --sticky-overlap: 0px;
  font-size: 15px;
  background: linear-gradient(var(--overlay-5), var(--overlay-5)), var(--block-bg, var(--surface-page));
}

.doc .table-icon {
  display: inline-block;
  width: 22px;
  height: 22px;
  vertical-align: top;
}

.doc .table-icon-check {
  background: var(--link);
  -webkit-mask: url(../img/icon-check.svg) center / 22px 22px no-repeat;
  mask: url(../img/icon-check.svg) center / 22px 22px no-repeat;
}

.doc .table-icon-cross {
  background: var(--orange-500);
  -webkit-mask: url(../img/icon-cross.svg) center / 10.77px 10.77px no-repeat;
  mask: url(../img/icon-cross.svg) center / 10.77px 10.77px no-repeat;
}

.doc p.tableblock + p.tableblock {
  margin-top: 8px;
}

.doc .tabs .tablist,
.doc table.tableblock thead th,
.doc details[open] > summary.title {
  position: sticky;
  top: calc(var(--sticky-base) + var(--sticky-offset, 0px) - var(--sticky-shift, 0px));
  z-index: calc(10 + var(--sticky-depth, 0));
}

.doc .tabs .tablist[data-sticky-departing],
.doc table.tableblock thead th[data-sticky-departing],
.doc details[open] > summary.title[data-sticky-departing] {
  z-index: calc(10 - var(--sticky-depth, 0));
}

.doc details {
  margin-left: 0;
}

.doc details + details {
  margin-top: 8px;
}

.doc details > summary.title,
.doc :is(.admonitionblock, .exampleblock, .openblock, .listingblock, .olist, .ulist, .tabpanel) details > summary.title {
  display: flex;
  align-items: flex-start;
  gap: 4px;
  margin: 0;
  padding: 16px;
  background: var(--overlay-5);
  border: 0;
  border-radius: var(--radius-block);
  color: var(--text-heading);
  font: var(--summary);
  letter-spacing: 0;
  cursor: pointer;
}

.doc details > summary.title::before {
  content: "";
  position: static;
  flex: none;
  width: 22px;
  height: 1.75em;
  background: currentColor;
  border: 0;
  -webkit-mask: url(../img/icon-select.svg) center / 5.57px 9.02px no-repeat;
  mask: url(../img/icon-select.svg) center / 5.57px 9.02px no-repeat;
  transform: rotate(90deg);
}

.doc details > summary.title::after {
  content: none;
}

.doc details > summary.title > code:only-child {
  padding: 0;
  background: none;
  font: inherit;
}

.doc details[open] > summary.title,
.doc :is(.admonitionblock, .exampleblock, .openblock, .listingblock, .olist, .ulist, .tabpanel) details[open] > summary.title {
  background: linear-gradient(var(--overlay-5), var(--overlay-5)), var(--block-bg, var(--surface-page));
  border-radius: var(--radius-block) var(--radius-block) 0 0;
  color: var(--nav-link-active);
}

.doc details[open] > summary.title::before {
  border: 0;
  transform: rotate(-90deg);
}

.doc details > summary.title:hover,
.doc :is(.admonitionblock, .exampleblock, .openblock, .listingblock, .olist, .ulist, .tabpanel) details > summary.title:hover {
  background: var(--tint-orange-10);
  color: var(--link-hover);
}

.doc details[open] > summary.title:hover,
.doc :is(.admonitionblock, .exampleblock, .openblock, .listingblock, .olist, .ulist, .tabpanel) details[open] > summary.title:hover {
  background: linear-gradient(var(--tint-orange-10), var(--tint-orange-10)), var(--block-bg, var(--surface-page));
}

.doc details > .content {
  --block-bg: var(--surface-raised);
  padding: 16px 24px;
  background: var(--overlay-2);
  border: 0;
  border-radius: 0 0 var(--radius-block) var(--radius-block);
  color: var(--text-heading);
}

.doc .admonitionblock details > .content,
.doc .admonitionblock .tabpanel {
  --block-bg: inherit;
}

.doc .tabs {
  margin-bottom: 0;
}

.tabs > .content {
  display: grid;
  grid-template-columns: 100%;
}

.tabs > .content > .tablist {
  grid-row: 1;
}

.tabs > .content > .tabpanel {
  grid-row: 2;
  grid-column: 1;
}

.tabs:not(.is-loading) > .content > .tabpanel.is-hidden {
  display: none;
}

.doc .tabs .tablist {
  margin-top: 0;
  background: var(--block-bg, var(--surface-page));
}

.doc .tabs .tablist > ul {
  padding: 0;
  border-bottom: 2px solid var(--border-subtle);
}

.doc .tabs .tablist.ulist > ul li {
  margin: 0 0 -2px;
  padding: 8px 16px;
  border-bottom: 2px solid var(--border-strong);
  color: var(--text-body);
  font: var(--tab);
}

.doc .tabs .tablist > ul li::after {
  content: none;
}

.doc .tabs.is-loading .tablist li:first-child,
.doc .tabs:not(.is-loading) .tablist li.is-selected {
  border-bottom-color: var(--border-accent);
  color: var(--text-heading);
}

.doc .tabs .tablist > ul li:hover {
  border-bottom-color: var(--border-hover);
  color: var(--link-hover);
}

.doc .tabpanel > :first-child {
  margin-top: 0;
}

.doc .tabpanel {
  --block-bg: var(--surface-raised);
  padding: 16px;
  background: var(--overlay-2);
  border-radius: 0 0 var(--radius-block) var(--radius-block);
  color: var(--text-heading);
}

.doc .exampleblock > .content {
  padding: 16px;
  background: transparent;
  border: var(--stroke) solid var(--border-accent);
  border-radius: var(--radius-block);
  color: var(--text-heading);
}

.doc .quoteblock {
  padding: 16px;
  background: var(--overlay-5);
  border-left: 2px solid var(--border-accent);
  border-radius: 0 var(--radius-block) var(--radius-block) 0;
  color: var(--text-heading);
}

.doc .quoteblock blockquote {
  margin-top: 0;
}

.doc .quoteblock blockquote > :first-child {
  margin-top: 0;
}

.doc .quoteblock .paragraph {
  font-style: normal;
}

.doc .quoteblock .attribution {
  margin-top: 8px;
  color: var(--text-annotation);
}

@media screen and (max-width: 768px) {
  :root {
    --title-1: 425 28px/34px var(--font-base);
    --title-2: var(--weight-heading) 22px/28px var(--font-base);
    --title-3: var(--weight-heading) 20px/28px var(--font-base);
    --title-4: var(--weight-accent) 18px/26px var(--font-base);
    --title-5: var(--weight-accent) 17px/24px var(--font-base);
    --body: var(--weight-regular) 16px/1.5 var(--font-base);
    --body-accent: var(--weight-accent) 16px/1.5 var(--font-base);
  }

  .doc h1 {
    --opsz: 28;
  }

  .doc h2 {
    --opsz: 22;
  }

  .doc h3 {
    --opsz: 20;
  }

  .doc h4 {
    --opsz: 18;
  }

  .doc h5 {
    --opsz: 17;
  }

  .doc table.tableblock > * > tr > td,
  .doc table.tableblock > * > tr > th {
    min-width: 150px;
  }

  .doc .tabs .tablist > ul {
    flex-wrap: nowrap;
    overflow-x: auto;
    border-bottom: 0;
    box-shadow: inset 0 -2px 0 var(--border-subtle);
    scrollbar-width: none;
  }

  .doc .tabs .tablist.ulist > ul li {
    margin-bottom: 0;
  }

  .doc .tabs .tablist > ul::-webkit-scrollbar {
    display: none;
  }

  .doc .tabs .tablist.ulist > ul li {
    flex: none;
    white-space: nowrap;
  }

  .doc .image-gallery {
    position: relative;
  }

  .doc .gallery-stage {
    justify-content: flex-start;
    gap: 8px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .doc .gallery-stage::-webkit-scrollbar {
    display: none;
  }

  .doc .gallery-item,
  .doc .gallery-item.is-first,
  .doc .gallery-item.is-middle,
  .doc .gallery-item.is-last {
    display: block;
    flex: 0 0 calc(100% - 32px);
    scroll-snap-align: center;
    animation: none;
  }

  .doc .gallery-nav {
    position: absolute;
    top: calc(50% - 9px);
    z-index: 1;
    width: 40px;
    height: 40px;
    background: var(--surface-page);
    border: var(--stroke) solid var(--border-subtle);
    box-shadow: 0 2px 8px rgb(0 0 0 / 16%);
    transform: translateY(-50%);
  }

  .doc .gallery-prev {
    left: 8px;
  }

  .doc .gallery-next {
    right: 8px;
  }

  .doc .gallery-thumbnails,
  .doc .image-gallery[data-pos="first"] .gallery-thumbnails,
  .doc .image-gallery[data-pos="last"] .gallery-thumbnails {
    justify-content: center;
    gap: 6px;
    margin-top: 12px;
  }

  .doc .gallery-thumbnail,
  .doc .gallery-thumbnail.active {
    flex: none;
    width: 6px;
    height: 6px;
    padding: 0;
    overflow: hidden;
    background: var(--border-strong);
    border: 0;
    border-radius: 3px;
    object-fit: none;
    object-position: 100px 100px;
    opacity: 1;
  }

  .doc .image-gallery .gallery-thumbnail.active {
    width: 18px;
    background: var(--border-accent);
  }
}
