:root{--text:#fbf9f0;--light:#babab7;--mid:#565050;--dark:#181714;--accent:#914b4b;--nav-width:4rem;--nav-width-open:10.625rem;--page-margin:15%;--type-speed:60ms;--indent:1rem;--shadow:0 2px 8px #0003;color:var(--text);background:var(--light);font-family:Helvetica,Arial,sans-serif}html{scroll-behavior:smooth;font-size:140%}*{box-sizing:border-box}body{background:var(--light);margin:0}h1{font-size:3rem}h1,h2{background-color:var(--dark);box-shadow:var(--shadow);border-radius:.3rem;margin:0 0 .75rem;padding:.375rem 0;font-weight:400}h2{padding-inline:var(--indent)}a{color:inherit}a.inlineLink{color:var(--accent)}ul{margin:0;padding:0;list-style:none}.layout{padding:1rem var(--page-margin) 1rem calc(var(--nav-width) + var(--page-margin))}.navbar{z-index:1;width:var(--nav-width);background:var(--dark);height:100vh;box-shadow:var(--shadow);padding:1rem 0;transition:width .2s,box-shadow .2s;position:fixed;top:0;left:0;overflow:hidden}.navbar:hover,.navbar:focus-within{width:var(--nav-width-open);box-shadow:4px 0 12px #0003}.navbar-title,.navbar a{padding:0 calc((var(--nav-width) - 1.5rem) / 2);white-space:nowrap;align-items:center;gap:.75rem;display:flex}.navbar-title{padding:0 0 0 calc(var(--nav-width) / 2 - 1.67 * .8rem);background-color:var(--dark);font-size:.8rem;transition:font-size .2s}.navbar:hover .navbar-title,.navbar:focus-within .navbar-title{font-size:.9rem}.navbar-domain span{opacity:0}.navbar:hover .navbar-domain span,.navbar:focus-within .navbar-domain span{opacity:1;transition:opacity 0s linear calc(var(--i) * var(--type-speed))}.navbar-path span{animation:type-in 0s calc(var(--i) * var(--type-speed)) both}@keyframes type-in{0%{opacity:0}to{opacity:1}}.navbar ul{margin-top:1rem}.navbar a{padding-block:.6rem;font-size:.9rem;text-decoration:none;transition:background .3s}.navbar a:hover,.navbar a:focus-visible{background:var(--accent)}.nav-submenu{visibility:hidden;grid-template-rows:0fr;transition:grid-template-rows .25s,visibility .25s;display:grid}.navbar:hover .nav-submenu,.navbar:focus-within .nav-submenu{visibility:visible;grid-template-rows:1fr}.nav-submenu ul{margin:0;overflow:hidden}.nav-submenu a{padding-left:calc((var(--nav-width) - 1.5rem) / 2 + 2.25rem);padding-block:.35rem;font-size:.8rem}.nav-submenu li{opacity:0;transition:opacity .15s,transform .15s;transform:translate(-.5rem)}.navbar:hover .nav-submenu li,.navbar:focus-within .nav-submenu li{opacity:1;transition-delay:calc(var(--i) * var(--type-speed));transform:none}@media (hover:none){.nav-submenu{display:none}}.nav-icon{flex-shrink:0;width:1.5rem;height:1.5rem}.nav-label{opacity:0;transition:opacity .2s}.navbar:hover .nav-label,.navbar:focus-within .nav-label{opacity:1}section{margin-bottom:5rem;padding:1.5rem 0;scroll-margin-top:1rem}section+section{border-top:.375rem solid var(--accent)}.particles-wrap{margin-bottom:1.85rem;position:relative}.particles-frame{overflow:hidden}.particles{object-fit:cover;width:100%;height:min(20rem,40vh);transition:transform .2s;display:block;transform:scale(1.03)}.particles-wrap:hover .particles{transform:scale(1.07)}.particles-bubble{background:var(--dark);width:8rem;box-shadow:var(--shadow);pointer-events:none;opacity:0;border-radius:.3rem;padding:.3rem .6rem;font-size:.7rem;transition:opacity .2s,transform .2s;position:absolute;top:1rem;left:calc(100% + 1.25rem);transform:translate(-.3rem)}.particles-bubble:after{content:"";border:.35rem solid #0000;border-right-color:var(--dark);position:absolute;top:.5rem;right:100%}.particles-wrap:hover .particles-bubble{opacity:1;transform:none}.hero{flex-direction:column;justify-content:center;min-height:calc(100svh - 2rem);padding:0;display:flex}.hero-container{background-color:var(--dark);box-shadow:var(--shadow);border-radius:.3rem;padding:.625rem}.hero p{margin:.5rem 0 1.85rem}.project-player{aspect-ratio:16/9;background:var(--dark);max-height:min(40rem,70vh);box-shadow:var(--shadow);border-radius:.3rem;position:relative;overflow:hidden}.project-player video{z-index:0;object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .5s;position:absolute;inset:0}.project-player video.active{opacity:1}.project-shade{z-index:0;pointer-events:none;opacity:0;background:#00000073;transition:opacity .5s;position:absolute;inset:0}.project-shade.active{opacity:1}.project-bar{padding:.375rem var(--indent);background-color:var(--dark);box-shadow:var(--shadow);white-space:nowrap;border-radius:.3rem;grid-template-columns:auto 1fr auto 1fr auto;align-items:center;gap:1rem;margin:0 0 .75rem;display:grid;overflow:hidden}.project-bar-label{box-shadow:none;background:0 0;border-radius:0;grid-row:1;margin:0;padding:0;font-size:1.5rem;font-weight:400}.project-bar-ghost{visibility:hidden;grid-column:5}.project-title{min-width:0;max-width:100%;color:inherit;font:inherit;cursor:pointer;opacity:.4;text-overflow:ellipsis;background:0 0;border:none;grid-row:1;padding:0;font-size:1rem;transition:opacity .45s;overflow:hidden}.slot-left{grid-column:2;justify-self:end}.slot-center{opacity:1;cursor:default;grid-column:3;font-size:1.6rem}.slot-right{grid-column:4;justify-self:start}.slot-hidden,.title-short{display:none}.slot-left:hover,.slot-left:focus-visible,.slot-right:hover,.slot-right:focus-visible{opacity:.8}.project-info{padding:var(--indent);background:var(--dark);box-shadow:var(--shadow);border-radius:.3rem;flex-direction:column;align-items:flex-start;gap:.75rem;margin-top:1rem;display:flex}.project-info p{margin:0}.tech-list{flex-wrap:wrap;gap:.5rem;display:flex}.tech-list li{background:var(--mid);border-radius:.3rem;padding:.25rem .6rem;font-size:.85rem}.project-meta{align-items:center;gap:.75rem;width:100%;display:flex}.github-link{opacity:.85;display:flex}.github-link svg{width:1.375rem;height:1.375rem}.github-link:hover{opacity:1}.live-link{background:var(--accent);color:var(--text);border-radius:.3rem;align-items:center;gap:.35rem;margin-left:auto;padding:.25rem .6rem;font-size:.85rem;text-decoration:none;display:flex}.live-link svg{width:1rem;height:1rem}.live-link:hover{filter:brightness(.9)}.live-link.disabled{opacity:.4;pointer-events:none}.about,.contact{min-height:20vh}.about-container{background-color:var(--dark);box-shadow:var(--shadow);border-radius:.3rem;padding:.625rem 0}.about-container p{padding-inline:var(--indent)}.contact{flex-direction:column;display:flex}.contact-container{flex-direction:column;flex:1;display:flex}.social-list{flex:1;justify-content:center;align-items:center;gap:1.125rem;display:flex}.social-list a{background:var(--dark);border-radius:50%;place-items:center;width:3.375rem;height:3.375rem;font-size:.85rem;text-decoration:none;display:grid}.social-list svg{width:1.65rem;height:1.65rem}.footer{padding:1rem var(--page-margin) 1rem calc(var(--nav-width) + var(--page-margin));background:var(--mid);box-shadow:var(--shadow);justify-content:space-between;align-items:center;display:flex}.footer p{margin:0}@media (width<=1200px){.project-bar{grid-template-columns:1fr auto 1fr;row-gap:.25rem}.project-bar-label{grid-column:1/-1}.project-bar-ghost{display:none}.project-title{grid-row:2}.slot-left{grid-column:1}.slot-center{grid-column:2}.slot-right{grid-column:3}.title-full{display:none}.title-short{display:inline}.particles-bubble{top:.5rem;left:auto;right:.5rem}.particles-bubble:after{display:none}.layout{padding:1rem}.navbar,.navbar:hover,.navbar:focus-within{width:auto;height:auto;box-shadow:var(--shadow);justify-content:space-between;align-items:center;margin:-1rem -1rem 0;padding:.5rem 0;display:flex;position:sticky}.navbar-title,.navbar:hover .navbar-title,.navbar:focus-within .navbar-title{margin:0;padding:0 .5rem;font-size:1.1rem}.navbar-path,.navbar a .nav-label,.nav-submenu{display:none}.navbar a{padding:.4rem min(.5rem,1.5vw)}.nav-icon{width:min(1.5rem,6vw);height:min(1.5rem,6vw)}.navbar ul{gap:min(.75rem,2vw);display:flex}.navbar li{margin:0}.footer{padding:1rem}}