@layer components{.video-modal{width:min(24rem, calc(100vw - 2 * var(--page-margin)));background-color:var(--color-background);max-height:92dvh;color:var(--color-foreground);opacity:0;transition:opacity var(--transition-base), display var(--transition-base) allow-discrete, overlay var(--transition-base) allow-discrete;border:none;flex-direction:column;margin:auto;padding:0;position:fixed;inset:0;overflow:hidden}.video-modal[open]{opacity:1;display:flex}@starting-style{.video-modal[open]{opacity:0}}.video-modal::backdrop{opacity:0;transition:opacity var(--transition-base), display var(--transition-base) allow-discrete, overlay var(--transition-base) allow-discrete;background-color:#0000008c}.video-modal[open]::backdrop{opacity:1}@starting-style{.video-modal[open]::backdrop{opacity:0}}.video-modal__close{z-index:1;border-radius:var(--radius-pill);color:#fff;cursor:pointer;background-color:#00000073;border:none;place-items:center;width:2rem;height:2rem;padding:0;display:grid;position:absolute;inset-block-start:var(--space-sm);inset-inline-end:var(--space-sm)}.video-modal__close svg{width:.75rem}.video-modal__media{background-color:#000;flex:auto;min-height:0}.video-modal__video{object-fit:contain;width:100%;height:100%;max-height:calc(92dvh - 4.5rem);display:block}.video-modal__product{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);text-decoration:none;display:flex}.video-modal__product-image{object-fit:cover;border-radius:var(--style-border-radius-cards,0);width:3rem;height:3rem}.video-modal__product-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.video-modal__product-title{font-size:var(--type-sm);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.video-modal__product-price{font-size:var(--type-sm)}.video-modal__product-cta{font-size:var(--type-xs);text-underline-offset:.2em;flex-shrink:0;text-decoration:underline}@media (width<=47.9375rem){.video-modal{opacity:1;width:100vw;max-width:100vw;transition:translate var(--duration-drawer) var(--ease-swift), display var(--duration-drawer) var(--ease-swift) allow-discrete, overlay var(--duration-drawer) var(--ease-swift) allow-discrete;margin:auto 0 0;translate:0 100%}.video-modal[open]{translate:0}@starting-style{.video-modal[open]{translate:0 100%}}}}
