.vcx-wrap{--vcp-r: 20px;--vcp-c: #fff;--vcp-a: #6c5ce7;--vcp-ratio: 16 / 9;--vcp-pos: 50%;--vcp-lw: 3px;--vcp-ls: 220px;--vcp-fb: none;--vcp-fa: none;position: relative;width: 100%;max-width: var(--vcp-mw,none);margin-left: auto;margin-right: auto;font-family: inherit}.vcx-wrap *,.vcx-wrap *::before,.vcx-wrap *::after{box-sizing: border-box}.vcx-frame{position: relative;border-radius: var(--vcp-r)}.vcx-stage,.vcx-pane{position: relative;overflow: hidden;aspect-ratio: var(--vcp-ratio);border-radius: var(--vcp-r);background: #0e0d24;-webkit-user-select: none;user-select: none;touch-action: pan-y;isolation: isolate}.vcp-vertical .vcx-stage{touch-action: pan-x}.vcx-m-slider .vcx-stage{cursor: ew-resize}.vcp-vertical.vcx-m-slider .vcx-stage{cursor: ns-resize}.vcx-l{position: absolute;inset: 0;overflow: hidden}.ultrakit-vcp-media{position: absolute;inset: 0;display: block;width: 100% !important;height: 100% !important;max-width: none !important;margin: 0 !important;object-fit: cover;border-radius: 0 !important;pointer-events: none}.vcx-l.is-before .ultrakit-vcp-media{filter: var(--vcp-fb)}.vcx-l.is-after .ultrakit-vcp-media{filter: var(--vcp-fa)}.vcx-kb .ultrakit-vcp-media{animation: vcxKb 18s ease-in-out infinite alternate}@keyframes vcxKb{from{transform: scale(1.02) translate(0,0)}to{transform: scale(1.14) translate(-2%,-1.5%)}}.vcx-m-slider .vcx-l.is-before{clip-path: inset(0 calc(100% - var(--vcp-pos)) 0 0)}.vcp-vertical.vcx-m-slider .vcx-l.is-before{clip-path: inset(0 0 calc(100% - var(--vcp-pos)) 0)}.vcx-handle{position: absolute;top: 0;bottom: 0;left: var(--vcp-pos);z-index: 4;width: 0;outline: none}.vcx-handle::before{content: "";position: absolute;top: 0;bottom: 0;left: calc(var(--vcp-lw) / -2);width: var(--vcp-lw);background: var(--vcp-c);box-shadow: 0 0 14px rgba(0,0,0,.35)}.vcp-vertical .vcx-handle{top: var(--vcp-pos);bottom: auto;left: 0;right: 0;width: auto;height: 0}.vcp-vertical .vcx-handle::before{top: calc(var(--vcp-lw) / -2);bottom: auto;left: 0;right: 0;width: auto;height: var(--vcp-lw)}.vcx-knob{position: absolute;top: 50%;left: 0;display: grid;place-items: center;width: 52px;height: 52px;border-radius: 50%;background: var(--vcp-c);color: #16162a;box-shadow: 0 10px 30px rgba(0,0,0,.35);transform: translate(-50%,-50%);transition: transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s}.vcp-vertical .vcx-knob{top: 0;left: 50%}.vcp-vertical .vcx-knob svg{transform: rotate(90deg)}.vcx-handle:focus-visible .vcx-knob,.is-dragging .vcx-knob{transform: translate(-50%,-50%) scale(1.12);box-shadow: 0 0 0 6px color-mix(in srgb,var(--vcp-a) 45%,transparent),0 10px 30px rgba(0,0,0,.35)}.vcp-h-glass .vcx-knob{background: rgba(255,255,255,.22);color: #fff;border: 1.5px solid rgba(255,255,255,.7);-webkit-backdrop-filter: blur(10px);backdrop-filter: blur(10px)}.vcp-h-pill .vcx-knob{width: 22px;height: 64px;border-radius: 99px}.vcp-h-pill .vcx-knob svg{display: none}.vcp-vertical.vcp-h-pill .vcx-knob{width: 64px;height: 22px}.vcp-h-line .vcx-knob{width: 14px;height: 14px;opacity: 0}.vcp-h-diamond .vcx-knob{width: 40px;height: 40px;border-radius: 8px;transform: translate(-50%,-50%) rotate(45deg)}.vcp-h-diamond .vcx-knob svg{transform: rotate(-45deg)}.vcp-h-diamond.is-dragging .vcx-knob,.vcp-h-diamond .vcx-handle:focus-visible .vcx-knob{transform: translate(-50%,-50%) rotate(45deg) scale(1.12)}.vcp-h-label .vcx-knob{width: auto;height: 34px;padding: 0 16px;border-radius: 99px;background: var(--vcp-a);color: #fff}.vcp-h-label .vcx-knob em{font-size: 12px;font-style: normal;font-weight: 800;letter-spacing: .12em;text-transform: uppercase}.vcp-h-split .vcx-knob{width: 70px;background: transparent;box-shadow: none;color: var(--vcp-c);filter: drop-shadow(0 2px 6px rgba(0,0,0,.6))}.vcp-h-split .vcx-knob svg{width: 34px;height: 34px}.ultrakit-vcp-label{position: absolute;top: 16px;z-index: 3;padding: 7px 13px;border-radius: 99px;color: #fff;font-size: 12px;font-weight: 800;letter-spacing: .1em;text-transform: uppercase;pointer-events: none;transition: opacity .3s}.ultrakit-vcp-label.is-l1{left: 16px}.ultrakit-vcp-label.is-l2{right: 16px}.vcx-lp-bottom .ultrakit-vcp-label{top: auto;bottom: 16px}.has-video.vcx-lp-bottom .vcx-stage .ultrakit-vcp-label{bottom: 70px}.vcp-vertical .ultrakit-vcp-label.is-l2{top: auto;bottom: 16px;left: 16px;right: auto}.vcx-lb-glass .ultrakit-vcp-label{background: rgba(255,255,255,.18);border: 1px solid rgba(255,255,255,.35);-webkit-backdrop-filter: blur(10px);backdrop-filter: blur(10px)}.vcx-lb-solid .ultrakit-vcp-label{background: rgba(10,10,28,.72)}.vcx-lb-accent .ultrakit-vcp-label{background: var(--vcp-a)}.vcx-lb-accent .ultrakit-vcp-label.is-l1{background: rgba(10,10,28,.72)}.vcx-lb-hover .ultrakit-vcp-label{background: rgba(10,10,28,.65);opacity: 0}.vcx-lb-hover .vcx-stage:hover .ultrakit-vcp-label,.vcx-lb-hover .vcx-pane:hover .ultrakit-vcp-label{opacity: 1}.vcx-lb-none .ultrakit-vcp-label{display: none}.vcx-m-slider:not(.vcp-vertical) .ultrakit-vcp-label.is-l1{opacity: clamp(0,(var(--vcp-pos-n,50) - 12) / 10,1)}.vcx-m-slider:not(.vcp-vertical) .ultrakit-vcp-label.is-l2{opacity: clamp(0,(88 - var(--vcp-pos-n,50)) / 10,1)}.vcx-m-lens .vcx-stage{cursor: none}.vcx-m-lens .vcx-l.is-after{z-index: 2;-webkit-mask-image: radial-gradient(circle calc(var(--vcp-ls) / 2) at var(--lx,50%) var(--ly,50%),#000 97%,transparent 100%);mask-image: radial-gradient(circle calc(var(--vcp-ls) / 2) at var(--lx,50%) var(--ly,50%),#000 97%,transparent 100%)}.vcx-m-lens .vcx-l.is-before{z-index: 1}.vcx-ring{position: absolute;left: var(--lx,50%);top: var(--ly,50%);z-index: 3;width: var(--vcp-ls);height: var(--vcp-ls);border: var(--vcp-lw) solid var(--vcp-c);border-radius: 50%;box-shadow: 0 0 0 1px rgba(0,0,0,.15),0 12px 40px rgba(0,0,0,.35);transform: translate(-50%,-50%);pointer-events: none}.vcx-m-lens .ultrakit-vcp-label{z-index: 4}.vcx-m-toggle .vcx-l.is-before{z-index: 2;opacity: 0;transition: opacity .6s ease}.vcx-m-toggle.show-before .vcx-l.is-before{opacity: 1}.vcx-m-toggle .ultrakit-vcp-label{display: none}.vcx-toggle{position: absolute;left: 50%;bottom: 18px;z-index: 4;display: flex;width: max-content;white-space: nowrap;padding: 4px;border-radius: 99px;background: rgba(10,10,28,.55);transform: translateX(-50%);-webkit-backdrop-filter: blur(10px);backdrop-filter: blur(10px)}.has-video .vcx-toggle{bottom: auto;top: 18px}.vcx-toggle i{position: absolute;top: 4px;bottom: 4px;left: 4px;width: calc(50% - 4px);border-radius: 99px;background: var(--vcp-a);transition: transform .45s cubic-bezier(.34,1.3,.64,1);transform: translateX(100%)}.show-before .vcx-toggle i{transform: none}.vcx-wrap .vcx-tb{position: relative;z-index: 1;min-width: 96px;margin: 0;padding: 9px 18px;border: 0;border-radius: 99px;background: transparent;color: #fff !important;font: 800 12.5px/1 inherit;font-family: inherit;letter-spacing: .08em;text-transform: uppercase;cursor: pointer}.vcx-side{display: grid;grid-template-columns: 1fr 1fr;gap: 12px}.vcp-vertical .vcx-side{grid-template-columns: 1fr}.vcx-pane .ultrakit-vcp-label.is-l2{right: auto;left: 16px}.vcx-wrap .vcx-play{position: absolute;left: 16px;bottom: 16px;z-index: 5;display: grid;place-items: center;width: 46px;height: 46px;margin: 0;padding: 0;border: 0;border-radius: 50%;background: rgba(255,255,255,.92);color: #16162a !important;box-shadow: 0 8px 24px rgba(0,0,0,.3);cursor: pointer;transition: transform .2s}.vcx-wrap .vcx-play:hover{transform: scale(1.08)}.vcx-play .i-pause,.is-playing .vcx-play .i-play,.vcx-pp .i-pause,.is-playing .vcx-pp .i-play,.vcx-mute .i-vol,.is-unmuted .vcx-mute .i-mute{display: none}.is-playing .vcx-play .i-pause,.is-playing .vcx-pp .i-pause,.is-unmuted .vcx-mute .i-vol{display: inline}.vcx-play span,.vcx-cb span{display: inline-flex}.vcx-bar{position: absolute;left: 12px;right: 12px;bottom: 12px;z-index: 5;display: flex;align-items: center;gap: 8px;padding: 7px 10px;border-radius: 14px;background: rgba(10,10,28,.6);color: #fff;-webkit-backdrop-filter: blur(12px);backdrop-filter: blur(12px);transition: opacity .3s,transform .3s}.vcx-m-side .vcx-bar{position: relative;left: auto;right: auto;bottom: auto;margin-top: 12px;background: #16162a}.has-video:not(.vcx-m-side) .vcx-frame:not(:hover):not(:focus-within) .vcx-bar{opacity: .0;transform: translateY(6px)}.has-video:not(.is-playing):not(.vcx-m-side) .vcx-frame .vcx-bar{opacity: 1;transform: none}.vcx-wrap .vcx-cb{display: inline-grid;place-items: center;min-width: 34px;height: 34px;margin: 0;padding: 0 6px;border: 0;border-radius: 9px;background: transparent;color: #fff !important;font: 800 12.5px/1 inherit;font-family: inherit;cursor: pointer}.vcx-wrap .vcx-cb:hover{background: rgba(255,255,255,.14)}.vcx-time,.vcx-dur{flex: none;min-width: 34px;font: 600 12px/1 ui-monospace,Menlo,monospace;opacity: .85}.vcx-wrap .vcx-seek{flex: 1;min-width: 40px;height: 4px;margin: 0;padding: 0;border: 0;border-radius: 4px;background: linear-gradient(90deg,var(--vcp-a) var(--vcx-pr,0%),rgba(255,255,255,.28) var(--vcx-pr,0%));-webkit-appearance: none;appearance: none;cursor: pointer}.vcx-seek::-webkit-slider-thumb{width: 13px;height: 13px;border-radius: 50%;background: #fff;box-shadow: 0 0 0 3px color-mix(in srgb,var(--vcp-a) 50%,transparent);-webkit-appearance: none;appearance: none}.vcx-seek::-moz-range-thumb{width: 13px;height: 13px;border: 0;border-radius: 50%;background: #fff}.vcx-wrap .vcx-cb:focus-visible,.vcx-wrap .vcx-seek:focus-visible,.vcx-wrap .vcx-tb:focus-visible,.vcx-wrap .vcx-play:focus-visible,.vcx-stage:focus-visible{outline: 2px solid var(--vcp-a);outline-offset: 2px}.vcx-fr-shadow .vcx-stage,.vcx-fr-shadow .vcx-pane{box-shadow: 0 30px 70px -30px rgba(15,15,50,.55)}.vcx-fr-glow .vcx-stage,.vcx-fr-glow .vcx-pane{box-shadow: 0 0 0 1px color-mix(in srgb,var(--vcp-a) 50%,transparent),0 30px 80px -20px color-mix(in srgb,var(--vcp-a) 70%,transparent)}.vcx-fr-browser .vcx-frame{padding: 0 8px 8px;border-radius: calc(var(--vcp-r) + 6px);background: #1c1b36;box-shadow: 0 30px 70px -30px rgba(15,15,50,.6)}.vcx-chrome{display: flex;align-items: center;gap: 7px;height: 38px;padding: 0 8px}.vcx-chrome i{width: 11px;height: 11px;border-radius: 50%;background: #ff5f57}.vcx-chrome i:nth-child(2){background: #febc2e}.vcx-chrome i:nth-child(3){background: #28c840}.vcx-chrome span{flex: 1;max-width: 360px;height: 22px;margin: 0 auto;border-radius: 7px;background: rgba(255,255,255,.08)}.vcx-fr-browser .vcx-stage{border-radius: calc(var(--vcp-r) - 4px)}.vcx-fr-phone{max-width: min(var(--vcp-mw,380px),380px)}.vcx-fr-phone .vcx-frame{padding: 12px;border-radius: 48px;background: #111;box-shadow: inset 0 0 0 2px #333,0 40px 80px -30px rgba(10,10,40,.6)}.vcx-fr-phone .vcx-frame::before{content: "";position: absolute;top: 20px;left: 50%;z-index: 6;width: 90px;height: 24px;border-radius: 99px;background: #000;transform: translateX(-50%)}.vcx-fr-phone .vcx-stage{border-radius: 36px}.vcx-caption{margin: 14px 0 0;font-size: 13.5px;line-height: 1.5;text-align: center;opacity: .7}.ultrakit-vcp-demo{position: absolute;inset: 0;overflow: hidden}.ultrakit-vcp-demo.is-before{background: linear-gradient(135deg,#3c3c58,#1c1c30);filter: grayscale(1) contrast(.9)}.ultrakit-vcp-demo.is-after{background: linear-gradient(135deg,#6c5ce7,#00cec9)}.ultrakit-vcp-demo span{position: absolute;border-radius: 50%;background: rgba(255,255,255,.35);animation: ukVcpDemo 5s ease-in-out infinite}.ultrakit-vcp-demo span:nth-child(1){width: 120px;height: 120px;left: 12%;top: 18%}.ultrakit-vcp-demo span:nth-child(2){width: 200px;height: 200px;right: 10%;bottom: 8%;animation-delay: -1.5s;background: rgba(255,255,255,.2)}.ultrakit-vcp-demo span:nth-child(3){width: 60px;height: 60px;left: 50%;top: 55%;animation-delay: -3s}@keyframes ukVcpDemo{50%{transform: translate(30px,-20px) scale(1.15)}}@media (max-width: 767px){.vcx-knob{width: 44px;height: 44px}.vcx-time,.vcx-dur,.vcx-speed{display: none}.vcx-side{grid-template-columns: 1fr;gap: 8px}.ultrakit-vcp-label{top: 10px;padding: 5px 10px;font-size: 10.5px}.ultrakit-vcp-label.is-l1{left: 10px}.ultrakit-vcp-label.is-l2{right: 10px}.has-video:not(.vcx-m-side) .vcx-frame .vcx-bar{opacity: 1;transform: none}}@media (prefers-reduced-motion: reduce){.vcx-kb .ultrakit-vcp-media,.ultrakit-vcp-demo span{animation: none}}