:root{--color-bg: #e8eff7;--color-surface: #f4f8fc;--color-surface-raised: #ffffff;--color-border: rgba(30, 60, 114, .1);--shadow-card: 0 2px 12px rgba(30, 60, 114, .08);--color-text: #1a2e4a;--color-text-muted: #4d6380;--color-accent: #1e50a0;--color-tag-bg: rgba(30, 60, 114, .07);--color-pro: #3b82f6;--color-teaching: #10b981;--color-artistic: #ec4899;--font-display: "DM Sans", "Segoe UI", system-ui, sans-serif;--font-body: "DM Sans", "Segoe UI", system-ui, sans-serif;--font-mono: "JetBrains Mono", "Fira Mono", monospace;--radius-card: 1rem}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;line-height:16px;scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);line-height:1.1;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:inherit;text-decoration:none}ul,ol{list-style:none}button{font-family:inherit;cursor:pointer}img,svg{display:block;max-width:100%;width:100%;height:auto}.app{display:flex;flex-direction:column;min-height:100vh}.container{width:100%;max-width:1100px;margin:0 auto;padding:0 1.5rem}@media(max-width:640px){.container{padding:0 1rem}}.main{flex:1;display:flex;flex-direction:column;gap:1.5rem;padding-top:2rem;padding-bottom:3rem}@media(max-width:640px){.main{padding-top:1rem;padding-bottom:2.5rem}}.footer{border-top:1px solid var(--color-border);padding:1.25rem;text-align:center;font-size:.78rem;color:var(--color-text-muted)}@media(max-width:480px){.d-xs-none{display:none}}.header{position:sticky;top:0;z-index:50;background-color:#ffffff03;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);padding:1rem 0}.header-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}@media(max-width:640px){.header-inner{padding:0 1.5rem 0 .75rem;align-items:flex-start}}@media(max-width:480px){.header-inner{padding:0 .75rem}}.header-identity{width:100%;display:flex;align-items:center}.header-identity-content{width:100%;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}@media(max-width:640px){.header-identity-content{flex-wrap:nowrap}}.header-identity-content__text{padding-right:.4rem}@media(max-width:640px){.header-identity-content__text{flex:1}}.autoportrait-container{width:80px;margin-right:1rem;padding:.5rem;border-radius:50%;background-color:#fff}@media(max-width:375px){.autoportrait-container{display:none}}.name{font-size:clamp(1.3rem,3vw,1.7rem);font-weight:700;line-height:1.1rem;letter-spacing:-.02em;color:var(--color-text)}.title-line{font-size:clamp(.75rem,1.4vw,.9rem);display:flex;flex-wrap:wrap;padding:.4rem 0;gap:0 .4rem;line-height:.75rem}@media(max-width:480px){.title-line{padding:.4rem 0 0}}@media(max-width:480px){.title-line{flex-direction:column}}.separator{font-size:2rem;color:var(--color-text-muted);font-weight:bolder}.badge{font-size:.75rem;font-weight:600;letter-spacing:.05em;padding:.2rem .65rem;border-radius:999px;text-transform:uppercase;border:1px solid var(--color-text-muted);color:var(--color-text)}.badge--pro{background:#3b82f62e;color:#7eb8ff}.badge--teach{background:#10b9812e;color:#6ee7b7}.header-meta{display:flex;gap:0 .6rem;flex-wrap:nowrap}@media(max-width:640px){.header-meta{flex:1;flex-wrap:wrap;align-content:flex-end;gap:.1rem;flex-direction:column;align-items:flex-start}}.meta-link{font-size:.8rem;color:var(--color-text-muted);text-decoration:none;transition:color .2s ease;display:flex;align-items:center}.meta-link:hover{color:var(--color-accent)}.meta-link.location{cursor:default}.meta-link>svg{width:18px;margin-right:5px;flex-shrink:0}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card);padding:1.75rem;box-shadow:var(--shadow-card)}@media(max-width:640px){.card{padding:1.25rem}}.section-title{display:flex;align-items:center;gap:.65rem;font-size:1.05rem;font-weight:600;letter-spacing:-.01em;color:var(--color-text);margin-bottom:1.5rem}.section-title__icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:.5rem;flex-shrink:0;color:var(--color-pro);background:color-mix(in srgb,var(--color-pro) 8%,transparent)}.section-title__icon svg{width:16px;height:16px}.about-text{font-size:.95rem;color:var(--color-text-muted);max-width:70ch;margin-bottom:1.25rem;line-height:1.65}.about-text strong{color:var(--color-text)}.skills-list{display:flex;flex-wrap:wrap;gap:.5rem}.skill-chip{font-size:.78rem;line-height:.78rem;font-weight:500;padding:.3rem .8rem;border-radius:999px;background:rgba(var(--chip-color),.12);color:rgb(var(--chip-color));border:1px solid rgba(var(--chip-color),.5);cursor:pointer}.legend-bar{display:flex;gap:1.5rem;flex-wrap:wrap;padding:0 .25rem}.legend-item{display:flex;align-items:center;gap:.45rem}.legend-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.legend-label{font-size:.82rem;color:var(--color-text-muted)}.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.filter-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;box-shadow:0 0 0 1.5px var(--color-border);border:none;border-radius:2rem;background:transparent;color:var(--color-text-muted);font-family:inherit;font-size:.85rem;font-weight:500;letter-spacing:.02em;cursor:pointer;transition:box-shadow .5s ease-in-out,color .5s ease-in-out,background .2s ease-in-out}.filter-btn:hover{box-shadow:0 0 0 1.5px rgba(var(--btn-color-stanby),50%);color:rgba(var(--btn-color-stanby),75%);background:rgba(var(--btn-color-stanby),2%)}.filter-btn.active{box-shadow:0 0 0 2px rgb(var(--btn-color));background:rgba(var(--btn-color),10%);color:var(--color-text)}.filter-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.timeline-section{width:100%;position:relative}.timeline-container{width:100%;border-radius:.75rem;overflow:hidden;border:1px solid var(--color-border);background:var(--color-surface)}.tooltip{position:absolute;z-index:100;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:.5rem;padding:.75rem 1rem;max-width:260px;pointer-events:none;box-shadow:0 8px 24px #00000026}.tooltip-title{font-weight:600;font-size:.9rem;margin:0 0 .3rem;color:var(--color-text)}.tooltip-desc{font-size:.8rem;color:var(--color-text-muted);margin:0 0 .5rem;line-height:1.45}.tooltip-tags{display:flex;flex-wrap:wrap;gap:.25rem}.tag{font-size:.7rem;padding:.15rem .5rem;background:var(--color-tag-bg);color:var(--color-text-muted);border-radius:999px}.fade-enter-active,.fade-leave-active{transition:opacity .15s ease}.fade-enter-from,.fade-leave-to{opacity:0}