@import "https://fonts.googleapis.com/css2?family=Bitcount:wght@100..900&family=Bitcount+Single:wght@100..900&family=Google+Sans+Code:ital,wght,MONO@0,300..800,1;1,300..800,1&display=swap";:root{--color-50:#f2f0ec;--color-100:#e8e2d2;--color-150:#dad4c2;--color-800:#32302b;--color-850:#272622;--color-900:#1c1b19;--color-950:#111110;--color-1000:#010100;--background:var(--color-900);--text:var(--color-100)}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--background);color:var(--text);font-family:Google Sans Code,sans-serif}body{flex-direction:column;align-items:center;display:flex}main{width:100%;max-width:64rem}section{background-color:var(--color-950);width:100%;margin-bottom:1rem;padding:1rem}h1{font-family:Bitcount;font-size:3rem;font-weight:400}h2,h3{font-family:Bitcount Single;font-weight:300}h2{font-size:2.5rem}h3{font-size:2rem}p{text-underline-offset:4px;font-size:1rem}a:link,a:visited{color:var(--color-50);text-underline-offset:4px}img.avatar{width:256px;height:auto;image-rendering:pixelated}#profile{justify-content:space-between;gap:1.5rem;display:flex}#profile .name{white-space:nowrap;flex-direction:column;justify-content:flex-end;align-items:flex-end;width:100%;display:flex}nav{justify-content:space-between;display:flex}section:has(nav){padding:0}nav a{cursor:pointer;text-align:center;flex:1;padding:1rem 0}nav a p{border-right:1px solid var(--color-800);padding:0 1rem;display:block}nav a:last-child p{border:none}nav a:hover{color:var(--background);background-color:var(--text)}#links{flex-wrap:wrap;justify-content:space-evenly;gap:1rem;display:flex}#projects div.h{gap:1rem;display:flex}#projects div.h>project-card{width:100%}#projects div.v{flex-direction:column;gap:1rem;width:min-content;height:min-content;display:flex}#projects div.v project-card,#projects div.v project-card a{width:100%;height:auto}@media (width<=768px){#profile h1{font-size:3rem}#profile h2{font-size:1.5rem}#profile img{width:8rem}#projects div.h{flex-direction:column}#projects div.v{width:100%}#projects div.h>project-card{width:100%;height:auto;min-height:auto}#projects project-card{width:100%}#projects project-card img{aspect-ratio:16/9;flex:none;height:auto}}si-icon{fill:var(--text)}si-icon svg{width:100%;height:100%}link-card{flex:1}link-card a{background-color:var(--color-900);flex:1;align-items:center;gap:1rem;text-decoration:none;transition:background-color .2s;display:flex}link-card a:hover{background-color:var(--color-850)}link-card div{--box-color:var(--color-850);aspect-ratio:1;background-color:var(--box-color);justify-content:center;align-items:center;height:64px;padding:1rem;transition:background-color .2s;display:flex}link-card a:hover div{--_lum:calc(var(--lum) + 10%)}link-card hgroup{white-space:nowrap;flex-direction:column;flex:1;display:flex}link-card small{color:var(--color-150);font-size:.8rem}link-card p{padding-right:1rem;font-size:1.2rem}link-card si-icon,link-card si-icon svg{height:100%}@media (width<=768px){link-card{flex:none;width:100%;display:block}}project-card{flex-direction:column;display:flex}project-card a{background-color:var(--color-900);cursor:pointer;color:inherit;flex-direction:column;gap:.5rem;width:100%;height:100%;padding:.5rem .5rem 1rem;text-decoration:none;transition:background-color .2s;display:flex;position:relative;overflow:hidden}project-card a:hover{background-color:var(--color-850)}project-card hgroup{flex:none;padding:0 .5rem;position:relative}project-card hgroup h3{white-space:nowrap;color:var(--text);padding-right:2rem}project-card small{color:var(--color-150);font-size:.8rem}project-card img{object-fit:cover;width:100%;height:0;min-height:0;image-rendering:pixelated;flex:1}project-card si-icon{color:var(--color-150);width:1rem;height:1rem;display:block;position:absolute;top:.5rem;right:.5rem}
