/* ═══════════════════════════════════════════════════════
   IKIGAI · Orb visual styles
   ═══════════════════════════════════════════════════════ */

.living-orb {
  position: relative;
  width: var(--orb-size);
  height: var(--orb-size);
  pointer-events: none;
  transform: translate3d(var(--ox, 0), var(--oy, 0), 0);
  transition: filter 1.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.living-orb > * {
  position: absolute;
  inset: 0;
  border-radius: 50%;
}

/* ── outer corona (slow breathing halo) ───────── */
.orb-corona {
  background: radial-gradient(
    circle at 50% 50%,
    color-mix(in oklab, var(--orb-halo) 22%, transparent) 0%,
    color-mix(in oklab, var(--orb-core) 10%, transparent) 35%,
    transparent 70%
  );
  filter: blur(28px);
  animation: breathe 8s ease-in-out infinite;
  transform-origin: center;
  transition: background 1.2s ease;
}

/* ── atmosphere (slow rotating gradient) ───────── */
.orb-atmosphere {
  background: conic-gradient(
    from 0deg,
    color-mix(in oklab, var(--orb-core) 18%, transparent) 0%,
    color-mix(in oklab, var(--orb-ring) 26%, transparent) 25%,
    color-mix(in oklab, var(--orb-halo) 18%, transparent) 50%,
    color-mix(in oklab, var(--orb-core) 22%, transparent) 75%,
    color-mix(in oklab, var(--orb-ring) 18%, transparent) 100%
  );
  filter: blur(18px);
  animation: spin-slow 32s linear infinite;
  opacity: 0.85;
  transition: background 1.2s ease;
}

/* ── orbital rings ─────────────────────────────── */
.orb-ring {
  border: 1px solid color-mix(in oklab, var(--orb-ring) 32%, transparent);
  background: transparent;
  transform-origin: center;
}
.orb-ring--1 {
  inset: 14%;
  animation: spin-slow 60s linear infinite;
  border-color: color-mix(in oklab, var(--orb-ring) 28%, transparent);
}
.orb-ring--2 {
  inset: 4%;
  animation: spin-rev 90s linear infinite;
  border-color: color-mix(in oklab, var(--orb-halo) 22%, transparent);
  transform: rotate(35deg);
}
.orb-ring--3 {
  inset: 22%;
  animation: spin-slow 45s linear infinite;
  border-color: color-mix(in oklab, var(--orb-core) 22%, transparent);
}
.orb-ring__dot {
  position: absolute;
  top: -3px; left: 50%;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--orb-core);
  box-shadow: 0 0 12px var(--orb-core);
  transform: translateX(-50%);
}

/* ── core ──────────────────────────────────────── */
.orb-core {
  inset: 30%;
  animation: breathe 4s ease-in-out infinite;
  border-radius: 50%;
  overflow: hidden;
}
.orb-core__glow {
  background: radial-gradient(
    circle at 35% 35%,
    rgba(255,255,255,0.95) 0%,
    color-mix(in oklab, var(--orb-core) 60%, white) 15%,
    color-mix(in oklab, var(--orb-core) 80%, transparent) 50%,
    color-mix(in oklab, var(--orb-halo) 60%, transparent) 90%
  );
  filter: blur(2px);
  transition: background 1s ease;
}
.orb-core__inner {
  inset: 18%;
  background: radial-gradient(
    circle at 40% 40%,
    rgba(255,255,255,1) 0%,
    color-mix(in oklab, var(--orb-core) 50%, white) 30%,
    color-mix(in oklab, var(--orb-core) 80%, transparent) 70%
  );
  animation: breathe 2.8s ease-in-out infinite;
  animation-delay: -1s;
  transition: background 1s ease;
}
.orb-core__highlight {
  inset: 8% auto auto 12%;
  width: 30%; height: 22%;
  background: radial-gradient(ellipse, rgba(255,255,255,0.85), transparent 70%);
  filter: blur(4px);
  border-radius: 50%;
  transform: rotate(-15deg);
}

