[data-theme=light] {
    --_0-YpYB: var(--color-cold-gray-150);
    --_1-YpYB: #6a6d7833
}

[data-theme=dark] {
    --_0-YpYB: var(--color-cold-gray-700);
    --_1-YpYB: #86899333
}

.preview-fSver7BK {
    align-items: center;
    border-radius: var(--ui-lib-image-card-preview-border-radius);
    display: flex;
    isolation: isolate;
    justify-content: center;
    order: -1;
    position: relative
}

.preview-fSver7BK:before {
    background: var(--color-bg-scroll-buttons);
    top: 1px;
    z-index: -1
}

.preview-fSver7BK:after,
.preview-fSver7BK:before {
    border-radius: var(--ui-lib-image-card-preview-border-radius);
    content: "";
    height: calc(100% - 2px);
    position: absolute;
    width: calc(100% - 2px)
}

.preview-fSver7BK:after {
    border: 1px solid rgb(from var(--color-default-gray) r g b/.2);
    pointer-events: none;
    top: 0
}

@supports not (background:rgb(from #000 r g b)) {
    .preview-fSver7BK:after {
        border: 1px solid var(--_1-YpYB)
    }
}

.preview-fSver7BK.fixedHeight-fSver7BK {
    height: 180px
}

.preview-fSver7BK.ratio16by9-fSver7BK {
    aspect-ratio: 16/9
}

@supports not (aspect-ratio:16/9) {
    .preview-fSver7BK.ratio16by9-fSver7BK {
        padding-bottom: 56.25%
    }
}

.preview-fSver7BK.ratio2by1-fSver7BK {
    aspect-ratio: 2/1
}

@supports not (aspect-ratio:2/1) {
    .preview-fSver7BK.ratio2by1-fSver7BK {
        padding-bottom: 50%
    }
}

.broken-image-fSver7BK:after {
    border: 1px solid var(--color-default-gray);
    border-radius: var(--ui-lib-image-card-preview-border-radius);
    content: "";
    height: calc(100% - 2px);
    pointer-events: none;
    position: absolute;
    top: 0;
    width: calc(100% - 2px)
}

.preview-grid-fSver7BK {
    display: grid;
    grid-template-areas: "top-left-corner top-right-corner" ". ." "bottom-left-corner bottom-right-corner";
    grid-template-columns: repeat(2, minmax(0, auto));
    grid-template-rows: min-content auto min-content;
    height: 100%;
    inset-inline-start: 0;
    position: absolute;
    top: 0;
    -webkit-user-select: none;
    user-select: none;
    width: 100%
}

.picture-fSver7BK {
    display: contents
}

.image-fSver7BK,
.image-link-fSver7BK,
.middle-fSver7BK {
    height: 100%;
    inset-inline-start: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.image-fSver7BK {
    background: var(--ui-lib-image-card-preview-background);
    border-radius: var(--ui-lib-image-card-preview-border-radius);
    object-fit: cover
}

.middle-fSver7BK {
    align-items: center;
    justify-content: center
}

.corner-fSver7BK,
.middle-fSver7BK {
    display: flex;
    pointer-events: none;
    z-index: 1
}

.corner-fSver7BK {
    flex-flow: row nowrap
}

.corner-fSver7BK>* {
    pointer-events: auto
}

.corner-top-left-fSver7BK {
    grid-area: top-left-corner;
    padding-block: 8px 0;
    padding-inline: 8px 0
}

.corner-top-right-fSver7BK {
    grid-area: top-right-corner;
    justify-content: flex-end;
    padding-block: 8px 0;
    padding-inline: 0 8px
}

.corner-bottom-left-fSver7BK {
    align-items: flex-end;
    grid-area: bottom-left-corner;
    padding-block: 0 8px;
    padding-inline: 8px 0
}

.corner-bottom-right-fSver7BK {
    align-items: flex-end;
    grid-area: bottom-right-corner;
    justify-content: flex-end;
    padding-block: 0 8px;
    padding-inline: 0 8px
}