.orb{--orb-size:28px;width:var(--orb-size);height:var(--orb-size);background:radial-gradient(circle at 50% 55%, #fff0 45%, #ffffff38 100%), conic-gradient(from 200deg, var(--orb-1), var(--orb-2), var(--orb-3), var(--orb-4), var(--orb-5), var(--orb-6), var(--orb-1));border-radius:50%;flex:none;display:inline-block;position:relative;box-shadow:inset 0 0 0 .5px #ffffff8c,0 2px 10px #825aff47}.orb:before{content:"";background:radial-gradient(circle at 32% 28%,#ffffffe6,#ffffff47 20%,#fff0 46%);border-radius:50%;position:absolute;inset:0}.orb-halo:after{content:"";z-index:-1;background:conic-gradient(from 200deg, var(--orb-1), var(--orb-2), var(--orb-3), var(--orb-4), var(--orb-5), var(--orb-6), var(--orb-1));filter:blur(calc(var(--orb-size) * .32));opacity:.55;border-radius:50%;animation:6s ease-in-out infinite orb-breathe;position:absolute;inset:-18%}.orb-animated{animation:14s linear infinite orb-hue}@keyframes orb-breathe{50%{opacity:.32;transform:scale(1.12)}}@keyframes orb-hue{to{filter:hue-rotate(360deg)}}@media (prefers-reduced-motion:reduce){.orb-animated,.orb-halo:after{animation:none}}
