mp-product-video{display:block;margin-top:16px}
mp-product-video[hidden],mp-product-video [hidden]{display:none!important}
.product-video-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 0;border:0;background:transparent;color:var(--green);font:inherit;font-size:13px;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.product-video-link .icon{width:18px;height:18px}
.product-video-dock{position:fixed;left:clamp(12px,2vw,28px);bottom:calc(var(--mp-preview-inset,0px) + env(safe-area-inset-bottom,0px) + 18px);z-index:34;width:220px;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--green)}
.product-video-dock__heading,.product-video-dialog>header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 6px 0 10px;min-height:36px;font-size:12px;font-weight:600}
.product-video-dock button,.product-video-dialog button{display:grid;place-items:center;min-width:36px;min-height:36px;padding:6px;border:0;background:transparent;color:inherit;cursor:pointer;font:inherit}
.product-video-dock button .icon,.product-video-dialog button .icon{width:18px;height:18px}
.product-video-dock__frame{position:relative;aspect-ratio:var(--mp-video-ratio,.5625);background:#173e31}
.product-video-dock video{display:block;width:100%;height:100%;object-fit:contain}
.product-video-dock .product-video-dock__expand{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;padding:8px;background:transparent;color:#fff}
.product-video-dock__expand>span{display:inline-flex;align-items:center;gap:4px;padding:5px;border-radius:4px;background:#173e31;font-size:11px}
.product-video-dock .product-video-dock__pause{position:absolute;left:6px;bottom:6px;width:36px;height:36px;border-radius:50%;background:#173e31;color:#fff}
.product-video-dock__pause [data-play-shape],.product-video-dock__pause.is-paused [data-pause-shape]{display:none}
.product-video-dock__pause.is-paused [data-play-shape]{display:block}
.product-video-dock__credit{margin:0;padding:5px 8px;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.product-video-dock__navigation{display:flex;justify-content:space-between;align-items:center;font-size:11px}
.product-video-dock__navigation [data-video-step="-1"] .icon{transform:rotate(90deg)}
.product-video-dock__navigation [data-video-step="1"] .icon{transform:rotate(-90deg)}
.product-video-link:focus-visible,.product-video-dock button:focus-visible,.product-video-dialog button:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.product-video-dock__frame button:focus-visible{outline-color:#fff;outline-offset:-3px}
.product-video-dialog{width:min(440px,calc(100vw - 24px));max-width:100%;max-height:calc(100dvh - 24px);padding:0;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--green);overflow:auto}
.product-video-dialog::backdrop{background:#173e31bf}
.product-video-dialog>header{min-height:48px;padding-inline:16px;font-size:14px}
.product-video-dialog__frame{height:min(70dvh,720px);background:#173e31}
.product-video-dialog video{display:block;width:100%;height:100%;object-fit:contain}
.product-video-dialog__footer{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding-inline:10px;font-size:12px}
.product-video-dialog__footer button{min-height:44px;text-decoration:underline;text-underline-offset:4px}
@media(max-width:749px){.product-video-dock{width:172px;left:12px;bottom:calc(var(--mp-preview-inset,0px) + env(safe-area-inset-bottom,0px) + 12px)}.product-video-dock__heading{font-size:11px}.product-video-dock__expand>span{font-size:10px}.product-video-dock .product-video-dock__pause{width:40px;height:40px}.product-video-dock__navigation button{min-width:40px;min-height:40px}}