:root{color-scheme:dark}*{box-sizing:border-box}body,html{margin:0;padding:0;height:100%;background:#000;color:#fff;font-family:ui-sans-serif,system-ui,-apple-system,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior:none}body{overflow:hidden}.stage{position:fixed;touch-action:pan-y;-moz-user-select:none;user-select:none;-webkit-user-select:none;perspective:1400px;overflow:hidden}.layer>.media,.stage{inset:0;background:#000}.layer>.media{position:absolute;width:100%;height:100%;display:block;border:0}.media.cover{object-fit:cover}.media.contain{object-fit:contain}.layer{position:absolute;inset:0;background:#000;will-change:transform,opacity;z-index:1}.layer.in{z-index:2}.layer.echo{background:transparent;z-index:0}.layer.echo>.media{opacity:var(--o,.5);background:transparent}.layer.in.fwd{animation:in-fwd .9s cubic-bezier(.25,.6,.2,1) both}.layer.out.fwd{animation:out-fwd .9s cubic-bezier(.25,.6,.2,1) both}.layer.in.back{animation:in-back .9s cubic-bezier(.25,.6,.2,1) both}.layer.out.back{animation:out-back .9s cubic-bezier(.25,.6,.2,1) both}@keyframes out-fwd{0%{transform:translateZ(0);opacity:1}to{transform:translate3d(-85vw,0,-1100px);opacity:0}}@keyframes in-fwd{0%{transform:translate3d(85vw,0,-1100px);opacity:0}30%{opacity:1}to{transform:translateZ(0);opacity:1}}@keyframes out-back{0%{transform:translateZ(0);opacity:1}to{transform:translate3d(85vw,0,-1100px);opacity:0}}@keyframes in-back{0%{transform:translate3d(-85vw,0,-1100px);opacity:0}30%{opacity:1}to{transform:translateZ(0);opacity:1}}@media (prefers-reduced-motion:reduce){.layer{animation-duration:1ms!important;animation-delay:0ms!important}}.mark,.nav,.sound,.view{position:fixed;z-index:30;color:#fff;text-decoration:none;background:none;border:0;padding:0;cursor:pointer;font-family:inherit;mix-blend-mode:difference}.mark{top:18px;left:20px;font-size:11px;letter-spacing:.32em;font-weight:500;opacity:.85}.nav{top:0;bottom:0;width:14vw;min-width:56px;max-width:160px;display:flex;align-items:center;font-size:22px;font-weight:200;opacity:0;transition:opacity .2s ease}.nav.prev{left:0;justify-content:flex-start;padding-left:18px}.nav.next{right:0;justify-content:flex-end;padding-right:18px}.nav:focus-visible,.nav:hover{opacity:.9;outline:none}.nav[hidden]{display:none}@media (hover:none){.nav{opacity:.35}}.sound{right:20px;bottom:18px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;opacity:.7}.sound:hover{opacity:1}.view{top:42px;left:20px;display:grid;grid-template-columns:6px 6px;grid-gap:3px;gap:3px;padding:4px 0;opacity:.7}.view i{display:block;width:6px;height:6px;border:1px solid #fff;box-sizing:border-box}.view.open i{background:#fff}.view.open,.view:hover{opacity:1}.filters{position:fixed;top:18px;right:20px;z-index:30;display:flex;gap:18px}.filters select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M0 0h8L4 5z' fill='%23fff'/%3E%3C/svg%3E") no-repeat right 2px center;border:0;border-radius:0;color:#fff;font:inherit;font-size:10px;letter-spacing:.22em;text-transform:uppercase;padding:2px 16px 2px 0;cursor:pointer;opacity:.75;outline:none}.filters select:focus-visible,.filters select:hover{opacity:1}.filters option{background:#000;color:#fff;text-transform:none;letter-spacing:normal}.empty{grid-column:1/-1;margin:40vh 0 0;text-align:center;font-size:10px;letter-spacing:.22em;text-transform:uppercase;opacity:.5}@media (max-width:640px){.filters{top:14px;right:12px;gap:12px}.filters select{font-size:9px;letter-spacing:.16em}}.grid{position:fixed;inset:0;z-index:20;background:#000;overflow-y:auto;overscroll-behavior:contain;padding:56px 20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:6px;gap:6px;align-content:start;animation:grid-in .3s ease both}@keyframes grid-in{0%{opacity:0}to{opacity:1}}@media (max-width:640px){.grid{grid-template-columns:repeat(2,1fr);padding:52px 8px}}.tile{position:relative;aspect-ratio:1;overflow:hidden;background:#111;border:0;padding:0;cursor:pointer;opacity:.9;transition:opacity .15s ease}.tile:focus-visible,.tile:hover{opacity:1;outline:none}.tile.current{box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.7)}.thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;pointer-events:none;display:block}.gate{position:fixed;inset:0;justify-content:center}.gate,.gate form{display:flex;align-items:center}.gate form{flex-direction:column;gap:14px}.gate input{width:200px;background:transparent;border:0;border-bottom:1px solid hsla(0,0%,100%,.35);color:#fff;font:inherit;font-size:14px;letter-spacing:.2em;text-align:center;padding:8px 0;outline:none}.gate input:focus{border-bottom-color:#fff}.gate .err{font-size:10px;letter-spacing:.2em;text-transform:uppercase;opacity:.6;min-height:14px}