.lightbox3-overlay {
    --lb-backdrop-color:rgba(0,0,0,.95);
    --lb-chrome-bg:hsla(0,0%,9%,.8);
    --lb-chrome-text:hsla(0,0%,100%,.9);
    --lb-chrome-font-size:15px;
    --lb-chrome-padding:16px;
    --lb-chrome-border-radius:48px;
    --lb-image-border-radius:none;
    --lb-image-padding:40px;
    --lb-z-index:999999;
    -webkit-tap-highlight-color:transparent;
    inset:0;
    outline:none;overflow:hidden;
    position:fixed;touch-action:none;
    z-index:var(--lb-z-index);
}

.lightbox3-backdrop {
    background:var(--lb-backdrop-color);
    cursor:pointer;
    inset:0;
    position:absolute;
}

.lightbox3-strip {
    inset:0;
    pointer-events:none;
    position:fixed;
    will-change:transform;
}

.lightbox3-slide {
    height:100vh;
    pointer-events:none;
    position:absolute;
    top:0;
    width:100vw;
}

.lightbox3-image {
    -webkit-user-drag:none;
    object-fit:cover;
    position:absolute;
    touch-action:none;
    transform-origin:center center;
    user-select:none;
    will-change:transform;
}

.lightbox3-spinner {
    animation:lightbox3-spin .7s linear infinite;
    border:3px solid hsla(0,0%,100%,.2);
    border-radius:50%;
    border-top-color:hsla(0,0%,100%,.8);
    height:32px;
    left:50%;
    margin:-16px 0 0 -16px;
    position:absolute;
    top:50%;width:32px;
}

@keyframes lightbox3-spin {
    to {
        transform:rotate(1turn)
    }
}

.lightbox3-chrome {
    align-items:center;
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    background:var(--lb-chrome-bg);
    border-radius:var(--lb-chrome-border-radius);
    bottom:var(--lb-chrome-padding);
    box-shadow:inset 0 1px 0 hsla(0,0%,100%,.08);
    color:var(--lb-chrome-text);
    display:flex;
    font-size:var(--lb-chrome-font-size);
    font-weight:500;
    gap:12px;
    left:50%;
    letter-spacing:.02em;
    line-height:1;
    max-width:min(90vw,600px);
    padding:6px 6px 6px 18px;
    pointer-events:none;
    position:fixed;
    user-select:none;
    width:max-content;
    z-index:1;
}

.lightbox3-chrome--minimaln{
    padding:6px;
}

.lightbox3-counter {
    color:hsla(0,0%,100%,.55);
    font-size:14px;
    font-variant-numeric:tabular-nums;
    letter-spacing:.01em;
}

.lightbox3-caption {
    -webkit-box-orient:vertical;
    -webkit-line-clamp:10;
    color:hsla(0,0%,100%,.9);
    display:-webkit-box;
    flex:1;
    line-height:1.3;
    min-width:0;
    overflow:hidden;
    pointer-events:auto;
}

.lightbox3-close {
    align-items:center;
    background:hsla(0,0%,100%,.08);
    border:none;
    border-radius:50%;
    color:#fff;
    cursor:pointer;
    display:flex;
    flex-shrink:0;
    height:40px;
    justify-content:center;
    padding:0;
    pointer-events:auto;
    transition:background .15s ease;
    width:40px;
}

.lightbox3-close:hover {
    background:hsla(0,0%,100%,.16);
}

.lightbox3-close:focus {
    outline:none;
}

.lightbox3-close:focus-visible {
    outline:2px solid hsla(0,0%,100%,.8);
    outline-offset:2px;
}

.lightbox3-close svg {
    height:22px;
    opacity:.85;
    transition:opacity .15s ease;
    width:22px;
}

.lightbox3-close:hover svg {
    opacity:1;
}

.lightbox3-arrow {
    align-items:center;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    background:hsla(0,0%,100%,.1);
    border:none;
    border-radius:50%;
    box-shadow:inset 0 1px 0 hsla(0,0%,100%,.08);
    color:#fff;
    cursor:pointer;
    display:flex;
    height:48px;
    justify-content:center;
    padding:0;
    pointer-events:auto;
    position:fixed;
    top:50%;
    transform:translateY(-50%);
    transition:background .15s ease;
    width:48px;
    z-index:1;
}

.lightbox3-arrow:hover {
    background:hsla(0,0%,100%,.18);
}

.lightbox3-arrow:focus {
    outline:none;
}

.lightbox3-arrow:focus-visible {
    outline:2px solid hsla(0,0%,100%,.8);
    outline-offset:2px;
}

.lightbox3-arrow svg {
    height:28px;
    opacity:.7;
    transition:opacity .15s ease;
    width:28px;
}

.lightbox3-arrow:hover svg {
    opacity:1;
}

.lightbox3-arrow-prev {
    left:var(--lb-chrome-padding);
}

.lightbox3-arrow-next {
    right:var(--lb-chrome-padding);
}

@media (max-width:600px) {
    .lightbox3-overlay {
        --lb-image-border-radius:16px;
        --lb-image-padding:8px;
    }
    .lightbox3-arrow {
        display:none;
    }
    .lightbox3-chrome {
        --lb-chrome-padding:12px;
        --lb-chrome-font-size:14px;
        bottom:var(--lb-chrome-padding);
        font-size:var(--lb-chrome-font-size);
        gap:10px;
        padding:5px 5px 5px 14px;
    }
    .lightbox3-chrome--minimal {
        padding:5px;
    }
    .lightbox3-close {
        height:36px;
        width:36px;
    }
    .lightbox3-close svg {
        height:20px;
        width:20px;
    }
}

@media (prefers-reduced-motion:reduce) {
    .lightbox3-backdrop,.lightbox3-image,.lightbox3-spinner {
        animation-duration:.01ms!important;
        transition-duration:.01ms!important;
        }
}