.property-lightbox { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; color: #fff; overflow: hidden; }
.property-lightbox::backdrop { background: rgba(0, 0, 0, .88); }
.property-lightbox[open] { display: flex; align-items: center; justify-content: center; }
.property-lightbox figure { margin: 0; display: flex; flex-direction: column; align-items: center; max-width: 90vw; pointer-events: none; }
.lightbox-image { width: auto; height: auto; max-width: 90vw; max-height: calc(90vh - 100px); max-height: calc(90dvh - 100px); object-fit: contain; pointer-events: auto; touch-action: pan-y pinch-zoom; user-select: none; }
.property-lightbox figcaption { max-width: 80vw; padding: 12px 8px; text-align: center; line-height: 1.4; pointer-events: auto; }
.lightbox-counter { display: block; font-size: 13px; margin-bottom: 4px; }
.lightbox-caption { font-size: 14px; }
.property-lightbox button { position: absolute; display: grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 1px solid #aaa; border-radius: 50%; background: rgba(0, 0, 0, .7); color: #fff; font: 38px/1 Arial, sans-serif; cursor: pointer; z-index: 1; touch-action: manipulation; }
.property-lightbox button:hover { background: #253340; }
.property-lightbox button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.lightbox-close { top: max(12px, env(safe-area-inset-top)); right: max(12px, env(safe-area-inset-right)); }
.lightbox-previous { left: max(8px, env(safe-area-inset-left)); top: calc(50% - 28px); }
.lightbox-next { right: max(8px, env(safe-area-inset-right)); top: calc(50% - 28px); }
/* No animations, transitions or smooth scrolling: also respects reduced motion. */