/* Guide image viewer — isolated lightbox styles. */
.guide-hub__images img,
.mv11-guide-entry__images img{
    cursor:zoom-in;
}

.giv{
    position:fixed;
    inset:0;
    z-index:2147483000;
    display:none;
    color:#fff;
    font-family:inherit;
    -webkit-tap-highlight-color:transparent;
}

.giv.is-open{
    display:block;
}

.giv__backdrop{
    position:absolute;
    inset:0;
    background:rgba(7,12,20,.92);
    backdrop-filter:blur(6px);
}

.giv__dialog{
    position:absolute;
    inset:0;
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto;
    padding:
        calc(12px + env(safe-area-inset-top))
        max(12px,env(safe-area-inset-right))
        calc(12px + env(safe-area-inset-bottom))
        max(12px,env(safe-area-inset-left));
    outline:0;
}

.giv__topbar,
.giv__bottombar{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
}

.giv__topbar{
    justify-content:flex-end;
    min-height:44px;
}

.giv__bottombar{
    justify-content:center;
    min-height:46px;
    padding-top:8px;
}

.giv__counter{
    min-width:54px;
    padding:7px 10px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:999px;
    background:rgba(15,23,35,.72);
    color:#fff;
    font-size:12px;
    font-weight:800;
    line-height:1;
    text-align:center;
    backdrop-filter:blur(8px);
}

.giv__button{
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    flex:0 0 40px;
    padding:0;
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
    background:rgba(15,23,35,.72);
    color:#fff;
    font:inherit;
    font-size:20px;
    font-weight:800;
    line-height:1;
    cursor:pointer;
    backdrop-filter:blur(8px);
    transition:background .15s ease,transform .15s ease,opacity .15s ease;
}

.giv__button:hover{
    background:rgba(42,55,74,.92);
}

.giv__button:active{
    transform:scale(.96);
}

.giv__button:focus-visible{
    outline:2px solid #fff;
    outline-offset:2px;
}

.giv__button[disabled]{
    opacity:.28;
    cursor:default;
}

.giv__close{
    font-size:26px;
    font-weight:500;
}

.giv__reset{
    width:auto;
    min-width:48px;
    padding:0 11px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
}

.giv__stage{
    position:relative;
    z-index:1;
    min-width:0;
    min-height:0;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    touch-action:none;
    user-select:none;
    overscroll-behavior:contain;
}

.giv__image{
    display:block;
    max-width:min(100%,1400px);
    max-height:100%;
    width:auto;
    height:auto;
    object-fit:contain;
    transform:translate3d(0,0,0) scale(1);
    transform-origin:center center;
    will-change:transform;
    user-select:none;
    -webkit-user-drag:none;
    cursor:zoom-in;
}

.giv.is-zoomed .giv__image{
    cursor:grab;
}

.giv.is-dragging .giv__image{
    cursor:grabbing;
}

.giv__nav{
    position:absolute;
    top:50%;
    z-index:3;
    transform:translateY(-50%);
    width:46px;
    height:46px;
    font-size:28px;
}

.giv__prev{
    left:max(12px,env(safe-area-inset-left));
}

.giv__next{
    right:max(12px,env(safe-area-inset-right));
}

.giv.is-single .giv__nav{
    display:none;
}

.giv__help{
    position:absolute;
    left:50%;
    bottom:calc(66px + env(safe-area-inset-bottom));
    z-index:2;
    max-width:calc(100% - 32px);
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,35,.58);
    color:rgba(255,255,255,.74);
    font-size:10px;
    line-height:1.3;
    white-space:nowrap;
    transform:translateX(-50%);
    pointer-events:none;
}

body.giv-body-lock{
    overflow:hidden!important;
    overscroll-behavior:none;
}

@media(max-width:700px){
    .giv__dialog{
        padding:
            calc(8px + env(safe-area-inset-top))
            max(8px,env(safe-area-inset-right))
            calc(8px + env(safe-area-inset-bottom))
            max(8px,env(safe-area-inset-left));
    }

    .giv__topbar{
        min-height:42px;
    }

    .giv__button{
        width:38px;
        height:38px;
        flex-basis:38px;
    }

    .giv__nav{
        width:40px;
        height:40px;
        opacity:.9;
    }

    .giv__prev{
        left:max(6px,env(safe-area-inset-left));
    }

    .giv__next{
        right:max(6px,env(safe-area-inset-right));
    }

    .giv__image{
        max-width:100%;
        max-height:100%;
    }

    .giv__help{
        display:none;
    }
}

@media(prefers-reduced-motion:reduce){
    .giv__button{
        transition:none;
    }
}