@import url("https://fonts.googleapis.com/css?family=Barlow|Tomorrow:400,700&display=swap");.Cyberpunk_cyberpunk__BI4zL{--yellow-color:#fcee09;--red-color:#ff003c;--black-color:#050a0e;--blue-color:#00f0ff;--white-color:#fafafa}.Cyberpunk_cyberpunk_cut__ZzpmU{--cut:15px;--border-width:1px;position:relative;background-color:#a53633;font-family:Tomorrow,sans-serif;text-transform:uppercase;color:var(--blue-color);font-size:1.2rem;padding:1rem calc(6rem - (var(--cut) / 3)) 1rem 6rem;clip-path:polygon(0 0,100% 0,100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)));&:before{content:"";position:absolute;inset:var(--border-width);z-index:-1;background-color:#270e12;clip-path:polygon(0 0,100% 0,100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)))}&:hover{background-color:#f65149}&:hover:before{background-color:#6c2424}}.Cyberpunk_cyberpunk_cut__right__LrSg8{padding:1rem 6rem 1rem calc(6rem - (var(--cut) / 3));clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%);&:before{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%)}}.Cyberpunk_cyberpunk_image__JuiYb{background-color:#f9f004;clip-path:polygon(0 25px,26px 0,calc(60% - 25px) 0,60% 25px,100% 25px,100% calc(100% - 10px),calc(100% - 15px) calc(100% - 10px),calc(80% - 10px) calc(100% - 10px),calc(80% - 15px) calc(100% - 0px),10px calc(100% - 0px),0 calc(100% - 10px));padding:30px 5px 15px}.Cyberpunk_btn__0WWBV{display:grid;place-items:center;font-family:Tomorrow,sans-serif;--corner-radius:1rem;border:0;outline:none;background-color:#000;cursor:pointer;position:relative;font-size:.85rem;text-transform:uppercase;color:var(--black-color)}.Cyberpunk_btn__0WWBV,.Cyberpunk_btn__content__87NzJ{clip-path:polygon(calc(100% - var(--corner-radius)) 0,100% 25%,100% 100%,var(--corner-radius) 100%,0 75%,0 0)}.Cyberpunk_btn__content__87NzJ{display:flex;text-wrap:nowrap;width:calc(100% - 4px);height:calc(100% - 4px);padding:1rem 2rem;align-items:center;justify-content:center;top:2px;left:2px;right:2px;bottom:2px;background-color:var(--yellow-color)}.Cyberpunk_btn__secondary__wryHJ .Cyberpunk_btn__content__87NzJ{background-color:var(--red-color);color:var(--white-color)}.Cyberpunk_btn__label__V50Mu{font-size:.4rem;position:absolute;bottom:-1px;right:8%;padding:0 5px;background-color:hsl(var(--background));color:hsl(var(--foreground));z-index:3;border-left:1px solid var(--blue-color);line-height:1.5}.Cyberpunk_btn--secondary__CEq_W .Cyberpunk_btn__label__V50Mu{background-color:var(--white-color);color:var(--black-color)}.Cyberpunk_btn__glitch__hmCda{display:none;position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--yellow-color);filter:drop-shadow(-2px 3px #67e3f3) drop-shadow(-1px -3px #02d8f3) drop-shadow(2px 1px #02d8f3)}.Cyberpunk_btn__secondary__wryHJ .Cyberpunk_btn__glitch__hmCda{background-color:var(--red-color)}.Cyberpunk_btn__0WWBV:focus .Cyberpunk_btn__content__87NzJ:after,.Cyberpunk_btn__0WWBV:focus .Cyberpunk_btn__glitch__hmCda,.Cyberpunk_btn__0WWBV:hover .Cyberpunk_btn__content__87NzJ:after,.Cyberpunk_btn__0WWBV:hover .Cyberpunk_btn__glitch__hmCda{display:block;animation:Cyberpunk_glitch-animation__gupY_ 2s linear 0s infinite}@keyframes Cyberpunk_glitch-animation__gupY_{0%{opacity:1;transform:translateZ(0);clip-path:polygon(0 2%,100% 2%,100% 5%,0 5%)}2%{clip-path:polygon(0 78%,100% 78%,100% 100%,0 100%);transform:translate(-5px)}6%{clip-path:polygon(0 78%,100% 78%,100% 100%,0 100%);transform:translate(5px)}8%{clip-path:polygon(0 78%,100% 78%,100% 100%,0 100%);transform:translate(-5px)}9%{clip-path:polygon(0 78%,100% 78%,100% 100%,0 100%);transform:translate(0)}10%{clip-path:polygon(0 54%,100% 54%,100% 44%,0 44%);transform:translate3d(5px,0,0)}13%{clip-path:polygon(0 54%,100% 54%,100% 44%,0 44%);transform:translateZ(0)}13.1%{clip-path:polygon(0 0,0 0,0 0,0 0);transform:translate3d(5px,0,0)}15%{clip-path:polygon(0 60%,100% 60%,100% 40%,0 40%);transform:translate3d(5px,0,0)}20%{clip-path:polygon(0 60%,100% 60%,100% 40%,0 40%);transform:translate3d(-5px,0,0)}20.1%{clip-path:polygon(0 0,0 0,0 0,0 0);transform:translate3d(5px,0,0)}25%{clip-path:polygon(0 85%,100% 85%,100% 40%,0 40%);transform:translate3d(5px,0,0)}30%{clip-path:polygon(0 85%,100% 85%,100% 40%,0 40%);transform:translate3d(-5px,0,0)}30.1%{clip-path:polygon(0 0,0 0,0 0,0 0)}35%{clip-path:polygon(0 63%,100% 63%,100% 80%,0 80%);transform:translate(-5px)}40%{clip-path:polygon(0 63%,100% 63%,100% 80%,0 80%);transform:translate(5px)}45%{clip-path:polygon(0 63%,100% 63%,100% 80%,0 80%);transform:translate(-5px)}50%{clip-path:polygon(0 63%,100% 63%,100% 80%,0 80%);transform:translate(0)}55%{clip-path:polygon(0 10%,100% 10%,100% 0,0 0);transform:translate3d(5px,0,0)}60%{clip-path:polygon(0 10%,100% 10%,100% 0,0 0);transform:translateZ(0);opacity:1}60.1%{clip-path:polygon(0 0,0 0,0 0,0 0);opacity:1}to{clip-path:polygon(0 0,0 0,0 0,0 0);opacity:1}}.Cyberpunk_info__a5vw1{--cut:2rem;--border-width:1px;--colored-border-width:20px;--border-color:#a53633;font-family:Tomorrow,sans-serif;position:relative;padding:2rem 1rem 2rem calc(1rem + var(--colored-border-width));margin-block:2rem;background-color:var(--border-color);color:#fff;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 calc(100% - 20px),4px calc(100% - 24px),4px calc(100% - 46px),0 calc(100% - 50px));&>.Cyberpunk_infoColor__YuQUl{content:"";position:absolute;top:0;bottom:0;left:0;width:var(--colored-border-width);background-color:var(--border-color);&:before{content:"";position:absolute;inset:var(--border-width);clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 calc(100% - 18px),4px calc(100% - 22px),4px calc(100% - 46px),0 calc(100% - 50px))}}&:after{content:"";position:absolute;inset:var(--border-width);z-index:-1;background-color:#270e12;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%)}}.Cyberpunk_info__a5vw1[data-type=alert] .Cyberpunk_infoColor__YuQUl:before{background-color:#a53633}.Cyberpunk_info__a5vw1[data-type=info] .Cyberpunk_infoColor__YuQUl:before{background-color:#2570d4}.CodeSnippet_Code__Uaj0m{width:100%}.CodeSnippet_Code__Uaj0m:hover{.CodeSnippet_Circle__Z7tJ8:first-child{background:#ff5f57!important;transition-delay:.05s;opacity:1}.CodeSnippet_Circle__Z7tJ8:nth-child(2){background:#ffbd2e!important;transition-delay:.1s;opacity:1}.CodeSnippet_Circle__Z7tJ8:last-child{background:#28c840!important;transition-delay:.15s;opacity:1}}.CodeSnippet_Title__HW7Kk{padding:3px 0;font-size:.8em;display:flex;align-items:center;justify-content:space-between;width:100%}.CodeSnippet_Circle__Z7tJ8{border-radius:100%;height:.8em;width:.8em;opacity:.2;transition:all .2s ease-in-out}.glass_glassWrapper__WLr12{position:relative;height:150px;width:100%;z-index:1}.glass_glass__4jwzv{background:hsla(0,0%,100%,.2);pointer-events:none}.glass_glassBasic__lzNMw{height:100%}.glass_glassMedium__8uEQh{position:absolute;inset:0;height:200%;box-shadow:0 4px 30px rgba(0,0,0,.1);mask-image:linear-gradient(180deg,#000 0 50%,transparent 50% 100%)}.glass_glassEdge__QHMf4{position:absolute;inset:0;background:hsla(var(--foreground)/.3);backdrop-filter:blur(16px) brightness(2);-webkit-backdrop-filter:blur(16px);height:100%;transform:translateY(100%);mask-image:linear-gradient(180deg,#000 0 5px,transparent 5px 100%);pointer-events:none}.LayoutsPlayground_grid__hGug6{display:grid;grid:"header header header" auto "leftSide body rightSide" 1fr "footer footer footer" auto/auto 1fr auto;gap:8px;min-height:50vh}.MagicBorders_container__3Q9MD{grid-column:1/-1;width:100%;border-radius:24px;display:grid;gap:.5rem;padding:.5rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));background-size:cover;background-repeat:no-repeat;color:hsl(var(--primary));font-size:2rem;margin-bottom:2rem;&:hover :is(.MagicBorders_box__i_D94,.MagicBorders_box2__qH1s7,.MagicBorders_box3__HzTgK,.MagicBorders_box4__RcYAr)>div:first-child{background:radial-gradient(250px circle at var(--mouse-x) var(--mouse-y),hsla(0,0%,100%,.8) 40%,hsla(0,0%,100%,.2)) padding-box}}.MagicBorders_box__i_D94{position:relative;aspect-ratio:1/1;border-radius:16px;backdrop-filter:blur(16px);&:nth-child(2){font-size:4rem}&>div:first-child{position:absolute;inset:0;border-radius:15px;transition:all 1.2s ease-in;background:radial-gradient(250px circle at 0 0,hsla(0,0%,100%,.2) 40%,hsla(0,0%,100%,.2)) padding-box;padding:2px;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;z-index:1;pointer-events:none}&>div:nth-child(2){position:absolute;inset:0;border-radius:14px;background:rgba(0,0,0,.5);display:grid;place-items:center}}.MagicBorders_box__i_D94:before{content:"";transition:all .2s ease-in;opacity:0;inset:0;position:absolute;background:radial-gradient(250px circle at var(--mouse-x) var(--mouse-y),hsla(0,0%,100%,.1),transparent);z-index:1;pointer-events:none}.MagicBorders_box__i_D94:hover:before{opacity:1}.MagicBorders_box1__yZ3e6{aspect-ratio:1/1;border-radius:16px;backdrop-filter:blur(16px)}.MagicBorders_box2__qH1s7{aspect-ratio:1/1;border-radius:16px;backdrop-filter:blur(16px);&>div:first-child{position:absolute;inset:0;border-radius:15px;background:radial-gradient(250px circle at 0 0,hsla(0,0%,100%,.8) 40%,hsla(0,0%,100%,.2)) padding-box}&>div:nth-child(2){position:absolute;inset:0;border-radius:14px;background:rgba(0,0,0,.5);display:grid;place-items:center}}.MagicBorders_box3__HzTgK{position:relative;aspect-ratio:1/1;border-radius:16px;backdrop-filter:blur(16px);&:nth-child(2){font-size:4rem}&>div:first-child{position:absolute;inset:0;border-radius:15px;transition:all 1.2s ease-in;background:radial-gradient(250px circle at 0 0,hsla(0,0%,100%,.2) 40%,hsla(0,0%,100%,.2)) padding-box;padding:2px;z-index:1}&>div:nth-child(2){position:absolute;inset:1px;border-radius:14px;background:#0a0a0a;display:grid;place-items:center;z-index:1}}.MagicBorders_box4__RcYAr{position:relative;aspect-ratio:1/1;border-radius:16px;backdrop-filter:blur(16px);&:nth-child(2){font-size:4rem}&>div:first-child{position:absolute;inset:0;border-radius:15px;transition:all 1.2s ease-in;background:radial-gradient(250px circle at 0 0,hsla(0,0%,100%,.2) 40%,hsla(0,0%,100%,.2)) padding-box;padding:2px;z-index:1}&>div:nth-child(2){position:absolute;inset:1px;border-radius:14px;background:rgba(0,0,0,.8);display:grid;place-items:center;z-index:1}}