.demo-video-global-entry{position:absolute;top:-1px;right:calc(100% + 12px);display:flex;justify-content:flex-end}.demo-video-entry{display:inline-flex;align-items:center;flex:0 0 auto;height:38px;width:38px;box-sizing:border-box;padding:0;border-radius:9999px;background:#fff;border:1px solid rgba(226,232,240,.95);box-shadow:0 2px 8px #0f172a0d;cursor:pointer;overflow:hidden;white-space:nowrap;position:relative;transition:width .36s cubic-bezier(.16,1,.3,1),border-color .25s ease,box-shadow .25s ease,background-color .25s ease,transform .25s ease}.demo-video-entry:hover,.demo-video-entry:focus-visible{width:var(--demo-video-expanded-width, 118px);border-color:#a855f773;background:#fff;box-shadow:0 6px 20px -2px #a855f738,0 0 0 1px #ec489926;transform:translateY(-1px)}.demo-video-entry:focus-visible{outline:2px solid #a855f7;outline-offset:3px}.demo-video-icon-box{width:36px;height:36px;flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative}.demo-video-icon-inner{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,#a855f7 0%,#ec4899 100%);display:flex;align-items:center;justify-content:center;color:#fff;transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s ease;box-shadow:0 2px 6px #a855f759}.demo-video-entry:hover .demo-video-icon-inner,.demo-video-entry:focus-visible .demo-video-icon-inner{transform:scale(1.08);box-shadow:0 3px 10px #a855f780}.demo-video-icon-inner svg{width:10px;height:10px;fill:#fff;margin-left:1.5px}.demo-video-label-box{display:flex;align-items:center;opacity:0;transform:translate(6px);transition:opacity .25s cubic-bezier(.16,1,.3,1) .05s,transform .3s cubic-bezier(.16,1,.3,1) .05s;padding-right:12px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.demo-video-entry:hover .demo-video-label-box,.demo-video-entry:focus-visible .demo-video-label-box{opacity:1;transform:translate(0)}.demo-video-label{font-size:13px;font-weight:700;line-height:normal;background:linear-gradient(135deg,#7e22ce 0%,#be185d 100%);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.01em;white-space:nowrap}.demo-video-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;background:rgba(15,23,42,.82);backdrop-filter:blur(16px)}.demo-video-backdrop[data-state=open]{animation:demo-video-fade-in .3s cubic-bezier(.16,1,.3,1)}.demo-video-modal{position:fixed;left:50%;top:50%;z-index:2001;width:min(960px,calc(100vw - 48px),calc((100dvh - 112px) * 16 / 9));transform:translate(-50%,-50%);background:#000;color:#fff;border:1px solid rgba(255,255,255,.15);border-radius:16px;box-shadow:0 25px 60px -15px #000000b3;outline:none}.demo-video-modal[data-state=open]{animation:demo-video-card-in .3s cubic-bezier(.16,1,.3,1)}.demo-video-modal[data-state=closed]{animation:demo-video-card-out .3s cubic-bezier(.16,1,.3,1)}.demo-video-backdrop[data-state=closed]{animation:demo-video-fade-out .3s cubic-bezier(.16,1,.3,1)}.demo-video-close{position:absolute;right:0;top:-44px;width:32px;height:32px;border-radius:50%;padding:0;background:rgba(255,255,255,.12);border:none;color:#e2e8f0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.demo-video-close:hover{background:rgba(255,255,255,.2);color:#fff}.demo-video-player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:inherit;overflow:hidden}.demo-video-player video,.demo-video-player iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;-o-object-fit:contain;object-fit:contain;border:none;display:block}.demo-video-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:#94a3b8}.demo-video-placeholder p{margin:0;font-size:14px}.demo-video-close:focus-visible{outline:2px solid #c084fc;outline-offset:3px}@keyframes demo-video-fade-in{0%{opacity:0}to{opacity:1}}@keyframes demo-video-fade-out{0%{opacity:1}to{opacity:0}}@keyframes demo-video-card-in{0%{opacity:0;transform:translate(-50%,calc(-50% + 10px)) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes demo-video-card-out{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,calc(-50% + 10px)) scale(.95)}}.dark .demo-video-entry{background:#0f172a;border-color:#334155}.dark .demo-video-label{background-image:linear-gradient(135deg,#c084fc,#f472b6)}@media (max-width: 600px){.demo-video-modal{width:min(calc(100vw - 24px),calc((100dvh - 112px) * 16 / 9));border-radius:12px}}@media (prefers-reduced-motion: reduce){.demo-video-entry,.demo-video-icon-inner,.demo-video-label-box{transition:none}.demo-video-modal,.demo-video-backdrop{animation:none!important}}
