/* ══ ДЕСКТОП КАЛИБРОВКАСЫ ══════════════════════════════════════════════════
   Беттер телефонға арналып жасалған: баған ені 600px, шрифт/батырма/отступ
   бәрі px-пен жазылған (бүкіл жобада ~1250 font-size декларация). Сондықтан
   ноутбук/десктопта бет «во весь экран» тұрса да баған ортада жіңішке жолақ
   болып, бәрі ұсақ көрінетін.

   Мұнда ЕКІ тетік бар:

   1) ЕН — ортақ --app-w қадамдап өседі (600 → 820 → 900 → 980). Содан
      style.css-тегі ≥900px тор ережелері (minmax 360px) ШЫН ЖАНДАНАДЫ:
      бұрын баған 600px болғандықтан, тор әрқашан бір бағанға сығылып
      тұратын — енді тізімдер екі бағанға жайылады.

   2) ӨЛШЕМ — .desk-scale контейнеріне zoom беріледі: шрифт, батырма, отступ,
      радиус — бәрі БІРГЕ өседі. px мәндерін бет сайын қайта жазудың орнына
      (мүмкін емес көлем) бір ғана тетік. zoom ен-ді де үлкейтетіндіктен,
      max-width-ты zoom-ға БӨЛЕМІЗ — сонда рендер ені дәл --app-w болады.

   МАҢЫЗДЫ: екеуі де ТЕК ≥900px-те жұмыс істейді, сондықтан телефондағы
   (Telegram WebApp) көрініс мүлдем өзгермейді.

   .desk-scale қолмен, бет-бетке қойылады — контейнері 100vh/fixed-ке
   сүйенетін беттерге (linga.html — LiTube таспасы) қойылмайды, әйтпесе
   zoom биіктікті де 1.1 есе үлкейтіп, экраннан асырып жіберер еді. */

/* --desk-unzoom — zoom-ның КЕРІСІ (1 / --desk-zoom). Масштабталған блоктың
   ішінде экранға бекітілген (position:fixed) бала тұрса, оның left/right
   мәні де көбейіп, орны жылжып кетеді. Сондай балаға осыны беріп, zoom-ды
   нөлдейміз (мыс. battle.html → .bottom-tabs). */
:root { --desk-zoom: 1; --desk-unzoom: 1; }

@media (min-width: 900px) {
  :root { --app-w: 820px; --desk-zoom: 1.06; --desk-unzoom: 0.9434; }
}
@media (min-width: 1280px) {
  :root { --app-w: 900px; --desk-zoom: 1.12; --desk-unzoom: 0.8929; }
}
@media (min-width: 1600px) {
  :root { --app-w: 980px; --desk-zoom: 1.18; --desk-unzoom: 0.8475; }
}

@media (min-width: 900px) {
  /* !important — бет ішіндегі <style> блогы бұдан КЕЙІН тұрса да ен сақталсын
     (әр беттің өз .wrap/.page-app ені бар; мұндағысы ортақ шешім). */
  .desk-scale {
    zoom: var(--desk-zoom);
    width: 100%;
    max-width: calc(var(--app-w) / var(--desk-zoom)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Экранға бекітілген табтар (battle.html) контейнердің СЫРТЫНДА — оларға
     zoom жетпейді, сондықтан өлшемін қолмен өсіреміз. */
  .bottom-tabs { font-size: 13px; }

  /* .dl-fb (test.html/daily.html жауап панелі) — ТҮС БЕРМЕЙМІЗ: бұрын
     «.dl-fb button{font-size:15.5px}» деп жаздық, бірақ ол ТИП+КЛАСС
     селектор болғандықтан «.dl-fb-appeal» (кіші 🔊/🚩 дөңгелек батырма,
     өз стилінде 13px) селекторынан СПЕЦИФИЧНОСТЬ бойынша жоғары түсіп,
     соны 13px → 15.5px үлкейтіп, дөңгелек батырманы «домпиған» етіп
     көрсететін. Панель max-width (style.css) арқылы ғана дұрыс
     орталанады — мәтін өлшемі мобильдегідей қалады, өйткені 980px-тей
     бағанда 18px тақырып/15px батырма бұрыннан-ақ жетерлік көрінеді. */
}