/* Shared right-to-left wipe; only transforms animate. */
html[data-page-wipe="arriving"]::after {
  content: "";
  position: fixed;
  inset: 0;
  background: var(--wipe-cover, #2b4fd8);
  z-index: 200001;
}
.page-wipe {
  position: fixed;
  inset: 0;
  z-index: 200002;
  overflow: hidden;
  pointer-events: none;
  visibility: hidden;
  contain: strict;
}
.page-wipe.is-active { visibility: visible; pointer-events: auto; }
.page-wipe > span {
  position: absolute;
  inset: 0;
  background: var(--wipe-1, #d9e4ff);
  transform: translate3d(100%, 0, 0);
}
.page-wipe > span:nth-child(2) { background: var(--wipe-2, #8aaaff); }
.page-wipe > span:nth-child(3) { background: var(--wipe-3, #2b4fd8); }
.page-wipe.is-active > span { will-change: transform; }
/* Per-project moves; the three layers above are only the homepage wipe. */
html:not([data-wipe-effect="layers"]) .page-wipe > span { display: none; }
.page-wipe > .fx { display: none; position: absolute; inset: 0; }
.page-wipe > .fx.is-on { display: block; }
.page-wipe .fx i { position: absolute; display: block; }

/* csakura, Hate Speech and Mind Well draw on one canvas */
.term-wipe { display: none; position: absolute; inset: 0; width: 100%; height: 100%; }
.term-wipe.is-visible { display: block; }

/* Food AI: camera shutter blades */
.page-wipe .fx-shutter i {
  left: 50%; top: 50%;
  width: calc(var(--reach, 100vmax) * 3); height: calc(var(--reach, 100vmax) * 3);
  margin-left: calc(var(--reach, 100vmax) * -1.5);
  transform-origin: 50% 0;
  background: #12120e;
  border-top: 1px solid rgba(255, 255, 255, .16);
  transform: translate3d(0, 200vmax, 0);
  will-change: transform;
}

/* ReCycle: lime-rimmed iris */
.iris-lime, .iris-deep { inset: 0; clip-path: circle(0px at 50% 50%); }
.iris-lime { background: #c8f53c; }
.iris-deep { background: #06331f; }

/* Smile Always: yellow panel with smile-curved edges */
.smile-panel {
  position: absolute; left: 0; right: 0; top: 0;
  display: flex; flex-direction: column;
  height: calc(var(--h, 100vh) + 2 * var(--c, 20vh));
  transform: translate3d(0,100vh,0);
  will-change: transform;
}
.smile-panel svg { display: block; width: 100%; height: var(--c, 20vh); flex: none; fill: #ffd600; }
.page-wipe .smile-panel > i { position: static; flex: 1; background: #ffd600; margin: -1px 0; }

/* Aadarana: marquee bands */
.mq-band {
  position: absolute; left: 0; width: 100%;
  overflow: hidden;
  background: #005fa1;
  box-shadow: inset 0 1px rgba(255, 255, 255, .14);
  transform: translate3d(-101%,0,0);
  will-change: transform;
}
.mq-band span {
  display: block;
  white-space: nowrap;
  font: 800 calc(var(--band, 18vh) * .58) / var(--band, 18vh) "Helvetica Neue", Helvetica, Arial, "Nirmala UI", "Noto Sans Telugu", sans-serif;
  letter-spacing: -.02em;
  color: #fff;
  will-change: transform, opacity;
}

@media (prefers-reduced-motion: reduce) {
  .page-wipe, html[data-page-wipe="arriving"]::after { display: none; }
}