Holo Foil Field

"use client";

import { useEffect, useRef, useState, useSyncExternalStore } from "react";
import type { CSSProperties, ReactNode } from "react";

/**
 * HoloFoilField — a full-bleed sheet of holographic foil in WebGL2.
 *
 * The sheet is draped in long folds and reflects the kit's studio: where a
 * fold turns the horizon toward you it draws a bright seam, split into a
 * spectrum (the room is sampled apart for red, green and blue). A thin film
 * on Newton's series tints only the lit metal, so the troughs stay
 * graphite; the pointer tilts the room, sliding the seams and sweeping the
 * colour, and a light over the pointer makes the nearest folds glint. The
 * film drifts on a 44s cycle. Content goes on top as children.
 *
 * Without WebGL2 it falls back to a CSS foil gradient. Paused off screen
 * and in hidden tabs; reduced motion stops the drift.

  // ---------------------------------------------------------------
  // Full source available with a viberdy Pro subscription.
  // https://viberdy.dev/pricing
  // ---------------------------------------------------------------
}