
.speedometer {
    position: fixed;
    inset: 0;
    display: none;
    pointer-events: none;
  }
  
  .wrapper {
    width: min(24.4444444444vh, 13.75vw);
    height: min(24.4444444444vh, 13.75vw);
    position: absolute;
    right: min(2.2222222222vh, 1.25vw);
    bottom: min(0vh, 0vw);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .wrapper > * {
    position: absolute;
  }
  
  .backdrop {
    width: min(57.7777777778vh, 32.5vw);
    height: min(57.7777777778vh, 32.5vw);
    background: url('../images/speedometer/backdrop.png') center center/contain no-repeat;
  }
  
  .content {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
  }
  
  .content__row {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .content__row--emergency {
    position: absolute;
    top: min(2.7777777778vh, 1.5625vw);
  }
  
  .content__row--mileage {
    position: absolute;
    top: min(7.037037037vh, 3.9583333333vw);
  }
  
  /* Настройка строки с "km/h" и нитро-баром */
  .content__row--speed-units {
    position: absolute;
    bottom: min(7.8703703704vh, 7.4270833333vw);
    display: flex; /* Горизонтальное выравнивание */
    align-items: center; /* Вертикальное центрирование */
    justify-content: center; /* Горизонтальное центрирование */
    gap: min(1.3vh, 2vw); /* Уменьшенный отступ между "km/h" и нитро-баром */
  }
  
  .content__row--indicators {
    position: absolute;
    bottom: min(4.6296296296vh, 2.6041666667vw);
    gap: min(1.2962962963vh, 0.7291666667vw);
  }
  
  .speed-value {
    position: absolute;
    font-family: 'Roboto', sans-serif;
    font-weight: 800;
    font-size: min(4.6296296296vh, 2.6041666667vw);
    line-height: 1.3em;
    letter-spacing: 0;
    color: #fff;
  }
  
  /* Стили для текста "km/h" */
  .speed-units {
    font-family: 'Proxima Nova', sans-serif;
    font-weight: 600;
    font-size: min(1.4814814815vh, 0.8333333333vw);
    line-height: 1.3em;
    letter-spacing: 0;
    color: #ffffff80;
  }
  
  /* Стили для нитро-бара */
  .nitro-bar {
    position: relative; /* Относительное позиционирование для естественного размещения в flex */
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  /* Настройка шкалы нитро-бара */
  .nitro-bar .bar {
    transform: rotate(-90deg);
    width: min(3vh, 1.6875vw); /* Увеличиваем размер шкалы */
    height: min(3vh, 1.6875vw);
  }
  
  /* Настройка иконки нитро-бара */
  .nitro-bar .icon {
    position: absolute;
    width: min(1.8vh, 1.0125vw); /* Увеличиваем размер иконки */
    height: min(2.2vh, 1.2375vw);
  }
  
  /* Плавное изменение цвета иконки */
  .nitro-bar .icon path {
    transition: fill 0.2s ease;
  }
  
  /* Speed Scale */
  .speed-scale {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(24.4444444444vh, 13.75vw);
    height: min(24.4444444444vh, 13.75vw);
  }
  
  .scale__background {
    position: absolute;
  }
  
  .scale__background path {
    fill: #ffffff4d;
  }
  
  .scale__indicators {
    position: absolute;
  }
  
  .scale__indicators path {
    fill: #fff;
  }
  
  .arrow {
    position: absolute;
    transform: rotate(-130deg);
  }
  
  .arrow__anchor {
    position: absolute;
    width: 0;
    height: 0;
    display: flex;
    justify-content: center;
    transition: transform 60ms linear;
  }
  
  .arrow__anchor svg {
    position: absolute;
    width: min(1.4814814815vh, 0.8333333333vw);
    height: min(11.3166666667vh, 6.365625vw);
    bottom: min(-1.1111111111vh, -0.625vw);
  }
  
  /* Fuel Bar */
  .fuel-bar {
    width: min(24.4444444444vh, 13.75vw);
    height: min(24.4444444444vh, 13.75vw);
    display: flex;
  }
  
  .fuel-bar .bar {
    transform: rotate(35deg);
  }
  
  .fuel-bar .icon {
    position: absolute;
    top: min(9.537037037vh, 5.3645833333vw);
    right: min(1.8518518519vh, 1.0416666667vw);
    width: min(1.5740740741vh, 0.8854166667vw);
    height: min(1.5740740741vh, 0.8854166667vw);
    opacity: 0.4;
  }
  
  /* Strength Bar */
  .strength-bar {
    width: min(24.4444444444vh, 13.75vw);
    height: min(24.4444444444vh, 13.75vw);
    display: flex;
  }
  
  .strength-bar .bar {
    transform: rotate(96deg);
  }
  
  .strength-bar .icon {
    position: absolute;
    top: min(16.8518518519vh, 9.4791666667vw);
    right: min(3.3333333333vh, 1.875vw);
    width: min(1.5740740741vh, 0.8854166667vw);
    height: min(1.9444444444vh, 1.09375vw);
    opacity: 0.4;
  }
  
  /* Turn Indicators */
  .turn-indicators {
    display: flex;
    justify-content: space-between;
    width: min(14.0740740741vh, 7.9166666667vw);
  }
  
  .light {
    position: relative;
    width: min(1.2037037037vh, 0.6770833333vw);
    height: min(1.9444444444vh, 1.09375vw);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .light__arrow {
    -webkit-mask-size: cover;
    background: #fff6;
    width: min(1.2037037037vh, 0.6770833333vw);
    height: min(1.9444444444vh, 1.09375vw);
    position: relative;
    z-index: 2;
  }
  
  .light__arrow div {
    width: 100%;
    height: 100%;
    background: #69da67;
    opacity: 0;
  }
  
  .light__arrow--left {
    -webkit-mask-image: url('../images/speedometer/icons/turn-left.svg');
  }
  
  .light__arrow--left + .light__backdrop {
    transform: rotate(180deg);
  }
  
  .light__arrow--right {
    -webkit-mask-image: url('../images/speedometer/icons/turn-right.svg');
  }
  
  .light__backdrop {
    position: absolute;
    z-index: 1;
    width: min(4.9074074074vh, 2.7604166667vw);
    height: min(5.6481481481vh, 3.1770833333vw);
    background: url('../images/speedometer/icons/turn-backdrop.png') center center/cover no-repeat;
    opacity: 0;
  }
  
  /* Emergency Indicator */
  .emergency-indicator {
    position: relative;
    width: min(2.7777777778vh, 1.5625vw);
    height: min(2.3148148148vh, 1.3020833333vw);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
  }
  
  .emergency-indicator svg {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
  }
  
  .emergency-indicator .backdrop {
    position: absolute;
    z-index: 1;
    width: min(9.2592592593vh, 5.2083333333vw);
    height: min(8.7962962963vh, 4.9479166667vw);
    background: url('../images/speedometer/icons/emergency-backdrop.png') center center/cover no-repeat;
  }
  
  /* Mileage Value */
  .mileage-value {
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: min(1.4814814815vh, 0.8333333333vw);
    line-height: 1.3em;
    letter-spacing: 0.1em;
    color: #ffffff80;
  }
  
  /* Engine Indicator */
  .engine-indicator .icon {
    width: min(2.2222222222vh, 1.25vw);
    height: min(1.5740740741vh, 0.8854166667vw);
    -webkit-mask-image: url('../images/speedometer/icons/engine.svg');
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    background: #ffffff80;
  }
  
  /* Doors Indicator */
  .doors-indicator .icon {
    width: min(1.8518518519vh, 1.0416666667vw);
    height: min(1.6666666667vh, 0.9375vw);
    -webkit-mask-image: url('../images/speedometer/icons/door.svg');
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    background: #69da67;
  }
  
  /* Headlights Indicator */
  .headlights-indicator .icon {
    width: min(1.6666666667vh, 0.9375vw);
    height: min(1.6666666667vh, 0.9375vw);
    -webkit-mask-image: url('../images/speedometer/icons/headlights.svg');
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    background: #ffffff80;
  }
  
  /* Fuel Icon */
  .icon.fuel {
    width: min(1.5740740741vh, 0.8854166667vw);
    height: min(1.5740740741vh, 0.8854166667vw);
    background: #F3BE00;
    border-radius: 50%;
  }
  
  /* Staging Indicator */
  .staging-indicator {
    display: flex;
    align-items: flex-end;
  }
  
  .staging-indicator .icon {
    width: min(1.0185185185vh, 0.5729166667vw);
    height: min(1.6666666667vh, 0.9375vw);
    -webkit-mask-image: url('../images/speedometer/icons/tuning-stage.svg');
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    background: #ffffff80;
  }
  
  .staging-indicator .stage {
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: min(1.1111111111vh, 0.625vw);
    line-height: 1.3em;
    letter-spacing: 0;
    color: #ffd232;
    line-height: 1em;
    position: relative;
    left: min(0.1851851852vh, 0.1041666667vw);
    top: min(0.1851851852vh, 0.1041666667vw);
    opacity: 0;
  }
  