/* 수정: 갤러리 BOM과 같은 300px 네 열·250px 두 행·2px 간격을 적용한다. */
.gallery-bom-section { width: 100%; overflow-x: auto; overflow-y: hidden; }
.gallery-section-heading h1 { margin: 0; color: var(--theme-title-text, #202124); font-size: clamp(22px, 2vw, 30px); line-height: 1.3; }
.gallery-bom-grid {
    display: grid;
    /* 수정: 1280 화면에서는 300×250 고정 셀 네 칸과 14px 간격을 모두 표시한다. */
    width: 1206px;
    grid-template-columns: repeat(4, 300px);
    grid-template-rows: repeat(2, 250px);
    gap: 2px;
    justify-content: center;
    margin: 18px auto 0;
}

.gallery-bom-card {
    position: relative;
    display: block;
    overflow: hidden;
    /* 수정: BOM 작품 테두리는 갤러리와 같은 원래 규격을 유지한다. */
    border: 1px solid var(--theme-thumbnail-border, #6b7280);
    /* 수정: 갤러리 이미지 계열의 모서리는 거의 직각인 1px로 통일한다. */
    border-radius: 1px;
    background: #151719;
    color: #fff;
    text-decoration: none;
}

/* 수정: 대표 작품은 1·2열과 1·2행을 합쳐 최대 614×514 영역에 표시한다. */
.gallery-bom-card-0 {
    grid-column: 1 / span 2;
    grid-row: 1 / span 2;
}

.gallery-bom-card-1 {
    grid-column: 3;
    grid-row: 1;
}

.gallery-bom-card-2 {
    grid-column: 3;
    grid-row: 2;
}

.gallery-bom-card-3 {
    grid-column: 4;
    grid-row: 2;
}

.gallery-bom-ad-slot {
    position: relative;
    grid-column: 4;
    grid-row: 1;
    width: 300px;
    height: 250px;
    min-width: 0;
    min-height: 0;
    /* 수정: 테두리가 광고 내부 크기를 줄이거나 큰 광고를 숨겨 자르지 않게 한다. */
    overflow: visible;
    border: 0;
    box-shadow: inset 0 0 0 1px var(--theme-panel-border, #6b7280);
    border-radius: 1px;
    background: var(--theme-surface-alt, #f5f5f5);
}

.gallery-bom-ad-slot .gallery-ad-slot-content,
.gallery-bom-ad-slot .adsbygoogle {
    /* 수정: 광고 요청과 실제 표시 공간을 모두 300×250으로 맞춘다. */
    width: 300px;
    height: 250px;
    max-width: none;
    max-height: none;
    overflow: visible;
}

.gallery-bom-card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity .22s ease;
}

.gallery-bom-card span {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 28px 14px 12px;
    overflow: hidden;
    background: linear-gradient(transparent, rgb(0 0 0 / 88%));
    color: #fff;
    font: 700 16px/1.35 var(--mmz-ui-font, sans-serif);
    text-overflow: ellipsis;
    white-space: nowrap;
}


.gallery-bom-empty { padding: 32px; color: var(--theme-normal-text); font-size: 16px; }
/* 수정: 광고 미노출 안내도 갤러리와 같은 칸 중앙에 표시한다. */
.gallery-bom-ad-slot > .index-support-content {
    position: absolute;
    top: 50%;
    right: auto;
    bottom: auto;
    left: 50%;
    z-index: 1;
    box-sizing: border-box;
    width: max-content;
    max-width: calc(100% - 24px);
    min-height: 0;
    padding: 14px 18px;
    transform: translate(-50%, -50%);
}
.gallery-bom-card:focus-visible { outline: 3px solid #555555; outline-offset: -3px; }
@media (prefers-reduced-motion: reduce) { .gallery-bom-card img { transition: none; } }
