/* The Trash mark (mark.js builds it from letters.js): the cutout lockup at height --L, each letter a slot holding its
   cutouts, one shown at a time. Light (Calvin 1 Nov, gloss/ v12): soft shadows piece onto piece, longer the higher it
   sits (--z), and a thin rim on the cut edges facing the light (#trash-rim). Moved out of the homepage on 3 Nov so the
   case studies carry the same lockup in their menu. The mark is a link (<a class="mark">): mark.js decides what a
   click does. */
:root { --L: clamp(64px, 5.6vw, 92px); }
@media (max-width: 600px) { :root { --L: min(17vw, 64px); } }   /* phones keep 64 px */
/* the mark */
.mark {
  display: flex; align-items: center; justify-content: center;
  height: var(--L); margin: 0; padding: 0; border: 0; background: none; color: inherit; text-decoration: none;
  cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.mark:not(.is-ready) { pointer-events: none; }
.mark:focus { outline: none; }
.mark:focus-visible { outline: 1px solid var(--ink-2); outline-offset: calc(var(--L) * .16); }
.mark__slot {
  position: relative; flex: none; z-index: var(--z, 1);
  width: calc(var(--L) * var(--w, 0) * var(--s, 1)); height: var(--L);
  margin-left: calc(var(--L) * var(--gap, 0));
  transform: translateY(calc(var(--L) * var(--dy, 0)));
}
.mark__slot img {   /* artwork square = s × L, centred in the L-tall row */
  position: absolute; max-width: none; height: auto;
  width: calc(var(--L) * var(--s, 1) * var(--iw));
  left: calc(var(--L) * var(--s, 1) * var(--ix));
  top: calc(var(--L) * (var(--s, 1) * var(--iy) + (1 - var(--s, 1)) / 2));
  visibility: hidden; pointer-events: none; user-select: none; -webkit-user-drag: none;
}
.mark__slot img.is-on { visibility: visible; }
:root { --u: calc(var(--L) / 81); }
.mark__slot { --k: calc(.7 + .15 * var(--z, 1));
  filter: drop-shadow(calc(var(--u) * .8 * var(--k)) calc(var(--u) * 1.3 * var(--k)) calc(var(--u) * 1.2) rgba(0, 0, 0, .55))
          drop-shadow(calc(var(--u) * 2.4 * var(--k)) calc(var(--u) * 4 * var(--k)) calc(var(--u) * 6) rgba(0, 0, 0, .38)); }
.mark__slot img { filter: url(#trash-rim); }
