.funnel-sky,.funnel-stream{position:relative;container-type:size}.funnel-stream{position:absolute;inset:0}.funnel-fall,.funnel-dot,.funnel-click{opacity:0;position:absolute;top:0;left:0}.funnel-ad{background:linear-gradient(var(--snd-white), var(--snd-white)) .17rem .17rem / .36rem .46rem no-repeat, linear-gradient(rgba(255,255,255,.75), rgba(255,255,255,.75)) .63rem .21rem / .3rem .1rem no-repeat, linear-gradient(rgba(255,255,255,.75), rgba(255,255,255,.75)) .63rem .42rem / .21rem .1rem no-repeat, var(--snd-brand);width:1.1rem;height:.8rem;box-shadow:0 0 6px rgba(var(--snd-accent-rgb), .2);border-radius:3px;margin:-.8rem 0 0 -.55rem;display:block}.funnel-dot{background:var(--snd-white);border-radius:50%;width:6px;height:6px;margin:-3px 0 0 -3px;box-shadow:0 0 4px rgba(255,255,255,.45)}.funnel-band[data-stage="3"] .funnel-dot{background:var(--snd-brand);width:8px;height:8px;box-shadow:0 0 6px rgba(var(--snd-accent-rgb), .5);margin:-4px 0 0 -4px}.funnel-click{border:1.5px solid rgba(255,255,255,.7);border-radius:50%;width:1.2rem;height:1.2rem;margin:-.6rem 0 0 -.6rem}.funnel-sheet{width:1.75rem;height:2.125rem;translate:calc(var(--slot) * 2.5rem) 0;rotate:calc(var(--slot) * 6deg);filter:drop-shadow(0 3px 6px rgba(var(--snd-accent-rgb), .18));margin-left:-.875rem;position:absolute;top:.35rem;left:50%}.funnel-flow{--cycle:8s;--stagger:1.3s}.funnel-band[data-stage="1"]{--at:1s}.funnel-band[data-stage="2"]{--at:1.85s}.funnel-band[data-stage="3"]{--at:2.7s}.funnel-flow[data-flow=waiting] .funnel-sheet{opacity:0}.funnel-flow:is([data-flow=playing],[data-flow=paused]) .funnel-fall{animation:funnel-drift var(--cycle) cubic-bezier(.2, .6, .35, 1) infinite backwards;animation-delay:calc(var(--d) * var(--stagger))}.funnel-flow:is([data-flow=playing],[data-flow=paused]) .funnel-ad{animation:funnel-drop var(--cycle) linear infinite backwards;animation-delay:calc(var(--d) * var(--stagger))}.funnel-flow:is([data-flow=playing],[data-flow=paused]) .funnel-dot{animation:funnel-pass var(--cycle) linear infinite backwards;animation-delay:calc(var(--d) * var(--stagger) + var(--at))}.funnel-flow:is([data-flow=playing],[data-flow=paused]) .funnel-dot--fades{animation-name:funnel-fade}.funnel-flow:is([data-flow=playing],[data-flow=paused]) .funnel-click{animation:funnel-ring var(--cycle) linear infinite backwards;animation-delay:calc(var(--d) * var(--stagger) + var(--at))}.funnel-flow:is([data-flow=playing],[data-flow=paused]) .funnel-sheet{animation:funnel-sheet var(--cycle) linear infinite backwards;animation-delay:calc(var(--d) * var(--stagger) + 3.5s)}.funnel-flow[data-flow=paused] *{animation-play-state:paused}@keyframes funnel-drift{0%{opacity:0;translate:calc(var(--from-x) * 1cqw) 0}2%{opacity:.85}11%{opacity:.85}12.5%,to{opacity:0;translate:calc(var(--x) * 1cqw) 0}}@keyframes funnel-drop{0%{translate:0 calc(var(--from-y) * 1cqh);rotate:calc(var(--turn) * .5deg);animation-timing-function:cubic-bezier(.45,0,.75,.6);scale:.75}12.5%,to{translate:0 100cqh;rotate:calc(var(--turn) * -.1deg);scale:1}}@keyframes funnel-pass{0%{opacity:0;translate:calc(var(--x) * 1cqw) 0}1.3%{opacity:.85}9.5%{opacity:.85}10.6%,to{opacity:0;translate:calc(var(--to-x) * 1cqw) 100cqh}}@keyframes funnel-fade{0%{opacity:0;translate:calc(var(--x) * 1cqw) 0;animation-timing-function:cubic-bezier(.3,.4,.6,1);scale:1}1.3%{opacity:.75}10.6%,to{opacity:0;translate:calc((var(--x) * .7 + var(--to-x) * .3) * 1cqw) 55cqh;scale:.3}}@keyframes funnel-ring{0%{opacity:0;translate:calc(var(--x) * 1cqw) .4rem;animation-timing-function:var(--snd-ease-out);scale:.3}.9%{opacity:.7}8.75%,to{opacity:0;translate:calc(var(--x) * 1cqw) .4rem;scale:1.3}}@keyframes funnel-sheet{0%{opacity:0;animation-timing-function:cubic-bezier(.3,1.15,.5,1);translate:0 -.75rem;rotate:0deg;scale:.6}3%{opacity:1}10%,60%{opacity:1;translate:calc(var(--slot) * 2.5rem) 0;rotate:calc(var(--slot) * 6deg);scale:1}70%,to{opacity:0;translate:calc(var(--slot) * 2.5rem) .25rem;rotate:calc(var(--slot) * 6deg);scale:1}}