/* Волик — маскот Volmap. Анимации отключаются при prefers-reduced-motion. */
.vm-mascot { display: inline-block; line-height: 0; flex: none; }
.vm-mascot svg { width: 100%; height: auto; overflow: visible; display: block; }

.vm-m-bob   { animation: vmmBob 3.2s ease-in-out infinite; transform-box: view-box; transform-origin: 60px 130px; }
.vm-m-eyes  { animation: vmmBlink 5s infinite; transform-box: view-box; transform-origin: 60px 56px; }
.vm-m-arm   { animation: vmmWave 1.5s ease-in-out infinite; transform-box: view-box; transform-origin: 97px 70px; }
.vm-m-heart { animation: vmmBeat 1.8s ease-in-out infinite; transform-box: view-box; transform-origin: 60px 20px; }
.vm-m-z     { animation: vmmZ 2.6s ease-in-out infinite; }
.vm-m-spark { animation: vmmSpark 1.4s ease-in-out infinite; }
.vm-m-happy .vm-m-bob { animation: vmmJump 1s cubic-bezier(.3,.8,.4,1) infinite; }
.vm-m-happy .vm-m-cheer { animation: vmmCheer .5s ease-in-out infinite alternate; transform-box: view-box; transform-origin: 60px 66px; }
.vm-m-sleepy .vm-m-bob { animation-duration: 4.6s; }

@keyframes vmmBob   { 50% { transform: translateY(-4px); } }
@keyframes vmmJump  { 0%, 100% { transform: translateY(0) scaleY(1); } 30% { transform: translateY(-12px) scaleY(1.03); } 60% { transform: translateY(0) scaleY(.96); } }
@keyframes vmmBlink { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
@keyframes vmmWave  { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(-22deg); } }
@keyframes vmmBeat  { 0%, 60%, 100% { transform: scale(1); } 20% { transform: scale(1.14); } 40% { transform: scale(.96); } }
@keyframes vmmZ     { 0% { opacity: 0; transform: translate(0, 4px); } 40% { opacity: 1; } 100% { opacity: 0; transform: translate(4px, -8px); } }
@keyframes vmmSpark { 50% { opacity: .35; } }
@keyframes vmmCheer { to { transform: translateY(-3px); } }

/* Конфетти */
.vm-confetti { position: fixed; inset: 0; pointer-events: none; z-index: 3000; overflow: hidden; }
.vm-confetti i {
  position: absolute; top: -14px; width: 8px; height: 13px; border-radius: 2px;
  animation: vmmFall var(--d, 1.6s) cubic-bezier(.25,.6,.45,1) forwards;
}
@keyframes vmmFall { to { transform: translate(var(--x, 0), 108vh) rotate(var(--r, 360deg)); } }

/* Карточка «ура» */
.vm-cheer {
  position: fixed; left: 50%; bottom: calc(28px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  z-index: 3001; display: flex; gap: 12px; align-items: center; cursor: pointer;
  width: max-content; max-width: min(440px, calc(100vw - 32px));
  padding: 10px 18px 10px 12px; border-radius: 20px;
  background: var(--bg, #fff); color: var(--text, #0f1d26);
  border: 1px solid var(--border-md, rgba(15,40,55,.14));
  box-shadow: 0 18px 50px rgba(8, 22, 30, .26);
  animation: vmmPop .5s cubic-bezier(.2, 1.4, .4, 1);
  transition: opacity .3s, transform .3s;
}
.vm-cheer-t { min-width: 0; }
.vm-cheer-t b { display: block; font: 700 16px/1.25 var(--font, system-ui, sans-serif); }
.vm-cheer-s { display: block; margin-top: 2px; font: 400 13.5px/1.4 var(--font, system-ui, sans-serif); color: var(--text-2, #3f515e); }
.vm-cheer-out { opacity: 0; transform: translate(-50%, 12px); }
@keyframes vmmPop { from { opacity: 0; transform: translate(-50%, 24px) scale(.9); } }
@media (max-width: 700px) {
  .vm-cheer { bottom: calc(var(--nav-height, 64px) + env(safe-area-inset-bottom, 0px) + 14px); }
}

@media (prefers-reduced-motion: reduce) {
  .vm-mascot *, .vm-cheer { animation: none !important; }
}