.mew-spg,.mew-spg *{box-sizing:border-box}.mew-spg{--mew-spg-height:550px;width:100%;height:var(--mew-spg-height);background:#2a2a2a;overflow:hidden;position:relative}.mew-spg-layout{width:100%;height:100%;display:flex;gap:14px;padding:20px;min-width:0;min-height:0}.mew-spg-pos-left .mew-spg-layout{flex-direction:row-reverse}.mew-spg-pos-right .mew-spg-layout{flex-direction:row}.mew-spg-pos-top .mew-spg-layout{flex-direction:column-reverse}.mew-spg-pos-bottom .mew-spg-layout{flex-direction:column}.mew-spg-main{flex:1 1 auto;min-width:0;min-height:0}.mew-spg-stage{position:relative;width:100%;height:100%;overflow:hidden;background:#fff;display:flex;align-items:center;justify-content:center;padding:20px}.mew-spg-main-image{width:100%;height:100%;max-width:none;max-height:none;display:block;object-fit:contain;object-position:center;user-select:none;flex:0 0 auto}.mew-spg-control{width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.88);color:#333;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:Arial,sans-serif;line-height:1;font-size:26px;padding:0;box-shadow:none;z-index:4}.mew-spg-main-prev,.mew-spg-main-next{position:absolute;top:50%;transform:translateY(-50%);z-index:10;pointer-events:auto}.mew-spg-main-prev{left:14px}.mew-spg-main-next{right:14px}.mew-spg-fullscreen{position:absolute;top:14px;right:14px;font-size:19px;z-index:10;pointer-events:auto}.mew-spg-thumb-column{--mew-thumb-width:150px;--mew-thumb-offset-x:0px;--mew-thumb-offset-y:0px;flex:0 0 auto;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;transform:translate(var(--mew-thumb-offset-x),var(--mew-thumb-offset-y));position:relative;z-index:2}.mew-spg-pos-left .mew-spg-thumb-column,.mew-spg-pos-right .mew-spg-thumb-column{width:var(--mew-thumb-width);height:100%;flex-direction:column}.mew-spg-pos-top .mew-spg-thumb-column,.mew-spg-pos-bottom .mew-spg-thumb-column{width:100%;height:auto;flex-direction:row}.mew-spg-thumbs-viewport{overflow:hidden;min-width:0;min-height:0;flex:1 1 auto;width:100%;height:100%;display:flex}.mew-spg-thumbs-track{display:flex;gap:12px;transition:transform .25s ease;will-change:transform}.mew-spg-pos-left .mew-spg-thumbs-track,.mew-spg-pos-right .mew-spg-thumbs-track{flex-direction:column}.mew-spg-pos-top .mew-spg-thumbs-track,.mew-spg-pos-bottom .mew-spg-thumbs-track{flex-direction:row}.mew-spg-thumb{flex:0 0 auto;width:150px;height:94px;border:2px solid transparent;padding:8px;margin:0;background:#4b4b4b;overflow:hidden;cursor:pointer;opacity:.82}.mew-spg-thumb img{display:block;width:100%;height:100%;object-fit:contain}.mew-spg-thumb.is-active{background:#fff;border-color:#fff;opacity:1}.mew-spg-thumbs-prev,.mew-spg-thumbs-next{flex:0 0 auto;width:32px!important;height:32px!important;font-size:20px!important}.mew-spg-pos-left .mew-spg-thumbs-prev,.mew-spg-pos-right .mew-spg-thumbs-prev,.mew-spg-pos-left .mew-spg-thumbs-next,.mew-spg-pos-right .mew-spg-thumbs-next{transform:rotate(90deg);margin:8px 0}.mew-spg-pos-top .mew-spg-thumbs-prev,.mew-spg-pos-bottom .mew-spg-thumbs-prev{margin-right:8px}.mew-spg-pos-top .mew-spg-thumbs-next,.mew-spg-pos-bottom .mew-spg-thumbs-next{margin-left:8px}.mew-spg-empty{padding:24px;background:#f7f7f7;border:1px solid #ddd;color:#555;text-align:center}.mew-spg-lightbox{position:fixed;inset:0;z-index:999999;background:rgba(0,0,0,.94);display:flex;align-items:center;justify-content:center;padding:32px}.mew-spg-lightbox img{max-width:95vw;max-height:92vh;object-fit:contain}.mew-spg-lightbox-close{position:absolute;top:18px;right:18px;width:46px;height:46px;border:0;border-radius:50%;background:#fff;color:#111;font-size:28px;cursor:pointer}@media(max-width:767px){.mew-spg-layout,.mew-spg-pos-left .mew-spg-layout,.mew-spg-pos-right .mew-spg-layout{flex-direction:column;padding:12px}.mew-spg-main{width:100%;flex:1 1 auto}.mew-spg-thumb-column,.mew-spg-pos-left .mew-spg-thumb-column,.mew-spg-pos-right .mew-spg-thumb-column{width:100%;height:auto;flex-direction:row}.mew-spg-pos-left .mew-spg-thumbs-track,.mew-spg-pos-right .mew-spg-thumbs-track{flex-direction:row}.mew-spg-pos-left .mew-spg-thumbs-prev,.mew-spg-pos-right .mew-spg-thumbs-prev,.mew-spg-pos-left .mew-spg-thumbs-next,.mew-spg-pos-right .mew-spg-thumbs-next{transform:none;margin:0 8px 0 0}.mew-spg-pos-left .mew-spg-thumbs-next,.mew-spg-pos-right .mew-spg-thumbs-next{margin:0 0 0 8px}}


/* Thumbnail strip alignment */
.mew-spg[data-thumb-align="start"] .mew-spg-thumbs-viewport{justify-content:flex-start}
.mew-spg[data-thumb-align="center"] .mew-spg-thumbs-viewport{justify-content:center}
.mew-spg[data-thumb-align="end"] .mew-spg-thumbs-viewport{justify-content:flex-end}

.mew-spg-pos-left .mew-spg-thumbs-viewport,
.mew-spg-pos-right .mew-spg-thumbs-viewport{flex-direction:column}

.mew-spg-pos-top .mew-spg-thumbs-viewport,
.mew-spg-pos-bottom .mew-spg-thumbs-viewport{flex-direction:row}

/* Main image transition effects */
.mew-spg-main-image{
    --mew-spg-transition:350ms;
    transition:
        opacity var(--mew-spg-transition) ease,
        transform var(--mew-spg-transition) ease;
    will-change:opacity,transform;
}
.mew-spg-main-image.mew-spg-anim-out{opacity:.15}
.mew-spg[data-transition="slide"] .mew-spg-main-image.mew-spg-anim-out{transform:translateX(28px);opacity:0}
.mew-spg[data-transition="slide"] .mew-spg-main-image.mew-spg-anim-in{transform:translateX(-28px);opacity:0}
.mew-spg[data-transition="zoom"] .mew-spg-main-image.mew-spg-anim-out{transform:scale(.96);opacity:0}
.mew-spg[data-transition="zoom"] .mew-spg-main-image.mew-spg-anim-in{transform:scale(1.04);opacity:0}
.mew-spg[data-transition="none"] .mew-spg-main-image{transition:none!important}
.mew-spg-stage{touch-action:pan-y;user-select:none}

/* When the thumbnail rail is longer than its viewport, always anchor it to the
   leading edge. Center/end alignment on an overflowing flex track can otherwise
   clip thumbnails before the JS translate starts. */
.mew-spg.mew-spg-thumbs-overflow .mew-spg-thumbs-viewport{justify-content:flex-start!important}

/* v4.5.35 - stable mobile layout. Keep this block last so it wins over the
   desktop left/right thumbnail-direction rules declared above. */
@media (max-width:767px){
    .mew-spg{
        width:100%;
        max-width:100%;
        min-width:0;
    }
    .mew-spg .mew-spg-layout,
    .mew-spg-pos-left .mew-spg-layout,
    .mew-spg-pos-right .mew-spg-layout,
    .mew-spg-pos-top .mew-spg-layout,
    .mew-spg-pos-bottom .mew-spg-layout{
        flex-direction:column!important;
        width:100%;
        min-width:0;
        min-height:0;
    }
    .mew-spg .mew-spg-main{
        width:100%!important;
        max-width:100%;
        min-width:0;
        min-height:0;
        flex:1 1 0;
        display:flex;
        align-items:stretch;
    }
    .mew-spg .mew-spg-stage{
        flex:1 1 auto;
        width:100%;
        min-width:0;
        min-height:0;
        display:flex;
        align-items:center;
        justify-content:center;
    }
    .mew-spg .mew-spg-main-image{
        display:block;
        max-width:100%;
        max-height:100%;
        margin:auto;
        flex:0 1 auto;
    }
    .mew-spg .mew-spg-thumb-column,
    .mew-spg-pos-left .mew-spg-thumb-column,
    .mew-spg-pos-right .mew-spg-thumb-column,
    .mew-spg-pos-top .mew-spg-thumb-column,
    .mew-spg-pos-bottom .mew-spg-thumb-column{
        width:100%!important;
        max-width:100%;
        height:auto!important;
        min-width:0;
        min-height:0;
        flex:0 0 auto;
        flex-direction:row!important;
        align-items:center;
    }
    .mew-spg .mew-spg-thumbs-viewport,
    .mew-spg-pos-left .mew-spg-thumbs-viewport,
    .mew-spg-pos-right .mew-spg-thumbs-viewport,
    .mew-spg-pos-top .mew-spg-thumbs-viewport,
    .mew-spg-pos-bottom .mew-spg-thumbs-viewport{
        width:100%;
        max-width:100%;
        height:auto!important;
        min-width:0;
        min-height:0;
        flex:1 1 0;
        flex-direction:row!important;
        align-items:center;
        overflow:hidden;
        touch-action:pan-y;
    }
    .mew-spg .mew-spg-thumbs-track,
    .mew-spg-pos-left .mew-spg-thumbs-track,
    .mew-spg-pos-right .mew-spg-thumbs-track,
    .mew-spg-pos-top .mew-spg-thumbs-track,
    .mew-spg-pos-bottom .mew-spg-thumbs-track{
        flex-direction:row!important;
        align-items:center;
        width:max-content;
        min-width:max-content;
        max-width:none;
    }
    .mew-spg .mew-spg-thumb{
        max-width:none;
        min-width:44px;
    }
    .mew-spg .mew-spg-thumbs-prev,
    .mew-spg .mew-spg-thumbs-next,
    .mew-spg-pos-left .mew-spg-thumbs-prev,
    .mew-spg-pos-left .mew-spg-thumbs-next,
    .mew-spg-pos-right .mew-spg-thumbs-prev,
    .mew-spg-pos-right .mew-spg-thumbs-next{
        transform:none!important;
        margin-top:0;
        margin-bottom:0;
        flex:0 0 auto;
    }
}