/* ===== Justified Image Gallery ===== */
.image-grid {
    /* 使用單列 flex 進行橫向對齊。 */
    display: flex;
    flex-wrap: nowrap;
    gap: var(--grid-gap, 8px);
}

/* 讓 marked 產生的 p 標籤不影響 flex 排版 */
.image-grid p {
    display: contents;
}

/* 隱藏換行符號 */
.image-grid br {
    display: none;
}

.content-wrapper .image-grid img {
    height: auto;
    width: 100%;
    object-fit: contain;
    border-radius: var(--radius-md);
    margin: 0;
    background-color: var(--bg-secondary);
    transition: opacity 0.3s ease;
}

.image-grid .media-figure {
    /* figure 本身不額外留白，交由 grid gap 控制。 */
    margin: 0;
    min-width: 0;
}

.image-grid .media-figure:not(.media-image-figure) {
    flex: 1 1 280px;
}

.image-grid .media-image-figure {
    /* 圖片 + caption 垂直堆疊。 */
    display: flex;
    flex-direction: column;
}

.content-wrapper .image-grid .media-image-figure img {
    width: 100%;
    margin: 0;
}

.image-grid .media-image-figure .media-caption {
    /* caption 與圖片間保留固定間距。 */
    margin-top: var(--spacing-sm);
}

/* 圖片載入前隱藏，避免閃爍 */
.content-wrapper .image-grid img:not([data-justified]) {
    opacity: 0;
}

.content-wrapper .image-grid img[data-justified="true"] {
    opacity: 1;
}
