/* V9: one type family, staged menus, restrained marks and a quiet artwork view. */
:root{--display:"Helvetica Neue","PingFang SC","Hiragino Sans GB",Arial,sans-serif}
body,button,input,textarea,select,h1,h2,h3,h4,.serif{font-family:var(--display)}
h1,h2,h3,h4{font-weight:400}
header .nav-panel,header.menu-open,body:has(#top) header.menu-open:not(.scrolled){background:var(--bg-warm);color:var(--ink)}
header.scrolled{background:var(--bg-warm)}
body:has(#top) header.menu-open:not(.scrolled) .header-logo{filter:none}
body:has(#top) header.menu-open:not(.scrolled) nav.desktop>a,body:has(#top) header.menu-open:not(.scrolled) nav.desktop>.nav-item>button,body:has(#top) header.menu-open:not(.scrolled) .saved-nav,body:has(#top) header.menu-open:not(.scrolled) .nav-en{color:var(--ink)}
header .nav-cn,header .nav-en,header .nav-panel a,header .nav-panel button{color:inherit}
header .nav-en{opacity:.7}
header .nav-panel,header .nav-item:hover .nav-panel,header .nav-item:focus-within .nav-panel{opacity:0;visibility:hidden;pointer-events:none;transform:none;box-shadow:none;border:0;transition:opacity .22s ease,visibility .22s ease}
header .nav-item.open .nav-panel{opacity:1;visibility:visible;pointer-events:auto;transform:none}
header .nav-panel-inner{max-width:none;margin:0;padding:34px 3.2vw 40px;display:grid;grid-template-columns:180px repeat(4,minmax(120px,1fr));gap:clamp(25px,4vw,76px);align-items:start}
.menu-intro,.menu-group,.menu-options{opacity:0;transform:translateY(10px);transition:opacity .32s ease,transform .38s var(--ease)}
.nav-item.open .menu-intro,.nav-item.open .menu-group,.nav-item.open .menu-options{opacity:1;transform:none}
.nav-item.open .menu-intro{transition-delay:.04s}.nav-item.open .menu-group:nth-child(2),.nav-item.open .menu-options{transition-delay:.09s}.nav-item.open .menu-group:nth-child(3){transition-delay:.14s}.nav-item.open .menu-group:nth-child(4){transition-delay:.19s}.nav-item.open .menu-group:nth-child(5){transition-delay:.24s}
.menu-heading{display:block;font-size:.76rem;letter-spacing:.04em;margin-bottom:16px}
.menu-intro>a,.menu-intro>button{display:block;font-size:.76rem;color:var(--ink);opacity:.7;line-height:1.8;text-align:left}
.menu-group>a,.menu-group>button{display:block;font-size:.89rem;line-height:1.8;text-align:left}
.nav-panel small{display:block;font-size:.57rem;letter-spacing:.09em;opacity:.7;margin-top:6px}
.nav-panel a:hover,.nav-panel button:hover{opacity:.65}
header .collection-menu{grid-template-columns:180px minmax(0,1fr)}
.menu-categories{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:22px}
.menu-categories button{padding:2px 0;line-height:1.8;font-size:.76rem;border-bottom:1px solid transparent}
.menu-categories button[aria-selected=true]{border-color:var(--ink)}
.menu-option-group{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 36px;padding-top:0}
.menu-option-group[hidden]{display:none}
.menu-option-group>a,.menu-option-group>button{text-align:left;font-size:.84rem;line-height:1.8}
.hero-controls{gap:24px}
.hero-controls button{font-size:.75rem;padding:0 0 4px;height:32px;min-width:25px;border-bottom:1px solid transparent}
.hero-controls button.active{border-color:#ffffffaa}
.about-image{aspect-ratio:3/4;overflow:hidden}
.about-image img{width:100%;height:100%;object-fit:cover}
#sub-brands{padding:84px 24px}
.brand-logo-strip{min-height:125px;gap:116px}
.brand-logo-link{width:112px;height:118px}
.brand-logo-link:nth-child(2){width:96px;height:96px}
.brand-logo-link img{filter:grayscale(1) contrast(100);mix-blend-mode:multiply}
.work-code{font-size:.6rem;color:var(--ink-lighter);letter-spacing:.04em;margin-bottom:4px}
.artwork-image-button>.artwork-main,.artwork-image-button>.artwork-detail{width:100%;height:100%}
.preview-photo{display:flex;align-items:center;justify-content:center;overflow:hidden}
.source-preview{width:100%;background-repeat:no-repeat;flex:none;max-width:100%}
.artwork-frame .artwork-detail.preview-photo{inset:0;opacity:0}
.artwork:hover .artwork-detail.preview-photo,.artwork:focus-within .artwork-detail.preview-photo{opacity:1}
.viewer-visual{padding:40px 34px;overflow:hidden}
.viewer-stage{overflow:hidden;min-width:0;min-height:0;width:100%;height:100%;display:block;scrollbar-width:none}
.viewer-stage::-webkit-scrollbar{display:none}
.visual-frame{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}
.viewer-stage .visual-photo{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
.viewer-stage .preview-photo .source-preview{width:100%;max-height:100%;background-color:transparent}
.viewer-info{scrollbar-width:none}
.viewer-info::-webkit-scrollbar{display:none}
.viewer-detail-figure .visual-frame{height:auto;aspect-ratio:1/1}
.viewer-detail-figure .visual-photo{width:100%;height:100%;object-fit:cover}
.viewer-detail-figure .from-main-photo{transform:scale(1.55);object-fit:cover}
.viewer-detail-figure.secondary .visual-photo{object-fit:contain}
.viewer-catalog{padding-top:35px}
#viewerCode{margin-top:10px;font-size:.64rem;letter-spacing:.06em;color:var(--ink-lighter)}
.artist-profile-link{font-size:.78rem;border-bottom:1px solid var(--ink);padding:0 0 4px;margin-top:14px;color:var(--ink)}
.artist-profile{position:fixed;inset:0;margin:auto;width:min(820px,calc(100vw - 48px));max-height:calc(100svh - 64px);border:0;padding:0;background:var(--bg-warm);color:var(--ink);overflow:auto}
.artist-profile::backdrop{background:#312a2170;backdrop-filter:blur(5px)}
.artist-profile .viewer-close{position:absolute;top:20px;right:22px}
.profile-body{padding:65px 72px}
.profile-body h2{font-size:2rem;margin-bottom:7px;letter-spacing:.04em}
#profileRole{font-size:.8rem;color:var(--ink-light);margin-bottom:30px}
#profileBiography p{font-size:.94rem;line-height:2;margin-bottom:16px}
#profileTimeline{margin:34px 0;border-top:1px solid var(--line)}
#profileTimeline>div{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);font-size:.82rem;line-height:1.9}
#profileTimeline dt{color:var(--ink-light)}
.profile-body>.btn{font-size:.8rem;background:var(--ink);color:var(--bg);padding:12px 25px}
@media(max-width:1000px){header .nav-panel{display:none}.profile-body{padding:60px 44px}}
@media(max-width:768px){.about-image{aspect-ratio:3/4}#sub-brands{padding:70px 24px}.brand-logo-strip{gap:66px;min-height:100px}.brand-logo-link{width:94px;height:100px}.brand-logo-link:nth-child(2){width:82px;height:82px}.hero-controls{gap:24px}.viewer-visual{height:58svh;min-height:310px;padding:48px 20px 24px}.viewer-stage{height:100%;min-height:0}.viewer-stage .visual-photo{max-height:100%}.viewer-info{padding:30px 28px 45px}.artist-profile{width:calc(100vw - 24px);max-height:calc(100svh - 32px)}.profile-body{padding:62px 28px 35px}.profile-body h2{font-size:1.7rem}#profileTimeline>div{grid-template-columns:90px 1fr;gap:12px}}
@media(max-width:390px){.brand-logo-strip{gap:50px}.brand-logo-link{width:86px}.brand-logo-link:nth-child(2){width:78px}.viewer-info{padding-inline:24px}}
@media(prefers-reduced-motion:reduce){.menu-intro,.menu-group,.menu-options,header .nav-panel{transition:none;transform:none}}
