*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}body{scroll-behavior:smooth;text-rendering:optimizespeed;line-height:1.5}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}ul,ol{list-style:none}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}pre[class*=language-],code[class*=language-]{color:#d4d4d4;text-shadow:none;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;tab-size:4;-webkit-hyphens:none;hyphens:none;direction:ltr;font-family:Menlo,Monaco,Consolas,Andale Mono,Ubuntu Mono,Courier New,monospace;font-size:13px;line-height:1.5}pre[class*=language-]::selection{text-shadow:none;background:#264f78}code[class*=language-]::selection{text-shadow:none;background:#264f78}pre[class*=language-] ::selection{text-shadow:none;background:#264f78}code[class*=language-] ::selection{text-shadow:none;background:#264f78}@media print{pre[class*=language-],code[class*=language-]{text-shadow:none}}pre[class*=language-]{background:#1e1e1e;margin:.5em 0;padding:1em;overflow:auto}:not(pre)>code[class*=language-]{color:#db4c69;background:#1e1e1e;border-radius:.3em;padding:.1em .3em}.namespace{opacity:.7}.token.doctype .token.doctype-tag{color:#569cd6}.token.doctype .token.name{color:#9cdcfe}.token.comment,.token.prolog{color:#6a9955}.token.punctuation,.language-html .language-css .token.punctuation,.language-html .language-javascript .token.punctuation{color:#d4d4d4}.token.property,.token.tag,.token.boolean,.token.number,.token.constant,.token.symbol,.token.inserted,.token.unit{color:#b5cea8}.token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.deleted{color:#ce9178}.language-css .token.string.url{text-decoration:underline}.token.operator,.token.entity{color:#d4d4d4}.token.operator.arrow{color:#569cd6}.token.atrule{color:#ce9178}.token.atrule .token.rule{color:#c586c0}.token.atrule .token.url{color:#9cdcfe}.token.atrule .token.url .token.function{color:#dcdcaa}.token.atrule .token.url .token.punctuation{color:#d4d4d4}.token.keyword{color:#569cd6}.token.keyword.module,.token.keyword.control-flow{color:#c586c0}.token.function,.token.function .token.maybe-class-name{color:#dcdcaa}.token.regex{color:#d16969}.token.important{color:#569cd6}.token.italic{font-style:italic}.token.constant{color:#9cdcfe}.token.class-name,.token.maybe-class-name{color:#4ec9b0}.token.console,.token.parameter,.token.interpolation{color:#9cdcfe}.token.punctuation.interpolation-punctuation,.token.boolean{color:#569cd6}.token.property,.token.variable,.token.imports .token.maybe-class-name,.token.exports .token.maybe-class-name{color:#9cdcfe}.token.selector,.token.escape{color:#d7ba7d}.token.tag{color:#569cd6}.token.tag .token.punctuation,.token.cdata{color:gray}.token.attr-name{color:#9cdcfe}.token.attr-value,.token.attr-value .token.punctuation{color:#ce9178}.token.attr-value .token.punctuation.attr-equals{color:#d4d4d4}.token.entity{color:#569cd6}.token.namespace{color:#4ec9b0}pre[class*=language-javascript],code[class*=language-javascript],pre[class*=language-jsx],code[class*=language-jsx],pre[class*=language-typescript],code[class*=language-typescript],pre[class*=language-tsx],code[class*=language-tsx]{color:#9cdcfe}pre[class*=language-css],code[class*=language-css]{color:#ce9178}pre[class*=language-html],code[class*=language-html]{color:#d4d4d4}.language-regex .token.anchor{color:#dcdcaa}.language-html .token.punctuation{color:gray}pre[class*=language-]>code[class*=language-]{z-index:1;position:relative}.line-highlight.line-highlight{z-index:0;background:#f7ebc6;box-shadow:inset 5px 0 #f7d87c}:root{--text-color:#222;--text-color-muted:#222222b3;--bg-color:#fff;--border-color:#aaa;--box-shadow-color:1px 1px 5px #0003;--primary-color:#0070f3;--primary-color-darker:#0050b3;--header-height:4rem;--logo-width:75px;--logo-height:77px;--logo-color:#000;--main-content-width:800px;--standalone-code-color:#c2410c;--space-1:.25rem;--space-2:.5rem;--space-3:1rem;--space-4:1.5rem;--space-5:2rem;--space-6:3rem;--space-7:4rem;--text-sm:.875rem;--text-base:1.125rem;--text-lg:1.25rem;--text-xl:1.5rem;--text-2xl:1.875rem;--text-3xl:2.25rem;--text-4xl:3rem;--text-5xl:3.75rem;--leading-none:1;--leading-tight:1.25;--leading-normal:1.5;--leading-relaxed:1.625;--leading-loose:2}@media (prefers-color-scheme:dark){:root{--text-color:#ddd;--text-color-muted:#ddddddb3;--bg-color:#111;--box-shadow-color:0 0 8px #3291ff4d;--primary-color:#4da0ff;--border-color:#333;--logo-color:#fff;--standalone-code-color:#ce9178}}html{scrollbar-gutter:stable;min-height:100dvh}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;line-height:var(--leading-normal);color:var(--text-color);background-color:var(--bg-color);overflow-y:scroll}.container{flex-direction:column;gap:1rem;width:100%;max-width:1200px;min-height:100vh;margin:0 auto;padding:0 1rem;display:flex}.main-header{height:var(--header-height);border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:0 1rem;display:flex}.site-title{height:var(--header-height);align-items:center;font-size:1.5rem;font-weight:700;display:flex}.site-title a{color:var(--text-color);align-items:center;height:100%;text-decoration:none;display:flex}.logo{width:2rem;height:2rem;color:var(--logo-color);fill:currentColor;margin:auto 0;display:block}.main-nav ul{gap:2rem;list-style:none;display:flex}.main-nav a{color:var(--text-color);padding:.5rem 0;font-weight:500;text-decoration:none}.main-nav a:hover,.main-nav a.active{color:var(--primary-color)}.main-content{padding:0 1rem;width:var(--main-content-width);flex-grow:1;max-width:100%;margin-inline:auto;padding-block-start:2rem}.main-content:has(.about-section){width:auto}.main-content h1{text-wrap:pretty;font-size:var(--text-3xl);line-height:var(--leading-tight);margin-bottom:var(--space-4);letter-spacing:-.01em;font-weight:700}.posts>article{margin-bottom:var(--space-4);gap:var(--space-3);grid-template-columns:auto 1fr;display:grid}.posts .archive-post-grid{grid-template-columns:subgrid;grid-column:1/-1;text-decoration:none;display:grid}.posts .archive-post-grid .archive-post-image{width:110px;height:110px;margin:0}.posts .archive-post-grid .archive-post-image img{object-fit:cover;border-radius:4px;width:100%;height:100%}.posts .archive-post-grid .archive-post-content{gap:var(--space-2);flex-direction:column;display:flex}.posts .archive-post-grid .archive-post-content time,.posts .archive-post-grid .archive-post-content p{color:var(--text-color)}.posts .archive-post-grid .archive-post-content .archive-post-title{color:var(--text-color);margin:0;text-decoration:none;transition:color .2s ease-in-out}.posts .archive-post-grid:hover .archive-post-title{color:var(--primary-color)}.post-content p,.main-content p{font-size:var(--text-base);line-height:var(--leading-relaxed);margin-bottom:var(--space-4);max-width:70ch}.content-link{color:var(--primary-color);outline-offset:2px;outline:1px solid #0000;text-decoration:none;transition:outline-color .2s}.content-link:hover{outline-color:var(--primary-color)}.social-links{flex-direction:column;gap:1rem;display:flex}.social-links .social-link{color:var(--primary-color);outline-offset:2px;border-radius:4px;outline:1px solid #0000;align-items:center;gap:.75rem;padding:.5rem;text-decoration:none;transition:all .2s;display:flex}.social-links .social-link:hover{background-color:var(--surface-3);outline-color:var(--primary-color)}.social-links .social-link svg{flex-shrink:0}.post-content{max-width:800px;margin:0 auto;padding-block-end:var(--space-4)}.post-content>:first-child{margin-top:0}.post-content h1{font-size:var(--text-5xl);line-height:var(--leading-none);margin-bottom:var(--space-6);letter-spacing:-.02em;text-wrap:pretty;font-weight:800}.post-content h2{font-size:var(--text-3xl);line-height:var(--leading-tight);margin-top:var(--space-6);margin-bottom:var(--space-4);letter-spacing:-.01em;font-weight:700}.post-content h3{font-size:var(--text-2xl);line-height:var(--leading-tight);margin-top:var(--space-5);margin-bottom:var(--space-3);font-weight:600}:is(.post-content ul,.post-content ol) p{margin:0}.post-content ul,.post-content ol{margin:var(--space-4) 0;padding-left:var(--space-5);max-width:65ch}.post-content ul{list-style:none}.post-content ul li{font-size:var(--text-base);position:relative}.post-content ul li:before{content:"•";color:var(--primary-color);left:calc(-1 * var(--space-4));font-weight:700;position:absolute}.post-content code{background-color:color-mix(in srgb, var(--primary-color) 8%, var(--bg-color));color:var(--standalone-code-color);border-radius:4px;padding:.2em .4em;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.9em}.post-content blockquote{margin:var(--space-5) 0;padding:var(--space-4);border-left:4px solid var(--primary-color);background-color:color-mix(in srgb, var(--primary-color) 5%, var(--bg-color));border-radius:0 8px 8px 0}.post-content blockquote p{font-size:var(--text-lg);color:var(--text-color);margin-bottom:var(--space-3);font-style:italic;line-height:var(--leading-relaxed)}.post-content blockquote p:last-child{margin-bottom:0}.post-content blockquote cite{font-size:var(--text-base);color:var(--text-color-muted);margin-top:var(--space-2);font-style:normal;display:block}.post-content blockquote ol,.post-content blockquote ul{margin:0}.post-content blockquote ol{list-style-type:decimal}.post-content pre{margin:var(--space-4) 0;padding:var(--space-4);background-color:#1e1e1e;border:1px solid #333;border-radius:8px;overflow-x:auto}.post-content pre code{font-size:var(--text-base);line-height:var(--leading-relaxed);color:#d4d4d4;background-color:#0000;padding:0}.post-content img{margin:var(--space-6) 0;border-radius:8px;max-width:100%;height:auto;display:block}.post-content figure{margin:var(--space-6) 0}.post-content figure img{margin:0}.post-content figure figcaption{margin-top:var(--space-2);text-align:center;font-size:var(--text-sm);color:var(--text-color-muted)}.post-content hr{text-align:center;margin-block:var(--space-5);color:var(--text-color-muted);font-family:ui-monospace,monospace;font-size:var(--text-base);border:0}.post-content hr:before{content:"/////"}.post-content hr:after{content:attr(data-content) "/////"}.projects{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;display:grid}.project-card{background:var(--bg-color);border:1px solid var(--border-color);box-shadow:var(--box-shadow-color);padding:var(--space-4);margin-bottom:var(--space-4);gap:var(--space-3);border-radius:8px;flex-direction:column;transition:transform .2s;display:flex;position:relative}.project-images-stack{width:100%;height:180px;margin:var(--space-3) 0 0;perspective:1000px;cursor:pointer;background:0 0;border:none;justify-content:center;padding:0;display:flex;position:relative}.project-image-wrapper{pointer-events:none;background:var(--bg-color);border:1px solid var(--border-color);transform-origin:50%;will-change:transform;border-radius:4px;width:240px;height:150px;position:absolute;overflow:hidden;box-shadow:0 1px 3px #0000001a}.project-image-wrapper:not(:first-child){transition:none}.project-image-wrapper:first-child{--stack-rotation:var(--stack-rotation-1,-6deg);--stack-translate-x:-4px;z-index:3;transform:rotate(var(--stack-rotation)) translateX(var(--stack-translate-x));animation:none;top:0}.project-image-wrapper:nth-child(2){--stack-rotation:var(--stack-rotation-2,4deg);--stack-translate-x:8px;z-index:2;transform:rotate(var(--stack-rotation)) translateX(var(--stack-translate-x));animation:none;top:4px}.project-image-wrapper:nth-child(3){--stack-rotation:var(--stack-rotation-3,-3deg);--stack-translate-x:-12px;z-index:1;transform:rotate(var(--stack-rotation)) translateX(var(--stack-translate-x));animation:none;top:8px}.project-image-wrapper:nth-child(4){--stack-rotation:var(--stack-rotation-4,7deg);--stack-translate-x:4px;z-index:0;transform:rotate(var(--stack-rotation)) translateX(var(--stack-translate-x));animation:none;top:12px}.project-image-wrapper:nth-child(5){--stack-rotation:var(--stack-rotation-5,-5deg);--stack-translate-x:-8px;z-index:-1;transform:rotate(var(--stack-rotation)) translateX(var(--stack-translate-x));animation:none;top:16px}.work-ready .project-image-wrapper:first-child{animation:.8s cubic-bezier(.68,-.6,.32,1.6) forwards stack-rotate-1}.work-ready .project-image-wrapper:nth-child(2){animation:.8s cubic-bezier(.68,-.6,.32,1.6) .1s forwards stack-rotate-1}.work-ready .project-image-wrapper:nth-child(3){animation:.8s cubic-bezier(.68,-.6,.32,1.6) .2s forwards stack-rotate-1}.work-ready .project-image-wrapper:nth-child(4){animation:.8s cubic-bezier(.68,-.6,.32,1.6) .3s forwards stack-rotate-1}.work-ready .project-image-wrapper:nth-child(5){animation:.8s cubic-bezier(.68,-.6,.32,1.6) .4s forwards stack-rotate-1}@keyframes stack-rotate-1{0%{transform:rotate(0)translate(0)}75%{transform:rotate(calc(var(--stack-rotation) * 1.2)) translateX(calc(var(--stack-translate-x) * 1.1))}to{transform:rotate(var(--stack-rotation)) translateX(var(--stack-translate-x))}}@keyframes top-elem-hover{0%{transform:rotate(var(--stack-rotation)) translateX(var(--stack-translate-x))}to{transform:translateY(-2px)scale(1.02)rotate(0)translate(0)}}.project-image-wrapper:first-child{pointer-events:auto;cursor:pointer}button.project-images-stack:hover .project-image-wrapper:first-child{z-index:10;animation:.4s cubic-bezier(.34,1.56,.64,1) .1s forwards top-elem-hover;box-shadow:0 8px 16px #00000026}.project-image-wrapper:before{content:"";background:#ffffff80;height:1px;position:absolute;top:0;left:0;right:0}.project-image-wrapper:after{content:"";background:var(--border-color);z-index:-1;height:2px;position:absolute;bottom:-2px;left:2px;right:2px}.project-image{object-fit:cover;width:100%;height:100%}.project-image-caption{color:#fff;font-size:var(--text-sm);opacity:0;text-align:center;background:#000000b3;padding:6px;transition:opacity .3s,transform .3s cubic-bezier(.34,1.56,.64,1);position:absolute;bottom:0;left:0;right:0;transform:translateY(100%)}.project-images-stack:hover .project-image-caption{opacity:1;transform:translateY(0)}.project-image-wrapper:not(:first-child) .project-image-caption{display:none}.project-title{align-items:center;gap:var(--space-2);display:flex}.project-content{margin-bottom:var(--space-2);flex-grow:1}.technologies{flex-wrap:wrap;gap:.5rem;display:flex}.tech-tag{background-color:var(--primary-color-darker);color:#fff;border-radius:4px;align-items:center;gap:.65rem;padding:.2rem .5rem;font-size:1rem;display:inline-flex}.skills-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;display:grid}.skill-category h3{margin-bottom:1rem}.skills-list{flex-wrap:wrap;gap:.5rem;display:flex}.skill-tag{background-color:var(--primary-color-darker);color:#fff;border-radius:4px;align-items:center;gap:.65rem;padding:.2rem .5rem;font-size:1.35rem;display:inline-flex}.skill-icon{vertical-align:middle;width:1em;height:1em;display:inline-block}.contact-form{margin:0 auto}.form-group{margin-bottom:1.5rem}.form-group label{margin-bottom:.5rem;font-weight:500;display:block}.form-group input,.form-group textarea{border:1px solid var(--border-color);background-color:var(--bg-color);width:100%;color:var(--text-color);border-radius:4px;padding:.75rem}.submit-button{background-color:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:.75rem 1.5rem;font-weight:500}.submit-button:hover{opacity:.9}.post-title{color:var(--primary-color);text-decoration:none}.post-title:hover{text-decoration:underline}.main-footer{text-align:center;color:var(--text-color-muted);padding:1rem 0}@media (width<=768px){.main-header{flex-direction:column;height:auto;padding:1rem}.main-nav ul{flex-wrap:wrap;justify-content:center;gap:1rem}.skills-grid{grid-template-columns:1fr}:root{--text-4xl:2.5rem;--text-5xl:3rem}.post-content{padding-inline:0}.post-content h1{text-wrap:pretty;font-size:var(--text-4xl);margin-bottom:var(--space-5)}.post-content h2{font-size:var(--text-2xl)}.post-content h3{font-size:var(--text-xl)}.post-content blockquote p{font-size:var(--text-lg)}}.about-section{margin-inline:auto}.about-container{grid-template-columns:515px 250px;grid-template-areas:"image sidebar""text text";gap:1rem;display:grid}.about-main{display:contents}.about-main img{border-radius:8px;grid-area:image;width:100%;max-width:800px;height:auto;margin-bottom:0!important}.about-main .text-content{grid-area:text}.about-sidebar{background:var(--surface-2);border-radius:8px;grid-area:sidebar;align-self:start;padding:1.5rem}@media (width<=768px){.about-container{grid-template-columns:1fr;grid-template-areas:"image""text""sidebar";gap:2rem}}.priority-image{contain:paint;content-visibility:auto;will-change:transform}.project-dialog{background:var(--bg-color);opacity:0;border:none;border-radius:12px;width:90vw;max-width:min(90vw,1200px);max-height:90vh;padding:0;transition:opacity .2s,transform .2s;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)scale(.95)}.project-dialog.dialog-open{opacity:1;transform:translate(-50%,-50%)scale(1)}.project-dialog::backdrop{opacity:0;background:#00000080;transition:opacity .2s}.project-dialog.dialog-open::backdrop{opacity:1}.project-dialog .dialog-content{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--text-color-muted) var(--bg-color);max-height:90vh;overflow-y:auto}.project-dialog .dialog-header{padding:var(--space-4);background:var(--bg-color);border-bottom:1px solid var(--border-color);z-index:1;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.project-dialog .dialog-header h2{font-size:var(--text-xl);margin:0}.project-dialog .dialog-close{font-size:var(--text-2xl);cursor:pointer;width:32px;height:32px;color:var(--text-color);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;transition:background-color .2s;display:flex;overflow:hidden}.project-dialog .dialog-close:hover{background-color:color-mix(in srgb, var(--text-color) 10%, transparent)}.project-dialog .dialog-title{color:var(--text-color)}.project-dialog .dialog-body{padding:var(--space-4);gap:var(--space-6);display:grid}.project-dialog .dialog-body figure{margin:0 auto var(--space-4);max-width:500px}.project-dialog .dialog-body figure img{width:100%;height:auto;margin-bottom:var(--space-2);border-radius:8px}.project-dialog .dialog-body figure figcaption{text-align:center;color:var(--text-color-muted);font-size:var(--text-base)}.project-link{background-color:var(--primary-color-darker);padding:var(--space-3);text-align:center;margin:var(--space-4) calc(var(--space-4) * -1) calc(var(--space-4) * -1);border-radius:0 0 8px 8px;font-weight:500;text-decoration:none;transition:background-color .2s;display:block;color:#fff!important}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.posts .archive-post-grid .post-title{transition:color .2s ease-in-out}.blog-post-title{color:var(--text-color);text-decoration:none}@media (width<=450px){.posts>article{grid-template-columns:1fr}.posts .archive-post-grid{gap:.5rem}.posts .archive-post-grid .archive-post-image{width:auto;height:auto}}.header-left{height:var(--header-height);align-items:center;gap:.5rem;display:flex}.header-profile-image{height:var(--header-height);align-items:center;display:flex}.header-avatar{object-fit:cover;view-transition-name:profile-image;border-radius:4px}.priority-image{view-transition-name:profile-image}::view-transition-group(profile-image){z-index:1000;animation-duration:.6s;animation-timing-function:cubic-bezier(.4,0,.2,1)}::view-transition-old(profile-image){mix-blend-mode:normal;backface-visibility:hidden;animation-duration:.6s;animation-timing-function:cubic-bezier(.4,0,.2,1);transform:translateZ(0)}::view-transition-new(profile-image){mix-blend-mode:normal;backface-visibility:hidden;animation-duration:.6s;animation-timing-function:cubic-bezier(.4,0,.2,1);transform:translateZ(0)}::view-transition{pointer-events:none}.project-card{contain:layout style paint;content-visibility:auto}.project-images-stack,.project-image-wrapper{will-change:transform;contain:layout}::view-transition-group(*){will-change:transform, opacity}::view-transition-image-pair(*){isolation:isolate}