:root{

  --paper:#ffffff;
  --paper2:#f7f7f7;

  --ink:#3a3a3a;
  --ink-2:#5a5a5a;
  --mute:#6f6f6f;

  --green:#79fe0c;
  --green-ink:#2f6104;
  --green-wash:#f2fee6;
  --line:#e4e4e4;
  --line-2:#efefef;

  --f:"Futura PT","Futura","Futura Std",Jost,"Century Gothic","URW Gothic",
      Avenir,"Avenir Next",system-ui,-apple-system,sans-serif;

  --pad:clamp(20px,5vw,64px);
  --navh:54px;
  --lh-d:1.00;
  --lh-dp:1.06;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto}
.lenis.lenis-smooth iframe{pointer-events:none}
::selection{background:var(--green);color:var(--ink)}

body{background:var(--paper);color:var(--ink);font-family:var(--f);font-size:16px;
  font-weight:400;line-height:1.55;-webkit-font-smoothing:antialiased;

  text-transform:lowercase}

h1,h2,.blurb,.writeup,.pager .n,.lost p,footer .lab{text-transform:none}

a{color:inherit}

.lab{font-size:11px;font-weight:500;letter-spacing:.16em;color:var(--mute);
  font-variant-numeric:tabular-nums;line-height:1.5}
.num{font-variant-numeric:tabular-nums;letter-spacing:.04em}

.nav{position:sticky;top:0;z-index:40;height:var(--navh);
  display:flex;align-items:center;gap:16px;padding:0 var(--pad);
  background:color-mix(in srgb,var(--paper) 92%,transparent);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.nav .wmk{display:block;line-height:0;color:var(--ink);text-decoration:none}
.nav .wmk svg{display:block;height:21px;width:auto}
.nav ul{list-style:none;display:flex;gap:clamp(12px,2.4vw,30px);margin-left:auto}
.nav ul a{color:var(--ink-2);text-decoration:none;font-size:14px;font-weight:400;
  border-bottom:1px solid transparent;padding-bottom:2px;
  transition:color .18s,border-color .18s}
.nav ul a:hover,.nav ul a.on{color:var(--ink);border-bottom-color:var(--green)}
@media(max-width:620px){.nav ul{gap:14px}.nav ul a{font-size:13px}}

.backbar{padding:clamp(18px,3vh,30px) var(--pad) 0}
.back{display:inline-flex;align-items:baseline;gap:9px;text-decoration:none;
  color:var(--ink-2);font-size:14px;
  border-bottom:1px solid var(--line);padding-bottom:3px;
  transition:color .18s,border-color .18s}
.back .arw{color:var(--green-ink);transition:transform .22s var(--ease)}
.back:hover{color:var(--ink);border-bottom-color:var(--green)}
.back:hover .arw{transform:translateX(-4px)}

.masthead{padding:clamp(16px,2.6vh,26px) var(--pad) clamp(30px,6vh,64px)}
.head{display:flex;align-items:baseline;gap:14px;padding-bottom:12px;
  border-bottom:1px solid var(--line)}
.fol{font-size:clamp(17px,1.8vw,22px);font-weight:600;line-height:1;
  letter-spacing:.02em;background:var(--green);color:var(--ink);
  padding:.28em .46em .30em;font-variant-numeric:tabular-nums}

h1{font-size:clamp(40px,9vw,118px);font-weight:600;line-height:var(--lh-dp);
  letter-spacing:-.04em;color:var(--ink);text-wrap:balance;
  margin:clamp(12px,2vh,26px) 0 0}

.camp{padding:clamp(30px,5.5vh,64px) var(--pad);border-top:1px solid var(--line)}
.chead{display:grid;grid-template-columns:clamp(46px,6vw,84px) minmax(0,1fr);
  gap:0 clamp(10px,1.4vw,20px);align-items:baseline}
.cno{color:var(--mute);text-align:right;padding-right:2px}
h2{font-size:clamp(23px,3.4vw,46px);font-weight:600;line-height:var(--lh-dp);
  letter-spacing:-.025em;color:var(--ink);text-wrap:balance}
.cbody{grid-column:2}

.blurb{margin-top:clamp(10px,1.6vh,18px);max-width:62ch;
  font-size:clamp(15px,1.35vw,17.5px);line-height:1.5;color:var(--ink-2)}
.writeup{margin-top:clamp(12px,1.8vh,20px);max-width:62ch;
  font-size:clamp(15px,1.35vw,17.5px);line-height:1.5;color:var(--ink-2)}
@media(max-width:640px){

  .chead{grid-template-columns:1fr;gap:6px}
  .cno{text-align:left;padding-right:0}
  .cbody{grid-column:1}
}

.shots{margin-top:clamp(20px,3.2vh,36px);
  display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(8px,1vw,14px);
  grid-auto-flow:row dense}
.shot{grid-column:span var(--span,6);margin:0;min-width:0}
.shot .fr{display:block;position:relative;aspect-ratio:var(--ar,16/9);
  border:1px solid var(--line);background:var(--paper2);overflow:hidden;
  transition:border-color .18s}
.shot a.fr{cursor:zoom-in}
.shot a.fr:hover,.shot a.fr:focus-visible{border-color:var(--green-ink);outline:0}
.shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.shot .zoom{position:absolute;z-index:2;right:8px;bottom:8px;font-size:10px;font-weight:500;
  letter-spacing:.1em;background:var(--green);color:var(--ink);padding:4px 7px;
  opacity:0;transition:opacity .2s}
.shot a.fr:hover .zoom,.shot a.fr:focus-visible .zoom{opacity:1}
@media(max-width:700px){.shot{grid-column:span var(--span-s,12)}}

.shot.owed .fr{background-image:repeating-linear-gradient(45deg,
  rgba(58,58,58,.05) 0 9px,transparent 9px 18px);border-style:dashed}
.shot figcaption{margin-top:8px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 9px}
.owe{font-size:10px;font-weight:500;letter-spacing:.1em;
  background:var(--green);color:var(--ink);padding:3px 7px}

.films{display:grid;gap:clamp(10px,1.6vh,16px);margin-top:clamp(20px,3.2vh,36px)}
.filmbox{position:relative;aspect-ratio:16/9;background:var(--ink);overflow:hidden;
  display:grid;place-items:center}
.filmbox img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tri{position:relative;z-index:2;width:0;height:0;
  border-left:24px solid var(--green);border-top:15px solid transparent;
  border-bottom:15px solid transparent;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.45))}

