:root{--font-display: "Geist", -apple-system, sans-serif;--font-body: "Inter", -apple-system, sans-serif;--radius: 14px;--radius-sm: 10px;--radius-xs: 6px;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--duration-fast: .15s;--duration-base: .25s;--duration-slow: .4s;--duration-enter: .5s;--sidebar-width: 280px;--layout-transition: .55s var(--ease-out)}[data-theme=dark]{--bg-primary: #0A0A0B;--bg-secondary: #111113;--bg-tertiary: #1A1A1E;--bg-hover: rgba(255,255,255,.04);--bg-active: rgba(255,255,255,.07);--border: rgba(255,255,255,.08);--border-strong: rgba(255,255,255,.14);--text-primary: #F0F0F2;--text-secondary: #8B8B97;--text-tertiary: #5C5C68;--accent-subtle: rgba(232,232,236,.08);--dot: rgba(255,255,255,.04);--shadow-card: 0 1px 2px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.05);--shadow-focus: 0 0 0 2px var(--bg-primary), 0 0 0 4px rgba(255,255,255,.25);--gradient-noise: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");--riot-accent: #FF4655;--showcase-bg: #111113;--tag-bg: rgba(255,255,255,.06);--tag-text: #9898A4;--proximity-glow: rgba(255,255,255,.015);--switch-bg: #2A2A30;--switch-bg-active: #F0F0F2;--switch-knob: #888;--switch-knob-active: #0A0A0B;--pop-surface: #1A1A1E;--pop-surface-hover: #222228;--pop-surface-selected: #222228;--pop-text: #F0F0F2;--pop-text-secondary: #8B8B97;--pop-text-tertiary: #5C5C68;--pop-border: rgba(255,255,255,.08);--pop-border-selected: rgba(255,255,255,.12);--pop-input-ring: rgba(255,255,255,.15);--pop-input-outer: rgba(255,255,255,.06);--pop-shadow: 0 8px 32px rgba(0,0,0,.5), 0 0 0 .5px rgba(255,255,255,.1);--pop-icon-bg: #2A2A30;--pop-tree-line: rgba(255,255,255,.08)}[data-theme=light]{--bg-primary: #FAFAF9;--bg-secondary: #F3F3F1;--bg-tertiary: #EAEAE7;--bg-hover: rgba(0,0,0,.025);--bg-active: rgba(0,0,0,.05);--border: rgba(0,0,0,.08);--border-strong: rgba(0,0,0,.14);--text-primary: #111111;--text-secondary: #6B6B76;--text-tertiary: #9898A4;--accent-subtle: rgba(26,26,30,.06);--dot: rgba(0,0,0,.035);--shadow-card: 0 1px 2px rgba(0,0,0,.04), 0 0 0 1px rgba(0,0,0,.06);--shadow-focus: 0 0 0 2px var(--bg-primary), 0 0 0 4px rgba(0,0,0,.15);--gradient-noise: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.02'/%3E%3C/svg%3E");--riot-accent: #E53E4D;--showcase-bg: #F3F3F1;--tag-bg: rgba(0,0,0,.05);--tag-text: #6B6B76;--proximity-glow: rgba(0,0,0,.012);--switch-bg: #D8D8DC;--switch-bg-active: #111111;--switch-knob: #FFF;--switch-knob-active: #FFF;--pop-surface: #FFFFFF;--pop-surface-hover: #F8F8F8;--pop-surface-selected: #F8F8F8;--pop-text: #1A1A1A;--pop-text-secondary: #666666;--pop-text-tertiary: #999999;--pop-border: #F0F0F0;--pop-border-selected: #F0F0F0;--pop-input-ring: #C4C4C5;--pop-input-outer: #E9EAEA;--pop-shadow: 0px 0px 0px .5px rgba(0,0,0,.15), 0px 2px 4px rgba(0,0,0,.02), 0px 10px 20px rgba(0,0,0,.02), 0px 10px 15px rgba(0,0,0,.05);--pop-icon-bg: #F8F8F8;--pop-tree-line: #F0F0F0}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}body{font-family:var(--font-body);font-size:13.5px;line-height:1.6;background:linear-gradient(180deg,#1a1a1e 0%,var(--bg-primary) 60%);color:var(--text-primary);min-height:100vh;overflow-x:hidden;transition:background var(--duration-slow) var(--ease-out),color var(--duration-slow) var(--ease-out)}[data-theme=light] body{background:linear-gradient(180deg,#ededea 0%,var(--bg-primary) 60%)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:var(--gradient-noise);background-size:256px 256px;pointer-events:none;z-index:9999}a{color:inherit;text-decoration:none}button{font-family:inherit}::selection{background:var(--accent-subtle);color:var(--text-primary)}.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-width);height:100vh;background:var(--bg-secondary);border-right:1px solid var(--border);padding:32px 24px;display:flex;flex-direction:column;gap:24px;z-index:50;transform:translate(-100%);opacity:0;transition:transform var(--layout-transition),opacity var(--layout-transition);overflow-y:auto}[data-layout=sidebar] .sidebar{transform:translate(0);opacity:1}.sidebar-avatar{width:64px;height:64px;border-radius:8px;overflow:hidden;border:1px solid var(--border)}.sidebar-avatar img{width:100%;height:100%;object-fit:cover;display:block}.sidebar-name{font-family:var(--font-display);font-size:22px;font-weight:400;letter-spacing:-.02em;line-height:1.2}.sidebar-role{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:450;color:var(--text-secondary)}.sidebar-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 6px;background:var(--bg-primary);border:1px solid var(--border);border-radius:6px;font-size:11.5px;font-weight:500;color:var(--text-secondary)}.sidebar-badge-dot{width:6px;height:6px;background:var(--text-tertiary);border-radius:50%}.sidebar-nav{display:flex;flex-direction:column;gap:2px;margin-top:8px}.sidebar-nav a{display:flex;align-items:center;gap:10px;padding:8px 12px;font-size:13.5px;font-weight:500;color:var(--text-secondary);border-radius:var(--radius-sm);transition:color var(--duration-fast) ease,background var(--duration-fast) ease}.sidebar-nav a:hover{color:var(--text-primary);background:var(--bg-hover)}.sidebar-nav a svg{width:16px;height:16px;opacity:.5}.sidebar-socials{display:flex;flex-direction:column;gap:4px;margin-top:auto;padding-top:16px;border-top:1px solid var(--border)}.sidebar-social{display:flex;align-items:center;gap:8px;padding:6px 8px;font-size:12.5px;color:var(--text-tertiary);border-radius:var(--radius-xs);transition:color var(--duration-fast) ease}.sidebar-social:hover{color:var(--text-primary)}.sidebar-social svg{width:14px;height:14px;opacity:.5}.sidebar-time{font-size:11px;color:var(--text-tertiary);font-variant-numeric:tabular-nums;padding:4px 8px}.sidebar-theme-toggle{background:none;border:none;padding:4px;cursor:pointer;color:var(--text-tertiary);display:flex;align-items:center;justify-content:center;transition:color .2s;margin-top:auto}.sidebar-theme-toggle:hover{color:var(--text-primary)}.sidebar-theme-toggle svg{width:15px;height:15px}.sidebar-theme-toggle .icon-moon,[data-theme=dark] .sidebar-theme-toggle .icon-sun{display:none}[data-theme=dark] .sidebar-theme-toggle .icon-moon{display:block}.main{transition:margin-left var(--layout-transition),max-width var(--layout-transition)}[data-layout=sidebar] .main{margin-left:var(--sidebar-width)}.theme-toggle{position:fixed;top:16px;right:16px;z-index:200;width:40px;height:40px;border-radius:var(--radius-sm);border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:color var(--duration-fast) ease}.theme-toggle:hover{color:var(--text-primary)}.theme-toggle:active{transform:scale(.94);transition:transform .08s ease}.theme-toggle svg{width:16px;height:16px}.sun-icon,.moon-icon{display:none}[data-theme=dark] .sun-icon,[data-theme=light] .moon-icon{display:block}.hero{padding:160px 0 80px;transition:opacity var(--layout-transition),transform var(--layout-transition)}[data-layout=sidebar] .hero{opacity:0;transform:translateY(-20px);height:0;padding:0;overflow:hidden;pointer-events:none}.container{max-width:720px;margin:0 auto;padding:0 24px}.hero-avatar-row{display:flex;align-items:center;gap:16px;margin-bottom:16px}.hero-avatar{width:56px;height:56px;border-radius:8px;overflow:hidden;border:1px solid var(--border);flex-shrink:0}.hero-avatar img{width:100%;height:100%;object-fit:cover;display:block}.hero-avatar-name{display:inline-block;font-size:16px;font-weight:550;letter-spacing:-.015em;transition:opacity .32s var(--ease-out),transform .32s var(--ease-out),filter .32s var(--ease-out)}.hero-avatar-name.swapping{opacity:0;transform:translateY(-4px);filter:blur(2px)}@media(prefers-reduced-motion:reduce){.hero-avatar-name{transition:none}}.hero-avatar-role{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:450;color:var(--text-secondary)}.hero-description{font-size:16px;line-height:1.7;color:var(--text-secondary);max-width:600px}.hero-description+.hero-description{margin-top:24px}.hero-description a{color:var(--text-primary);font-weight:450;text-decoration:underline;text-decoration-color:var(--border-strong);text-underline-offset:3px;text-decoration-thickness:1px;transition:color var(--duration-base) ease,text-decoration-color var(--duration-base) ease;white-space:nowrap}.hero-description a:hover{color:var(--text-secondary);text-decoration-color:var(--text-secondary)}.section{padding:64px 0}.section-content{opacity:0;transform:translateY(24px);transition:opacity var(--duration-enter) var(--ease-out),transform var(--duration-enter) var(--ease-out)}.section-content.visible{opacity:1;transform:translateY(0)}.stagger-child{opacity:0;transform:translateY(12px);transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}.section-content.visible .stagger-child{opacity:1;transform:translateY(0)}.section-content.visible .stagger-1{transition-delay:0s}.section-content.visible .stagger-2{transition-delay:.06s}.section-content.visible .stagger-3{transition-delay:.12s}.section-content.visible .stagger-4{transition-delay:.18s}.section-label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-tertiary);margin-bottom:24px}.section-title{font-family:var(--font-display);font-size:24px;font-weight:400;line-height:1.2;letter-spacing:-.015em;margin-bottom:16px}.section-subtitle{font-size:15px;color:var(--text-secondary);line-height:1.6;max-width:480px}.work-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}.work-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);padding:24px;position:relative;cursor:default;transition:border-color var(--duration-base) ease,box-shadow var(--duration-base) ease,transform var(--duration-base) var(--ease-spring)}.work-card:hover{border-color:var(--border-strong);box-shadow:0 4px 24px var(--proximity-glow);transform:translateY(-2px)}.work-card-icon{width:40px;height:40px;border-radius:8px;border:1px solid var(--border);background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);margin-bottom:16px}.work-card-icon svg{width:18px;height:18px}.work-card-title{font-size:15px;font-weight:600;margin-bottom:8px}.work-card-desc{font-size:13px;color:var(--text-secondary);line-height:1.55}.timeline{list-style:none;margin-top:32px}.timeline-row{display:grid;grid-template-columns:108px 1fr auto;align-items:baseline;gap:24px;padding:16px 0;border-top:1px solid var(--border);transition:border-color var(--duration-base) ease}.timeline-row:last-child{border-bottom:1px solid var(--border)}a.timeline-row{cursor:pointer}a.timeline-row:hover{border-color:var(--border-strong)}a.timeline-row:hover+.timeline-row{border-color:var(--border-strong)}.timeline-year{font-size:12.5px;color:var(--text-tertiary);font-variant-numeric:tabular-nums;letter-spacing:.01em}.timeline-main{min-width:0}.timeline-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:550;letter-spacing:-.01em;color:var(--text-primary);transition:color var(--duration-base) ease}a.timeline-row:hover .timeline-title{color:var(--text-secondary)}.timeline-desc{display:block;font-size:13.5px;color:var(--text-secondary);line-height:1.5;margin-top:8px}.timeline-role{font-size:15px;font-weight:500;letter-spacing:-.01em;color:var(--text-primary)}.timeline-role a{color:var(--text-primary);text-decoration:underline;text-decoration-color:var(--border-strong);text-underline-offset:3px;text-decoration-thickness:1px;transition:text-decoration-color var(--duration-base) ease}.timeline-role a:hover{text-decoration-color:var(--text-secondary)}.timeline-aside{font-size:13px;color:var(--text-tertiary);white-space:nowrap;text-align:right}.timeline-tag{display:inline-block;font-size:11px;font-weight:500;color:var(--text-tertiary);border:1px solid var(--border);border-radius:5px;padding:3px 8px}.timeline-arrow{display:inline-flex;opacity:0;transform:translate(-4px);color:var(--text-tertiary);transition:opacity var(--duration-base) ease,transform var(--duration-base) var(--ease-out)}a.timeline-row:hover .timeline-arrow{opacity:1;transform:translate(0)}.gallery-scroller{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-left:max(24px,calc((100% - 720px)/2 + 24px));-webkit-overflow-scrolling:touch;scrollbar-width:none}.gallery-scroller::-webkit-scrollbar{display:none}.gallery-track{display:flex;gap:16px;width:max-content;padding-inline:max(24px,calc((100% - 720px)/2 + 24px))}.gallery-item{flex:0 0 auto;width:min(86vw,680px);margin:0;scroll-snap-align:start}.gallery-item img{display:block;width:100%;height:auto;border-radius:var(--radius);border:1px solid var(--border)}.gallery-caption{margin-top:16px;font-size:13px;color:var(--text-secondary)}.gallery-empty{width:100%;aspect-ratio:4 / 3;border-radius:var(--radius);border:1px dashed var(--border-strong);background:var(--bg-secondary);display:flex;align-items:center;justify-content:center;color:var(--text-tertiary);font-size:13px}.footer{padding:48px 0 72px;margin-top:32px;color:var(--text-secondary)}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px}.footer-left span{color:var(--text-secondary)}.footer-right{display:flex;align-items:center;gap:16px}.local-time{color:var(--text-tertiary)}.footer-link{color:var(--text-secondary);transition:color var(--duration-fast) ease}.footer-link:hover{color:var(--text-primary)}@media(max-width:768px){.timeline-row{grid-template-columns:1fr auto;gap:8px 16px}.timeline-year{grid-column:1 / -1}.sidebar{display:none}[data-layout=sidebar] .main{margin-left:0}[data-layout=sidebar] .hero{opacity:1;transform:none;height:auto;padding:144px 0 64px;overflow:visible;pointer-events:auto}.work-bento{grid-template-columns:1fr}.footer-inner{flex-direction:column;gap:16px;text-align:center}}.theme-transitioning,.theme-transitioning *,.theme-transitioning *:before,.theme-transitioning *:after{transition-duration:.45s!important;transition-timing-function:var(--ease-out)!important}