@import"https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap";*{box-sizing:border-box}body{height:100vh;background-position:center;background-color:#111;background-attachment:fixed;background-image:linear-gradient(45deg,#212121 6.52%,#111111 6.52%,#111111 50%,#212121 50%,#212121 56.52%,#111111 56.52%,#111111 100%);background-size:32.53px 32.53px;margin:0;padding:0;font-family:Outfit;color:#fff}.TestContainer[data-v-c529a9c1]{width:250px;height:250px;border:1px solid red;-webkit-backdrop-filter:url(#test-filter);backdrop-filter:url(#test-filter)}.TestFilter[data-v-c529a9c1]{width:100%;height:100%;position:absolute;top:0;left:0;pointer-events:none}.main[data-v-de848cd9]{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-height:100dvh}.LGContainer[data-v-de848cd9],.TestContainer[data-v-de848cd9]{z-index:1000;position:relative}.example[data-v-de848cd9]{display:flex;flex-direction:row;font-size:20px;align-items:center;justify-content:center;padding-inline:20px;cursor:pointer;z-index:2}[data-v-de848cd9] .example>div{display:flex}.example .lucide[data-v-de848cd9]{flex-shrink:0;width:35px;height:35px;margin:0;padding:0;filter:drop-shadow(0 0 10px rgba(0,0,0,.3));transition:all .4s ease-in-out}.panels{h1[data-v-de848cd9] {width: 100%; text-align: center; margin: 0;}}.panels[data-v-de848cd9]{display:flex;gap:40px;flex-wrap:wrap;width:100%;justify-content:center;padding-inline:50px;margin:auto}.panel{img[data-v-de848cd9] {position: absolute; width: 110%; height: 110%; object-fit: cover; top: -5%; left: -5%; opacity: .6; transition: all .4s ease-in-out;}}.panel[data-v-de848cd9]{position:relative;width:300px;height:300px;border-radius:40px;overflow:hidden;background:#222;display:flex;justify-content:center;align-items:center;box-shadow:0 60px 40px -40px #000}.panel .LGContainer[data-v-de848cd9]{transition:scale .4s ease-in-out}.panel:has(.LGContainer:hover){img[data-v-de848cd9] {scale: .98; opacity: .5;}}.panel:has(.LGContainer:hover) .LGContainer[data-v-de848cd9]{scale:1.02}.example2[data-v-de848cd9],.TestContainer[data-v-de848cd9]{top:50px;left:300px;position:absolute!important;font-size:14px}.example2[data-v-de848cd9]:active,.TestContainer[data-v-de848cd9]:active{color:transparent}.controls{hr[data-v-de848cd9] {width: 100%; opacity: .1;} input[type=range][data-v-de848cd9],input[type=text][data-v-de848cd9] {width: 100%;} input[type=text][data-v-de848cd9] {padding: .5em .8em; margin-top: 5px;} label[data-v-de848cd9]:has(input[type=checkbox]) {display: flex; align-items: center; justify-content: center; gap: 5px;} > button[data-v-de848cd9] {border: none; font-family: inherit; border-radius: 100px; padding: 1em; cursor: pointer; background: #111; color: #FFF;}}.controls[data-v-de848cd9]{display:flex;flex-direction:column;position:fixed;top:25px;left:20px;width:250px;background:#222;padding:30px;gap:20px;z-index:100;border-radius:20px;height:calc(100dvh - 50px);overflow:auto}.links{a[data-v-de848cd9] {color: #FFF;}}.links[data-v-de848cd9]{width:100%;display:flex;gap:1em;text-align:center;justify-content:center;margin-bottom:20px}.custom{img[data-v-de848cd9] {width: 100%; height: 100%; object-fit: cover; opacity: .8;}}.custom[data-v-de848cd9]{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}
