/* ============================================================
   Jarvis — the orb
   A generative wire-sphere: filament shells, bold orbits, a
   radial burst, drifting motes and a hot core. Each shell is an
   independently rotating SVG layer, so the whole thing is never
   in the same position twice.
   ============================================================ */

.orb{position:relative;flex-shrink:0}
.orb-layer{position:absolute;inset:0;width:100%;height:100%;transform-origin:50% 50%}
.orb-layer path,.orb-layer circle{vector-effect:non-scaling-stroke}

/* shells — slow, dense, barely there */
.orb-wire-a{animation:spin 110s linear infinite}
.orb-wire-b{animation:spinR 74s linear infinite}
.orb-wire-c{animation:spin 52s linear infinite}

/* the radial burst of filaments */
.orb-burst{animation:spinR 150s linear infinite;opacity:.9}

/* three bold orbits, each on its own clock */
.orb-ring-1{animation:spin 34s linear infinite}
.orb-ring-2{animation:spinR 23s linear infinite}
.orb-ring-3{animation:spin 15s linear infinite}

/* the tangled knot at the centre */
.orb-knot{animation:spinR 19s linear infinite}

/* loose motes riding the shells */
.orb-motes{animation:spin 64s linear infinite}

/* the core */
.orb-core{position:absolute;border-radius:50%;
  background:radial-gradient(circle at 36% 30%,
    #FFFFFF 0%, #FFF6DC 9%, #FFD04A 34%, #E8920C 58%, rgba(150,88,6,.34) 82%, rgba(150,88,6,0) 100%);
  box-shadow:0 0 70px rgba(245,179,18,.8), 0 0 160px rgba(224,122,46,.45),
             inset 0 0 44px rgba(255,255,255,.34);
  animation:core 4.6s ease-in-out infinite}
.orb-sheen{position:absolute;border-radius:50%;mix-blend-mode:screen;
  background:conic-gradient(from 0deg, rgba(255,255,255,0), rgba(255,246,214,.55),
             rgba(255,208,74,0) 52%, rgba(255,255,255,0));
  animation:spin 7s linear infinite}
.orb-halo{position:absolute;border-radius:50%;border:1px solid rgba(245,179,18,.5);
  animation:halo 3.4s ease-out infinite}
.orb-halo.b{animation-delay:1.7s;border-color:rgba(255,214,120,.42)}

/* the pool of light the orb sits in */
.orb-pool{position:absolute;border-radius:50%;pointer-events:none;filter:blur(30px);
  background:radial-gradient(circle, rgba(245,179,18,.4), rgba(245,179,18,0) 66%);
  animation:core 6.5s ease-in-out infinite}

/* states ---------------------------------------------------- */
/* listening: calm, open */
.orb.is-listening .orb-core{animation-duration:5.2s}
/* thinking: the shells tighten and speed up */
.orb.is-thinking .orb-wire-b{animation-duration:26s}
.orb.is-thinking .orb-ring-3{animation-duration:7s}
/* speaking: the core pulses with the voice */
.orb.is-speaking .orb-core{animation-duration:1.7s}
.orb.is-speaking .orb-sheen{animation-duration:3.4s}

@keyframes halo{0%{transform:scale(.72);opacity:.55}100%{transform:scale(1.62);opacity:0}}

/* ---- the small mark: the same sphere, shrunk ----
   Used top-left in the sidebar and anywhere Jarvis signs his name. */
.jv-mark svg,.orb-mini svg{position:absolute;inset:0;width:100%;height:100%}
.jv-mark .m-a,.orb-mini .m-a{animation:spin 28s linear infinite}
.jv-mark .m-b,.orb-mini .m-b{animation:spinR 13s linear infinite}
.jv-mark .m-glow,.orb-mini .m-glow{position:absolute;inset:-7px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle, rgba(245,179,18,.45), rgba(245,179,18,0) 68%);filter:blur(6px);
  animation:core 5s ease-in-out infinite}
.jv-mark .m-core,.orb-mini .m-core{position:absolute;inset:34%;border-radius:50%;
  background:radial-gradient(circle at 35% 29%, #fff, #FFF3D0 14%, #FFD04A 46%, #E8920C 76%);
  box-shadow:0 0 16px rgba(245,179,18,.85), inset 0 0 6px rgba(255,255,255,.5);
  animation:core 4.4s ease-in-out infinite}
.orb-mini{position:relative;flex-shrink:0}

/* the twin waveform used while a conversation is open */
.wave{display:flex;align-items:center;gap:3px;height:28px}
.wave i{display:block;width:3px;height:28px;border-radius:2px;transform-origin:center;
  animation:bars 1s ease-in-out infinite}
.wave.is-quiet i{animation-play-state:paused;transform:scaleY(.12);opacity:.45}