/* Web Repetitor 1.4.9 — премиальное движение: появление при прокрутке, глубина, вступление.
   Только дополнения. Всё под prefers-reduced-motion: no-preference. */

/* Скрытое состояние блоков ниже экрана: чуть глубже, чтобы выход был заметнее и без вспышки. */
[data-reveal=wait]{opacity:0;transform:translate3d(0,22px,0)}
.tier-carousel[data-reveal=wait]{transform:none}

/* Цифры не «дрожат» при набегании. */
.summary-number,.account-counts strong,.tier-amount{font-variant-numeric:tabular-nums}

/* Параллакс: значения задаёт motion.js (--py), без значения ничего не смещается. */
.mini-browser,.hero-copy,.tier-engraving{translate:0 var(--py,0px)}

@media(prefers-reduced-motion:no-preference){
 /* Шапка на телефоне: при прокрутке становится плотнее и получает тонкую тень. */
 @media(max-width:1000px){
  #header{transition:border-color .45s var(--ease),box-shadow .6s var(--ease)}
  html[data-scrolled] #header{border-bottom-color:var(--line);box-shadow:0 10px 30px -18px #19344d3d}
  :root[data-theme=dark][data-scrolled] #header{box-shadow:0 10px 30px -16px #0008}
 }

 /* Затемнение за окнами проявляется плавно. */
 dialog[open]::backdrop{animation:wr-backdrop .5s var(--ease) both}

 /* Первый показ платформы (класс держится ~2 секунды, потом снимается). */
 body.wr-intro #sidebar{animation:wr-fade .9s var(--ease) both}
 body.wr-intro #sidebar .nav-link{animation:wr-slide-x .85s var(--ease) both;animation-delay:calc(var(--i,0) * 60ms + 160ms)}
 body.wr-intro #sidebar .side-bottom{animation:wr-fade .9s var(--ease) .5s both}
 body.wr-intro #header>*{animation:wr-drop .85s var(--ease) .1s both}
 @media(max-width:1000px){
  body.wr-intro #dock{animation:wr-dock .95s var(--ease) .3s both}
 }

 /* Мягкая реакция на наведение (только мышь). */
 @media(hover:hover){
  .feature{transition:translate .65s var(--ease)}
  .feature:hover{translate:0 -4px}
  .feature>svg{transition:transform .6s var(--ease)}
  .feature:hover>svg{transform:translateY(-2px) scale(1.08)}
 }
}

@keyframes wr-fade{from{opacity:0}to{opacity:1}}
@keyframes wr-backdrop{from{opacity:0}to{opacity:1}}
@keyframes wr-slide-x{from{opacity:0;translate:-14px 0}to{opacity:1;translate:0 0}}
@keyframes wr-drop{from{opacity:0;translate:0 -12px}to{opacity:1;translate:0 0}}
@keyframes wr-dock{from{translate:0 140%}to{translate:0 0}}