/* ─────────────────────────────────────────────────────────────────────────
   ОЖИВЛЕНИЕ ПЛОСКИХ СХЕМ · движения.
   Все циклы длинные (6–9 с), в каждом короткий проход света и долгая пауза:
   страница остаётся спокойной, а свет читается как сигнал, а не как анимация
   ради анимации. Задержки разведены, поэтому ничего не мигает в унисон.
   Играет только внутри `.fx-on` (блок в кадре); reduced-motion всё глушит.
   ───────────────────────────────────────────────────────────────────────── */
:root {
  /* маска контуров чешуи (для волны света): полуэллипсы в шахматном порядке */
  --fx-scale-line: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='18'%3E%3Cpath d='M0 9a14 9 0 0 0 28 0M-14 0a14 9 0 0 0 28 0M14 0a14 9 0 0 0 28 0' fill='none' stroke='white' stroke-width='1.3'/%3E%3C/svg%3E");
  /* сами пластины: тёмный камень с лёгким бликом сверху и красной кромкой снизу */
  --fx-scale-fill: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='18'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23241618' stop-opacity='.85'/%3E%3Cstop offset='.55' stop-color='%230c0708' stop-opacity='.9'/%3E%3Cstop offset='1' stop-color='%23050304' stop-opacity='.95'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='url(%23g)' stroke='%23ffffff' stroke-opacity='.07' stroke-width='.8'%3E%3Cpath d='M0 9a14 9 0 0 0 28 0z'/%3E%3Cpath d='M-14 0a14 9 0 0 0 28 0z'/%3E%3Cpath d='M14 0a14 9 0 0 0 28 0z'/%3E%3C/g%3E%3Cg fill='none' stroke='%23b3202c' stroke-opacity='.26' stroke-width='.9'%3E%3Cpath d='M3 10.2a11 7.2 0 0 0 22 0'/%3E%3Cpath d='M-11 1.2a11 7.2 0 0 0 22 0'/%3E%3Cpath d='M17 1.2a11 7.2 0 0 0 22 0'/%3E%3C/g%3E%3C/svg%3E");
  /* жилы и угли в камне: редкие красно-коричневые трещины */
  --fx-veins: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='160' fill='none'%3E%3Cg stroke='%23b3202c' stroke-opacity='.32' stroke-width='.8' stroke-linejoin='round'%3E%3Cpath d='M0 40l22 8 14-12 28 18 10-8 36 24'/%3E%3Cpath d='M64 58l-6 26 18 14-4 24'/%3E%3Cpath d='M120 0l12 30-14 16 22 20 30-6 24 22'/%3E%3Cpath d='M150 80l-20 28 12 16 36 10'/%3E%3Cpath d='M180 20l16 22-8 22'/%3E%3C/g%3E%3Cg fill='%23d4552a' fill-opacity='.5'%3E%3Ccircle cx='36' cy='36' r='1'/%3E%3Ccircle cx='118' cy='46' r='.9'/%3E%3Ccircle cx='142' cy='126' r='1'/%3E%3Ccircle cx='76' cy='98' r='.8'/%3E%3C/g%3E%3C/svg%3E");
  /* динамика цвета с кончика клинка: фуксия → роза → красный → уголь */
  --fx-wave: linear-gradient(110deg, transparent 0 41%, #7d2d9c 44%, var(--ox-fuchsia) 47%, var(--ox-rose) 50%, #ff2a3a 53%, var(--ox-ember) 56%, transparent 59% 100%);
  --fx-wave-a: 0.26; /* яркость волны: выше — мелкий текст под ней теряет контраст (замер приёмки) */
}

/* ── швы между строками: по линии под строкой бежит импульс ───────────── */
.rows .row.fx-host-row { position: relative; }
.fx-seam {
  position: absolute;
  inset-inline: 0;
  inset-block-end: -1px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--ox-fuchsia) 30%, var(--ox-rose) 48%, #ff2a3a 66%, var(--ox-ember) 80%, transparent) no-repeat;
  background-size: 26% 100%;
  background-position: -40% 0;
  opacity: 0;
}
.fx-on .fx-seam {
  animation: fxSeam 8s var(--ease) infinite;
  animation-delay: var(--fx-delay, 0s);
}
@keyframes fxSeam {
  0% { background-position: -40% 0; opacity: 0; }
  5% { opacity: 1; }
  30% { background-position: 140% 0; opacity: 1; }
  34%, 100% { background-position: 140% 0; opacity: 0; }
}

