.embedding-orb {
  --orb-size: 190px;
  --orb-glow: rgba(98, 223, 255, 0.9);
  --orb-glow-soft: rgba(98, 223, 255, 0.22);
  --orb-core: rgba(190, 247, 255, 0.98);
  --orb-energy: 0.5;
  --orb-active: 0;
  position: relative;
  width: var(--orb-size);
  height: var(--orb-size);
  border-radius: 50%;
  color: #eefbff;
  isolation: isolate;
}

.embedding-orb__halo,
.embedding-orb__ring,
.embedding-orb__core,
.embedding-orb__caption {
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
}

.embedding-orb__halo {
  width: calc(var(--orb-size) * 1.15);
  height: calc(var(--orb-size) * 1.15);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(98, 223, 255, 0.22) 0%, rgba(98, 223, 255, 0.08) 36%, rgba(98, 223, 255, 0) 72%);
  filter: blur(16px);
  opacity: calc(0.26 + var(--orb-energy) * 0.34 + var(--orb-active) * 0.16);
}

.embedding-orb__ring {
  border-radius: 50%;
  border: 1px solid rgba(98, 223, 255, 0.22);
  box-shadow:
    0 0 18px rgba(98, 223, 255, 0.12),
    inset 0 0 14px rgba(98, 223, 255, 0.06);
  opacity: calc(0.5 + var(--orb-active) * 0.25);
}

.embedding-orb__ring--outer {
  width: calc(var(--orb-size) * 0.94);
  height: calc(var(--orb-size) * 0.94);
}

.embedding-orb__ring--inner {
  width: calc(var(--orb-size) * 0.68);
  height: calc(var(--orb-size) * 0.68);
}

.embedding-orb__core {
  width: calc(var(--orb-size) * 0.42);
  height: calc(var(--orb-size) * 0.42);
  border-radius: 50%;
  background:
    radial-gradient(circle, var(--orb-core) 0%, rgba(98, 223, 255, 0.92) 28%, rgba(36, 94, 140, 0.42) 62%, rgba(10, 18, 28, 0) 100%);
  box-shadow:
    0 0 18px rgba(98, 223, 255, 0.22),
    0 0 46px rgba(98, 223, 255, calc(0.12 + var(--orb-energy) * 0.16));
}

.embedding-orb__caption {
  top: calc(50% + var(--orb-size) * 0.22);
  width: calc(var(--orb-size) * 0.78);
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(6, 14, 24, 0.68);
  border: 1px solid rgba(110, 210, 255, 0.12);
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(10px);
  text-align: center;
}

.embedding-orb__word {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: lowercase;
}

.embedding-orb__meta {
  margin-top: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(217, 239, 255, 0.68);
}

.embedding-orb.is-query .embedding-orb__ring--outer {
  border-style: dashed;
}

.embedding-orb.is-distant {
  --orb-glow-soft: rgba(110, 150, 255, 0.18);
}