/* BJPVP — mobile/native shell (этап B: вынесен из index.html ДОСЛОВНО).
   ПОСЛЕДНИЙ в каскаде — переопределяет main.css на телефонах/в приложении. */
/* ═══════════ v7.109.0: MOBILE / NATIVE SHELL (Capacitor + PWA) ═══════════
   Safe-area под вырез/индикатор + поведение приложения (без выделения,
   выноски, подсветки тапа, overscroll-bounce). На десктопе env()=0 → без эффекта. */
/* v7.109.5: «приложенческое» поведение — ТОЛЬКО на тач-устройствах (pointer:coarse),
   чтобы десктоп с мышью был нетронут (текст выделяется как обычно). */
@media (pointer: coarse) {
  *{ -webkit-tap-highlight-color:transparent; }
  html,body{ overscroll-behavior:none; -webkit-text-size-adjust:100%; text-size-adjust:100%; touch-action:manipulation; }
  body{ -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
  /* выделение/копирование разрешаем там, где это нужно (поля ввода, коды-приглашения) */
  input, textarea, [contenteditable], .selectable,
  #my-lobby-code-compact, #room-code-show, #my-lobby-id-display, #other-lobby-code, #other-lobby-code-compact{
    -webkit-user-select:text; user-select:text; -webkit-touch-callout:default;
  }
}
/* верхние фикс-кнопки игрового стола — ниже чёлки/выреза (значения = базовым + safe-area) */
body.screen-game #mute-btn{ top:calc(10px + env(safe-area-inset-top)); right:calc(10px + env(safe-area-inset-right)); }
#last-hand-btn{ top:calc(10px + env(safe-area-inset-top)); right:calc(54px + env(safe-area-inset-right)); }
#table-rules-btn{ top:calc(46px + env(safe-area-inset-top)); right:calc(10px + env(safe-area-inset-right)); }
#personal-to-lobby-btn, #global-to-lobby-btn{ top:calc(12px + env(safe-area-inset-top)); left:calc(12px + env(safe-area-inset-left)); }
#global-leave-btn{ top:calc(54px + env(safe-area-inset-top)) !important; left:calc(12px + env(safe-area-inset-left)) !important; }
#host-controls{ top:calc(54px + env(safe-area-inset-top)); left:calc(12px + env(safe-area-inset-left)); }
#global-player-controls{ right:calc(8px + env(safe-area-inset-right)); }
/* нижний игровой HUD — над домашним индикатором */
body.screen-game .bottom-hud{ padding-bottom:env(safe-area-inset-bottom); }
/* лобби/авторизация — заголовок и переключатель языка не под вырезом */
#screen-auth, #screen-lobby{ padding-top:calc(18px + env(safe-area-inset-top)) !important; }

/* ═══════════ v7.109.3: АДАПТИВ ПОД ТЕЛЕФОН (портретные узкие экраны) ═══════════
   Лобби: 3 колонки (профиль 230 + список + превью 300) не влезают на телефон →
   вертикальный стек на всю ширину, вертикальный скролл. Превью прячем (действия
   «Сесть/Наблюдать» есть прямо в строках столов). Игровой стол — отдельно (ландшафт). */
