/* ============================================================
   Page transition overlay - ported from house-of-epochs
   (src/providers/TransitionProvider.jsx + globals.css)

   That project runs this through next-transition-router on client-side
   route changes. This site has no router, so page-transition.js drives
   the same grid-cell block-wipe on real <a> navigations instead: leave
   plays before the browser unloads the page, enter plays on the page
   that lands.
   ============================================================ */
.transition-overlay {
  position: fixed;
  top: 50%;
  left: 50%;
  display: grid;
  grid-template-columns: repeat(
    var(--transition-columns),
    var(--transition-block-size)
  );
  grid-auto-rows: var(--transition-block-size);
  transform: translate(-50%, -50%);
  visibility: hidden;
  pointer-events: none;
  z-index: 1000000;
}

.transition-cell {
  aspect-ratio: 1;
  background-color: var(--transition-cell-color, var(--base-300, #ffae00));
}