@import"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap";@import"https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Jersey+10&display=swap";*,*:before,*:after{box-sizing:border-box}#root{width:100%;height:100%}html{overflow:hidden;width:100%;height:100%}body{width:100%;height:100%;margin:0;padding:0}#taskbar{position:absolute;bottom:0;left:0;width:100%;height:var(--taskbar-height);padding:10px;box-shadow:0 -4px 5px var(--color-taskbar-shadow);background-color:var(--color-taskbar)}#taskbar-searchbar-container{float:left;position:relative;width:20%;height:100%;padding:5px;width:var(--searchbar-width)}#taskbar .searchbar{display:flex;position:relative;float:left;background-color:var(--color-taskbar-searchbar-bg);color:var(--color-searchbar-text);width:100%;height:100%;margin-right:10px}#taskbar-search-results-container{position:absolute;width:100%;max-height:220px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;padding:8px;box-sizing:border-box;background-color:var(--color-taskbar);border:1px solid var(--color-taskbar-button-accent);box-shadow:0 6px 12px var(--color-taskbar-shadow);z-index:25;scrollbar-width:thin;scrollbar-color:var(--color-taskbar-scrollbar-thumb-bg) var(--color-taskbar-scrollbar-track-bg)}#taskbar-search-results-container .search-result{width:100%;text-align:left;padding:6px 8px;z-index:1000;font-family:var(--font-shortcut);color:var(--color-searchbar-text);border:1px solid var(--color-taskbar-button-accent);background-color:var(--color-taskbar-secondary);cursor:pointer;transition:background-color .15s ease,color .15s ease}#taskbar-search-results-container .search-result:hover{background-color:var(--color-taskbar-button-highlight);color:var(--color-shortcut-text-highlight)}#taskbar-shortcut-container{position:relative;display:flex;gap:5px;height:100%;width:calc(100% - var(--clock-width) - var(--searchbar-width) - 50px);overflow-x:auto;overflow-y:hidden}#taskbar-shortcut-container .shortcut-info{z-index:1000;background-color:var(--color-taskbar-secondary)}#taskbar-shortcut-container button{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;height:100%;background-color:var(--color-taskbar-button);transition:background-color .2s ease;border-top:2px solid var(--color-taskbar-button-accent);border-left:2px solid var(--color-taskbar-button-accent);border-bottom:2px solid var(--color-taskbar-button-shadow);border-right:2px solid var(--color-taskbar-button-shadow)}#taskbar-shortcut-container button:hover{background-color:var(--color-taskbar-button-highlight)}#taskbar-shortcut-container button:active{background-color:var(--color-taskbar-button-active)}#taskbar-shortcut-container button h2{font-family:var(--font-shortcut);font-size:1.25em;text-align:center;white-space:nowrap;color:var(--color-shortcut-text);text-shadow:4px 1px 4px var(--color-shortcut-text-shadow);transition:color .2s ease}#taskbar-shortcut-container button h2:hover{color:var(--color-shortcut-text-highlight)}#taskbar-shortcut-container img{max-width:50px;image-rendering:crisp-edges}.taskbar-shortcut .shortcut-info{position:fixed;left:0;top:0;transform:translate(-50%,calc(-100% - 8px));padding:6px 10px;border-radius:8px;border:2px solid var(--color-taskbar-button-accent);background-color:var(--color-taskbar-accent);color:var(--color-shortcut-text-highlight);font-family:var(--font-shortcut);font-size:1rem;white-space:nowrap;box-shadow:0 6px 16px var(--color-taskbar-shadow);pointer-events:none;z-index:10}#taskbar-clock{display:inline;position:relative;float:right;text-align:right;align-content:center;margin-right:20px;width:var(--clock-width);height:100%;font-family:var(--shortcut-font);font-size:1rem;color:var(--text-header-secondary);line-height:1.2;border-top:2px solid var(--color-taskbar-button-shadow);border-left:2px solid var(--color-taskbar-button-shadow);border-bottom:2px solid var(--color-taskbar-button-accent);border-right:2px solid var(--color-taskbar-button-accent)}#taskbar-clock div{font-family:var(--font-shortcut);font-size:1.2rem;color:var(--color-clock-text);padding-right:2px}@media(max-width:800px)or (max-height:800px){#taskbar-searchbar-container{display:none}}@media(max-width:400px){#taskbar{display:none}}#shortcut-container{position:relative;float:left;min-width:300px;max-height:100%;padding:var(--shortcut-container-padding);box-sizing:border-box;overflow-y:hidden;overflow-x:visible;scrollbar-color:#adadad83 #1c1c1c00}.shortcut-scroll-container{display:flex;flex-wrap:wrap;flex-direction:column;align-items:center;overflow-x:visible;gap:5px;max-height:600px;width:auto;scrollbar-color:#adadad83 #1c1c1c00}.shortcut-scroll-container button{display:flex;flex-direction:column;align-items:center;cursor:pointer;border:none;border-radius:4px;background-color:var(--color-shortcut-button);transition:background-color .2s ease}.shortcut-scroll-container button:hover{background-color:var(--color-shortcut-button-highlight);color:var(--color-shortcut-text-highlight)}.shortcut-scroll-container img{max-width:75px;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges}.shortcut-scroll-container h2{font-family:var(--font-shortcut);font-size:1rem;text-align:center;white-space:nowrap;color:var(--color-shortcut-text);text-shadow:4px 1px 4px var(--color-shortcut-text-shadow);transition:color .2s ease}.shortcut-scroll-container button:hover h2{background-color:var(--color-shortcut-button-highlight);color:var(--color-shortcut-text-highlight)}@media(max-width:900px){.shortcut-scroll-container img{max-width:80px}}@media(max-width:400px){#shortcut-container{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#adadad83 #1c1c1c00;min-width:100px}.shortcut-scroll-container{max-height:1000px}}:root{--background-img-path: url(/Portfolio/assets/background-Cvp-2c-M.png);--taskbar-height: clamp(80px, 9vh, 90px);--shortcut-container-padding: clamp(5px, 1vw, 15px);--desktop-height: calc(100% - var(--taskbar-height));--clock-width: clamp(250px, 30%, 150px);--searchbar-width: clamp(150px, 20%, 250px)}#desktop{position:relative;overflow:hidden;width:100%;height:100%;margin:0;padding:0;box-sizing:border-box;background-color:var(--color-desktop)}#app-container{position:relative;overflow:hidden;width:100%;height:var(--desktop-height);margin:0;padding:0;box-sizing:border-box;background-image:var(--background-img-path);image-rendering:crisp-edges;background-size:cover;background-position:center;background-repeat:no-repeat}@media screen and (max-width:40rem){:root{--desktop-height: 100% }}:root{--header-height: 10%;--content-height: calc(100% - var(--header-height) - 10px)}.application{position:absolute;overflow:hidden;background-color:var(--color-window);box-sizing:border-box;border-top:2px solid var(--color-window-accent);border-left:2px solid var(--color-window-accent);border-bottom:2px solid var(--color-window-shadow);border-right:2px solid var(--color-window-shadow);padding:5px 5px 10px}.application-header{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;height:var(--header-height);margin-bottom:10px;padding:5px;box-sizing:border-box;background-color:var(--color-header);border:2px solid var(--color-header-accent);cursor:grab}.application-header h1{position:relative;float:left;display:flex;align-items:center;height:100%;box-sizing:border-box;padding:0 10px;margin:0;font-family:var(--font-header);font-size:2rem;color:var(--color-header-text)}.header-button-group{position:relative;float:right;display:flex;align-items:center;height:100%;padding-right:10px;gap:10px}.header-button-group button{aspect-ratio:1 / 1;height:100%;max-height:40px;padding:2px;display:grid;place-items:center;background-color:var(--color-button-head);transition:background-color .2s ease;border-top:2px solid var(--color-button-head-accent);border-left:2px solid var(--color-button-head-accent);border-bottom:2px solid var(--color-button-head-shadow);border-right:2px solid var(--color-button-head-shadow);cursor:pointer}.header-button-group button:hover{background-color:var(--color-button-head-highlight)}.header-button-group button img{aspect-ratio:1 / 1;height:100%;max-height:32px;image-rendering:pixelated;image-rendering:crisp-edges}.application-content{position:relative;overflow-y:auto;overflow-x:hidden;width:100%;height:var(--content-height);box-sizing:border-box;padding:10px;border:2px solid var(--color-content-main-accent);background-color:var(--color-content-main);font-family:var(--font-body);color:var(--color-body-text);font-size:1.25rem;scrollbar-width:thin;scrollbar-color:var(--color-scrollbar-thumb-bg) var(--color-scrollbar-track-bg)}.application-content-scroll-container{position:relative;width:100%;min-height:100%;box-sizing:border-box;justify-content:left}@media(max-width:400px){.application-header h1{font-size:1.5rem}.header-button-group button{background-color:var(--color-button-head);transition:background-color .2s ease;border:none}.header-button-group button img{aspect-ratio:1 / 1;height:100%}.minimize-button{display:none}}.skills-section{display:flex;flex-direction:row;gap:5px;width:100%;height:auto;box-sizing:border-box;padding:10px;background-color:var(--color-skills-section);box-shadow:1px 5px 5px #000}.skill-entry{padding:2px;margin:2px}.skills-section .section-title{font:var(--font-secondary-header);color:var(--color-header-text);font-size:2.2rem}.skills-section .skill-title{font:var(--font-subheader);color:var(--color-skill-text);font-size:1.3rem}.skill-category{flex:1;min-width:200px;margin-bottom:10px;text-align:center}.skill-entry-hoverable{border-top:2px solid var(--color-skills-section-accent);border-left:2px solid var(--color-skills-section-accent);border-bottom:4px solid var(--color-window-shadow);border-right:4px solid var(--color-window-shadow);padding:2px;margin:2px}.skill-entry-hoverable:hover{cursor:default}.example-button-container{display:flex;flex-direction:column;align-content:center;align-self:center;gap:10px;width:100%;height:auto}.example-button{background-color:var(--color-skill-example);border-radius:10px}.example-button:hover{background-color:var(--color-skill-example-highlight)}@media(max-width:400px)or (max-height:400px){.skills-section{flex-direction:column}}.biography{width:100%;height:auto;padding-bottom:10px;margin-bottom:20px;display:flex;gap:16px;align-items:flex-start;font:var(--font-body);color:var(--color-body-text);font-size:1.25rem}.biography img{aspect-ratio:1 / 1;width:30%;flex:0 0 auto;box-sizing:border-box;padding:10px;image-rendering:pixelated}.biography a{font:var(--font-body);color:var(--color-link)}.biography a:hover{color:var(--color-link-highlight)}@media(max-width:768px){.biography{flex-direction:column}.biography img{width:50%;max-width:none;align-self:center}}.email-form{display:flex;flex-direction:column;gap:12px}.email-form h4{padding:2px;margin:0}.email-form .input-field{background-color:var(--color-email-text-area);color:var(--color-email-text);font:var(--font-body);width:100%;resize:vertical}.email-form__honeypot{display:none}.email-form__error{color:var(--color-error, #c53939);font-size:.9rem}.email-form button{background-color:var(--color-email-text-button);color:var(--color-header-text);border:none;padding:8px 16px;cursor:pointer;transition:background-color .3s ease}.email-form button:hover{background-color:var(--color-email-text-button-highlight)}.app-image{height:100%}.app-image-container{height:100%;display:flex;justify-content:center}.project-overview{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem;background-color:var(--color-project-overview-content);font:var(--font-body);color:var(--color-body-text);border-top:2px solid var(--color-project-overview-content-accent);border-left:2px solid var(--color-project-overview-content-accent);border-bottom:2px solid var(--color-project-overview-content-shadow);border-right:2px solid var(--color-project-overview-content-shadow)}.project-overview-noContent{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem;background-color:var(--color-project-overview-container-no-content);font:var(--font-body);color:var(--color-body-text)}.project-overview .project-tags,.project-overview-noContent .project-tags{display:flex;gap:.5rem;font:var(--font-body);color:var(--color-body-text);font-size:1rem}.project-overview .project-tags span,.project-overview-noContent .project-tags span{padding:5px;border-radius:10px;background-color:var(--color-project-overview-content-secondary)}.project-overview .project-description,.project-overview-noContent .project-description{font:var(--font-body);color:var(--color-body-text);font-size:1rem}.project-overview .project-links,.project-overview-noContent .project-links{display:flex;gap:1rem}.project-overview .project-links a,.project-overview-noContent .project-links a{font:var(--font-body);color:var(--color-link)}.project-overview .project-links a:hover,.project-overview-noContent .project-links a:hover{color:var(--color-link-highlight)}.project-overview:hover{background-color:var(--color-project-overview-content-highlight)}.application-content p{font:var(--font-body);color:var(--color-body-text);font-size:1.25rem}.application-content h2{font:var(--font-secondary-header);color:var(--color-subheader-text);font-size:1.75rem}.application-content h3{font:var(--font-secondary-header);color:var(--color-subheader-text);font-size:1.5rem}.application-content a{font:var(--font-body);color:var(--color-link)}.application-content a:hover{color:var(--color-link-highlight)}.pixelated-image{image-rendering:pixelated}.clickable-image{cursor:pointer}.image-hover-body{position:absolute;z-index:100;background-color:var(--color-project-gallery-item-bg);text-align:center;width:100%;margin:1px}.image-hover-body p{color:var(--color-body-text);font-family:var(--font-body);font-size:1.2rem}.gallery{background:var(--color-content-secondary);padding:1px;display:flex;flex-wrap:wrap;justify-content:flex-start}.landscape-image,.portrait-image,.square-image{margin:1px;background-color:var(--color-project-gallery-item-bg);background-size:cover;position:relative}.landscape-image img,.portrait-image img,.square-image img{width:100%;height:100%;object-fit:cover}.landscape-image{flex-grow:2;flex-basis:400px;max-height:320px;max-width:640px}.portrait-image{flex-grow:3;flex-basis:600px;max-height:320px;max-width:960px}.square-image{flex-grow:1;flex-basis:200px;max-height:320px;max-width:320px}.project-video{width:100%;height:600px}:root{--color-desktop: transparent;--color-shortcut-button: transparent;--color-shortcut-button-highlight: #bdbaba81;--color-taskbar: #343538c0;--color-taskbar-accent: #f0f0f0;--color-taskbar-shadow: #393d41;--color-taskbar-secondary: #414142b6;--color-taskbar-searchbar-bg: #414142b6;--color-taskbar-button: transparent;--color-taskbar-button-highlight: #bdbaba;--color-taskbar-button-active: #f0f0f0;--color-taskbar-button-accent: #cccecf;--color-taskbar-button-shadow: #212529;--color-taskbar-scrollbar-thumb-bg: #79797ab6;--color-taskbar-scrollbar-track-bg: #414142b6}:root{--color-window: #3b3e3f;--color-window-accent: #6b7072;--color-window-shadow: #212529;--color-header: #33475e;--color-header-accent: #606364;--color-header-shadow: #212529;--color-button-head: transparent;--color-button-head-highlight: #9796967e;--color-button-head-accent: #6a7077;--color-button-head-shadow: #212529;--color-content-main: #415a77;--color-content-main-accent: #6a7077;--color-content-main-shadow: #212529;--color-content-secondary: #2d3e52;--color-content-secondary-highlight: #445e7c;--color-content-secondary-accent: #717e8d;--color-content-secondary-shadow: #212529;--color-button-content: transparent;--color-button-content-highlight: #9c9c9c8c;--color-button-content-accent: #f0f0f0;--color-button-content-shadow: #212529;--color-email-text-area: #414142;--color-email-text-accent: #717e8d;--color-email-text-shadow: #212529;--color-email-text-button: #414142;--color-email-text-button-highlight: #717e8d;--color-skills-section: #2d3e52;--color-skills-section-highlight: #445e7c;--color-skills-section-accent: #717e8d;--color-skills-section-shadow: #212529;--color-skill-example: #676869;--color-skill-example-highlight: #949595;--color-skill-example-accent: #717e8d;--color-skill-example-shadow: #212529;--color-project-overview-container-no-content: #212529c4;--color-project-overview-content: transparent;--color-project-overview-content-highlight: #9c9c9c8c;--color-project-overview-content-accent: #9c9c9c;--color-project-overview-content-shadow: #212529;--color-project-overview-content-secondary: #676869;--color-project-gallery-item-bg: #212529c4;--color-project-gallery-border: #212529;--color-scrollbar-thumb-bg: #6c757d;--color-scrollbar-track-bg: #34383d}:root{--color-header-text: #e9e6e6;--color-header-text-highlight: #f0f0f0;--color-header-text-shadow: #212529;--color-subheader-text: #f0f0f0;--color-subheader-text-highlight: #f0f0f0;--color-subheader-text-shadow: #212529;--color-skill-text: #878686;--color-clock-text: #e9e6e6;--color-clock-text-highlight: #f0f0f0;--color-clock-text-shadow: #212529;--color-email-text: #ffffff;--color-body-text: #d4d4d4;--color-body-text-highlight: #f0f0f0;--color-body-text-shadow: #212529;--color-shortcut-text: #c7c3c3;--color-shortcut-text-highlight: #f0f0f0;--color-shortcut-text-shadow: #000000;--color-searchbar-text: #f5f5f5;--color-link: #999999;--color-link-highlight: #f0f0f0;--color-link-shadow: #212529}:root{--font-header: "Silkscreen", monospace;--font-secondary-header: "Roboto", sans-serif;--font-body: "Roboto", sans-serif;--font-shortcut: "Silkscreen", monospace;--font-link: "Roboto", sans-serif}.category-button-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1rem}.category-button-container button{font-family:var(--font-header);font-size:1rem;color:var(--color-header-text);background-color:transparent;border:transparent}.category-button-container button img{aspect-ratio:1 / 1;width:70%;max-width:200px;image-rendering:pixelated}.category-button-container button h3{padding:0;margin:0}.category-button-container button:hover{background-color:var(--color-button-content-highlight)}.project-list{display:flex;flex-direction:column;gap:1rem;padding:1rem}@media(max-width:400px){.category-button-container{flex-direction:column}.category-button-container button img{max-width:100px;image-rendering:pixelated}}
