:root{--ws-logo-header:42px;--ws-logo-mobile-header:38px;--ws-logo-footer:70px;--ws-logo-hero:76px;--ws-logo-mobile-hero:64px}
.ws-logo{display:block;height:auto;aspect-ratio:25/18;object-fit:contain;flex:0 0 auto}
.site-header .nav-brand,.menu-top .nav-brand{display:flex;align-items:center;gap:12px;max-width:none;flex:0 0 auto;text-decoration:none}
.site-header .nav-brand .ws-logo,.menu-top .nav-brand .ws-logo{width:var(--ws-logo-header)}
.site-header .nav-brand .ws-logo{filter:brightness(0);opacity:.83}
.nav-brand-label{font-family:"trajan-pro-3","WS Fangzheng Yaoti",serif;font-size:15px;line-height:1.35;letter-spacing:.035em}
.menu-top .nav-brand .ws-logo{filter:none}
.menu-top .nav-brand .nav-brand-label{font-size:16px}
.ws-hero-logo{width:var(--ws-logo-hero);margin:0 auto 20px}
.ws-hero-logo[hidden]{display:none}
.hero-title:has(.ws-hero-logo:not([hidden])){transform:translateY(-40%)}
.editor-header .brand{display:flex;align-items:center;gap:10px}
.editor-header .brand .ws-logo{width:36px;filter:brightness(0);opacity:.83}
@media(max-width:900px){
 .site-header .nav-brand .ws-logo,.menu-top .nav-brand .ws-logo{width:var(--ws-logo-mobile-header)}
 .site-header .nav-brand,.menu-top .nav-brand{gap:10px}
 .nav-brand-label{font-size:15px}
 .ws-hero-logo{width:var(--ws-logo-mobile-hero);margin-bottom:18px}
 .hero .hero-title:has(.ws-hero-logo:not([hidden])){transform:translateY(-50%)}
}
@media(max-height:500px) and (orientation:landscape){
 .ws-hero-logo{width:min(var(--ws-logo-mobile-hero),56px);margin-bottom:12px}
}

/* Header monogram alignment — October 2026 */
.site-header .nav-brand .ws-logo,.menu-top .nav-brand .ws-logo{width:calc(var(--ws-logo-header) * 1.55)}
.site-header .nav-brand-label,.menu-top .nav-brand-label{letter-spacing:.15em;white-space:nowrap}
@media(max-width:900px){.site-header .nav-brand .ws-logo,.menu-top .nav-brand .ws-logo{width:calc(var(--ws-logo-mobile-header) * 1.71)}.site-header .nav-brand,.menu-top .nav-brand{gap:12px}}

/* Mobile navigation: monogram only, without a frame around the brand link. */
@media(max-width:900px){
 .site-header .nav-brand-label,.menu-top .nav-brand-label{display:none}
 .site-header .nav-brand,.menu-top .nav-brand{gap:0}
 .menu-top .nav-brand,.menu-top .nav-brand:focus,.menu-top .nav-brand:focus-visible{border:0;outline:none;box-shadow:none}
 .menu-top .nav-brand:focus-visible .ws-logo{filter:drop-shadow(0 0 4px #ffffff70)}
}