/* ── State accessories ─────────────────────────── */

/* scattered fragments */
.orb-fragments {
  inset: 0;
}
.orb-fragment {
  position: absolute;
  width: 14px; height: 14px;
  top: 50%; left: 50%;
  background: color-mix(in oklab, var(--orb-halo) 70%, transparent);
  border-radius: 3px;
  filter: blur(0.5px);
  --angle: calc(var(--i) * 45deg);
  --dist: calc(var(--orb-size) * 0.42);
  transform: translate(-50%, -50%) rotate(var(--angle)) translateX(var(--dist)) rotate(45deg);
  opacity: 0.65;
  animation: float-y 3.6s ease-in-out infinite;
  animation-delay: calc(var(--i) * -0.3s);
}

/* neural network */
.orb-neural {
  inset: 0;
  width: 100%;
  height: 100%;
  animation: spin-slow 40s linear infinite;
}

/* shield */
.orb-shield { inset: -10%; }
.orb-shield__layer {
  position: absolute;
  inset: 0;
  border: 1.5px solid color-mix(in oklab, var(--orb-core) 50%, transparent);
  border-radius: 50%;
  animation: pulse-ring 3s ease-out infinite;
}

/* access rings */
.orb-access-rings { inset: 0; }
.orb-access-ring {
  position: absolute;
  inset: 0;
  border: 1px solid color-mix(in oklab, var(--orb-ring) 30%, transparent);
  border-radius: 50%;
  transform: scale(var(--s));
  animation: breathe 5s ease-in-out infinite;
  animation-delay: var(--d);
}

/* pages around orb */
.orb-pages { inset: 0; animation: spin-slow 28s linear infinite; }
.orb-page {
  position: absolute;
  top: 50%; left: 50%;
  width: 30px; height: 38px;
  background: linear-gradient(180deg, rgba(255,255,255,0.95), rgba(220,230,255,0.85));
  border: 1px solid rgba(110,168,255,0.3);
  border-radius: 4px;
  box-shadow: 0 4px 16px rgba(110,168,255,0.18);
  --angle: calc(var(--i) * 120deg);
  --dist: calc(var(--orb-size) * 0.48);
  transform: translate(-50%, -50%) rotate(var(--angle)) translateX(var(--dist)) rotate(calc(var(--angle) * -1));
}

/* layered memory */
.orb-layers { inset: 0; }
.orb-layer {
  position: absolute;
  left: 10%; right: 10%;
  height: 4px;
  background: linear-gradient(90deg, transparent, color-mix(in oklab, var(--orb-core) 45%, transparent), transparent);
  border-radius: 4px;
  top: calc(50% - 18px + var(--i) * 12px);
  animation: float-y 4s ease-in-out infinite;
  animation-delay: calc(var(--i) * -0.5s);
}

/* architecture grid */
.orb-grid { inset: 20%; }
.orb-grid__line {
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in oklab, var(--orb-core) 55%, transparent), transparent);
  top: calc(var(--i) * 25%);
  animation: float-y 6s ease-in-out infinite;
  animation-delay: calc(var(--i) * -0.4s);
}

/* pulse rings for AI states */
.orb-pulse-rings { inset: 0; }
.orb-pulse-ring {
  position: absolute;
  inset: 0;
  border: 1.5px solid color-mix(in oklab, var(--orb-core) 60%, transparent);
  border-radius: 50%;
  animation: pulse-ring 2.4s ease-out infinite;
  transform-origin: center;
}

/* state-specific filter tweaks */
.living-orb--listening   { filter: brightness(1.06); }
.living-orb--thinking    { filter: hue-rotate(-10deg); }
.living-orb--searching   { filter: brightness(1.08) saturate(1.1); }
.living-orb--responding  { filter: brightness(1.12) saturate(1.15); }
.living-orb--scattered   { filter: blur(0.4px) brightness(0.95); }
.living-orb--stable      { filter: brightness(1.04) saturate(0.9); }