:root{font-family:Arial,Helvetica,sans-serif;color:#252622;background:#e8e8e2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a,label{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button:focus-visible,a:focus-visible,.load:focus-within{outline:2px solid #ef562e;outline-offset:6px}header{height:105px;padding:30px 4vw;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid #25262226}.brand{font-size:17px;letter-spacing:-.7px;font-weight:700;text-decoration:none;color:inherit}.brand span{display:block;font-size:9px;font-weight:400;letter-spacing:1px;margin-top:8px;text-transform:uppercase}header button{font-size:11px}main{position:relative}.heading{position:absolute;top:42px;left:4vw;pointer-events:none;z-index:1}.eyebrow{font-size:9px;letter-spacing:1.8px;text-transform:uppercase}h1{font-size:clamp(66px,8.5vw,145px);line-height:.87;font-weight:400;letter-spacing:-.075em;margin:35px 0 25px}h1 i{font-family:Georgia,serif;font-weight:400;letter-spacing:-.085em}.heading p{font-size:11px;line-height:1.6;margin-top:25px}#stage{height:max(740px,calc(100svh - 195px));position:relative;isolation:isolate;overflow:hidden}.print{position:absolute;margin:0;padding:0;background:transparent;border:0;touch-action:none;cursor:grab;transition:left 1.2s cubic-bezier(.2,.7,.2,1),top 1.2s cubic-bezier(.2,.7,.2,1),width 1.2s,transform .6s;animation:arrive .9s both;filter:drop-shadow(0 12px 14px #0002)}.print img{display:block;width:100%;height:auto;object-fit:contain;user-select:none;-webkit-user-drag:none}.print figcaption{font-size:8px;letter-spacing:1px;text-align:left;padding-top:7px;opacity:.65}.print.dragging{cursor:grabbing;transition:none;filter:drop-shadow(0 20px 20px #0004)}.print.drifting img{animation:float var(--duration,9s) ease-in-out infinite alternate;animation-delay:var(--delay,0s)}#empty{position:absolute;left:50%;top:49%;width:300px;text-align:center;font-size:13px;line-height:1.7}.cross{font-size:38px;font-weight:200;color:#ef562e}.load{display:inline-block;padding:12px 18px;border:1px solid #25262255;cursor:pointer;font-size:11px;margin:6px 0 16px}input{position:absolute;width:1px;height:1px;opacity:0}small{display:block;font-size:10px;line-height:1.7;opacity:.65}footer{min-height:90px;border-top:1px solid #25262226;margin:0 4vw;display:flex;align-items:center;gap:25px;font-size:10px}.status{display:flex;gap:10px;align-items:center;min-width:150px}.dot{width:5px;height:5px;border-radius:50%;background:#ef562e}.actions{display:flex;gap:24px;margin-left:auto;align-items:center}#shuffle{border:1px solid #252622;padding:14px 22px;font-size:11px}#shuffle span{margin-left:25px}.hint{margin-left:30px;opacity:.55}#statement{position:fixed;z-index:100;inset:0 0 0 auto;width:min(500px,100%);background:#252622;color:#e8e8e2;padding:100px 45px;box-shadow:-20px 0 80px #0002}#statement h2{font-family:Georgia,serif;font-weight:400;font-size:52px;line-height:1}#statement p{font-size:15px;line-height:1.7}#close-about{position:absolute;right:30px;top:30px;font-size:30px}dialog{border:0;background:#e8e8e2;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:65px 5vw;overflow:hidden}dialog::backdrop{background:#e8e8e2}dialog img{display:block;width:100%;height:calc(100% - 45px);object-fit:contain}#close{position:absolute;right:5vw;top:25px;font-size:12px}.viewer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:20px;font-size:10px}.viewer-bottom button{font-size:24px;padding:5px 20px}@keyframes float{from{transform:translateY(-5px)}to{transform:translateY(5px)}}@keyframes arrive{from{opacity:0;filter:blur(3px)}to{opacity:1}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}@media(max-width:650px){header{height:88px;padding:25px 6vw}.brand{font-size:15px}.heading{top:32px;left:6vw}h1{font-size:75px;margin-top:25px}.heading p{font-size:10px}#stage{height:1700px}#empty{left:8%;top:430px;width:84%}footer{position:sticky;bottom:0;background:#e8e8e2ee;backdrop-filter:blur(10px);z-index:90;margin:0;padding:12px 6vw;min-height:85px;gap:10px}.status{min-width:0;font-size:9px}.actions{gap:12px}#motion{font-size:9px}#shuffle{padding:12px;font-size:10px}#shuffle span{margin-left:8px}.hint{display:none}.print figcaption{font-size:7px}}

.replace{cursor:pointer;font-size:10px}.print{max-width:80vw}@media(max-width:650px){.status{display:none}.actions{width:100%;justify-content:space-between}.replace{font-size:10px}}

/* A dark room: a quiet pool of light behind untouched photographic prints. */
:root{color-scheme:dark;color:#e5e5df;background:#090b0e;--accent:#d0edbb}
body{background:radial-gradient(ellipse at 74% 28%,#23302d44 0,transparent 47%),radial-gradient(ellipse at 14% 68%,#242b4540 0,transparent 48%),#090b0e}
body::before{content:"";position:fixed;pointer-events:none;inset:-20%;z-index:-1;background:radial-gradient(ellipse at 65% 35%,#798b7c16,transparent 40%);animation:room-light 35s ease-in-out infinite alternate}
header{border-bottom-color:#e5e5df20}.brand{color:#eeeee7}.brand span,.eyebrow{color:#a0a8a4}h1{color:#eaece4}h1 i{color:#c6d3c6}.heading p{color:#a8b0ad}
button{transition:color .25s,background .25s,border-color .25s}button:hover,.replace:hover{color:var(--accent)}button:focus-visible,a:focus-visible,.load:focus-within{outline-color:var(--accent)}
.print{filter:drop-shadow(0 18px 23px #0009)}.print img{outline:1px solid #ffffff0c;outline-offset:-1px}.print figcaption{color:#a6afa8;opacity:.85}.print.dragging{filter:drop-shadow(0 26px 30px #000c)}
.dot{background:var(--accent);box-shadow:0 0 12px #c6edb755}.cross{color:var(--accent)}footer{border-top-color:#e5e5df20}.status{color:#abb5ad}#shuffle{border-color:#bdcbb55c;background:#d0edbb08;color:#e3ebdf}#shuffle:hover{border-color:#d0edbb;background:#d0edbb16}.load{border-color:#bdcbb55c}
#statement{background:#121916;color:#e4e9e0;border-left:1px solid #d0edbb26;box-shadow:-20px 0 100px #0008}dialog{background:#090b0e;color:#e5e5df}dialog::backdrop{background:#090b0e}
@keyframes room-light{to{transform:translate(-8%,9%) scale(1.12)}}
@media(max-width:650px){footer{background:#0b100fed;border-top-color:#d0edbb26}body{background:radial-gradient(ellipse at 85% 20%,#23302d50,transparent 50%),#090b0e}}
@media(prefers-reduced-motion:reduce){body::before{animation:none}}

/* Monumental lettering; the title has its own space above the installation. */
.heading{position:relative;top:auto;left:auto;padding:42px 4vw 34px;width:100%}
.heading .eyebrow{display:block;font-size:10px;font-weight:500;letter-spacing:.18em}
h1{font-family:"Arial Black","Helvetica Neue",Arial,sans-serif;font-size:clamp(80px,15.3vw,250px);font-weight:900;line-height:.82;letter-spacing:-.085em;text-transform:uppercase;margin:36px 0 0 -.055em}
h1>span{display:block;width:max-content;max-width:100%}
h1 .title-second{margin-left:9vw;color:#c6d3c6;white-space:nowrap}
h1 .title-dot{color:#d0edbb;letter-spacing:-.12em}
.heading p{font-size:12px;line-height:1.5;letter-spacing:-.015em;margin:30px 0 0;max-width:230px}
.brand{font-size:22px;font-weight:900;letter-spacing:-1.25px}.brand span{font-size:9px;letter-spacing:.13em;font-weight:400}
header button{font-weight:500;font-size:11px}
#statement h2{font-family:"Arial Black","Helvetica Neue",Arial,sans-serif;font-size:52px;font-weight:900;line-height:.94;letter-spacing:-.065em}
@media(min-width:1500px){h1 .title-second{margin-left:135px}}
@media(max-width:650px){.heading{padding:30px 6vw 28px}.heading .eyebrow{font-size:8px;letter-spacing:.13em}h1{font-size:15.3vw;line-height:.87;letter-spacing:-.085em;margin-top:30px}h1 .title-second{margin-left:3vw}.heading p{font-size:11px;margin-top:24px}.brand{font-size:18px;letter-spacing:-1px}.brand span{font-size:8px}#statement h2{font-size:44px}#empty{top:100px}}

/* MOMENTS: image, title, movement. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
header{height:86px;align-items:center;padding:24px 4vw}
.heading{padding:32px 4vw 20px}h1{font-size:clamp(70px,17.3vw,290px);line-height:.85;letter-spacing:-.085em;margin:0 0 0 -.055em;color:#eaece4}
footer{justify-content:flex-end}.actions{margin-left:auto}.print figcaption{display:none}
@media(max-width:650px){header{height:75px;padding:22px 6vw}.heading{padding:32px 6vw 18px}h1{font-size:16.7vw;line-height:.9;margin:0 0 0 -.055em;letter-spacing:-.085em}.actions{justify-content:flex-end;gap:25px}footer{min-height:70px}}