@property --blink-opacity{syntax:"<number>";inherits:false;initial-value:1}@keyframes blink-animation{0%,to{opacity:var(--blink-opacity,1)}50%{opacity:0}}@keyframes smoothBg{0%{background-position:50% 50%,50% 50%}to{background-position:350% 50%,350% 50%}}:root{--stripe-color:#fff;--bg:var(--stripe-color);--maincolor:var(--bg)}.wrapper{height:auto}.hero,.wrapper{position:relative;width:100%}.hero{display:flex;min-height:100vh;place-content:center;place-items:center;--stripes:repeating-linear-gradient(100deg,var(--stripe-color) 0%,var(--stripe-color) 7%,transparent 10%,transparent 12%,var(--stripe-color) 16%);--rainbow:repeating-linear-gradient(100deg,#b9d6ff 10%,#d5fffe 20%,#cce4ff 0,#befff5 25%,#60a5fa 30%);background-image:var(--stripes),var(--rainbow);background-position:50% 50%,50% 50%;background-size:500%,200%;filter:blur(20px) invert(100%);-webkit-mask-image:radial-gradient(ellipse at 100% 0,#000 40%,transparent 70%);mask-image:radial-gradient(ellipse at 100% 0,#000 40%,transparent 70%)}.hero:after{animation:smoothBg 120s linear infinite;background-attachment:fixed;background-image:var(--stripes),var(--rainbow);background-size:400%,100%;content:"";top:0;right:0;bottom:0;left:0;mix-blend-mode:difference;position:absolute}@media only screen and (min-width:768px){{animation:smoothBg 100s linear infinite;background-size:200%,100%}}:has(:checked){--stripe-color:#000}:has(:checked) .hero,:has(:checked) .hero:after{filter:blur(10px) opacity(50%) saturate(200%)}.content{flex-flow:column;height:100%;top:0;right:0;bottom:0;left:0;place-content:center;place-items:center;position:absolute;text-align:center;width:100%}