/* One invisible, persistent touch target for both photo and film. */
.field-surface{position:absolute;inset:0;z-index:6;width:100%;height:100%;display:block;padding:0;border:0;border-radius:0;appearance:none;background:transparent;color:transparent;cursor:pointer;touch-action:pan-y pinch-zoom;-webkit-tap-highlight-color:transparent}
.field-surface:hover,.field-surface:active{background:transparent}
.field-surface:focus-visible{outline:3px solid var(--orange);outline-offset:-5px}
.static-view .field-surface{display:none}
.field-scene,.field-media{touch-action:pan-y pinch-zoom}
#field-scene .scene-image video.field-film{position:absolute;inset:0;width:100%;height:100%;background:#111610;pointer-events:none;opacity:0;transition:opacity .24s ease;transform:none!important;filter:none!important;object-fit:contain}
#field-scene.film-mode .scene-image video.field-film.is-current{opacity:1}
#field-scene.film-mode #field-photo{opacity:1}
.scene-gesture{align-self:end;margin:0;max-width:155px;color:#b8bfaf;font-size:10px;line-height:1.65;text-align:right;white-space:nowrap}
.field-controls{grid-template-columns:1fr}
.scene-switcher i{transition:transform .18s ease}
.about-copy>p{max-width:430px}
body.motion-off #field-scene .scene-image video.field-film{transition:none}
@media(max-width:760px){
 .field-scene .scene-caption{gap:12px}
 .scene-gesture{font-size:10px;text-align:left;max-width:none}
 .scene-switcher small{font-size:9px;line-height:1.5;min-height:28px}
 .scene-switcher b{font-size:clamp(15px,4.2vw,18px)}
 .field-scene .scene-statement p{min-height:1.96em}
}
@media(max-width:360px){.field-scene .scene-statement p{font-size:34px}}
@media(prefers-reduced-motion:reduce){#field-scene .scene-image video.field-film,.scene-switcher i{transition:none}}