/* FG liquid voice orb. One component is shared by the landing and onboarding. */
.fg-liquid-orb{
  --fg-liquid-orb-size:150px;
  --fg-liquid-orb-glow:rgba(58,107,255,.3);
  --fg-liquid-orb-speed:2.6s;
  --fg-liquid-orb-speed-2:3.4s;
  --fg-liquid-orb-blur:6px;
  --fg-liquid-orb-blur-soft:9px;
  --fg-liquid-orb-inner-glow:40px;
  --fg-liquid-orb-outer-glow:70px;
  position:relative;display:block;width:var(--fg-liquid-orb-size);height:var(--fg-liquid-orb-size);
  flex:none;overflow:hidden;border:1px solid rgba(139,180,255,.18);border-radius:999px;
  background:#0a0f1e;box-shadow:0 0 var(--fg-liquid-orb-outer-glow) var(--fg-liquid-orb-glow);
  transition:box-shadow .5s,opacity .35s
}
.fg-liquid-orb__blob{
  position:absolute;inset:14%;background:linear-gradient(135deg,#8BB4FF,#3A6BFF 45%,#a896ff);
  filter:blur(var(--fg-liquid-orb-blur));box-shadow:0 0 var(--fg-liquid-orb-inner-glow) rgba(58,107,255,.6);
  animation:fgLiquidOrbMorph var(--fg-liquid-orb-speed) linear infinite
}
.fg-liquid-orb__blob--soft{
  inset:24%;background:linear-gradient(315deg,rgba(127,222,240,.95),rgba(206,223,254,.45));
  filter:blur(var(--fg-liquid-orb-blur-soft));mix-blend-mode:screen;
  animation-duration:var(--fg-liquid-orb-speed-2);animation-direction:reverse
}
.fg-liquid-orb__shine{
  position:absolute;inset:0;border-radius:999px;
  background:radial-gradient(circle at 36% 26%,rgba(255,255,255,.28),rgba(255,255,255,0) 42%);
  pointer-events:none
}
.fg-liquid-orb--compact{
  --fg-liquid-orb-blur:2px;--fg-liquid-orb-blur-soft:3px;
  --fg-liquid-orb-inner-glow:16px;--fg-liquid-orb-outer-glow:26px
}
.fg-liquid-orb--large{
  --fg-liquid-orb-blur:8px;--fg-liquid-orb-blur-soft:12px;
  --fg-liquid-orb-inner-glow:52px;--fg-liquid-orb-outer-glow:90px
}
.fg-liquid-orb[data-state="listening"]{--fg-liquid-orb-glow:rgba(163,217,119,.35)}
.fg-liquid-orb[data-state="thinking"]{--fg-liquid-orb-speed:2.1s;--fg-liquid-orb-speed-2:2.8s}
.fg-liquid-orb[data-state="speaking"]{
  --fg-liquid-orb-glow:rgba(168,150,255,.42);--fg-liquid-orb-speed:1.55s;--fg-liquid-orb-speed-2:2.05s
}
@keyframes fgLiquidOrbMorph{
  0%,100%{border-radius:46% 54% 52% 48%/48% 46% 54% 52%;transform:rotate(0deg)}
  33%{border-radius:60% 40% 44% 56%/52% 62% 38% 48%;transform:rotate(120deg)}
  66%{border-radius:42% 58% 55% 45%/55% 42% 58% 45%;transform:rotate(240deg)}
}
@media(prefers-reduced-motion:reduce){
  .fg-liquid-orb__blob{animation:none}
}