/* ============================================================
   The Brown Print — archive: WebGL-renderer overrides
   The grid, camera and lens are drawn on a <canvas> by
   js/home-grid.js; the SVG barrel filter is replaced by a shader,
   so the .viewport filter must never apply here.
   ============================================================ */
.viewport { filter: none !important; }
.viewport canvas { position: absolute; inset: 0; display: block; }

/* DOM layer that rides on top of the canvas: one .glcell per featured
   frame, kept in sync with the camera every frame by JS. */
#domLayer { position: absolute; inset: 0; pointer-events: none; z-index: 5; }
.glcell {
  position: absolute; left: 0; top: 0;
  width: 1000px; height: 625px;
  transform-origin: 0 0;
  pointer-events: auto; cursor: pointer;
  border-radius: 12px;
}
.glcell:focus-visible { outline: calc(3px * var(--inv, 1)) solid var(--c-accent); outline-offset: calc(4px * var(--inv, 1)); }
.glcell .caption { left: 40px; right: 40px; bottom: 34px; }
.glcell.active .caption, .glcell:hover .caption { opacity: 1; transform: translateY(0); }
.glcell.active .numtag,  .glcell:hover .numtag  { opacity: 1; }
.glcell.active .caption .go span, .glcell:hover .caption .go span { transform: translateX(4px); }

/* Brand block doubles as the way back to the entrance. */
a.brand { transition: opacity var(--dur-ui) var(--ease); }
a.brand:hover { opacity: .82; }