@import url('base.css');
@font-face{font-family:NotoSerifHK;src:url('assets/fonts/noto-serif-hk-subset.woff2') format('woff2');font-weight:300 600;font-style:normal;font-display:swap}
:root{--tc-serif:NotoSerifHK,'Songti TC','Noto Serif TC',serif;--body:InterTight,-apple-system,BlinkMacSystemFont,'PingFang HK','PingFang TC','Microsoft JhengHei',sans-serif}
body{font-family:var(--body)}
.tc-serif,.case-title,.case-note blockquote,.case-block h4,.keyframe h5,.statement-signature>span{font-family:var(--tc-serif);font-weight:300}
:lang(en) .tc-serif,:lang(en) .case-title,:lang(en) .case-note blockquote,:lang(en) .case-block h4,:lang(en) .keyframe h5{font-family:var(--display)}
.identity-name>span{font-family:var(--tc-serif);font-weight:600;letter-spacing:.17em}
.hero-type-grid{padding:28px 0 34px;grid-template-columns:9fr 2.6fr}
.hero-side>p{font-family:var(--tc-serif);font-weight:300;font-size:clamp(14px,1.45vw,20px);line-height:1.9;letter-spacing:.045em}
:lang(en) .hero-side>p{font-family:var(--display);font-size:15px;line-height:1.65}
.hero-still-button>img{height:340px;object-position:50% 64%}
.hero-baseline{padding-bottom:26px}
.generative-section{padding:80px 0 82px}
.section-title-grid h2{line-height:1.4;gap:28px}
.section-title-grid h2 .tc-serif{font-size:.78em;letter-spacing:.02em}
.section-title-grid>p{font-size:13px;line-height:2.05;max-width:360px}
.duology-grid{display:grid;gap:74px;margin-top:15px}
.duology-work{border-top:1px solid var(--line);padding-top:20px}
.duology-register{display:flex;align-items:center;justify-content:space-between;color:var(--muted);gap:20px;padding-bottom:14px;font-size:9px}
.duology-register .source-badge{font-size:8px}
.duology-frame{aspect-ratio:2.02;position:relative;width:100%;display:block;overflow:hidden;cursor:crosshair;background:var(--surface)}
.duology-frame>img,.duology-frame>video{position:absolute;width:100%;height:100%;object-fit:cover;transition:transform .7s ease,opacity .35s;inset:0}
.duology-frame>video{opacity:0}
.duology-frame.is-previewing>video{opacity:1}
.duology-frame:hover>img,.duology-frame:hover>video{transform:scale(1.02)}
.duology-frame:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 60%,#0008);pointer-events:none}
.cinema-invite{position:absolute;right:24px;bottom:23px;display:flex;align-items:center;gap:18px;z-index:2;font:9px var(--mono);letter-spacing:.05em}
.cinema-invite b{display:grid;place-items:center;border:1px solid #ffffff60;border-radius:50%;width:49px;height:49px;font-size:17px;font-weight:400;transition:background .2s,color .2s}
.duology-frame:hover .cinema-invite b{background:var(--white);color:var(--bg)}
.duology-caption{display:grid;grid-template-columns:1.5fr 1fr;gap:8%;padding:27px 0 25px}
.duology-caption h3{font-size:clamp(30px,3.3vw,52px);line-height:1.55;font-family:var(--tc-serif);font-weight:300;letter-spacing:.025em}
:lang(en) .duology-caption h3{font-family:var(--display);line-height:1.15;font-weight:400;letter-spacing:-.02em}
.duology-caption h3 button{text-align:left}
.duology-caption .english-subtitle{display:block;font:9px var(--mono);letter-spacing:.04em;color:var(--muted);margin-top:12px}
.duology-logline{font-size:14px;line-height:2;color:#b6b6b1;padding-top:8px}
.duology-credit{display:flex;gap:24px;flex-wrap:wrap;color:var(--muted);font-size:8px;margin-top:19px}
.case-study{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.case-study>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:25px;padding:21px 0;cursor:pointer;font-size:10px;letter-spacing:.04em}
.case-study>summary::-webkit-details-marker{display:none}
.case-study>summary:focus-visible{outline:1px solid var(--white);outline-offset:7px}
.case-study>summary>span:first-child{display:flex;gap:20px;align-items:center}
.case-study>summary .summary-number{color:var(--muted)}
.case-plus{font:25px var(--display);font-weight:200;transition:transform .25s}
.case-study[open] .case-plus{transform:rotate(45deg)}
.case-body{padding:22px 0 30px}
.case-note{display:grid;grid-template-columns:1fr 3fr;gap:7%;padding:5px 0 39px}
.case-note .micro{color:var(--muted);padding-top:9px}
.case-note blockquote{font-size:clamp(24px,2.7vw,38px);line-height:1.7;letter-spacing:.02em;margin:0;max-width:33ch}
:lang(en) .case-note blockquote{line-height:1.4;letter-spacing:-.02em;max-width:35ch}
.case-block{display:grid;grid-template-columns:1fr 3fr;gap:7%;padding:28px 0;border-top:1px solid var(--line)}
.case-block-label .micro{color:var(--muted);font-size:8px;display:block;margin-bottom:8px}
.case-block h4{font-size:22px;letter-spacing:.035em;line-height:1.7}
.case-block-copy{font-size:14px;line-height:2.15;color:#bababa;max-width:900px}
.case-block-copy>p+p{margin-top:18px}
.workflow-row{display:grid;grid-template-columns:24px 1fr;gap:15px;padding-bottom:22px}
.workflow-row:last-child{padding-bottom:0}
.workflow-row>span{font:8px var(--mono);color:var(--muted);padding-top:6px}
.workflow-row h5{font-size:13px;font-weight:500;color:var(--white);margin:0 0 9px;letter-spacing:.05em}
.workflow-row p{font-size:13px;line-height:2.1}
.comparison-wrap{margin-top:28px}
.comparison-wrap .split-view{max-width:980px;margin:auto}
.comparison-caption{display:flex;align-items:flex-start;gap:8%;justify-content:space-between;margin-top:16px}
.comparison-caption>p{font-size:11px;line-height:2;color:var(--muted);max-width:70ch}
.comparison-caption .micro{font-size:7px;color:var(--muted);white-space:nowrap}
.keyframes-header{display:flex;justify-content:space-between;align-items:center;gap:25px;border-top:1px solid var(--line);padding:30px 0 24px}
.keyframes-header h4{font:23px var(--tc-serif);font-weight:300;margin:0}
.keyframes-header .micro{font-size:8px;color:var(--muted)}
.keyframe-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px}
.keyframe button{display:block;width:100%;overflow:hidden;cursor:crosshair;position:relative;background:var(--surface)}
.keyframe img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .5s}
.keyframe button:hover img{transform:scale(1.02)}
.keyframe button:after{content:'+';position:absolute;right:12px;bottom:8px;color:#fff;font:24px var(--display);text-shadow:0 1px 8px #000}
.keyframe .micro{display:flex;justify-content:space-between;color:var(--muted);font-size:7px;margin:13px 0 8px}
.keyframe h5{font-size:16px;line-height:1.7;letter-spacing:.02em;margin:0 0 8px}
.keyframe figcaption>p{font-size:11px;line-height:1.95;color:var(--muted)}
.motion-section{padding:0 0 84px}
.motion-grid{margin-top:20px;gap:40px 30px}
.motion-grid .film-card:nth-child(n){grid-column:span 6}
.motion-grid .film-card:nth-child(n) .film-frame{aspect-ratio:16/9}
.motion-grid .film-card h3{font-family:var(--tc-serif);font-size:28px;font-weight:300;line-height:1.5}
:lang(en) .motion-grid .film-card h3{font-family:var(--display);font-weight:400}
.motion-grid .film-card-role{font-size:9px;line-height:1.8}
.motion-grid .film-card-specs{font-size:8px}
.film-action-note{font:8px var(--mono);color:#aaa;margin-top:10px;letter-spacing:.04em}
.photography-section{padding-bottom:90px}
.gallery-spread{grid-template-columns:1fr 1.12fr;align-items:center;padding:0 3%;gap:8%;margin-bottom:45px}
.gallery-spread .photograph:nth-child(1){width:100%}
.gallery-spread .photograph:nth-child(2){width:80%;margin-left:auto}
.gallery-spread .photograph:nth-child(2) .photo-image{aspect-ratio:auto}
.gallery-spread .photograph:nth-child(2) img{height:auto;object-fit:contain}
.photo-caption{line-height:1.9}
.gallery-end{color:var(--muted)}
.statement-grid{padding-top:38px}
.statement-body p{font-size:15px;line-height:2.3;letter-spacing:.035em}
.statement-signature{font-size:17px}
.statement-signature>span{font-size:17px;margin-top:8px}
.selected-info dd{font-size:12px;line-height:2}
.contact-title>span:first-child{font-family:var(--tc-serif);font-size:clamp(30px,4.5vw,64px);line-height:1.65;font-weight:300}
:lang(en) .contact-title>span:first-child{font-family:var(--display);line-height:1.2}
.cinema-source-note{font-size:11px;line-height:1.8;color:var(--muted);padding:10px 0 0}
.cinema-source-note[hidden]{display:none}
.darkroom-caption h2{font-family:var(--tc-serif);font-weight:300;line-height:1.7}
:lang(en) .darkroom-caption h2{font-family:var(--display)}
.darkroom-caption>p{font-size:12px;line-height:1.9;max-width:520px}
@media(min-width:1800px){.hero-still-button>img{height:430px}}
@media(max-width:1100px){.duology-caption{gap:5%}.case-note,.case-block{grid-template-columns:1fr 2.8fr;gap:6%}.keyframe-grid{gap:14px}.case-note blockquote{font-size:29px}.hero-side>p{font-size:15px}.primary-nav{gap:17px}}
@media(max-width:760px){
 .hero-type-grid{padding:19px 0 25px}.hero-side{margin-top:22px;grid-template-columns:12px 1fr auto;gap:12px}.hero-side>p{font-size:14px;line-height:1.9;letter-spacing:.04em}:lang(en) .hero-side>p{font-size:12px}.hero-still-button>img{height:300px;object-position:55% 65%}.hero-baseline{padding-bottom:17px}
 .generative-section{padding-top:54px;padding-bottom:55px}.section-title-grid h2{font-size:42px;gap:18px;flex-wrap:wrap}.section-title-grid>p{font-size:12px;line-height:2;max-width:100%}.duology-grid{gap:45px;margin-top:3px}.duology-work{padding-top:12px}.duology-register{font-size:7px;gap:15px;padding-bottom:10px}.duology-register .source-badge{font-size:6px}.duology-frame{aspect-ratio:1.53}.cinema-invite{right:14px;bottom:14px;gap:13px;font-size:7px}.cinema-invite b{width:38px;height:38px;font-size:14px}.duology-caption{grid-template-columns:1fr;gap:15px;padding:20px 0}.duology-caption h3{font-size:32px}.duology-caption .english-subtitle{font-size:8px;margin-top:8px}.duology-logline{font-size:13px;line-height:2.05;padding-top:0}.duology-credit{font-size:7px;gap:8px 17px;margin-top:13px}.case-study>summary{font-size:8px;padding:18px 0;gap:15px}.case-study>summary>span:first-child{gap:13px}.case-plus{font-size:21px}.case-body{padding:15px 0 24px}.case-note{display:block;padding:0 0 26px}.case-note .micro{font-size:7px;margin-bottom:15px}.case-note blockquote{font-size:26px;line-height:1.8;max-width:none}.case-block{grid-template-columns:1fr;gap:16px;padding:23px 0}.case-block-label{display:flex;gap:17px;align-items:baseline}.case-block-label .micro{font-size:6px;margin-bottom:0;min-width:29px}.case-block h4{font-size:21px;line-height:1.6}.case-block-copy{font-size:13px;line-height:2.1}.workflow-row{grid-template-columns:20px 1fr;gap:9px;padding-bottom:20px}.workflow-row h5{font-size:12px}.workflow-row p{font-size:12px;line-height:2.1}.comparison-wrap{margin-top:17px}.comparison-caption{display:block;margin-top:12px}.comparison-caption>p{font-size:10px;line-height:2}.comparison-caption .micro{display:block;margin-top:10px;font-size:6px}.keyframes-header{padding:23px 0 18px;align-items:baseline;gap:15px}.keyframes-header h4{font-size:20px}.keyframes-header .micro{font-size:6px;max-width:45%;text-align:right}.keyframe-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 13px}.keyframe .micro{font-size:6px;margin-top:9px}.keyframe h5{font-size:14px;line-height:1.8}.keyframe figcaption>p{font-size:10px;line-height:1.95}.keyframe button:after{font-size:20px;right:8px;bottom:5px}
 .motion-section{padding-bottom:60px}.motion-grid{gap:28px 15px;margin-top:7px}.motion-grid .film-card:nth-child(n){grid-column:span 12}.motion-grid .film-card h3{font-size:26px}.motion-grid .film-card-role{font-size:8px}.motion-grid .film-card-specs{font-size:7px}.film-action-note{font-size:7px}.photography-section{padding-bottom:62px}.gallery-spread{padding:0;gap:20px;margin-bottom:25px;align-items:start}.gallery-spread .photograph:nth-child(2){width:100%;margin-top:50px}.statement-body p{font-size:13px;line-height:2.25;letter-spacing:.025em}.selected-info dd{font-size:11px}.statement-signature>span{font-size:15px}.contact-title>span:first-child{font-size:33px;line-height:1.8}.darkroom-caption>p{font-size:10px}.darkroom-caption h2{font-size:18px}
}
@media(prefers-reduced-motion:reduce){.duology-frame>img,.duology-frame>video,.keyframe img{transition:none;transform:none!important}}
.hero-carousel{--hc-height:340px;position:relative;border:1px solid rgba(255,255,255,.1);background:#080808;min-width:0}
.hero-carousel .hc-viewport{position:relative;overflow:hidden;height:auto;aspect-ratio:1.65289;max-height:70svh;margin:8px 8px 0;background:#080808}
.hero-carousel .hc-track{display:flex;width:100%;height:100%;transition:transform .65s cubic-bezier(.22,.61,.36,1);will-change:transform}
.hero-carousel .hc-track.hc-no-transition{transition:none!important}
.hero-carousel .hc-slide{flex:0 0 100%;width:100%;height:100%;margin:0;min-width:0;overflow:hidden}
.hero-carousel .hc-open{position:relative;display:block;width:100%;height:100%;padding:0;border:0;border-radius:0;background:#080808;color:#f4f4f0;cursor:crosshair}
.hero-carousel .hc-image{display:block;width:100%;height:100%;object-fit:contain;object-position:center;max-width:none;user-select:none}
.hero-carousel .hc-open:hover .hc-image{scale:1;transform:none}
.hero-carousel .hc-open:focus-visible{outline:1px solid #f4f4f0;outline-offset:-5px}
.hero-carousel .hc-open-mark{position:absolute;right:23px;bottom:18px;font-size:23px;line-height:1;text-shadow:0 1px 8px #000}
.hero-carousel .hc-cross{position:absolute;z-index:2;color:rgba(244,244,240,.62);font:13px monospace;pointer-events:none;line-height:1}
.hero-carousel .hc-cross-tl{left:14px;top:13px}.hero-carousel .hc-cross-tr{right:14px;top:13px}.hero-carousel .hc-cross-bl{left:14px;bottom:13px}.hero-carousel .hc-cross-br{right:14px;bottom:13px}
.hero-carousel .hc-footer{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:22px;min-height:76px;padding:13px 16px;border-top:1px solid rgba(255,255,255,.1)}
.hero-carousel .hc-register,.hero-carousel .hc-counter{white-space:nowrap;color:#888;font-size:9px;letter-spacing:.06em}
.hero-carousel .hc-caption-wrap{display:flex;flex-direction:column;gap:5px;min-width:0}
.hero-carousel .hc-tag{font-size:8px;letter-spacing:.09em;color:#888}
.hero-carousel .hc-caption{font-size:11px;line-height:1.6;letter-spacing:.05em;color:#f4f4f0}
.hero-carousel .hc-controls{display:flex;align-items:stretch;gap:0}
.hero-carousel .hc-controls button{appearance:none;border:1px solid rgba(255,255,255,.14);border-radius:0;background:transparent;color:#f4f4f0;min-height:40px;cursor:pointer;transition:background .2s ease}
.hero-carousel .hc-controls button+button{border-left:0}
.hero-carousel .hc-nav{width:42px;padding:0;font-size:17px;line-height:1}
.hero-carousel .hc-pause{min-width:66px;padding:0 12px;font-size:8px;letter-spacing:.07em}
.hero-carousel .hc-controls button:hover{background:#121212}.hero-carousel .hc-controls button:focus-visible{outline:1px solid #f4f4f0;outline-offset:3px;position:relative;z-index:1}.hero-carousel .hc-controls button:disabled{opacity:.35;cursor:default}
.hero-carousel .hc-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
@media(min-width:1800px){.hero-carousel{--hc-height:430px}}
@media(max-width:760px){.hero-carousel{--hc-height:300px}.hero-carousel .hc-viewport{margin:6px 6px 0}.hero-carousel .hc-footer{grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:13px 11px}.hero-carousel .hc-register{grid-column:1}.hero-carousel .hc-counter{grid-column:2;grid-row:1;text-align:right}.hero-carousel .hc-caption-wrap{grid-column:1;grid-row:2}.hero-carousel .hc-caption{font-size:10px;letter-spacing:.025em;line-height:1.7}.hero-carousel .hc-controls{grid-column:2;grid-row:2;align-self:end}.hero-carousel .hc-nav{width:36px}.hero-carousel .hc-pause{min-width:48px;padding:0 8px;font-size:7px}.hero-carousel .hc-controls button{min-height:40px}.hero-carousel .hc-tag{font-size:7px}.hero-carousel .hc-open-mark{right:21px;bottom:16px}}
@media(prefers-reduced-motion:reduce){.hero-carousel .hc-track,.hero-carousel .hc-image{transition:none!important}}

@font-face{font-family:NotoSerifHK;src:url('assets/fonts/noto-serif-hk-story-supplement.woff2') format('woff2');font-weight:300 600;font-style:normal;font-display:swap;unicode-range:U+00B7, U+00D7, U+300A-300D, U+4E03, U+4E32, U+4E92, U+4EA1, U+4ED6, U+50B7, U+50F9, U+5177, U+517C, U+521D, U+5229, U+525B, U+5283, U+52DD, U+52E2, U+5305, U+5341, U+5371, U+53F8, U+542B, U+54AC, U+55AE, U+5831, U+589C, U+58DE, U+597D, U+5B87, U+5C16, U+5E06, U+5EA7, U+5F37, U+5F85, U+5F88, U+5FC5, U+6052, U+622A, U+624D, U+62BD, U+62D2, U+6307, U+6309, U+6372, U+638C, U+63A0, U+63A2, U+63C0, U+63E1, U+63ED, U+63F4, U+6469, U+653B, U+6557-6558, U+6578, U+6599, U+665A, U+66B4, U+66C9, U+6838-6839, U+68AF, U+68C4, U+695A, U+6A23, U+6A4B, U+6A6B, U+6ABB, U+6B4C, U+6C42, U+6CBB, U+6E05, U+6ED1, U+707D, U+7126, U+7184, U+7272, U+72A7, U+74B0, U+75C5, U+7642, U+7652, U+767B, U+76D4, U+779E, U+7814, U+78BC, U+7981, U+79D8, U+7A0B, U+7A31, U+7A3F, U+7A4D, U+7A76, U+7ADF, U+7B52, U+7C21, U+7C3D, U+7C73, U+7D2F, U+7D42, U+7D55, U+7D6E, U+7D81, U+7DAD, U+7E5E, U+7FA9, U+8001, U+8077, U+80AF, U+8108, U+817F, U+82B1, U+85E5, U+8607, U+865F, U+8840, U+888B, U+8A02, U+8A08, U+8A0A, U+8B77, U+8D99, U+8E64, U+8ECC, U+8EDF, U+8F15, U+8FFD, U+9001, U+9003, U+9014, U+901A, U+91AB, U+91DD, U+92B3, U+92FC, U+93C8, U+9673, U+96E3, U+9732, U+9808, U+984D, U+9ED8, U+FF08-FF09;}


/* Local review edition: field notes, education, and a longer contact roll. */
.archive-introduction{display:grid;grid-template-columns:1fr 3fr;gap:7%;border-top:1px solid var(--line);padding:26px 0 46px;margin-top:18px}
.archive-introduction>.micro{font-size:8px;color:var(--muted);padding-top:8px}
.archive-introduction h3{font:300 clamp(22px,2.5vw,33px)/1.7 var(--tc-serif);letter-spacing:.03em;margin:0 0 15px}
:lang(en) .archive-introduction h3{font-family:var(--display);letter-spacing:0}
.archive-introduction p{font-size:13px;line-height:2.1;color:#aaa;max-width:75ch;margin:0}
.film-card-summary{font-size:12px;line-height:1.95;max-width:55ch;color:#a4a4a0;padding:9px 0 3px}
.film-card-read{font:8px var(--mono);letter-spacing:.05em;color:#aaa;border:0;border-bottom:1px solid #ffffff36;background:none;padding:10px 0 7px;margin-top:7px}
.photo-roll{margin:30px 0 54px;min-width:0;max-width:100%;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0 17px}
.photo-roll-heading{display:flex;gap:24px;align-items:flex-end;justify-content:space-between;margin-bottom:24px}
.photo-roll-heading .micro{font-size:8px;color:var(--muted)}
.photo-roll-heading h3{font:300 25px/1.7 var(--tc-serif);margin:12px 0 0;letter-spacing:.03em}
:lang(en) .photo-roll-heading h3{font-family:var(--display);letter-spacing:0}
.photo-roll-controls{display:flex;align-items:stretch;gap:0}
.photo-roll-controls button{border:1px solid var(--line);background:transparent;color:var(--white);min-width:42px;min-height:40px;padding:10px;font-size:16px}
.photo-roll-controls button+button{border-left:0}
.photo-roll-controls [data-roll-play]{font:8px var(--mono);min-width:82px}
.photo-roll-controls button:hover{background:#1b1b1b}
.photo-roll-track{display:flex;gap:20px;max-width:100%;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#444 transparent;padding:0 0 13px;overscroll-behavior-x:contain}
.roll-frame{flex:0 0 auto;width:calc(var(--roll-image-height,280px)*var(--photo-ratio));margin:0;scroll-snap-align:start}
.roll-frame button{display:block;width:100%;height:auto;position:relative;padding:0;background:transparent;cursor:crosshair}
.roll-frame img{display:block;width:100%;height:auto;object-fit:contain}
.roll-frame button:hover img{transform:none}
.roll-frame button>span{position:absolute;right:15px;bottom:13px;color:white;text-shadow:0 1px 6px #000}
.roll-frame figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:13px;font-size:8px;color:#888;line-height:1.7}
.photo-roll-hint{font-size:7px;color:#666;margin:12px 0 0;line-height:1.9}
.education-story{display:grid;grid-template-columns:1fr 2fr;gap:8%;border-top:1px solid var(--line);padding:42px 0 48px}
.education-story>.micro,.education-story>div>.micro{font-size:8px;color:#777;line-height:1.8}
.education-story h3{font:300 clamp(25px,2.8vw,40px)/1.6 var(--tc-serif);margin:20px 0 16px;letter-spacing:.025em}
:lang(en) .education-story h3{font:400 clamp(24px,2.3vw,34px)/1.35 var(--display);letter-spacing:-.02em}
.education-major{display:block;font-size:10px;line-height:1.9;color:#888;max-width:33ch}
.education-story>div>p{font-size:14px;line-height:2.1;color:#aaa;margin:0}
.practice-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:32px}
.practice-notes article{border-top:1px solid var(--line);padding-top:20px}
.practice-notes .micro{color:#777;font-size:7px}
.practice-notes h4{font:300 18px/1.7 var(--tc-serif);letter-spacing:.02em;margin:12px 0 11px}
:lang(en) .practice-notes h4{font-family:var(--display);font-size:17px;letter-spacing:0}
.practice-notes p{font-size:11px;line-height:2;color:#888;margin:0}
.production-teaser{margin:12px 0 25px;border-top:1px solid var(--line);padding-top:20px}
.production-teaser-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px}
.production-teaser-heading .micro{font-size:8px;color:#888}
.production-teaser-heading button{font-size:10px;background:none;color:#bbb;padding:4px 0;border-bottom:1px solid #555}
.production-teaser-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.production-teaser-grid button{display:block;width:100%;padding:0;background:#121212;overflow:hidden;cursor:crosshair}
.production-teaser-grid img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;transition:transform .5s}
.production-teaser-grid button:hover img{transform:scale(1.02)}
.production-teaser-grid span{font-size:8px;color:#777;display:block;padding-top:9px;line-height:1.8}
@media(max-width:760px){
 .archive-introduction{grid-template-columns:1fr;gap:15px;padding:22px 0 32px}
 .archive-introduction h3{font-size:22px}.archive-introduction p{font-size:12px}
 .photo-roll{margin-top:22px}.photo-roll-heading{display:block}.photo-roll-heading h3{font-size:22px}.photo-roll-controls{margin-top:18px;width:max-content}
 .photo-roll{--roll-image-height:235px}
 .education-story{grid-template-columns:1fr;gap:26px;padding:30px 0}
 .education-story h3{font-size:30px;margin:14px 0}.education-story>div>p{font-size:13px}
 .practice-notes{grid-template-columns:1fr;gap:20px}.practice-notes article{display:grid;grid-template-columns:1fr 2fr;column-gap:20px;padding-top:16px}.practice-notes .micro{grid-column:1/-1}.practice-notes h4{margin:10px 0 0}.practice-notes p{margin-top:10px}
 .production-teaser-grid{gap:8px}.production-teaser-heading{align-items:flex-start}.production-teaser-heading button{font-size:9px}.production-teaser-grid span{font-size:7px}
}
@media(prefers-reduced-motion:reduce){.roll-frame img,.production-teaser-grid img{transition:none}}

/* Add after existing HK serif faces; generated locally, no text upload. */
@font-face{font-family:NotoSerifHK;src:url('assets/fonts/noto-serif-hk-local-review-supplement.woff2') format('woff2');font-weight:300 600;font-style:normal;font-display:swap;unicode-range:U+00BB, U+00BF, U+00EF, U+30FB, U+4E94, U+4EA6, U+4EFD, U+4F01, U+4FEF, U+505A, U+5100, U+51CD, U+52DE, U+5377, U+539A, U+53F3, U+5496, U+54AA, U+5561, U+5584, U+5617, U+5750, U+57F9, U+5802, U+589E, U+592B, U+5C4B, U+5C71, U+5CF0, U+5DE6, U+5E0C, U+5EAD, U+5F15, U+5FAA, U+601D, U+60E1, U+61F8, U+6232, U+6258, U+6276, U+6280, U+6295, U+62AC, U+62DB, U+653F, U+659C, U+65C5, U+6649, U+66DD, U+66F2, U+66F8, U+6728, U+687F, U+6E96, U+724C, U+7522, U+75C7, U+76E3-76E4, U+77B0, U+7A69, U+7B56, U+7C43, U+7D0D, U+7D2B, U+7DB1, U+7DE3, U+7DF4, U+7E31, U+7E9C, U+7F3A, U+8046, U+805E, U+8173, U+8209, U+8235, U+8237, U+8457, U+85AA, U+8853, U+888D, U+8A13, U+8AB2, U+8B70, U+8CBC, U+8CC7, U+8CF4, U+8F38, U+9069, U+906D, U+916C, U+9192, U+9670, U+9677, U+96EA, U+971E;}


/* Film review: preserve photographic frames and describe the next stage of practice. */
.hero-carousel .hc-caption{min-height:3.2em}
.photo-image:hover img{transform:none}
.photo-caption small{display:block;font-size:6px;letter-spacing:.04em;color:#b2b2ad;margin-top:5px;line-height:1.7}
.analog-intro,.postgraduate-story{display:grid;grid-template-columns:1fr 2fr;gap:8%;border-top:1px solid var(--line);padding:37px 0 42px}
.analog-intro>div>.micro,.postgraduate-story>div>.micro{font-size:8px;color:#888;line-height:1.9}
.analog-intro h3,.postgraduate-story h3{font:300 clamp(25px,2.5vw,36px)/1.75 var(--tc-serif);letter-spacing:.025em;margin:18px 0 17px}
:lang(en) .analog-intro h3,:lang(en) .postgraduate-story h3{font-family:var(--display);line-height:1.3;letter-spacing:-.02em;font-size:clamp(25px,2.5vw,36px)}
.analog-intro p,.postgraduate-copy>p{font-size:13px;color:#aaa;line-height:2.15;margin:0;max-width:74ch}
.analog-intro .analog-count{font-size:8px}
.analog-view-link{color:#ccc;border-bottom:1px solid #777;margin-top:23px;padding-bottom:8px;font-size:9px;letter-spacing:.03em}
.postgraduate-story{padding-top:40px;margin-top:5px}
.postgraduate-copy>p+p{margin-top:23px}
.research-notes{margin-top:31px}
.research-notes>.micro{display:block;font-size:8px;color:#777;margin-bottom:17px}
.research-notes details{border-top:1px solid var(--line)}
.research-notes details:last-child{border-bottom:1px solid var(--line)}
.research-notes summary{display:grid;grid-template-columns:20px 1fr 15px;gap:14px;align-items:baseline;list-style:none;cursor:pointer;padding:18px 0}
.research-notes summary::-webkit-details-marker{display:none}
.research-notes summary>.micro{font-size:8px;color:#777}
.research-notes h4{font:300 18px/1.8 var(--tc-serif);margin:0;letter-spacing:.025em}
:lang(en) .research-notes h4{font-family:var(--display);font-size:17px;letter-spacing:0}
.research-notes summary>span:last-child{font-size:19px;font-weight:300;color:#aaa;text-align:right}
.research-notes details[open] summary>span:last-child{transform:rotate(45deg)}
.research-notes details>p{font-size:12px;line-height:2.1;color:#999;margin:0 0 23px;padding-left:34px}
.photo-tools .filters{flex-wrap:wrap;row-gap:5px}
.photo-tools .filters [data-photo-filter="film"]{color:#ddd}
.photo-tools .filters [data-photo-filter="film"].active{color:white}
@media(max-width:760px){
 .hero-carousel .hc-caption{min-height:4.8em}
 .analog-intro,.postgraduate-story{grid-template-columns:1fr;gap:22px;padding:28px 0 32px}
 .analog-intro h3,.postgraduate-story h3{font-size:26px;margin:13px 0}
 .analog-intro p,.postgraduate-copy>p{font-size:12px;line-height:2.15}
 .research-notes h4{font-size:17px}.research-notes summary{gap:9px;grid-template-columns:17px 1fr 15px}
 .research-notes details>p{padding-left:26px;font-size:11px}
 .photo-caption small{font-size:5px;max-width:100%}
}

/* Add after existing HK serif faces; generated locally, no text upload. */
@font-face{font-family:NotoSerifHK;src:url('assets/fonts/noto-serif-hk-film-review-supplement.woff2') format('woff2');font-weight:300 600;font-style:normal;font-display:swap;unicode-range:U+4FEE, U+5098, U+5348, U+5404, U+544A, U+592E, U+5BB6, U+5CB8, U+5DF4, U+5F4E, U+600E, U+62EC, U+62FF, U+6383, U+63CF, U+6490, U+6591, U+667A, U+67F1, U+6A39, U+6C96, U+6CB3, U+6D17, U+751A, U+76E1, U+78A7, U+78A9, U+78BA, U+7BC4, U+81A0, U+82E5, U+84CB, U+85C9, U+89AA, U+93E4, U+9435, U+9598, U+986F, U+994B, U+99C1, U+9EBC;}

