*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:0px}@media(prefers-reduced-motion:no-preference){*{scroll-behavior:smooth}}body{margin:0;padding:0;font-family:inherit;line-height:inherit;color:inherit;background-color:inherit}:root{--clr-black: #000000;--clr-white: #ffffff;--clr-gray-200: #ececec;--clr-gray-400: #c4c4c4;--clr-gray-700: #848484;--color-text: var(--clr-black);--color-text-muted: var(--clr-gray-700);--color-text-light: var(--clr-gray-400);--color-bg: var(--clr-white);--color-bg-secondary: var(--clr-gray-200);--color-border: var(--clr-gray-200);--color-border-light: var(--clr-gray-400);--color-shadow: rgba(0, 0, 0, .08);--color-shadow-lg: rgba(0, 0, 0, .15);--navbar-height: 64px;--scroll-track: #e6e6e6;--scroll-thumb: #000000;--scroll-thumb-hover: #333333;--font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-serif: Georgia, serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.25rem;--text-xl: 2.125rem;--text-2xl: 3rem;--text-3xl: 4.8rem;--text-4xl: 6.2rem;--line-height-tight: .8;--line-height-normal: 1.5;--line-height-relaxed: 1.8;--space-1: .5rem;--space-2: 1rem;--space-3: 1.5rem;--space-4: 3rem;--space-5: 6rem;--space-6: 9rem;--radius-sm: .25rem;--radius-md: 1rem;--radius-lg: 2rem;--radius-full: 9999px;--ease-out: cubic-bezier(.23, 1, .32, 1);--ease-smooth: cubic-bezier(.19, 1, .22, 1);--transition-fast: .15s var(--ease-out);--transition-base: .3s var(--ease-out);--transition-slow: .5s var(--ease-smooth);--grid-cols: 24}[data-theme=dark]{--clr-black: #000000;--clr-white: #ffffff;--color-text: #f0f0f0;--color-text-muted: #b0b0b0;--color-text-light: #808080;--color-bg: #1a1a1a;--color-bg-secondary: #2a2a2a;--color-border: #333333;--color-border-light: #404040;--scroll-track: #2a2a2a;--scroll-thumb: #f5f5f5;--scroll-thumb-hover: #e0e0e0}[data-theme=dark] .projects-list-item,[data-theme=dark] .projects-list-item.active .projects-list-item-year{color:#fff}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:auto;font-size:16px;overflow-x:hidden;width:100%;scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) var(--scroll-track)}body{font-family:var(--font-family);font-size:var(--text-base);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-bg);transition:background-color var(--transition-base),color var(--transition-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;width:100%}.modal-open,.modal-open body{overflow:hidden}h1{font-size:var(--text-5xl);font-weight:700;line-height:var(--line-height-tight);margin-bottom:var(--spacing-4)}h2{font-size:var(--text-3xl);font-weight:700;line-height:var(--line-height-tight);margin-bottom:var(--spacing-4)}h3{font-size:var(--text-2xl);font-weight:600;line-height:var(--line-height-tight);margin-bottom:var(--spacing-3)}h4{font-size:var(--text-xl);font-weight:600;line-height:var(--line-height-tight);margin-bottom:var(--spacing-3)}h5,h6{font-size:var(--text-lg);font-weight:600;line-height:var(--line-height-tight);margin-bottom:var(--spacing-2)}p{margin-bottom:var(--spacing-4);color:var(--color-text-muted);line-height:var(--line-height-relaxed)}p:last-child{margin-bottom:0}small{font-size:var(--text-sm)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-dark);text-decoration:underline}a:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}ul,ol{margin-bottom:var(--spacing-4);padding-left:var(--spacing-6)}li{margin-bottom:var(--spacing-2)}code,pre{font-family:var(--font-mono);font-size:var(--text-sm);background-color:var(--color-bg-secondary);border-radius:var(--radius-sm)}code{padding:var(--spacing-1) var(--spacing-2);color:var(--color-primary)}pre{padding:var(--spacing-4);overflow-x:auto;margin-bottom:var(--spacing-4)}pre code{background-color:transparent;padding:0;color:var(--color-text)}blockquote{border-left:4px solid var(--color-primary);padding-left:var(--spacing-4);margin-bottom:var(--spacing-4);color:var(--color-text-muted);font-style:italic}hr{border:none;border-top:1px solid var(--color-border);margin:var(--spacing-8) 0}section{padding-top:var(--spacing-12);padding-bottom:var(--spacing-12);scroll-margin-top:60px}.container{max-width:none;width:100%;margin:0;padding:0 var(--space-2)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--scroll-track)}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:var(--radius-full);border:1px solid var(--scroll-track)}::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb-hover)}::selection{background-color:var(--color-text);color:var(--color-bg)}@media(max-width:640px){h1{font-size:var(--text-4xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}section{padding-top:var(--spacing-8);padding-bottom:var(--spacing-8)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}:root{width:100%;min-height:calc(100vh - 60px)}.hero-overlay-grid{display:flex;gap:0;align-items:flex-end;justify-content:space-between;min-height:70vh;width:100%;padding:0;position:relative}.scroll-indicator{position:absolute;bottom:1rem;left:50%;transform:translate(-50%);z-index:10}.scroll-indicator span{display:block;width:0;height:0;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-bottom:.75rem solid rgba(255,255,255,.7);animation:scrollBounce 2s ease-in-out infinite}@keyframes scrollBounce{0%,to{transform:translateY(0);opacity:.7}50%{transform:translateY(-.5rem);opacity:1}}.hero-left{flex:1.2;align-self:flex-end;color:var(--clr-white);mix-blend-mode:difference;max-width:60ch}.hero-tagline{font-size:var(--text-base);font-weight:700;line-height:var(--line-height-normal);letter-spacing:-.01em;margin:0}.hero-intro{font-size:var(--text-base);line-height:var(--line-height-normal);margin-block-end:0}.hero-logo{margin-bottom:var(--space-2);max-width:40px;height:auto;opacity:1;position:relative;top:1.5rem}.hero-right{flex:1.2;display:flex;flex-direction:column;align-items:flex-end;text-align:right;margin-right:0}.hero-skill-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-1);color:var(--clr-white);mix-blend-mode:difference}.hero-skill-list li{text-align:right;font-size:var(--text-base);line-height:var(--line-height-normal);text-transform:uppercase;letter-spacing:-.01em;opacity:100;display:flex;flex-direction:column;transition:opacity .5s cubic-bezier(.23,1,.32,1)}.hero-skill-list li:hover{opacity:.5}.skill-label{font-weight:700}.skill-sub{font-size:var(--text-base);line-height:var(--line-height-normal);letter-spacing:.02em}.navbar{position:fixed;top:0;left:0;right:0;z-index:100;width:100%;background-color:#000;color:#fff}.navbar .container{display:flex;justify-content:space-between;align-items:center;padding:var(--space-1) var(--space-2);max-width:none;width:100%}.navbar-brand{font-size:var(--text-lg);font-weight:100;color:#fff;text-decoration:none;transition:color var(--transition-base);text-transform:uppercase;letter-spacing:.7rem}.navbar-brand:focus,.navbar-brand:focus-visible,.navbar-brand:active{text-decoration:none;border:none;outline:none}.navbar-right{flex:1;display:flex;justify-content:flex-end;margin-right:0;position:relative}.navbar-links{display:flex;list-style:none;gap:var(--space-3);margin:0;padding:0;position:relative}.navbar-menu-toggle{display:none;width:auto;height:auto;border:none;background:transparent;padding:0;align-items:right;justify-content:center;gap:4px;cursor:pointer;transition:all var(--transition-base);color:#fff}.navbar-menu-icon{width:22px;height:22px}.navbar-menu-panel{position:absolute;left:0;right:0;top:100%;background:#000000eb;border-bottom:1px solid rgba(255,255,255,.15);transform:translateY(-12px);opacity:0;pointer-events:none;transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);z-index:120;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);width:100%}.navbar-menu-panel.open{transform:translateY(0);opacity:1;pointer-events:auto}.navbar-menu-overlay{position:fixed;inset:60px 0 0;background:transparent;border:none;padding:0;cursor:default;z-index:110}.navbar-menu-links{list-style:none;display:flex;gap:var(--space-3);margin:0;padding:0;position:relative;width:100%}.navbar-menu-links li{width:100%}.navbar-menu-links a{color:#fff;font-weight:700;font-size:var(--text-base);line-height:var(--line-height-normal);text-transform:uppercase;letter-spacing:-.02em;text-decoration:none;border:none;position:relative;z-index:1;display:block;width:100%;padding:var(--space-2)}.navbar-menu-links a.active{color:#000}.navbar-menu-indicator{position:absolute;top:0;left:0;right:0;background:#fff;border-radius:0;transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .22s cubic-bezier(.23,1,.32,1);z-index:0;pointer-events:none;box-shadow:0 6px 18px #0003}@media(hover:hover){.navbar-brand:hover{color:#ccc;text-decoration:none;border:none;outline:none}.navbar-links a:hover{color:#ccc;border:none;outline:none;text-decoration:none}.navbar-menu-toggle:hover{background:transparent;color:#ccc}.navbar-menu-links a:hover{color:#ccc}}.navbar-links a{color:#fff;font-weight:700;font-size:var(--text-sm);position:relative;transition:color var(--transition-base);text-transform:uppercase;letter-spacing:-.02em;text-decoration:none;border:none;outline:none}.navbar-links a.active{color:#fff;font-weight:700}.navbar-links a.active:after{content:none}.nav-indicator{position:absolute;bottom:-11px;left:0;width:0;height:4px;background:#fff;border-radius:0;transition:transform .3s cubic-bezier(.23,1,.32,1),width .3s cubic-bezier(.23,1,.32,1),opacity .2s cubic-bezier(.23,1,.32,1);pointer-events:none}.navbar-brand{border:none;border-bottom:none}.navbar-links a:focus,.navbar-links a:focus-visible,.navbar-links a:active{border:none;outline:none;text-decoration:none}.toggle-rail{position:fixed;bottom:16px;right:16px;z-index:100;display:flex;flex-direction:row;align-items:center;gap:.5rem;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity var(--transition-base),transform var(--transition-base)}.toggle-rail.visible{opacity:1;transform:translateY(0);pointer-events:auto}.toggle-btn{background-color:var(--toggle-bg);border:1.2px solid var(--toggle-border);border-radius:0;width:2.5rem;height:2.5rem;cursor:pointer;font-size:1rem;transition:all var(--transition-base);display:flex;align-items:center;justify-content:center;color:var(--toggle-fg)}.toggle-separator{width:1px;height:1.5rem;background:var(--toggle-border);opacity:.85}.toggle-btn:hover{background-color:var(--toggle-fg);color:var(--toggle-bg);border-color:var(--toggle-fg)}.toggle-btn:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}.lang-toggle{font-size:medium;font-weight:700;letter-spacing:-.02em}[data-theme=dark]{--toggle-bg: #000;--toggle-fg: #fff;--toggle-border: #fff}[data-theme=light]{--toggle-bg: #fff;--toggle-fg: #000;--toggle-border: #000}main{padding-top:60px}.section{padding:0;margin-bottom:10em}.section>.container{max-width:none;width:100%;overflow:hidden}.works-section>.container{padding:0 var(--space-2);overflow:visible}.works-section{overflow:visible}.about-section>.container{overflow:visible!important}.contact-section{margin-bottom:0}.section-title{font-size:var(--text-3xl);font-weight:700;color:var(--color-text);margin-bottom:var(--space-2);text-transform:uppercase;letter-spacing:-.04em;line-height:1.1;overflow:hidden}.section-title span{display:block;animation:revealUp 1s var(--ease-smooth) forwards}@keyframes revealUp{0%{transform:translateY(110%);opacity:0}to{transform:translateY(0);opacity:1}}body{font-family:var(--font-family);font-size:var(--text-base);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-bg);transition:background-color var(--transition-base),color var(--transition-base);font-feature-settings:"kern" 1;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:var(--line-height-tight);letter-spacing:-.04em;text-transform:uppercase}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-3xl)}h3{font-size:var(--text-2xl)}p{margin:0;line-height:var(--line-height-normal)}a{color:var(--color-text);text-decoration:none;border-bottom:1px solid var(--color-text);transition:all var(--transition-base)}a:hover{color:var(--color-text-muted);border-bottom-color:var(--color-text-muted)}.hero{padding-top:var(--space-4);width:100%;min-height:calc(100vh - 60px)}.hero-content{width:100%;max-width:none}.hero h1{line-height:var(--line-height-tight);margin-bottom:var(--space-4);text-transform:uppercase;letter-spacing:-.04em;overflow:hidden}.hero .container{padding:0 var(--space-2);max-width:none}.hero h1 span{display:block;animation:revealUp 1s var(--ease-smooth) .1s forwards}.hero .subtitle{font-size:var(--text-lg);color:var(--color-text-muted);margin-bottom:var(--space-4);line-height:var(--line-height-normal);max-width:600px;overflow:hidden}.hero .subtitle span{display:block;animation:revealUp 1s var(--ease-smooth) .2s forwards}.hero-intro{font-size:var(--text-base);line-height:var(--line-height-normal);color:var(--color-text);max-width:600px}.hero-ctas{display:flex;gap:var(--space-3);margin-bottom:var(--space-4);flex-wrap:wrap}.hero-skills{display:flex;gap:var(--space-2);flex-wrap:wrap}.hero-stats{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);max-width:900px;margin-top:var(--space-4)}.stat-item{border-top:1px solid var(--color-border);padding-top:var(--space-2)}.stat-number{font-size:var(--text-2xl);font-weight:700;text-transform:uppercase;letter-spacing:-.04em}.stat-label{font-size:var(--text-sm);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:-.02em;margin-top:var(--space-1)}.btn,.btn-link{display:inline-flex;align-items:center;gap:var(--space-2);padding:0 var(--space-2);min-height:2.5rem;border:1px solid var(--color-text);background:transparent;color:var(--color-text);font-size:var(--text-sm);font-weight:700;text-transform:uppercase;letter-spacing:-.02em;cursor:pointer;transition:all var(--transition-base);position:relative;text-decoration:none;border-radius:0;font-family:var(--font-family)}.btn:hover,.btn-link:hover{background:var(--color-text);color:var(--color-bg)}.btn:focus-visible,.btn-link:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}.btn-primary,.btn-link.btn-primary{border:1px solid var(--color-text);background:transparent;color:var(--color-text)}.btn-primary:hover,.btn-link.btn-primary:hover{background:var(--color-text);color:var(--color-bg)}.btn-secondary,.btn-link.btn-secondary{border:1px solid var(--color-text);background:transparent;color:var(--color-text)}.btn-secondary:hover,.btn-link.btn-secondary:hover{background:var(--color-text);color:var(--color-bg)}.btn.btn-ghost,.btn-link.btn-ghost{border:none;text-decoration:underline}.btn.btn-ghost:hover,.btn-link.btn-ghost:hover{background:transparent;color:var(--color-text-muted)}.tag{display:inline-block;padding:var(--space-1) var(--space-2);border:1px solid var(--color-border);border-radius:0;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:-.02em;color:var(--color-text);background:transparent;transition:all var(--transition-base)}.tag:hover{border-color:var(--color-text);background:var(--color-text);color:var(--color-bg)}.tag-sm{padding:var(--space-1) var(--space-2);font-size:var(--text-xs)}.tag-md{padding:var(--space-1) var(--space-2);font-size:var(--text-sm)}.tag-lg{padding:var(--space-2) var(--space-4);font-size:var(--text-base);line-height:var(--line-height-normal)}.card{background:var(--color-bg);border:1px solid var(--color-border);transition:all var(--transition-base)}.card:hover{border-color:var(--color-text);box-shadow:0 8px 16px var(--color-shadow)}.card-header{padding:var(--space-3);border-bottom:1px solid var(--color-border)}.card-body{padding:var(--space-3)}.card-footer{padding:var(--space-3);border-top:none;display:flex;gap:var(--space-2)}.projects-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:var(--space-2)}.projects-grid>.project-card{grid-column:span 8}.projects-grid>.project-card:nth-child(1){grid-column:1 / span 8;animation:revealUp 1s var(--ease-smooth) 0s forwards}.projects-grid>.project-card:nth-child(2){grid-column:10 / span 8;animation:revealUp 1s var(--ease-smooth) .1s forwards}.projects-grid>.project-card:nth-child(3){grid-column:18 / span 7;animation:revealUp 1s var(--ease-smooth) .2s forwards}.projects-grid>.project-card:nth-child(4){grid-column:1 / span 8;animation:revealUp 1s var(--ease-smooth) .3s forwards}.projects-grid>.project-card:nth-child(n+5){grid-column:span 8}.project-card .card-header h3{font-size:var(--text-xl);margin-bottom:var(--space-2)}.project-card .card-body{font-size:var(--text-sm);line-height:var(--line-height-normal)}.works-nav{display:flex;align-items:center;justify-content:center;gap:var(--space-3);padding:0;order:2;width:100%}.works-nav-btn{border:none;background:transparent;padding:var(--space-1) var(--space-2);cursor:pointer;transition:all var(--transition-base);color:var(--color-text);width:32px;height:32px;display:flex;align-items:center;justify-content:center;position:relative}.works-nav-btn:before{content:"";width:0;height:0;border-style:solid;transition:all var(--transition-base)}.works-nav-btn-left:before{border-width:8px 14px 8px 0;border-color:transparent var(--color-text) transparent transparent}.works-nav-btn-right:before{border-width:8px 0 8px 14px;border-color:transparent transparent transparent var(--color-text)}.works-nav-btn:hover:before{border-left-color:var(--color-text-muted);border-right-color:var(--color-text-muted)}.works-nav-btn:active{opacity:.7}.works-nav-dots{display:flex;gap:var(--space-2);align-items:center}.works-nav-dot{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--color-text);background:transparent;cursor:pointer;transition:all var(--transition-base)}.works-nav-dot:hover,.works-nav-dot.active{background:var(--color-text)}.works-layout{display:flex;gap:var(--space-2);padding:0;align-items:flex-start}.lang-zh .works-layout,html[lang=zh] .works-layout{gap:var(--space-3)}.works-title-vertical{writing-mode:vertical-rl;text-orientation:mixed;transform:none;font-size:var(--text-3xl);font-weight:700;margin:0;color:var(--color-text);white-space:nowrap;letter-spacing:-.04em;flex-shrink:0}.works-container{position:relative;flex:1;overflow:hidden;display:flex;flex-direction:column}.works-grid{position:relative;margin-top:0;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;width:100%;max-width:100%;order:1;scroll-snap-type:x mandatory;overscroll-behavior-x:none;scroll-padding-right:var(--works-end-spacer, 0px);scrollbar-width:none;-ms-overflow-style:none;cursor:grab;user-select:none;-webkit-user-select:none}.works-grid::-webkit-scrollbar{display:none}.works-grid:active{cursor:grabbing;-webkit-user-select:none;user-select:none}.works-grid-wrapper{position:relative;width:100%}.works-edge-mask{position:absolute;right:0;top:0;bottom:0;width:150px;background:linear-gradient(to right,transparent 0%,var(--color-bg) 100%);pointer-events:none;z-index:10}.works-triangle{position:absolute;right:20px;top:50%;transform:translateY(-50%);width:0;height:0;border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent var(--color-text);opacity:.6;pointer-events:none;z-index:11;transition:opacity .4s cubic-bezier(.23,1,.32,1)}.works-triangle.visible{animation:trianglePulse 2s ease-in-out infinite}.works-triangle.hidden{opacity:0;pointer-events:none}@keyframes trianglePulse{0%,to{transform:translateY(-50%) translate(0)}50%{transform:translateY(-50%) translate(8px)}}.work-card{position:relative;display:flex;flex-direction:column;cursor:pointer;animation:revealUp 1s var(--ease-smooth) forwards;outline:none;scroll-snap-align:start;scroll-snap-stop:always}.work-card:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}.work-card:nth-child(1){animation-delay:0s}.work-card:nth-child(2){animation-delay:.1s}.work-card:nth-child(3){animation-delay:.2s}.work-card:nth-child(4){animation-delay:.3s}.work-card:nth-child(5){animation-delay:.4s}.work-card:nth-child(6){animation-delay:.5s}.work-card-image{border-radius:5px;position:relative;width:100%;overflow:hidden;background:var(--color-bg-secondary)}.work-card img{width:100%;height:150%;object-fit:cover;object-position:center top;transition:transform .6s cubic-bezier(.19,1,.22,1);display:block;will-change:transform}.work-card:hover img{filter:brightness(1.05)}.work-overlay{position:absolute;inset:0;background:#0009;display:flex;align-items:flex-end;padding:var(--space-1);opacity:0;transition:opacity var(--transition-base)}.work-card:hover .work-overlay{opacity:1}.work-overlay .overlay-text{color:#fff;font-size:small}.work-overlay h3{color:#fff;font-size:var(--text-lg)}.work-card-info{padding-top:var(--space-1);background:var(--color-bg);border-top:1px solid var(--color-border);position:relative;z-index:10}.work-title{font-size:var(--text-lg);font-weight:700;margin-bottom:2px;color:var(--color-text)}.work-meta{display:flex;justify-content:space-between;font-size:var(--text-sm);color:var(--color-text-muted)}.work-type{text-transform:uppercase;letter-spacing:-.02em}.work-year{color:var(--color-text-muted)}.modal-backdrop{position:fixed;inset:0;background:#000000a6;display:flex;align-items:flex-start;justify-content:center;padding:calc(var(--navbar-height) + var(--space-2)) var(--space-2) 74px;box-sizing:border-box;z-index:1000;animation:fadeIn var(--transition-base);overflow:hidden;-webkit-overflow-scrolling:touch}.modal-content{background:var(--color-bg);border:1px solid var(--color-border);width:100%;max-width:960px;max-height:100%;height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden;position:relative;animation:fadeIn var(--transition-base);box-shadow:0 24px 60px #0003}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-header{padding:var(--space-2);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);background:var(--color-bg);border-bottom:1px solid var(--color-border)}.modal-close{background:none;border:1px solid var(--color-border);font-size:var(--text-xl);cursor:pointer;color:var(--color-text);padding:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:32px;min-height:32px;flex:0 0 32px}.modal-close-icon{width:16px;height:16px;display:block}.modal-close:hover{background:var(--color-bg-secondary)}.modal-close:active,.modal-close:focus-visible{border-color:var(--color-border);box-shadow:inset 0 0 0 1px var(--color-border),inset 0 -1px 0 var(--color-border)}.modal-body{padding:var(--space-2);display:grid;gap:0;flex:1 1 auto;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;height:100%;scrollbar-width:none;-ms-overflow-style:none}.modal-body::-webkit-scrollbar{width:0;height:0}.modal-hero{display:flex;align-items:flex-start;gap:var(--space-2);flex-wrap:wrap}.modal-hero-title{font-size:clamp(2rem,4.2vw,4.5rem);font-weight:800;letter-spacing:-.04em;line-height:.95;margin:0;text-transform:uppercase;display:inline}.modal-hero-year{display:inline;margin-left:var(--space-1);font-size:var(--text-sm);font-weight:700;letter-spacing:-.02em;text-transform:uppercase;color:var(--color-text-muted);vertical-align:baseline}.modal-media{width:100%;max-height:100%;display:grid;gap:var(--space-2);overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none}.modal-media::-webkit-scrollbar{width:0;height:0}.modal-media-primary{display:grid;gap:var(--space-2)}.modal-media-row{display:grid;gap:var(--space-2);grid-template-columns:repeat(2,minmax(0,1fr))}.modal-side{margin-left:var(--space-2);display:grid;gap:var(--space-3);align-content:start}.modal-image-frame{width:100%;height:auto;max-height:100%;border-radius:5px;overflow:hidden;background:transparent;border:1px solid var(--color-border)}.modal-image{width:100%;height:auto;border:0;border-radius:0;background:transparent;object-fit:contain;display:block;max-height:100%}.modal-details{display:grid;gap:var(--space-2);font-size:var(--text-base);line-height:var(--line-height-normal);color:var(--color-text-muted);align-content:start;justify-items:start}.modal-detail-label{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}.modal-detail-value{font-size:var(--text-sm);font-weight:700;color:var(--color-text)}.modal-footer{padding:var(--space-2) var(--space-2);border-top:1px solid var(--color-border);display:flex;justify-content:flex-end}@media(min-width:900px){.modal-body{grid-template-columns:minmax(0,1fr) minmax(0,.45fr);align-items:start;grid-auto-rows:auto;grid-template-areas:"media details";overflow:hidden;justify-items:start}.modal-media{grid-area:media;height:100%;min-height:0;padding-right:var(--space-2);border-right:1px solid var(--color-border)}.modal-side{grid-area:details;justify-self:start}.modal-image{height:100%;max-height:100%;justify-self:start;align-self:stretch;object-fit:contain;background:var(--color-bg)}}@media(max-width:899px){.modal-backdrop{overflow:hidden}.modal-content{height:100%;max-height:100%}.modal-body{display:flex;flex-direction:column;overflow:auto;min-height:0;height:100%}.modal-side{order:-1;margin-left:0}.modal-media{margin:var(--space-2) 0 0;overflow:visible}}@media(max-width:899px)and (max-height:720px){.modal-body{padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom))}.modal-media{margin-bottom:var(--space-2)}}.toast{position:fixed;bottom:var(--space-2);right:0;background:var(--color-text);color:var(--color-bg);padding:0 var(--space-2) 0 var(--space-1);min-height:2.5rem;border-radius:0;font-size:var(--text-sm);z-index:10000;animation:toastLife var(--toast-duration, 1.8s) cubic-bezier(.22,1,.36,1) forwards;display:flex;align-items:center;justify-content:center}.toast-content{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1)}.toast-icon{display:inline-flex;align-items:center;justify-content:center}.toast-icon-svg{width:18px;height:18px}.toast-success{background:var(--color-text)}.toast-error{background:#d32f2f}.toast-info{background:#1976d2}@keyframes toastLife{0%{transform:translate(120%);opacity:0}18%{transform:translate(0);opacity:1}82%{transform:translate(0);opacity:1}to{transform:translateY(6px);opacity:0}}.about-section{overflow:visible}#info,#projects,#works,#about,#contact{scroll-margin-top:60px}.about-content{display:block;margin-top:var(--space-2);gap:var(--space-3)}.about-bio{width:100%}.about-bio p{margin-bottom:var(--space-3);line-height:var(--line-height-normal);font-size:var(--text-base);color:var(--color-text-muted)}.about-bio p:first-child{font-size:var(--text-lg);color:var(--color-text);font-weight:500}.about-bio p:last-child{margin-bottom:0}.about-skills{margin-top:var(--space-3);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}.about-skill-card{border:1px solid var(--color-border);background:var(--color-bg);padding:var(--space-3)}.skill-group{margin-bottom:0}.skill-group h4{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:var(--space-1);color:var(--color-text)}.skill-category{padding-bottom:5px;font-size:var(--text-xl);font-weight:700;text-transform:uppercase;line-height:1;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;word-break:normal;hyphenate-character:"-"}.skill-description{margin:0 0 var(--space-2);font-size:var(--text-base);color:var(--color-text-muted);line-height:var(--line-height-normal)}.skills-list{display:flex;flex-wrap:wrap;gap:var(--space-2)}.skill-list{display:flex;flex-wrap:wrap;gap:var(--space-1)}.skill-item{padding:6px 10px;border:1px solid var(--color-border);border-radius:999px;background:#ffffff0a;font-size:var(--text-sm);letter-spacing:.02em}.about-timeline{margin-top:var(--space-3);padding:0;border-top:1px solid var(--color-border);text-align:center;margin-left:calc(-1 * var(--space-2));margin-right:calc(-1 * var(--space-2));padding-left:var(--space-2);padding-right:var(--space-2);overflow:visible}.timeline-heading{font-size:var(--text-2xl);margin-bottom:var(--space-3);letter-spacing:-.03em;text-align:center}.timeline-orbit{display:block;overflow:visible}.timeline-vertical{display:none;text-align:left}.orbit-timeline{width:100%;overflow:visible}.orbit-canvas{position:relative;width:100%;min-height:320px;margin:0 auto;padding:0;overflow:visible}.orbit-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:1;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 0%,rgba(0,0,0,1) var(--orbit-mask-start, 70%),rgba(0,0,0,0) var(--orbit-mask-end, 75%));mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 0%,rgba(0,0,0,1) var(--orbit-mask-start, 70%),rgba(0,0,0,0) var(--orbit-mask-end, 75%));-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.orbit-ring{fill:none;stroke:var(--color-border);stroke-width:8;opacity:.8;transition:stroke-width .2s ease,opacity .2s ease,stroke .2s ease}.orbit-ring.frontend{animation-delay:0ms}.orbit-ring.design{animation-delay:.12s}.orbit-ring.music{animation-delay:.24s}.orbit-canvas[data-active-domain=frontend] .orbit-ring.frontend,.orbit-canvas[data-active-domain=design] .orbit-ring.design,.orbit-canvas[data-active-domain=music] .orbit-ring.music{stroke:var(--color-text);stroke-width:2.5;opacity:1}.orbit-tick{stroke:var(--color-border);stroke-width:1.2;opacity:.85;stroke-linecap:round}.orbit-tick.major{opacity:.95;stroke-width:1.6}.orbit-tick.month{opacity:.9;stroke-width:1.6}.orbit-tick.sub{opacity:.65;stroke-width:1.1}.orbit-indicator-track{fill:none;stroke:var(--color-text);stroke-width:1.2;opacity:.35}.orbit-indicator-line{stroke:var(--color-text);stroke-width:1.5;opacity:.9}.orbit-indicator-head{fill:var(--color-text)}.orbit-year-label{font-size:11px;font-weight:700;fill:var(--color-text-muted);text-anchor:middle;dominant-baseline:middle;letter-spacing:.1em;opacity:.75}.orbit-year-arc{fill:none;stroke:#000;stroke-width:25;opacity:.9;transform-origin:center;transform-box:fill-box}.orbit-year-label.active{fill:#fff}[data-theme=dark] .orbit-year-arc{stroke:#fff}[data-theme=dark] .orbit-year-label.active{fill:#000}.orbit-month-label{font-size:10px;fill:var(--color-text-muted);text-anchor:middle;dominant-baseline:middle;letter-spacing:.12em}.orbit-detail-layer{position:absolute;left:50%;top:var(--orbit-detail-top, 56%);transform:translate(-50%,-50%);width:clamp(200px,46vw,420px);max-width:92%;text-align:center;padding:clamp(12px,2vw,var(--space-3));font-size:calc(16px * var(--orbit-scale, 1))!important;z-index:3;pointer-events:none}@media(min-width:1350px){.orbit-detail-layer{font-size:calc(20px * var(--orbit-scale, 1))!important}.orbit-detail-layer .orbit-detail-year{font-size:var(--text-lg)!important}.orbit-detail-layer .orbit-detail-title{font-size:calc((var(--text-2xl) + var(--text-3xl)) / 2)!important}.orbit-detail-layer .orbit-detail-text{font-size:var(--text-lg)!important}}@media(max-width:1024px){.orbit-detail-layer{width:clamp(200px,48vw,250px)}.about-timeline{padding-bottom:calc(var(--space-4) + 80px)}.orbit-canvas{min-height:420px}}.orbit-detail{position:absolute;inset:0;opacity:0;filter:blur(2px)}.orbit-detail-year{font-size:var(--text-sm);font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:var(--color-text-muted);margin:0 0 var(--space-2);opacity:.8}.orbit-detail-title{font-size:var(--text-xl);font-weight:700;margin:0 0 var(--space-2);letter-spacing:-.03em;line-height:1}.orbit-detail-text{font-size:var(--text-base);color:var(--color-text-muted);margin:0;line-height:var(--line-height-normal);opacity:.85}@media(max-width:768px){.orbit-detail-year{font-size:var(--text-xs);margin-bottom:var(--space-1)}.orbit-detail-title{font-size:var(--text-lg)}.orbit-detail-text{font-size:var(--text-sm);line-height:1.5}}@media(max-width:560px){.orbit-detail-title{font-size:var(--text-base)}.orbit-detail-text{font-size:var(--text-sm)}}.orbit-node{position:absolute;transform:translate(-50%,-50%) rotate(var(--angle, 0deg)) translate(var(--radius, 0px));width:16px;height:16px;border-radius:999px;border:2.5px solid var(--color-text);background:var(--color-bg);cursor:pointer;padding:0;opacity:0;visibility:hidden;transition:transform .18s ease,border-width .18s ease;box-shadow:0 2px 8px #00000026;display:flex;align-items:center;justify-content:center;z-index:2}.orbit-node:after{content:"";position:absolute;inset:-6px;box-sizing:border-box;border-radius:999px}.orbit-node:hover:after,.orbit-node:focus-visible:after{border:1px solid var(--color-text);opacity:.25}.orbit-node:focus-visible:after,.orbit-node:focus:after,.orbit-node.active:focus-visible:after,.orbit-node.active:focus:after{border-color:#000;opacity:1}[data-theme=dark] .orbit-node:hover:after,[data-theme=dark] .orbit-node:focus-visible:after{border-color:#fff;opacity:.35}[data-theme=dark] .orbit-node:focus-visible:after,[data-theme=dark] .orbit-node:focus:after,[data-theme=dark] .orbit-node.active:focus-visible:after,[data-theme=dark] .orbit-node.active:focus:after{border-color:#fff;opacity:1}.orbit-node.active{background:var(--color-text)}.orbit-node.active:after{box-sizing:border-box;border:1px solid var(--color-text);border-radius:999px;opacity:.3}[data-theme=dark] .orbit-node.active:after{border-color:#fff;opacity:1}[data-theme=light] .orbit-node.active:after{border-color:#000;opacity:1}.orbit-tooltip-overlay{position:absolute;transform:translate(-50%,calc(-100% - 12px));padding:6px 10px;border:1px solid var(--color-text);background:var(--color-bg);font-size:var(--text-xs);font-weight:600;color:var(--color-text);white-space:nowrap;text-transform:uppercase;letter-spacing:-.02em;pointer-events:none;z-index:6;opacity:0;animation:orbitTooltipIn .14s ease-out forwards}.orbit-tooltip-overlay:after{content:"";position:absolute;left:50%;bottom:-5px;width:8px;height:8px;background:var(--color-bg);border-right:1px solid var(--color-text);border-bottom:1px solid var(--color-text);transform:translate(-50%) rotate(45deg)}.orbit-node:hover,.orbit-node:focus-visible{transform:translate(-50%,-50%) rotate(var(--angle, 0deg)) translate(var(--radius, 0px)) scale(1.12)}.orbit-in .orbit-ring{stroke-dasharray:1;stroke-dashoffset:1;animation:orbitDraw .82s ease-out forwards;animation-fill-mode:forwards}.orbit-in .orbit-node{animation:orbitSlide .42s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--delay, 0ms);animation-fill-mode:both;visibility:visible}.orbit-entered .orbit-node{animation:none;opacity:1;visibility:visible}.orbit-detail-enter{animation:orbitDetailIn .26s ease-out forwards}.orbit-detail-initial{animation-delay:.15s}.orbit-detail-exit{animation:orbitDetailOut .2s ease-out forwards}@keyframes orbitDraw{to{stroke-dashoffset:0}}@keyframes orbitSlide{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--start-angle, 0deg)) translate(var(--radius, 0px)) scale(.92)}to{opacity:1;transform:translate(-50%,-50%) rotate(var(--angle, 0deg)) translate(var(--radius, 0px)) scale(1)}}@keyframes orbitTooltipIn{0%{opacity:0;transform:translate(-50%,calc(-100% - 6px))}to{opacity:1;transform:translate(-50%,calc(-100% - 12px))}}@keyframes orbitDetailIn{to{opacity:1;filter:blur(0)}}@keyframes orbitDetailOut{0%{opacity:1;filter:blur(0)}to{opacity:0;filter:blur(2px)}}.timeline{position:relative;padding-left:calc(var(--space-3) + 8px);margin-top:var(--space-3);max-width:680px;margin-left:0;margin-right:0}.timeline-line{position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--color-border)}.timeline-items{display:flex;flex-direction:column;gap:var(--space-2)}.timeline-item{position:relative;padding-left:var(--space-2);--timeline-title-offset: calc(var(--text-sm) + 10px)}.timeline-dot{position:absolute;left:-12px;top:var(--timeline-title-offset);width:10px;height:10px;background:var(--color-bg);border:2px solid var(--color-text);border-radius:50%;box-shadow:0 0 0 3px var(--color-bg)}.timeline-content{text-align:left;padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border)}.timeline-year{font-weight:700;font-size:var(--text-sm);text-transform:uppercase;letter-spacing:-.02em;color:var(--color-text-base);margin:0}.timeline-title{font-weight:700;margin-bottom:5px;line-height:1}.timeline-description{font-size:var(--text-sm);color:var(--color-text-muted);line-height:var(--line-height-normal);margin:0}.contact-wrapper{margin-bottom:10em;padding:0}.contact-glass-card{border-radius:0;border:1px solid var(--color-border);background:transparent;padding:0}.contact-layout{display:grid;grid-template-columns:1fr;gap:0}.contact-intro{padding:var(--space-3);border-bottom:1px solid var(--color-border);display:flex;flex-direction:column}.contact-description{font-size:var(--text-base);line-height:var(--line-height-normal);color:var(--color-text);margin:0}.contact-info-card{width:100%}.contact-card-inner{border-radius:0;border:none;background:transparent;padding:var(--space-3)}.contact-field{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3)}.contact-field-content{min-width:0;flex:1}.contact-field-label{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:-.02em;color:var(--color-text-muted);margin:0 0 var(--space-1) 0}.contact-field-value{display:block;font-size:var(--text-sm);color:var(--color-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:none;transition:color var(--transition-base)}.contact-field-value:hover{color:var(--color-text);opacity:.7;border:none}.contact-email-list{display:grid;gap:var(--space-2);margin-top:var(--space-1)}.contact-email-item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:0 var(--space-2);border:1px solid var(--color-border);transition:all var(--transition-base);background:transparent;width:100%;text-align:left;cursor:pointer;font-family:var(--font-family);min-height:2.5rem;font-size:var(--text-sm);font-weight:700}.contact-email-text{font-size:inherit;font-weight:inherit;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-text)}.contact-email-tag{font-size:var(--text-xs);letter-spacing:.08em;opacity:.7;flex-shrink:0;color:var(--color-text)}.contact-email-item:hover{background:var(--color-text);color:var(--color-bg);border-color:var(--color-text)}.contact-email-item:hover .contact-email-text,.contact-email-item:hover .contact-email-tag{color:var(--color-bg)}.contact-divider{margin:var(--space-3) 0;height:1px;width:100%;background:var(--color-border)}.contact-tel-list{display:grid;gap:var(--space-2);margin-top:var(--space-1)}.contact-tel-item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:0 var(--space-2);border:1px solid var(--color-border);color:var(--color-text);text-decoration:none;transition:all var(--transition-base);font-size:var(--text-sm);font-weight:700;letter-spacing:-.02em;background:transparent;width:100%;cursor:pointer;text-align:left;font-family:var(--font-family);min-height:2.5rem}.contact-tel-left{display:inline-flex;align-items:center;gap:.5rem}.contact-tel-item:hover{background:var(--color-text);color:var(--color-bg);border-color:var(--color-text)}.contact-tel-prefix{opacity:.7}.contact-tel-number{font-variant-numeric:tabular-nums}.contact-tel-tag{font-size:var(--text-xs);letter-spacing:.08em;opacity:.7}.contact-social-section{margin-top:var(--space-3)}.contact-social-links{margin-top:var(--space-2);display:flex;flex-wrap:wrap;gap:var(--space-2)}.contact-divider-intro{margin:var(--space-3) 0}.contact-social-intro{margin-top:auto}.contact-social-link{border-radius:0;border:1px solid var(--color-border);background:transparent;padding:0 var(--space-2);min-height:2.5rem;font-size:var(--text-sm);font-weight:700;color:var(--color-text);transition:all var(--transition-base);text-decoration:none;text-transform:uppercase;letter-spacing:-.02em;display:inline-flex;align-items:center}.contact-social-link:hover{background:var(--color-text);color:var(--color-bg);border-color:var(--color-text);text-decoration:none}.contact-email{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6)}.contact-email .email{font-size:var(--text-2xl);font-weight:700;text-transform:uppercase;letter-spacing:-.04em}.contact-links{display:flex;flex-wrap:wrap;gap:var(--space-4)}.contact-link{text-transform:uppercase;font-size:var(--text-sm);font-weight:700;letter-spacing:-.02em}@media(min-width:768px){.contact-layout{grid-template-columns:1fr 1fr}.contact-intro{border-bottom:none;border-right:1px solid var(--color-border)}}.footer{background:transparent;color:var(--clr-white);padding:var(--space-3) var(--space-2)}.footer *{color:var(--clr-white);text-shadow:0 2px 12px rgba(0,0,0,.6)}.footer-social-link:hover,.footer-social-link:hover *{color:var(--clr-black)!important;text-shadow:none!important}.footer .container{display:flex;justify-content:space-between;align-items:center;max-width:none;width:100%}.footer-content{width:100%;display:flex;gap:var(--space-3);justify-content:space-between;align-items:center}.footer-info{display:flex;flex-direction:column;gap:var(--space-1)}.footer-copyright{font-size:var(--text-sm);font-weight:700;text-transform:uppercase;letter-spacing:-.02em}.footer-tagline{font-size:var(--text-sm);opacity:.8}.footer-social{display:flex;align-items:center;gap:var(--space-3)}.footer-social-link{display:flex;align-items:center;justify-content:center;width:40px;height:40px;line-height:1;border-radius:0;background:transparent;border:1px solid var(--clr-white);color:var(--clr-white);transition:all .3s var(--ease-smooth)}.footer-social-link:hover{background:var(--clr-white);color:var(--clr-black)!important}.footer-social-link:hover .footer-icon{color:var(--clr-black)!important;text-shadow:none!important}.footer-icon{font-size:var(--text-lg);font-weight:700;color:inherit;transition:color .3s var(--ease-smooth)}.footer-icon-image{width:22px;height:22px;object-fit:contain;object-position:center;display:block;filter:brightness(0) invert(1);transition:filter .3s var(--ease-smooth)}.footer-social-link:hover .footer-icon-image{filter:brightness(0) invert(0)}@media(max-width:1024px){.footer-content{flex-direction:column;align-items:flex-start;gap:var(--space-2)}.footer-social{flex-wrap:wrap;justify-content:flex-start;gap:var(--space-2)}.footer-social-link{width:36px;height:36px}}@media(max-width:768px){.navbar .container{padding:var(--space-2) var(--space-2)}.navbar-menu-toggle{display:inline-flex}.navbar-links,.nav-indicator{display:none}.navbar-menu-links{flex-direction:column;gap:0}.navbar-menu-panel .container{padding:0;max-width:none;width:100%}.hero{grid-template-columns:1fr;min-height:auto;padding-top:var(--space-4)}.hero-content{grid-column:1}.hero h1{font-size:var(--text-2xl)}.hero-stats{grid-column:1;grid-template-columns:1fr}.projects-grid{grid-template-columns:1fr;gap:var(--space-3)}.project-card{grid-column:1!important}.works-layout{gap:var(--space-2);flex-direction:column;align-items:stretch}.works-title-vertical{font-size:var(--text-2xl);writing-mode:horizontal-tb;text-orientation:initial;letter-spacing:-.02em}.lang-zh .works-title-vertical,html[lang=zh] .works-title-vertical{font-size:var(--text-2xl)}.works-edge-mask{width:60px}.about-content{margin-top:var(--space-2)}.about-bio,.about-skills{grid-column:1!important}.about-skills{grid-template-columns:1fr}.about-bio{max-width:none}.timeline-orbit{display:none}.timeline-vertical{display:block}.section{padding:var(--space-4) 0;margin-top:40px}.section-title{font-size:var(--text-2xl);margin:0;padding:0}.contact-wrapper{margin-top:var(--space-1);margin-bottom:var(--space-2)}.footer .container{flex-direction:column;gap:var(--space-4);align-items:center}.footer-content{flex-direction:column;gap:var(--space-3);text-align:center;align-items:center}.footer-social{display:grid;grid-template-columns:repeat(auto-fit,minmax(36px,1fr));gap:var(--space-2);justify-items:center;width:100%}h1{font-size:var(--text-2xl)}h2{font-size:var(--text-xl)}h3{font-size:var(--text-lg)}}@media(max-width:640px){.container{padding:0 var(--space-2)}.section{padding:0;margin-top:30px}.hero{padding-top:var(--space-3)}.hero h1{font-size:var(--text-xl)}.hero .subtitle{font-size:var(--text-base)}.stat-number,h1{font-size:var(--text-xl)}h2{font-size:var(--text-lg)}h3{font-size:var(--text-base)}.work-card{aspect-ratio:3/2}}@media(hover:none){button:hover,a:hover,.btn:hover,.btn-link:hover,.toggle-btn:hover,.lang-toggle:hover,.contact-social-link:hover,.contact-email-item:hover,.contact-tel-item:hover,.projects-list-item:hover,.work-card:hover img,.work-card:hover .work-overlay{background:inherit;color:inherit;border-color:inherit;transform:none;opacity:1}.contact-email-item:hover .contact-email-text,.contact-email-item:hover .contact-email-tag{color:inherit}.toggle-btn:hover,.lang-toggle:hover{background-color:var(--toggle-bg);color:var(--toggle-fg);border-color:var(--toggle-border)}}@media(max-width:560px){.hero-ctas{flex-direction:column;gap:var(--space-2)}.btn,.btn-link{width:100%;justify-content:center}}.projects-feature-layout{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:var(--space-2);align-items:start}.project-featured{grid-column:1 / span 16}.projects-compact{grid-column:18 / span 7;display:flex;flex-direction:column;gap:var(--space-2)}.projects-section{overflow:visible!important}.projects-section>.container{overflow:visible!important}.projects-list-detail{display:grid;grid-template-columns:1fr 2fr;gap:var(--space-3);align-items:start;overflow:visible}.projects-list{display:flex;flex-direction:column;gap:0;border:none;background:var(--color-bg);padding-bottom:5px}.projects-list-item{display:block;margin-bottom:2rem;padding-bottom:var(--space-1);border:none;border-bottom:1px solid var(--color-border);background:transparent;color:var(--color-text);cursor:pointer;transition:all var(--transition-base);text-align:left;font-family:var(--font-family);font-size:inherit;transform:translate(0);position:relative;line-height:1.1}.projects-list-item:last-child{border-bottom:none;margin-bottom:0}.projects-list-item:hover{transform:translate(var(--space-2));color:var(--color-text)}.projects-list-item:focus{outline:none;color:var(--color-text)}.projects-list-item-title{display:inline;font-size:var(--text-xl);font-weight:700;text-transform:uppercase;letter-spacing:-.02em}.projects-list-item-year{display:inline;margin-left:var(--space-1);font-size:var(--text-sm);color:var(--color-text-muted);transition:color var(--transition-base);vertical-align:baseline}.projects-list-item.active{background:transparent;color:var(--color-text);border-bottom:none}.projects-list-item.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--color-text);transform:scaleX(0);transform-origin:left;animation:fillBorder var(--transition-base) forwards}.projects-list-item.active .projects-list-item-year{color:var(--color-text)}@keyframes fillBorder{to{transform:scaleX(1)}}.projects-detail-container{grid-column:2;position:relative;min-height:100%;overflow:visible;padding:100px 0;margin:-100px 0}.projects-detail{position:absolute;width:100%;min-height:100%;display:flex;flex-direction:column}.projects-detail .card-body{flex:1}.projects-detail.slide-down{animation:slideFromBottom .5s cubic-bezier(.23,1,.32,1) forwards;z-index:2}.projects-detail.slide-up{animation:slideFromTop .5s cubic-bezier(.23,1,.32,1) forwards;z-index:2}.projects-detail.slide-out{animation:slideOutDown .5s cubic-bezier(.23,1,.32,1) forwards;z-index:1}@keyframes slideFromBottom{0%{opacity:0;transform:translateY(100px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideFromTop{0%{opacity:0;transform:translateY(-100px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideOutDown{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(100px) scale(.95)}}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pageTextIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes langTextIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.page-enter .navbar :is(a,button),.page-enter main :is(h1,h2,h3,p,li,a,button:not(.orbit-node)),.page-enter footer :is(p,a){opacity:0;transform:translateY(10px);animation:pageTextIn .8s var(--ease-smooth) forwards;animation-delay:var(--enter-delay, 0s);will-change:transform,opacity}.boot-loading .navbar :is(a,button),.boot-loading main :is(h1,h2,h3,p,li,a,button:not(.orbit-node)),.boot-loading footer :is(p,a){opacity:0;transform:translateY(10px)}.boot-loading .hero-logo,.boot-loading .hero-skill-list li{opacity:0;transform:translateY(10px)}.lang-change .navbar :is(a,button),.lang-change main :is(h1,h2,h3,p,li,a,button:not(.orbit-node),.hero-lang-sep,.hero-logo,.work-meta,.project-year,.skills-list,.timeline-title),.lang-change footer :is(p,a){animation:langTextIn .52s cubic-bezier(.22,1,.36,1) forwards;animation-fill-mode:both;will-change:transform,opacity}.page-enter .hero-logo{opacity:0;transform:translateY(10px);animation:pageTextIn .8s var(--ease-smooth) forwards;animation-delay:var(--enter-delay, 0s);will-change:transform,opacity}.page-enter .navbar :is(a,button){--enter-delay: .05s}.page-enter .hero-skill-list li{--enter-delay: var(--delay, .3s)}.page-enter .section-title{--enter-delay: .16s}@media(prefers-reduced-motion:reduce){.page-enter .navbar :is(a,button),.page-enter main :is(h1,h2,h3,p,li,a,button),.page-enter footer :is(p,a){animation:none;opacity:1;transform:none}.lang-change .navbar :is(a,button),.lang-change main :is(h1,h2,h3,p,li,a,button,.hero-lang-sep,.work-meta,.project-year,.skills-list,.timeline-title),.lang-change footer :is(p,a){animation:none}}.project-oneLiner{margin-bottom:var(--space-2)}.project-highlights{margin-bottom:1.2em;padding-left:1.1em;font-size:var(--text-sm);line-height:var(--line-height-normal)}.project-highlights li{margin-bottom:.35em}.clamp-2{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.project-links{display:flex;gap:var(--space-2);flex-wrap:wrap}@media(max-width:560px){.project-links{flex-direction:column;width:100%}.project-links .btn{width:100%}}@media(max-width:900px){.project-featured,.projects-compact{grid-column:1 / -1}}@media(max-width:768px){.projects-list-detail.mobile{grid-template-columns:1fr;gap:var(--space-2)}.projects-list-row{display:grid;gap:var(--space-2)}.projects-detail-inline{padding-left:0;margin-top:0}.projects-detail-mobile{position:relative;width:100%}.projects-list-item{margin-bottom:0;padding:var(--space-2) 0 var(--space-1);border:none;border-bottom:1px solid var(--color-border)}.projects-list-item-title{font-size:var(--text-lg)}.projects-list-item:last-child{margin-bottom:0}.projects-list-item.active{border-bottom:1px solid transparent}.projects-list-item.active:after{display:block;transform:scaleX(0);transform-origin:left;animation:fillBorder var(--transition-base) forwards}.projects-list-item:hover{transform:translate(0)!important}.projects-list-item:active{transform:translate(0)}.projects-detail-mobile .card-header,.projects-detail-mobile .card-body,.projects-detail-mobile .card-footer{padding:var(--space-2)}.projects-detail-mobile .card-footer{padding-top:.3em}.projects-detail-mobile.slide-down{animation:slideFromBottomMobile .32s cubic-bezier(.23,1,.32,1) forwards;will-change:transform,opacity}.projects-detail-mobile.slide-up{animation:slideFromTopMobile .32s cubic-bezier(.23,1,.32,1) forwards;will-change:transform,opacity}@keyframes slideFromBottomMobile{0%{opacity:0;transform:translateY(40px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideFromTopMobile{0%{opacity:0;transform:translateY(-40px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}}.page-background{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:-1;overflow:hidden}.page-background img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.page-background:after{content:"";position:absolute;inset:0;background:#2c345db8;mix-blend-mode:multiply;pointer-events:none}.intro-stage{position:relative;min-height:200vh;background:transparent}.intro-hero-section{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:0;pointer-events:none}.hero-overlay{position:absolute;top:0;left:0;width:100%;height:100vh;padding-bottom:var(--space-2);display:flex;align-items:flex-end;justify-content:center;opacity:0;transform:translateY(16px);transition:none;pointer-events:auto}.intro-stage.boot-ready .hero-overlay{opacity:var(--hero-opacity, 1);transform:translateY(var(--hero-translateY, 0));transition:opacity .6s cubic-bezier(.19,1,.22,1),transform .6s cubic-bezier(.19,1,.22,1)}.hero-overlay .hero{padding-top:0;min-height:auto;color:var(--clr-white)}.hero-overlay .hero *{color:var(--clr-white);text-shadow:0 2px 12px rgba(0,0,0,.4)}.hero-overlay .hero .btn,.hero-overlay .hero .btn-link{border-color:var(--clr-white);color:var(--clr-white);text-shadow:none}.hero-overlay .hero .btn:hover,.hero-overlay .hero .btn-link:hover{background:var(--clr-white);color:var(--clr-black)}.title-layer{position:fixed;top:0;left:0;width:100%;height:auto;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;mix-blend-mode:difference;color:var(--clr-white);pointer-events:none;padding:0;margin:0;overflow:visible;transition:none;transform:translateZ(0)}.site-title{width:100%;font-size:18vw;font-weight:900;letter-spacing:0;padding-top:.5rem;text-transform:uppercase;line-height:.75;display:flex;justify-content:space-between;align-items:flex-start;overflow:visible}.subtitle-row{width:100%;display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;padding:var(--space-2);opacity:0;transform:translateY(-12px);transition:opacity .7s ease,transform .7s cubic-bezier(.23,1,.32,1);transition-delay:.6s}.hero-in .subtitle-row{opacity:1;transform:translateY(0)}.site-subtitle{color:#fff;font-size:2rem;font-weight:400;letter-spacing:.08em;text-transform:uppercase;margin:0;display:flex;align-items:center;gap:.75rem;flex-shrink:0}.subtitle-word{display:inline-flex;align-items:center;gap:.75rem}.subtitle-sep{opacity:.6}.hero-lang-toggle{display:flex;align-items:center;gap:.5rem;color:#fff;font-size:1.25rem;letter-spacing:.05em;text-transform:uppercase;flex-shrink:0;pointer-events:auto}.hero-lang-btn{background:none;border:none;color:#fff;font-size:1.25rem;font-weight:400;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:font-weight .2s ease;padding:0;pointer-events:auto}.hero-lang-btn.active{font-weight:700}.hero-lang-sep{color:#fff;opacity:.6}.intro-spacer{text-align:center;height:100vh}.site-title .letter{display:inline-flex;overflow:visible}.site-title .letter>span{display:inline-flex;transform:translateY(-108%);transition:transform 1s cubic-bezier(.23,1,.32,1) var(--delay, 0s)}.hero-in .site-title .letter>span{transform:translateY(0)}.intro-content{position:relative;background:var(--color-bg);min-height:100vh;padding-top:calc(120px + var(--space-3));z-index:auto;box-shadow:0 -2px 40px #0000001a}.seo-intro{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);border:0;white-space:nowrap}.seo-title,.seo-subtitle{margin:0}@media(max-width:768px){.intro-content{padding-top:calc(80px + var(--space-2))}.site-title .letter>span{transform:translateY(-135%)}}main{position:relative;z-index:1}.footer{position:relative;z-index:1;background:transparent}.navbar{opacity:0;pointer-events:none;transition:opacity .4s ease-out}.navbar.visible{opacity:1;pointer-events:auto}@media(max-width:768px){.intro-stage{min-height:150vh}.site-title{font-size:var(--text-3xl);padding:.75rem .75rem 0}.subtitle-row{gap:.5rem;padding:var(--space-1) .75rem;flex-wrap:wrap}.site-subtitle{font-size:var(--text-base);padding-top:0;opacity:1;white-space:normal;line-height:var(--line-height-normal);flex-direction:column;align-items:flex-start;gap:.2rem}.subtitle-sep{display:none}.hero-lang-toggle,.hero-lang-btn{font-size:var(--text-base);line-height:var(--line-height-normal)}.white-panel{top:100px}}.info-section{background:var(--color-background);padding:calc(20vw + var(--space-8)) var(--space-8) var(--space-8) var(--space-8);width:100%;min-height:calc(100vh - 60px)}.info-content{margin:0 auto;text-transform:uppercase;margin-top:10vw;margin-bottom:15vw}.info-columns{display:grid;width:80%;grid-template-columns:1fr;gap:var(--space-3);align-items:start}.info-columns p{font-size:var(--text-lg);line-height:1.5;color:var(--color-text-secondary);margin:0}.info-paragraph-intro{font-weight:700}
