.ibb-bubble-bg{
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: var(--ibb-z, 0);
  background: var(--ibb-bg, #ffffff);
}

/* Stronger bubble visibility for WHITE backgrounds */
.ibb-bubble{
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 999px;

  width: var(--s);
  height: var(--s);
  opacity: var(--o);

  /* clearer “glass” shading */
  background:
    radial-gradient(circle at 28% 24%, rgba(255,255,255,1) 0 18%, rgba(255,255,255,.55) 30%, rgba(255,255,255,0) 62%),
    radial-gradient(circle at 72% 78%, rgba(0,0,0,.12) 0 18%, rgba(0,0,0,0) 58%),
    radial-gradient(circle at 50% 55%, rgba(0,0,0,.08), rgba(0,0,0,0) 70%);

  /* key: stronger outline + shadow */
  box-shadow:
    0 0 0 2px rgba(0,0,0,.14) inset,      /* dark inner ring */
    0 0 0 3px rgba(255,255,255,.85) inset,/* bright ring for “glass edge” */
    0 14px 34px rgba(0,0,0,.14);          /* outer shadow */

  transform: translate3d(calc(var(--x) + var(--ox)), calc(var(--y) + var(--oy)), 0);
  will-change: transform;

  /* helps on white */
  filter: contrast(1.08) saturate(1.05);
}

/* brighter specular highlight */
.ibb-bubble::after{
  content:"";
  position:absolute;
  inset: 12%;
  border-radius: inherit;
  background: radial-gradient(circle at 24% 24%, rgba(255,255,255,1), rgba(255,255,255,0) 60%);
  opacity: .95;
  filter: blur(.25px);
}

/* If you want them to blend less, comment this out */
.ibb-bubble-bg{
  mix-blend-mode: multiply;
}

@media (prefers-reduced-motion: reduce){
  .ibb-bubble{ transform: translate3d(var(--x), var(--y), 0); }
}