@font-face{font-family:JetBrainsRegular;src:url(./JetBrainsMono-Regular-Dh36KTnx.ttf)}#root{font-family:JetBrainsRegular,Roboto,sans-serif;margin:0 auto;width:clamp(320px,98vw,1280px)}body{margin:0;padding:0;display:grid;justify-content:center;min-height:100vh;min-height:100dvh}h1,h2,h3,h4,p{margin:0}button{font-family:inherit;border:none}img{display:block;max-width:100%}@font-face{font-family:JetBrainsBold;src:url(./JetBrainsMono-Bold-DirYFTCx.ttf) format("truetype")}@media (prefers-color-scheme: dark){:root{--bg-color: #222f3a;--text-color: #f0f0f0;--alt-text-color: #0f0f0f;--card-bg-color: #9393fa;--section-bg-color: rgba(255, 255, 227, .1);--card-shadow-color: #0f0f0f}}:root{--bg-color: hsl(0, 0%, 90%);--text-color: #222f3a;--card-text-color: #222f3a;--alt-text-color: #f0f0f0;--card-bg-color: hsl(0, 5%, 81%);--section-bg-color: rgba(34, 47, 58, .1);--card-shadow-color: #222f3a;--highlight: #6060ff;--highlight-light: #7272ff}.dark{--bg-color: hsl(224, 36%, 15%);--text-color: #f0f0f0;--alt-text-color: #0f0f0f;--card-bg-color: hsl(0, 5%, 81%);--section-bg-color: rgba(255, 255, 227, .1);--card-shadow-color: #0f0f0f}body{color:var(--text-color);background-color:var(--bg-color)}.defined-section{padding:.5rem 1rem;background-color:var(--section-bg-color)}.skill-tab{color:var(--alt-text-color);font-size:1rem;padding-inline:.5rem;padding-block:1px;background-color:var(--highlight-light);transition:background-color .3s}button.skill-tab{cursor:pointer}button.skill-tab:hover{background-color:var(--highlight)}.loading{margin-block-start:1rem;display:flex}.loading div{--_dot-delay: 0ms;animation:dotFlash 1.2s var(--_dot-delay) infinite}.loading div:nth-child(1){margin-inline-start:.5ch}.loading div:nth-child(2){--_dot-delay: .2s}.loading div:nth-child(3){--_dot-delay: .4s}@keyframes dotFlash{0%,to{opacity:1}50%{opacity:0}}header,main{padding-inline:1rem}.theme-button{position:fixed;top:1rem;right:1rem;padding:.25rem;border:2px solid var(--card-bg-color);border-radius:.5rem;background-color:var(--card-bg-color);color:var(--alt-text-color);box-shadow:1px 1px 6px 0 var(--card-shadow-color);cursor:pointer;z-index:100;transition:border-color .3s}.theme-button:hover{border-color:var(--highlight-light)}header{max-width:max-content;margin-inline:auto;margin-block-end:1rem}header h1{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:3rem;font-style:italic;text-align:center}header .sub-head{position:relative;text-align:end;font-size:.9rem;height:1.2rem;margin-inline-start:auto;transform-style:preserve-3d;transition:transform .5s;animation:sub-head-scroll 15s ease-in-out infinite}header .sub-head>*{position:absolute;right:0;width:max-content;backface-visibility:hidden}header .sub-head .upper{transform:rotateY(0)}header .sub-head .lower{transform:rotateX(-90deg) translateY(.3rem)}@keyframes sub-head-scroll{0%,44.5%{transform:rotateX(0)}49.5%{transform:rotateX(90deg)}94.5%{transform:rotateX(90deg)}99.5%{transform:rotateX(0)}}.contact p{max-width:80ch;margin:.4rem auto}.contact-info{display:flex;flex-wrap:wrap;row-gap:1.5rem;column-gap:1rem;justify-content:center;margin-block:2.5rem 1rem}.contact-info-item{position:relative;color:var(--highlight);transition:color .3s}.contact-info-item :visited{color:var(--highlight)}.contact-info-item :hover{color:var(--text-color)}.contact-info-item span{position:absolute;top:-1rem;color:var(--text-color);font-size:.8rem;font-weight:700;transition:margin .3s}.contact-info-item:hover{color:var(--highlight-light)}.contact-info-item:hover span{margin-inline-start:.5rem}.skills{margin-block-start:2rem;min-height:6rem}.skills .skills-header{display:flex;align-items:end;flex-wrap:wrap;column-gap:2rem}.skills .skills-header p{margin-inline:auto}.skills ul{display:flex;flex-wrap:wrap;column-gap:2rem;list-style:none;margin-block:0rem .5rem;padding-inline:0rem}.skills ul li{--_delay: .1s;opacity:0;transform:translateY(100%);position:relative;display:flex;flex-wrap:wrap;column-gap:.5rem;row-gap:.5rem;margin-block:.6rem;padding:1.2rem .25rem .25rem;min-width:13rem;background-color:var(--card-bg-color);box-shadow:1px 1px 6px 0 var(--card-shadow-color);animation:up-in .6s var(--_delay) ease forwards}.skills ul li:nth-child(2){--_delay: .2s}.skills ul li:nth-child(3){--_delay: .3s}.skills ul li:nth-child(4){--_delay: .4s}.skills ul li:nth-child(5){--_delay: .5s}.skills ul li:nth-child(6){--_delay: .6s}.skills ul li:nth-child(7){--_delay: .7s}.skills ul li:hover .label{margin-inline-start:.5rem}.skills ul .label{position:absolute;top:0rem;color:var(--card-text-color);font-size:.8rem;font-weight:700;transition:margin .3s}.projects-container{margin-block:2rem;min-height:15rem}.projects-container .projects-header{display:flex;flex-wrap:wrap;align-items:center;column-gap:5vw;row-gap:.5rem;min-height:1.7rem;padding-bottom:.25rem}.projects-container .projects-header .filter-cont{display:flex;align-items:center;flex-wrap:wrap;column-gap:1rem;row-gap:.5rem}.projects-container .projects-header .filter-cont .projects-count{opacity:0;animation:fadeIn .1s .3s ease forwards}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:1rem;margin-block:.5rem 1rem}.project-card{display:flex;flex-direction:column;row-gap:.5rem;padding:.5rem;color:var(--card-text-color);background-color:var(--card-bg-color);box-shadow:1px 1px 6px 0 var(--card-shadow-color);transition:scale .3s}.project-card h4{font-size:17px;text-decoration:underline;text-decoration-thickness:2px}.project-card .project-tech{display:flex;flex-wrap:wrap;column-gap:.5rem;row-gap:.5rem}.project-card .project-links{display:flex;justify-content:space-between;margin-top:auto}.project-card.featured{outline:4px solid var(--highlight-light);outline-offset:-4px}.project-card:hover{scale:1.01;box-shadow:1px 1px 8px 0 var(--card-shadow-color)}.filter-item{display:flex;align-items:center;width:max-content;border:1px solid var(--highlight-light);box-shadow:1px 1px 6px 0 var(--card-shadow-color);transition:background-color .3s}.filter-item span{font-size:.9rem;padding-inline:.5rem}.filter-item button{padding:0;background-color:var(--highlight-light);cursor:pointer}.filter-item button:hover{background-color:var(--highlight)}@keyframes up-in{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.fade-out{opacity:0;pointer-events:none}.fade-in{opacity:1;animation:fadeIn .6s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@media screen and (max-width: 520px){.contact-info{justify-content:start}.projects-grid{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr))}}