/* fx.css · pointer/spotlight, a pool of light follows the pointer · owner: Lizzy East · all rights reserved */

/* The light rests where the designer placed it; on a fine pointer it follows. The
   words sit on solid dark, never in the light, so they always keep their contrast. */
[data-fx~="pointer/spotlight"] { position: relative; isolation: isolate; overflow: clip; }
[data-fx~="pointer/spotlight"] > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
[data-fx~="pointer/spotlight"] > [data-fx-dark] {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(circle var(--fx-spot-r, 200px) at var(--fx-x, 68%) var(--fx-y, 42%), rgb(12 10 8 / 0) 0, rgb(12 10 8 / 0) 45%, rgb(12 10 8 / 0.95) 100%);
}