/* ---- la-hdr-mobile-fix: шапка на телефоне ----
   Раньше всё жалось в одну строку: логотип, поиск и кнопки входа наезжали друг на друга.
   Теперь на узком экране логотип и действия сверху, поиск отдельной строкой под ними. */
@media(max-width:700px){
  .la-hdr .la-wrap{flex-wrap:wrap;row-gap:8px}
  .la-hdr .la-search,.la-hdr form[role=search],.la-hdr .la-hdr-search{order:3;flex:1 0 100%;margin:0}
  .la-hdr .la-logo{flex:0 0 auto}
  #head_menu_rght,.la-hdr-actions{margin-left:auto;display:flex;align-items:center;gap:6px;flex-wrap:nowrap}
  #head_menu_rght .btn-brand,.la-hdr-actions .btn-brand,
  #head_menu_rght .btn-ghost2,.la-hdr-actions .btn-ghost2{
    padding:9px 13px;font-size:13px;white-space:nowrap;min-height:40px;display:inline-flex;align-items:center
  }
}
@media(max-width:420px){
  /* на совсем узких «Регистрация» превращается в короткое слово, иначе строка рвётся */
  #head_menu_rght .btn-brand,.la-hdr-actions .btn-brand{padding:9px 11px;font-size:12.5px}
}
/* Панель разделов на странице входа занимала три ряда — делаем её лентой с прокруткой */
@media(max-width:700px){
  .la-welcome-nav{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}
  .la-welcome-nav::-webkit-scrollbar{display:none}
  .la-welcome-nav a{white-space:nowrap;flex:0 0 auto}
}
/* ---- la-ui-polish: отклик, фокус, порядок нижних панелей ---- */
/* Нажатие должно быть видно. На телефоне :hover не наступает, и без :active кнопка
   выглядит неработающей — человек жмёт ещё раз и получает дубль действия. */
.btn-brand:active,.btn-ghost2:active,.btn-p:active,.cap span:active,.rd-pill:active,
.lag-bar .b:active,.gl-pc:active,.cat-pg a:active,.lib-tabs a:active,.pm-btn:active{
  transform:translateY(1px);filter:brightness(.94)
}
/* Клавиатурный фокус: раньше его не было видно нигде */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
[role=button]:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:8px}
/* Нижние плавающие блоки не должны накладываться друг на друга.
   Порядок сверху вниз: гейт регистрации → промо приложения → плеер. */
/* Высоты не пишем числом: док и плашка меряют себя сами и кладут результат
   в --la-dock-h и --la-gate-h (см. _la_dock.php и _la_gate.php). Раньше тут
   стояли 66px и 62px, док вырос до 63px, и зазор остался в один пиксель. */
body.la-dock-on .lag-bar{bottom:calc(var(--la-dock-h,66px) + 4px);padding-bottom:12px}
body.la-dock-on .la-nav{bottom:calc(var(--la-dock-h,66px) + 22px)}
body.la-dock-on .la-app-promo{bottom:calc(var(--la-dock-h,66px) + 16px)}
body.la-gate-on .la-app-promo{display:none}
/* Баннер приложения (.la-appb) лежит на z-index 9300 против 9992 у плашки, то есть
   при показанной плашке он погребён целиком и показ уходит впустую. Прячем. */
body.la-gate-on .la-appb{display:none}
/* Плавающие кнопки «назад» и «наверх» наполовину уходили под плашку */
body.la-gate-on .la-nav{bottom:calc(var(--la-gate-h,120px) + 14px)}
body.la-gate-on.la-dock-on .la-nav{bottom:calc(var(--la-gate-h,120px) + var(--la-dock-h,66px) + 18px)}
/* Под плашками нужен отступ, иначе последние строки текста не проскроллить */
body.la-gate-on{padding-bottom:calc(var(--la-gate-h,120px) + 16px)}
body.la-gate-on.la-dock-on{padding-bottom:calc(var(--la-gate-h,120px) + var(--la-dock-h,66px) + 20px)}
@media(max-width:760px){
  /* Тап-зоны по-человечески: пальцем в 30px не попасть */
  .cap span,.cat-pg a,.lib-tabs a,.la-subnav a{min-height:44px;display:inline-flex;align-items:center}
}
/* Кнопка удаления из библиотеки жила только под :hover — с телефона её не существовало */
@media(hover:none){.lib-rm{display:block!important}}