.holo-card[data-effect="oilslick"] .holo-card__shine {
  background-image:
    repeating-radial-gradient(
      circle at calc(150% - var(--background-x) * 1.6) calc(150% - var(--background-y) * 1.6),
      var(--violet) 0%,
      var(--blue) 2.2%,
      var(--green) 4.4%,
      var(--yellow) 6.6%,
      var(--red) 8.8%,
      var(--violet) 11%
    ),
    radial-gradient(
      farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsla(0, 0%, 100%, 0.55) 5%,
      hsla(0, 0%, 45%, 0.35) 45%,
      hsl(0, 0%, 4%) 130%
    );

  background-position:
    center center,
    center center;

  background-size: cover, cover;

  background-blend-mode: soft-light;
  filter: brightness(calc(0.85 * var(--hc-brightness))) contrast(calc(1.5 * var(--hc-contrast)))
    saturate(calc(1.3 * var(--hc-saturate)));
  mix-blend-mode: color-dodge;
  opacity: calc(var(--card-opacity) * 0.9 * var(--hc-shine-opacity));
}

.holo-card[data-effect="oilslick"] .holo-card__shine::before {
  content: "";

  background-image: repeating-radial-gradient(
    circle at calc(var(--background-x) * 1.6 - 50%) calc(var(--background-y) * 1.6 - 50%),
    var(--red) 0%,
    var(--violet) 2.6%,
    var(--blue) 5.2%,
    var(--green) 7.8%,
    var(--yellow) 10.4%,
    var(--red) 13%
  );

  background-size: cover;
  background-position: center center;

  filter: brightness(0.9) contrast(1.25) saturate(1.15);
  mix-blend-mode: exclusion;
  opacity: 0.55;
}

.holo-card[data-effect="oilslick"] .holo-card__shine::after {
  content: "";

  background-image: radial-gradient(
    farthest-corner ellipse at var(--pointer-x) var(--pointer-y),
    hsla(0, 0%, 100%, 0.85) 0%,
    hsla(280, 30%, 55%, 0.25) 35%,
    hsla(220, 40%, 4%, 0.95) 110%
  );

  background-size: cover;
  background-position: center center;

  filter: brightness(0.85) contrast(2.4);
  mix-blend-mode: soft-light;
  opacity: calc(0.4 + var(--pointer-from-center) * 0.5);
}

.holo-card[data-effect="oilslick"] .holo-card__glare {
  background-image: var(
    --glare-image,
    radial-gradient(
      farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsla(300, 60%, 92%, 0.6) 8%,
      hsla(250, 40%, 45%, 0.28) 45%,
      hsla(220, 40%, 5%, 0.75) 110%
    )
  );
  filter: brightness(0.85) contrast(1.8) saturate(1.4);
  mix-blend-mode: var(--glare-blend, overlay);
  opacity: calc(var(--card-opacity) * 0.85 * var(--hc-glare-opacity));
}