.template-product product-media.studio-product-gallery{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:start}.template-product product-media>*{min-width:0;margin:0}.template-product product-media .studio-product-main-media{position:relative;aspect-ratio:var(--product-media-ratio, 1);min-height:0;border-radius:var(--media-radius, 16px);background:color-mix(in srgb,var(--butter) 65%,var(--surface));isolation:isolate;touch-action:pan-y pinch-zoom}.template-product product-media[data-media-ready] .studio-product-main-media{cursor:zoom-in}.template-product product-media .studio-product-main-media[data-video-active]{cursor:auto;touch-action:auto}.pdp-product-video{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:inherit}.pdp-product-video video{display:block;width:100%;height:100%;object-fit:contain}.pdp-video-thumb{position:relative}.pdp-video-play{position:absolute;top:calc(50% - 16px);left:calc(50% - 13px);display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#465649e8;color:#fff;pointer-events:none}.pdp-video-play svg{display:block;width:16px;height:16px;fill:currentColor}.template-product product-media .studio-product-main-media :is(img,canvas,pet-preview){display:block;width:100%;height:100%;object-fit:contain;min-height:0}.template-product product-media .studio-product-main-media [hidden],.template-product product-media [hidden],.pdp-image-dialog [hidden]{display:none!important}.pdp-media-placeholder{width:65%;height:65%;opacity:.35}.template-product product-media .studio-product-thumbs{margin:0;padding:2px 0 5px;gap:8px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;overscroll-behavior-x:contain;scrollbar-width:thin}.template-product product-media .studio-product-thumbs button{flex:0 0 72px;width:72px;height:76px;padding:4px 4px 8px;border:0;border-radius:10px;scroll-snap-align:start;background:transparent;transition:background-color .18s ease}.template-product product-media .studio-product-thumbs img{width:100%;height:100%;object-fit:contain;border-radius:7px;opacity:.78;transition:opacity .18s ease}.template-product product-media .studio-product-thumbs button:hover img,.template-product product-media .studio-product-thumbs button[aria-pressed=true] img{opacity:1}.template-product product-media .studio-product-thumbs button[aria-pressed=true]{background:var(--sky)}.template-product product-media .studio-product-thumbs button[aria-pressed=true]:after{width:20px;height:2px;left:calc(50% - 10px);bottom:2px;background:var(--button)}.template-product product-media .photo-charm-preview-thumb{font-size:11px;line-height:1.4;color:var(--button)}.pdp-media-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px}.pdp-media-pagination,.pdp-image-dialog-navigation{display:flex;align-items:center;gap:6px}.pdp-media-count{min-width:52px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}.pdp-media-arrow{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;padding:0;background:transparent;border:0;border-radius:50%;color:var(--button);transition:background-color .18s ease}.pdp-media-arrow .studio-icon{width:17px;height:17px}.pdp-media-arrow[data-media-step="-1"] svg{transform:rotate(180deg)}.template-product product-media .pdp-zoom{position:static;display:inline-flex;min-height:40px;padding:8px 13px;border:0;border-radius:24px;box-shadow:none;background:var(--surface);color:var(--button);font-size:12px}.template-product :is(.pdp-media-arrow,product-media .pdp-zoom):hover{background:var(--sky)}.template-product :is(.pdp-media-arrow,product-media .pdp-zoom,.pdp-image-dialog button):focus{outline:none;box-shadow:none}.template-product :is(.pdp-media-arrow,product-media .pdp-zoom,.pdp-image-dialog button):focus-visible{outline:none;background:var(--sky);box-shadow:inset 0 -2px var(--button)}.template-product product-media .studio-product-thumbs button:focus-visible{outline:none;background:var(--sky);box-shadow:inset 0 -3px var(--button)}.template-product product-media .studio-preview-caption{text-align:left}.template-product product-media .studio-preview-caption strong{font-family:var(--font-body);font-size:14px;line-height:1.6}.template-product product-media :is(.studio-preview-help,.photo-charm-gallery-note){font-size:12px;line-height:1.65;color:var(--muted)}.template-product product-media :is(.studio-preview-label,.photo-charm-preview-badge){top:14px;bottom:auto;left:14px;right:auto;padding:7px 11px;border:0;border-radius:20px;font-size:11px;line-height:1.4;background:var(--surface);color:var(--button)}.pdp-viewer-open{overflow:hidden}.pdp-image-dialog{width:min(1120px,calc(100vw - 64px));max-width:none;max-height:calc(100dvh - 40px);border-radius:18px}.pdp-image-dialog::backdrop{background:#252c27c9;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.pdp-image-dialog-bar{padding:10px 16px 10px 24px;border:0}.pdp-image-dialog-bar>span{font-size:13px;line-height:1.5;max-width:85%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pdp-image-dialog-bar button{flex:0 0 44px;background:var(--paper);color:var(--button)}.pdp-image-dialog-body{padding:0 24px;touch-action:pan-y pinch-zoom}.pdp-image-dialog-body :is(img,canvas){display:block;width:100%;height:min(72dvh,850px);object-fit:contain;border-radius:10px}.pdp-image-dialog-navigation{justify-content:center;padding:8px 20px 12px}@media(min-width:990px){.template-product product-media:has(.studio-product-thumbs){grid-template-columns:72px minmax(0,1fr);column-gap:14px}.template-product product-media:has(.studio-product-thumbs) .studio-product-main-media{grid-column:2;grid-row:1}.template-product product-media:has(.studio-product-thumbs) .studio-product-thumbs{grid-column:1;grid-row:1;flex-direction:column;height:0;min-height:100%;padding:0 0 4px;overflow-x:hidden;overflow-y:auto;scroll-snap-type:y proximity;overscroll-behavior-y:contain}.template-product product-media:has(.studio-product-thumbs) .studio-product-thumbs button{flex-basis:76px}.template-product product-media:has(.studio-product-thumbs) :is(.pdp-media-tools,.photo-charm-gallery-note){grid-column:2}}@media(max-width:749px){.template-product product-media.studio-product-gallery{gap:10px}.template-product product-media .studio-product-thumbs button{flex-basis:64px;width:64px;height:68px}.pdp-media-arrow{width:44px;height:44px;min-width:44px}.template-product product-media .pdp-zoom{min-height:44px}.pdp-image-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:14px}.pdp-image-dialog-bar{padding:10px 10px 10px 16px}.pdp-image-dialog-body{padding:0 10px}.pdp-image-dialog-body :is(img,canvas){height:auto;max-height:calc(100dvh - 180px)}}@media(prefers-reduced-motion:reduce){.template-product product-media :is(button,img){transition:none}}
/*# sourceMappingURL=/cdn/shop/t/24/assets/product-media.css.map */
