/**
 * Wefi, the assistant's face: a light core with the WF monogram and a living
 * ring, copied from WeFixed OS (src/components/WefiOrb.tsx and the .wefi-orb
 * rules in src/app/globals.css) so the site and the app show the same
 * character with the same moods. Copied, not re-drawn: when the app's orb
 * changes, copy its rules over these again.
 *
 * The app's brand token is --primary; on the site it is the theme accent.
 * Moods are set by data-state, which wefi-orb.js drives (one reel for the page).
 * Motion does not follow the OS reduce-motion setting: the owner's rule for his
 * sites is that only their own switch stops animation.
 */
.wefi-orb { --primary: var(--accent-base, #3b6fe5); }
.wefi-orb {
  position: relative;
  display: grid;
  place-items: center;
  width: var(--wefi-size, 40px);
  height: var(--wefi-size, 40px);
  flex: none;
}
.wefi-orb__ring {
  position: absolute;
  inset: calc(var(--wefi-size) * -0.04);
  border-radius: 9999px;
  /*
   * Рисунок кольца и время оборота лежат в переменных, а крутится слой
   * ::before. Так сделано в приложении (WeFixed OS 1.767): пока вращение и
   * свечение сидели на одном элементе, смена свечения на каждом выражении
   * снимала кольцо с видеокарты, и страница пересчитывалась процессором.
   */
  --wefi-ring: conic-gradient(from 0deg, #3b82f6, #8b5cf6, #22d3ee, #3b82f6);
  /* 7 с вместо 12: владелец просил, чтобы переливание в покое было заметнее. */
  --wefi-turn: 7s;
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.18) rgba(96, 140, 255, 0.6));
  transition: inset 160ms ease;
}
.wefi-orb__ring::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--wefi-ring);
  animation: wefi-spin var(--wefi-turn) linear infinite;
}
.wefi-orb__core {
  position: absolute;
  inset: calc(var(--wefi-size) * 0.08);
  border-radius: 9999px;
  /*
   * Светлое ядро с монограммой WF вместо тёмного с буквой.
   *
   * ПОПРОШЕНО ВЛАДЕЛЬЦЕМ 08.09.2026 после отзыва тестера: «поменять иконку
   * на монограмму нашу... внутри круга белый фон или чуть минеральный и
   * монограмма WF». Фон не чисто белый, а с каплей бренда, чтобы на белой
   * шапке ядро не сливалось с ней; в тёмной теме оно остаётся светлым
   * нарочно: это и есть знак, а не элемент интерфейса, который перекрашивают.
   */
  background: color-mix(in oklch, var(--primary) 5%, #ffffff);
  color: #0d1220;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.wefi-orb__mark {
  /* Монограмма шире, чем выше (803×328): ширина ведёт, высота следует. */
  /* +10 % по просьбе владелца 08.09.2026: буквы были мелковаты. */
  width: 68%;
  height: auto;
  display: block;
  pointer-events: none;
  user-select: none;
}
.wefi-orb__halo {
  position: absolute;
  inset: calc(var(--wefi-size) * -0.15);
  border-radius: 9999px;
  border: 2px solid rgba(140, 160, 255, 0.7);
  opacity: 0;
}
.wefi-orb__badge {
  position: absolute;
  top: calc(var(--wefi-size) * -0.1);
  right: calc(var(--wefi-size) * -0.15);
  min-width: calc(var(--wefi-size) * 0.45);
  height: calc(var(--wefi-size) * 0.45);
  padding: 0 0.3em;
  border-radius: 9999px;
  background: #ff5a5f;
  color: #fff;
  font-size: calc(var(--wefi-size) * 0.27);
  font-weight: 700;
  display: grid;
  place-items: center;
  box-shadow: 0 0 0 2px #121a36;
}
button:active > .wefi-orb .wefi-orb__ring,
button:active > * > .wefi-orb .wefi-orb__ring {
  inset: calc(var(--wefi-size) * -0.1);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.35) rgba(120, 150, 255, 0.95));
  --wefi-turn: 1.6s;
  transition: inset 160ms ease, filter 160ms ease;
}
.wefi-orb[data-state="listening"] .wefi-orb__ring {
  --wefi-turn: 1.4s;
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.3) rgba(120, 150, 255, 0.9));
}
.wefi-orb[data-state="listening"] .wefi-orb__halo {
  animation: wefi-halo 1.2s ease-out infinite;
}
.wefi-orb[data-state="thinking"] .wefi-orb__ring {
  --wefi-turn: 0.9s;
  --wefi-ring: conic-gradient(from 0deg, #3b82f6 0 60%, transparent 60% 70%, #22d3ee 70% 100%);
}
.wefi-orb__mark {
  transition: opacity 220ms ease, transform 220ms ease;
}
.wefi-orb__face {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 220ms ease;
  pointer-events: none;
}
.wefi-orb__eye {
  position: absolute;
  top: 38%;
  width: calc(var(--wefi-size) * 0.13);
  height: calc(var(--wefi-size) * 0.22);
  border-radius: 9999px;
  background: linear-gradient(180deg, #3b82f6, #7c5cff);
  box-shadow: 0 0 calc(var(--wefi-size) * 0.08) rgba(96, 140, 255, 0.75);
  transform-origin: center;
  animation: wefi-blink 4.4s ease-in-out infinite;
}
.wefi-orb__eye--l { left: 29%; }
.wefi-orb__eye--r { right: 29%; animation-delay: 0.15s; }
.wefi-orb__scan {
  position: absolute;
  left: 10%;
  right: 10%;
  top: -20%;
  height: 12%;
  border-radius: 9999px;
  background: linear-gradient(90deg, transparent, rgba(34, 211, 238, 0.95), transparent);
  opacity: 0;
}
.wefi-orb__spark {
  position: absolute;
  left: 50%;
  top: calc(var(--wefi-size) * -0.2);
  width: calc(var(--wefi-size) * 0.28);
  height: calc(var(--wefi-size) * 0.28);
  margin-left: calc(var(--wefi-size) * -0.14);
  border-radius: 9999px;
  background: radial-gradient(circle at 50% 50%, #fef3c7, #f59e0b 52%, transparent 72%);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.16) rgba(250, 204, 21, 0.8));
  opacity: 0;
  pointer-events: none;
}
.wefi-orb__zz {
  position: absolute;
  right: 4%;
  top: -6%;
  font-size: calc(var(--wefi-size) * 0.28);
  font-weight: 700;
  line-height: 1;
  color: #3b82f6;
  opacity: 0;
  pointer-events: none;
}
.wefi-orb:not([data-state="idle"]):not([data-state="answer"]) .wefi-orb__face,
.wefi-orb[data-face] .wefi-orb__face {
  opacity: 1;
}
.wefi-orb:not([data-state="idle"]):not([data-state="answer"]) .wefi-orb__mark,
.wefi-orb[data-face] .wefi-orb__mark {
  opacity: 0;
  transform: scale(0.8);
}
.wefi-orb[data-face][data-state="idle"] .wefi-orb__core {
  animation: wefi-breathe 3.6s ease-in-out infinite;
}
.wefi-orb[data-state="listening"] .wefi-orb__eye {
  transform: translateY(-8%) scale(1.1);
  animation: none;
}
.wefi-orb[data-state="thinking"] .wefi-orb__eye {
  animation: wefi-think 2.6s ease-in-out infinite;
}
.wefi-orb[data-state="scanning"] .wefi-orb__scan {
  opacity: 1;
  animation: wefi-scan 1.1s linear infinite;
}
.wefi-orb[data-state="scanning"] .wefi-orb__eye {
  animation: wefi-look 1.1s ease-in-out infinite;
}
.wefi-orb[data-state="scanning"] .wefi-orb__ring {
  --wefi-turn: 1.4s;
  --wefi-ring: conic-gradient(from 0deg, #22d3ee, #3b82f6, #22d3ee);
}
.wefi-orb[data-state="working"] .wefi-orb__eye {
  animation: wefi-squint 1.6s ease-in-out infinite;
}
.wefi-orb[data-state="working"] .wefi-orb__ring {
  --wefi-turn: 1.2s;
  --wefi-ring: conic-gradient(from 0deg, #3b82f6 0 25%, transparent 25% 33%, #8b5cf6 33% 58%, transparent 58% 66%, #22d3ee 66% 91%, transparent 91% 100%);
}
.wefi-orb[data-state="happy"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.11);
  border-radius: 9999px 9999px 0 0;
  background: #3b82f6;
  animation: wefi-bounce 0.9s ease-in-out infinite;
}
.wefi-orb[data-state="happy"] .wefi-orb__ring {
  --wefi-turn: 2s;
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.3) rgba(52, 199, 89, 0.8));
}
.wefi-orb[data-state="wink"] .wefi-orb__eye--r {
  animation: wefi-wink 1.2s ease-in-out infinite;
}
.wefi-orb[data-state="wink"] .wefi-orb__ring {
  --wefi-turn: 3.4s;
}
.wefi-orb[data-state="idea"] .wefi-orb__eye {
  transform: translateY(-16%) scale(1.1);
  animation: none;
}
.wefi-orb[data-state="idea"] .wefi-orb__spark {
  animation: wefi-spark 1.9s ease-out infinite;
}
.wefi-orb[data-state="idea"] .wefi-orb__ring {
  --wefi-turn: 2.6s;
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.3) rgba(250, 204, 21, 0.7));
}
.wefi-orb[data-state="curious"] .wefi-orb__eye {
  animation: wefi-curious 1.8s ease-in-out infinite;
}
.wefi-orb[data-state="curious"] .wefi-orb__ring {
  --wefi-turn: 5s;
}
.wefi-orb[data-state="excited"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.26);
  animation: wefi-excited 0.7s ease-in-out infinite;
}
.wefi-orb[data-state="excited"] .wefi-orb__ring {
  --wefi-turn: 1.1s;
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.32) rgba(120, 150, 255, 0.95));
}
.wefi-orb[data-state="smile"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.11);
  border-radius: 9999px 9999px 0 0;
  background: #3b82f6;
  animation: none;
}
.wefi-orb[data-state="smile"] .wefi-orb__core {
  animation: wefi-breathe 2.4s ease-in-out infinite;
}
.wefi-orb[data-state="smile"] .wefi-orb__ring {
  --wefi-turn: 6s;
}
.wefi-orb[data-state="flirt"] .wefi-orb__eye--l {
  height: calc(var(--wefi-size) * 0.11);
  border-radius: 9999px 9999px 0 0;
  background: #3b82f6;
  animation: none;
}
.wefi-orb[data-state="flirt"] .wefi-orb__eye--r {
  animation: wefi-flirt 1.5s ease-in-out infinite;
}
.wefi-orb[data-state="flirt"] .wefi-orb__ring {
  --wefi-turn: 3s;
  --wefi-ring: conic-gradient(from 0deg, #f472b6, #8b5cf6, #3b82f6, #f472b6);
}
.wefi-orb[data-state="spin"] .wefi-orb__eye {
  animation: wefi-orbit 1.6s linear infinite;
}
.wefi-orb[data-state="spin"] .wefi-orb__eye--r {
  animation-delay: -0.8s;
}
.wefi-orb[data-state="spin"] .wefi-orb__ring {
  --wefi-turn: 0.8s;
}
.wefi-orb[data-state="surprised"] .wefi-orb__eye {
  animation: wefi-surprise 1.1s ease-out infinite;
}
.wefi-orb[data-state="surprised"] .wefi-orb__ring {
  --wefi-turn: 2.2s;
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.34) rgba(148, 180, 255, 0.95));
}
.wefi-orb[data-state="confused"] .wefi-orb__core {
  animation: wefi-tilt 1.6s ease-in-out infinite;
}
.wefi-orb[data-state="confused"] .wefi-orb__eye--l {
  height: calc(var(--wefi-size) * 0.3);
  animation: none;
}
.wefi-orb[data-state="confused"] .wefi-orb__eye--r {
  height: calc(var(--wefi-size) * 0.14);
  animation: none;
}
.wefi-orb[data-state="confused"] .wefi-orb__ring {
  --wefi-turn: 8s;
}
.wefi-orb[data-state="cool"] .wefi-orb__eye {
  transform: scaleY(0.4);
  animation: none;
}
.wefi-orb[data-state="cool"] .wefi-orb__scan {
  opacity: 1;
  top: 34%;
  animation: wefi-glint 1.5s ease-in-out infinite;
}
.wefi-orb[data-state="cool"] .wefi-orb__ring {
  --wefi-turn: 4s;
}
.wefi-orb[data-state="thinking"] .wefi-orb__core {
  animation: wefi-lean 2.6s ease-in-out infinite;
}
.wefi-orb[data-state="scanning"] .wefi-orb__core {
  animation: wefi-sweep 1.6s ease-in-out infinite;
}
.wefi-orb[data-state="working"] .wefi-orb__core {
  animation: wefi-work 1.2s ease-in-out infinite;
}
.wefi-orb[data-state="happy"] .wefi-orb__core,
.wefi-orb[data-state="excited"] .wefi-orb__core {
  animation: wefi-hop 0.7s ease-in-out infinite;
}
.wefi-orb[data-state="idea"] .wefi-orb__core {
  animation: wefi-pop 1.9s ease-out infinite;
}
.wefi-orb[data-state="curious"] .wefi-orb__core {
  animation: wefi-turn 1.8s ease-in-out infinite;
}
.wefi-orb[data-state="surprised"] .wefi-orb__core {
  animation: wefi-jolt 1.1s ease-out infinite;
}
.wefi-orb[data-state="cool"] .wefi-orb__core {
  animation: wefi-lean-back 3s ease-in-out infinite;
}
.wefi-orb[data-state="flirt"] .wefi-orb__core {
  animation: wefi-lean 3s ease-in-out infinite;
}
.wefi-orb[data-state="spin"] .wefi-orb__core {
  animation: wefi-roll 2s linear infinite;
}
.wefi-orb[data-state="wink"] .wefi-orb__core {
  animation: wefi-nudge 1.2s ease-in-out infinite;
}
.wefi-orb[data-state="nod"] .wefi-orb__core {
  animation: wefi-nod 0.85s ease-in-out infinite;
}
.wefi-orb[data-state="nod"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.11);
  border-radius: 9999px 9999px 0 0;
  background: #3b82f6;
  animation: none;
}
.wefi-orb[data-state="nope"] .wefi-orb__core {
  animation: wefi-shake 0.7s ease-in-out infinite;
}
.wefi-orb[data-state="nope"] .wefi-orb__eye {
  transform: scaleY(0.45);
  animation: none;
}
.wefi-orb[data-state="nope"] .wefi-orb__ring {
  --wefi-turn: 9s;
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.14) rgba(148, 163, 184, 0.5));
}
.wefi-orb[data-state="love"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.13);
  border-radius: 9999px 9999px 0 0;
  background: #f472b6;
  animation: none;
}
.wefi-orb[data-state="love"] .wefi-orb__core {
  animation: wefi-hop 1.1s ease-in-out infinite;
}
.wefi-orb[data-state="love"] .wefi-orb__ring {
  --wefi-turn: 3.4s;
  --wefi-ring: conic-gradient(from 0deg, #f472b6, #fb7185, #c084fc, #f472b6);
}
.wefi-orb[data-state="love"] .wefi-orb__spark {
  background: radial-gradient(circle at 50% 50%, #fecdd3, #f43f5e 55%, transparent 72%);
  animation: wefi-spark 2s ease-out infinite;
}
.wefi-orb[data-state="surprised"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.2);
  height: calc(var(--wefi-size) * 0.2);
  border-radius: 9999px;
}
.wefi-orb[data-state="excited"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.16);
  box-shadow: 0 0 calc(var(--wefi-size) * 0.16) rgba(96, 140, 255, 0.95);
}
.wefi-orb[data-state="curious"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.1);
  height: calc(var(--wefi-size) * 0.16);
}
.wefi-orb[data-state="thinking"] .wefi-orb__eye--r {
  height: calc(var(--wefi-size) * 0.16);
}
.wefi-orb[data-state="working"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.17);
  height: calc(var(--wefi-size) * 0.08);
  border-radius: 9999px;
}
.wefi-orb[data-state="scanning"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.11);
  background: linear-gradient(180deg, #22d3ee, #3b82f6);
}
.wefi-orb[data-state="nope"] .wefi-orb__eye--l { left: 26%; }
.wefi-orb[data-state="nope"] .wefi-orb__eye--r { right: 26%; }
.wefi-orb[data-state="spin"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.12);
  height: calc(var(--wefi-size) * 0.12);
  border-radius: 9999px;
}
.wefi-orb[data-state="thinking"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #6366f1 0 55%, transparent 55% 68%, #a78bfa 68% 100%);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.22) rgba(129, 140, 248, 0.85));
}
.wefi-orb[data-state="scanning"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #22d3ee, #38bdf8, #22d3ee);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.26) rgba(34, 211, 238, 0.9));
}
.wefi-orb[data-state="working"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #f59e0b 0 25%, transparent 25% 33%, #fbbf24 33% 58%, transparent 58% 66%, #f97316 66% 91%, transparent 91% 100%);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.24) rgba(245, 158, 11, 0.8));
}
.wefi-orb[data-state="happy"] .wefi-orb__ring,
.wefi-orb[data-state="nod"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #34c759, #4ade80, #22d3ee, #34c759);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.28) rgba(52, 199, 89, 0.85));
}
.wefi-orb[data-state="excited"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #38bdf8, #818cf8, #f472b6, #38bdf8);
}
.wefi-orb[data-state="smile"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #2dd4bf, #60a5fa, #2dd4bf);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.2) rgba(45, 212, 191, 0.7));
}
.wefi-orb[data-state="wink"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #6366f1, #22d3ee, #6366f1);
}
.wefi-orb[data-state="curious"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #7dd3fc, #a7f3d0, #7dd3fc);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.2) rgba(125, 211, 252, 0.8));
}
.wefi-orb[data-state="spin"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #ef4444, #f59e0b, #34c759, #22d3ee, #6366f1, #d946ef, #ef4444);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.26) rgba(168, 85, 247, 0.8));
}
.wefi-orb[data-state="surprised"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #ffffff, #93c5fd, #ffffff);
}
.wefi-orb[data-state="confused"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #94a3b8, #cbd5e1, #94a3b8);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.12) rgba(148, 163, 184, 0.6));
}
.wefi-orb[data-state="cool"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #1e3a8a, #64748b, #0ea5e9, #1e3a8a);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.2) rgba(14, 165, 233, 0.7));
}
.wefi-orb[data-state="nope"] .wefi-orb__ring {
  --wefi-ring: conic-gradient(from 0deg, #f43f5e, #fb7185, #f43f5e);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.22) rgba(244, 63, 94, 0.75));
}
.wefi-orb[data-state="working"] .wefi-orb__eye {
  background: linear-gradient(180deg, #f59e0b, #f97316);
}
.wefi-orb[data-state="nope"] .wefi-orb__eye {
  background: #f43f5e;
}
.wefi-orb[data-state="confused"] .wefi-orb__eye {
  background: #64748b;
}
.wefi-orb[data-state="cool"] .wefi-orb__eye {
  background: #0ea5e9;
}
.wefi-orb[data-state="nod"] .wefi-orb__eye,
.wefi-orb[data-state="happy"] .wefi-orb__eye {
  background: #34c759;
}
.wefi-orb[data-state="curious"] .wefi-orb__eye {
  background: linear-gradient(180deg, #7dd3fc, #38bdf8);
}
.wefi-orb[data-state="sad"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.11);
  border-radius: 0 0 9999px 9999px;
  background: #64748b;
  animation: none;
}
.wefi-orb[data-state="sad"] .wefi-orb__core {
  animation: wefi-droop 3.2s ease-in-out infinite;
}
.wefi-orb[data-state="sad"] .wefi-orb__ring {
  --wefi-turn: 14s;
  --wefi-ring: conic-gradient(from 0deg, #64748b, #93c5fd, #64748b);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.1) rgba(100, 116, 139, 0.5));
}
.wefi-orb[data-state="playful"] .wefi-orb__eye--l {
  height: calc(var(--wefi-size) * 0.11);
  border-radius: 9999px 9999px 0 0;
  background: #a855f7;
  animation: none;
}
.wefi-orb[data-state="playful"] .wefi-orb__eye--r {
  width: calc(var(--wefi-size) * 0.16);
  height: calc(var(--wefi-size) * 0.16);
  border-radius: 9999px;
  background: #a855f7;
  animation: none;
}
.wefi-orb[data-state="playful"] .wefi-orb__core {
  animation: wefi-wiggle 0.9s ease-in-out infinite;
}
.wefi-orb[data-state="playful"] .wefi-orb__ring {
  --wefi-turn: 1.8s;
  --wefi-ring: conic-gradient(from 0deg, #a855f7, #22d3ee, #f472b6, #a855f7);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.24) rgba(168, 85, 247, 0.8));
}
.wefi-orb[data-state="sympathetic"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.1);
  border-radius: 9999px 9999px 0 0;
  background: #fb923c;
  animation: none;
}
.wefi-orb[data-state="sympathetic"] .wefi-orb__eye--l { transform: rotate(12deg); }
.wefi-orb[data-state="sympathetic"] .wefi-orb__eye--r { transform: rotate(-12deg); }
.wefi-orb[data-state="sympathetic"] .wefi-orb__core {
  animation: wefi-nod 2.6s ease-in-out infinite;
}
.wefi-orb[data-state="sympathetic"] .wefi-orb__ring {
  --wefi-turn: 8s;
  --wefi-ring: conic-gradient(from 0deg, #fb923c, #fda4af, #fbbf24, #fb923c);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.2) rgba(251, 146, 60, 0.6));
}
.wefi-orb[data-state="joker"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.1);
  border-radius: 9999px 9999px 0 0;
  background: #f97316;
  animation: none;
}
.wefi-orb[data-state="joker"] .wefi-orb__core {
  animation: wefi-giggle 0.5s ease-in-out infinite;
}
.wefi-orb[data-state="joker"] .wefi-orb__ring {
  --wefi-turn: 2.4s;
  --wefi-ring: conic-gradient(from 0deg, #f97316, #e11d48, #fbbf24, #f97316);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.22) rgba(249, 115, 22, 0.75));
}
.wefi-orb[data-state="critic"] .wefi-orb__eye--l {
  height: calc(var(--wefi-size) * 0.08);
  transform: translateY(20%);
  background: #475569;
  animation: none;
}
.wefi-orb[data-state="critic"] .wefi-orb__eye--r {
  height: calc(var(--wefi-size) * 0.22);
  transform: translateY(-14%);
  background: #475569;
  animation: none;
}
.wefi-orb[data-state="critic"] .wefi-orb__core {
  animation: wefi-lean-back 4s ease-in-out infinite;
}
.wefi-orb[data-state="critic"] .wefi-orb__ring {
  --wefi-turn: 10s;
  --wefi-ring: conic-gradient(from 0deg, #475569, #94a3b8, #1e293b, #475569);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.12) rgba(71, 85, 105, 0.6));
}
.wefi-orb[data-state="shy"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.09);
  height: calc(var(--wefi-size) * 0.14);
  background: #f9a8d4;
  animation: wefi-glance 3s ease-in-out infinite;
}
.wefi-orb[data-state="shy"] .wefi-orb__core {
  animation: wefi-turn-away 3s ease-in-out infinite;
}
.wefi-orb[data-state="shy"] .wefi-orb__ring {
  --wefi-turn: 9s;
  --wefi-ring: conic-gradient(from 0deg, #fbcfe8, #f9a8d4, #fce7f3, #fbcfe8);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.14) rgba(249, 168, 212, 0.6));
}
.wefi-orb[data-state="bored"] .wefi-orb__eye {
  transform: scaleY(0.5) translateY(30%);
  background: #94a3b8;
  animation: none;
}
.wefi-orb[data-state="bored"] .wefi-orb__core {
  animation: wefi-sway 4s ease-in-out infinite;
}
.wefi-orb[data-state="bored"] .wefi-orb__ring {
  --wefi-turn: 20s;
  --wefi-ring: conic-gradient(from 0deg, #cbd5e1, #94a3b8, #cbd5e1);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.08) rgba(148, 163, 184, 0.4));
}
.wefi-orb[data-state="proud"] .wefi-orb__eye {
  height: calc(var(--wefi-size) * 0.1);
  border-radius: 9999px 9999px 0 0;
  background: #d97706;
  transform: translateY(-20%);
  animation: none;
}
.wefi-orb[data-state="proud"] .wefi-orb__core {
  animation: wefi-chin-up 3s ease-in-out infinite;
}
.wefi-orb[data-state="proud"] .wefi-orb__ring {
  --wefi-turn: 5s;
  --wefi-ring: conic-gradient(from 0deg, #f59e0b, #fde68a, #d97706, #f59e0b);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.28) rgba(245, 158, 11, 0.85));
}
.wefi-orb__prop {
  position: absolute;
  right: calc(var(--wefi-size) * -0.1);
  top: calc(var(--wefi-size) * -0.16);
  width: calc(var(--wefi-size) * 0.34);
  height: calc(var(--wefi-size) * 0.34);
  display: grid;
  place-items: center;
  font-size: calc(var(--wefi-size) * 0.26);
  font-weight: 800;
  line-height: 1;
  color: #3b82f6;
  opacity: 0;
  pointer-events: none;
  transform: translateY(20%) scale(0.6);
  transition: opacity 200ms ease, transform 200ms ease;
}
.wefi-orb[data-state="reading"] .wefi-orb__prop,
.wefi-orb[data-state="searching"] .wefi-orb__prop,
.wefi-orb[data-state="browsing"] .wefi-orb__prop,
.wefi-orb[data-state="counting"] .wefi-orb__prop,
.wefi-orb[data-state="writing"] .wefi-orb__prop,
.wefi-orb[data-state="checking"] .wefi-orb__prop,
.wefi-orb[data-state="alert"] .wefi-orb__prop,
.wefi-orb[data-state="confused"] .wefi-orb__prop {
  opacity: 1;
  transform: translateY(0) scale(1);
  animation: wefi-prop 2.2s ease-in-out infinite;
}
.wefi-orb[data-state="searching"] .wefi-orb__prop {
  width: calc(var(--wefi-size) * 0.24);
  height: calc(var(--wefi-size) * 0.24);
  border: calc(var(--wefi-size) * 0.05) solid #0ea5e9;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.85);
  box-shadow: 0 0 calc(var(--wefi-size) * 0.14) rgba(14, 165, 233, 0.6);
}
.wefi-orb[data-state="searching"] .wefi-orb__prop::after {
  content: "";
  position: absolute;
  right: calc(var(--wefi-size) * -0.11);
  bottom: calc(var(--wefi-size) * -0.08);
  width: calc(var(--wefi-size) * 0.14);
  height: calc(var(--wefi-size) * 0.05);
  border-radius: 9999px;
  background: #0ea5e9;
  transform: rotate(45deg);
}
.wefi-orb[data-state="browsing"] .wefi-orb__prop {
  width: calc(var(--wefi-size) * 0.26);
  height: calc(var(--wefi-size) * 0.26);
  border: calc(var(--wefi-size) * 0.04) solid #10b981;
  border-radius: 9999px;
  background: #ecfdf5;
  box-shadow: 0 0 calc(var(--wefi-size) * 0.14) rgba(16, 185, 129, 0.6);
}
.wefi-orb[data-state="browsing"] .wefi-orb__prop::before {
  content: "";
  position: absolute;
  inset: 0 34%;
  border: calc(var(--wefi-size) * 0.03) solid #10b981;
  border-radius: 9999px;
}
.wefi-orb[data-state="browsing"] .wefi-orb__prop::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: calc(var(--wefi-size) * 0.03);
  background: #10b981;
}
.wefi-orb[data-state="writing"] .wefi-orb__prop::before {
  content: "";
  position: absolute;
  width: calc(var(--wefi-size) * 0.08);
  height: calc(var(--wefi-size) * 0.3);
  border-radius: calc(var(--wefi-size) * 0.02);
  background: linear-gradient(180deg, #fbbf24 0 78%, #f8fafc 78% 100%);
  transform: rotate(40deg);
  box-shadow: 0 0 calc(var(--wefi-size) * 0.1) rgba(251, 191, 36, 0.6);
}
.wefi-orb[data-state="reading"] .wefi-orb__prop::before { content: "≡"; color: #6366f1; }
.wefi-orb[data-state="counting"] .wefi-orb__prop::before { content: "Σ"; color: #8b5cf6; }
.wefi-orb[data-state="checking"] .wefi-orb__prop::before { content: "✓"; color: #34c759; }
.wefi-orb[data-state="alert"] .wefi-orb__prop::before { content: "!"; color: #fff; }
.wefi-orb[data-state="confused"] .wefi-orb__prop::before { content: "?"; color: #64748b; }
.wefi-orb[data-state="alert"] .wefi-orb__prop {
  border-radius: 9999px;
  background: #ef4444;
  box-shadow: 0 0 calc(var(--wefi-size) * 0.16) rgba(239, 68, 68, 0.8);
  animation: wefi-prop 0.6s ease-in-out infinite;
}
.wefi-orb[data-state="reading"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.1);
  height: calc(var(--wefi-size) * 0.16);
  animation: wefi-look 1.4s ease-in-out infinite;
}
.wefi-orb[data-state="reading"] .wefi-orb__core { animation: wefi-sweep 2.8s ease-in-out infinite; }
.wefi-orb[data-state="reading"] .wefi-orb__ring {
  --wefi-turn: 6s;
  --wefi-ring: conic-gradient(from 0deg, #6366f1, #818cf8, #6366f1);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.18) rgba(99, 102, 241, 0.7));
}
.wefi-orb[data-state="searching"] .wefi-orb__eye {
  transform: translate(14%, -10%);
  animation: none;
}
.wefi-orb[data-state="searching"] .wefi-orb__core { animation: wefi-turn 2.4s ease-in-out infinite; }
.wefi-orb[data-state="searching"] .wefi-orb__ring {
  --wefi-turn: 2.4s;
  --wefi-ring: conic-gradient(from 0deg, #0ea5e9 0 70%, transparent 70% 82%, #38bdf8 82% 100%);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.22) rgba(14, 165, 233, 0.8));
}
.wefi-orb[data-state="browsing"] .wefi-orb__eye {
  transform: translate(10%, -16%);
  animation: none;
}
.wefi-orb[data-state="browsing"] .wefi-orb__core { animation: wefi-lean 3s ease-in-out infinite; }
.wefi-orb[data-state="browsing"] .wefi-orb__ring {
  --wefi-turn: 1.6s;
  --wefi-ring: conic-gradient(from 0deg, #10b981, #22d3ee, #10b981);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.22) rgba(16, 185, 129, 0.8));
}
.wefi-orb[data-state="counting"] .wefi-orb__eye {
  transform: scaleY(0.6);
  animation: none;
}
.wefi-orb[data-state="counting"] .wefi-orb__core { animation: wefi-nod 0.7s ease-in-out infinite; }
.wefi-orb[data-state="counting"] .wefi-orb__ring {
  --wefi-turn: 2s;
  --wefi-ring: conic-gradient(from 0deg, #8b5cf6 0 20%, transparent 20% 25%, #8b5cf6 25% 45%, transparent 45% 50%, #8b5cf6 50% 70%, transparent 70% 75%, #8b5cf6 75% 95%, transparent 95% 100%);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.2) rgba(139, 92, 246, 0.75));
}
.wefi-orb[data-state="writing"] .wefi-orb__eye {
  transform: translateY(14%);
  animation: none;
}
.wefi-orb[data-state="writing"] .wefi-orb__core { animation: wefi-work 1.4s ease-in-out infinite; }
.wefi-orb[data-state="writing"] .wefi-orb__ring {
  --wefi-turn: 4s;
  --wefi-ring: conic-gradient(from 0deg, #3b82f6, #fbbf24, #3b82f6);
}
.wefi-orb[data-state="checking"] .wefi-orb__core { animation: wefi-nod 1.4s ease-in-out infinite; }
.wefi-orb[data-state="checking"] .wefi-orb__ring {
  --wefi-turn: 3s;
  --wefi-ring: conic-gradient(from 0deg, #34c759, #a7f3d0, #34c759);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.2) rgba(52, 199, 89, 0.7));
}
.wefi-orb[data-state="alert"] .wefi-orb__eye {
  width: calc(var(--wefi-size) * 0.18);
  height: calc(var(--wefi-size) * 0.18);
  border-radius: 9999px;
  background: #ef4444;
  animation: none;
}
.wefi-orb[data-state="alert"] .wefi-orb__core { animation: wefi-jolt 0.9s ease-out infinite; }
.wefi-orb[data-state="alert"] .wefi-orb__ring {
  --wefi-turn: 0.7s;
  --wefi-ring: conic-gradient(from 0deg, #ef4444 0 50%, #fecaca 50% 100%);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.3) rgba(239, 68, 68, 0.9));
}
.wefi-orb[data-state="relax"] .wefi-orb__eye {
  transform: scaleY(0.35) translateY(20%);
  background: #a5b4fc;
  animation: none;
}
.wefi-orb[data-state="relax"] .wefi-orb__core { animation: wefi-breathe 5s ease-in-out infinite; }
.wefi-orb[data-state="relax"] .wefi-orb__ring {
  --wefi-turn: 16s;
  --wefi-ring: conic-gradient(from 0deg, #c4b5fd, #99f6e4, #fbcfe8, #c4b5fd);
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.16) rgba(196, 181, 253, 0.6));
}
.wefi-orb[data-state="sleeping"] .wefi-orb__eye {
  transform: scaleY(0.14);
  animation: none;
}
.wefi-orb[data-state="sleeping"] .wefi-orb__ring {
  --wefi-turn: 18s;
  opacity: 0.7;
  filter: drop-shadow(0 0 calc(var(--wefi-size) * 0.08) rgba(96, 140, 255, 0.35));
}
.wefi-orb[data-state="sleeping"] .wefi-orb__zz {
  animation: wefi-zz 2.6s ease-in-out infinite;
}
@keyframes wefi-spin {
  to { transform: rotate(360deg); }
}
@keyframes wefi-halo {
  0% { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(1.9); opacity: 0; }
}
@keyframes wefi-prop {
  0%, 100% { transform: translateY(0) rotate(-6deg); }
  50% { transform: translateY(-12%) rotate(6deg); }
}
@keyframes wefi-lean {
  0%, 100% { transform: rotate(-6deg) translateY(2%); }
  50% { transform: rotate(6deg) translateY(-2%); }
}
@keyframes wefi-lean-back {
  0%, 100% { transform: rotate(-9deg); }
  50% { transform: rotate(-4deg); }
}
@keyframes wefi-sweep {
  0%, 100% { transform: translateX(-7%); }
  50% { transform: translateX(7%); }
}
@keyframes wefi-work {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  30% { transform: translateY(3%) rotate(3deg); }
  70% { transform: translateY(-3%) rotate(-3deg); }
}
@keyframes wefi-hop {
  0%, 100% { transform: translateY(0) scale(1); }
  45% { transform: translateY(-9%) scale(1.03); }
}
@keyframes wefi-pop {
  0%, 60%, 100% { transform: scale(1); }
  12% { transform: scale(1.1) translateY(-6%); }
  24% { transform: scale(0.98); }
}
@keyframes wefi-turn {
  0%, 100% { transform: rotate(-10deg) translateX(-5%); }
  50% { transform: rotate(10deg) translateX(5%); }
}
@keyframes wefi-jolt {
  0%, 100% { transform: scale(1) translateY(0); }
  14% { transform: scale(0.94) translateY(6%); }
  40% { transform: scale(1.04) translateY(-3%); }
}
@keyframes wefi-roll {
  to { transform: rotate(360deg); }
}
@keyframes wefi-nudge {
  0%, 100% { transform: rotate(0deg); }
  30% { transform: rotate(-8deg); }
}
@keyframes wefi-nod {
  0%, 100% { transform: translateY(-5%) rotate(-3deg); }
  50% { transform: translateY(6%) rotate(3deg); }
}
@keyframes wefi-shake {
  0%, 100% { transform: translateX(0) rotate(0deg); }
  25% { transform: translateX(-8%) rotate(-5deg); }
  75% { transform: translateX(8%) rotate(5deg); }
}
@keyframes wefi-droop {
  0%, 100% { transform: translateY(6%) rotate(-4deg); }
  50% { transform: translateY(9%) rotate(-6deg); }
}
@keyframes wefi-wiggle {
  0%, 100% { transform: rotate(-10deg) translateX(-4%); }
  50% { transform: rotate(10deg) translateX(4%); }
}
@keyframes wefi-giggle {
  0%, 100% { transform: translateY(0) rotate(-3deg); }
  50% { transform: translateY(-5%) rotate(3deg); }
}
@keyframes wefi-glance {
  0%, 100% { transform: translate(-16%, 18%); }
  50% { transform: translate(-6%, 22%); }
}
@keyframes wefi-turn-away {
  0%, 100% { transform: rotate(-12deg) translateX(-6%); }
  50% { transform: rotate(-16deg) translateX(-9%); }
}
@keyframes wefi-sway {
  0%, 100% { transform: rotate(-5deg); }
  50% { transform: rotate(5deg); }
}
@keyframes wefi-chin-up {
  0%, 100% { transform: translateY(-6%) scale(1.02); }
  50% { transform: translateY(-9%) scale(1.04); }
}
@keyframes wefi-flirt {
  0%, 100% { transform: scaleY(1); }
  30%, 46% { transform: scaleY(0.1); }
}
@keyframes wefi-orbit {
  0% { transform: translate(0, -14%); }
  25% { transform: translate(12%, 0); }
  50% { transform: translate(0, 14%); }
  75% { transform: translate(-12%, 0); }
  100% { transform: translate(0, -14%); }
}
@keyframes wefi-surprise {
  0%, 100% { transform: scale(1); }
  18% { transform: scale(1.35); }
  60% { transform: scale(1.2); }
}
@keyframes wefi-tilt {
  0%, 100% { transform: rotate(-7deg); }
  50% { transform: rotate(7deg); }
}
@keyframes wefi-glint {
  0%, 100% { transform: translateX(-120%); opacity: 0; }
  35%, 55% { opacity: 0.9; }
  50% { transform: translateX(120%); }
}
@keyframes wefi-curious {
  0%, 100% { transform: translateX(-18%); }
  24% { transform: translateX(-18%) scaleY(0.12); }
  48%, 72% { transform: translateX(18%); }
  60% { transform: translateX(18%) scaleY(0.12); }
}
@keyframes wefi-excited {
  0%, 100% { transform: translateY(0) scale(1); }
  40% { transform: translateY(-16%) scale(1.08); }
}
@keyframes wefi-wink {
  0%, 100% { transform: scaleY(1); }
  28%, 52% { transform: scaleY(0.12); }
}
@keyframes wefi-spark {
  0% { opacity: 0; transform: translateY(40%) scale(0.4); }
  20% { opacity: 1; transform: translateY(0) scale(1); }
  68% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-30%) scale(0.75); }
}
@keyframes wefi-blink {
  0%, 92%, 100% { transform: scaleY(1); }
  95% { transform: scaleY(0.1); }
}
@keyframes wefi-think {
  0%, 100% { transform: translate(-14%, -12%); }
  42% { transform: translate(14%, -16%); }
  50% { transform: translate(14%, -16%) scaleY(0.15); }
  56% { transform: translate(14%, -16%); }
}
/*
 * Полоска проходит те же 132 % высоты круга (от -20 % до 112 %), но сдвигом:
 * её высота 12 % круга, значит путь равен 1100 % её собственной высоты.
 * Движение через top видеокарта не берёт, и на время «сканирует» страница
 * перерисовывалась процессором 58 раз в секунду.
 */
@keyframes wefi-scan {
  from { transform: translateY(0); }
  to { transform: translateY(1100%); }
}
@keyframes wefi-look {
  0%, 100% { transform: translateX(-20%); }
  50% { transform: translateX(20%); }
}
@keyframes wefi-squint {
  0%, 100% { transform: scaleY(0.55); }
  50% { transform: scaleY(0.35) translateY(8%); }
}
@keyframes wefi-bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14%); }
}
@keyframes wefi-breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.04); }
}
@keyframes wefi-zz {
  0% { opacity: 0; transform: translate(0, 20%) scale(0.7); }
  30% { opacity: 1; }
  100% { opacity: 0; transform: translate(40%, -70%) scale(1.15); }
}