.illusion-ending {
  --ending-black: 0;
  --ending-text: 0;
  --ending-hint: 1;
  position: relative;
  height: 420vh;
  height: 420svh;
  background: #000;
}
.illusion-stage { position: sticky; top: 0; width: 100%; height: 100vh; height: 100svh; overflow: hidden; background: #000; }
#illusion-video { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.illusion-blackout { position: absolute; inset: 0; background: #000; opacity: var(--ending-black); pointer-events: none; }
.illusion-quote { position: absolute; inset: 0; display: grid; place-items: center; padding: 8vw; opacity: var(--ending-text); pointer-events: none; }
.illusion-quote h2 { max-width: 1050px; margin: 0; color: #e7e1cf; font-family: var(--serif); font-weight: 400; font-size: clamp(35px, 5vw, 76px); line-height: 1.4; text-align: center; text-wrap: balance; letter-spacing: -.8px; }
.illusion-word { display: inline-block; opacity: clamp(0, calc(var(--ending-text) * 1.65 - var(--word-delay)), 1); transform: translateY(calc((1 - var(--ending-text)) * 22px)); filter: blur(calc((1 - var(--ending-text)) * 7px)); }
.illusion-word:last-child { color: #d7c49d; font-style: italic; }
.illusion-scroll-hint { position: absolute; bottom: 34px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 18px; color: #e7e1cf; text-shadow: 0 1px 10px #000; font-size: 8px; letter-spacing: 3px; opacity: var(--ending-hint); }
.illusion-scroll-hint span { display: block; width: 1px; height: 35px; background: #e7e1cf9c; animation: scrollhint 2s ease-in-out infinite; }
.illusion-status { position: absolute; top: 15%; left: 50%; transform: translateX(-50%); max-width: 85%; font-size: 11px; padding: 9px 16px; text-align: center; background: #0009; color: #e7e1cf; opacity: calc(1 - var(--ending-black)); }
.illusion-status:empty { display: none; }
.site-header.at-final-black { opacity: 0; visibility: hidden; pointer-events: none; }
.mirror-cursor-finale {
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: clamp(20px, 4vw, 64px);
  background: #000;
}
.mirror-cursor-finale img {
  display: block;
  width: min(100%, 1536px);
  height: auto;
  object-fit: contain;
}
@media (max-width: 700px) {
  .illusion-ending { height: 400svh; }
  .illusion-quote { padding: 8vw; }
  .illusion-quote h2 { font-size: clamp(32px, 8.6vw, 48px); line-height: 1.5; letter-spacing: -.4px; }
  .illusion-scroll-hint { font-size: 6px; letter-spacing: 2.3px; }
}
@media (prefers-reduced-motion: reduce) {
  .illusion-ending { height: 220svh; }
  .illusion-word { transform: none; filter: none; }
  .illusion-scroll-hint span { animation: none; }
}