/* Vorschau und Homepage: sichtbare Markenfläche statt gesamte Dateifläche skalieren. */
.sammelgebiet-harmonized-content{
    container-type:inline-size;
}
.beitrag-text .sammelgebiet-inline-figure.is-harmonized{
    --sg-display-height:var(--sammelgebiet-inline-image-height, 170px);
    width:min(100%, calc(var(--sg-display-height) * var(--sg-visible-ratio)));
    max-width:100%;
}
.beitrag-text .sammelgebiet-inline-figure.is-harmonized.is-flow{
    max-width:46%;
}
.beitrag-text .sammelgebiet-inline-figure.is-harmonized .sammelgebiet-inline-image{
    display:block;
    position:relative;
    width:100%;
    height:auto;
    aspect-ratio:var(--sg-visible-ratio);
    overflow:hidden;
}
.beitrag-text .sammelgebiet-inline-figure.is-harmonized .sammelgebiet-inline-image .sammelgebiet-image-modal-trigger{
    display:block;
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    padding:0;
}
.beitrag-text .sammelgebiet-inline-figure.is-harmonized .sammelgebiet-inline-image img{
    position:absolute;
    left:var(--sg-source-left, 0%);
    top:var(--sg-source-top, 0%);
    display:block;
    width:var(--sg-source-width, 100%);
    height:auto;
    max-width:none;
    max-height:none;
    margin:0;
    object-fit:initial;
}
.beitrag-text td .sammelgebiet-inline-figure.is-harmonized,
.beitrag-text th .sammelgebiet-inline-figure.is-harmonized{
    width:120px;
    max-width:100%;
}
@media (max-width:620px){
    .beitrag-text .sammelgebiet-inline-figure.is-harmonized.is-flow{
        max-width:100%;
    }
}

@supports (width:1cqw){
    .sammelgebiet-harmonized-content .sammelgebiet-inline-figure.is-harmonized:not(.is-flow){
        --sg-display-height:min(var(--sammelgebiet-inline-image-height, 170px), calc(100cqw * var(--sg-responsive-scale, 1)));
    }
}

/* Ausgabegruppen teilen sich einen Maßstab, auch bei unterschiedlichen Einfügecode-Größen. */
.sammelgebiet-harmonized-content{
    --sg-series-height:170px;
}
.beitrag-text .sammelgebiet-inline-figure.is-harmonized.is-stamp-group{
    --sg-display-height:var(--sg-series-height, 170px);
}
@supports (width:1cqw){
    .sammelgebiet-harmonized-content .sammelgebiet-inline-figure.is-harmonized.is-stamp-group:not(.is-flow){
        --sg-display-height:min(var(--sg-series-height, 170px), calc(100cqw * var(--sg-responsive-scale, 1)));
    }
}
@media (max-width:620px){
    .sammelgebiet-harmonized-content{
        --sg-series-height:145px;
    }
}

/* Vergrößerte Artikelansicht: Gruppen wachsen nach Höhe, statt auf dieselbe Breite. */
.sammelgebiet-image-modal .image-modal-dialog{
    width:min(96vw, 1560px) !important;
}
.sammelgebiet-modal-stage{
    width:100%;
    container-type:inline-size;
}
.sammelgebiet-modal-canvas{
    --sg-modal-height:min(520px, 62vh);
    position:relative;
    width:min(100%, calc(var(--sg-modal-height) * var(--sg-visible-ratio, 1)));
    height:auto;
    aspect-ratio:var(--sg-visible-ratio, 1);
    margin:28px auto 0;
    overflow:hidden;
}
.sammelgebiet-modal-canvas.is-stamp-group{
    --sg-modal-height:min(300px, 62vh, calc(100cqw * var(--sg-responsive-scale, .14)));
}
.sammelgebiet-image-modal .sammelgebiet-modal-canvas .image-modal-image{
    position:absolute;
    left:var(--sg-source-left, 0%);
    top:var(--sg-source-top, 0%);
    width:var(--sg-source-width, 100%) !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:initial !important;
    margin:0 !important;
}

