/* mascot.css — размеры и мягкая анимация маскота «Фокусик» (FN.mascot). */

.mascot { display: inline-block; flex-shrink: 0; line-height: 0; }
.mascot svg { display: block; width: 100%; height: 100%; }

.mascot--xs    { width: 30px;  height: 30px; }
.mascot--sm    { width: 40px;  height: 40px; }
.mascot--md    { width: 56px;  height: 56px; }
.mascot--greet { width: 64px;  height: 64px; }
.mascot--hero  { width: 104px; height: 104px; }

/* Появление маскота — один раз, при отрисовке экрана.
 *
 * Раньше здесь было «дыхание»: translateY ±5px по 6 секунд, `infinite`. Оно
 * стояло на Главной (шапка приветствия), в пустых состояниях коуча и Body
 * Double и в онбординге — то есть постоянно двигалось в верхней части рабочего
 * экрана, без всякой связи с действиями человека. Файл токенов формулирует
 * правило прямо: «движение всегда следствие действия пользователя, ничего
 * бесконечного в периферии зрения» (design-tokens.css §АНИМАЦИИ) — и это был
 * единственный случай в продукте, который его нарушал.
 *
 * Появление ту же роль («маскот живой, а не картинка») выполняет, но
 * заканчивается: 420мс, мягкий отскок по --ease-spring, из словаря движения.
 * both — чтобы стартовое состояние применилось до первого кадра и маскот не
 * мигнул на месте. Оба режима «меньше движения» гасят это правило глобально
 * (animations.css), и элемент просто отрисовывается на своём месте. */
.mascot--float svg {
  animation: fn-mascot-in 420ms var(--ease-spring) both;
}
@keyframes fn-mascot-in {
  from { opacity: 0; transform: translateY(8px) scale(0.94); }
  to   { opacity: 1; transform: none; }
}
