.header{width:100%;z-index:var(--z-sticky);transition:background var(--dur-short) var(--ease-out);background:0 0;position:fixed;top:0;left:0}.header-scrolled{background:var(--color-paper-2);border-bottom:var(--rule-hair) solid var(--color-rule)}.progress-bar{background:var(--color-accent);height:2px;z-index:calc(var(--z-sticky) + 1);transition:width .1s linear;position:fixed;top:0;left:0}.header-nav{padding:0 var(--page-gutter);justify-content:space-between;align-items:center;height:56px;display:flex}.header-logo{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-accent);font-weight:500;text-decoration:none}.header-logo:before{content:"$ ";color:var(--color-accent-dim)}.header-logo:hover{color:var(--color-ink);text-decoration:none}.header-links{align-items:center;gap:var(--space-lg);list-style:none;display:flex}.header-links a{font-size:var(--text-sm);color:var(--color-muted);padding:var(--space-3xs) 0;font-weight:400;position:relative}.header-links a:hover{color:var(--color-accent);text-decoration:none}.header-links a:before{content:"> ";color:var(--color-accent-dim);opacity:0;transition:opacity var(--dur-micro) var(--ease-out)}.header-links a:hover:before{opacity:1}.header-social-link{align-items:center;display:flex;color:var(--color-muted)!important;transition:color var(--dur-micro) var(--ease-out)!important}.header-social-link:hover{color:var(--color-accent)!important}.header-social-link:before{display:none!important}.hamburger{cursor:pointer;padding:var(--space-2xs);background:0 0;border:none;flex-direction:column;gap:4px;display:none}.hamburger-line{background:var(--color-ink);width:20px;height:1.5px;transition:transform var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out);border-radius:1px;display:block}.hamburger-line.open:first-child{transform:translateY(5.5px)rotate(45deg)}.hamburger-line.open:nth-child(2){opacity:0}.hamburger-line.open:nth-child(3){transform:translateY(-5.5px)rotate(-45deg)}@media (width<=768px){.hamburger{display:flex}.header-links{background:var(--color-paper-2);border-bottom:var(--rule-hair) solid var(--color-rule);width:100%;padding:var(--space-lg);gap:var(--space-md);opacity:0;pointer-events:none;transition:transform var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out);flex-direction:column;position:fixed;top:56px;left:0;transform:translateY(-100%)}.header-links.visible{opacity:1;pointer-events:auto;transform:translateY(0)}}.hero{justify-content:center;align-items:center;min-height:100dvh;padding-top:56px;display:flex;position:relative}.hero-content{align-items:center;gap:var(--space-xl);flex-direction:column;width:100%;max-width:720px;display:flex}.terminal{background:var(--color-paper-2);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-md);opacity:0;width:100%;transition:opacity var(--dur-long) var(--ease-out), transform var(--dur-long) var(--ease-out);overflow:hidden;transform:translateY(12px)scale(.98)}.terminal.visible{opacity:1;transform:translateY(0)scale(1)}.terminal-titlebar{padding:var(--space-sm) var(--space-md);background:var(--color-paper-3);border-bottom:var(--rule-hair) solid var(--color-rule);align-items:center;display:flex;position:relative}.terminal-dots{gap:6px;display:flex}.terminal-dot{border:var(--rule-hair) solid var(--color-rule);border-radius:50%;width:10px;height:10px}.terminal-dot-red{background:oklch(60% .18 30)}.terminal-dot-yellow{background:oklch(75% .16 85)}.terminal-dot-green{background:var(--color-accent)}.terminal-title{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-neutral);letter-spacing:.02em;position:absolute;left:50%;transform:translate(-50%)}.terminal-body{padding:var(--space-xl) var(--space-xl) var(--space-lg)}.terminal-output{font-family:var(--font-mono);font-size:var(--text-sm);line-height:1.9}.terminal-line{opacity:0;transition:opacity var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out);transition-delay:var(--delay,0s);transform:translate(-8px)}.terminal-line.visible{opacity:1;transform:translate(0)}.prompt{color:var(--color-accent);margin-right:.3rem;font-weight:500}.cmd{color:var(--color-ink)}.arrow{color:var(--color-accent-dim);margin-right:.5rem}.val-name{color:var(--color-ink);font-weight:600}.val-role{color:var(--color-accent);font-weight:600}.val-tagline{color:var(--color-muted)}.output{margin-bottom:var(--space-xs)}.prompt-line{margin-top:var(--space-sm)}.cursor{color:var(--color-accent);margin-left:.3rem;font-weight:300;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.hero-actions{gap:var(--space-md);opacity:0;transition:opacity var(--dur-long) var(--ease-out), transform var(--dur-long) var(--ease-out);flex-wrap:wrap;justify-content:center;display:flex;transform:translateY(8px)}.hero-actions.visible{opacity:1;transform:translateY(0)}.hero-social{gap:var(--space-sm);opacity:0;transition:opacity var(--dur-long) var(--ease-out), transform var(--dur-long) var(--ease-out);display:flex;transform:translateY(8px)}.hero-social.visible{opacity:1;transform:translateY(0)}.hero-social a{border-radius:var(--radius-sm);border:var(--rule-hair) solid var(--color-rule);width:38px;height:38px;color:var(--color-neutral);transition:all var(--dur-short) var(--ease-out);justify-content:center;align-items:center;display:flex}.hero-social a:hover{border-color:var(--color-accent);color:var(--color-accent);text-decoration:none;transform:translateY(-2px)}@media (width<=768px){.terminal-body{padding:var(--space-lg) var(--space-md)}.terminal-output{font-size:var(--text-xs)}.terminal-title{font-size:.6rem}}.about-grid{gap:var(--space-2xl);grid-template-columns:1.2fr .8fr;align-items:start;display:grid}.about-icon{margin-right:var(--space-2xs);color:var(--color-accent-dim);vertical-align:middle;display:inline-flex}.about-text p{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-muted);margin-bottom:var(--space-md);max-width:55ch;line-height:1.8}.about-text p:before{content:"> ";color:var(--color-accent-dim)}.about-stats{gap:var(--space-sm);flex-direction:column;display:flex}.stat-card{align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);background:var(--color-paper-2);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-sm);transition:all var(--dur-short) var(--ease-out);display:flex}.stat-card:hover{border-color:var(--color-accent);background:var(--color-paper-3)}.stat-icon{font-size:var(--text-lg);color:var(--color-accent-dim)}.stat-value{font-family:var(--font-mono);font-size:var(--text-xl);color:var(--color-accent);font-weight:600}.stat-label{font-size:var(--text-xs);color:var(--color-neutral);text-transform:uppercase;letter-spacing:.08em;margin-left:auto}@media (width<=768px){.about-grid{gap:var(--space-xl);grid-template-columns:1fr}.about-text p{max-width:100%}}.projects-grid{gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(340px,1fr));display:grid}.project-card{background:var(--color-paper-2);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-md);transition:all var(--dur-short) var(--ease-out);overflow:hidden}.project-card:hover{border-color:var(--color-accent-dim);background:var(--color-paper-3)}.project-img{aspect-ratio:3/2;background:var(--color-paper-3);width:100%;position:relative;overflow:hidden}.project-img img{object-fit:cover;width:100%;height:100%;transition:transform var(--dur-long) var(--ease-out)}.project-card:hover .project-img img{transform:scale(1.05)}.project-img-iframe{position:relative}.project-img-iframe iframe{opacity:0;width:100%;height:100%;transition:opacity var(--dur-short) var(--ease-out);border:none;position:absolute;inset:0}.project-img-iframe iframe.iframe-loaded{opacity:1}.iframe-loading{justify-content:center;align-items:center;gap:var(--space-sm);background:var(--color-paper-3);color:var(--color-neutral);font-family:var(--font-mono);font-size:var(--text-xs);z-index:var(--z-base);flex-direction:column;display:flex;position:absolute;inset:0}.spinner{border:2px solid var(--color-rule);border-top-color:var(--color-accent);border-radius:50%;width:24px;height:24px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.project-body{padding:var(--space-lg)}.project-title{font-family:var(--font-mono);font-size:var(--text-md);margin-bottom:var(--space-xs);color:var(--color-ink);font-weight:500}.project-desc{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-muted);margin-bottom:var(--space-md);line-height:1.7}.project-tags{gap:var(--space-2xs);margin-bottom:var(--space-md);flex-wrap:wrap;display:flex}.tag{background:var(--color-paper-3);color:var(--color-accent-dim);font-family:var(--font-mono);padding:var(--space-3xs) var(--space-xs);border-radius:var(--radius-sm);border:var(--rule-hair) solid var(--color-rule);font-size:.7rem}.project-links{gap:var(--space-md);flex-wrap:wrap;display:flex}.project-link{align-items:center;gap:var(--space-2xs);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-accent);display:inline-flex}.project-link:hover{color:var(--color-ink)}@media (width<=768px){.projects-grid{grid-template-columns:1fr}}.skills-groups{gap:var(--space-xl);flex-direction:column;display:flex}.skill-group-title{font-family:var(--font-mono);font-size:var(--text-sm);margin-bottom:var(--space-md);color:var(--color-accent);font-weight:500}.skill-group-title:before{content:"# ";color:var(--color-accent-dim)}.skill-grid{gap:var(--space-sm);flex-wrap:wrap;display:flex}.skill-card{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);background:var(--color-paper-2);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-sm);transition:all var(--dur-short) var(--ease-out);display:flex}.skill-card:hover{border-color:var(--color-accent);background:var(--color-paper-3)}.skill-card-icon{font-size:var(--text-md);color:var(--color-muted)}.skill-card:hover .skill-card-icon{color:var(--color-accent)}.skill-card-name{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-ink);white-space:nowrap}@media (width<=480px){.skill-grid{justify-content:center}}.timeline{position:relative}.timeline:before{content:"";left:var(--space-xl);width:var(--rule-hair);background:var(--color-rule);position:absolute;top:0;bottom:0}.timeline-item{gap:var(--space-lg);margin-bottom:var(--space-xl);grid-template-columns:auto 1fr;align-items:start;display:grid;position:relative}.timeline-item:last-child{margin-bottom:0}.timeline-dot{background:var(--color-paper-2);border:var(--rule-hair) solid var(--color-accent-dim);width:36px;height:36px;color:var(--color-accent);font-size:var(--text-sm);z-index:var(--z-base);border-radius:50%;justify-content:center;align-items:center;display:flex}.timeline-card{background:var(--color-paper-2);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-sm);padding:var(--space-md) var(--space-lg);transition:all var(--dur-short) var(--ease-out)}.timeline-card:hover{border-color:var(--color-accent-dim);background:var(--color-paper-3)}.timeline-year{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-accent);background:var(--color-paper-3);padding:var(--space-3xs) var(--space-xs);border-radius:var(--radius-sm);margin-bottom:var(--space-xs);font-weight:500;display:inline-block}.timeline-title{font-family:var(--font-mono);font-size:var(--text-base);margin-bottom:var(--space-2xs);color:var(--color-ink);font-weight:500}.timeline-desc{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-muted);line-height:1.7}@media (width<=768px){.timeline:before{left:var(--space-md)}.timeline-item{gap:var(--space-md);margin-bottom:var(--space-lg)}.timeline-dot{width:28px;height:28px;font-size:var(--text-xs)}}.contact-card{background:var(--color-paper-2);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-sm);max-width:480px;padding:var(--space-xl)}.contact-item{align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md);display:flex}.contact-icon{color:var(--color-accent-dim);border-radius:var(--radius-sm);background:var(--color-paper-3);flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.contact-link{font-family:var(--font-mono);font-size:var(--text-sm);word-break:break-all;color:var(--color-muted)}.contact-link:hover{color:var(--color-accent)}.contact-divider{height:var(--rule-hair);background:var(--color-rule);margin:var(--space-lg) 0}.contact-social{gap:var(--space-sm);display:flex}.social-link{border-radius:var(--radius-sm);border:var(--rule-hair) solid var(--color-rule);width:38px;height:38px;color:var(--color-neutral);transition:all var(--dur-short) var(--ease-out);justify-content:center;align-items:center;display:flex}.social-link:hover{border-color:var(--color-accent);color:var(--color-accent);text-decoration:none;transform:translateY(-2px)}.footer{padding:var(--space-2xl) var(--page-gutter) var(--space-xl);text-align:center;position:relative}.footer:before{content:"";top:0;left:var(--page-gutter);right:var(--page-gutter);height:var(--rule-hair);background:var(--color-rule);position:absolute}.footer-content{align-items:center;gap:var(--space-md);flex-direction:column;display:flex}.footer-content p{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-neutral)}.footer-social{gap:var(--space-sm);display:flex}.footer-social a{border-radius:var(--radius-sm);border:var(--rule-hair) solid var(--color-rule);width:34px;height:34px;color:var(--color-neutral);transition:all var(--dur-short) var(--ease-out);justify-content:center;align-items:center;display:flex}.footer-social a:hover{border-color:var(--color-accent);color:var(--color-accent);text-decoration:none;transform:translateY(-2px)}.back-to-top{border-radius:var(--radius-sm);border:var(--rule-hair) solid var(--color-rule);width:34px;height:34px;color:var(--color-neutral);transition:all var(--dur-short) var(--ease-out);justify-content:center;align-items:center;display:inline-flex}.back-to-top:hover{border-color:var(--color-accent);color:var(--color-accent);text-decoration:none}:root{--color-paper:oklch(10% .008 140);--color-paper-2:oklch(14% .01 140);--color-paper-3:oklch(18% .012 140);--color-rule:oklch(22% .015 140);--color-neutral:oklch(45% .02 140);--color-muted:oklch(65% .025 140);--color-ink:oklch(88% .03 140);--color-accent:oklch(75% .2 145);--color-accent-dim:oklch(55% .15 145);--color-focus:oklch(70% .2 145);--font-mono:"JetBrains Mono", "Fira Code", "Cascadia Code", ui-monospace, monospace;--space-3xs:.125rem;--space-2xs:.25rem;--space-xs:.5rem;--space-sm:.75rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2.5rem;--space-2xl:4rem;--space-3xl:6rem;--space-4xl:9rem;--text-xs:.64rem;--text-sm:.8rem;--text-base:1rem;--text-md:1.25rem;--text-lg:1.5625rem;--text-xl:1.9531rem;--text-2xl:2.4414rem;--text-3xl:3.0518rem;--text-4xl:3.8147rem;--text-display:clamp(2.2rem, 4vw + 1rem, 4rem);--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in:cubic-bezier(.7, 0, .84, 0);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--dur-micro:.12s;--dur-short:.22s;--dur-long:.42s;--page-gutter:clamp(1rem, 4vw, 2.5rem);--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--z-base:1;--z-raised:10;--z-dropdown:100;--z-sticky:200;--z-modal:400;--z-toast:500;--rule-hair:1px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;overflow-x:clip}body{font-family:var(--font-mono);font-size:var(--text-base);background:var(--color-paper);color:var(--color-ink);min-height:100dvh;line-height:1.7;overflow-x:clip}::selection{background:var(--color-accent);color:var(--color-paper)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--color-paper)}::-webkit-scrollbar-thumb{background:var(--color-rule);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--color-neutral)}a{color:var(--color-accent);transition:color var(--dur-micro) var(--ease-out);text-decoration:none}a:hover{color:var(--color-ink);text-underline-offset:2px;text-decoration:underline}img{max-width:100%;display:block}section{padding:var(--space-3xl) var(--page-gutter);position:relative}.container{max-width:820px;z-index:var(--z-base);margin:0 auto;position:relative}.section-title{font-size:var(--text-2xl);margin-bottom:var(--space-2xs);color:var(--color-ink);letter-spacing:-.01em;font-weight:500}.section-title:before{content:"# ";color:var(--color-accent-dim);font-weight:400}.section-subtitle{color:var(--color-muted);margin-bottom:var(--space-2xl);font-size:var(--text-sm)}.section-subtitle:before{content:"/* ";color:var(--color-neutral)}.section-subtitle:after{content:" */";color:var(--color-neutral)}.btn{align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-sm);font-family:var(--font-mono);font-weight:500;font-size:var(--text-sm);transition:all var(--dur-short) var(--ease-out);cursor:pointer;border:var(--rule-hair) solid var(--color-rule);display:inline-flex}.btn-primary{background:var(--color-accent);color:var(--color-paper);border-color:var(--color-accent)}.btn-primary:hover{color:var(--color-accent);background:0 0;text-decoration:none}.btn-outline{color:var(--color-accent);border-color:var(--color-accent);background:0 0}.btn-outline:hover{background:var(--color-accent);color:var(--color-paper);text-decoration:none}.fade-up{opacity:0;transition:opacity var(--dur-long) var(--ease-out), transform var(--dur-long) var(--ease-out);transform:translateY(16px)}.fade-up.visible{opacity:1;transform:translateY(0)}.fade-left{opacity:0;transition:opacity var(--dur-long) var(--ease-out), transform var(--dur-long) var(--ease-out);transform:translate(-16px)}.fade-left.visible{opacity:1;transform:translate(0)}.fade-right{opacity:0;transition:opacity var(--dur-long) var(--ease-out), transform var(--dur-long) var(--ease-out);transform:translate(16px)}.fade-right.visible{opacity:1;transform:translate(0)}.scale-in{opacity:0;transition:opacity var(--dur-long) var(--ease-out), transform var(--dur-long) var(--ease-out);transform:scale(.95)}.scale-in.visible{opacity:1;transform:scale(1)}.stagger-item{opacity:0;transition:opacity var(--dur-long) var(--ease-out), transform var(--dur-long) var(--ease-out);transform:translateY(12px)}.stagger-item.visible{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.15s!important;animation-duration:.15s!important;animation-iteration-count:1!important}}@media (width<=768px){section{padding:var(--space-2xl) var(--page-gutter)}.section-title{font-size:var(--text-xl)}}
