.product-gallery__viewport-wrap{position:relative}.product-explainer-video--on-gallery{position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;pointer-events:none}.product-explainer-video--on-gallery .product-explainer-video__bubble-stack{pointer-events:auto}.product-explainer-video__bubble-stack{position:absolute;top:max(.5rem,env(safe-area-inset-top,0px));inset-inline-end:max(.5rem,env(safe-area-inset-right,0px));display:flex;flex-direction:column;align-items:center;max-width:6rem}.product-explainer-video__trigger{display:block;padding:0;margin:0;border:3px solid rgba(255,255,255,.95);border-radius:50%;width:4.5rem;height:4.5rem;cursor:pointer;background:#00000026;box-shadow:0 4px 18px #00000038;transition:transform .2s ease,box-shadow .2s ease}@media screen and (max-width:767px){.product-explainer-video__trigger{width:3.75rem;height:3.75rem;border-width:2px}}.product-explainer-video__trigger:hover,.product-explainer-video__trigger:focus-visible{transform:scale(1.04);box-shadow:0 6px 22px #00000047}.product-explainer-video__trigger:focus-visible{outline:2px solid currentColor;outline-offset:3px}.product-explainer-video__thumb{position:relative;display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;background:#2a2a2a}.product-explainer-video__thumb-img{width:100%;height:100%;object-fit:cover;display:block}.product-explainer-video__thumb-placeholder--neutral{display:block;width:100%;height:100%;min-height:0;background:linear-gradient(135deg,#3d3d3d,#1a1a1a,#4a4a4a)}.product-explainer-video__play{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#00000047;transition:background .2s ease}.product-explainer-video__trigger:hover .product-explainer-video__play,.product-explainer-video__trigger:focus-visible .product-explainer-video__play{background:#00000061}.product-explainer-video__play .symbol--play{width:1.85rem;height:1.85rem;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}@media screen and (max-width:767px){.product-explainer-video__play .symbol--play{width:1.5rem;height:1.5rem}}.product-explainer-video__play .symbol--play path{fill:#fff}.product-explainer-video__caption{margin:.3125rem 0 0;padding:0 .125rem;font-size:.6875rem;line-height:1.2;letter-spacing:.01em;text-align:center;color:#fff;max-width:5.5rem;text-wrap:balance;text-shadow:0 1px 2px rgba(0,0,0,.85),0 0 8px rgba(0,0,0,.45)}@media screen and (max-width:767px){.product-explainer-video__caption{font-size:.625rem}}modal-box.modal.product-explainer-video__modal{z-index:2147483000;background:#000000d1;align-items:center;justify-content:center;padding:max(.75rem,env(safe-area-inset-top)) max(.75rem,env(safe-area-inset-right)) max(.75rem,env(safe-area-inset-bottom)) max(.75rem,env(safe-area-inset-left));box-sizing:border-box}modal-box.modal.product-explainer-video__modal .modal-background{z-index:0;background:transparent;cursor:pointer}.product-explainer-video__modal-scaffold{position:relative;z-index:2;width:100%;max-width:min(1100px,100%);max-height:min(92vh,100%);display:flex;align-items:center;justify-content:center;pointer-events:none}.product-explainer-video__modal-panel.modal-content{position:relative;pointer-events:auto;width:100%;max-width:100%;margin:0;padding:2.75rem .75rem .75rem;background:var(--color-background-main);border-radius:var(--border-radius-cards, .5rem);max-height:min(90vh,100%);overflow:auto;display:flex;flex-direction:column;gap:0}.product-explainer-video__modal-close.modal-close{position:absolute;top:.5rem;inset-inline-end:.5rem;z-index:3;margin:0}.product-explainer-video__player-wrap{position:relative;width:100%;aspect-ratio:16 / 9;background:#000;border-radius:var(--border-radius-cards, .35rem);overflow:hidden}.product-explainer-video__video{display:block;width:100%;height:100%;object-fit:contain}@media screen and (max-width:767px){modal-box.modal.product-explainer-video__modal .product-explainer-video__modal-scaffold{max-height:none}modal-box.modal.product-explainer-video__modal .product-explainer-video__modal-panel.modal-content{max-height:fit-content;padding:2.5rem .5rem .5rem}}
/*# sourceMappingURL=/cdn/shop/t/74/assets/component-product-explainer-video.css.map */