/* ZALP: интерфейс под любой экран (логика — zalp-fit.js, классы на <html>).
   zf-hud — экран с мышью: у HUD один масштаб --zf-hud вместо брейкпоинтов survev.
   На телефонах и сенсорных планшетах HUD остаётся в мобильной раскладке игры. */

/* ===================== HUD в бою ===================== */
html.zf-hud #ui-game { zoom: var(--zf-hud, 1); }
/* миникарту и колёса эмоций/пингов игра ставит в экранных пикселях — возвращаем им масштаб 1 */
html.zf-hud #ui-map-wrapper,
html.zf-hud #ui-emotes,
html.zf-hud #ui-team-pings { zoom: var(--zf-hud-inv, 1); }

/* группы HUD: базовое положение без брейкпоинтных scale() (масштаб даёт zoom всего слоя) */
:root:not(#zz#zz).zf-hud #ui-top-left,
:root:not(#zz#zz).zf-hud #ui-top-center-scopes,
:root:not(#zz#zz).zf-hud #ui-spectate-options-wrapper,
:root:not(#zz#zz).zf-hud #ui-leaderboard-wrapper,
:root:not(#zz#zz).zf-hud #ui-killfeed-wrapper,
:root:not(#zz#zz).zf-hud #ui-kill-leader-wrapper,
:root:not(#zz#zz).zf-hud #ui-lower-center,
:root:not(#zz#zz).zf-hud #ui-perk-message-wrapper,
:root:not(#zz#zz).zf-hud #ui-bottom-center-left,
:root:not(#zz#zz).zf-hud #ui-bottom-center-right,
:root:not(#zz#zz).zf-hud #ui-bottom-right,
:root:not(#zz#zz).zf-hud #ui-stats-header,
:root:not(#zz#zz).zf-hud #ui-stats-info-box,
:root:not(#zz#zz).zf-hud #ui-stats-options { transform: none !important; }
:root:not(#zz#zz).zf-hud #ui-top-center,
:root:not(#zz#zz).zf-hud #ui-top-center-scopes-wrapper,
:root:not(#zz#zz).zf-hud #ui-equipped-ammo-wrapper,
:root:not(#zz#zz).zf-hud #ui-bottom-center-0,
:root:not(#zz#zz).zf-hud #ui-bottom-center-1 { transform: translateX(-50%) !important; }
:root:not(#zz#zz).zf-hud #ui-right-center.ui-right-center-desktop { transform: translateY(-50%) !important; }
:root:not(#zz#zz).zf-hud #ui-center { transform: translate(-50%, -50%) !important; }

/* ===================== рамка меню: общий масштаб ===================== */
:root:not(#zz#zz).zf-on #vw-bar,
:root:not(#zz#zz).zf-on #vw-about,
:root:not(#zz#zz).zf-on #start-top-right,
:root:not(#zz#zz).zf-on #start-bottom-left,
:root:not(#zz#zz).zf-on #start-bottom-right-wrapper { zoom: var(--zf-ui, 1); }

/* ===================== верхняя панель меню ===================== */
:root:not(#zz#zz).zf-on #vw-bar {
  left: calc(var(--zf-left, 0px) + 12px) !important;
  right: calc(var(--zf-acct, 0px) + 12px) !important;
  width: auto !important;
  max-width: none !important;
  transform: none !important;
  justify-content: flex-start !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none;
  padding-bottom: 6px !important;
}
:root:not(#zz#zz).zf-on #vw-bar::-webkit-scrollbar { display: none; }
/* по центру, пока помещается; иначе — от левого края с прокруткой (ничего не теряется) */
:root:not(#zz#zz).zf-on #vw-bar > :first-child { margin-left: auto !important; }
:root:not(#zz#zz).zf-on #vw-bar > :last-child { margin-right: auto !important; }
:root:not(#zz#zz).zf-on #vw-bar > * { flex: none !important; }
/* мало места: у кнопок разделов остаются только иконки (подпись — во всплывающей подсказке) */
:root:not(#zz#zz).zf-bar-compact #vw-bar > .vw-pill:not(#vw-online):not(#vw-crystal-btn):not(.za-lvpill) {
  font-size: 0 !important;
  gap: 0 !important;
  min-width: 44px;
  justify-content: center;
}
:root:not(#zz#zz).zf-bar-compact #vw-bar > .vw-pill {
  height: 36px !important;
  min-height: 36px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
}
:root:not(#zz#zz).zf-bar-compact #vw-bar > .vw-pill[hidden] { display: none !important; }
:root:not(#zz#zz).zf-bar-compact #vw-bar > .vw-pill img { width: 26px !important; height: 26px !important; margin: 0 !important; }
:root:not(#zz#zz).zf-bar-compact #vw-bar > .za-btn { padding-left: 34px !important; padding-right: 8px !important; }
:root:not(#zz#zz).zf-bar-tiny #vw-bar { gap: 5px !important; }
:root:not(#zz#zz).zf-bar-tiny #vw-online { font-size: 12px !important; }

/* плашка «Что это за игра?» остаётся под панелью (центр меню вписывается ниже неё);
   на низких и узких экранах её нет — там есть кнопка «Как играть» в самом меню */
:root:not(#zz#zz).zf-on #vw-about { top: 62px !important; }
@media (max-width: 1100px), (max-height: 820px) {
  :root:not(#zz#zz).zf-on #vw-about { display: none !important; }
}

/* ===================== центр главного меню ===================== */
/* zoom и вертикаль считает zalp-fit.js (вписывает логотип и колонки в свободную область) */
:root:not(#zz#zz).zf-on #start-main-center {
  position: fixed !important;
  left: 50% !important;
  top: var(--zf-menu-top, 64px) !important;
  margin: 0 !important;
  transform: translateX(-50%) translateX(var(--zf-menu-dx, 0px)) !important;
}

/* ===================== телефоны ===================== */
/* новости прячем (в портрете survev и так их скрывает), блок аккаунта — компактнее */
:root:not(#zz#zz).zf-sm #news-block { display: none !important; }
:root:not(#zz#zz).zf-on.zf-sm #start-top-right { zoom: 0.72; }
/* на телефоне survev тянет ряд колонок на всю высоту — панель меню получала пустой хвост */
:root:not(#zz#zz).zf-sm #start-row-top { height: auto !important; min-height: 0 !important; align-items: flex-start !important; }
:root:not(#zz#zz).zf-sm #start-menu { height: auto !important; }
:root:not(#zz#zz).zf-sm #pass-block { min-height: 0 !important; }

/* узкий портрет: верхняя панель под блоком аккаунта, во всю ширину, в две строки */
:root:not(#zz#zz).zf-bar-below #vw-bar {
  top: var(--zf-bar-top, 56px) !important;
  left: 8px !important;
  right: 8px !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  row-gap: 6px !important;
  align-content: flex-start !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
:root:not(#zz#zz).zf-bar-below #vw-bar > :first-child,
:root:not(#zz#zz).zf-bar-below #vw-bar > :last-child { margin-left: 0 !important; margin-right: 0 !important; }

/* открыто окно survev (коллекция, настройки, команда…) — верхняя панель не закрывает его шапку */
:root:not(#zz#zz).zf-modal #vw-bar,
:root:not(#zz#zz).zf-modal #vw-about { visibility: hidden !important; }
:root:not(#zz#zz).zf-modal.zf-sm #modal-customize.zc { --zc-top: 10px; }

/* ===================== HUD на телефоне (раскладка survev для сенсора) ===================== */
/* сверху слева направо: миникарта | громкость | аптечки по центру | патроны сеткой 4×2 */
:root:not(#zz#zz).zf-sm #ingame-volume {
  left: 122px !important;
  top: 8px !important;
  gap: 4px !important;
  padding: 2px 8px 2px 3px !important;
}
:root:not(#zz#zz).zf-sm #iv-icon { width: 24px !important; height: 24px !important; }
:root:not(#zz#zz).zf-sm #iv-slider { width: 60px !important; }
:root:not(#zz#zz).zf-sm #ui-medical-interactive {
  left: 50% !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  gap: 4px !important;
}
:root:not(#zz#zz).zf-sm #ui-medical-interactive > .ui-loot {
  width: 64px !important;
  height: 36px !important;
  margin: 0 !important;
}
:root:not(#zz#zz).zf-sm #ui-medical-interactive .ui-loot-image { width: 24px !important; height: 24px !important; left: auto !important; right: 5px !important; top: 50% !important; transform: translateY(-50%) !important; }
:root:not(#zz#zz).zf-sm #ui-medical-interactive .ui-loot-count { font-size: 15px !important; left: 7px !important; }
:root:not(#zz#zz).zf-sm #ui-ammo-interactive {
  width: 156px !important;
  gap: 4px !important;
  top: 4px !important;
  right: 4px !important;
}
:root:not(#zz#zz).zf-sm #ui-ammo-interactive > .ui-ammo {
  width: 36px !important;
  height: 30px !important;
}
:root:not(#zz#zz).zf-sm #ui-ammo-interactive .ui-loot-image { width: 16px !important; height: 16px !important; left: auto !important; right: 3px !important; top: 3px !important; }
:root:not(#zz#zz).zf-sm #ui-ammo-interactive .ui-loot-count { font-size: 12px !important; left: 3px !important; top: auto !important; bottom: 4px !important; transform: none !important; }
:root:not(#zz#zz).zf-sm #ui-ammo-interactive .ui-loot-overlay { top: auto !important; bottom: 0 !important; }
/* выносливость — справа от полоски здоровья (над ней счётчик патронов, слева джойстик), без подписи */
:root:not(#zz#zz).zf-sm #stamina-hud {
  left: calc(100% + 10px) !important;
  right: auto !important;
  bottom: 0 !important;
  transform: none !important;
  width: 150px !important;
  padding: 5px 8px 5px 34px !important;
}
:root:not(#zz#zz).zf-sm #stamina-hud::before { width: 24px; height: 24px; left: 5px; }
:root:not(#zz#zz).zf-sm #stamina-levels { display: none !important; }
/* блок паса на телефоне: survev поднимает квесты на −25px, и заголовок «Квесты дня» лезет на кнопку */
:root:not(#zz#zz).zf-sm #pass-quest-wrapper { top: 0 !important; margin-top: 16px !important; }