*{box-sizing:border-box;user-select:none;border:none;margin:0;padding:0}html,body{background:#000;width:100%;height:100%;margin:0;padding:0;position:fixed;top:0;left:0;overflow:hidden}canvas{z-index:0;width:100vw;height:100vh;display:block;position:fixed;top:0;left:0}#root{z-index:1;width:100vw;height:100vh;position:fixed;top:0;left:0}#info{mix-blend-mode:difference;user-select:none;color:#fff;font-family:Josefin Sans,sans-serif;font-size:1.2rem;position:absolute;top:2.5rem;left:3.5rem}#info2{mix-blend-mode:difference;user-select:none;color:#fff;text-align:right;font-family:Josefin Sans,sans-serif;font-size:1rem;position:absolute;bottom:1.5rem;right:2rem}.infoitem{margin:.3rem;display:inline-block}.tubiao{--balloon-color:#101010f2;--balloon-text-color:#fff;--balloon-font-size:5px;--balloon-move:0px;cursor:pointer;vertical-align:middle;opacity:.8;width:1em;height:1em;text-decoration:none;transform:translateY(-.08em)}.glitch{text-transform:uppercase;color:#fff;letter-spacing:8px;z-index:2;mix-blend-mode:difference;user-select:none;text-align:center;font-family:Josefin Sans,sans-serif;font-size:5em;font-weight:bolder;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.glitch-container{z-index:2;flex-direction:column;justify-content:center;align-items:center;gap:.1em;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.glitch-top,.glitch-bottom{text-transform:uppercase;color:#fff;letter-spacing:8px;mix-blend-mode:difference;user-select:none;text-align:center;width:100%;margin:0;padding:0;font-family:Josefin Sans,sans-serif;font-size:5em;font-weight:bolder;line-height:.85;display:block;position:relative}.glitch-top:after,.glitch-bottom:after{content:attr(data-text);text-shadow:-1px 0 red;color:#fff;clip:rect(0,900px,0,0);text-align:center;background:0 0;width:100%;height:100%;animation:2s linear infinite alternate-reverse noise-anim;position:absolute;top:0;left:0;overflow:hidden;transform:translate(2px)}.glitch-top:before,.glitch-bottom:before{content:attr(data-text);text-shadow:1px 0 #00f;color:#fff;clip:rect(0,900px,0,0);text-align:center;background:0 0;width:100%;height:100%;animation:3s linear infinite alternate-reverse noise-anim-2;position:absolute;top:0;left:0;overflow:hidden;transform:translate(-2px)}@media (width<=620px){.glitch-top,.glitch-bottom{letter-spacing:6px;font-size:4.2em}.glitch-container{gap:.05em}}@media (width<=480px){.glitch-top,.glitch-bottom{letter-spacing:4px;font-size:3.5em}}@media (width>=1400px){.glitch{letter-spacing:12px;font-size:6em}}@keyframes noise-anim{0%{clip:rect(23px,9999px,57px,0)}5%{clip:rect(74px,9999px,22px,0)}10%{clip:rect(42px,9999px,81px,0)}15%{clip:rect(11px,9999px,35px,0)}20%{clip:rect(68px,9999px,35px,0)}25%{clip:rect(29px,9999px,72px,0)}30%{clip:rect(57px,9999px,13px,0)}35%{clip:rect(8px,9999px,45px,0)}40%{clip:rect(78px,9999px,40px,0)}45%{clip:rect(51px,9999px,85px,0)}50%{clip:rect(63px,9999px,27px,0)}55%{clip:rect(16px,9999px,64px,0)}60%{clip:rect(49px,9999px,37px,0)}65%{clip:rect(32px,9999px,53px,0)}70%{clip:rect(83px,9999px,17px,0)}75%{clip:rect(45px,9999px,65px,0)}80%{clip:rect(20px,9999px,41px,0)}85%{clip:rect(60px,9999px,29px,0)}90%{clip:rect(39px,9999px,77px,0)}95%{clip:rect(54px,9999px,10px,0)}to{clip:rect(13px,9999px,54px,0)}}.glitch:after{content:attr(data-text);text-shadow:-1px 0 red;color:#fff;clip:rect(0,900px,0,0);background:0 0;width:100%;height:100%;animation:2s linear infinite alternate-reverse noise-anim;position:absolute;top:0;left:2px;overflow:hidden}.glitch:before{content:attr(data-text);text-shadow:1px 0 #00f;color:#fff;clip:rect(0,900px,0,0);background:0 0;width:100%;height:100%;animation:3s linear infinite alternate-reverse noise-anim-2;position:absolute;top:0;left:-2px;overflow:hidden}@keyframes noise-anim-2{0%{clip:rect(44px,9999px,18px,0)}5%{clip:rect(76px,9999px,56px,0)}10%{clip:rect(28px,9999px,80px,0)}15%{clip:rect(61px,9999px,12px,0)}20%{clip:rect(20px,9999px,61px,0)}25%{clip:rect(81px,9999px,43px,0)}30%{clip:rect(35px,9999px,71px,0)}35%{clip:rect(51px,9999px,30px,0)}40%{clip:rect(13px,9999px,54px,0)}45%{clip:rect(70px,9999px,23px,0)}50%{clip:rect(40px,9999px,77px,0)}55%{clip:rect(64px,9999px,44px,0)}60%{clip:rect(24px,9999px,64px,0)}65%{clip:rect(78px,9999px,30px,0)}70%{clip:rect(49px,9999px,83px,0)}75%{clip:rect(9px,9999px,47px,0)}80%{clip:rect(65px,9999px,16px,0)}85%{clip:rect(33px,9999px,72px,0)}90%{clip:rect(57px,9999px,36px,0)}95%{clip:rect(21px,9999px,58px,0)}to{clip:rect(84px,9999px,49px,0)}}a{color:#f5f5f5;text-decoration:none!important}a:hover{transition:color .3s;color:#c4a7ff!important}#info a:hover,#info2 a:hover{color:#b794ff!important}a,button,[role=button],.tubiao,a:hover,button:hover,[role=button]:hover,.tubiao:hover{cursor:pointer}.glitch-intense{filter:contrast(1.3)brightness(1.2);animation:.6s ease-in-out glitch-shake-3d,.6s ease-in-out glitch-skew}.glitch-intense:after{filter:hue-rotate();animation-timing-function:cubic-bezier(.25,.46,.45,.94);text-shadow:-4px 0 red,4px 0 #0ff,2px 2px #f0f!important;animation:80ms linear infinite alternate-reverse noise-anim-intense,.6s ease-in-out glitch-color-shift-1,.6s ease-in-out glitch-x-shift-1!important}.glitch-intense:before{filter:hue-rotate(180deg);animation-timing-function:cubic-bezier(.55,.085,.68,.53);text-shadow:4px 0 #00f,-4px 0 #0f0,-2px -2px #ff0!important;animation:.12s linear infinite alternate-reverse noise-anim-intense-2,.6s ease-in-out glitch-color-shift-2,.6s ease-in-out glitch-x-shift-2!important}@keyframes glitch-shake-3d{0%,to{transform:translate(-50%,-50%)rotateX(0)rotateY(0)scale(1)}8%{transform:translate(calc(-50% - 4px),calc(2px - 50%))rotateX(1deg)rotateY(-1.5deg)scale(1.01)}16%{transform:translate(calc(3px - 50%),calc(-50% - 2px))rotateX(-1.5deg)rotateY(1deg)scale(.99)}24%{transform:translate(calc(-50% - 2px),calc(-50% - 3px))rotateX(.5deg)rotateY(2deg)scale(1.01)}32%{transform:translate(calc(4px - 50%),calc(1px - 50%))rotateX(-1deg)rotateY(-1deg)scale(.99)}40%{transform:translate(calc(-50% - 3px),calc(3px - 50%))rotateX(1.5deg)rotateY(.5deg)scale(1.005)}48%{transform:translate(calc(2px - 50%),calc(-50% - 2px))rotateX(-.5deg)rotateY(-2deg)scale(.995)}56%{transform:translate(calc(-50% - 4px),calc(1px - 50%))rotateX(1deg)rotateY(1.5deg)scale(1.01)}64%{transform:translate(calc(3px - 50%),calc(-50% - 3px))rotateX(-1.5deg)rotateY(-.5deg)scale(.99)}72%{transform:translate(calc(-50% - 1px),calc(2px - 50%))rotateX(.5deg)rotateY(1deg)scale(1.005)}80%{transform:translate(calc(2px - 50%),calc(-50% - 1px))rotateX(-1deg)rotateY(-1.5deg)scale(.995)}88%{transform:translate(calc(-50% - 3px),calc(4px - 50%))rotateX(1.5deg)rotateY(.5deg)scale(1.01)}96%{transform:translate(calc(1px - 50%),calc(-50% - 1px))rotateX(-.5deg)rotateY(-1deg)scale(.99)}}@keyframes glitch-skew{0%,to{transform:translate(-50%,-50%)skew(0)skewY(0)}10%{transform:translate(-50%,-50%)skew(-3deg)skewY(1deg)}20%{transform:translate(-50%,-50%)skew(2deg)skewY(-2deg)}30%{transform:translate(-50%,-50%)skew(-1deg)skewY(3deg)}40%{transform:translate(-50%,-50%)skew(4deg)skewY(-1deg)}50%{transform:translate(-50%,-50%)skew(-2deg)skewY(2deg)}60%{transform:translate(-50%,-50%)skew(1deg)skewY(-3deg)}70%{transform:translate(-50%,-50%)skew(-4deg)skewY(1deg)}80%{transform:translate(-50%,-50%)skew(3deg)skewY(-2deg)}90%{transform:translate(-50%,-50%)skew(-1deg)skewY(2deg)}}@keyframes noise-anim-intense{0%{clip:rect(54px,9999px,11px,0)}4%{clip:rect(17px,9999px,68px,0)}8%{clip:rect(79px,9999px,33px,0)}12%{clip:rect(40px,9999px,82px,0)}16%{clip:rect(12px,9999px,42px,0)}20%{clip:rect(64px,9999px,25px,0)}24%{clip:rect(49px,9999px,75px,0)}28%{clip:rect(8px,9999px,32px,0)}32%{clip:rect(83px,9999px,59px,0)}36%{clip:rect(21px,9999px,15px,0)}40%{clip:rect(63px,9999px,68px,0)}44%{clip:rect(19px,9999px,25px,0)}48%{clip:rect(74px,9999px,52px,0)}52%{clip:rect(36px,9999px,19px,0)}56%{clip:rect(58px,9999px,85px,0)}60%{clip:rect(15px,9999px,37px,0)}64%{clip:rect(69px,9999px,27px,0)}68%{clip:rect(36px,9999px,77px,0)}72%{clip:rect(59px,9999px,13px,0)}76%{clip:rect(25px,9999px,61px,0)}80%{clip:rect(76px,9999px,38px,0)}84%{clip:rect(51px,9999px,87px,0)}88%{clip:rect(18px,9999px,44px,0)}92%{clip:rect(62px,9999px,30px,0)}96%{clip:rect(34px,9999px,72px,0)}to{clip:rect(83px,9999px,22px,0)}}@keyframes noise-anim-intense-2{0%{clip:rect(38px,9999px,14px,0)}4%{clip:rect(79px,9999px,57px,0)}8%{clip:rect(23px,9999px,83px,0)}12%{clip:rect(67px,9999px,28px,0)}16%{clip:rect(11px,9999px,50px,0)}20%{clip:rect(85px,9999px,35px,0)}24%{clip:rect(34px,9999px,66px,0)}28%{clip:rect(58px,9999px,20px,0)}32%{clip:rect(16px,9999px,72px,0)}36%{clip:rect(70px,9999px,42px,0)}40%{clip:rect(29px,9999px,80px,0)}44%{clip:rect(52px,9999px,9px,0)}48%{clip:rect(8px,9999px,59px,0)}52%{clip:rect(77px,9999px,49px,0)}56%{clip:rect(32px,9999px,18px,0)}60%{clip:rect(63px,9999px,76px,0)}64%{clip:rect(25px,9999px,46px,0)}68%{clip:rect(82px,9999px,31px,0)}72%{clip:rect(52px,9999px,86px,0)}76%{clip:rect(13px,9999px,35px,0)}80%{clip:rect(67px,9999px,22px,0)}84%{clip:rect(32px,9999px,69px,0)}88%{clip:rect(55px,9999px,36px,0)}92%{clip:rect(19px,9999px,58px,0)}96%{clip:rect(73px,9999px,47px,0)}to{clip:rect(35px,9999px,16px,0)}}@keyframes glitch-x-shift-1{0%,to{transform:translate(0)}10%{transform:translate(-9.6px)}20%{transform:translate(8px)}30%{transform:translate(-6.4px)}40%{transform:translate(12px)}50%{transform:translate(-8px)}60%{transform:translate(6.4px)}70%{transform:translate(-12px)}80%{transform:translate(9.6px)}90%{transform:translate(-4.8px)}}@keyframes glitch-x-shift-2{0%,to{transform:translate(0)}10%{transform:translate(12px)}20%{transform:translate(-9.6px)}30%{transform:translate(8px)}40%{transform:translate(-11.2px)}50%{transform:translate(6.4px)}60%{transform:translate(-8px)}70%{transform:translate(10.4px)}80%{transform:translate(-6.4px)}90%{transform:translate(5.6px)}}@keyframes glitch-color-shift-1{0%,to{text-shadow:-1px 0 red}10%{text-shadow:-8px 2px red,4px -2px #0ff}20%{text-shadow:6px -3px #f0f,-6px 3px #ff0}30%{text-shadow:-7px 1px #f06,5px -1px #0f9}40%{text-shadow:9px -2px #90f,-4px 2px #fc0}50%{text-shadow:-5px 3px #f30,7px -3px #0cf}60%{text-shadow:8px 1px #c0f,-8px -1px #6f0}70%{text-shadow:-6px -2px #f09,6px 2px #0fc}80%{text-shadow:4px 3px #f60,-5px -3px #09f}90%{text-shadow:-9px 1px #c0c,3px -1px #cf0}}@keyframes glitch-color-shift-2{0%,to{text-shadow:1px 0 #00f}10%{text-shadow:9px -2px #00f,-5px 2px #0f0}20%{text-shadow:-7px 3px #0ff,7px -3px red}30%{text-shadow:6px 1px #06f,-6px -1px #f90}40%{text-shadow:-8px -2px #0f9,4px 2px #f06}50%{text-shadow:5px 3px #09f,-7px -3px #f30}60%{text-shadow:-9px 1px #0cf,8px -1px #f0c}70%{text-shadow:7px -3px #00c,-4px 3px #fc0}80%{text-shadow:-6px 2px #0f6,9px -2px #c09}90%{text-shadow:4px -1px #0cc,-8px 1px #f60}}
