.demo{position:relative;width:100%;height:100%;border-radius:var(--r-lg);overflow:hidden;background:#0a0a0c}.demo__layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .55s ease}.demo__layer.is-on{opacity:1}.demo__layer--after{transform:scale(1.02);transition:opacity .6s ease,transform 1.2s ease}.demo__layer--after.is-on{transform:scale(1)}.demo__canvas{position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 12%,rgba(164,224,44,.08),transparent 62%),linear-gradient(160deg,#131317,#0a0a0c);opacity:0;transition:opacity .4s ease}.demo__canvas.is-on{opacity:1}.demo__thirds{position:absolute;left:34px;right:34px;top:34px;bottom:106px;opacity:.5}.demo__thirds i{position:absolute;background:rgba(255,255,255,.10)}.demo__thirds i:nth-child(1){left:33.33%;top:0;bottom:0;width:1px}.demo__thirds i:nth-child(2){left:66.66%;top:0;bottom:0;width:1px}.demo__thirds i:nth-child(3){top:33.33%;left:0;right:0;height:1px}.demo__thirds i:nth-child(4){top:66.66%;left:0;right:0;height:1px}.demo__cor{position:absolute;width:38px;height:38px;border:2px solid rgba(164,224,44,.75);animation:demoBreathe 3.4s ease-in-out infinite}.demo__cor--tl{left:26px;top:26px;border-right:0;border-bottom:0;border-radius:6px 0 0 0}.demo__cor--tr{right:26px;top:26px;border-left:0;border-bottom:0;border-radius:0 6px 0 0}.demo__cor--bl{left:26px;bottom:98px;border-right:0;border-top:0;border-radius:0 0 0 6px}.demo__cor--br{right:26px;bottom:98px;border-left:0;border-top:0;border-radius:0 0 6px 0}.demo__cross{position:absolute;left:50%;top:40%;width:26px;height:26px;margin:-13px 0 0 -13px;animation:demoBreathe 3.4s ease-in-out infinite}.demo__cross::before,.demo__cross::after{content:"";position:absolute;background:rgba(164,224,44,.7)}.demo__cross::before{left:50%;top:0;bottom:0;width:1.5px;margin-left:-.75px}.demo__cross::after{top:50%;left:0;right:0;height:1.5px;margin-top:-.75px}.demo__ghost{position:absolute;left:50%;bottom:152px;transform:translateX(-50%);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:rgba(164,224,44,.75);white-space:nowrap}@keyframes demoBreathe{0%,100%{opacity:.55}50%{opacity:1}}.demo__bubble{position:absolute;left:14px;right:14px;bottom:14px;z-index:6;display:flex;align-items:center;gap:10px;background:rgba(10,10,12,.9);border:1px solid rgba(164,224,44,.42);border-radius:14px;padding:10px 10px 10px 12px;box-shadow:0 -14px 34px rgba(0,0,0,.55);opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .35s ease}.demo__body{flex:1 1 auto;min-width:0;text-align:left}.demo__bubble.is-on{opacity:1;transform:translateY(0)}.demo__bubble::after{content:"";position:absolute;left:26px;top:-7px;width:12px;height:12px;background:rgba(10,10,12,.9);border-left:1px solid rgba(164,224,44,.42);border-top:1px solid rgba(164,224,44,.42);transform:rotate(45deg)}.demo__label{display:block;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);margin-bottom:3px;font-weight:700}.demo__text{display:block;font-size:12.5px;line-height:1.35;color:var(--ink);min-height:2.7em;word-break:break-word}.demo__caret{display:inline-block;width:1.5px;height:1em;background:var(--lime);vertical-align:-2px;margin-left:1px;animation:demoCaret 1s steps(1) infinite}@keyframes demoCaret{0%,50%{opacity:1}51%,100%{opacity:0}}.demo__go{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;background:var(--lime);color:#0a0a0a;font-weight:800;font-size:11px;letter-spacing:.02em;padding:6px 11px;border-radius:999px;box-shadow:0 8px 20px rgba(164,224,44,.28);opacity:0;transform:scale(.9);transition:opacity .25s ease,transform .25s ease}.demo__go.is-on{opacity:1;transform:scale(1)}.demo__go.is-hit{animation:demoHit .38s ease}@keyframes demoHit{40%{transform:scale(.9)}100%{transform:scale(1)}}.demo__scan{position:absolute;inset:0;z-index:5;opacity:0;transition:opacity .25s ease;background:linear-gradient(180deg,transparent 42%,rgba(164,224,44,.5) 50%,transparent 58%);mix-blend-mode:screen}.demo__scan.is-on{opacity:1;animation:demoScan 1.25s ease-in-out infinite}@keyframes demoScan{from{transform:translateY(-58%)}to{transform:translateY(58%)}}.demo__paint{position:absolute;inset:0;width:100%;height:100%;z-index:4;opacity:0;transition:opacity .3s ease}.demo__paint.is-on{opacity:1}.demo__paint path{fill:none;stroke:rgba(164,224,44,.55);stroke-width:26;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:var(--len,900);stroke-dashoffset:var(--len,900)}.demo__paint.is-draw path{transition:stroke-dashoffset 1.6s ease-in-out;stroke-dashoffset:0}.demo__tip{position:absolute;z-index:8;left:0;top:0;width:16px;height:16px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 5px rgba(164,224,44,.22),0 6px 16px rgba(0,0,0,.5);opacity:0;transition:opacity .2s ease;will-change:transform}.demo__tip.is-on{opacity:1}.demo__chips{position:absolute;left:14px;top:14px;z-index:6;display:flex;gap:8px}.demo__chip{width:58px;height:58px;border-radius:12px;overflow:hidden;border:1px solid rgba(164,224,44,.5);background:#111;box-shadow:0 10px 22px rgba(0,0,0,.5);opacity:0;transform:translateY(14px) scale(.92);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}.demo__chip.is-on{opacity:1;transform:translateY(0) scale(1)}.demo__chip img{width:100%;height:100%;object-fit:cover}.demo__chip--fly{position:absolute;left:auto;right:16px;bottom:auto;top:56%;width:96px;height:96px;border-radius:50%;z-index:9}.demo__chip--fly.is-fly{transform:translate(-64px,-150px) scale(.72);opacity:.96;transition:transform 1s cubic-bezier(.4,.1,.2,1),opacity .4s ease}.demo__chip--fly.is-done{opacity:0;transform:translate(-64px,-150px) scale(.45)}.demo__ring{position:absolute;z-index:8;left:50%;top:26%;width:92px;height:92px;margin:-46px 0 0 -46px;border-radius:50%;border:2px solid rgba(164,224,44,.85);opacity:0;transform:scale(.7)}.demo__ring.is-on{opacity:1;transform:scale(1);transition:opacity .3s ease,transform .5s ease}.demo__ring.is-pop::after{animation:demoPop .5s ease}.demo__ring::after,.demo__tag--to::after,.demo__mouth::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:2px solid rgba(164,224,44,.45);opacity:0}@keyframes demoPop{0%{transform:scale(1);opacity:.85}100%{transform:scale(1.55);opacity:0}}.demo__reveal{position:absolute;inset:0;z-index:3;clip-path:inset(0 100% 0 0)}.demo__reveal.is-run{transition:clip-path 1.9s cubic-bezier(.4,0,.2,1);clip-path:inset(0 0 0 0);will-change:clip-path}.demo__reveal img{width:100%;height:100%;object-fit:cover}.demo__edge{position:absolute;top:0;bottom:0;width:2px;z-index:6;left:0;background:linear-gradient(180deg,transparent,var(--lime),transparent);box-shadow:0 0 18px rgba(164,224,44,.85);opacity:0}.demo__edge.is-run{opacity:1;transition:transform 1.9s cubic-bezier(.4,0,.2,1),opacity .3s ease;transform:translate3d(var(--edge-to,100%),0,0)}.demo__tag{position:absolute;top:14px;z-index:7;background:rgba(10,10,12,.86);border:1px solid rgba(255,255,255,.22);color:var(--ink2);font-size:11px;font-weight:800;letter-spacing:.12em;padding:5px 10px;border-radius:999px;opacity:0;transform:translateY(-6px);transition:opacity .35s ease,transform .35s ease}.demo__tag.is-on{opacity:1;transform:translateY(0)}.demo__tag--from{left:14px}.demo__tag--to{right:14px;border-color:rgba(164,224,44,.55);color:var(--lime);box-shadow:0 0 0 0 rgba(164,224,44,.35)}.demo__tag--to.is-pop::after{animation:demoPop .6s ease}.create-preview[data-mode=video] .ph--portrait{aspect-ratio:9/16}.demo__clip{object-fit:cover}.demo__pill{position:absolute;z-index:7;left:50%;transform:translateX(-50%) translateY(-6px);background:rgba(10,10,12,.86);border:1px solid rgba(164,224,44,.55);color:var(--lime);font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:999px;white-space:nowrap;opacity:0;transition:opacity .35s ease,transform .35s ease}.demo__pill.is-on{opacity:1;transform:translateX(-50%) translateY(0)}.demo__pill--top{top:14px}.demo__pill--bottom{bottom:20px}.demo__refs{position:absolute;left:0;right:0;top:38%;z-index:6;display:flex;justify-content:center;gap:10px;opacity:0;transition:opacity .35s ease}.demo__refs.is-on{opacity:1}.demo__ref{width:78px;height:78px;border-radius:14px;overflow:hidden;background:#111;border:1px solid rgba(164,224,44,.5);box-shadow:0 12px 26px rgba(0,0,0,.55);opacity:0;transform:translateY(16px) scale(.9);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}.demo__ref.is-on{opacity:1;transform:translateY(0) scale(1)}.demo__ref img{width:100%;height:100%;object-fit:cover;display:block}.demo__wave{position:absolute;left:14px;right:14px;bottom:14px;z-index:6;display:flex;align-items:center;gap:2px;flex-wrap:wrap;background:rgba(10,10,12,.9);border:1px solid rgba(164,224,44,.42);border-radius:14px;padding:12px 12px 10px;box-shadow:0 -14px 34px rgba(0,0,0,.55);opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .35s ease}.demo__wave.is-on{opacity:1;transform:translateY(0)}.demo__wave i{flex:1 1 auto;height:6px;min-width:2px;border-radius:2px;background:rgba(164,224,44,.35);transform-origin:50% 50%}.demo__wave.is-live i{animation:demoWave .9s ease-in-out infinite}.demo__wave.is-live i:nth-child(3n){animation-delay:.12s;background:rgba(198,255,74,.7)}.demo__wave.is-live i:nth-child(3n+1){animation-delay:.26s}.demo__wave.is-live i:nth-child(4n){animation-delay:.4s;background:rgba(198,255,74,.55)}@keyframes demoWave{0%,100%{transform:scaleY(1)}50%{transform:scaleY(3.4)}}.demo__wavelabel{flex:1 0 100%;order:2;margin-top:9px;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--lime)}.demo__go--wave{order:3;margin-top:7px;opacity:1;transform:scale(1)}.demo__mouth{position:absolute;z-index:8;left:50%;top:52%;width:84px;height:48px;margin:-24px 0 0 -42px;border-radius:50%;border:2px solid rgba(164,224,44,.85);opacity:0;transform:scale(.75);transition:opacity .3s ease,transform .45s ease}.demo__mouth.is-on{opacity:1;transform:scale(1)}.demo__mouth.is-on::after{animation:demoPop 1.4s ease-out infinite}.demo__caps{position:absolute;left:16px;right:16px;bottom:78px;z-index:7;display:flex;flex-wrap:wrap;gap:5px;justify-content:center;opacity:0;transition:opacity .3s ease}.demo__caps.is-on{opacity:1}.demo__caps span{display:inline-block;background:rgba(6,6,8,.82);color:#fff;font-size:15px;font-weight:900;letter-spacing:-.01em;padding:3px 8px;border-radius:7px;text-transform:uppercase;opacity:0;transform:translateY(8px) scale(.9);transition:opacity .2s ease,transform .28s cubic-bezier(.2,.8,.2,1)}.demo__caps span.is-on{opacity:1;transform:translateY(0) scale(1)}.demo__caps span:last-child{background:var(--lime);color:#0a0a0a}.demo__social{position:absolute;right:12px;bottom:150px;z-index:7;display:flex;flex-direction:column;gap:14px;align-items:center;opacity:0;transition:opacity .3s ease}.demo__social.is-on{opacity:1}.demo__soc{display:flex;flex-direction:column;align-items:center;gap:2px;color:#fff;filter:drop-shadow(0 2px 6px rgba(0,0,0,.7));opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .4s var(--ease,ease)}.demo__soc.is-on{opacity:1;transform:translateY(0)}.demo__soc b{font-size:10px;font-weight:800;color:#fff}.demo__refclip{position:absolute;left:50%;top:44%;width:132px;height:234px;margin:-117px 0 0 -66px;border-radius:16px;overflow:hidden;background:#111;z-index:6;border:1px solid rgba(164,224,44,.55);box-shadow:0 18px 40px rgba(0,0,0,.6);opacity:0;transform:translateY(18px) scale(.92);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}.demo__refclip.is-on{opacity:1;transform:translateY(0) scale(1)}.demo__refclip video{width:100%;height:100%;object-fit:cover;display:block}.demo__bubble--plain{justify-content:center}.demo__bubble--plain::after{display:none}.demo__path{position:absolute;inset:0;width:100%;height:100%;z-index:5;opacity:0;transition:opacity .3s ease}.demo__path.is-on{opacity:1}.demo__path.is-fade{opacity:.42}.demo__path path{fill:none;stroke:rgba(198,255,74,.85);stroke-width:3;stroke-linecap:round;stroke-dasharray:var(--len,900);stroke-dashoffset:var(--len,900);filter:drop-shadow(0 0 6px rgba(164,224,44,.7))}.demo__path.is-draw path{transition:stroke-dashoffset 2.2s cubic-bezier(.4,0,.2,1);stroke-dashoffset:0}.demo__dot{position:absolute;z-index:8;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(164,224,44,.28),0 0 18px rgba(198,255,74,.9);opacity:0;transition:opacity .2s ease}.demo__dot.is-on{opacity:1}.demo-caption{margin-top:12px;text-align:center;font-size:12.5px;color:var(--dim);min-height:1.4em;transition:opacity .3s ease}@media(prefers-reduced-motion:reduce){.demo__scan.is-on{animation:none}.demo__caret{animation:none}.demo__cor,.demo__cross{animation:none;opacity:1}.demo__wave.is-live i{animation:none}.demo__mouth.is-on::after{animation:none}.demo__path.is-draw path{transition-duration:.01ms}.demo__layer,.demo__reveal.is-run,.demo__edge.is-run{transition-duration:.01ms}}