#gallery-lightbox{width:calc(100vw - 24px);height:calc(100dvh - 24px);max-height:none;padding:0 8px;overflow:hidden;border:1px solid #687188;background:#0b1d3c}
#gallery-lightbox[open]{display:flex;flex-direction:column}
:fullscreen #gallery-lightbox{width:100vw;height:100dvh;border:0}
#gallery-lightbox .lightbox-top{flex:none;min-height:50px;padding:0 6px;gap:8px;letter-spacing:0}
#gallery-lightbox .viewer-tools{display:flex;align-items:center;gap:4px}
#gallery-lightbox .viewer-tools button{display:grid;place-items:center;border:0;background:transparent;color:white;min-width:44px;height:44px;padding:0 6px;font:18px var(--sans);cursor:pointer}
#gallery-lightbox .viewer-tools [data-action=fit]{font-size:13px}
#gallery-lightbox button:hover,#gallery-lightbox button[aria-pressed=true]{background:#ffffff20}
#gallery-lightbox button:focus-visible{outline:2px solid #b5a2ef;outline-offset:-2px}
#viewer-zoom{min-width:42px;text-align:center;font:12px var(--sans)}
#gallery-lightbox .viewer-body{display:flex;flex:1;min-height:0;gap:8px}
#gallery-lightbox .lightbox-stage{flex:1;min-width:0;height:auto;overflow:hidden;touch-action:none;isolation:isolate}
#gallery-lightbox .lightbox-stage img{position:absolute;left:50%;top:50%;max-width:none;max-height:none;object-fit:contain;transform:translate(-50%,-50%)}
#gallery-lightbox .lightbox-stage.zoomed{cursor:grab}
#gallery-lightbox .lightbox-stage.zoomed:active{cursor:grabbing}
#gallery-lightbox .lightbox-prev,#gallery-lightbox .lightbox-next{position:absolute;top:50%;transform:translateY(-50%);z-index:2;background:#0b1d3cbb;width:44px;height:44px;cursor:pointer}
#gallery-lightbox .lightbox-prev{left:8px}#gallery-lightbox .lightbox-next{right:8px}
#gallery-lightbox .lightbox-bottom{display:block;flex:none;padding:7px 8px 9px}
#gallery-lightbox .lightbox-bottom h2{font-size:25px;margin:0 0 3px}
#gallery-lightbox .lightbox-bottom p{font-size:16px;line-height:1.2}
#viewer-thumbnails{width:108px;flex:none;overflow:auto;padding:3px;scrollbar-width:thin}
#viewer-thumbnails button{display:block;width:100%;border:2px solid transparent;padding:3px;background:transparent;margin-bottom:6px;cursor:pointer}
#viewer-thumbnails button[aria-current=true]{border-color:#b5a2ef}
#viewer-thumbnails img{width:100%;height:65px;object-fit:contain;display:block}
@media(max-width:600px){
#gallery-lightbox{width:100vw;height:100dvh;border:0;padding:0 4px}
#gallery-lightbox .lightbox-top{flex-wrap:wrap;justify-content:center;gap:0;padding:2px 0}
#lightbox-count{width:100%;text-align:center;font-size:11px}
#gallery-lightbox .viewer-tools{gap:0;justify-content:center;width:100%}
#gallery-lightbox .viewer-tools button{min-width:44px;padding:0 3px}
#gallery-lightbox .lightbox-bottom h2{font-size:21px}
#gallery-lightbox .lightbox-bottom p{font-size:14px}
#viewer-thumbnails{width:76px}#viewer-thumbnails img{height:52px}
}

/* Keep hit areas above image/loading layers; icons never intercept pointer input. */
#gallery-lightbox .viewer-tools{position:relative;z-index:3}
#gallery-lightbox button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
#gallery-lightbox button{touch-action:manipulation}
#gallery-lightbox #lightbox-status{pointer-events:none}
#gallery-lightbox .lightbox-prev,#gallery-lightbox .lightbox-next{width:48px;height:48px}
#gallery-lightbox button:disabled{opacity:.4;cursor:default}
@media(max-width:370px){#viewer-zoom{min-width:36px}#gallery-lightbox .viewer-tools button{padding:0}}

@media(max-width:600px){#gallery-lightbox .viewer-tools{flex-wrap:wrap}#gallery-lightbox .viewer-tools button{flex:none}}

#gallery-viewer-host:fullscreen{width:100vw;height:100dvh;background:#0b1d3c;overflow:hidden}
#gallery-viewer-host:fullscreen #gallery-lightbox{position:fixed;inset:0;margin:0;width:100%;height:100%;max-width:none;max-height:none;background:#0b1d3c}

#gallery-lightbox .viewer-tools [data-action="play"] svg{width:28px;height:28px}