/*
 * Static equivalents for the original JavaScript-only gallery treatment.
 * The stylesheet has no external resources and is copied into the generated
 * site by build_first_wave.py.
 */
.mini-gallery-static {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: 12px;
    margin: 16px 0 20px;
}

.mini-gallery-static a {
    display: block;
    min-width: 0;
}

.mini-gallery-static img {
    display: block;
    box-sizing: border-box;
    width: 100% !important;
    height: auto !important;
    max-width: 100%;
    margin: 0 !important;
    border: 1px solid #e5e5e5;
}

.mini-gallery-static a[href="#"] {
    cursor: default;
}

.mini-gallery-static > a:empty,
.mini-gallery-static > br {
    display: none !important;
}

/* The original site was fixed at 955px.  Keep that desktop composition, but
 * let a narrow desktop viewport (or a high browser zoom) retain the header
 * controls instead of cropping the right edge. */
@media screen and (max-width: 979px) {
    .main {
        min-width: 0;
    }

    .content {
        box-sizing: border-box;
        min-width: 0;
        width: calc(100% - 24px);
        max-width: 955px;
    }

    .header a.site-link,
    .header a.site-link:visited {
        left: auto;
        right: 48px;
    }

    .header a.lang,
    .header a.lang:visited {
        left: auto;
        right: 0;
    }

    .header .menu a,
    .header .menu a:visited,
    .header .menu span {
        font-size: 12px;
        padding-left: 9px;
        padding-right: 9px;
    }

    .content .back-panel {
        padding-left: 8px;
        padding-right: 8px;
    }
}

@media screen and (max-width: 680px) {
    .mini-gallery-static {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}