:root{color-scheme:light;--background-color: #fafafa;--text-color: #333;--text-title-color: #111;--text-hover-color: #000;--light-accent-color: #ccc;--strong-accent-color: #111;--card-background: #fafafa;--focus-ring: #2980b9}:root[data-theme=dark]{color-scheme:dark;--background-color: #111216;--text-color: #a5a5a5;--text-title-color: #eee;--text-hover-color: #fff;--light-accent-color: #25272c;--strong-accent-color: #eee;--card-background: #111216;--focus-ring: #8ab4f8}@keyframes first-about-me-animation{0%{opacity:0;transform:translateY(10em)}to{opacity:1;transform:translateY(-1em)}}@keyframes name{0%{opacity:0;transform:translateY(100em)}50%{opacity:.3;transform:translateY(-1em)}to{opacity:1;transform:translateY(0)}}@keyframes slogan{0%{opacity:0;transform:translate(-100em)}60%{font-size:.8rem}to{opacity:1;transform:translateY(-2em);font-size:1rem}}@keyframes menu{0%{opacity:0;transform:translateY(100em)}50%{opacity:.2;transform:translateY(50em)}to{opacity:1;transform:translateY(0)}}@keyframes ld-icon{0%{opacity:0;transform:translateY(-100em)}50%{opacity:.2;transform:translateY(-50em)}to{opacity:1;transform:translateY(0)}}@keyframes section{0%{opacity:0;transform:translateY(20rem)}to{opacity:1;transform:translateY(0)}}*{box-sizing:border-box}html{min-height:100%;background-color:var(--background-color)}body{min-width:320px;min-height:100vh;margin:0;color:var(--text-color);background-color:var(--background-color);font-family:Poppins,Helvetica,Arial,sans-serif}button,a{color:inherit;font:inherit}a{text-decoration:none}button{border:0}button:focus-visible,a:focus-visible{outline:3px solid var(--focus-ring);outline-offset:4px}.app{position:relative;min-height:100vh;overflow-x:hidden}.shell{width:min(75%,1180px);margin:0 auto;padding:0 0 5rem}.watermark{position:fixed;z-index:-1;margin:0 auto;overflow:hidden;color:var(--text-title-color);font-family:Nunito,Poppins,sans-serif;font-weight:900;line-height:1;opacity:.03;pointer-events:none}.watermark:nth-child(1){top:0;left:-2em;font-size:10rem}.watermark:nth-child(2){right:-1em;bottom:0;font-size:27rem}.watermark:nth-child(3){bottom:0;left:0;font-size:2rem}.site-header{padding-top:.4rem}.header-row{display:flex;width:100%;align-items:center;justify-content:space-between;gap:1.5rem}.header-row h1{margin:.67em 0;animation:name 1.7s ease-out;color:var(--text-title-color);font-size:clamp(2rem,5vw,3.6rem);font-weight:700;letter-spacing:0}.slogan{margin:0;animation:slogan 1.2s ease-in-out forwards;font-weight:700}.theme-toggle{display:inline-flex;width:3rem;height:3rem;flex:0 0 auto;align-items:center;justify-content:center;animation:ld-icon 1.5s ease-out;background:transparent;color:var(--text-title-color);cursor:pointer;transition:color .25s ease,transform .25s ease}.theme-toggle:hover{color:var(--text-hover-color);transform:translateY(-2px)}.section-panel,.content-section{animation:section .6s ease forwards}.about-intro{width:min(100%,440px);margin:1.2rem 0 2rem;animation-name:first-about-me-animation;animation-duration:1s;animation-timing-function:ease-in;animation-fill-mode:forwards;font-size:.85rem;line-height:1.7;opacity:.8}.about-intro p,.about-section p{margin:0 0 2rem}.contact-link{display:inline-flex;align-items:center;border:2px solid var(--text-color);padding:.55rem 1.4rem;background-color:var(--light-accent-color);box-shadow:0 0;color:var(--text-hover-color);font-size:.92rem;transition:background-color .25s ease,color .25s ease,box-shadow .25s ease,transform .25s ease}.contact-link:hover{background-color:var(--text-hover-color);color:var(--background-color);transform:translateY(-1px)}.menu{display:flex;max-width:50%;flex-direction:row;gap:2rem;margin-top:10em;animation:menu .8s ease-out;color:gray}.menu--compact{position:fixed;top:1vw;right:15vw;z-index:10;margin-top:0;transition:all 1s ease}.menu-item{border:2px solid var(--light-accent-color);padding:5px;background-color:transparent;box-shadow:5px 5px 0 2px var(--light-accent-color);color:inherit;cursor:pointer;font-family:Roboto Mono,monospace;font-size:.9rem;font-weight:500;white-space:nowrap;transition:background-color .25s ease,border-color .25s ease,box-shadow .25s ease,color .25s ease}.menu-item:hover,.menu-item--active{border-color:var(--text-color);background-color:var(--text-color);box-shadow:1px 1px 0 2px var(--text-color);color:var(--background-color)}.back-button{display:none;align-items:center;justify-content:center;gap:.4rem;width:100%;margin:1.5rem 0;padding:.9rem 1rem;background-color:var(--text-color);color:var(--background-color);cursor:pointer;font-family:Roboto Mono,monospace;font-size:.85rem}.main-content{margin-top:3rem}.content-section h2{margin:0 0 1.5rem;color:var(--text-title-color)}.about-section{width:min(100%,760px);line-height:1.75}.skill-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(18rem,1fr));gap:2rem}.skill-card{min-width:0;border:2px solid var(--light-accent-color);padding:.4rem;background-color:var(--card-background);box-shadow:5px 5px 0 2px var(--light-accent-color);font-family:Roboto Mono,monospace}.skill-card h3{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:0 1rem 1.6rem;color:var(--text-hover-color);font-size:.92rem;font-weight:700}.skill-card h3 img{display:none;width:3rem;height:3rem;padding:.5rem;opacity:.2}.skill-card ul{margin:0 0 .8rem;padding:0 0 0 .7rem;list-style-type:none}.skill-card li{display:flex;align-items:center;min-width:0;margin:.2rem 0;font-size:.9rem}.skill-card li img{width:1.5rem;height:2.5rem;flex:0 0 auto;margin-right:.5rem;object-fit:contain}.skill-card li span{overflow-wrap:anywhere}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(30rem,100%),1fr));gap:3rem}.project-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(12rem,16rem);gap:1.5rem;align-items:stretch;border:0;padding:0 1rem;background-color:var(--card-background);box-shadow:0 0 0 5px var(--light-accent-color),15px 15px 0 5px var(--light-accent-color);transition:box-shadow .25s ease}.project-card:hover{box-shadow:0 0 0 5px var(--strong-accent-color),0 0 0 5px var(--strong-accent-color)}.project-copy{display:flex;min-width:0;flex-direction:column;justify-content:space-evenly;padding:1rem 0}.project-copy h3{margin:0;color:var(--text-title-color)}.project-copy h3 a{display:inline-flex;align-items:center;gap:.4rem}.project-copy h3 a:hover{opacity:.65;text-decoration:underline}.project-copy p{margin:.85rem 0;font-size:.87rem;font-style:italic;line-height:1.65}.project-card video{width:100%;min-height:16rem;align-self:center;margin:1rem 0;border:0;background:var(--light-accent-color);object-fit:cover}.tags{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem}.tags span{padding:.25rem .65rem;font-family:Roboto Mono,monospace;font-size:.72rem;opacity:.62}.tags span:hover{opacity:.9}.links-grid{display:grid;width:min(100%,680px);grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 2rem;margin-left:1rem}.links-grid a{display:flex;min-width:0;align-items:center;gap:.65rem;border:2px solid var(--light-accent-color);padding:.75rem;box-shadow:5px 5px 0 2px var(--light-accent-color);font-size:clamp(1rem,3vw,1.5rem);font-weight:700;opacity:.55;transition:opacity .25s ease,background-color .25s ease,border-color .25s ease,box-shadow .25s ease}.links-grid a:hover{border-color:var(--text-color);background-color:var(--light-accent-color);box-shadow:0 0;color:var(--text-color);opacity:1}.links-grid span{min-width:0;overflow-wrap:anywhere}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:900px){.shell{width:85%}.menu--compact{right:7.5vw}.project-card{grid-template-columns:1fr}.project-card video{max-width:24rem;justify-self:center}}@media(max-width:600px){@keyframes section-mobile{0%{opacity:0;transform:translateY(20rem)}to{opacity:1;transform:translateY(0)}}.shell{width:85%;padding-bottom:3rem}.header-row{align-items:flex-start}.header-row h1{font-size:2rem}.theme-toggle{margin-top:1rem}.menu{max-width:100%;flex-direction:column;gap:1.25rem;margin-top:0;font-size:1.35rem}.app--section-open .menu{display:none}.app--section-open .back-button{display:flex}.about-intro{width:100%}.main-content{margin-top:1.5rem}.content-section{animation-name:section-mobile;animation-duration:.75s}.skill-grid{grid-template-columns:1fr}.skill-card{width:100%}.project-card{padding:1rem;text-align:center;box-shadow:0 0 0 4px var(--light-accent-color)}.project-copy{align-items:center;padding:0}.project-card video{max-width:100%;min-height:13rem;margin:0}.tags{flex-flow:row wrap;justify-content:center}.tags span{border:1px solid var(--light-accent-color)}.links-grid{width:100%;grid-template-columns:1fr;margin-left:0}.watermark:nth-child(2){bottom:3em}}