/* ── чешуя: пластины обсидиана за панелью; по их швам проходит волна света ──
   Слои снизу вверх: пластины (фон), жилы (::before), волна по контурам (::after). */
.fx-host { position: relative; isolation: isolate; }
.fx-scales {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
  background-color: var(--ox-stone);
  background-image: var(--fx-scale-fill);
  background-size: 28px 18px;
}
.fx-scales::before,
.fx-scales::after {
  content: "";
  position: absolute;
  inset: 0;
}
.fx-scales::before {
  background-image: var(--fx-veins);
  background-size: 220px 160px;
  opacity: 0.4;
}
.fx-scales::after {
  -webkit-mask-image: var(--fx-scale-line);
  mask-image: var(--fx-scale-line);
  -webkit-mask-size: 28px 18px;
  mask-size: 28px 18px;
  background: var(--fx-wave);
  background-size: 360% 100%;
  background-position: 75% 0;
  opacity: 0;
}
.fx-on .fx-scales::after {
  opacity: var(--fx-wave-a);
  animation: fxScale 9s var(--ease) infinite;
  animation-delay: var(--fx-delay, 0s);
}
@keyframes fxScale {
  0% { background-position: 75% 0; }
  32%, 100% { background-position: 25% 0; }
}
/* выбранная панель оплаты и зона команды: волна чаще */
.pay-panel.is-picked .fx-scales::after,
.tz[aria-pressed="true"] .fx-scales::after {
  animation-duration: 5s;
}

/* ── импульсы по линиям схем ─────────────────────────────────────────── */
.mod .pl,
.fs .fsr,
.tz-link .chp {
  fill: none;
  stroke-linecap: round;
  stroke-dasharray: 0.07 0.93;
  stroke-dashoffset: 1;
  opacity: 0;
}
.mod .pl { stroke-width: 1.8; }
.fs .fsr { stroke-width: 1.8; }
.tz-link .chp { stroke-width: 1.8; }
.pl--r, .fsr--r, .chp--r { stroke: #ff4a3a; }
.pl--v, .fsr--v, .chp--v { stroke: var(--ox-fuchsia); }
.fx-on .mod .pl,
.fx-on .fs .fsr,
.fx-on .tz-link .chp {
  animation: fxPulse 7s var(--ease) infinite;
  animation-delay: var(--fx-delay, 0s);
}
@keyframes fxPulse {
  0% { stroke-dashoffset: 1; opacity: 0; }
  4% { opacity: 1; }
  26% { stroke-dashoffset: 0; opacity: 1; }
  30%, 100% { stroke-dashoffset: 0; opacity: 0; }
}
/* когда модуль открыт и рисует свой поток, холостой импульс не нужен */
.mod[aria-pressed="true"] .pl,
.row:hover .mod .pl { animation: none !important; opacity: 0; }
.team[data-pick="0"] .chp--r,
.team[data-pick="1"] .chp--v { animation-duration: 2.8s; }

/* бегущие штрихи по связям в карточке заявки и на схеме порядка */
.fx-on .mc-ln.on {
  stroke-dasharray: 2 9;
  animation: fxDash 1.8s linear infinite;
}
@keyframes fxDash { to { stroke-dashoffset: -22; } }

/* ── мерцание узлов, как у неона: редкие короткие провалы яркости ───────── */
.fx-on .mod .nd.rest,
.fx-on .fs .fp,
.fx-on .tz-link .cn,
.fx-on .mc-nd.on {
  animation: fxNeon 5.5s linear infinite;
  animation-delay: var(--fx-delay, 0s);
}
.fx-on .mod:nth-of-type(odd) .nd.rest { animation-delay: -1.7s; }
.fx-on .mc-nd.on:nth-of-type(even) { animation-delay: -2.4s; }
@keyframes fxNeon {
  0%, 18%, 23%, 62%, 69%, 100% { fill-opacity: 1; }
  20% { fill-opacity: 0.4; }
  64% { fill-opacity: 0.55; }
  66% { fill-opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .fx-seam, .fx-scales::after { display: none; }
  .mod .pl, .fs .fsr, .tz-link .chp { display: none; }
}

/* подписи на панелях с чешуёй светлее серого: под ними полоса кромки и волна */
.fx-host .tag,
.fx-host .row-n,
.fx-host dt,
.fx-host .st .tag {
  color: var(--ox-ink-2);
}