:root{--scroller-width: 2rem;--header-height: 8rem;--footer-height: 4rem}*{margin:0;padding:0;scrollbar-width:none;-ms-overflow-style:none}body{font-family:Arial,Helvetica,sans-serif}header{position:sticky;display:flex;top:0;width:100%;height:var(--header-height);gap:2rem;justify-content:space-evenly;align-items:center;flex-wrap:nowrap;z-index:1}h2{margin-bottom:.5rem;text-shadow:0 1px 2px rgba(0,0,0,.25);line-height:1.6}footer{display:flex;justify-content:center;align-items:center;width:100%;height:var(--footer-height);text-align:center;font-size:.6rem;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}nav{display:flex;min-width:50rem;align-items:center}p{margin-bottom:.5rem;color:#505050;text-shadow:0 1px 2px rgba(0,0,0,.25);line-height:1.6}time{margin-bottom:1rem;font-size:.6rem;text-shadow:0 1px 2px rgba(0,0,0,.25);line-height:1.6}.body-container{display:flex;flex-direction:column;width:60vw;height:65vh;background:#0000001a;backdrop-filter:blur(2px) saturate(150%);-webkit-backdrop-filter:blur(2px) saturate(150%);border-radius:1rem;padding:1.5rem;color:inherit;text-decoration:none;box-shadow:0 6px 25px #0003;transition:all .25s ease-in-out;background-image:linear-gradient(to bottom right,#ffffff40,#6464aa26);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.card-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;padding:2rem;max-width:1200px}.card-thumbnail-container{border-radius:0 0 1rem 1rem;width:calc(100% + 3rem);margin-left:-1.5rem;margin-bottom:-1.5rem;height:10rem;object-fit:cover;overflow:hidden}.card-thumbnail{width:100%;object-fit:cover;transform:translateY(-20%);opacity:.2;transition:opacity .3s ease}.card{background:#0000001a;backdrop-filter:blur(2px) saturate(150%);-webkit-backdrop-filter:blur(2px) saturate(150%);border-radius:1rem;padding:1.5rem;color:inherit;text-decoration:none;box-shadow:0 6px 25px #0003;transition:all .25s ease-in-out;background-image:linear-gradient(to bottom right,#ffffff40,#6464aa26)}.card:hover{transform:translateY(-5px);box-shadow:0 8px 16px #00000026}.card:hover .card-thumbnail{opacity:.8}.card-icon{filter:drop-shadow(1px 1px 1px rgba(0,0,0,.4));width:2rem;height:2rem;margin-left:1rem;vertical-align:-.4rem;object-fit:contain}.content{display:flex;flex-direction:column;min-height:100vh;margin-left:var(--scroller-width);width:calc(100% - var(--scroller-width));overflow-x:hidden;background:radial-gradient(circle at top left,rgba(100,200,255,.3),transparent 70%),radial-gradient(circle at bottom right,rgba(0,150,100,.3),transparent 70%)}.main-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%}.nav-list{display:flex;width:100%;flex-direction:row;flex-wrap:nowrap;gap:2rem;list-style:none;justify-content:space-evenly}.nav-list a{display:inline-block;text-decoration:none;color:#000;font-size:1.2rem;text-shadow:0 1px 2px rgba(0,0,0,.25);transition:all .25s ease-in-out}.nav-list a:hover{color:#646496}.project-body-image{width:400px;height:auto;margin-bottom:1.5rem;border-radius:.5rem;filter:drop-shadow(0 1px 2px rgba(0,0,0,.25));opacity:.8;align-self:center}.project-body{margin-bottom:1.5rem}.project-title{margin-bottom:2rem;text-shadow:0 1px 2px rgba(0,0,0,.25);text-align:center;line-height:1.6}.scroller-vertical{position:fixed;display:flex;top:0;left:0;height:100vh;width:var(--scroller-width);background-color:#000;overflow:hidden;justify-content:center;z-index:1}.scroller-vertical-content{position:absolute;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:8rem;writing-mode:vertical-lr;text-orientation:mixed;width:max-content;list-style:none;white-space:nowrap;align-items:flex-end;animation:scrollDown 45s linear infinite}.scroller-vertical-item{color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:1rem;width:1rem;height:1rem;flex-shrink:0;display:flex;align-items:center;justify-content:center}.thumbnail{bottom:0;width:100%;border-radius:.5rem;filter:drop-shadow(1px 1px 1px rgba(0,0,0,.4))}.tool{width:2rem;height:2rem;object-fit:contain;filter:drop-shadow(1px 1px 1px rgba(0,0,0,.4))}.tool-container{display:flex;flex-direction:row;gap:1rem;margin-top:.5rem;margin-bottom:.5rem;flex-wrap:wrap;align-items:center;justify-content:flex-start}.vertical-long{grid-row:span 2}#three-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}#title-logo{position:relative;font-family:planet-kosmos;font-weight:400;font-size:3rem;top:3px;text-shadow:0 1px 2px rgba(0,0,0,.25)}@font-face{font-family:planet-kosmos;src:url(/fonts/planet-kosmos.regular.woff2) format("woff2")}@keyframes scrollDown{0%{transform:translateY(-50%)}to{transform:translateY(calc(0% + 4rem))}}