:root{--primary:#004d4d;--secondary:#4d4d00;--text-primary:white;--text-shadow:2px 2px var(--primary);--bg-light:#0000001a;--bg-dark:#00000040;--bg-hover:#00000080;--bg-gradient:linear-gradient(-145deg, var(--secondary), var(--primary), var(--secondary), var(--primary));--bg-gradient-size:400% 400%;--bg-gradient-duration:10s;--space-1:.25rem;--space-2:.5rem;--space-2-5:.75rem;--space-3:1rem;--space-3-5:1.5rem;--space-4:2rem;--text-body:1.1rem;--text-display:clamp(1.5rem, min(6.5vw, 12vh), 6.75rem);--text-btn:clamp(.75rem, min(1.5vw, 3vh), 1.75rem);--text-sm:clamp(.6rem, min(1.5vw, 1.9vh), 1rem);--text-lg:clamp(.75rem, min(2.5vw, 3.5vh), 1.75rem);--subtitle-size:var(--text-sm);--letter-spacing-sm:1px;--letter-spacing-lg:3px;--line-height-prose:1.6;--radius-sm:4px;--radius-md:8px;--radius-lg:16px;--radius-icon:clamp(5px, 1.5vw, 20px);--border-thin:2px solid var(--primary);--border-thick:4px solid var(--primary);--border-btn:clamp(2px, .3vw, 4px) solid var(--primary);--hover-bg-duration:.2s;--hover-bounce-duration:.2s;--fade-duration:.3s;--layout-padding-y:var(--space-3-5);--layout-padding:var(--layout-padding-y) var(--space-3);--layout-gap:var(--space-2);--panels-gap:var(--space-3-5);--header-gap:var(--space-3-5);--single-gap:var(--space-4);--panels-direction:column;--panel-direction:column;--panel-reverse-direction:column-reverse;--panel-reverse-justify:center;--nav-icon-size:clamp(2rem, min(5vw, 9vh), 5rem);--nav-icon-padding:2px;--nav-margin-top:clamp(2vh, 6vw, 10vh);--nav-gap:clamp(5px, 1vw, 10px);--card-radius:10px;--card-min-height:320px;--card-min-width:160px;--card-img-max-height:240px;--preview-max-height:250px;--preview-icon-size:clamp(2rem, min(9vw, 10vh), 5rem);--badge-radius:15px;--badge-padding:10px;--tech-icon-size:80px;--tech-size:clamp(1.5rem, min(6vw, 12vh), 6rem);--tech-gap:clamp(.5rem, 2vw, 1.5rem);--skill-icon-padding:5px;--embed-height:60vh;--form-padding:clamp(4px, 1.5vw, 10px);--textarea-height:6vh;--input-margin:1vh 0;--output-margin-top:2vh;--btn-padding:var(--space-2) var(--space-3);--stack-gap:var(--space-2)}@font-face{font-family:Bebas Neue;src:url(../fonts/bebas-neue-v16-latin-regular.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}*,:before,:after{box-sizing:border-box;margin:0;padding:0;text-decoration:none;list-style:none}a,button,input,textarea{cursor:inherit;color:inherit;font:inherit}html{color:var(--text-primary);text-shadow:var(--text-shadow);background:#000;font-family:Bebas Neue,system-ui,sans-serif}body{background:var(--bg-gradient);background-size:var(--bg-gradient-size);width:100%;height:100dvh;animation:gradient var(--bg-gradient-duration) ease infinite;overflow:hidden}.hidden{pointer-events:none;display:none}.fade-out{opacity:0;pointer-events:none}.stack{gap:var(--stack-gap);padding-top:var(--stack-gap);flex-direction:column;display:flex}.hover-cursor{cursor:pointer}.hover-bg{transition:background var(--hover-bg-duration) ease}.hover-bg:hover,.hover-bg:focus-visible{background:var(--bg-hover)}.hover-bounce{transition:scale var(--hover-bounce-duration) ease}.hover-bounce:hover,.hover-bounce:focus-visible{scale:1.05}.hover-bg.hover-bounce{transition:scale var(--hover-bounce-duration) ease, background var(--hover-bg-duration) ease}#header-nav a:focus-visible .nav-icon{background:var(--bg-hover);outline:var(--border-thick) solid var(--bg-hover);outline-offset:2px}@keyframes gradient{0%,to{background-position:0%}50%{background-position:100% 0}}@media (prefers-reduced-motion:reduce){:root{--hover-bounce-duration:0s;--fade-duration:0s}body{animation:none}.hover-bounce:hover,.hover-bounce:focus-visible{scale:1}}.btn{text-align:center;font-family:inherit;font-weight:400;font-size:var(--text-btn);background:var(--bg-dark);padding:var(--btn-padding);border:var(--border-btn);border-radius:var(--radius-lg);display:inline-block}.btn-full{width:100%;display:block}.btn-active{background:var(--bg-hover)}input,textarea{width:100%;padding:var(--form-padding);border:var(--border-thin);background:var(--bg-light)}input[type=submit]{padding:var(--form-padding)}textarea{text-align:left;height:var(--textarea-height)}.email-input{margin:var(--input-margin)}label{font-size:var(--text-sm)}#output,.panel-content input,.panel-content textarea,#skills-div{font-family:Arial,Helvetica,sans-serif}.nav-icon{width:var(--nav-icon-size);height:var(--nav-icon-size);padding:var(--nav-icon-padding);background:var(--bg-light);border:var(--border-thin);border-radius:var(--radius-icon);display:block}.project-card img{max-height:var(--card-img-max-height);margin-bottom:var(--space-2-5)}#project-preview{max-height:var(--preview-max-height);margin-bottom:var(--space-3)}.project-card img,#project-preview{object-fit:cover;border-radius:var(--radius-md);-webkit-user-drag:none;-webkit-user-select:none;user-select:none;width:100%}.panel-content>a img{width:var(--preview-icon-size);height:var(--preview-icon-size);padding:var(--space-1);border:var(--border-thick);border-radius:var(--radius-icon)}#skills-div img{width:var(--tech-size);height:auto;padding:var(--skill-icon-padding);border-radius:var(--radius-icon)}#lang-chart{width:60%;height:auto;margin:0 auto;display:block}#projects-grid{gap:var(--space-3-5);scrollbar-width:thin;grid-template-columns:repeat(auto-fit, minmax(var(--card-min-width), 1fr));grid-auto-rows:max-content;display:grid;overflow:hidden auto}#projects-grid,#project-details{transition:opacity var(--fade-duration) ease;opacity:1;padding:var(--space-3-5);flex:1}#project-details{background:var(--bg-light);border-radius:var(--card-radius);flex-direction:column;display:flex;overflow-y:auto}#project-details h3{font-size:var(--text-display);margin:0 0 var(--space-3-5) 0;letter-spacing:var(--letter-spacing-sm);font-weight:700}#project-details p{font-size:var(--text-body);line-height:var(--line-height-prose);margin:var(--space-3-5) 0}#project-buttons{gap:var(--space-3);display:flex}.project-card{pointer-events:auto;text-align:center;font-size:var(--text-lg);border-radius:var(--card-radius);background:var(--bg-dark);padding:var(--space-3-5);min-height:var(--card-min-height);flex-direction:column;justify-content:space-between;display:flex}.project-card h4{font-size:var(--text-lg);margin:0;font-weight:700}.project-tech{gap:var(--space-2-5);margin:var(--space-3) 0;flex-wrap:wrap;display:flex}.tech{border:var(--border-thick);border-radius:var(--badge-radius);background:var(--bg-dark);width:var(--tech-size);aspect-ratio:3/4;padding:var(--badge-padding)}.tech-icon{width:var(--tech-icon-size);height:var(--tech-icon-size);object-fit:contain;background:var(--bg-light);padding:var(--space-2);border-radius:var(--radius-md)}#embed-container iframe{width:100%;height:var(--embed-height);border:0}.layout-single,.layout-double{width:100%;height:100dvh;padding:var(--layout-padding);align-items:center;gap:var(--layout-gap);flex-direction:column;display:flex}header{justify-content:space-between;align-items:flex-start;gap:var(--header-gap);flex-wrap:nowrap;width:100%;display:flex}header h1{font-size:var(--text-display);letter-spacing:var(--letter-spacing-lg);white-space:nowrap;line-height:1}header p{font-size:var(--subtitle-size);margin-top:var(--space-2)}header p .btn{font-size:var(--text-sm);padding:var(--space-1) var(--space-3)}#header-nav{align-items:center;gap:var(--space-2);display:flex}.panel-single{flex:1;justify-content:center;align-items:center;width:100%;min-height:0;display:flex}.panels-double{flex:1;flex-direction:var(--panels-direction);gap:var(--panels-gap);width:100%;min-height:0;display:flex}.panel-double{flex:1;flex-direction:var(--panel-direction);display:flex}.panel-double--reverse{flex-direction:var(--panel-reverse-direction);justify-content:var(--panel-reverse-justify)}.panel-nav{margin-top:var(--nav-margin-top);place-content:center space-evenly;column-gap:var(--nav-gap);display:flex}#output,.panel-content{width:100%}.panel-content{margin-top:var(--output-margin-top);justify-content:space-evenly;display:flex}.panel-content a{text-align:center}#output{text-align:left}#output,.panel-content input,.panel-content textarea,#skills-div{font-size:var(--text-sm)}#skills-div{text-align:center;flex-direction:column;display:flex}.image-out{flex-direction:row;justify-content:space-evenly;display:flex}.image-out,#skills-div{gap:var(--tech-gap)}#resume-display,#projects-grid,#project-details{border:var(--border-thin);border-radius:var(--radius-md);background:var(--bg-light);width:100%;height:100%}@media (width>=768px){:root{--subtitle-size:var(--text-lg);--layout-padding-y:clamp(1rem, 6vh, 10vh);--layout-padding:var(--layout-padding-y) 10vw;--panels-gap:10vw;--single-gap:5vw;--panels-direction:row;--panel-reverse-direction:column;--panel-reverse-justify:flex-start}.layout-single{gap:var(--single-gap);padding-right:var(--layout-padding-y);flex-direction:row;justify-content:space-evenly;align-items:flex-start}.layout-single header{width:25%}.panel-single{width:60%;height:100%}header p .btn{font-size:inherit;padding:0 var(--space-1);border-radius:var(--radius-sm);background:0 0;border:none}}@media (width<481px){:root{--text-display:9.5vw;--text-lg:3vw;--text-sm:2.75vmin;--text-btn:4vw;--btn-padding:1.5vw;--nav-icon-size:12.5vw;--nav-margin-top:2vh;--output-margin-top:2vh;--form-padding:4px;--textarea-height:7vh;--stack-gap:.8vh;--tech-size:15vw}}@media (width<=972px){#email-icon{display:none}}@media (481px<=width<768px){:root{--text-display:9.5vmin;--text-lg:3vmin;--text-sm:2.1vmin;--text-btn:3.5vmin;--btn-padding:1vmin;--nav-icon-size:9vmin;--nav-margin-top:1vh;--output-margin-top:1vh;--form-padding:4px;--textarea-height:6vh;--stack-gap:.8vh}}@media (height<=430px) and (360px<=width<=972px){:root{--text-display:7.5vw;--text-lg:2.5vw;--text-sm:2vmin;--text-btn:3.5vmin;--btn-padding:1vmin;--nav-icon-size:8vw;--nav-margin-top:1vh;--output-margin-top:1vh;--textarea-height:6vh;--stack-gap:1vh;--layout-padding:2vh 4vw;--panels-direction:row;--panel-reverse-direction:column;--panel-reverse-justify:flex-start;--tech-size:5vw;--tech-gap:1vw}#email-icon{display:inline-block}}@media (481px<=width<=972px) and (height<=620px){:root{--layout-padding:2vh 4vw;--panels-direction:row;--panel-reverse-direction:column;--panel-reverse-justify:flex-start}}@media (481px<=width<768px) and (height<=800px){#contact-page{--textarea-height:5vh;--stack-gap:.5vh;--panels-direction:row;--panel-reverse-direction:column;--panel-reverse-justify:flex-start}}@media (width<481px) and (height<700px){#contact-page{--panels-direction:row;--panel-reverse-direction:column;--panel-reverse-justify:flex-start}}@media (width<=549px) and (height<=549px){:root{--textarea-height:4vh;--form-padding:2px;--btn-padding:.8vmin;--nav-margin-top:.5vh;--output-margin-top:.5vh;--stack-gap:.5vh}}@media (width>=768px) and (height<=460px){:root{--textarea-height:4vh;--nav-margin-top:.5vh;--output-margin-top:.5vh;--layout-padding-y:1vh}}@media (width<=320px){:root{--text-display:8vw;--nav-icon-size:10vw;--nav-gap:1vw;--header-gap:2vw}}