.gro-video{display:block;position:relative;width:100%;aspect-ratio:var(--gro-video-aspect, 16 / 9);overflow:hidden;background:#000;container-type:inline-size}.gro-video__activator{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;background:none;display:block;cursor:pointer;-webkit-appearance:none;appearance:none}.gro-video__activator[hidden]{display:none}.gro-video video,.gro-video iframe{margin:0}.gro-video .gro-video__poster{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;margin:0;border-radius:0;object-fit:cover;display:block}.gro-video__poster--placeholder{background:var(--gro-video-placeholder, var(--gro-disabled-bg))}.gro-video .gro-video__activator .gro-video__play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--gro-video-play-size, 64px);height:var(--gro-video-play-size, 64px);border-radius:50%;background:var(--gro-video-play-bg, var(--gro-scrim));color:var(--gro-video-play-fg, var(--gro-on-dark));display:flex;align-items:center;justify-content:center;pointer-events:none;transition:background var(--gro-speed-fast, .15s) var(--gro-ease, ease),transform var(--gro-speed-fast, .15s) var(--gro-ease, ease)}.gro-video__activator:hover .gro-video__play,.gro-video__activator:focus-visible .gro-video__play{background:var(--gro-video-play-bg-hover, var(--gro-accent));transform:translate(-50%,-50%) scale(1.05)}.gro-video__play svg{width:var(--gro-video-play-icon, 26px);height:var(--gro-video-play-icon, 26px);margin-left:3px}.gro-video[data-autoplay=true] .gro-video__play{display:none}.gro-video.gro-video--show-play .gro-video__play{display:flex}.gro-video--ambient .gro-video__activator{background:transparent;z-index:2}.gro-video--ambient .gro-video__activator .gro-video__poster{visibility:hidden}.gro-video--ambient:not(.is-playing) .gro-video__play{display:flex}.gro-video--ambient .gro-video__activator:focus-visible{outline:3px solid var(--gro-focus-on-dark, #fff);outline-offset:-3px}.gro-video--preview .gro-video__activator{background:transparent;z-index:2}.gro-video--preview .gro-video__activator .gro-video__poster{visibility:hidden}.gro-video video,.gro-video iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0;object-fit:cover;display:block}.gro-video__ui{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;font-family:var(--gro-font-primary, sans-serif);color:var(--gro-video-ui-fg, var(--gro-on-dark))}.gro-video__surface{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;display:block;cursor:pointer;-webkit-appearance:none;appearance:none}.gro-video__surface:focus-visible{outline:3px solid var(--gro-focus-on-dark, #fff);outline-offset:-3px}.gro-video__feedback{position:absolute;top:50%;left:50%;width:var(--gro-video-play-size, 64px);height:var(--gro-video-play-size, 64px);transform:translate(-50%,-50%);border-radius:50%;background:var(--gro-video-play-bg, var(--gro-scrim));color:var(--gro-video-play-fg, var(--gro-on-dark));display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:0}.gro-video__feedback svg{width:var(--gro-video-play-icon, 26px);height:var(--gro-video-play-icon, 26px)}.gro-video__feedback.is-flash{animation:gro-video-flash .52s var(--gro-ease, ease) forwards}@keyframes gro-video-flash{0%{opacity:0;transform:translate(-50%,-50%) scale(.82)}28%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(1.22)}}.gro-video__spinner{position:absolute;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:3px solid var(--gro-video-ui-track, var(--gro-border-on-dark));border-top-color:var(--gro-video-ui-fg, var(--gro-on-dark));opacity:0;pointer-events:none}.gro-video.is-buffering .gro-video__spinner{opacity:1;animation:gro-video-spin .8s linear infinite}@keyframes gro-video-spin{to{transform:rotate(360deg)}}.gro-video__bar{position:absolute;right:0;bottom:0;left:0;display:flex;align-items:center;gap:var(--gro-space-2, 8px);padding:var(--gro-space-2, 8px) var(--gro-space-3, 12px) var(--gro-space-3, 12px);background:linear-gradient(to top,var(--gro-video-ui-scrim, color-mix(in srgb, var(--gro-ink) 82%, transparent)),transparent);transition:opacity var(--gro-speed, .25s) var(--gro-ease, ease),transform var(--gro-speed, .25s) var(--gro-ease, ease)}.gro-video.is-idle .gro-video__bar{opacity:0;transform:translateY(12%);pointer-events:none}.gro-video__btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;margin:0;border:0;border-radius:50%;background:transparent;color:var(--gro-video-ui-fg, var(--gro-on-dark));cursor:pointer;-webkit-appearance:none;appearance:none;transition:background var(--gro-speed-fast, .15s) var(--gro-ease, ease)}.gro-video__btn svg{width:20px;height:20px}.gro-video__btn:hover,.gro-video__btn:focus-visible{background:color-mix(in srgb,var(--gro-on-dark) 22%,transparent)}.gro-video__btn:focus-visible{outline:2px solid var(--gro-focus-on-dark, #fff);outline-offset:1px}.gro-video__time{flex:0 0 auto;font-size:var(--gro-text-xs, .75rem);font-variant-numeric:tabular-nums;color:var(--gro-video-ui-fg, var(--gro-on-dark));white-space:nowrap}.gro-video__btn--cc[aria-pressed=false]{opacity:.72}.gro-video__btn--cc[aria-pressed=true]{background:var(--gro-video-ui-accent, var(--gro-on-dark));color:var(--gro-video-ui-on, var(--gro-ink))}.gro-video__btn--cc[aria-pressed=true]:hover,.gro-video__btn--cc[aria-pressed=true]:focus-visible{background:color-mix(in srgb,var(--gro-video-ui-accent, var(--gro-on-dark)) 82%,transparent)}.gro-video video::cue{background:var(--gro-video-ui-scrim, color-mix(in srgb, var(--gro-ink) 82%, transparent));color:var(--gro-video-ui-fg, var(--gro-on-dark))}.gro-video__scrub{flex:1 1 auto;min-width:40px;height:28px;margin:0;padding:0;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none}.gro-video__scrub:focus-visible{outline:2px solid var(--gro-focus-on-dark, #fff);outline-offset:2px;border-radius:var(--gro-radius-sm, 6px)}.gro-video__scrub::-webkit-slider-runnable-track{height:4px;border-radius:999px;background:linear-gradient(to right,var(--gro-video-ui-accent, var(--gro-on-dark)) 0 calc(var(--gro-video-progress, 0) * 1%),transparent 0),linear-gradient(to right,color-mix(in srgb,var(--gro-on-dark) 40%,transparent) 0 calc(var(--gro-video-buffer, 0) * 1%),transparent 0),var(--gro-video-ui-track, var(--gro-border-on-dark))}.gro-video__scrub::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:13px;height:13px;margin-top:-4.5px;border:0;border-radius:50%;background:var(--gro-video-ui-fg, var(--gro-on-dark))}.gro-video__scrub::-moz-range-track{height:4px;border-radius:999px;background:linear-gradient(to right,var(--gro-video-ui-accent, var(--gro-on-dark)) 0 calc(var(--gro-video-progress, 0) * 1%),transparent 0),linear-gradient(to right,color-mix(in srgb,var(--gro-on-dark) 40%,transparent) 0 calc(var(--gro-video-buffer, 0) * 1%),transparent 0),var(--gro-video-ui-track, var(--gro-border-on-dark))}.gro-video__scrub::-moz-range-thumb{width:13px;height:13px;border:0;border-radius:50%;background:var(--gro-video-ui-fg, var(--gro-on-dark))}@container (max-width: 340px){.gro-video__bar{flex-wrap:wrap;row-gap:var(--gro-space-1, 4px)}.gro-video__scrub{order:-1;flex:1 0 100%}.gro-video__bar:has(.gro-video__btn--cc) .gro-video__time{display:none}}@container (max-width: 260px){.gro-video__time{display:none}.gro-video__bar{gap:var(--gro-space-1, 4px)}}@container (max-width: 200px){.gro-video__btn--fs{display:none}}.gro-video:fullscreen,.gro-video:-webkit-full-screen{aspect-ratio:auto;width:100%;height:100%}.gro-video:fullscreen video{object-fit:contain}.gro-video:-webkit-full-screen video{object-fit:contain}@media(prefers-reduced-motion:reduce){.gro-video__bar,.gro-video .gro-video__activator .gro-video__play,.gro-video__btn{transition:none}.gro-video__feedback.is-flash,.gro-video.is-buffering .gro-video__spinner{animation:none}}.gro-article-videos{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:var(--gro-space-4);margin:1.5rem 0}.gro-article-videos>.gro-video{flex:0 1 var(--gro-article-video-basis, 300px);max-width:100%;max-height:var(--gro-article-video-maxh, 68vh)}
/*# sourceMappingURL=/cdn/shop/t/165/assets/gro-video.css.map */