.unboxing-gallery { columns: 2; column-gap: 18px; max-width: 900px; margin: auto; }
.unboxing-gallery a { display: block; break-inside: avoid; margin-bottom: 18px; cursor: zoom-in; }
.unboxing-gallery img { display: block; width: 100%; height: auto; }
.unboxing-gallery a:hover img { filter: brightness(1.06); }
.photo-viewer { border: 0; padding: 0; width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; background: transparent; color: white; }
.photo-viewer::backdrop { background: rgb(14 14 20 / 90%); }
.photo-viewer[open] { display: grid; grid-template-columns: 52px minmax(0,1fr) 52px; align-items: center; gap: 10px; }
.photo-viewer figure { margin: 45px 0 15px; pointer-events: none; text-align: center; }
.photo-viewer figure img { display: block; margin: auto; width: auto; height: auto; max-width: 100%; max-height: calc(100dvh - 105px); object-fit: contain; pointer-events: auto; touch-action: pan-y; }
.photo-viewer figcaption { margin-top: 12px; font-size: 14px; }
.photo-viewer button { border: 0; background: rgb(0 0 0 / 45%); color: white; cursor: pointer; font-size: 38px; padding: 0; width: 44px; height: 48px; border-radius: 4px; }
.viewer-close { position: absolute; top: 10px; right: 14px; }
.viewer-prev,.viewer-next { justify-self: center; }
.photo-viewer button:focus-visible,.unboxing-gallery a:focus-visible { outline: 3px solid #efc1d4; outline-offset: 3px; }
body.viewer-open { overflow: hidden; }
@media(max-width:600px) {
 .unboxing-gallery { column-gap: 10px; }
 .unboxing-gallery a { margin-bottom: 10px; }
 .photo-viewer[open] { grid-template-columns: 1fr; gap: 0; }
 .viewer-prev,.viewer-next { position: absolute; top: 50%; }
 .viewer-prev { left: 4px; }
 .viewer-next { right: 4px; }
 .photo-viewer figure { margin-inline: 8px; }
}