*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#050505;color:#f5f5f2;font-family:Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,a{color:inherit;font:inherit;-webkit-tap-highlight-color:transparent}button{border:0;background:none;cursor:pointer;padding:8px 0}a{text-decoration:none}button:hover,a:hover{opacity:.55}button:focus-visible,a:focus-visible{outline:1px solid currentColor;outline-offset:5px}header,footer{position:fixed;left:28px;right:28px;z-index:30;display:flex;justify-content:space-between;align-items:flex-start;font-size:13px;line-height:1.15;letter-spacing:-.025em}header{top:24px}#home{font-size:21px;letter-spacing:-.055em}nav{display:flex;gap:32px}nav button{padding-top:0}sup{font-size:8px;vertical-align:top;margin-left:5px}footer{bottom:23px;font-size:11px;line-height:1.15}.discipline{width:180px}.tools{display:flex;gap:28px}.tools button{padding:0}.instruction{text-align:right;width:180px;color:#777}
#stage{position:fixed;inset:75px 28px 76px;touch-action:none}#field{position:absolute;inset:0}.tile{position:absolute;padding:0;overflow:hidden;background:#050505;cursor:grab;transition:none;transform:translate(var(--dx,0px),var(--dy,0px));will-change:transform}.tile:hover{opacity:1!important;z-index:20!important}.tile img{position:absolute;width:100%;height:100%;left:0;top:0;object-fit:cover;pointer-events:none;user-select:none}.tile.dragging{transition:none;cursor:grabbing;z-index:25!important}.tile:focus-visible{outline:1px solid #f5f5f2;outline-offset:4px}.tile .play{position:absolute;right:10px;bottom:10px;color:#fff;font-size:11px;mix-blend-mode:difference}.tile .cellNumber{position:absolute;left:8px;bottom:6px;font-size:9px;color:#111}#sceneNote{position:absolute;bottom:0;left:0;font-size:9px;color:#999;pointer-events:none}body[data-layout="frame"]{background:#050505;color:#f5f5f2}body[data-layout="frame"] .instruction{color:#bbb}body{transition:none}body[data-layout="frame"] #stage{inset:0}body[data-layout="frame"] #sceneNote{display:none}body[data-layout="frame"] header,body[data-layout="frame"] footer{text-shadow:0 1px 6px #0009}.ambientVideo{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}
dialog{position:fixed;max-width:none;max-height:none;width:100%;height:100%;margin:0;border:0;padding:24px 28px;background:#050505;color:#f5f5f2;overflow:auto}dialog::backdrop{background:#050505}.panelhead{display:flex;justify-content:space-between;font-size:13px;letter-spacing:-.025em;margin-bottom:65px}.panelhead button{padding:0}.filters{display:flex;gap:28px;margin-bottom:28px;font-size:12px}.filters button{padding:4px 0;border-bottom:1px solid transparent}.filters .active{border-color:#f5f5f2}.editorialBoard{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 17px}.editorialBoard button{padding:0;text-align:left}.editorialBoard img{display:block;width:100%;height:230px;object-fit:contain;object-position:left center}.editorialBoard span{display:block;font-size:10px;line-height:1.25;padding-top:12px}#info h1{font-size:clamp(60px,9.7vw,145px);line-height:.86;letter-spacing:-.075em;font-weight:400;margin:10vh 0 8vh}.infoDetail{display:grid;grid-template-columns:1fr 1fr;font-size:14px;line-height:1.3}.infoDetail p{margin:0}.links{display:flex;flex-direction:column;align-items:flex-start;gap:13px}#viewerContent{height:calc(100dvh - 160px);display:flex;align-items:center;justify-content:center}#viewerContent img{max-width:100%;max-height:100%;object-fit:contain}#viewerContent iframe{width:100%;height:100%;border:0}.viewerNav{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin-top:15px}#viewer .panelhead{margin-bottom:25px}
@media(max-width:700px){header,footer{left:17px;right:17px}header{top:19px}#home{font-size:19px}nav{gap:23px;font-size:12px}footer{bottom:19px;font-size:10px}.discipline{width:auto}.instruction{display:none}.tools{gap:20px}#stage{inset:70px 17px 72px}dialog{padding:19px 17px}.panelhead{margin-bottom:45px}.editorialBoard{grid-template-columns:repeat(2,1fr);gap:30px 14px}.editorialBoard img{height:180px}.infoDetail{grid-template-columns:1fr;gap:30px}#info h1{font-size:12vw;margin-top:15vh}.filters{gap:22px}}
@media(prefers-reduced-motion:reduce){body,.tile{transition:none}}

.movingPicture{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.viewerClip{width:100%;height:100%;object-fit:contain}.approaches{display:flex;gap:20px;font-size:11px}.approaches button{padding:0;color:#999}.approaches .active{color:inherit;border-bottom:1px solid currentColor}.instruction{display:none}@media(max-width:700px){.approaches{gap:12px;font-size:10px}.tools{gap:12px}.discipline{font-size:9px;width:95px}}

.identity{display:flex;flex-direction:column;align-items:flex-start;gap:9px}#signal{padding:0;line-height:0}#signal img{display:block;width:90px;height:15px;image-rendering:pixelated}@media(max-width:700px){.identity{gap:6px}#signal img{width:72px;height:12px}}

header #signal{position:absolute;left:50%;top:0;transform:translateX(-50%);width:90px;height:15px;image-rendering:pixelated}@media(max-width:700px){header #signal{width:60px;height:10px;top:3px}}

/* Editorial moodboard: complete images, varied columns and irregular whitespace. */
#index .panelhead{margin-bottom:42px}#index .filters{margin-bottom:65px}
.editorialBoard{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;gap:75px 26px;padding-bottom:90px;grid-auto-flow:row}
.editorialBoard .boardItem{grid-column:span var(--span);padding:var(--offset) 0 0;text-align:left;min-width:0;opacity:1}
.editorialBoard .boardMedia{position:relative;width:100%;aspect-ratio:var(--ratio);background:#050505}
.editorialBoard .boardMedia img,.editorialBoard .boardClip{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;object-position:center;pointer-events:none}
.editorialBoard .boardCaption{display:grid;grid-template-columns:28px 1fr;gap:8px;margin-top:12px;max-width:100%;font-size:10px;line-height:1.35;color:#aaa}
.editorialBoard .boardCaption span{display:block;padding:0;font-size:10px}.editorialBoard .boardNumber{color:#666}.editorialBoard .boardItem:hover .boardCaption{color:#fff}
@media(max-width:700px){#index .panelhead{margin-bottom:35px}#index .filters{margin-bottom:30px}.editorialBoard{grid-template-columns:repeat(2,minmax(0,1fr));gap:35px 15px;padding-bottom:40px}.editorialBoard .boardItem{grid-column:span var(--mobile-span);padding-top:calc(var(--offset)*.4)}.editorialBoard .boardCaption{grid-template-columns:23px 1fr;gap:5px;font-size:9px}.editorialBoard .boardCaption span{font-size:9px}}

/* The photographs extend to, and sometimes beyond, the viewport edges. */
#stage{inset:0;overflow:hidden}body[data-layout="frame"] #stage{inset:0}
header,footer{mix-blend-mode:difference}#sceneNote{left:28px;bottom:55px}
#index{padding:24px 0;overflow-x:hidden}#index .panelhead,#index .filters{margin-left:28px;margin-right:28px}
.editorialBoard{column-gap:0}.editorialBoard .boardMedia{transform:translateX(var(--bleed));width:calc(100% + 3vw)}.editorialBoard .boardCaption{padding:0 14px}
@media(max-width:700px){#stage{inset:0}#index{padding:19px 0}#index .panelhead,#index .filters{margin-left:17px;margin-right:17px}.editorialBoard{column-gap:0}.editorialBoard .boardCaption{padding:0 10px}#sceneNote{left:17px;bottom:50px}}

header,footer{font-size:11px}#home{font-size:inherit;letter-spacing:inherit}@media(max-width:700px){header,footer,nav{font-size:10px}#home{font-size:inherit}.discipline{font-size:inherit}}

/* Large, centered editorial compositions with occasional edge bleed. */
.editorialBoard{row-gap:50px}.editorialBoard .boardItem{grid-column:var(--start) / span var(--span)}.editorialBoard .boardMedia{width:100%}
@media(max-width:700px){.editorialBoard{row-gap:30px}.editorialBoard .boardItem{grid-column:span var(--mobile-span)}}

#scrollPage{display:none;position:fixed;inset:0;overflow-y:auto;overflow-x:hidden;padding:90px 0 100px;overflow-anchor:none;scrollbar-width:thin;scrollbar-color:#333 #050505}
body[data-approach="scroll"] #stage{display:none}body[data-approach="scroll"] #scrollPage{display:block}
#scrollGrid{display:block;padding-bottom:90px}#scrollGrid .boardItem{display:block;position:relative;width:var(--mobile-width);margin-left:var(--mobile-shift);margin-top:var(--mobile-gap);padding:0;isolation:isolate}#scrollGrid .boardCaption{display:none}
#scrollGrid .boardMedia{max-height:none}#scrollGrid .boardMedia img,#scrollGrid .boardClip{object-fit:contain}
@media(max-width:700px){#scrollPage{padding:75px 0 85px}#scrollGrid{row-gap:40px}#scrollGrid .boardItem{grid-column:1 / -1}#scrollGrid .boardMedia{max-height:75dvh}.approaches{gap:10px}}

/* Geometric HTML arrows, independent of emoji fonts on iOS. */
.arrow{display:inline-block;position:relative;width:.85em;height:.85em;vertical-align:-.04em;color:inherit;flex:none}
.arrow::before{content:"";position:absolute;left:0;right:.1em;top:50%;border-top:1px solid currentColor}
.arrow::after{content:"";position:absolute;right:.1em;top:50%;width:.42em;height:.42em;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:translateY(-50%) rotate(45deg)}
.arrow-diagonal{transform:rotate(-45deg)}.arrow-left{transform:rotate(180deg)}

/* Mobile journal: staggered, overlapping images extending past the screen. */
@media(max-width:700px){
 #scrollPage{padding-top:65px}
 #scrollGrid{display:block;padding-bottom:60px}
 #scrollGrid .boardItem{display:block;position:relative;width:var(--mobile-width);margin-left:var(--mobile-shift);margin-top:var(--mobile-gap);padding:0;isolation:isolate}
 #scrollGrid .boardMedia{width:100%;max-height:none;transform:none}
 #scrollGrid .boardCaption{display:none}
}

/* Small, loosely arranged index thumbnails. */
#index #grid{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:flex-start;gap:24px 0;padding:0 24px 65px}
#index #grid .boardItem{flex:0 0 auto;width:var(--thumb-width);padding:0;margin:var(--thumb-offset) var(--thumb-space) 0}
#index #grid .boardMedia{width:100%;transform:none;max-height:none}
#index #grid .boardCaption{display:block;padding:0;margin-top:5px;font-size:7px;line-height:1.2;color:#888}
#index #grid .boardCaption span{display:inline;padding:0;font-size:7px}
#index #grid .boardNumber{margin-right:5px;color:#555}
#scrollGrid .boardItem{max-width:min(calc(var(--native-width) * var(--scroll-scale)),calc(860px * var(--scroll-scale)),calc(82dvh * var(--aspect) * var(--scroll-scale)))}
#scrollGrid .boardMedia{transform:none}
@media(max-width:700px){#index #grid{gap:18px 0;padding:0 8px 50px}#scrollGrid .boardItem{max-width:min(calc(var(--native-width) * var(--scroll-scale)),calc(82dvh * var(--aspect) * var(--scroll-scale)))}}