@media (max-width: 760px) {
  #screen-lobby{
    flex-direction:column !important; flex-wrap:nowrap !important;
    align-items:stretch !important; justify-content:flex-start !important;
    gap:12px !important; overflow-y:auto !important; overflow-x:hidden !important;
    padding:calc(10px + env(safe-area-inset-top)) 10px calc(16px + env(safe-area-inset-bottom)) 10px !important;
  }
  #lobby-left-col{ width:auto !important; flex:0 0 auto !important; max-height:none !important; overflow:visible !important; }
  #lobby-main-col{ width:100% !important; max-width:none !important; min-width:0 !important; flex:0 0 auto !important; max-height:none !important; }
  #lobby-main-panel{ max-height:none !important; overflow:visible !important; }
  #global-tables-rows{ overflow:visible !important; max-height:none !important; }
  #lobby-preview-col{ display:none !important; }
  /* нав-кнопки (Настройки/Правила/Владелец/Отчёт) — в ряд по 2, экономим высоту */
  #lobby-nav-buttons{ flex-direction:row !important; flex-wrap:wrap !important; }
  #lobby-nav-buttons > button{ flex:1 1 46% !important; text-align:center !important; }
  /* «Моё лобби»: настройки и «создать стол» — друг под другом, на всю ширину */
  #lobby-top-row{ flex-direction:column !important; }
  #lobby-top-row .lobby-box{ flex:1 1 auto !important; max-width:100% !important; width:100% !important; }
  /* футер из absolute → в поток, чтобы не перекрывал контент */
  #screen-lobby .app-footer{ position:static !important; margin-top:6px !important; }
  /* авторизация — карточка на всю ширину с полями */
  #screen-auth .auth-box{ width:100% !important; max-width:380px !important; }

  /* ── ИГРОВОЙ СТОЛ на телефоне ──────────────────────────────────────────────
     Десктоп сдвигал стол влево под чат справа (translateX) и ужимал ширину —
     на телефоне это давало крошечный перекошенный стол. Возвращаем на всю ширину. */
  body.screen-game .table-wrap{ max-width:100vw !important; transform:none !important; margin:1.5vh auto 0 !important; }
  body.screen-game .bottom-hud{ max-width:100vw !important; transform:none !important; left:0 !important; right:0 !important; }
  /* чат: вместо фикс-панели 220px справа — выезжающая снизу по кнопке 💬 */
  #chat-panel{
    top:auto !important; left:6px !important; right:6px !important;
    bottom:calc(84px + env(safe-area-inset-bottom)) !important;
    width:auto !important; min-width:0 !important; max-width:none !important; height:38vh !important;
  }
  body.screen-game #chat-panel{ display:none !important; }
  body.screen-game.chat-open #chat-panel{ display:flex !important; }
  body.screen-game #chat-toggle-btn{ display:flex !important; }

  /* строки игроков «создать стол»: grid minmax(180px) распирал панель шире экрана →
     горизонтальное переполнение (подписи/кнопки обрезались). Ужимаем: ник-колонка
     шринкуется до 0 с многоточием, баланс/кнопки по контенту. */
  .player-item-lobby{ grid-template-columns:minmax(0,1fr) auto auto !important; gap:8px !important; padding:8px 10px !important; }
  .player-item-lobby .col-nick{ min-width:0 !important; overflow:hidden !important; }
  .player-item-lobby .col-balance{ font-size:11px !important; }
  #lobby-main-panel{ overflow-x:hidden !important; }
  /* игровой стол: не центрировать по вертикали (карты дилера уходили под статус-бар) —
     прижимаем под верхние кнопки. Ширину на весь экран задаём выше. */
  #screen-game{ justify-content:flex-start !important; padding-top:calc(env(safe-area-inset-top) + 92px) !important; }
  body.screen-game .table-wrap{ margin-top:1vh !important; }
  /* v7.110.0: портретный стол выше (десктоп 54% — широкий овал; на телефоне делаем
     вертикальный, чтобы места разложить в 2 колонки по высоте — см. DEALER_*_PORTRAIT). */
  body.screen-game .poker-table{ padding-bottom:118% !important; }
  /* башмак и ставки на портрете — в верхние углы стола (JS-позиционирование отключено) */
  body.screen-game #shoe-hud{ top:8px !important; right:8px !important; left:auto !important; bottom:auto !important; transform:scale(.82) !important; transform-origin:top right !important; }
  body.screen-game #table-stakes{ top:8px !important; left:8px !important; right:auto !important; bottom:auto !important; transform:scale(.92) !important; transform-origin:top left !important; }
}
/* кнопка-переключатель чата — скрыта на десктопе, показывается только на телефоне (в @media выше) */
#chat-toggle-btn{
  display:none; position:fixed; right:10px; bottom:calc(84px + env(safe-area-inset-bottom)); z-index:199;
  width:44px; height:44px; border-radius:50%; align-items:center; justify-content:center;
  background:linear-gradient(180deg,#3b82f6,#2563eb); color:#fff; border:1px solid rgba(255,255,255,.25);
  font-size:20px; cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.5);
}