@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&display=swap";:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--page-background:#f5f4ef;--content-width:min(60vw, 920px);--surface:#f5f4eff0;--surface-contrast:#0f0f10;--button-text:#f5f4ef;--card:#ffffffd1;--card-muted:#ffffff94;--card-highlight:#ffffffeb;--card-contrast:#171717;--text-primary:#131313;--muted:#1313138f;--muted-strong:#131313bd;--border-soft:#1313131f;--border-strong:#13131347;--hero-glow:#13131314;--hero-glow-strong:#13131324;--shadow-soft:0 18px 50px #0f0f100f;--shadow-card:0 24px 60px #0f0f101f;--shadow-avatar:#0f0f102e;font-family:Manrope,Avenir Next,PingFang SC,Microsoft YaHei,sans-serif;font-weight:400;line-height:1.5}:root[data-theme=dark]{--page-background:#090909;--surface:#0a0a0af0;--surface-contrast:#f5f4ef;--button-text:#090909;--card:#151515e0;--card-muted:#111111b3;--card-highlight:#1a1a1af0;--card-contrast:#f5f4ef;--text-primary:#f2f1eb;--muted:#f2f1eb94;--muted-strong:#f2f1ebc2;--border-soft:#f2f1eb1f;--border-strong:#f2f1eb42;--hero-glow:#ffffff0f;--hero-glow-strong:#ffffff1a;--shadow-soft:0 24px 60px #00000057;--shadow-card:0 30px 80px #00000075;--shadow-avatar:#0006}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(circle at top, #00000008, transparent 28%), linear-gradient(180deg, var(--page-background), color-mix(in srgb, var(--page-background) 88%, var(--surface-contrast)));min-width:320px;color:var(--text-primary);margin:0}a,button,input,textarea,select{font:inherit}button{color:inherit}img,svg{display:block}#root{min-height:100vh}.page{min-height:100vh;position:relative}.page-noise{pointer-events:none;opacity:.34;z-index:-1;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:42px 42px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(circle,#000000e6,#0000 78%);mask-image:radial-gradient(circle,#000000e6,#0000 78%)}.site-header{z-index:40;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:color-mix(in srgb, var(--surface) 82%, transparent);border-bottom:1px solid var(--border-soft);position:sticky;top:0}.header-inner{width:min(var(--content-width), calc(100vw - 48px));justify-content:space-between;align-items:center;gap:24px;min-height:80px;margin:0 auto;display:flex}.brand-lockup{color:inherit;cursor:pointer;background:0 0;border:0;align-items:center;gap:14px;padding:0;display:inline-flex}.brand-mark-shell{border:1px solid var(--border-strong);background:var(--card-muted);letter-spacing:.12em;border-radius:14px;place-items:center;width:42px;height:42px;font-size:1rem;font-weight:700;display:grid}.brand-copy{text-align:left;gap:2px;display:grid}.brand-name{font-size:.95rem;font-weight:600}.brand-role{color:var(--muted);letter-spacing:.2em;font-size:.7rem}.desktop-nav,.header-actions,.hero-actions,.hero-meta,.tag-list,.skill-cloud,.modal-tags{flex-wrap:wrap;align-items:center;display:flex}.desktop-nav{gap:10px}.nav-link,.mobile-nav-link{color:var(--muted);cursor:pointer;background:0 0;border:0;padding:10px 14px;font-size:.95rem;transition:color .18s;position:relative}.nav-link:after,.mobile-nav-link:after{content:"";transform-origin:50%;background:currentColor;height:1px;transition:transform .18s;position:absolute;bottom:6px;left:14px;right:14px;transform:scaleX(0)}.nav-link:hover,.nav-link.is-active,.mobile-nav-link:hover,.mobile-nav-link.is-active{color:var(--text-primary)}.nav-link:hover:after,.nav-link.is-active:after,.mobile-nav-link:hover:after,.mobile-nav-link.is-active:after{transform:scaleX(1)}.header-actions{gap:12px}.icon-button,.modal-close{border:1px solid var(--border-soft);background:color-mix(in srgb, var(--card) 72%, transparent);width:40px;height:40px;color:inherit;cursor:pointer;border-radius:999px;place-items:center;transition:transform .18s,border-color .18s,background .18s,box-shadow .18s;display:grid}.icon-button:hover,.modal-close:hover,.primary-button:hover,.secondary-button:hover,.project-link:hover,.contact-button:hover{transform:translateY(-2px)}.icon-button svg,.modal-close svg,.meta-pill svg,.primary-button svg,.secondary-button svg,.project-link svg,.contact-button svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.mobile-only,.mobile-nav-panel{display:none}.main-content{width:min(var(--content-width), calc(100vw - 48px));margin:0 auto;padding-bottom:120px}.section-shell{padding:132px 0 0;scroll-margin-top:92px;position:relative}.hero-section{align-items:center;min-height:calc(100vh - 80px);padding-top:56px;padding-bottom:88px;display:grid}.hero-grid,.about-grid,.skills-grid{gap:24px;display:grid}.hero-grid{grid-template-columns:1fr;align-items:center}.eyebrow{color:var(--muted);letter-spacing:.28em;text-transform:uppercase;margin:0 0 18px;font-size:.78rem;font-weight:600}.hero-greeting,.hero-title,.hero-summary,.scroll-copy,.timeline-period,.timeline-title,.timeline-subtitle,.timeline-body,.project-period,.project-title,.project-summary,.skill-group-title,.about-card-title,.about-copy,.modal-period,.modal-title,.modal-summary,.modal-section-title,.modal-body,.modal-list,.avatar-caption{margin:0}.hero-greeting{color:var(--muted);font-size:1.05rem}.hero-title{letter-spacing:-.05em;letter-spacing:.02em;max-width:8ch;margin-top:12px;font-family:Alibaba PuHuiTi,HarmonyOS Sans,MiSans,sans-serif;font-size:clamp(3.8rem,6vw,5.6rem);font-weight:700;line-height:.94}.hero-summary{max-width:100%;color:var(--muted-strong);margin-top:28px;font-size:1.02rem;line-height:1.95}.hero-meta{gap:12px;margin-top:30px}.meta-pill,.tag-chip,.skill-pill{border:1px solid var(--border-soft);background:var(--card);border-radius:999px}.meta-pill{color:var(--text-primary);align-items:center;gap:10px;padding:10px 16px;display:inline-flex}.hero-actions{gap:14px;margin-top:28px}.primary-button,.secondary-button,.project-link{cursor:pointer;border-radius:16px;justify-content:center;align-items:center;gap:10px;min-height:52px;padding:0 20px;font-weight:600;text-decoration:none;transition:transform .18s,background .18s,border-color .18s,color .18s;display:inline-flex}.primary-button{border:1px solid var(--text-primary);background:var(--text-primary);color:var(--button-text)}.secondary-button,.project-link{border:1px solid var(--border-strong);color:var(--text-primary);background:0 0}.scroll-copy{display:none}.hero-scroll-indicator{color:var(--muted);cursor:pointer;background:0 0;border:0;align-items:center;gap:12px;padding:0;transition:color .18s,transform .18s;display:inline-flex;position:absolute;bottom:20px;left:0}.hero-scroll-indicator:hover{color:var(--text-primary);transform:translateY(-2px)}.scroll-indicator-mouse{border:1px solid;border-radius:999px;justify-content:center;width:23px;height:36px;padding-top:7px;display:inline-flex}.scroll-indicator-wheel{background:currentColor;border-radius:999px;width:3px;height:8px;animation:1.8s ease-in-out infinite scrollWheel}.scroll-indicator-copy{letter-spacing:.16em;text-transform:uppercase;font-size:.84rem}.section-heading{margin-bottom:26px}.section-title{letter-spacing:-.04em;margin:0;font-size:clamp(2rem,3.6vw,2.8rem)}.timeline-shell{grid-template-columns:56px minmax(0,1fr);gap:8px;display:grid}.timeline-rail{background:var(--border-soft);transform-origin:top;justify-self:center;width:1px;min-height:100%;position:relative}.timeline-progress{background:var(--text-primary);transform-origin:top;width:100%;height:100%;transition:transform .36s;position:absolute;inset:0 auto auto 0}.timeline-list{gap:18px;display:grid}.timeline-card,.project-card,.skill-group,.about-card,.modal-panel{border:1px solid var(--border-soft);background:var(--card);box-shadow:var(--shadow-soft)}.timeline-card{opacity:.42;border-radius:24px;padding:24px 26px 26px;transition:opacity .28s,transform .28s,border-color .28s,background .28s;position:relative;transform:translateY(24px)}.timeline-card.is-active{opacity:1;border-color:var(--border-strong);background:var(--card-highlight);transform:translateY(0)}.timeline-dot{border:3px solid var(--surface);background:var(--card);width:12px;height:12px;box-shadow:0 0 0 1px var(--border-soft);border-radius:50%;position:absolute;top:34px;left:-31px}.timeline-card.is-active .timeline-dot{background:var(--text-primary);box-shadow:0 0 0 1px var(--text-primary)}.timeline-period,.project-period,.modal-period{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;font-size:.84rem}.timeline-title,.project-title,.modal-title,.about-card-title{letter-spacing:-.03em;margin-top:12px;font-size:1.35rem}.timeline-subtitle{color:var(--muted-strong);margin-top:8px;font-weight:600}.timeline-body,.project-summary,.about-copy,.modal-summary,.modal-body,.modal-list{color:var(--muted-strong);margin-top:18px;line-height:1.92}.project-grid{grid-template-columns:1fr;gap:18px;display:grid}.project-card{border-radius:30px;outline:none;gap:18px;padding:28px;transition:transform .22s,border-color .22s,background .22s,box-shadow .22s;display:grid}.project-card:hover,.project-card:focus-visible{border-color:var(--border-strong);background:var(--card-highlight);box-shadow:var(--shadow-card);transform:translateY(-3px)}.project-card.is-featured{background:linear-gradient(180deg, var(--card-highlight), var(--card))}.project-card-top{justify-content:space-between;align-items:center;gap:16px;display:flex}.project-link{border-radius:999px;min-height:42px;padding-inline:16px}.project-link svg,.primary-button svg,.secondary-button svg,.contact-button svg{transition:transform .18s}.project-link:hover svg,.primary-button:hover svg,.secondary-button:hover svg,.contact-button:hover svg{transform:translate(2px,-2px)}.tag-list{gap:10px}.tag-chip{color:var(--muted-strong);align-items:center;padding:8px 14px;font-size:.88rem;display:inline-flex}.skills-grid{grid-template-columns:1fr;gap:18px}.skill-group{border-radius:30px;padding:24px 24px 26px}.skill-group-title{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px;font-size:1rem}.skill-cloud{gap:10px}.skill-pill{color:var(--text-primary);align-items:center;gap:12px;padding:10px 14px;transition:transform .18s,border-color .18s,background .18s;display:inline-flex}.skill-pill:hover{border-color:var(--border-strong);background:var(--card-highlight);transform:translateY(-2px)}.skill-pill-large{padding:12px 16px;font-size:.98rem}.skill-pill-medium{font-size:.92rem}.brand-mark{width:32px;height:32px;color:var(--text-primary);flex:none;place-items:center;display:inline-grid}.brand-logo-shell{background:color-mix(in srgb, var(--card-muted) 72%, transparent);border-radius:10px}.brand-logo-image{object-fit:contain;width:20px;height:20px}.brand-glyph{border:1px solid var(--border-soft);letter-spacing:-.04em;border-radius:10px;font-size:.72rem;font-weight:700}.brand-aistudio-custom,.brand-codex,.brand-rhino{position:relative}.brand-aistudio-custom span,.brand-codex span,.brand-rhino span{display:block}.brand-aistudio-custom span{clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);border:1px solid;width:18px;height:18px;transform:rotate(24deg)}.brand-codex span{border-left:2px solid;border-right:2px solid;width:24px;height:18px}.brand-codex:before,.brand-codex:after{content:"";border-top:2px solid;width:11px;position:absolute;top:6px}.brand-codex:before{transform-origin:0;left:1px;transform:rotate(32deg)}.brand-codex:after{transform-origin:100%;right:1px;transform:rotate(-32deg)}.brand-rhino span{border:1px solid;border-radius:4px 9px 6px 6px;width:18px;height:18px;transform:skew(-16deg)}.brand-rhino:before,.brand-rhino:after{content:"";border:1px solid;position:absolute}.brand-rhino:before{border-right:0;border-radius:4px 0 0 6px;width:9px;height:7px;top:7px;left:1px;transform:skew(-18deg)}.brand-rhino:after{border-bottom:0;border-left:0;width:6px;height:6px;top:4px;right:0;transform:skew(-16deg)rotate(22deg)}.about-grid{grid-template-columns:1fr;gap:18px}.about-card{border-radius:30px;padding:28px}.contact-card{flex-direction:column;display:flex}.contact-button{width:fit-content;margin-top:30px}.modal-backdrop{z-index:60;background:color-mix(in srgb, var(--surface-contrast) 48%, transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal-panel{border-radius:32px;width:min(840px,100%);max-height:min(88vh,920px);padding:32px;position:relative;overflow:auto}.modal-close{margin-left:auto;position:sticky;top:0}.modal-summary{max-width:640px}.modal-tags{margin-top:20px}.modal-content{gap:24px;margin-top:30px;display:grid}.modal-section{border-top:1px solid var(--border-soft);padding-top:20px}.modal-section-title{font-size:1.08rem}.modal-list{padding-left:18px}.modal-list li+li{margin-top:10px}.icon-button:hover,.modal-close:hover{border-color:var(--border-strong);background:var(--card-highlight);box-shadow:var(--shadow-soft)}@media (width<=960px){.desktop-nav{display:none}.mobile-only{display:grid}.mobile-nav-panel{gap:6px;width:min(1160px,100vw - 40px);max-height:0;margin:0 auto 12px;padding:0;transition:max-height .22s;display:grid;overflow:hidden}.mobile-nav-panel.is-open{max-height:320px;padding-bottom:12px}.mobile-nav-link{justify-self:start;padding-inline:0}.hero-grid,.project-grid,.skills-grid,.about-grid{grid-template-columns:1fr}}@media (width<=720px){.header-inner,.main-content{width:min(100vw - 28px, var(--content-width))}.header-inner{min-height:72px}.section-shell{padding-top:96px}.hero-section{min-height:auto;padding-top:44px;padding-bottom:72px}.hero-title{font-size:clamp(3rem,16vw,4.2rem)}.hero-summary{font-size:.96rem;line-height:1.82}.hero-actions{flex-direction:column;align-items:stretch}.primary-button,.secondary-button{width:100%}.hero-scroll-indicator{bottom:18px;left:50%;transform:translate(-50%)}.hero-scroll-indicator:hover{transform:translate(-50%)translateY(-2px)}.project-card,.skill-group,.about-card{border-radius:24px;padding:22px}.project-card-top{flex-direction:column;align-items:flex-start}.project-link{padding-inline:14px}.skill-cloud{gap:8px}.skill-pill-large,.skill-pill-medium{font-size:.88rem}.about-copy,.timeline-body,.project-summary,.modal-summary,.modal-body,.modal-list{font-size:.94rem;line-height:1.8}.timeline-shell{grid-template-columns:28px minmax(0,1fr)}.timeline-dot{left:-19px}.modal-backdrop{padding:16px}.modal-panel{border-radius:24px;max-height:92vh;padding:22px}}@media (width<=480px){.header-inner,.main-content{width:calc(100vw - 22px)}.site-header{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand-copy{gap:0}.brand-role{letter-spacing:.16em;font-size:.62rem}.section-shell{padding-top:84px}.hero-section{padding-top:28px;padding-bottom:64px}.hero-title{max-width:none;font-size:clamp(2.5rem,15vw,3.5rem)}.hero-greeting,.hero-summary{font-size:.92rem}.eyebrow{letter-spacing:.22em;margin-bottom:14px;font-size:.72rem}.meta-pill{justify-content:center;width:100%}.primary-button,.secondary-button{border-radius:14px;min-height:48px}.scroll-indicator-copy{letter-spacing:.12em;white-space:nowrap;font-size:.74rem}.section-title{font-size:1.7rem}.timeline-card,.project-card,.skill-group,.about-card,.modal-panel{border-radius:20px;padding:18px}.timeline-title,.project-title,.modal-title,.about-card-title{font-size:1.18rem}.timeline-period,.project-period,.modal-period{letter-spacing:.1em;font-size:.76rem}.tag-chip{padding:7px 12px;font-size:.8rem}.brand-mark{width:28px;height:28px}.brand-logo-image{width:17px;height:17px}.modal-backdrop{padding:10px}}@keyframes scrollWheel{0%,to{opacity:1;transform:translateY(0)}60%{opacity:.2;transform:translateY(8px)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}
