/* A continuous black gallery. Images carry the scale; the identity stays small. */
.page-onepage {
  --inset:clamp(20px,3vw,56px);
  --display:Avantt,Helvetica,Arial,'Noto Sans TC',sans-serif;
  --ui:var(--display);
  --paper:#f1f0ec;
  --muted:#999;
  --line:#ffffff26;
  --section-space:clamp(84px,11vw,176px);
  overflow-x:clip;
}
html:has(.page-onepage) { scroll-padding-top:100px; scrollbar-gutter:stable; }
.page-onepage .page-content:has(.work-ready:not([hidden]))>main { display:block; height:auto; }
.page-onepage .page-content:has(.work-ready:not([hidden]))>.site-footer { display:flex; }
.page-onepage main { min-height:100svh; }
.page-onepage .site-header { position:fixed; inset:0 0 auto; z-index:20; padding:25px var(--inset); pointer-events:none; background:#000; }
.page-onepage .site-header .brand,.page-onepage .header-navigation { pointer-events:auto; }
.page-onepage .brand-name { font-size:24px; font-weight:500; letter-spacing:-.045em; }
.page-onepage .brand-roles { font-size:9px; gap:11px; margin-top:8px; font-weight:700; letter-spacing:.005em; }
.page-onepage .header-navigation { flex-direction:row; gap:32px; padding-top:1px; font-size:11px; font-weight:500; letter-spacing:0; }
.page-onepage .header-navigation a { position:relative; min-height:38px; }
.page-onepage .exhibition { height:100svh; min-height:620px; --stage-top:116px; --panel-width:min(94vw,calc((100svh - 286px)*2.16)); }
.page-onepage .exhibit-viewport { bottom:170px; }
.page-onepage .exhibit-image { box-shadow:none; }
.page-onepage .exhibit-toolbar { bottom:78px; grid-template-columns:minmax(0,1fr) auto auto; gap:24px; align-items:end; }
.page-onepage .exhibit-current-film { gap:10px; }
.page-onepage .exhibit-current-film>[data-exhibit-artist] { font-size:11px; font-weight:500; letter-spacing:.015em; color:#a9a9a9; }
.page-onepage .exhibit-current-film h2 { font-size:clamp(28px,3.6vw,62px); font-weight:500; letter-spacing:-.045em; line-height:1.04; }
.page-onepage .exhibit-actions { background:transparent; border:0; backdrop-filter:none; border-radius:0; gap:4px; }
.page-onepage .exhibit-actions button { min-width:44px; min-height:44px; }
.page-onepage .exhibit-selectors { gap:6px; }
.page-onepage .exhibit-selector { width:40px; min-width:40px; height:44px; }
.page-onepage .exhibit-selector img { width:40px; height:24px; }
.page-onepage .hero-scroll { position:absolute; bottom:13px; left:var(--inset); right:var(--inset); display:flex; align-items:center; justify-content:space-between; height:34px;  font:500 10px/1 var(--ui); letter-spacing:.015em; }
.hero-scroll>span[aria-hidden] { display:block; height:14px; width:1px; background:#b5b5b5; transform-origin:top; animation:scroll-breath 3s ease-in-out infinite; }
@keyframes scroll-breath { 0%,100%{transform:scaleY(.55);opacity:.45} 50%{transform:scaleY(1);opacity:1} }

/* A broad title, fine controls, then the room. No viewport lock or vertical wheel trap. */
.onepage-work { padding-top:clamp(68px,7vw,128px); scroll-margin-top:0; }
.page-onepage .index-intro { padding:0 var(--inset) 42px; }
.page-onepage .index-intro h2 { font-size:clamp(64px,9vw,156px); font-weight:500; line-height:.96; letter-spacing:-.065em; max-width:14ch; text-wrap:balance; }
.page-onepage .index-collection { padding:0 var(--inset); }
.page-onepage .collection-controls { display:flex; flex-wrap:wrap; align-items:center; gap:15px 28px; padding:0 0 16px; margin:0;  }
.page-onepage .filters { display:flex; flex-wrap:wrap; flex:1; gap:6px 26px; }
.page-onepage .filters button { min-height:44px; color:#858585; font:500 10px/1.3 var(--ui); letter-spacing:0; }
.page-onepage .filters button.active,.page-onepage .filters button:hover { color:var(--paper); }
.page-onepage .film-search { margin:0; flex:0 1 115px; }
.page-onepage .film-search input { min-height:44px; width:100%; border:0; font:500 10px/1.4 var(--ui); letter-spacing:0; color:var(--paper); }
.page-onepage .view-controls { display:flex; gap:18px; margin-left:auto; }
.page-onepage .view-controls button { width:auto; height:44px; padding:0; font:500 10px/1 var(--ui); letter-spacing:0; color:#858585; }
.page-onepage .view-controls button[aria-pressed=true] { color:var(--paper); }
.page-onepage .work-ready { flex:none; height:clamp(540px,77svh,980px); margin-inline:calc(-1*var(--inset)); }
.page-onepage .work-ready .work-stage { flex:1; min-height:340px; }
.page-onepage .work-ready .work-panel .film-image { border:0; box-shadow:none; }
.page-onepage .work-ready .work-toolbar { padding:20px var(--inset) 32px; }
.page-onepage .work-current-film { gap:10px; }
.page-onepage .work-current-film h2 { font-size:clamp(30px,3.5vw,60px); letter-spacing:-.045em; line-height:1.05; font-weight:500; }
.page-onepage .work-artist { font:500 11px/1.4 var(--ui); letter-spacing:.005em; color:#999; }
.page-onepage .work-controls { gap:15px; }
.page-onepage .work-controls>button { min-width:44px; min-height:44px; }
.page-onepage .collection-empty { padding:64px 0; font:500 26px/1.2 var(--display); }
.page-onepage .index-columns { padding-top:28px; padding-bottom:48px; }
.page-onepage .index-row { padding:24px 0; }
.page-onepage .index-row h2 { font-size:clamp(22px,2.5vw,40px); font-weight:500; letter-spacing:-.04em; }
.page-onepage .index-artist { color:#999; }
.page-onepage .index-preview { top:112px; }

/* Editorial close: complete portrait, concise bio, expandable recognition. */
.onepage-about { padding-top:var(--section-space); scroll-margin-top:40px; }
.page-onepage .biography { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(60px,10vw,190px); padding:0 var(--inset) var(--section-space); align-items:center; scroll-margin-top:18px; }
.page-onepage .portrait { width:100%; max-width:520px; }
.page-onepage .portrait img { height:auto; width:100%; object-fit:contain; }
.page-onepage .bio-copy { padding:0; }
.page-onepage .about-name { font:500 22px/1.1 var(--display); letter-spacing:-.035em; margin-bottom:40px; }
.page-onepage .bio-copy .bio-lead { font:500 clamp(28px,3.5vw,58px)/1.12 var(--display); letter-spacing:-.045em; margin-bottom:30px; max-width:18ch; }
.page-onepage .bio-copy p { font:400 15px/1.8 var(--sans); color:#aaa; max-width:40ch; }
.page-onepage .bio-copy p:last-child { font-size:12px; margin-top:32px; margin-bottom:0; }
.recognition-disclosure { margin:0 var(--inset) 0;  }
.recognition-disclosure>summary { display:flex; justify-content:space-between; align-items:center; min-height:76px; list-style:none; cursor:pointer; font:500 11px/1.3 var(--ui); }
.recognition-disclosure>summary::-webkit-details-marker { display:none; }
.recognition-disclosure>summary>span[aria-hidden] { font-size:22px; transition:transform .3s; }
.recognition-disclosure[open]>summary>span[aria-hidden] { transform:rotate(45deg); }
.page-onepage .recognition { margin:0; border:0; padding:16px 0 64px; }
.page-onepage .recognition>h2 { display:none; }
.page-onepage .recognition-row { padding:28px 0; }
.page-onepage .recognition-row h3 { font-size:clamp(20px,2.3vw,34px); font-weight:500; }
.page-onepage .recognition-row p { font-size:12px; color:#aaa; }
.page-onepage .recognition-row small { font-size:11px; color:#999; }
.page-onepage .contact-section { padding:44px 0 90px; margin-inline:var(--inset); scroll-margin-top:110px; }
.page-onepage .contact-section h2 { margin-bottom:46px; font-size:11px; }
.page-onepage .contact-email { font:500 clamp(26px,5.2vw,94px)/1.2 var(--display); letter-spacing:-.055em; }
.page-onepage .contact-email:hover { color:#fff; opacity:.7; }
.page-onepage .site-footer { margin-inline:var(--inset); padding-inline:0; padding-block:26px;  }
.page-onepage .footer-home { font:500 19px/1 var(--display); letter-spacing:-.035em; }
.onepage-language { min-height:44px; font:500 10px/1 var(--ui); }
.page-onepage .site-footer>div { align-items:center; font-size:10px; gap:28px; }

/* Details stay within the same browsing session and have their own natural scroll. */
.project-dialog { inset:0; width:100%; max-width:none; height:100dvh; max-height:none; margin:0; padding:0; border:0; background:#000; color:var(--paper); overflow:auto; overscroll-behavior:contain; }
.project-dialog::backdrop,.still-dialog::backdrop { background:#000; }
.project-header { position:sticky; top:0; z-index:8; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:16px var(--inset); background:#000;  font:500 10px/1.2 var(--ui); }
.project-header a,.project-header button { min-height:44px; display:flex; align-items:center; gap:18px; }
.project-header>[data-project-permalink] { margin-left:auto; color:#999; }
.project-header button>span[aria-hidden] { font-size:24px; font-weight:400; }
.project-body { min-height:60svh; padding-bottom:48px; }
.project-body[aria-busy=true] { display:grid; place-items:center; }
.project-loading,.project-error { padding:64px var(--inset); font:400 16px/1.7 var(--sans); }
.project-error a { text-decoration:none; }
.project-body .film-intro { padding-top:48px; padding-bottom:32px; }
.project-body .film-intro h1 { font-family:var(--display); font-weight:500; font-size:clamp(36px,6.5vw,110px); letter-spacing:-.05em; }
.project-body .film-meta-line { font-size:11px; }
.project-body .film-statement { margin-block:clamp(56px,8vw,128px); }
.project-body .film-concept h2 { font-family:var(--display); font-weight:500; letter-spacing:-.035em; }
.project-body .film-description p { line-height:1.8; }
.project-body .next-film { margin-bottom:0; }
.project-body .next-film p { text-transform:uppercase; }
.page-onepage:has(.project-dialog[open]),.page-onepage:has(.player-dialog[open]),.page-onepage:has(.still-dialog[open]) { overflow:hidden; }
.still-dialog { inset:0; width:100%; height:100dvh; max-width:none; max-height:none; margin:0; padding:0 var(--inset); border:0; background:#000; color:var(--paper); }
.still-dialog[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto; }
.still-header { display:flex; align-items:center; justify-content:space-between; min-height:80px; font:500 11px/1 var(--ui); }
.still-header button { min-height:44px; }
.still-header button span[aria-hidden] { font-size:24px; margin-left:14px; }
.still-dialog>img { width:100%; height:100%; min-height:0; object-fit:contain; }
.still-controls { display:flex; align-items:center; justify-content:center; gap:30px; min-height:80px; font:500 11px/1 var(--ui); }
.still-controls button { min-width:44px; min-height:44px; font-size:22px; }

@media(min-width:1800px) { .page-onepage .exhibit-selector,.page-onepage .exhibit-selector img { width:48px; min-width:48px; } }
@media(max-width:1100px) { .page-onepage .filters { flex-basis:100%; } .page-onepage .view-controls { margin-left:auto; } .page-onepage .exhibit-selector,.page-onepage .exhibit-selector img { width:28px; min-width:28px; } }
@media(max-width:760px) {
  .page-onepage { --inset:20px; --section-space:88px; }
  html:has(.page-onepage) { scroll-padding-top:94px; }
  .page-onepage .site-header { padding-top:20px; padding-bottom:22px; gap:14px; }
  .page-onepage .brand-name { font-size:22px; }
  .page-onepage .brand-roles { font-size:8px; gap:8px; margin-top:7px; }
  .page-onepage .header-navigation { gap:16px; font-size:9px; flex-wrap:wrap; justify-content:flex-end; }
  .page-onepage .header-navigation a { min-height:36px; }
  .page-onepage .exhibition { min-height:600px; --stage-top:118px; --panel-width:96vw; }
  .page-onepage .exhibit-viewport { bottom:220px; }
  .page-onepage .exhibit-toolbar { bottom:78px; grid-template-columns:minmax(0,1fr) auto; gap:20px 14px; }
  .page-onepage .exhibit-current-film { grid-column:1/-1; grid-row:1; gap:9px; }
  .page-onepage .exhibit-current-film h2 { font-size:clamp(29px,7.7vw,48px); line-height:1.08; letter-spacing:-.045em; }
  .page-onepage .exhibit-current-film>[data-exhibit-artist] { font-size:10px; }
  .page-onepage .exhibit-actions { grid-column:2; grid-row:2; padding:0; gap:0; }
  .page-onepage .exhibit-actions button { min-width:34px; width:34px; }
  .page-onepage .exhibit-selectors { grid-column:1; grid-row:2; justify-content:space-between; gap:4px; }
  .page-onepage .exhibit-selector { width:calc((100% - 28px)/8); min-width:0; }
  .page-onepage .exhibit-selector img { width:100%; min-width:0; height:18px; }
  .page-onepage .hero-scroll { font-size:9px; }
  .onepage-work { padding-top:62px; }
  .page-onepage .index-intro { padding-bottom:30px; }
  .page-onepage .index-intro h2 { font-size:clamp(47px,14vw,82px); line-height:1.01; letter-spacing:-.06em; }
  .page-onepage .collection-controls { gap:4px 18px; padding-bottom:11px; }
  .page-onepage .filters { gap:2px 20px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  .page-onepage .filters button { font-size:9px; flex:none; white-space:nowrap; }
  .page-onepage .film-search { flex-basis:110px; }
  .page-onepage .film-search input,.page-onepage .view-controls button { font-size:9px; }
  .page-onepage .view-controls { gap:20px; }
  .page-onepage .work-ready { height:540px; max-height:78svh; min-height:470px; }
  .page-onepage .work-ready .work-stage { min-height:245px; }
  .page-onepage .work-ready .work-toolbar { padding-top:15px; padding-bottom:20px; gap:16px; }
  .page-onepage .work-current-film h2 { font-size:clamp(27px,7.5vw,40px); line-height:1.08; }
  .page-onepage .work-artist { font-size:10px; }
  .page-onepage .index-columns { display:block; }
  .page-onepage .index-preview { display:none; }
  .page-onepage .index-row { padding:23px 0; gap:10px; }
  .page-onepage .index-row h2 { font-size:26px; }
  .page-onepage .biography { grid-template-columns:1fr; gap:44px; }
  .page-onepage .portrait { width:85%; max-width:400px; }
  .page-onepage .bio-copy { padding-left:11%; }
  .page-onepage .about-name { font-size:20px; margin-bottom:28px; }
  .page-onepage .bio-copy .bio-lead { font-size:34px; max-width:15ch; }
  .page-onepage .bio-copy p { font-size:14px; line-height:1.8; }
  .recognition-disclosure>summary { min-height:68px; font-size:10px; }
  .page-onepage .recognition-row { padding:24px 0; }
  .page-onepage .recognition-row h3 { font-size:22px; }
  .page-onepage .contact-section { padding-top:28px; padding-bottom:64px; }
  .page-onepage .contact-section h2 { margin-bottom:30px; font-size:10px; }
  .page-onepage .contact-email { font-size:clamp(22px,6.1vw,42px); letter-spacing:-.045em; }
  .page-onepage .site-footer { align-items:flex-start; gap:18px; }
  .page-onepage .footer-home { font-size:18px; }
  .page-onepage .site-footer>div { gap:0 18px; flex-wrap:wrap; justify-content:flex-end; font-size:9px; }
  .project-header { padding:12px var(--inset); gap:16px; font-size:9px; }
  .project-header>[data-project-permalink] { display:none; }
  .project-body .film-intro { display:block; padding-top:28px; padding-bottom:28px; }
  .project-body .film-intro h1 { font-size:clamp(34px,9.3vw,68px); line-height:1.05; }
  .project-body .film-meta-line { margin-bottom:15px; }
  .project-body .film-statement.has-description { display:block; }
  .still-header,.still-controls { min-height:68px; }
}
@media(max-width:380px) { .page-onepage { --inset:16px; } .page-onepage .header-navigation { gap:11px; font-size:8px; } .page-onepage .brand-name { font-size:20px; } .page-onepage .brand-roles { font-size:6.5px; gap:6px; } }
@media(max-height:650px) and (min-width:761px) { .page-onepage .exhibition { min-height:500px; --stage-top:106px; --panel-width:min(94vw,calc((100svh - 250px)*2.16)); } .page-onepage .exhibit-viewport { bottom:140px; } .page-onepage .exhibit-toolbar { bottom:65px; } }
@media(prefers-reduced-motion:reduce) { .hero-scroll>span[aria-hidden] { animation:none; } .page-onepage *, .page-onepage *:before, .page-onepage *:after { scroll-behavior:auto!important; transition:none!important; } }