/* ============================================================
   THE BOT — ELECTRIC FIELD, оформление
   ------------------------------------------------------------
   Энергия здесь та же, что у Core: тот же фирменный синий, то же
   контролируемое свечение. Не игровая подсветка, а физика одной
   системы.

   Всё движение — на opacity, transform и stroke-dashoffset.
   Ни одной постоянной анимации: заряд меняется только вслед за
   курсором, дуга живёт доли секунды.
   ============================================================ */

/* Слой разрядов поверх страницы. Событий не перехватывает. */
.ef-layer {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 9998;
  overflow: visible;
}

.ef-arc {
  fill: none;
  stroke: var(--ef-arc-color, #BBD6FF);
  stroke-width: 1.1;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 4px var(--ef-arc-glow, rgba(61, 139, 255, 0.9)));
  opacity: 0;
  animation: ef-flash 0.15s ease-out 1;
}
/* Основная ветка — тонкая и почти бело-синяя в сердцевине.
   Вторичная слабее: толстая мультяшная молния тут не нужна. */
.ef-arc-branch { stroke-width: 0.7; opacity: 0; animation: ef-flash 0.13s ease-out 1; }
.ef-arc-bridge { stroke-width: 1.3; animation: ef-flash 0.19s ease-out 1; }

@keyframes ef-flash {
  0%   { opacity: 0; }
  18%  { opacity: 1; }
  100% { opacity: 0; }
}

/* ------------------------------------------------------------
   ПРИТЯЖЕНИЕ ГРАНИЦЫ
   Важнее самой молнии: элемент должен ощущаться заряженным
   задолго до того, как проскочит разряд. Свечение идёт по кромке,
   а не заливает элемент — для этого градиент обрезан маской в
   кольцо толщиной в полтора пикселя.
   ------------------------------------------------------------ */
[data-electric] {
  position: relative;
  --ef-charge: 0;
  --ef-mx: 50%;
  --ef-my: 50%;
  --ef-dx: 0px;
  --ef-dy: 0px;
  --ef-hi: #7FB2FF;
  --ef-glow: rgba(61, 139, 255, 0.55);
  transform: translate(var(--ef-dx), var(--ef-dy));
  transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
}
[data-electric]::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1.5px;
  background: radial-gradient(150px circle at var(--ef-mx) var(--ef-my),
              var(--ef-hi) 0%, transparent 70%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  opacity: var(--ef-charge);
  pointer-events: none;
  z-index: 2;
}
/* Мягкое гало снаружи — тоже по мере приближения курсора. */
[data-electric]::before {
  content: "";
  position: absolute;
  inset: -10px;
  border-radius: inherit;
  background: radial-gradient(120px circle at var(--ef-mx) var(--ef-my),
              var(--ef-glow) 0%, transparent 66%);
  filter: blur(10px);
  opacity: calc(var(--ef-charge) * 0.6);
  pointer-events: none;
  z-index: -1;
}
[data-electric-round] { border-radius: 50%; }

/* Launcher чата в поле НЕ оформляется. Сфера уже несёт фирменное
   дыхание на собственных ::before/::after и позиционирована fixed:
   любое правило отсюда разрушило бы её. Она подключена только как
   приёмник дуги — через JS, без атрибута data-electric. */
/* ------------------------------------------------------------
   КОНТАКТ: цепь замкнулась
   Один импульс по границе, затем покой. Бесконечного мигания нет.
   ------------------------------------------------------------ */
.ef-contact::after {
  animation: ef-travel 0.72s cubic-bezier(0.22, 0.61, 0.36, 1) 1;
}
@keyframes ef-travel {
  0%   { background-position: -60% 50%; opacity: 0.5; }
  45%  { opacity: 1; }
  100% { background-position: 160% 50%; opacity: var(--ef-charge); }
}
.ef-contact::before { animation: ef-halo 0.72s ease-out 1; }
@keyframes ef-halo {
  0%   { opacity: calc(var(--ef-charge) * 0.6); }
  40%  { opacity: 0.85; }
  100% { opacity: calc(var(--ef-charge) * 0.6); }
}

/* Клик: короткий перенос энергии. Навигация не задерживается. */
.ef-transfer::before { animation: ef-send 0.5s ease-out 1; }
@keyframes ef-send {
  0%   { opacity: 0.9;  transform: scale(1); }
  100% { opacity: 0;    transform: scale(1.14); }
}

/* Ответ ядра: оно откликается на замыкание цепи, но не деформируется. */
.ef-answer { --ef-answer-on: 1; }
.ef-answer::before,
.ef-answer > .ef-ring {
  animation: ef-answer-pulse 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) 1;
}
@keyframes ef-answer-pulse {
  0%   { opacity: 0.85; transform: scale(0.94); }
  55%  { opacity: 1;    transform: scale(1.06); }
  100% { opacity: 0;    transform: scale(1.16); }
}

/* ------------------------------------------------------------
   Светлая тема: сердцевина разряда плотнее, ореол заметно слабее —
   иначе на белом получается светлое пятно вместо разряда.
   ------------------------------------------------------------ */
:root[data-theme="light"] .ef-arc,
:root[data-theme="light"] [data-electric] {
  --ef-arc-color: #2F7BFF;
  --ef-arc-glow: rgba(47, 123, 255, 0.5);
  --ef-hi: #2F7BFF;
  --ef-glow: rgba(47, 123, 255, 0.3);
}
:root[data-theme="light"] .ef-arc { stroke-width: 1.3; filter: drop-shadow(0 0 2px var(--ef-arc-glow)); }
:root[data-theme="light"] [data-electric]::before { filter: blur(8px); opacity: calc(var(--ef-charge) * 0.4); }

/* ------------------------------------------------------------
   Нет курсора — нет поля. Случайных молний на касании не бывает.
   ------------------------------------------------------------ */
@media (hover: none), (pointer: coarse) {
  .ef-layer { display: none; }
  [data-electric]::before,
  [data-electric]::after { opacity: 0 !important; animation: none !important; }
  [data-electric] { transform: none !important; }
  /* Касание всё равно даёт отклик — но статичный, без разрядов. */
  [data-electric]:active::after { opacity: 0.7 !important; }
}

@media (prefers-reduced-motion: reduce) {
  .ef-layer { display: none; }
  [data-electric] { transform: none !important; transition: none; }
  [data-electric]::before,
  [data-electric]::after { animation: none !important; }
  .ef-answer::before { animation: none !important; }
}