/* Web adaptation of Apple's continuity and material-depth principles. */
#lightbox{padding:0;margin:0;background:transparent;backdrop-filter:none;overflow:hidden;width:100%;height:100dvh;max-height:100dvh;outline:none}
#lightbox::backdrop{background:transparent}
#lightbox[open],#lightbox[open] .lightbox-stage{animation:none}
.viewer-veil{position:absolute;inset:0;background:rgba(3,5,7,.78);pointer-events:none}
.viewer-surface{position:absolute;inset:16px;display:flex;flex-direction:column;gap:16px;padding:18px 22px;border:1px solid #ffffff30;border-radius:28px;background:linear-gradient(145deg,#303840a8,#11171dcc 62%,#222b32b8);box-shadow:inset 0 1px 0 #ffffff45,inset 0 -1px 0 #ffffff12,0 28px 90px #000b;backdrop-filter:blur(24px) saturate(1.15);-webkit-backdrop-filter:blur(24px) saturate(1.15);isolation:isolate;overflow:hidden}
.viewer-surface::after,.glass-morph::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 1px 0 #ffffff38,inset 1px 0 0 #ffffff12;z-index:2}
#lightbox .lightbox-bar{flex:0 0 auto;min-height:44px;gap:20px;font-size:11px;letter-spacing:1.2px;color:#d2d9de}
#lightbox .lightbox-stage{flex:1 1 auto;min-height:0;height:auto;margin:0;border-radius:9px;background:transparent;scrollbar-width:thin;scrollbar-color:#ffffff50 transparent}
#lightbox .lightbox-stage img{margin:0;border-radius:0;object-position:50% 50%;user-select:none;-webkit-user-drag:none}
#lightbox .controls{flex:0 0 auto;padding:0;gap:12px;min-height:44px}
#lightbox .controls button,#lightbox .controls a,#lightbox-close{border:1px solid #ffffff25;border-radius:999px;min-height:44px;padding:10px 17px;background:#ffffff0b;color:#f6f7f8;box-shadow:inset 0 1px 0 #ffffff12;transition:background .18s,border-color .18s;font-size:12px;letter-spacing:0}
#lightbox button:hover,#lightbox .controls a:hover{background:#ffffff20;border-color:#ffffff60}
#lightbox button:focus-visible,#lightbox a:focus-visible{outline:2px solid white;outline-offset:3px}
#lightbox-count{min-width:58px;text-align:center;font-size:11px;font-variant-numeric:tabular-nums;color:#bdc7d0}
.viewer-hidden{visibility:hidden!important}
.viewer-source-hidden{visibility:hidden!important}
.glass-morph{position:absolute;margin:0;overflow:hidden;pointer-events:none;transform-origin:0 0;border:1px solid #ffffff35;background:linear-gradient(145deg,#303840a8,#11171dcc 62%,#222b32b8);backdrop-filter:blur(24px) saturate(1.15);-webkit-backdrop-filter:blur(24px) saturate(1.15);will-change:left,top,width,height,border-radius;isolation:isolate}
.glass-morph-material{position:absolute;inset:0;border-radius:inherit;pointer-events:none}
.glass-morph-window{position:absolute;overflow:hidden;will-change:left,top,width,height;border-radius:5px}
#lightbox .glass-morph img{position:absolute;display:block;left:0;top:0;max-width:none;max-height:none;margin:0;object-fit:fill;transform-origin:0 0;pointer-events:none;will-change:transform}
html.viewer-scroll-locked{scroll-behavior:auto!important}
@media(max-width:800px){.viewer-surface{inset:max(7px,env(safe-area-inset-top)) max(7px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));padding:12px 10px;gap:12px;border-radius:22px}#lightbox .controls{gap:6px;flex-wrap:wrap}#lightbox .controls button,#lightbox .controls a{padding:10px 12px;font-size:11px}#lightbox .lightbox-bar{padding:0 3px}#lightbox-count{min-width:43px}#lightbox .lightbox-stage{border-radius:5px}}
@media(max-width:370px){#lightbox .controls{gap:4px}#lightbox .controls button,#lightbox .controls a{padding:10px 9px}}
@media(prefers-reduced-transparency:reduce){.viewer-surface,.glass-morph{background:#141a20!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.viewer-veil{background:#080b0ef5}}
@media(prefers-contrast:more){.viewer-surface,.glass-morph,#lightbox button,#lightbox .controls a{border-color:#fff}#lightbox-count,#lightbox .lightbox-bar{color:#fff}}
@media(prefers-reduced-motion:reduce){#lightbox button,#lightbox .controls a{transition:none}.glass-morph{will-change:auto}}
