body.photo-viewing{overflow:hidden}
#viewer{position:fixed;inset:0;width:100vw;max-width:none;height:100svh;max-height:none;margin:0;padding:0;border:0;background:#050607;overflow:hidden;color:#f4f1ec}
#viewer[open]{display:grid;grid-template-rows:minmax(0,1fr) auto auto;padding:72px 0 24px;animation:viewer-enter .25s ease-out}
#viewer::backdrop{background:#050607}
#viewer .viewer-stage{position:relative;width:100%;height:100%;overflow:auto;overscroll-behavior:contain;align-content:center;padding:12px;cursor:zoom-in}
#viewer .viewer-stage.is-zoomed{align-content:start;cursor:grab;touch-action:pan-x pan-y}
#viewer .viewer-stage.is-zoomed:active{cursor:grabbing}
#viewer img{display:block;max-width:none;max-height:none;object-fit:contain;margin:auto;user-select:none}
#viewer p{font-size:clamp(13px,1.3vw,18px);line-height:1.8;margin:18px 24px 6px;text-align:center;letter-spacing:.06em}
#viewer .viewer-hint{font-size:10px;letter-spacing:.1em;text-align:center;color:#959a9e;line-height:1.8}
#viewer .close,#viewer .viewer-zoom{min-height:44px;border:1px solid #565b60;background:#111316;color:#f4f1ec;padding:10px 18px;font-size:11px;letter-spacing:.08em;cursor:pointer}
#viewer .close{position:absolute;top:14px;right:24px;z-index:3}
#viewer .viewer-tools{position:absolute;top:14px;left:24px;z-index:3}
.image-open .zoom-label{border:1px solid #777b7d;transition:background .2s,transform .2s}
.image-open:hover .zoom-label{background:#101114;transform:translateY(-3px)}
@keyframes viewer-enter{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}
@media(max-width:700px){#viewer[open]{padding:66px 0 max(18px,env(safe-area-inset-bottom))}#viewer .close{right:12px;top:10px}#viewer .viewer-tools{left:12px;top:10px}#viewer p{margin-top:14px}#viewer .viewer-stage{padding:8px}}
@media(prefers-reduced-motion:reduce){#viewer[open]{animation:none}}