@layer standard-components{.InteractiveDemoScreen.svelte-801qa0{--border-radius-screen: 8px;--scroll-duration: .6s;--scroll-ease: cubic-bezier(.65, 0, .35, 1);--demo-animation-slide-ease: cubic-bezier(.76, 0, .24, 1);--demo-animation-slide-duration: .5s;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;border-radius:var(--border-radius-screen);pointer-events:none}.InteractiveDemoScreen.svelte-801qa0 .screenBackgroundHolder:where(.svelte-801qa0){opacity:0;transition:opacity var(--duration-default)}.InteractiveDemoScreen.svelte-801qa0 .screenBackgroundHolder:where(.svelte-801qa0) .screenBackground:where(.svelte-801qa0){position:absolute;top:0;left:0;width:100%;height:100%;transition:background-color var(--duration-default);background-color:var(--backgroundColor);opacity:var(--backgroundOpacity)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0){pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;visibility:hidden;transition:margin var(--scroll-duration) var(--scroll-ease),opacity var(--duration-default) linear,transform var(--demo-animation-slide-duration) var(--demo-animation-slide-ease),width var(--duration-default)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFade:where(.svelte-801qa0){opacity:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInScale:where(.svelte-801qa0){--demo-animation-slide-duration: .75s;opacity:.5;transform:scale(.1)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInZoomIn:where(.svelte-801qa0){opacity:.5;transform:scale(.25)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInZoomOut:where(.svelte-801qa0){opacity:.5;transform:scale(2.5)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionOutZoomIn:where(.svelte-801qa0){transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionOutZoomOut:where(.svelte-801qa0){transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFromTop:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFromTopPush:where(.svelte-801qa0){transform:translateY(-100%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFromRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFromRightPush:where(.svelte-801qa0){transform:translate(100%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFromBottom:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFromBottomPush:where(.svelte-801qa0){transform:translateY(100%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFromLeft:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInFromLeftPush:where(.svelte-801qa0){transform:translate(-100%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInRevealLeftToRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionOutHideRightToLeft:where(.svelte-801qa0){width:0;overflow:hidden;transition:width calc(var(--duration-default) * 2)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInRevealRightToLeft:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionOutHideLeftToRight:where(.svelte-801qa0){position:absolute;right:0;width:0;height:100%;overflow:hidden;transition:width calc(var(--duration-default) * 2)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionInRevealRightToLeft:where(.svelte-801qa0)>div,.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionOutHideLeftToRight:where(.svelte-801qa0)>div{position:absolute;right:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionOutHideLeftToRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.preTransitionOutHideRightToLeft:where(.svelte-801qa0){width:100%}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFade:where(.svelte-801qa0){opacity:1}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutFade:where(.svelte-801qa0){opacity:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInScale:where(.svelte-801qa0){--demo-animation-slide-duration: .75s;opacity:1;transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutScale:where(.svelte-801qa0){--demo-animation-slide-duration: .75s;opacity:0;transform:scale(.1)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInZoomIn:where(.svelte-801qa0){opacity:1;transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInZoomOut:where(.svelte-801qa0){opacity:1;transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutZoomIn:where(.svelte-801qa0){opacity:0;transform-origin:var(--zoom-origin);animation-name:svelte-801qa0-transOutZoomIn;animation-duration:.8s;animation-fill-mode:forwards}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutZoomOut:where(.svelte-801qa0){opacity:0;transform:scale(.25)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFromTop:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFromTopPush:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFromRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFromRightPush:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFromBottom:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFromBottomPush:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFromLeft:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInFromLeftPush:where(.svelte-801qa0){transform:none}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutToTop:where(.svelte-801qa0){transform:translateY(-100%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutToRight:where(.svelte-801qa0){transform:translate(100%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutToBottom:where(.svelte-801qa0){transform:translateY(100%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutToLeft:where(.svelte-801qa0){transform:translate(-100%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInRevealLeftToRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionInRevealRightToLeft:where(.svelte-801qa0){width:100%}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutHideLeftToRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.transitionOutHideRightToLeft:where(.svelte-801qa0){width:0%}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0)>.AproposImageComponent{position:absolute;top:0;left:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0)>.AproposImageComponent img{width:100%}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-top-left{position:absolute;top:0;left:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-top-center{position:absolute;top:0;left:50%;transform:translate(-50%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-top-right{position:absolute;top:0;right:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-center-left{position:absolute;top:50%;transform:translateY(-50%);left:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-center-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-center-right{position:absolute;top:50%;transform:translateY(-50%);right:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-bottom-left{position:absolute;bottom:0;left:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-bottom-center{position:absolute;bottom:0;left:50%;transform:translate(-50%)}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder:where(.svelte-801qa0) .sq-custom-demo-overlay-bottom-right{position:absolute;bottom:0;right:0}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.fixInPlace:where(.svelte-801qa0){transition:unset;transform:translate(0);opacity:1}.InteractiveDemoScreen.svelte-801qa0 .overlayHolder.show:where(.svelte-801qa0){visibility:visible}.InteractiveDemoScreen.current.svelte-801qa0{pointer-events:auto}.InteractiveDemoScreen.current.svelte-801qa0 .screenBackgroundHolder:where(.svelte-801qa0){opacity:1}.InteractiveDemoScreen.current.svelte-801qa0 .InteractiveDemoTrigger{visibility:visible}.InteractiveDemoScreen.hideDeviceFrame.svelte-801qa0{top:0;left:0;width:100%;height:100%;border-radius:var(--border-radius-device)}.InteractiveDemoScreen.hideDeviceFrame.svelte-801qa0 .screenContainer:where(.svelte-801qa0){visibility:hidden}.InteractiveDemoScreen.hideDeviceFrame.svelte-801qa0 .screenContainer.transitioning:where(.svelte-801qa0){visibility:visible}.InteractiveDemoScreen.hideDeviceFrame.current.svelte-801qa0{border-radius:0}.InteractiveDemoScreen.hideDeviceFrame.current.svelte-801qa0 .screenContainer:where(.svelte-801qa0){height:100%;visibility:visible}.InteractiveDemoScreen.svelte-801qa0 .screenContainer:where(.svelte-801qa0){position:relative;transition:margin var(--scroll-duration) var(--scroll-ease),opacity var(--duration-default) linear,transform var(--demo-animation-slide-duration) var(--demo-animation-slide-ease),width var(--duration-default)}@keyframes svelte-801qa0-transOutZoomIn{0%{transform:scale(1) translateZ(0);opacity:1}70%{transform:var(--zoom-scale) var(--zoom-offset);opacity:1}to{transform:var(--zoom-scale) var(--zoom-offset);opacity:0}}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFade:where(.svelte-801qa0){opacity:0}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInScale:where(.svelte-801qa0){--demo-animation-slide-duration: .75s;opacity:.5;transform:scale(.1)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInZoomIn:where(.svelte-801qa0){opacity:.5;transform:scale(.25)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInZoomOut:where(.svelte-801qa0){opacity:.5;transform:scale(2.5)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionOutZoomIn:where(.svelte-801qa0){transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionOutZoomOut:where(.svelte-801qa0){transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFromTop:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFromTopPush:where(.svelte-801qa0){transform:translateY(-100%)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFromRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFromRightPush:where(.svelte-801qa0){transform:translate(100%)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFromBottom:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFromBottomPush:where(.svelte-801qa0){transform:translateY(100%)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFromLeft:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInFromLeftPush:where(.svelte-801qa0){transform:translate(-100%)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInRevealLeftToRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionOutHideRightToLeft:where(.svelte-801qa0){width:0;overflow:hidden;transition:width calc(var(--duration-default) * 2)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInRevealRightToLeft:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionOutHideLeftToRight:where(.svelte-801qa0){position:absolute;right:0;width:0;height:100%;overflow:hidden;transition:width calc(var(--duration-default) * 2)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionInRevealRightToLeft:where(.svelte-801qa0)>div,.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionOutHideLeftToRight:where(.svelte-801qa0)>div{position:absolute;right:0}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionOutHideLeftToRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.preTransitionOutHideRightToLeft:where(.svelte-801qa0){width:100%}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFade:where(.svelte-801qa0){opacity:1}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutFade:where(.svelte-801qa0){opacity:0}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInScale:where(.svelte-801qa0){--demo-animation-slide-duration: .75s;opacity:1;transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutScale:where(.svelte-801qa0){--demo-animation-slide-duration: .75s;opacity:0;transform:scale(.1)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInZoomIn:where(.svelte-801qa0){opacity:1;transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInZoomOut:where(.svelte-801qa0){opacity:1;transform:scale(1)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutZoomIn:where(.svelte-801qa0){opacity:0;transform-origin:var(--zoom-origin);animation-name:svelte-801qa0-transOutZoomIn;animation-duration:.8s;animation-fill-mode:forwards}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutZoomOut:where(.svelte-801qa0){opacity:0;transform:scale(.25)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFromTop:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFromTopPush:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFromRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFromRightPush:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFromBottom:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFromBottomPush:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFromLeft:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInFromLeftPush:where(.svelte-801qa0){transform:none}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutToTop:where(.svelte-801qa0){transform:translateY(-100%)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutToRight:where(.svelte-801qa0){transform:translate(100%)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutToBottom:where(.svelte-801qa0){transform:translateY(100%)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutToLeft:where(.svelte-801qa0){transform:translate(-100%)}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInRevealLeftToRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionInRevealRightToLeft:where(.svelte-801qa0){width:100%}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutHideLeftToRight:where(.svelte-801qa0),.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitionOutHideRightToLeft:where(.svelte-801qa0){width:0%}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitioning:where(.svelte-801qa0){pointer-events:none}.InteractiveDemoScreen.svelte-801qa0 .screenContainer.transitioning:where(.svelte-801qa0) .InteractiveDemoTrigger{visibility:hidden}@media (min-width: 740px){.InteractiveDemoScreen.svelte-801qa0{--border-radius-screen: 16px}}@media (min-width: 1024px){.InteractiveDemoScreen.svelte-801qa0{--border-radius-screen: 20px}}}