.feature-section{isolation:isolate;--feature-glow-x:85%;--feature-glow-strength:18%;--feature-glow-near:color-mix(in oklab, var(--feature-tint,#818cf8) 70%, #80858f);--feature-glow-far:color-mix(in oklab, var(--feature-tint,#818cf8) 70%, #000);position:relative}.feature-section:nth-of-type(2n){--feature-glow-x:15%}.feature-section:first-of-type{--feature-glow-strength:32%}.feature-section:before,.feature-section:after{content:"";z-index:-1;inset-block:0;pointer-events:none;width:100vw;position:absolute;left:50%;translate:-50%}.feature-section:before{background:radial-gradient(60% 80% at var(--feature-glow-x) 0%, color-mix(in oklab, var(--feature-glow-near) var(--feature-glow-strength), transparent), color-mix(in oklab, var(--feature-glow-far) calc(var(--feature-glow-strength) / 3), transparent) 45%, transparent 75%) #000;border-top:1px solid #ffffff0f}.feature-section:first-of-type:before{border-top:0}.feature-section:after{mix-blend-mode:overlay;opacity:.4;background:url(/grain.png) 0 0/240px 240px}.media-loop{--media-loop-tint:var(--feature-tint,#22d3ee)}.media-loop-input-ring,.media-loop-pulse,.media-loop-points,.media-loop-result,.media-loop-scan{animation:none}[data-reduced-motion] .media-loop *{animation:none}.media-loop-input-ring{opacity:0;box-shadow:inset 0 0 0 1px var(--media-loop-tint), 0 0 32px -6px var(--media-loop-tint);animation-name:media-loop-input-ring}@keyframes media-loop-input-ring{0%{opacity:0}4%,10%{opacity:1}18%,to{opacity:0}}.media-loop-pulse{opacity:0;background:linear-gradient(90deg, transparent, var(--media-loop-tint), transparent);animation-name:media-loop-pulse}@keyframes media-loop-pulse{0%,5%{opacity:0;transform:translate(-100%)}8%,22%{opacity:1}25%,to{opacity:0;transform:translate(250%)}}.media-loop-floor{inset-inline:-25%;transform-origin:bottom;background:linear-gradient(90deg,#ffffff14 1px,#0000 1px) 0 0/20px 20px,linear-gradient(#ffffff14 1px,#0000 1px) 0 0/20px 20px;height:50%;bottom:-4%;transform:perspective(300px)rotateX(60deg);-webkit-mask-image:radial-gradient(closest-side,#000,#0000);mask-image:radial-gradient(closest-side,#000,#0000)}.media-loop-points{opacity:0;background:radial-gradient(circle, var(--media-loop-tint) .8px, transparent 1.2px) 0 0 / 5px 5px;animation-name:media-loop-points;-webkit-mask-position:bottom;mask-position:bottom;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}@keyframes media-loop-points{0%,22%{opacity:0}30%,55%{opacity:.9}60%,to{opacity:0}}.media-loop-result{animation-name:media-loop-result}@keyframes media-loop-result{0%,32%{opacity:1;clip-path:inset(100% 0 0)}55%,88%{opacity:1;clip-path:inset(0)}95%,to{opacity:0;clip-path:inset(0)}}.media-loop-scan{opacity:0;background:linear-gradient(var(--media-loop-tint) 0 1px, color-mix(in oklab, var(--media-loop-tint) 20%, transparent) 1px, transparent 15%);animation-name:media-loop-scan;-webkit-mask-image:linear-gradient(90deg,#0000,#000 25% 75%,#0000);mask-image:linear-gradient(90deg,#0000,#000 25% 75%,#0000)}@keyframes media-loop-scan{0%,31%{opacity:0;transform:translateY(100%)}33%,53%{opacity:1}55%,to{opacity:0;transform:translateY(0)}}