.filmplay{display:block;cursor:pointer;text-decoration:none}
.filmplay .tri{transition:transform .2s var(--ease)}
.filmplay:hover .tri{transform:scale(1.12)}
.filmplay:focus-visible{outline:2px solid var(--green-ink);outline-offset:3px}

.film iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:var(--ink)}

.shot a.fr.filmplay{display:grid;place-items:center;cursor:pointer}
.shot.plays iframe{display:block;width:100%;aspect-ratio:var(--ar,9/16);border:0;background:var(--ink)}

.filmslot .fr{display:grid;place-items:center}
.filmslot .tri{border-left-color:var(--green-ink);filter:none}
.filmslot figcaption{margin-top:8px}

.owed{font-size:11.5px;letter-spacing:.02em;color:var(--mute);line-height:1.7;
  font-weight:400;margin-top:clamp(16px,2.4vh,24px)}

.pager{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.pager a{padding:clamp(24px,4.2vh,52px) var(--pad);text-decoration:none;display:block;
  transition:background .2s}
.pager a+a{border-left:1px solid var(--line)}
.pager .nx{text-align:right}
.pager .n{display:block;margin-top:9px;font-size:clamp(20px,3vw,40px);font-weight:600;
  line-height:var(--lh-dp);letter-spacing:-.025em;transition:color .18s}
.pager a:hover{background:var(--paper2)}
.pager a:hover .n{color:var(--green-ink)}
@media(max-width:620px){
  .pager{grid-template-columns:1fr}
  .pager a+a{border-left:0;border-top:1px solid var(--line)}
  .pager .nx{text-align:left}
}

footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 20px;
  padding:clamp(22px,3.4vh,34px) var(--pad);border-top:1px solid var(--line)}
footer a{color:var(--ink-2);text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:2px;
  transition:color .18s,border-color .18s}
footer a:hover{color:var(--ink);border-bottom-color:var(--green)}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms !important}
}

.lost{flex:1;display:flex;flex-direction:column;justify-content:center;
  padding:clamp(40px,10vh,120px) var(--pad) clamp(48px,12vh,140px)}
.lost .code{display:block;font-size:11px;font-weight:500;letter-spacing:.2em;
  color:var(--mute);font-variant-numeric:tabular-nums;width:fit-content;
  border-top:1px solid var(--ink);padding-top:12px;margin-bottom:clamp(18px,3vh,30px);
  min-width:min(34ch,100%)}
.lost h1{font-size:clamp(34px,6.4vw,84px);font-weight:600;line-height:1.02;
  letter-spacing:-.035em;text-wrap:balance;max-width:15ch}
.lost p{margin-top:clamp(14px,2.4vh,24px);font-size:clamp(15px,1.6vw,19px);
  line-height:1.6;color:var(--ink-2);max-width:46ch}
.lost ul{list-style:none;margin-top:clamp(26px,4.4vh,46px);display:flex;
  flex-wrap:wrap;gap:0 clamp(18px,3vw,34px)}
.lost ul a{font-size:clamp(17px,2.2vw,26px);font-weight:500;letter-spacing:-.02em;
  color:var(--ink);text-decoration:none;padding:10px 0;display:inline-block;
  border-bottom:2px solid transparent;transition:color .18s,border-color .18s}
.lost ul a:hover{color:var(--green-ink);border-bottom-color:var(--green)}
@media(max-width:560px){.lost ul{gap:0 22px}}