/* Full-bleed display uses the original files. The detail viewer shows the full frame. */
html:has(.hero-immersive),html:has(.essay-immersive){scroll-padding-top:0}
body:has(.hero-immersive) .chapter-nav{display:none}
body:has(.hero-immersive)>.masthead,body:has(.essay-immersive)>.masthead{position:absolute;inset:0 0 auto;background:transparent;color:#fff;border:0;z-index:30;text-shadow:0 1px 14px #0008}
body:has(.hero-immersive)>.masthead .secondary-link,body:has(.essay-immersive)>.masthead .secondary-link{color:inherit}
.hero.hero-immersive{display:block;position:relative;isolation:isolate;width:100%;height:100vh;height:100svh;min-height:540px;padding:0;color:#fff;background:#171717;overflow:clip}
.hero-immersive .hero-figure,.hero-immersive .hero-figure>.image-open{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0}
.hero-immersive .hero-figure .original-image{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:50% 37%;margin:0}
.hero-immersive .hero-figure .scroll-cover-image{object-position:var(--focus-x) var(--cover-focus-y,var(--focus-start))}
.hero-immersive.scroll-cover::after{content:none}
.hero-immersive .scroll-cover-stage::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0004,transparent 22%,transparent 60%,#0005)}
.hero-immersive::after,.essay-immersive .full-view-scene::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0005,transparent 22%,transparent 60%,#0006)}
.hero-immersive .hero-copy{position:absolute;z-index:2;inset:auto 4% 12%;padding:0;pointer-events:none}
.hero-immersive .hero-copy .eyebrow{color:#fff9;font-size:9px}
.hero-immersive .hero-copy h1{font:400 clamp(70px,10vw,160px)/.95 var(--book-english);letter-spacing:-.025em;margin:16px 0 18px;max-width:90%}
.hero-title-zh{font:12px/1.7 Arial,"PingFang TC",sans-serif;letter-spacing:.25em;color:#fffc}
.hero-immersive .text-link{color:#fff;border-color:#fff9;font-size:10px;pointer-events:auto;margin-top:28px}
.hero-index{position:absolute;z-index:2;inset:auto 4% 35px;display:flex;justify-content:space-between;font:9px/1.4 Arial,sans-serif;color:#fffb;pointer-events:none}
.hero-index a{pointer-events:auto;text-decoration:none;padding:10px;margin:-10px}
.hero-index-actions{display:flex;align-items:center;gap:28px;pointer-events:auto}
.hero-index-actions button{padding:8px 0;border:0;border-bottom:1px solid transparent;background:none;color:#fff9;font-size:9px;line-height:1.4;letter-spacing:.04em}
.hero-index-actions button[aria-pressed="true"]{color:#fff;border-bottom-color:#fffa}
.hero-index-actions button:disabled{opacity:.45;cursor:default}
.home-project-note{display:grid;grid-template-columns:1fr 1.5fr;gap:12%;padding:90px 8%;background:var(--paper)}
.home-project-note>div>.zh{margin-top:14px}
.home-project-note .project-description-bilingual{max-width:700px}
.home-project-note .project-description-bilingual>[lang=en]{font-size:clamp(24px,2.6vw,38px);line-height:1.5}
.home-project-note .text-link{margin-top:32px}
.home-secondary-series{position:relative;isolation:isolate;height:100vh;height:100svh;min-height:540px;width:100%;overflow:clip;background:#211013;color:#fff}
.home-series-background,.home-series-background img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 58%}
.home-secondary-series::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#0009,transparent 60%);z-index:1}
.home-series-overlay{position:absolute;bottom:10%;left:5%;right:5%;z-index:2;pointer-events:none}
.home-series-overlay h2{font:400 clamp(80px,12vw,190px)/1 var(--book-english);letter-spacing:-.03em;margin:18px 0}
.home-series-overlay>p:not(.eyebrow,.zh){font:25px/1.4 var(--book-english)}
.home-series-overlay .zh{color:#fffc;margin-top:10px}
.home-series-overlay .text-link{margin-top:26px;pointer-events:auto;border-color:#fffa;font-size:10px}
.essay-immersive .full-view-scene{height:100vh;height:100svh;min-height:430px;background:#161616;isolation:isolate;color:#fff;overflow:clip}
.essay-immersive .full-view-scene figure,.essay-immersive .full-view-scene .image-open,.essay-immersive .full-view-scene img{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0}
.essay-immersive .full-view-scene img{object-fit:cover;object-position:50% 50%}
.essay-immersive .full-view-scene img.framed-landscape{top:-25%;height:150%}
.essay-immersive .full-view-title{z-index:2;inset:auto 4% 13%;color:#fff}
.full-view-title h1{font-family:var(--book-english);letter-spacing:-.025em;max-width:13ch}
.full-view-title-zh{margin-top:18px!important;font:12px/1.7 Arial,"PingFang TC",sans-serif!important;letter-spacing:.18em!important}
.essay-immersive .full-view-title h1{font-size:clamp(86px,12vw,200px);max-width:85%;margin:14px 0 0}
.essay-immersive .full-view-scene figcaption{z-index:2;inset:auto 4% 32px;color:#fffc}
.essay-immersive .full-view-scene figcaption span[lang]{color:#fffb}
.essay-immersive .full-view-next{z-index:3;color:#fff}
.essay-immersive .full-view-rail{z-index:25;top:100px;right:4%;background:#1117;color:#fff;padding:8px 14px;--essay-accent:#fff}
.essay-immersive .full-view-rail .essay-current{color:#fff}
.essay-immersive .full-view-rail a{opacity:.65;min-width:24px;text-align:center}
.essay-immersive .full-view-rail a[aria-current]{opacity:1}
.full-view-note h2,.essay-next>div>a{font-family:var(--book-english)}
.essay-next>div{flex-wrap:wrap}
.hero-immersive .image-open:focus-visible,.essay-immersive .image-open:focus-visible{outline:2px solid #fff;outline-offset:-8px}
@media(max-width:760px){
 .hero.hero-immersive{min-height:540px}
 .hero-immersive .hero-copy{display:block;inset:auto 5% 13%;width:auto;max-width:90%}
 .hero-immersive .hero-copy h1{font-size:clamp(64px,14vw,105px);max-width:8ch;line-height:.94}
 .hero-immersive .hero-copy .hero-title-zh{display:block;max-width:28em;overflow-wrap:anywhere}
 .hero-immersive .hero-copy .text-link{display:inline-block;max-width:100%;white-space:normal}
 .hero-immersive .hero-figure .original-image{object-position:50% 40%}
 .hero-immersive .hero-figure .scroll-cover-image{object-position:var(--focus-x) var(--cover-focus-y,40%)}
 .hero-index-actions{gap:20px}
 .hero-index{inset:auto 5% max(30px,env(safe-area-inset-bottom))}
 .home-project-note{display:block;padding:50px 7%}
 .home-project-note>div+div{margin-top:35px}
 .home-series-overlay h2{font-size:clamp(72px,17vw,115px)}
 .essay-immersive .full-view-title{inset:auto 5% 14%}
 .essay-immersive .full-view-title h1{font-size:clamp(82px,19vw,140px)}
 .essay-immersive .full-view-rail{top:88px;right:5%;gap:15px}
 .essay-immersive .full-view-scene figcaption{inset:auto 5% max(28px,env(safe-area-inset-bottom))}
 .full-view-title h1{font-size:clamp(55px,13vw,90px)}
 .full-view-note>div>p:not(.eyebrow,.zh){font-size:23px}
 .essay-next>div>a{font-size:38px}
}
@media(prefers-reduced-motion:reduce){html:has(.hero-immersive){scroll-behavior:auto}}
