@property --bubble-a{syntax:"<angle>";inherits:false;initial-value:135deg}.bubble{isolation:isolate;background:0 0;position:relative}.bubble:after{content:"";z-index:2;border-radius:inherit;background:linear-gradient(var(--bubble-a), var(--bubble-edge) 0%, transparent 50%, var(--bubble-edge) 100%);pointer-events:none;padding:2px;position:absolute;inset:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor,source-over;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.bubble-round:before{content:"";z-index:-1;background:var(--float-ink);border-radius:50%;transition:transform .3s ease-in-out;position:absolute;inset:15%;transform:scale(0);box-shadow:0 1rem 1rem #0000004d}.bubble-round svg{z-index:1;position:relative}@media (hover:hover) and (pointer:fine){.bubble-round:hover{color:var(--float-paper)}.bubble-round:hover:before{transform:scale(1)}.bubble-round:hover:after,.bubble-round:hover svg{animation-play-state:paused}}@media (prefers-reduced-motion:no-preference){.bubble:after{animation:5s linear infinite bubble-spin}.bubble-round svg{animation:3s infinite alternate bubble-nudge}}@keyframes bubble-spin{to{--bubble-a:495deg}}@keyframes bubble-nudge{90%{transform:none}95%{transform:translateY(var(--nudge,.4rem))}to{transform:none}}
