/* css/animations.css — переходы и эффекты (ТЗ §15). Полировка — поздние этапы. */

/* Учёт настройки пользователя — без глобального «убийства» всех @keyframes (Тайми/фон остаются живыми). */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  .screen:not(.screen--boot-active),
  .btn:not(#sound-toggle),
  .slider-block__range,
  .question-option {
    transition-duration: 40ms !important;
  }

  .question-option:has(input:checked) {
    animation: none !important;
  }
}

.screen {
  /* без перехода на Этапе 1 — фокус на сценарии */
}

/* TODO Этап 6+: screen shake, glow pulse, blinking lamps, printer animation */
@keyframes pt-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* Выбранный ответ: лёгкий «idle» автомата (steps — олдскул), без плавного морфинга */
@keyframes pt-option-selected-idle {
  0%,
  49% {
    border-color: var(--color-brand);
    box-shadow:
      inset 0 1px 0 var(--arcade-face-highlight),
      var(--arcade-shadow-drop),
      inset 0 0 0 2px rgba(var(--color-brand-rgb), 0.22);
    background-color: rgba(var(--color-brand-rgb), 0.08);
  }
  50%,
  100% {
    border-color: var(--color-brand-soft);
    box-shadow:
      inset 0 1px 0 var(--arcade-face-highlight),
      var(--arcade-shadow-drop),
      inset 0 0 0 2px rgba(95, 255, 143, 0.14),
      inset 0 0 26px rgba(var(--color-brand-rgb), 0.06);
    background-color: rgba(var(--color-brand-rgb), 0.11);
  }
}

@keyframes pt-printer-out {
  /* TODO Этап 4: выезд чека из принтера */
}

@keyframes pt-screen-shake {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }
  25% {
    transform: translate3d(-2px, 1px, 0);
  }
  50% {
    transform: translate3d(2px, -1px, 0);
  }
  75% {
    transform: translate3d(-1px, -2px, 0);
  }
}

/* Лёгкая тряска экрана расчёта (ТЗ §8.5). Уважается prefers-reduced-motion выше. */
#screen-boot.screen--boot-active {
  animation: pt-screen-shake 0.14s linear infinite;
}

/* Лампы быстрее во время расчёта */
#screen-boot.screen--boot-active .lamp {
  animation: pt-lamp-burst 0.14s ease-in-out infinite;
}

@keyframes pt-lamp-burst {
  0%,
  100% {
    opacity: 0.35;
    filter: brightness(0.65);
  }
  50% {
    opacity: 1;
    filter: brightness(1.35);
  }
}

@media (prefers-reduced-motion: reduce) {
  #screen-boot.screen--boot-active .lamp {
    animation: none;
    opacity: 0.95;
  }
}

/*
 * Появление экранов: дешёвый transition по opacity, без keyframes и без !important.
 * Никаких ожидающих анимаций — экран всегда виден сразу, transition лишь сглаживает.
 */
@media (prefers-reduced-motion: no-preference) {
  /* Attract mode: главная кнопка как у аркадного автомата */
  #screen-welcome.is-active .btn--primary {
    animation: pt-attract-pulse 2.6s ease-in-out infinite;
  }
}

@keyframes pt-attract-pulse {
  0%,
  100% {
    border-color: #c278ff;
    filter: brightness(1);
    transform: translate3d(0, 0, 0);
  }
  50% {
    border-color: #ffffff;
    filter: brightness(1.12);
    transform: translate3d(0, -1px, 0);
  }
}