.docs-layout,
.docs-nav,
.docs-content,
.docs-content section,
.code-block,
.link-row,
.link-card {
  min-width: 0;
}

/* Link cards are sometimes used directly inside a section instead of as grid
   items. Keep them as one rectangular box in Safari rather than allowing an
   inline anchor with block children to fragment across line boxes. */
.link-card {
  display: block;
  width: 100%;
  max-width: 100%;
}

.code-block {
  width: 100%;
  max-width: 100%;
}

.code-block pre {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.docs-content h2,
.docs-content h3,
.docs-content p,
.docs-content li,
.docs-nav a,
.link-card {
  overflow-wrap: anywhere;
}

@media (max-width: 900px) {
  .docs-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .docs-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
  }
}

@media (max-width: 620px) {
  .docs-nav {
    grid-template-columns: minmax(0, 1fr);
  }

  .code-block pre {
    padding: 16px;
    font-size: 12px;
  }
}