/* Motion lab — "Сигнал найден" (see motion-lab.js) */

/* the travelling signal: same red as the logo beacon */
.ml-signal{position:fixed;left:0;top:0;z-index:100001;border-radius:50%;pointer-events:none;background:#E00000;box-shadow:0 0 0 3px rgba(176,0,0,.2),0 0 16px rgba(230,0,0,.95),0 0 40px rgba(200,0,0,.45);will-change:transform}
#plDot.ml-gone{visibility:hidden}
#morseDot.ml-wait{opacity:0}
#morseDot.ml-lit{background:#B00000;box-shadow:0 0 0 3px rgba(176,0,0,.2),0 0 12px rgba(200,0,0,.95),0 0 26px rgba(200,0,0,.45);transition:background .6s ease,box-shadow .9s ease}
#morseDot.ml-ping::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid rgba(255,48,48,.9);animation:mlPing .72s cubic-bezier(.16,1,.3,1) forwards;pointer-events:none}
@keyframes mlPing{from{transform:scale(1);opacity:.95}to{transform:scale(4.4);opacity:0}}

/* hero readout: numbers wait dimmed until the scan line measures them */
.stats.ml-armed{position:relative}
.stats.ml-armed .stat .stat-n{transition:opacity .18s ease}
/* !important: beats body.no-gsap [data-to] (phones run without GSAP) */
.stats.ml-armed .stat:not(.ml-read) .stat-n{opacity:.28!important}
.stats .stat.ml-hit{border-color:rgba(166,184,255,.34);transition:border-color .65s cubic-bezier(.16,1,.3,1)}
.stats .stat.ml-hit::before{opacity:1;box-shadow:0 0 16px var(--accent,var(--c)),0 0 4px var(--accent,var(--c))}
.ml-scanline{position:absolute;top:-10px;bottom:-10px;left:0;width:2px;z-index:3;pointer-events:none;background:linear-gradient(to bottom,transparent,rgba(198,211,255,.95) 18%,rgba(91,114,255,.92) 82%,transparent);box-shadow:0 0 14px rgba(91,114,255,.8),0 0 34px rgba(91,114,255,.35)}

@media(prefers-reduced-motion:reduce){
  .ml-signal,.ml-scanline{display:none}
  #morseDot.ml-ping::after{animation:none;display:none}
  .stats.ml-armed .stat:not(.ml-read) .stat-n{opacity:1!important}
}

/* ── Chapters (ml-chapters.js) ─────────────────────────────────────────── */
html.ml-chapters #prog,html.ml-chapters .sec-ind{display:none}
/* the field replaces the old ambient glow: those layers (160px blur, screen
   blending) were the most expensive thing to scroll over */
html.ml-chapters .bg-orb,html.ml-chapters .bg-aurora{display:none!important}
/* sections let the data field show through */
html.ml-chapters .sit-s,html.ml-chapters .mani,html.ml-chapters .cases,html.ml-chapters .ai-s,
html.ml-chapters .appr,html.ml-chapters .about-s,html.ml-chapters .fmt-s,html.ml-chapters .ct-s{background:transparent!important}
/* running text keeps a soft halo in the page colour over the points */
html.ml-chapters main p,html.ml-chapters main li,html.ml-chapters .ct-s p,html.ml-chapters .ct-s li{text-shadow:0 0 10px rgba(2,4,8,.9)}

/* chapter HUD: number · page progress · label,
   vertical in the right gutter, reading bottom to top — clear of the content column */
.ml-hud{position:fixed;right:22px;top:50%;z-index:40;display:flex;align-items:center;gap:12px;pointer-events:none;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);font-size:10px;font-weight:800;letter-spacing:.24em;text-transform:uppercase;color:rgba(198,211,255,.66);font-variant-numeric:tabular-nums}
.ml-hud-n{color:#8EA2FF}
.ml-hud-bar{width:1px;height:56px;background:rgba(255,255,255,.12);overflow:hidden}
.ml-hud-bar i{display:block;width:100%;height:100%;background:linear-gradient(0deg,#5B72FF,#C6D3FF);transform-origin:50% 100%;transform:scaleY(0)}
@media(max-width:900px),(hover:none){.ml-hud{display:none}}

/* the seam between chapters: same ice/indigo line as the intro scan */
.ml-seam{position:fixed;left:0;right:0;top:-1px;height:2px;z-index:45;pointer-events:none;opacity:0;transform-origin:50% 50%;background:linear-gradient(90deg,transparent 0%,rgba(91,114,255,.85) 18%,rgba(198,211,255,.98) 42%,#fff 50%,rgba(198,211,255,.98) 58%,rgba(91,114,255,.85) 82%,transparent 100%);box-shadow:0 0 18px rgba(91,114,255,.9),0 0 46px rgba(91,114,255,.45)}

/* display headings wait off-screen, then the scan line reveals them */
.ml-asm-wait{opacity:0}
.ml-scan{position:absolute;width:2px;z-index:46;pointer-events:none;background:linear-gradient(to bottom,transparent,rgba(198,211,255,.95) 18%,rgba(91,114,255,.92) 82%,transparent);box-shadow:0 0 14px rgba(91,114,255,.8),0 0 34px rgba(91,114,255,.35)}

/* the data field runs on phones too (lighter: fewer points, ~30 fps) */
html.ml-field #webgl{display:block!important}
