/* ─────────────────────────────────────────────────────────────
   Helix Orbs — animované stavové orby pre AI/loading stavy.
   Vanilla port konceptu "thinking-orbs" (Jakub Antalik, MIT)
   pre Helix owner PWA (bez Reactu). Stavy: thinking, searching,
   working, done. Rešpektuje prefers-reduced-motion.
   ───────────────────────────────────────────────────────────── */
.orb {
  --orb-size: 34px;
  --orb-dot: 3.5px;
  --orb-color: var(--green, #30d158);
  --orb-track: rgba(242, 244, 248, .14);
  position: relative;
  width: var(--orb-size);
  height: var(--orb-size);
  flex: none;
}
.orb__dot {
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--orb-dot);
  height: var(--orb-dot);
  margin: calc(var(--orb-dot) / -2);
  border-radius: 50%;
  background: var(--orb-color);
  opacity: .18;
  transform: rotate(calc(var(--i) * 30deg)) translateY(calc(var(--orb-size) / -2 + var(--orb-dot)));
}
.orb::after {
  content: "";
  position: absolute;
  inset: 28%;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 32%, rgba(255, 255, 255, .5), transparent 42%),
    radial-gradient(circle at 50% 55%, var(--orb-color), transparent 72%);
  opacity: .28;
  filter: blur(1px);
}

/* thinking — pomalý dýchajúci obeh */
.orb--thinking .orb__dot {
  animation: orb-think 2.6s calc(var(--i) * -.216s) ease-in-out infinite;
}
@keyframes orb-think {
  0%, 100% { opacity: .14; transform: rotate(calc(var(--i) * 30deg)) translateY(calc(var(--orb-size) / -2 + var(--orb-dot))) scale(.7); }
  40% { opacity: 1; transform: rotate(calc(var(--i) * 30deg)) translateY(calc(var(--orb-size) / -2 + var(--orb-dot))) scale(1.25); }
}

/* searching — skenovacia vlna tam a späť */
.orb--searching { --orb-color: var(--blue, #64d2ff); }
.orb--searching .orb__dot {
  animation: orb-search 1.5s calc(var(--i) * -.125s) ease-in-out infinite;
}
@keyframes orb-search {
  0%, 60%, 100% { opacity: .12; }
  25% { opacity: 1; }
}

/* working — rýchly obeh s chvostom */
.orb--working { --orb-color: var(--green-soft, #7ee2a0); }
.orb--working .orb__dot {
  animation: orb-work .9s calc(var(--i) * -.075s) linear infinite;
}
@keyframes orb-work {
  0% { opacity: 1; }
  100% { opacity: .08; }
}

/* done — jeden zelený impulz, potom ticho */
.orb--done .orb__dot {
  animation: orb-done .7s calc(var(--i) * .03s) ease-out both;
}
@keyframes orb-done {
  0% { opacity: 1; transform: rotate(calc(var(--i) * 30deg)) translateY(calc(var(--orb-size) / -2 + var(--orb-dot))) scale(1.2); }
  100% { opacity: .55; transform: rotate(calc(var(--i) * 30deg)) translateY(calc(var(--orb-size) / -2 + var(--orb-dot))) scale(.9); }
}

/* zložený stav: orb + label (mono, smer A) */
.orb-status {
  display: flex;
  align-items: center;
  gap: 12px;
}
.orb-status__label {
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 11px;
  letter-spacing: .06em;
  color: var(--txt-2, rgba(242, 244, 248, .62));
}
.orb-status--center {
  flex-direction: column;
  justify-content: center;
  gap: 14px;
  padding: 28px 16px;
  text-align: center;
}
.orb-status--lg .orb { --orb-size: 46px; --orb-dot: 4.5px; }

@media (prefers-reduced-motion: reduce) {
  .orb .orb__dot { animation: none !important; opacity: .5; }
}
