/* Mobile containment fixes loaded after the main layout styles. */
html,
body {
  max-width: 100%;
  overflow-x: clip;
}

@supports not (overflow: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

.main,
.note,
.note-header,
.note-content {
  min-width: 0;
}

@media (max-width: 900px) {
  .main,
  .note,
  .note-header,
  .note-content {
    max-width: 100%;
  }

  .note-content > * {
    min-width: 0;
    max-width: 100%;
  }

  .note-content pre,
  .note-content table,
  .math-display,
  .functionplot-card,
  .functionplot-canvas,
  .mermaid-card {
    max-width: 100%;
  }

  .functionplot-card,
  .mermaid-card {
    contain: inline-size;
  }

  .functionplot-canvas {
    overflow: clip;
  }

  .functionplot-canvas svg {
    overflow: hidden;
  }

  .sidebar {
    max-width: calc(100vw - 42px);
  }

  mjx-container {
    max-width: 100%;
  }
}