:root {
    --vvp-mb-fg: #0B1F3B;
    --vvp-mb-bg: rgba(255,255,255,.94);
    --vvp-mb-sep: #E5E7EB;
}

.vvp-media-badges-anchor { position: relative !important; }

.vvp-media-badges {
    position: absolute;
    z-index: 12;
    top: 8px;
    right: 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    pointer-events: none;
    line-height: 1;
}

.vvp-media-badge {
    width: 24px;
    height: 24px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--vvp-mb-fg);
    background: var(--vvp-mb-bg);
    border: 1px solid var(--vvp-mb-sep);
    border-radius: 3px;
    box-shadow: none;
}

.vvp-media-badge svg {
    width: 16px;
    height: 16px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: square;
    stroke-linejoin: miter;
    vector-effect: non-scaling-stroke;
}

/* 120–179 px image: smaller badge, same visual language. */
.vvp-media-badges-anchor.vvp-mb-size-sm .vvp-media-badges { top: 5px; right: 5px; gap: 3px; }
.vvp-media-badges-anchor.vvp-mb-size-sm .vvp-media-badge { width: 19px; height: 19px; border-radius: 2px; }
.vvp-media-badges-anchor.vvp-mb-size-sm .vvp-media-badge svg { width: 13px; height: 13px; stroke-width: 1.65; }

/* 72–119 px image: do not let the marker become the picture. */
.vvp-media-badges-anchor.vvp-mb-size-xs .vvp-media-badges { top: 3px; right: 3px; gap: 2px; }
.vvp-media-badges-anchor.vvp-mb-size-xs .vvp-media-badge { width: 15px; height: 15px; border-radius: 2px; border-width: 1px; }
.vvp-media-badges-anchor.vvp-mb-size-xs .vvp-media-badge svg { width: 10px; height: 10px; stroke-width: 1.6; }

/* Very small thumbnails: only a tiny line icon plate. */
.vvp-media-badges-anchor.vvp-mb-size-xxs .vvp-media-badges { top: 2px; right: 2px; gap: 1px; }
.vvp-media-badges-anchor.vvp-mb-size-xxs .vvp-media-badge {
    width: 12px; height: 12px; border: 0; border-radius: 1px; background: rgba(255,255,255,.90);
}
.vvp-media-badges-anchor.vvp-mb-size-xxs .vvp-media-badge svg { width: 9px; height: 9px; stroke-width: 1.55; }

/* Tablet/mobile keep the same composition; actual size is governed by thumbnail geometry. */
@media (max-width: 1024px) {
    .vvp-media-badges { top: 7px; right: 7px; }
}
@media (max-width: 767px) {
    .vvp-media-badges { top: 6px; right: 6px; gap: 3px; }
}
