@import"https://fonts.googleapis.com/css2?family=Inknut+Antiqua:wght@300;400;500;600;700;800;900&display=swap";:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background-color:#000;overflow:hidden}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center;position:relative;overflow:hidden}.bg{background:url(/background.webp)}.loader-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:1.2rem}.canvas-capture-btn{width:1px;height:1px;opacity:0}.fallback-image{transform:translate(-50%,-50%)}.fallback-background{background-color:#000;position:fixed;inset:0;width:100%;height:100%;object-fit:contain;object-position:bottom}.sidebar-top{position:absolute;left:auto;top:.5rem;display:flex;flex-direction:row;font-size:14px;text-align:start;padding:8px;gap:8px}.sidebar-top>div{margin:-6px auto auto}.sidebar-top p{opacity:0;will-change:opacity;transition:all .3s;text-wrap:wrap;margin:0}.sidebar:hover .sidebar-top p{opacity:1}.sidebar-top p:last-child{color:#add8e6}.sidebar-top-avatar{background-color:#000;border-radius:50%;width:48px;height:48px;will-change:width,height,background-color;transition:all .15s}.sidebar:hover .sidebar-top-avatar{background-color:#151515;width:64px;height:64px}.link-popup{position:absolute;text-wrap:nowrap;width:fit-content;background-color:#000;padding:8px;color:#fff;border-radius:4px;opacity:0;will-change:margin-bottom opacity;transition:margin-bottom .4s,opacity .25s;pointer-events:none;z-index:120}*:hover>.link-popup{margin-bottom:80px;opacity:1}.page-title{position:fixed;top:60px;left:auto;right:auto;opacity:.9}.page-title>h1{margin:4px;font-family:Inknut Antiqua;font-weight:400;font-variant:small-caps}.page-title>img{scale:.8}.clip{clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}.clip-shadow{display:flex;filter:drop-shadow(0 4px 10px black)}.canvas-3d{position:fixed;inset:0;max-width:100vw;max-height:100vh;background-color:#000}.scroll-reminder{position:fixed;bottom:32px;opacity:.5;text-shadow:0 0 5px white;transform:scaleY(.35) scale(4) rotate(90deg);animation:scroll-remind 2s infinite}@keyframes scroll-remind{0%{transform:scaleY(.35) scale(4) rotate(90deg) translate(0)}25%{transform:scaleY(.35) scale(3) rotate(90deg) translate(20px)}50%{transform:scaleY(.35) scale(4) rotate(90deg) translate(0)}75%{transform:scaleY(.35) scale(3) rotate(90deg) translate(20px)}to{transform:scaleY(.35) scale(4) rotate(90deg) translate(0)}}.sidebar{position:fixed;left:0;top:0;bottom:0;width:64px;will-change:width;transition:width .3s;background-color:#4040402f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;align-items:flex-start;justify-content:space-around;overflow:hidden;z-index:200}.content{display:flex;flex-direction:column;place-items:center}.sidebar:hover{width:180px}.nav{display:flex;justify-content:center;margin-left:16px;will-change:margin;transition:all .5s ease}.nav-list{opacity:0;width:0;gap:16px;will-change:opacity,width,margin;transition:all .5s ease;content:"";height:fit-content;display:flex;flex-direction:column}.sidebar:hover>.nav{margin:0}.sidebar:hover .nav-list{opacity:1;width:fit-content;margin:16px}.sidebar:hover .nav-line{opacity:0;width:0;margin:0}.nav-line{align-self:center;margin:16px;width:2px;height:380px;opacity:1;will-change:opacity,width,margin;transition:all .5s ease;background-color:gray;border-radius:2px;display:flex;flex-direction:column;align-items:center;justify-content:space-between}.nav-point{width:8px;height:8px;transform:rotate(45deg);background-color:#000;border:2px solid grey;position:relative}.nav-point:after{content:"";position:absolute;top:50%;left:50%;width:6px;height:6px;will-change:transform;transition:transform .3s;transform:translate(-50%,-50%) scale(0);background-color:#fff}.nav-point[data-selected]:after{transform:translate(-50%,-50%) scale(1)}.sidebar:hover .nav-point[data-selected]:after{transform:translate(-50%,-50%) scale(0)}.sidebar:not(:hover) .nav-btn:before{opacity:0;transform:scale(0)}.page{position:fixed;inset:0;opacity:0;will-change:opacity,transform;transition:opacity .5s ease-out,transform .35s;transform:scale(.95) translateY(60px);z-index:-100}.page[data-selected]{z-index:1;display:flex;align-items:center;justify-content:center;opacity:1;transform:none}.nav-btn{position:relative;background-color:#40404000;width:fit-content;border:none;outline:none;border-radius:0;padding:12px 24px;white-space:nowrap;text-align:left;text-shadow:0 0 10px black;will-change:background-color,text-shadow;transition:all .3s}.nav-btn:focus-visible{outline:2px solid #fff;outline-offset:3px}.nav-btn:focus{outline:none}.nav-btn[data-selected]{outline:none;text-shadow:0 0 3px white}.nav-btn:before{position:absolute;top:50%;left:0;content:"";width:6px;height:6px;transform:translateY(-50%) rotate(0) scale(0);will-change:transform,box-shadow;transition:.3s;background-color:#fff}.nav-btn[data-selected]:before{position:absolute;top:50%;left:4px;content:"";width:5px;height:5px;box-shadow:0 0 3px #fff;transform:translateY(-50%) rotate(45deg) scale(1);background-color:#fff}.nav-btn:focus:hover{outline:none}.nav-btn:hover{background-color:#40404068;border:none;outline:none;text-shadow:0 0 3px white}@media(max-width:768px){.sidebar{width:32px}.sidebar:hover{width:150px}.sidebar:hover .nav-list{opacity:1;width:fit-content;margin:8px}.sidebar-top{flex-direction:column;left:50%;transform:translate(-50%);padding:8px;gap:8px;text-align:center}.sidebar-top-avatar{width:24px;height:24px}.nav{margin-left:0;align-items:end}.nav-list{gap:0}.nav-line{height:100%}.page{left:40px;right:16px;max-width:100%;max-height:100%}}.time{font-family:Inknut Antiqua;position:fixed;top:16px;right:32px;text-shadow:0 0 10px lightblue}.carousel-container{position:relative;width:100%;height:100%;margin:auto;overflow:hidden;text-align:center}.carousel-track{display:flex;height:100%;transition:transform .5s ease;align-items:center}.carousel-slide{display:flex;justify-content:center;align-items:center}.carousel-slide-inner{width:100%;height:100%;display:flex;justify-content:center;align-items:center;opacity:.3;transform:scale(.8);transition:transform .5s,opacity .5s}.carousel-slide-inner.active{transform:scale(1);opacity:1;z-index:2}.carousel-slide-inner.prev,.carousel-slide-inner.next{transform:scale(.9);opacity:.65;will-change:opacity;transition:.2s;cursor:pointer;z-index:1}.carousel-slide-inner.prev:hover,.carousel-slide-inner.next:hover{opacity:.9}.carousel-nav{position:absolute;left:50%;bottom:2em;transform:translate(-50%);display:flex;width:fit-content;justify-content:center;gap:6px;clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px)}.carousel-dot{width:40px;height:10px;margin:0;padding:0;background-color:#ffffff4d;border:none;border-radius:0;cursor:pointer;transition:all .3s}.carousel-dot.active{background-color:#fff}.carousel-dot:hover{background-color:#fff9;outline:none;border:none}.carousel-dot:focus,.carousel-dot:focus-visible{outline:none;border:none}@media(max-width:768px){.carousel-nav{position:absolute;left:unset;right:0;bottom:50%;transform:translateY(50%);flex-direction:column}.carousel-dot{width:10px;height:40px}.carousel-track{flex-direction:column;padding-right:24px}}.project{width:100%;height:100%}.project>img{width:100%;height:100%;object-fit:cover}.project-info{position:absolute;bottom:0;left:0;right:0;padding:1em;padding-top:2rem;background:#000;background:linear-gradient(0deg,#000,#00000054,#0000);display:flex;flex-direction:row;justify-content:space-between}.project-links{display:flex;align-items:end;gap:1rem}.project-link{background-color:#00000049;border:1px solid lightgrey;border-radius:8px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;will-change:box-shadow scale;transition:all .3s}.project-link img{will-change:filter;transition:all .3s}.project-link:hover{box-shadow:0 0 4px #d3d3d3;scale:1.08}.project-link:hover>img{filter:drop-shadow(0 0 4px white)}.project-link>img{width:32px;height:32px;padding:8px}@media(max-width:768px){.project{font-size:12px}}.hire-me{background-color:#222;max-width:1000px;display:flex;height:100%;width:100%;padding:1.5em;gap:1.5em}.hire-me-about{text-align:justify;display:flex;flex-direction:column}.globe{align-self:center;justify-self:center;flex-grow:1;text-align:center}label{text-align:left}.contact-form{display:flex;flex-direction:column;min-width:400px;gap:1rem}h2{text-align:left;margin:0}.contact-form input,.contact-form textarea{padding:.8rem;font-size:1rem;width:100%;box-sizing:border-box}.contact-form textarea{height:100%;resize:none}.contact-form button{padding:.8rem;border-radius:5px;border:none;background-color:#f5f5f5;color:#000;font-size:1rem;cursor:pointer}.contact-error{color:red;margin:0}.contact-success{color:green;margin:0}@media(max-width:1000px){.hire-me{max-width:90%;flex-direction:column-reverse}.contact-form{min-width:unset}.hire-me-about{position:relative}.globe{position:absolute;scale:.5;bottom:-190px;right:-100px}}.about-me{position:relative;width:100%;max-width:1000px;background-color:#222;display:flex}.photo{max-width:250px;height:100%;object-fit:cover}.photo-wrapper{position:relative;max-width:300px}.star{position:absolute;top:100px;right:120px;transform:rotate(0) scale(0)}.photo-wrapper:hover .star{animation:shine .75s}@keyframes shine{0%{transform:rotate(0) scale(0)}50%{transform:rotate(180deg) scale(.75)}to{transform:rotate(360deg) scale(0)}}.icon{color:#fff;border:1px solid grey;border-radius:4px;padding:4px;margin:4px}.about{max-width:100%;padding:1.25em;display:flex;flex-direction:column}.about-text{padding-bottom:1em;text-align:left}.about-bottom{margin-bottom:0;display:flex;align-items:end;justify-content:space-between}.about-links{display:flex;align-items:center;justify-content:center}.about-links a{position:relative;cursor:pointer;will-change:filter scale;transition:all .3s;display:flex;align-items:center;justify-content:center}.about-links>a:hover{scale:1.08}.about-links>a:hover img{filter:drop-shadow(0 0 4px white)}.download-btn{display:flex;height:fit-content;cursor:pointer;align-items:center;justify-content:center;border:1px solid grey;border-radius:4px;padding-left:48px;padding-right:48px;gap:8px;margin:8px;will-change:box-shadow;transition:all .3s;color:#f5f5f5}.download-btn:hover{box-shadow:0 3px 8px green;color:#fff}.download-btn>img{width:24px;height:24px}.git-calendar svg{width:100%;height:auto;display:block}.git-calendar>.react-activity-calendar{width:100%!important;max-width:100%!important;min-width:0}@media(max-width:1050px){.about-me{flex-direction:column;width:100%;max-width:100%}.git-calendar{width:100%;min-width:0;overflow:hidden}.git-calendar table{width:100%;border-collapse:collapse;table-layout:fixed}.git-calendar td,.git-calendar th{padding:0}.about-text{font-size:14px}.photo{max-width:unset;width:100%;max-height:160px;object-fit:cover}.photo-wrapper{position:relative;max-width:unset}.about-bottom{flex-direction:column;align-items:center;padding-top:1em}}@media(max-height:700px){.git-calendar{display:none}}.quote{font-family:Inknut Antiqua;position:fixed;bottom:64px;left:auto;text-shadow:0 0 5px lightblue;font-size:1.4rem;text-align:center;display:inline-block;opacity:1;transition:opacity 1.2s ease,filter 1.2s ease,transform 1.2s ease;will-change:opacity,filter,transform,text-shadow}.quote.visible{opacity:1;filter:blur(0);transform:scale(1)}.quote.hidden{animation:disperseOut 2s forwards ease-out}@keyframes disperseOut{0%{opacity:1;filter:blur(0);transform:scale(1) translate(0)}30%{filter:blur(4px);opacity:.9}to{opacity:0;filter:blur(15px);transform:translate(calc((var(--randx, .5) - .5) * 300px),calc((var(--randy, .5) - .5) * 200px)) scale(1.2)}}.quote.visible{animation:appearIn 2s forwards ease-out}@keyframes appearIn{0%{opacity:0;filter:blur(15px);transform:scale(.8)}to{opacity:1;filter:blur(0);transform:scale(1)}}.quote:after{content:"";position:absolute;top:-100%;left:-100%;width:300%;height:300%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.05),transparent 60%),radial-gradient(circle at 70% 70%,rgba(255,255,255,.05),transparent 60%);mix-blend-mode:screen;pointer-events:none;opacity:0;animation:smokeFloat 6s infinite ease-in-out}@keyframes smokeFloat{0%,to{opacity:.1;transform:scale(1)}50%{opacity:.3;transform:scale(1.1)}}@media(max-width:480px){.quote{font-size:18px;padding-left:24px}}.skill{position:relative;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px);padding:8px;background-color:#000;text-shadow:0 0 2px grey;transform:scale(1.5);will-change:transform;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px}.skill:hover{transform:scale(2)}.skill-shadow{position:relative;display:flex;margin:16px;filter:drop-shadow(0 4px 8px lightgrey);z-index:1}.skill-icon{width:32px;height:32px;align-content:center}@media(max-width:768px){.skills{scale:.8}}@media(max-width:480px){.skills{scale:.45;margin-left:-16px}.skill{scale:2}.skill:not(:hover) p{display:none}}
