/* Таймер шага (макет «эстафета.html»): плашка с моноширинными цифрами. Последние
   10 секунд — красный режим: цифры подпрыгивают каждую секунду, по краям экрана
   дышит красная кромка; последние 5 — крупные цифры «вбиваются» правее центра. */
.vx-timer{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;
  background:rgba(34,29,26,.85);border:1px solid var(--border-1);color:var(--text-accent);
  box-shadow:0 10px 24px rgba(0,0,0,.4),inset 0 1px 0 var(--surface-raised-top)}
.vx-timer__val{display:inline-block;font:700 18px/1 var(--font-mono);color:var(--text-1);font-variant-numeric:tabular-nums}

.vx-timer--alarm{color:var(--text-danger);border-color:var(--record-ring)}
.vx-timer--alarm .vx-timer__val{color:var(--text-danger);animation:vx-timer-thump .3s cubic-bezier(.3,1.6,.5,1)}
@keyframes vx-timer-thump{50%{transform:scale(1.25)}}

.vx-timer__edge{position:fixed;inset:0;z-index:40;pointer-events:none;box-shadow:inset 0 0 160px rgba(255,92,72,.28);
  animation:vx-timer-edge 1.2s ease-in-out infinite alternate}
@keyframes vx-timer-edge{to{box-shadow:inset 0 0 220px rgba(255,92,72,.45)}}

.vx-timer__big{position:fixed;left:72%;top:50%;z-index:41;pointer-events:none;translate:-50% -50%;
  font:900 140px/1 var(--font-display);color:var(--coral-500);text-shadow:0 0 30px rgba(255,92,72,.6);
  animation:vx-timer-big .9s cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes vx-timer-big{
  0%{transform:scale(1.6);opacity:0}
  25%{transform:scale(1);opacity:1}
  100%{transform:scale(.85);opacity:.15}
}

@media (prefers-reduced-motion:reduce){
  .vx-timer--alarm .vx-timer__val,.vx-timer__edge{animation:none}
  .vx-timer__big{animation:none;opacity:.8}
}