html,body,#root{position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;overflow:hidden}*{margin:0;padding:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}:focus-visible{outline:none}html{font-size:10px}body{font-family:pirulen,sans-serif;font-weight:400;letter-spacing:4px;color:#fff;background-color:#000}a{text-decoration:none;color:currentColor}p{line-height:1.4}@keyframes reflexgroup-with-scale{0%{opacity:0;filter:drop-shadow(0 0 0 #fff)}30%{opacity:1;filter:drop-shadow(0 0 10px #fff)}60%{filter:drop-shadow(0 0 20px #fff)}90%{opacity:1;filter:drop-shadow(0 0 10px #fff);transform:scale(1)}to{opacity:0;filter:drop-shadow(0 0 0 #fff);transform:scale(10)}}@keyframes reflexgroup{0%{opacity:0;filter:drop-shadow(0 0 0 #fff)}30%{opacity:1;filter:drop-shadow(0 0 10px #fff)}60%{filter:drop-shadow(0 0 20px #fff)}90%{opacity:1;filter:drop-shadow(0 0 10px #fff)}to{opacity:0;filter:drop-shadow(0 0 0 #fff)}}@keyframes city{0%{opacity:0}10%{opacity:1}90%{opacity:1}to{opacity:0}}.loading{position:fixed;z-index:10;left:0;top:0;width:100%;height:100%;transition:opacity 4s}.loading.fading{opacity:0}.loading>div{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#000}.loading>div img{width:70%;max-width:600px;filter:drop-shadow(0 0 15px #fff);opacity:0;animation:reflexgroup 4s}@media (min-width: 768px){.loading>div img{width:45%;animation-name:reflexgroup-with-scale}}.loading>div ol{list-style:none;margin-top:45px;padding:0;opacity:.75}.loading>div ol li{margin:0 10px 15px;text-align:center;text-transform:uppercase;letter-spacing:3px;font-size:1rem;opacity:0;animation:city 4s}@media (min-width: 1280px){.loading>div ol li{margin:0 30px;font-size:1.4rem}}.loading>div ol li:nth-child(1){animation-delay:1.2s}.loading>div ol li:nth-child(2){animation-delay:1.4s}.loading>div ol li:nth-child(3){animation-delay:1.6s}.loading>div ol li:nth-child(4){animation-delay:1.8s}.loading>div ol li:nth-child(5){animation-delay:2s}.loading>div ol li:nth-child(6){animation-delay:2.2s}.loading>div ol li:nth-child(7){animation-delay:2.4s}@media (min-width: 1024px){.loading>div ol li{display:inline;margin-bottom:0}}.logo{position:fixed;width:100px;top:5vh;top:5dvh;left:15px}@media (min-width: 768px){.logo{top:30px;left:40px;width:150px}}@media (min-width: 1280px){.logo{width:200px}}.close{width:5vh;width:5dvh;height:5vh;height:5dvh;background:url(/images/close.svg) no-repeat center center/contain;filter:saturate(0) brightness(5);cursor:pointer}@media (min-width: 768px){.close{width:34px;height:34px}}.inverted .logo,.inverted .menu,.inverted .misc,.inverted .menu-toggle,.inverted .joystick{filter:invert(1)}.menu-toggle{position:fixed;top:calc(5vh - 10px);top:calc(5dvh - 10px);right:20px;width:40px;height:40px;background:url(/images/menu.svg?v=1) no-repeat center center/contain}.menu-toggle:after{position:absolute;content:"";top:-15px;right:-15px;bottom:-15px;left:-15px}.menu-toggle.faded{opacity:.5}.menu.mobile{display:none}.menu.mobile.shown{display:flex;flex-direction:column;justify-content:center;align-items:center;position:fixed;z-index:1;top:0;left:0;width:100vw;height:100vh;height:100dvh;background-color:#000000bf}.menu.mobile .close{margin:-10vh 0 10vh;margin:-10dvh 0 10dvh;position:relative}.menu.mobile .close:after{content:"";position:absolute;top:-15px;right:-15px;bottom:-15px;left:-15px}.menu.mobile span{display:block;margin:3vh 0;margin:3dvh 0;text-align:center;text-transform:uppercase;font-size:1.6rem}.menu.mobile .music{margin-top:10vh;margin-top:10dvh;width:50px;height:50px}.menu.mobile .music.muted{opacity:.6}.menu.desktop{position:fixed;top:40px;right:40px;display:flex;justify-content:flex-end;align-items:center}.menu.desktop span{display:inline-block;margin-right:15px;border:2px solid #fff;border-radius:20px;padding:8px 15px;text-transform:uppercase;text-align:center;font-size:.8rem;opacity:.5;transition:all .4s;cursor:pointer}.menu.desktop span:hover{opacity:1}.menu.desktop .close{border:none}.menu.desktop .close:hover{filter:none}.menu.desktop.faded{opacity:.5}@media (max-width: 767.9px){.menu.desktop{display:none}}.misc.mobile{display:none}.misc.desktop{position:fixed;z-index:5;bottom:40px;left:40px;display:flex;justify-content:flex-start}.misc>img{width:25px;height:25px;margin-right:15px;border:1px solid #fff;border-radius:50%}.misc>img:nth-child(1){cursor:pointer}@media (pointer: coarse){.misc>img:nth-child(2){display:none}}.misc>img.muted{opacity:.6}.misc .instruction{position:absolute;bottom:30px;left:70px;border:1px solid #fff;border-radius:20px 20px 20px 0;padding:15px;background-color:#000;opacity:0;visibility:hidden;width:300px;overflow:hidden;transition:opacity .4s}.misc .instruction.hovered{visibility:visible;opacity:1}.joystick{position:fixed;bottom:40px;left:36vw;width:28vw;height:28vw;border-radius:50%;border:1px solid #fff;background:url(/images/arrows.svg) no-repeat center center/120% 120%}@media (min-width: 768px){.joystick{width:120px;height:120px;left:calc(50% - 60px)}}.joystick.hidden{opacity:0}.joystick>div{position:absolute;left:30%;top:30%;width:40%;height:40%;border-radius:50%;background-color:#666;border:1px solid #fff;transition:transform .1s}.joystick>div.active{animation:flash .4s infinite alternate}.reflex-verse{height:100vh;height:100dvh}.reflex-verse.initial{filter:brightness(.5)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.man-avatar-view,.woman-avatar-view{position:fixed;z-index:1;cursor:pointer}.man-avatar-view>div,.woman-avatar-view>div{height:100%;outline:3px solid transparent;transition:outline-color .4s;background-color:#000000bf}.man-avatar-view canvas,.woman-avatar-view canvas{transition:transform .2s}.man-avatar-view img,.woman-avatar-view img{width:100%;height:100%;padding:min(15vw,45px);object-fit:contain;background-color:#000000bf}@media (pointer: fine){.man-avatar-view:hover>div,.woman-avatar-view:hover>div{outline-color:#fff}.man-avatar-view:hover canvas,.woman-avatar-view:hover canvas{transform:scale(1.1)}}.man-avatar-view~.instruction>div,.woman-avatar-view~.instruction>div{position:absolute;right:0;bottom:-10px;margin:0;animation-duration:16s;animation-iteration-count:infinite}.man-avatar-view~.instruction>div:nth-child(1),.woman-avatar-view~.instruction>div:nth-child(1){animation-name:switch1}.man-avatar-view~.instruction>div:nth-child(2),.woman-avatar-view~.instruction>div:nth-child(2){animation-name:switch2}.man-avatar-view~.instruction>div:nth-child(3),.woman-avatar-view~.instruction>div:nth-child(3){animation-name:switch3}.man-avatar-view~.instruction>div:nth-child(4),.woman-avatar-view~.instruction>div:nth-child(4){animation-name:switch4}@media (max-width: 1023.9px){.man-avatar-view,.woman-avatar-view{top:15vh;top:15dvh;height:70vh;height:70dvh;width:42vh;width:42dvh;left:calc(50vw - 21vh);left:calc(50vw - 21dvh)}.man-avatar-view>div,.woman-avatar-view>div{animation:fade-in 3s forwards;background-color:#00000060}.man-avatar-view.hidden,.woman-avatar-view.hidden{z-index:0}.man-avatar-view.hidden.man-avatar-view canvas,.woman-avatar-view.hidden.man-avatar-view canvas{transform:translate(-36vh);transform:translate(-36dvh)}.man-avatar-view.hidden.woman-avatar-view canvas,.woman-avatar-view.hidden.woman-avatar-view canvas{transform:translate(36vh);transform:translate(36dvh)}}@media (min-width: 1024px){.man-avatar-view,.woman-avatar-view{top:15vh;top:15dvh;height:70vh;height:70dvh;width:40vh;width:40dvh}.man-avatar-view.man-avatar-view,.woman-avatar-view.man-avatar-view{left:auto;right:55vw}.man-avatar-view.woman-avatar-view,.woman-avatar-view.woman-avatar-view{left:55vw;right:auto}}@media (min-width: 1280px){.man-avatar-view.man-avatar-view,.woman-avatar-view.man-avatar-view{right:calc(50vw + 15vh);right:calc(50vw + 15dvh)}.man-avatar-view.woman-avatar-view,.woman-avatar-view.woman-avatar-view{left:calc(50vw + 15vh);left:calc(50vw + 15dvh)}}@media (max-width: 1023.9px){.picker-dots{position:fixed;bottom:20vh;bottom:20dvh;left:0;width:100vw;display:flex;justify-content:center;opacity:0;animation:fade-in 2s 2s forwards}.picker-dots span{display:block;margin:0 10px;width:12px;height:12px;border:1px solid #fff;border-radius:50%}.picker-dots span.active{background-color:#fff}}@media (min-width: 1024px){.picker-dots{display:none}}@keyframes flash{0%{opacity:0}to{opacity:1}}.indication{position:fixed;left:0;right:0;height:25px;bottom:30px;margin:0;text-transform:uppercase;text-align:center;font-size:1rem;letter-spacing:5px;line-height:25px;animation:flash .4s infinite alternate;font-family:Manrope,sans-serif}@media (min-width: 768px){.indication{bottom:40px;font-size:1.4rem}}@keyframes switch1{0%{opacity:0}3%{opacity:1}22%{opacity:1}25%{opacity:0}to{opacity:0}}@keyframes switch2{0%{opacity:0}25%{opacity:0}28%{opacity:1}47%{opacity:1}50%{opacity:0}to{opacity:0}}@keyframes switch3{0%{opacity:0}50%{opacity:0}53%{opacity:1}72%{opacity:1}75%{opacity:0}to{opacity:0}}@keyframes switch4{0%{opacity:0}75%{opacity:0}78%{opacity:1}97%{opacity:1}to{opacity:0}}.instruction{position:fixed;right:40px;bottom:40px;font-family:Manrope,sans-serif;letter-spacing:1px}@media (pointer: coarse){.instruction{display:none}}.instruction>div{display:flex;justify-content:center;align-items:center;margin:20px 0}.instruction>div img{max-height:75px;object-fit:contain;width:80px;padding:0 20px}.instruction>div p{width:130px;margin-left:20px;font-size:1.2rem}@media (min-width: 1280px){.instruction>div p{font-size:1.3rem}}.instruction>div:nth-child(1) img{padding:0 15px}.instruction>div:nth-child(2) img{padding:0}.project-detail p,.project-detail span,.ai-image-detail p,.ai-image-detail span{font-family:Manrope,sans-serif;letter-spacing:1px}.project-detail>.close,.ai-image-detail>.close{position:absolute;left:50%;top:12vh;top:12dvh;transform:translate(-50%);transition:transform .2s}@media (pointer: fine){.project-detail>.close:hover,.ai-image-detail>.close:hover{transform:translate(-50%) scale(1.4)}}@media (min-width: 768px){.project-detail>.close,.ai-image-detail>.close{top:40px}}.project-detail .text-popup,.project-detail .popup,.ai-image-detail .text-popup,.ai-image-detail .popup{opacity:0;transition:all .2s}.project-detail>.arrow,.ai-image-detail>.arrow{display:block;position:absolute;top:calc(50% - 40px);width:60px;height:80px;margin:0;cursor:pointer;transition:transform .4s;background-repeat:no-repeat;background-size:contain}.project-detail>.arrow.arrow-left,.ai-image-detail>.arrow.arrow-left{left:0;background-position:left center;background-image:url(../images/arrow-left.svg)}.project-detail>.arrow.arrow-right,.ai-image-detail>.arrow.arrow-right{right:0;background-position:right center;background-image:url(../images/arrow-right.svg)}@media (pointer: fine){.project-detail>.arrow:hover,.ai-image-detail>.arrow:hover{transform:scale(1.4)}}@media (min-width: 768px){.project-detail>.arrow.arrow-left,.ai-image-detail>.arrow.arrow-left{left:30px}.project-detail>.arrow.arrow-right,.ai-image-detail>.arrow.arrow-right{right:30px}}@media (max-width: 767.9px){.project-detail>.border-wrapper:first-of-type,.ai-image-detail>.border-wrapper:first-of-type{display:none}.project-detail .text-toggle,.ai-image-detail .text-toggle{position:absolute;width:calc(100vw - 60px);text-align:center;text-transform:uppercase;font-family:pirulen,sans-serif;font-size:1rem;letter-spacing:.4em}.project-detail .text-toggle .border-wrapper,.ai-image-detail .text-toggle .border-wrapper{padding:8px}.project-detail .text-toggle .border-wrapper,.project-detail .text-toggle .border-wrapper .border,.ai-image-detail .text-toggle .border-wrapper,.ai-image-detail .text-toggle .border-wrapper .border{border-radius:30px}.project-detail .text-popup,.project-detail .popup,.ai-image-detail .text-popup,.ai-image-detail .popup{position:absolute;z-index:1;top:10vh;top:10dvh;left:15px;right:15px;height:0;margin:0;border-radius:3vh;border-radius:3dvh}.project-detail .text-popup .close,.project-detail .popup .close,.ai-image-detail .text-popup .close,.ai-image-detail .popup .close{position:absolute;top:4.4vh;top:4.4dvh;width:3vh;width:3dvh;height:3vh;height:3dvh;left:50%;transform:translate(-50%,-50%)}.project-detail .text-popup.active,.project-detail .popup.active,.ai-image-detail .text-popup.active,.ai-image-detail .popup.active{opacity:1;height:calc(30vh + 82vw + 26px);height:calc(30dvh + 82vw + 26px)}.project-detail .text-popup,.ai-image-detail .text-popup{border:1px solid #fff;padding:30px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background-color:#000000f2}.project-detail .text-popup p,.project-detail .text-popup span,.ai-image-detail .text-popup p,.ai-image-detail .text-popup span{font-size:1.4rem}.project-detail .text-popup p,.ai-image-detail .text-popup p{margin:25px 0}.project-detail .text-popup p,.project-detail .text-popup p~span,.ai-image-detail .text-popup p,.ai-image-detail .text-popup p~span{width:100%}}@media (min-width: 768px){.project-detail .text-toggle,.project-detail .text-text,.ai-image-detail .text-toggle,.ai-image-detail .text-text{display:none}}.project-detail{position:fixed;z-index:1;top:0;bottom:0;left:0;right:0;display:flex}.project-detail>.popup{position:absolute;z-index:1;height:0;margin:0;border:2px solid #fff;overflow:hidden;background-color:#000;opacity:0}.project-detail>.popup img,.project-detail>.popup iframe{width:100%;height:100%;object-fit:cover}.project-detail>.popup .close{position:absolute;border-radius:50%;background-color:#000000bf}.project-detail>.popup.active{opacity:1}@media (max-width: 767.9px){.project-detail{flex-direction:column}.project-detail>div{margin:0 30px}.project-detail>div:nth-child(2){margin:27vh auto calc(13vh + 26px);margin:27dvh auto calc(13dvh + 26px);width:70vw;height:70vw}.project-detail>div:nth-child(3){display:flex;justify-content:space-between}.project-detail>div:nth-child(3)>div{width:25vw;height:12vw;cursor:pointer}.project-detail>div:nth-child(3)>div img,.project-detail>div:nth-child(3)>div iframe{width:100%;height:100%;object-fit:cover;background-color:#000000bf}.project-detail .text-toggle{top:calc(70vw + 37vh);top:calc(70vw + 37dvh)}.project-detail .arrow{top:calc(27vh + 35vw - 40px);top:calc(27dvh + 35vw - 40px)}}@media (min-width: 768px){.project-detail{justify-content:center;align-items:stretch;padding:20vh 0;padding:20dvh 0}.project-detail>div{margin:0 2vw}.project-detail>div:nth-child(1),.project-detail>div:nth-child(3){width:max(35vh,250px);width:max(35dvh,250px)}.project-detail>div:nth-child(1) .introduction{height:100%;padding:30px;border-radius:50%/25%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#000000bf}.project-detail>div:nth-child(1) .introduction>*{transform:translate(-5vw);transition:transform .4s}.project-detail>div:nth-child(1) .introduction h1{margin-top:0;text-align:center;font-size:1.4rem;font-weight:600;transition-delay:2s}}@media (min-width: 768px) and (min-width: 1280px){.project-detail>div:nth-child(1) .introduction h1{font-size:1.8rem}}@media (min-width: 768px) and (min-width: 1280px){.project-detail>div:nth-child(1) .introduction p,.project-detail>div:nth-child(1) .introduction span{font-size:1.2rem}}@media (min-width: 768px){.project-detail>div:nth-child(1) .introduction p{margin:25px 0;transition-delay:2.2s;max-height:30vh;max-height:30dvh;overflow-y:auto;scrollbar-color:#999 #fff;scrollbar-width:thin}.project-detail>div:nth-child(1) .introduction p::-webkit-scrollbar{width:3px;background-color:#999}.project-detail>div:nth-child(1) .introduction p::-webkit-scrollbar-thumb{background-color:#fff}.project-detail>div:nth-child(1) .introduction span{width:100%;text-align:left;line-height:1.4;transition-delay:2.4s}.project-detail>div:nth-child(2){min-width:60vh;min-width:60dvh;width:60vh;width:60dvh}.project-detail>div:nth-child(3){display:flex;flex-direction:column;justify-content:space-between}.project-detail>div:nth-child(3)>div{height:18vh;height:18dvh;cursor:pointer;transition:transform .2s}.project-detail>div:nth-child(3)>div:hover{transform:scale(1.1)}.project-detail>div:nth-child(3)>div img,.project-detail>div:nth-child(3)>div iframe{width:100%;height:100%;object-fit:cover;background-color:#000000bf}.project-detail>.popup{top:20vh;top:20dvh;right:calc(50vw - 85vh);right:calc(50vw - 85dvh);border-radius:8vh;border-radius:8dvh}.project-detail>.popup.active{width:115vh;width:115dvh;height:60vh;height:60dvh}.project-detail>.popup .close{right:3vh;right:3dvh;top:3vh;top:3dvh}}.project-detail>.background{position:absolute;z-index:-1;margin:0;width:100%;left:0;border:none;opacity:0;transition:opacity 1s 3s}@media (max-width: 767.9px){.project-detail>.background{top:calc(-48vh + 35vw);top:calc(-48dvh + 35vw);height:150vh;height:150dvh;background:url(/images/clip-vertical.png?=3) no-repeat center center/100% auto}}@media (min-width: 768px){.project-detail>.background{top:0;height:100vh;height:100dvh;background:url(/images/clip-horizontal.png) no-repeat center center/auto 100%}}.project-detail.active>div:nth-child(1) .introduction>*{transform:translate(0)}.project-detail.active>.background{opacity:1}.ai-image-detail{position:fixed;z-index:1;top:0;bottom:0;left:0;right:0;padding:20vh 0;padding:20dvh 0;filter:invert(1)}@media (max-width: 767.9px){.ai-image-detail{display:flex;flex-direction:column;align-items:center}.ai-image-detail .text-toggle{bottom:calc(61vh - 82vw - 26px);bottom:calc(61dvh - 82vw - 26px)}}@media (min-width: 768px){.ai-image-detail .border-wrapper{display:flex;justify-content:center;align-items:center;position:absolute;bottom:25px;left:50%;width:500px;padding:10px 20px;text-align:center;transform:translate(-50%);background-color:#000000bf}.ai-image-detail .border-wrapper,.ai-image-detail .border-wrapper .border{border-color:currentColor;border-radius:30px!important}}@keyframes start-from-top-center{0%{clip-path:polygon(50% 0,50% 0,50% 0,50% 0,50% 0,50% 0)}25%{clip-path:polygon(50% 0,100% 0,100% 50%,50% 50%,50% 0,50% 0)}50%{clip-path:polygon(50% 0,100% 0,100% 100%,50% 100%,50% 0,50% 0)}75%{clip-path:polygon(50% 0,100% 0,100% 100%,0 100%,0 50%,50% 50%)}to{clip-path:polygon(50% 0,100% 0,100% 100%,0 100%,0 0,50% 0)}}@keyframes start-from-bottom-center{0%{clip-path:polygon(50% 100%,50% 100%,50% 100%,50% 100%,50% 100%,50% 100%)}25%{clip-path:polygon(50% 100%,0 100%,0 50%,50% 50%,50% 50%,50% 50%)}50%{clip-path:polygon(50% 100%,0 100%,0 0,50% 0,50% 0,50% 0)}75%{clip-path:polygon(50% 100%,0 100%,0 0,100% 0,100% 50%,50% 50%)}to{clip-path:polygon(50% 100%,0 100%,0 0,100% 0,100% 100%,100% 100%)}}.border-wrapper{position:relative;overflow:hidden}.border-wrapper .border{border:2px solid #fff;position:absolute;left:0;top:0;width:100%;height:100%}.border-wrapper .border~*{opacity:0;transition:opacity 1s 2s}.border-wrapper.circle,.border-wrapper.circle .border{border-radius:50%}.border-wrapper.vertical,.border-wrapper.vertical .border{border-radius:50%/25%}.border-wrapper.horizontal,.border-wrapper.horizontal .border{border-radius:25%/50%}.border-wrapper.circle .border,.border-wrapper.horizontal .border{clip-path:polygon(50% 0,50% 0,50% 0,50% 0,50% 0,50% 0)}.border-wrapper.vertical .border{clip-path:polygon(50% 100%,50% 100%,50% 100%,50% 100%,50% 100%,50% 100%)}.border-wrapper.active.circle .border,.border-wrapper.active.horizontal .border{animation:start-from-top-center 2s 1s linear forwards}.border-wrapper.active.vertical .border{animation:start-from-bottom-center 2s 1s linear forwards}.border-wrapper.active .border~*{opacity:1}.mobile-alert{position:fixed;z-index:15;left:0;top:0;width:100vw;height:100vh;height:100dvh;justify-content:center;align-items:center;text-transform:uppercase;font-size:1.8rem;display:none;background-color:#000}@media ((max-height: 600px) and (orientation: landscape)){.mobile-alert{display:flex}}