/* Admin-Bilddaten: Gruppen auch in der schmalen linken Spalte gleich skalieren. */
.image-modal-dialog.sammelgebiet-image-edit-dialog .sammelgebiet-image-edit-preview{
    display:block;
    width:100%;
    container-type:inline-size;
}
.sammelgebiet-preview-canvas.is-harmonized{
    --sg-preview-height:min(180px, 22vh);
    position:relative;
    width:min(100%, calc(var(--sg-preview-height) * var(--sg-visible-ratio)));
    height:auto;
    aspect-ratio:var(--sg-visible-ratio);
    overflow:hidden;
}
.sammelgebiet-preview-canvas.is-harmonized.is-stamp-group{
    --sg-preview-height:min(140px, calc(100cqw * var(--sg-responsive-scale, .14)));
}
.sammelgebiet-image-edit-preview .sammelgebiet-preview-canvas.is-harmonized img{
    position:absolute;
    left:var(--sg-source-left, 0%);
    top:var(--sg-source-top, 0%);
    width:var(--sg-source-width, 100%) !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    margin:0;
    object-fit:initial;
}

/* Papierfarbener Rahmen und dunkle Bildfläche passen zur Website und zeigen die Papierkanten. */
.sammelgebiet-image-modal .image-modal-dialog{
    background:#e9dfcf !important;
    background-image:none !important;
    border-color:rgba(15,59,102,.24) !important;
    padding:18px !important;
}
.sammelgebiet-image-modal .sammelgebiet-modal-stage{
    box-sizing:border-box;
    margin-top:34px;
    padding:10px;
    background:transparent;
    border:0;
}
.sammelgebiet-image-modal .sammelgebiet-modal-canvas{
    margin-top:0;
    background:#34414a;
    box-shadow:0 0 0 10px #34414a;
}
.sammelgebiet-image-modal .image-modal-caption{
    color:#29465f !important;
}
.sammelgebiet-image-modal .image-modal-close{
    background:#123d62 !important;
    color:#fff !important;
    border-color:#123d62 !important;
}
.sammelgebiet-image-modal .image-modal-close:hover,
.sammelgebiet-image-modal .image-modal-close:focus-visible{
    background:#1c527d !important;
}
.sammelgebiet-image-modal .image-modal-backdrop,
#sammelgebiet-image-edit-modal .image-modal-backdrop{
    background:rgba(15,35,50,.16);
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
.image-modal-dialog.sammelgebiet-image-edit-dialog .sammelgebiet-image-edit-preview{
    box-sizing:border-box;
    padding:8px;
    background:transparent;
    border:0;
}
.sammelgebiet-image-edit-preview .sammelgebiet-preview-canvas{
    background:#34414a;
    box-shadow:0 0 0 8px #34414a;
}

/* Einzelmarken im Artikelmodal maßvoll anzeigen und kleine Vorlagen nicht aufblasen. */
.sammelgebiet-modal-canvas.is-single-stamp{
    --sg-modal-height:min(240px, 45vh, var(--sg-native-height, 240px));
}
.sammelgebiet-image-modal.has-single-stamp .image-modal-dialog{
    width:min(90vw, 640px) !important;
}

/* Ganzsachen größer öffnen; die dunkle Unterlage folgt ebenso eng dem Bild. */
.sammelgebiet-image-modal.has-postal-stationery .image-modal-dialog{
    width:min(94vw, 1400px) !important;
}
.sammelgebiet-image-modal.has-postal-stationery .sammelgebiet-modal-canvas{
    --sg-modal-height:min(760px, max(100px, calc(88vh - 150px)), var(--sg-native-height, 760px));
}
.beitrag-text .sammelgebiet-inline-figure.is-postal-stationery,
.beitrag-text .sammelgebiet-inline-figure.is-postal-stationery .sammelgebiet-inline-image{
    background:transparent;
    border:0;
    box-shadow:none;
}