.product-image-open { display:block; border:0; padding:0; background:transparent; width:100%; cursor:zoom-in; }
.product-image-open img { display:block; width:100%; height:auto; }
.product-image-warning { display:block; border:1px solid #bbb; padding:16px; font-size:14px; }
.product-lightbox { width:min(1440px,calc(100vw - 48px)); height:calc(100svh - 48px); max-width:none; max-height:none; margin:auto; padding:12px; border:1px solid #ffffff50; border-radius:20px; background:#f5f7fa; color:#182334; box-shadow:0 24px 100px #0005; overflow:hidden; }
.product-lightbox[open] { display:grid; grid-template-rows:44px minmax(0,1fr) 56px; gap:12px; }
.product-lightbox::backdrop { background:#101827c9; backdrop-filter:blur(8px); }
body:has(.product-lightbox[open]) { overflow:hidden; }
.product-lightbox-top { display:flex; justify-content:flex-end; }
.product-lightbox button { display:grid; place-items:center; flex-shrink:0; width:44px; height:44px; padding:0; border:1px solid #dce2eb; border-radius:50%; background:#fff; color:#26364e; cursor:pointer; transition:background .15s,box-shadow .15s; }
.product-lightbox button:hover { background:#e7edf7; box-shadow:0 2px 8px #18233412; }
.product-lightbox button:focus-visible { outline:3px solid #5578d4; outline-offset:3px; }
.product-lightbox button:disabled { opacity:.35; cursor:default; box-shadow:none; }
.product-lightbox svg { width:21px; height:21px; pointer-events:none; }
.product-lightbox-close { box-shadow:0 2px 8px #1823340d; }
.product-lightbox-viewport { min-width:0; min-height:0; overflow:auto; overscroll-behavior:contain; border-radius:10px; }
.product-lightbox-canvas { display:flex; align-items:center; justify-content:center; }
.product-lightbox .product-lightbox-image { display:block; border:0; border-radius:0; background:transparent; cursor:zoom-in; padding:0; touch-action:pan-x pan-y pinch-zoom; }
.product-lightbox .product-lightbox-image:hover { background:transparent; box-shadow:none; }
.product-lightbox img { display:block; width:100%; height:100%; max-width:none; max-height:none; object-fit:contain; margin:0; user-select:none; }
.product-lightbox.is-zoomed .product-lightbox-image { cursor:grab; }
.product-lightbox.is-dragging .product-lightbox-image { cursor:grabbing; }
.product-lightbox-tools { display:flex; align-items:center; justify-self:center; gap:6px; padding:5px; border:1px solid #dce2eb; border-radius:32px; background:#fff; box-shadow:0 4px 16px #18233408; }
.product-lightbox-tools button { border:0; }
.product-lightbox-tools output { min-width:52px; text-align:center; font:600 12px/1.2 var(--font-body); font-variant-numeric:tabular-nums; }
@media(max-width:600px) { .product-lightbox { width:calc(100vw - 20px); height:calc(100svh - 24px); padding:8px; border-radius:14px; }.product-lightbox[open] { gap:8px; } }
@media(prefers-reduced-motion:reduce) { .product-lightbox button { transition:none; } }