*{padding:0;margin:0;box-sizing:border-box}:root{--background-color: #f4f4f4;--text-color: #000000;--menu-gradient: linear-gradient(to bottom, #f4f4f4 65%, transparent);--bottom-menu-gradient: linear-gradient(to top, #f4f4f4 70%, transparent);--highlight-color: rgb(6, 237, 195);--button-color: black;--modal-bg: white;--modal-text: black;--border-color: black;--line-color: rgba(0, 0, 0, .2);--icon-color: #000000}.dark{--background-color: #171617;--text-color: #ffffff;--menu-gradient: linear-gradient(to bottom, #121212 65%, transparent);--bottom-menu-gradient: linear-gradient(to top, #121212 70%, transparent);--highlight-color: #bb86fc;--button-color: white;--modal-bg: #1e1e1e;--modal-text: #ffffff;--border-color: #ffffff;--line-color: rgba(255, 255, 255, .2);--icon-color: white}body{font-family:Figtree,sans-serif;font-optical-sizing:auto;font-weight:300;font-style:normal;background-color:var(--background-color);color:var(--text-color);height:100vh;display:flex;align-items:center;justify-content:center;text-align:center}h2{font-family:Remixa,sans-serif;letter-spacing:.05ch}::selection{background-color:var(--highlight-color);color:#000}a,a:visited{color:inherit;text-decoration:none}a:hover,a:active{color:#bb86fc;text-decoration:none}button{font-family:Figtree,sans-serif;border-radius:20px;border:none;background-color:transparent;border:#545555 solid .1rem;padding:.6em 1.2em;cursor:pointer;color:var(--button-color);-webkit-tap-highlight-color:transparent}.animated-name{display:inline-block;font-size:3rem;font-weight:700;font-family:Inter,sans-serif;letter-spacing:.05em;cursor:default}.letter{display:inline-block;transition:transform .4s ease,opacity .4s ease}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;padding-top:5vh;overflow-y:auto;align-items:center;justify-content:center;z-index:10}.menu-button{cursor:pointer;color:var(--icon-color)}.modal-border{padding:1px;border-radius:24px;box-shadow:0 0 15px 15px #fff;background:var(--modal-bg)}.modal-content{position:relative;background:var(--modal-bg);color:var(--modal-text);border-radius:18px;padding:2rem 2rem 6rem;color:#000;max-width:80%;max-height:90vh;overflow-y:auto;text-align:left;box-shadow:0 0 15px 15px #fff}.dark .modal-content{box-shadow:0 0 15px 15px #59555500}.back-home{height:30px;color:var(--icon-color)}.modal-content::-webkit-scrollbar{display:none}.modal-content img{max-width:100%;margin:1rem 0}.carousel-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.carousel-container{display:flex;overflow-x:scroll;scroll-snap-type:x mandatory;scroll-behavior:smooth;width:100%;max-height:600px}.carousel-container::-webkit-scrollbar{display:none}.carousel-image{flex:0 0 100%;scroll-snap-align:center;width:100%;height:auto;object-fit:contain;margin:0}.arrow{position:absolute;top:50%;transform:translateY(-50%);font-size:2rem;background:none;border:none;color:#000;opacity:.5;cursor:pointer;z-index:5;transition:opacity .3s}.arrow-left:hover,.arrow-right:hover{opacity:.5}.arrow-left{left:-30px;height:50px;cursor:pointer;color:var(--icon-color)}.arrow-right{right:-30px;height:50px;cursor:pointer;color:var(--icon-color)}.arrow-left:hover,.arrow-right:hover{animation:iconcolor 3s infinite alternate}.carousel-lines{display:flex;justify-content:center;gap:6px;margin:1rem 0 2rem}.line{width:25px;height:1px;background:var(--line-color);transition:background .3s}.line.active{background:var(--text-color)}.project-title{text-align:center;color:var(--text-color)}.project-description{text-align:left;font-size:1rem;margin-top:1rem;color:var(--text-color);padding-bottom:1rem}.image-caption{margin-top:1rem;padding-top:.5rem;padding-bottom:.5rem;border-top:1px solid #939393;font-size:.9rem;color:var(--text-color);opacity:.7;text-align:left}@media (max-width: 600px){.modal-content{max-width:100%;padding:1.5rem 1.5rem 5rem}.carousel-wrapper{width:100vw;margin-left:-1.5rem;margin-right:-1.5rem}.carousel-image{width:100vw;max-width:100vw;height:auto;object-fit:contain;margin:0}.arrow-left,.arrow-right{display:none}.carousel-lines{gap:4px;margin-bottom:1rem}.project-title{font-size:1.2rem;padding-top:1rem}.project-description{font-size:.95rem}.image-caption{font-size:.8rem}}.layout{display:flex;flex-direction:column;gap:2rem;align-items:center;justify-content:center;padding:1rem;max-width:100vw;box-sizing:border-box}p,.exhibitions{color:var(--text-color)}@font-face{font-family:Crake;src:url(../fonts/Crake-SemiBold.woff) format("woff"),url(../fonts/Crake-SemiBold.woff2) format("woff2");font-weight:400;font-style:normal}@font-face{font-family:Remixa;src:url(../fonts/Remixa-Medium.woff) format("woff"),url(../fonts/Remixa-Medium.woff2) format("woff2")}.letter{font-family:Remixa,sans-serif;font-size:40px;letter-spacing:.2rem}.h2{color:var(--text-color)}.animated-name{font-size:2rem;font-weight:700;display:flex;flex-wrap:wrap;justify-content:center;text-align:center;word-break:break-word;white-space:normal;gap:.2rem;cursor:pointer;transition:all .4s ease}.animated-name .letter{display:inline-block;transition:transform .4s ease}.animated-name .middle-letters{display:inline-block;opacity:1;font-size:40px;line-height:1.4;transition:opacity .4s ease,transform .4s ease;vertical-align:bottom;transform:translateY(.1rem);letter-spacing:.2ch}.animated-name .disappear{opacity:0;transform:translateY(20px);pointer-events:none}.animated-name .appear{opacity:1;transform:translateY(0)}.animated-name .contracted:first-child{transform:translate(8rem)}.animated-name .contracted:last-child{transform:translate(-1rem)}.animated-name .last.contracted{transform:translate(2rem)}.animated-name .expanded:first-child,.animated-name .expanded:last-child{transform:translate(0)}.canvas-container{width:100vw;height:100vh}.drag-icon{height:2rem}.drag-hint{position:absolute;bottom:140px;left:50%;transform:translate(-50%);color:#fff;font-size:1rem;background:rgb(121,6,237);padding:.5rem 1rem;border-radius:20px;z-index:50;pointer-events:none;animation:fadeInOut 15s ease-in-out forwards}@keyframes fadeOut{to{opacity:0;transform:translate(-50%) translateY(-10px)}}.top-menu{position:fixed;top:0;display:flex;align-items:center;justify-content:space-between;width:100%;padding:1rem;background:transparent;z-index:1000;-webkit-user-select:none;user-select:none}.top-menu:before{content:"";position:absolute;top:0;left:0;height:100%;width:100%;background:var(--menu-gradient);pointer-events:none;z-index:-1}.top-menu h1{overflow-wrap:break-word;font-size:2rem;margin:0;font-family:Remixa,sans-serif;letter-spacing:.1em}.name-wrapper{display:flex;justify-content:center;flex-grow:1}.bottom-menu{position:fixed;bottom:0;width:100%;padding:1rem 0;background:var(--bottom-menu-gradient);display:flex;justify-content:center;gap:1rem;z-index:20}.bottom-menu button{background:none;border:none;cursor:pointer;color:#000;font-size:1.5rem}.close-button{display:flex;flex-direction:row;align-items:center;justify-content:space-between;height:2.5rem;width:9rem;border:1px solid}.close-button:hover{animation-name:divcolor;animation-duration:6s;animation-iteration-count:infinite;animation-timing-function:ease-in;animation-direction:alternate}@keyframes divcolor{0%{background-color:#fde9ff}25%{background-color:#7600ff}50%{background-color:#49fce3}75%{background-color:#fcf202}to{background-color:red}}.modal-close-icon{position:absolute;top:2rem;right:2rem;width:40px;height:40px;cursor:pointer;transition:opacity .2s ease;color:var(--icon-color);z-index:100}@keyframes iconcolor{0%{color:#fde9ff}25%{color:#7600ff}50%{color:#49fce3}75%{color:#fcf202}to{color:red}}.modal-close-icon:hover{animation:iconcolor 3s infinite alternate}.menu-button{padding:.6em 1.2em;cursor:pointer;color:var(--icon-color)}.menu-button img{width:50px;height:50px;object-fit:contain}.menu-button:hover{animation:iconcolor 3s infinite alternate}.colophon-columns{column-count:2;column-gap:2rem;color:var(--text-color)}.colophon-columns p{margin-bottom:1rem}.icon-svg{width:50px;height:50px}.set-dark{background:none;border:none;cursor:pointer;padding:.5rem}.sound-toggle{width:50px;height:50px;background:none;border:none;cursor:pointer}.sound-toggle:hover{animation:iconcolor 3s infinite alternate}.dark-mode-icon{width:40px;height:40px;transition:transform .3s ease}.set-dark:hover .dark-mode-icon{animation:iconcolor 3s infinite alternate}.about-title{color:var(--text-color);letter-spacing:.08ch}@media (max-width: 1024px){.animated-name{gap:0rem}.drag-hint{font-size:.9rem;background:var(--highlight-color);color:var(--text-color)}}@media (max-width: 768px){.colophon-columns{column-count:1}.letter{font-size:25px}.animated-name .middle-letters{font-size:25px;line-height:1.4}.animated-name .contracted:first-child{transform:translate(4.2rem)}.animated-name .last.contracted{transform:translate(.5rem)}.menu-button{padding:.5em 1em}.menu-button img{width:40px;height:40px;object-fit:contain}.bottom-menu button{font-size:1.3rem}.icon-svg{width:40px;height:40px}.about-title{font-size:1.2rem}}@media (max-width: 480px){.drag-hint{font-size:.75rem;bottom:100px;padding:.4rem .8rem}.modal-close-icon{width:20px;height:20px;right:1.5rem;top:1.5rem}.close-button{width:9rem;height:2.5rem;border:.9px solid;border-color:var(--border-color);color:var(--text-color)}.menu-button{padding:.5em 1em}.dark-mode-icon{width:25px;height:25px}.sound-toggle{width:30px;height:30px}}
