/* Shared containment for imported knowledge collections. */
.main-content,
.content-inner,
main {
  min-width: 0;
}

.content-inner {
  width: 100%;
}

img,
svg {
  max-width: 100%;
  height: auto;
}

pre,
mjx-container {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}

html body mjx-container mjx-assistive-mml {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  white-space: nowrap !important;
  transform: scale(0) !important;
  transform-origin: left top !important;
}

@media (max-width: 1024px) {
  body {
    display: block;
  }

  .sidebar {
    position: relative;
    width: 100%;
    height: auto;
    max-height: 48px;
    overflow: hidden;
    padding: 0;
    transition: max-height 0.3s;
  }

  .sidebar.expanded {
    max-height: 100vh;
    max-height: 100dvh;
    overflow-y: auto;
  }

  .sidebar-title {
    position: sticky;
    top: 0;
    z-index: 2;
    margin: 0;
    padding: 12px 16px;
    background: #1a1a2e;
    cursor: pointer;
  }

  .sidebar-title::after {
    content: ' \2630  \5c55 \5f00 ';
    float: right;
    color: #888;
    font-size: 13px;
  }

  .sidebar.expanded .sidebar-title::after {
    content: ' \2715  \6536 \8d77 ';
  }

  .sidebar-nav {
    padding-bottom: 20px;
  }

  .main-content {
    width: 100%;
    margin-left: 0;
    padding: 20px 16px 64px;
  }

  .content-inner {
    max-width: 100%;
  }

  main {
    max-width: 100%;
    overflow-x: hidden;
  }

  .content-inner p,
  .content-inner li,
  .content-inner section,
  .content-inner a {
    overflow-wrap: anywhere;
  }

  main table,
  .content-inner table {
    display: block;
    width: 100% !important;
    max-width: 100%;
    overflow-x: auto !important;
  }

  main pre,
  .content-inner pre {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    contain: inline-size;
  }

  main ul,
  main ol,
  .content-inner ul,
  .content-inner ol {
    width: auto !important;
    max-width: 100% !important;
  }
}

@media (max-width: 480px) {
  .main-content {
    padding: 16px 12px 56px;
  }
}