html,body,#__remix{margin:0;padding:0;height:100vh;width:100vw;background-color:#fff!important;overflow:hidden}.viewport{height:100vh;width:100vw;display:flex;justify-content:center;align-items:center;position:relative}.stats-display{position:fixed;bottom:24px;right:24px;font-family:Space Grotesk,monospace;font-size:.7rem;color:#333;letter-spacing:.15em;text-transform:uppercase;z-index:100;pointer-events:none;opacity:.6}.enter-guide{position:absolute;top:120%;font-family:Space Grotesk,sans-serif;font-size:2rem;letter-spacing:.3em;color:#333;animation:blink 1.5s infinite;cursor:default}@keyframes blink{0%,to{opacity:.2}50%{opacity:1}}.fixed-label{position:absolute;top:50%;transform:translateY(-50%);font-family:Space Grotesk,sans-serif;font-size:1.2rem;letter-spacing:.3em;color:#333;opacity:0;transition:opacity 1.5s ease;pointer-events:none;z-index:5}body.state1 .fixed-label{opacity:.4}.shop-label{left:15%}.concept-label{right:15%}.logo-container{position:relative;width:200px;height:200px;display:flex;justify-content:center;align-items:center;cursor:pointer;z-index:10}.main-logo{width:100%;height:auto;transition:all .5s cubic-bezier(.4,0,.2,1)}.logo-container.is-active .main-logo{transform:scale(.66);opacity:.5}.nodes-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.node-item{position:absolute;top:50%;left:50%;opacity:0;transition:opacity .4s ease var(--delay);transform-origin:left center;pointer-events:auto}body.state1 .node-item{opacity:1}.node-item.left{transform:rotate(calc(var(--ang) + 180deg))}.node-item.right{transform:rotate(var(--ang))}.node-item .line{position:absolute;top:50%;left:0;width:0;height:.5px;transition:width .6s cubic-bezier(.16,1,.3,1) calc(var(--delay) + .2s)}body.state1 .node-item .line{width:var(--len)}.node-item.left .line{background:gray}.node-item.right .line{background:#87ceeb99}.node-img{position:absolute;top:50%;left:var(--len);width:40px}.node-item.right .node-img{transform:translate(-50%,-50%) rotate(calc(-1 * var(--ang)))}.node-item.left .node-img{transform:translate(-50%,-50%) rotate(calc(-1 * (var(--ang) + 180deg)))}.landing-footer{position:fixed;bottom:18px;left:18px;font-size:.8rem;font-family:Space Grotesk,sans-serif;opacity:.5}@media (max-width: 768px){.enter-guide{font-size:1.5rem}.fixed-label{font-size:.8rem;letter-spacing:.1em}.shop-label{left:5%}.concept-label{right:5%}.stats-display{font-size:.5rem;bottom:10px;right:10px}}
