/* Shared layout primitives used by the reference's content pages. */
html:has(.content-motion) { scroll-behavior: auto; }
.content-page { overflow: clip; }
.content-page .flex-container { display: flex; }
.content-page .align-center { justify-content: center; }
.content-page .align-middle { align-items: center; }
.content-page .align-center-middle { align-items: center; justify-content: center; }
.content-page .align-justify { justify-content: space-between; }
.content-page .align-right { justify-content: flex-end; }
.content-page .orange { color: var(--orange); }
.content-page .grid-x { display: flex; flex-wrap: wrap; }
.content-page .cell { width: 100%; min-width: 0; }
.content-page .hide-for-large, .content-page .hide-for-medium { display: none !important; }
.content-page svg { max-width: 100%; }
.content-page svg line { stroke: currentColor; stroke-width: 1.5; }
.content-page button { padding: 0; }
.content-page [role="button"] { cursor: pointer; }
.site-header.header-light .brand img { filter: brightness(0) invert(1); }
.site-header.header-light .current-page, .site-header.header-light .fan-links { color: white; }
@media (max-width: 1024px) {
    .content-page .show-for-large { display: none !important; }
    .content-page .hide-for-large { display: block !important; }
    .content-page .hide-for-large.flex-container { display: flex !important; }
}
@media (max-width: 639px) {
    .content-page .show-for-medium, .content-page .hide-for-large.show-for-medium { display: none !important; }
    .content-page .hide-for-medium { display: block !important; }
    .content-page .hide-for-medium.flex-container { display: flex !important; }
}
@media (min-width: 1600px) { .content-page .hide-for-xxlarge { display: none; } }
@media (prefers-reduced-motion: reduce) {
    .content-page *, .content-page *::before, .content-page *::after { animation: none !important; transition: none !important; }
}
