.site-header{height:96px;padding-inline:48px;color:#fff}
.wordmark{flex:0 0 auto;min-height:44px;justify-content:center;align-items:flex-start;gap:0;color:#fff}
.wordmark>span{font-weight:400;line-height:1.2;color:inherit;text-shadow:none}
.wordmark>.wordmark-zh{display:flex;flex-direction:column;align-items:stretch;gap:4px;font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
.wordmark-name{font-size:24px;font-weight:600;line-height:1.1;letter-spacing:.035em;margin-right:-.035em;white-space:nowrap}
.wordmark-signature{font-size:11.5px;font-weight:500;line-height:1.3;letter-spacing:0;text-align:justify;text-align-last:justify;color:#e0e4e4;white-space:nowrap}
.wordmark>.wordmark-en{display:none;flex-direction:column;align-items:flex-start;gap:4px;letter-spacing:0;white-space:nowrap}
.wordmark-en-name{font-size:21px;font-weight:500;letter-spacing:.08em;line-height:1.1}
.wordmark-en-signature{font-size:10px;font-weight:400;letter-spacing:.025em;line-height:1.3;color:#d4dada}
html[lang="en"] .wordmark>.wordmark-zh{display:none}
html[lang="en"] .wordmark>.wordmark-en{display:flex}
/* Pair the two lines optically, with the whole mark centred on the controls. */
.site-header .wordmark>.wordmark-zh{gap:1px}
.site-header .wordmark>.wordmark-en{gap:2px}
.site-header .wordmark-name,.site-header .wordmark-signature,.site-header .wordmark-en-name{line-height:1}
.site-header .wordmark-en-signature{line-height:1.1}
.hero-shade{background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.06) 24%,transparent 50%,rgba(0,0,0,.5))}
.photo-open,.series-arrow,.journal-open,.hero-link>span:last-child,.text-link>span:last-child,.contact-nav>span:last-child,.scroll-cue{display:none!important}
.hero-link,.text-link{gap:0}
.hero-link{border-bottom:1px solid #c2c7c7;padding-bottom:5px}
.lightbox-arrow{font-size:10px;width:65px;letter-spacing:0}
.home-profile{padding-top:38px;padding-bottom:38px;background:var(--ink)}
.home-profile h2{font-family:var(--sans);font-size:22px;line-height:1.45;letter-spacing:.12em;font-weight:500}
.home-profile h2 span{font-size:13px;font-weight:400;letter-spacing:.06em;margin-left:12px;color:#bfc5c5}
.profile-location{font-size:15px;line-height:1.5;margin-top:9px;color:#eee}
.profile-role{font-size:12px;line-height:1.5;margin-top:6px;color:#aeb5b5}
.profile-social{display:flex;align-items:center;gap:13px;margin-top:17px;font-size:14px}
.profile-social a,.profile-social button{text-decoration:none;border-bottom:1px solid #566165;color:#f0f0f0;padding:0 0 3px;font-size:inherit}
.profile-social>span{color:#aeb3b3}
.profile-social a:hover,.profile-social button:hover{color:#b9c7c7}
@media(max-width:800px){
 .site-header{height:84px;padding-inline:25px}
 .site-header.scrolled{height:72px}
 .wordmark-name{font-size:23px}
 .wordmark-signature{font-size:11px}
 .wordmark-en-name{font-size:20px}
 .wordmark-en-signature{font-size:9px}
 .header-actions{gap:18px}
 .hero{height:90svh}
 .places{height:32svh}
 .home-profile{height:calc(28svh - 44px);min-height:132px;padding:16px 22px 12px;display:flex;flex-direction:column;justify-content:center}
 .home-profile h2{font-size:17px}
 .home-profile h2 span{font-size:11px;margin-left:8px}
 .profile-location{font-size:12px;margin-top:5px}
 .profile-role{font-size:10px;margin-top:4px}
 .profile-social{font-size:12px;margin-top:10px;gap:12px}
}
@media(max-width:560px){
 .wordmark-name{font-size:23px}
 .wordmark-en-name{font-size:19px;letter-spacing:.07em}
 .site-header{height:80px;padding-inline:22px}
 .site-header.scrolled{height:68px}
 .header-actions{gap:8px}
 .menu-toggle{width:44px}.menu-toggle span{width:26px;left:9px}
 .language-switch{gap:1px}
 .lightbox-arrow{font-size:9px;width:55px}
}
@media(max-width:350px){.wordmark-en-name{font-size:18px;letter-spacing:.06em}.header-actions{gap:4px}.site-header{padding-inline:18px}}

.social-names a{border-bottom:1px solid #566165;padding-bottom:3px;color:inherit}.social-names a:hover{color:#fff;border-color:#fff}

/* Author-supplied portrait, shown without visual filters or cropping. */
.route-dialog .about{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.route-dialog .about-image{aspect-ratio:1150/1536;background:transparent}
.route-dialog .about-image>img{width:100%;height:100%;object-fit:contain;filter:none}
.route-dialog .about-image:after{display:none}
@media(max-width:560px){.route-dialog .about{grid-template-columns:1fr}.route-dialog .about-image{aspect-ratio:1150/1536}}

/* Compact one-click language switch, adapted to the portfolio's neutral palette. */
.language-switch{gap:0;min-height:44px;align-items:center}
.language-switch .language-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:66px;min-height:34px;height:34px;padding:6px 12px;border:1px solid rgba(230,239,239,.36);border-radius:999px;background:rgba(9,12,13,.08);color:#e8eeee;font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.06em;line-height:1;transition:color .2s,border-color .2s,background .2s}
.language-toggle svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.language-switch .language-toggle:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.8);color:#fff}
.language-switch .language-toggle:focus-visible{outline:1px solid #fff;outline-offset:4px}
.language-switch .language-toggle:active{background:rgba(255,255,255,.14)}
@media(max-width:560px){.language-switch .language-toggle{min-width:58px;min-height:32px;height:32px;padding:6px 10px;gap:5px;font-size:10px}.language-toggle svg{width:13px;height:13px}}
