
.pp-widget-pearl-wrap{
 width:min(var(--ppw-size,340px),90vw);
 aspect-ratio:1;
 display:grid;
 place-items:center;
 margin-inline:auto;
}
.pp-widget-pearl{
 position:relative;
 width:100%;
 aspect-ratio:1;
 border-radius:50%;
 overflow:hidden;
 clip-path:circle(50% at 50% 50%);
 -webkit-clip-path:circle(50% at 50% 50%);
 background:
   radial-gradient(circle at 30% 22%,rgba(255,255,255,.98) 0 3%,rgba(255,255,255,.65) 9%,transparent 21%),
   radial-gradient(circle at 40% 62%,rgba(255,151,218,.22),transparent 35%),
   radial-gradient(circle at 69% 61%,rgba(138,172,255,.22),transparent 35%),
   radial-gradient(circle at 50% 46%,#fffafd 0 8%,#f2e7f1 34%,#d2bfd4 63%,#806d87 100%);
 box-shadow:
   inset -58px -40px 76px rgba(25,11,33,.52),
   inset 34px 24px 62px rgba(255,255,255,.84),
   0 28px 70px rgba(218,119,209,.20);
 contain:paint;
}
.pp-widget-marble{
 --ppw-x:0%;
 --ppw-strength:.78;
 position:absolute;
 left:-95%;
 top:-15%;
 width:300%;
 height:130%;
 background:
   radial-gradient(ellipse 17% 92% at 7% 50%,rgba(255,255,255,.56) 0 9%,rgba(255,155,224,.34) 18%,transparent 61%),
   radial-gradient(ellipse 23% 80% at 18% 47%,rgba(126,160,255,.34) 0 9%,rgba(255,255,255,.18) 22%,transparent 60%),
   radial-gradient(ellipse 13% 96% at 31% 51%,rgba(255,117,210,.48) 0 10%,rgba(255,255,255,.24) 21%,transparent 62%),
   radial-gradient(ellipse 27% 86% at 46% 49%,rgba(255,255,255,.48) 0 9%,rgba(165,131,255,.30) 20%,transparent 63%),
   radial-gradient(ellipse 18% 94% at 59% 52%,rgba(128,170,255,.40) 0 9%,rgba(255,155,221,.24) 23%,transparent 61%),
   radial-gradient(ellipse 24% 81% at 72% 48%,rgba(255,128,214,.44) 0 10%,rgba(255,255,255,.18) 22%,transparent 62%),
   radial-gradient(ellipse 15% 98% at 84% 51%,rgba(255,255,255,.52) 0 9%,rgba(139,168,255,.30) 23%,transparent 62%),
   repeating-linear-gradient(102deg,
      transparent 0 6%,
      rgba(255,255,255,.08) 8%,
      rgba(255,145,217,.10) 11%,
      rgba(138,170,255,.09) 14%,
      transparent 18% 27%);
 transform:translate3d(var(--ppw-x),0,0);
 mix-blend-mode:screen;
 opacity:var(--ppw-strength);
 will-change:transform;
 pointer-events:none;
}
.pp-widget-light{
 position:absolute;
 inset:0;
 border-radius:50%;
 background:
   radial-gradient(circle at 28% 20%,rgba(255,255,255,.72),transparent 16%),
   linear-gradient(90deg,
      rgba(25,11,33,.36) 0%,
      rgba(25,11,33,.08) 18%,
      transparent 36%,
      rgba(255,255,255,.05) 50%,
      transparent 64%,
      rgba(25,11,33,.12) 82%,
      rgba(25,11,33,.42) 100%),
   radial-gradient(ellipse at 50% 115%,rgba(28,13,36,.28),transparent 52%);
 mix-blend-mode:soft-light;
 pointer-events:none;
}
