/* MathJax v3: the page loads mathjax@3 (tex-chtml.js), whose display container
   is <mjx-container>, not the v2 .MathJax_Display. Keep display equations
   centered, and give over-wide equations a horizontal scrollbar within the
   content column instead of letting them overflow the page. */
mjx-container[display="true"] {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}

.math-block {
    display: flex;
    justify-content: center; /* center the equation */
    align-items: center;
    margin-bottom: 1rem;     /* breathing room between equations */
}

.math-block .equation {
    flex-grow: 1;
    min-width: 0;            /* let the flex item shrink so overflow-x can engage */
    text-align: center;
}

.math-block .number {
    padding-left: 10px;
}