.project-sundial{--sundial-canvas-width:500px;--sundial-canvas-height:340px;--sundial-scale:1;--sundial-arc-center:60.88%}.sundial-arc{opacity:0}.time-dot{width:.7rem;height:.7rem;background-color:#4c4945;filter:blur(1.5px);border-radius:9999px;z-index:20;transition:filter 3s ease-in-out}.hour-mark,.time-dot{position:absolute;transform:translate(-50%,-50%)}.hour-mark{color:#b3aea7;font-size:.68rem;user-select:none}.tree-shadow-container{position:absolute;width:calc(var(--sundial-canvas-width) * 115 / 500 * var(--sundial-scale));height:calc(var(--sundial-canvas-width) * 150 / 500 * var(--sundial-scale));left:50%;top:21.18%;transform:translate(-50%,-5px);transform-origin:bottom center;z-index:11;mix-blend-mode:multiply}.tree-shadow-container img{width:100%;height:100%}.tree-image{position:absolute;width:calc(var(--sundial-canvas-width) * 115 / 500 * var(--sundial-scale));height:calc(var(--sundial-canvas-width) * 150 / 500 * var(--sundial-scale));left:50%;top:21.18%;transform:translate(-50%);transform-origin:bottom center;user-select:none;z-index:10}.tree-image img{width:100%!important;height:100%!important}.sundial-loading{opacity:0}.sundial-ready{opacity:1}.sundial-fade-in{transition:opacity .2s ease-in-out}.sundial-wrapper{position:relative;height:var(--sundial-canvas-height);-webkit-user-drag:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}.night-message{position:relative;top:calc(var(--sundial-canvas-height) - 50px);text-align:center;white-space:pre-line;line-height:1.4;color:#656461;font-size:.8rem;width:100%;max-width:1000px;user-select:none}.bird,.bird-shadow{position:absolute;width:calc(var(--sundial-canvas-width) * 40 / 500 * var(--sundial-scale));animation-timing-function:linear;animation-fill-mode:forwards}.bird-shadow.visible,.bird.visible{animation-name:moveAndFade}.bird-shadow:not(.visible),.bird:not(.visible){animation:none}.bird{z-index:100;top:31.76%}.bird-shadow{z-index:3;top:70.59%}@keyframes moveAndFade{0%{transform:translate(calc(var(--sundial-canvas-width) - 50px));opacity:0}10%{transform:translate(calc(var(--sundial-canvas-width) - 50px));opacity:1}90%{transform:translate(50px);opacity:1}to{transform:translate(50px);opacity:0}}.project-desc{width:500px}.project-canvas-wrapper{margin-top:92px;margin-bottom:92px}@keyframes moveAndFadeMobile{0%{transform:translate(calc(100vw - 60px));opacity:0}10%{transform:translate(calc(100vw - 60px));opacity:1}90%{transform:translate(50px);opacity:1}to{transform:translate(50px);opacity:0}}@media screen and (max-width:580px){.project-sundial{--sundial-canvas-width:max(200px,calc(100vw - 1rem));--sundial-canvas-height:calc(max(200px, calc(100vw - 1rem)) * (340 / 500));--sundial-scale:1.2;--sundial-arc-center:calc(var(--sundial-scale) * 50%)}.tree-image,.tree-shadow-container{top:5%}.project-desc{width:calc(100vw - 3rem)}.project-canvas-wrapper{margin-top:60px;margin-bottom:60px}.bird-shadow.visible,.bird.visible{animation-name:moveAndFadeMobile}.bird-shadow:not(.visible),.bird:not(.visible){animation:none}}.project-nav{z-index:1000}.project-canvas{width:var(--sundial-canvas-width);height:var(--sundial-canvas-height)}