header{text-align:center;font-size:.85em;line-height:1.75em}header a{border-color:var(--color-underline)}header button{user-select:all}header a:hover,header button:hover{color:var(--color-accent);border-bottom:.15em solid var(--color-accent)}:root[data-theme=light] #theme-btn-light,:root[data-theme=dark] #theme-btn-dark{display:initial}:root[data-theme=light] #theme-btn-dark,:root[data-theme=dark] #theme-btn-light{display:none}@media (prefers-color-scheme: dark){#theme-btn-light{display:none}}@media not (prefers-color-scheme: dark){#theme-btn-dark{display:none}}@media (max-width: 500px){header{font-size:12.5px}}#intro{display:flex;align-items:center;justify-content:center;gap:2em;margin-top:12vh;margin-bottom:6vh}#intro picture{width:10em;height:10em;box-shadow:.2em .2em 1em var(--color-shadow);background:var(--color-image-background);border-radius:.5em;overflow:hidden}#intro picture img{width:100%;height:100%;object-fit:cover}h1{width:min-content;margin:0;max-width:12em;font-size:2.2em;line-height:1.2em}h1 span{display:inline-block;white-space:nowrap}h1 span:after{content:" "}h1 strong{color:var(--color-accent);font-weight:700}#wave{padding-left:1.25em;display:inline-block}#wave span{position:relative;cursor:default;margin-bottom:-.2em;animation:Waving 1.3s cubic-bezier(.25,.46,.45,.94) .4s 1 forwards}#wave span:after{content:"👋";position:absolute;bottom:-0em;right:0;cursor:grab;transition:transform .05s}#wave:active span:after{cursor:grabbing;transform:scale(.9)}@media (max-width: 740px){#intro picture{width:7.8em;height:7.8em}h1{font-size:1.6em}}@media (max-width: 500px){#intro{flex-direction:column;margin-top:8vh;margin-bottom:4vh}h1{font-size:1.4em;line-height:1.1em;text-align:center}}@keyframes Waving{0%{transform:rotate(0)}13%{transform:rotate(8deg)}26%{transform:rotate(0)}39%{transform:rotate(10deg)}52%{transform:rotate(0)}65%{transform:rotate(8deg)}76%{transform:rotate(-2deg)}90%{transform:rotate(8deg)}to{transform:rotate(-1deg)}}#contact{text-align:center;list-style:none;padding:0;margin:0}#contact li{display:inline-block}#contact a{font-size:1.2em;padding:.1em 0;margin:.3em 1.4em;border-color:var(--color-underline)}#contact a:focus-visible,#contact a:hover{padding:.4em 1.4em;margin:0;color:#fff;border:none;border-radius:.5em;background-color:var(--color-accent);box-shadow:.5em .5em 1em var(--color-shadow)}#contact a:active{opacity:.8}@media (max-width: 740px){#contact a{font-size:1em;margin:.3em 1em}#contact a:focus-visible,#contact a:hover{padding:.4em 1em}}@media (max-width: 500px){#contact{gap:.6em;text-align:center;flex-direction:column}}#projects{margin-top:10vh;padding:3em}#projects h2{margin-top:4em}#main-project,.projects{padding:3em}#main-project{border-radius:20px;box-shadow:.5em .5em 3em var(--color-shadow);background-color:var(--color-card-background)}.card{display:grid;row-gap:.5em;column-gap:2em;grid-template-columns:240px 1fr;grid-template-areas:"title desc" "links desc" "hr hr"}.card:has(picture img){grid-template-areas:"image title" "image desc" "links desc" "hr hr"}.card hr{grid-area:hr}.card-image{grid-area:image}.card-title{grid-area:title}.card-links{grid-area:links}.card-desc{grid-area:desc}@supports not (selector(:has(p))){.card-image{display:none}}.card:has(picture img) picture{display:initial}.card picture{display:none}.card picture img{display:block;width:100%;height:10em;max-width:16em;object-fit:cover;margin-left:-.5em;border-radius:.5em;background:var(--color-image-background)}:root[data-theme=dark] .card picture img.light-preview,:root[data-theme=light] .card picture img.light-preview{display:initial}:root[data-theme=dark] .card picture img.light-preview,:root[data-theme=light] .card picture img.dark-preview{display:none}@media (prefers-color-scheme: dark){.card picture img.light-preview{display:none}}@media not (prefers-color-scheme: dark){.card picture img.dark-preview{display:none}}.card-heading{display:flex;justify-content:space-between;gap:.5em}#main-project h2,.card h3{font-size:1.4em;line-height:1em;margin:0;word-break:keep-all}.card-tags{display:inline-flex;align-items:center;gap:.5em}.card-tags img{width:1em;height:1em;border-radius:2px}.card .card-title>span{margin:0;font-size:.8em;opacity:.8}.card:not(.with-image) .card-desc{margin:0}.card p{text-align:left;margin:1em 0 1.5em}.card .card-links{margin:0;font-size:16px;line-height:1.2em}.card-links a{display:flex;align-items:center;width:fit-content;column-gap:.4em;margin-top:.4em}.card-links a[href="#"]{display:none}.card button:active{opacity:.7}#projects hr{height:1px;width:50%;margin:2.5em auto;border:none;opacity:.2;background-color:var(--color-text)}.card:last-child hr{display:none}@media (max-width: 700px){#projects>h2{text-align:center;margin-left:1em;margin-right:1em}.projects{padding:2em;margin:8vh auto;max-width:30em}#projects{padding:1em}.card{row-gap:1em;grid-template-columns:1fr;grid-template-areas:"title" "desc" "more" "links" "hr"}.card:has(picture img){grid-template-areas:"image" "title" "desc" "more" "links" "hr"}.card picture img{margin:auto auto 1em}}@media (max-width: 500px){.card picture img{margin-bottom:0}}:root{--color-image-background: linear-gradient(45deg, rgba(69, 142, 232, .6), rgba(69, 142, 232, .2))}:root[data-theme=light]{color-scheme:light only;--color-text: #3a3b3c;--color-accent: #458ee8;--color-shadow: #4d709922;--color-underline: #4d709922;--color-background: #f6fbfd;--color-card-background: #fffc;--color-more-background: #f3f8fd}:root[data-theme=dark]{color-scheme:dark only;--color-text: #ddd;--color-accent: #458ee8;--color-shadow: #000;--color-underline: #666;--color-background: #000;--color-card-background: #111;--color-more-background: #222}@media (prefers-color-scheme: dark){:root{color-scheme:dark only;--color-text: #ddd;--color-accent: #458ee8;--color-shadow: #000;--color-underline: #666;--color-background: #000;--color-card-background: #111;--color-more-background: #222}}@media not (prefers-color-scheme: dark){:root{color-scheme:light only;--color-text: #3a3b3c;--color-accent: #458ee8;--color-shadow: #4d709922;--color-underline: #4d709922;--color-background: #f6fbfd;--color-card-background: #fffc;--color-more-background: #f3f8fd}}html{background-color:var(--color-background)}body{position:relative;max-width:50em;min-width:330px;color:var(--color-text);margin:5vh auto 10vh;font-weight:500;font-size:18px;font-family:system-ui,sans-serif;line-height:1.5em}*{box-sizing:border-box}a{text-decoration:none;color:inherit}a:hover{color:var(--color-accent);border-color:var(--color-accent)}a:active{opacity:.8}picture img{color:transparent}a,label,button{padding:0;color:inherit;font-weight:inherit;font-size:inherit;font-family:inherit;border:none;border-bottom:.14em solid var(--color-underline);background-color:transparent;cursor:pointer}label:focus-visible,button:focus-visible,a:focus-visible{border-color:transparent;outline:3px solid var(--color-accent)}ul{list-style:none;padding:0;margin:0}svg{display:block;width:16px;height:16px;fill:var(--color-text);outline:none}#backtotop{text-align:center}@media (max-width: 1200px) or (max-height: 901px){#projects,body{font-size:17px}}@media (max-width: 500px){#projects,body{font-size:16px}}
