/* R5 scoped changes over the preserved R4. Logo dimensions stay in R4 CSS. */
html body[data-type-b] .page>header .brand::after{display:none!important}
html body[data-type-b] .page>header .brand-image{opacity:1!important;image-rendering:auto;transform:none;filter:none}
html body[data-type-b] .page>header .brand:hover .brand-image{filter:url('brand/logo-hover-r5.svg#r3-hover')}
/* Precisely 80% of the R4 role size, preserving font, weight and tracking. */
html body[data-type-b] .page-title{font-size:51.84px!important;text-align:left}
html body[data-type-b].home-page :is(#in-focus,#material) .section-head h2{font-size:21.6px!important}
html body[data-type-b] .r4-focus-heading>.article-category{font-size:15.12px!important}
html body[data-type-b] #contact .section-head{max-width:none;margin-left:0;margin-right:0;text-align:left}
html body[data-type-b] #contact .contact-editorial{margin-left:0;margin-right:0}
/* HOME: section label above the two columns, then title and photo align. */
html body[data-type-b].home-page #in-focus{grid-template-columns:minmax(0,var(--focus-copy-fr,55fr)) minmax(0,var(--focus-photo-fr,45fr));gap:24px}
html body[data-type-b].home-page #in-focus>.section-head{grid-column:1/-1;grid-row:1;margin:0}
html body[data-type-b].home-page #in-focus .featured-copy{grid-column:1;grid-row:2;display:flex;flex-direction:column;min-width:0;min-height:var(--focus-photo-height,0px)}
html body[data-type-b].home-page #in-focus .featured-title{margin:0 0 12px}
html body[data-type-b].home-page #in-focus .featured-subtitle{font-size:var(--b-body)!important;line-height:1.4!important;margin:0 0 20px}
html body[data-type-b].home-page #in-focus .in-focus-enter{margin-top:auto;padding-top:24px;align-self:flex-start}
html body[data-type-b].home-page #in-focus .featured-photo{grid-column:2;grid-row:2;margin:0}
html body[data-type-b].home-page #in-focus .featured-photo img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
/* IN FOCUS only: no continuous text controls. MATERIAL code and UI remain unchanged. */
html body[data-type-b] main.r4-split-focus>article.r4-focus-grid{grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:0 40px}
html body[data-type-b] .r4-focus-photo{position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;top:auto}
html body[data-type-b] .r4-focus-photo img{position:sticky;top:24px;width:100%;height:auto;object-fit:contain}
html body[data-type-b] .r4-focus-photo::after{content:"";display:block;border-bottom:1px solid var(--line);margin-top:32px}
html body[data-type-b] .r4-focus-reader .reader-tools{display:none!important}
/* Approved handwriting reduced in proportion; no glyph substitution. */
.r4-handwritten-statement{--ink-scale:.275}
.r5-handwritten-zh{--zh-scale:.56;gap:0;padding:8px 0}
.r5-zh-word{display:block;flex:none;width:calc(var(--word-width)*var(--zh-scale)*1px);height:calc(100px*var(--zh-scale))}
.r5-zh-word img{display:block;width:100%;height:100%;object-fit:contain}
html body[data-type-b].home-page .home-brand-introduction{border-bottom:1px solid var(--line)}
html body[data-type-b][data-about-page] main.standalone{max-width:none;width:100%}
html body[data-type-b][data-about-page] #about{border-top:0}
html body[data-type-b][data-about-page] #about .about-copy{padding:24px 0;border-top:1px solid var(--line)}
/* The source portrait stays whole; choose a column width only when readable text fits. */
html body[data-type-b] #sifan-shao .artist-composition{display:grid;grid-template-columns:minmax(0,var(--portrait-width,40%)) minmax(0,1fr);gap:0 48px;max-width:none;width:100%}
html body[data-type-b] #sifan-shao .artist-portrait{grid-column:1;grid-row:1;align-self:start;width:100%;margin:0;height:auto;overflow:visible}
html body[data-type-b] #sifan-shao .r5-profile{grid-column:2;grid-row:1;min-width:0}
html body[data-type-b] #sifan-shao .artist-heading{display:block;margin:0 0 24px}
html body[data-type-b] #sifan-shao .artist-bio{display:block}
html body[data-type-b] #sifan-shao .artist-bio p,html[lang=zh-CN] body[data-type-b] #sifan-shao .artist-bio p{font-size:22.5px!important;line-height:1.65!important;margin:0 0 28px;max-width:none}
html body[data-type-b] #sifan-shao .artist-bio p:last-child{margin-bottom:0}
/* Minimal PROJECTS listing. Credits remain in DOM and official data, hidden only here. */
html body[data-type-b][data-projects-index] :is(.production-credits,.production-intro,.project-detail-pending){display:none!important}
html body[data-type-b][data-projects-index] .production{grid-template-columns:minmax(0,var(--cover-width,280px)) minmax(0,1fr);column-gap:32px;align-items:start}
html body[data-type-b][data-projects-index] .project-cover{display:block;width:100%;height:auto;aspect-ratio:auto;background:none;padding:0;border:0;overflow:visible}
html body[data-type-b][data-projects-index] .project-cover img{position:static;display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
html body[data-type-b][data-projects-index] .production-copy{min-height:var(--cover-height,0px);height:auto}
html body[data-type-b][data-projects-index] .production-copy h3{margin:0 0 12px}
html body[data-type-b][data-projects-index] .production-quote{margin:8px 0 16px;max-width:880px}
html body[data-type-b][data-projects-index] .production-copy>.enter-link{margin-top:auto;padding-top:16px;align-self:flex-start}
.r5-pending-entry{font:inherit;border:0;background:none;color:inherit;cursor:pointer;padding-left:0;padding-right:0;text-align:left}
/* Inter-article links only; reader page controls stay separate. */
html body[data-type-b] .r5-note-navigation{display:flex;justify-content:space-between;align-items:center;gap:24px;width:100%}
html body[data-type-b] .r5-note-navigation a{font-weight:500!important;min-height:44px;display:inline-flex;align-items:center}
html body[data-type-b] .r5-note-navigation a[rel=next]{margin-left:auto;text-align:right}
@media(max-width:900px){
 html body[data-type-b] main.r4-split-focus>article.r4-focus-grid{grid-template-columns:minmax(0,1fr);gap:0}
 html body[data-type-b] .r4-focus-photo{position:static;display:block;align-self:start}
 html body[data-type-b] .r4-focus-photo img{position:static}
 html body[data-type-b] .r4-focus-photo::after{display:none}
 html body[data-type-b] #sifan-shao .artist-composition{grid-template-columns:minmax(0,1fr)}
 html body[data-type-b] #sifan-shao .artist-portrait{grid-column:1;grid-row:1;width:min(100%,320px);margin:0 0 28px}
 html body[data-type-b] #sifan-shao .r5-profile{grid-column:1;grid-row:2}
}
@media(max-width:800px){
 html body[data-type-b][data-projects-index] .production{grid-template-columns:minmax(0,1fr);gap:24px}
 html body[data-type-b][data-projects-index] .project-cover{width:min(100%,420px)}
 html body[data-type-b][data-projects-index] .production-copy{min-height:0}
}
@media(max-width:700px){
 html body[data-type-b] .page-title{font-size:38.88px!important}
 html body[data-type-b].home-page :is(#in-focus,#material) .section-head h2{font-size:17.28px!important}
 html body[data-type-b].home-page #in-focus{grid-template-columns:minmax(0,1fr)}
 html body[data-type-b].home-page #in-focus .featured-copy{grid-column:1;grid-row:2;min-height:0}
 html body[data-type-b].home-page #in-focus .featured-photo{grid-column:1;grid-row:3}
 .r4-handwritten-statement{--ink-scale:.26}
 .r5-handwritten-zh{--zh-scale:.56}
 html body[data-type-b] #sifan-shao .artist-bio p,html[lang=zh-CN] body[data-type-b] #sifan-shao .artist-bio p{font-size:21.6px!important;line-height:1.7!important}
}

/* Compact windows use a clear reading stack rather than forcing undersized side columns. */
@media(min-width:701px) and (max-width:1100px){
 html body[data-type-b].home-page #in-focus{grid-template-columns:minmax(0,1fr)}
 html body[data-type-b].home-page #in-focus .featured-copy{grid-column:1;grid-row:2;min-height:0}
 html body[data-type-b].home-page #in-focus .featured-photo{grid-column:1;grid-row:3;width:min(100%,760px)}
 html body[data-type-b] #sifan-shao .artist-composition{grid-template-columns:minmax(0,1fr)}
 html body[data-type-b] #sifan-shao .artist-portrait{grid-column:1;grid-row:1;width:min(100%,360px);margin:0 0 28px}
 html body[data-type-b] #sifan-shao .r5-profile{grid-column:1;grid-row:2}
 html body[data-type-b][data-projects-index] .production{grid-template-columns:minmax(0,1fr);gap:24px}
 html body[data-type-b][data-projects-index] .project-cover{width:min(100%,420px)}
 html body[data-type-b][data-projects-index] .production-copy{min-height:0}
}
html body[data-type-b].home-page #in-focus .featured-photo{aspect-ratio:auto;overflow:visible;background:none}
html body[data-type-b].home-page #in-focus .featured-title{font-size:35.1px!important;line-height:1.25!important;margin-bottom:8px}
html body[data-type-b].home-page #in-focus .featured-subtitle{font-size:22.5px!important;line-height:1.4!important;margin-bottom:12px}
html body[data-type-b].home-page #in-focus .approved-description p{font-size:22.5px!important;line-height:1.65!important;margin-bottom:8px}
html body[data-type-b].home-page #in-focus .in-focus-enter{padding-top:16px}
@media(min-width:1101px) and (max-width:1360px){
 html body[data-type-b] #sifan-shao .artist-composition{grid-template-columns:minmax(0,1fr)}
 html body[data-type-b] #sifan-shao .artist-portrait{grid-column:1;grid-row:1;width:min(100%,360px);margin:0 0 28px}
 html body[data-type-b] #sifan-shao .r5-profile{grid-column:1;grid-row:2}
}
@media(max-width:700px){
 html body[data-type-b].home-page #in-focus .approved-description p,html body[data-type-b].home-page #in-focus .featured-subtitle{font-size:21.6px!important}
}
@media(min-width:1101px) and (max-width:1360px){
 html body[data-type-b].home-page #in-focus .approved-description p{font-size:21.6px!important;line-height:1.6!important;margin-bottom:6px}
 html body[data-type-b].home-page #in-focus .featured-subtitle{font-size:21.6px!important;margin-bottom:8px}
 html body[data-type-b].home-page #in-focus .in-focus-enter{padding-top:8px}
}
html body[data-type-b] #sifan-shao .artist-composition{max-width:1328px}
html body[data-type-b] main.r4-split-focus .reader-page.article-body,html body[data-type-b] main.r4-split-focus .reader-measure.article-body{max-width:880px}
html body[data-type-b] main button.enter-link{display:inline-flex;align-items:center;gap:.55em;min-height:44px;border:0;background:none;font-family:var(--brand-text)!important;font-size:var(--b-ui)!important;font-weight:500!important;letter-spacing:.08em!important;line-height:1.5!important;color:var(--ink);text-decoration:none}
html body[data-type-b] main button.enter-link:hover{color:var(--accent)}
html body[data-type-b] main button.enter-link:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
