/* Spacemotion · анимации презентации CSS v006 (05.11.2026) — копия v005: метка рендера по центру кадра (пара — анимации v008.js). */
/* Spacemotion · креативные анимации презентации v005 (02.11.2026) — копия v004 + render («рендер»: бакеты, пиксели, шум; логика в .js).
   Было в v004: копия v003; float разгоняется от прокрутки (логика в .js).
   Было в v003: копия v002 + float (экраны плывут вверх, параллакс).
   Было в v002: копия v001 + screens (стена экранов).
   Было в v001:
   Отдельный, необязательный слой поверх базового шаблона. Подключается вместе с …-анимации-презентации-v001.js
   только в те презентации, где сделан креативный этап. Слайду задаётся data-fx="calm | speed | fly-to-phone | smoke | drip",
   слову-акценту — data-fx-src. На экране — да; в PDF, в режиме правки и при «уменьшить движение» — всё статично. */

/* слайды с собственным появлением: базовое появление шаблона не мешает — им управляет скрипт */
body .frame.fx-own.fx-own .slide > .blk,
body .frame.fx-own.fx-own .slide > .bleed { transition: none !important; }

/* v002 screens: экраны влетают из-за края — сам слайд их обрезает, переходы шаблона не мешают */
body .frame.fx-play .slide > [data-fx-page] { will-change: transform, opacity, filter; }
/* v003 float: слои плывут — подсказка браузеру */
body .frame.fx-play[data-fx="float"] .slide > [data-fx-depth] { will-change: transform, translate, scale; }

.fx-layer { position: absolute; inset: 0; pointer-events: none; z-index: 6; overflow: visible; }
.fx-clone { position: absolute; white-space: nowrap; transform-origin: 50% 50%; will-change: transform, opacity; margin: 0; }
.fx-ring { position: absolute; border-radius: 34px; }
.fx-toast {
  position: absolute; display: flex; align-items: center; gap: 10px; white-space: nowrap;
  font: 600 22px/1 'Golos Text', 'Helvetica Neue', Helvetica, Arial, sans-serif; letter-spacing: -0.01em;
  color: #0A0A0A; background: rgba(255,255,255,.96); padding: 14px 20px 14px 16px; border-radius: 18px;
  box-shadow: 0 18px 40px -18px rgba(0,0,0,.55);
}
.fx-toast b { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #FC4700; color: #fff; font-size: 17px; }
.fx-smoke { position: absolute; }
.fx-drop-wrap { position: absolute; width: 0; height: 0; transform-origin: 0 0; }
.fx-drop { position: absolute; left: 0; top: 0; border-radius: 0 50% 50% 50%; transform: translate(-50%, 0) rotate(45deg); transform-origin: 50% 50%; }
.fx-sag { position: absolute; display: block; white-space: nowrap; margin: 0; will-change: transform; }
.fx-melt { clip-path: inset(0 0 var(--fx-cut, 0px) 0); }

/* v005 render: цель рендера видна только в готовых квадратах (--fx-cut — путь из квадратов, ставит скрипт);
   её появление — сам рендер, поэтому базовое появление шаблона (сдвиг и прозрачность) с неё снято */
body .slide [style*="--fx-cut"]:not(.fx-melt) { clip-path: var(--fx-cut, none); }
body.anim .frame .slide > [style*="--fx-cut"]:not(.fx-melt) { transition: none !important; opacity: 1 !important; transform: none !important; }
.fx-render-cv { position: absolute; display: block; pointer-events: none; image-rendering: pixelated; }
.fx-render-hud {
  position: absolute; display: flex; align-items: center; gap: .5em; white-space: nowrap; pointer-events: none;
  font: 500 16px/1 'IBM Plex Mono', 'SFMono-Regular', Menlo, monospace; letter-spacing: .04em; text-transform: uppercase;
  font-variant-numeric: tabular-nums; color: #FFFFFF; background: rgba(10,10,10,.66); padding: .5em .7em .45em;
  transform: translate(-50%, -50%);
}
.fx-render-hud::before { content: ''; flex: none; width: .5em; height: .5em; background: #FC4700; }
html.sm-png body .slide [style*="--fx-cut"]:not(.fx-melt) { clip-path: none !important; }
html.sm-png .fx-runtime { display: none !important; }

@media print {
  .fx-layer, .fx-runtime { display: none !important; }
  .fx-melt { clip-path: none !important; }
  body .slide [style*="--fx-cut"]:not(.fx-melt) { clip-path: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .fx-layer, .fx-render-cv, .fx-render-hud { display: none !important; }
  .fx-melt { clip-path: none !important; }
  body .slide [style*="--fx-cut"]:not(.fx-melt) { clip-path: none !important; }
}