/* 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(64px + env(safe-area-inset-left)) !important; }
#global-player-controls{ right:calc(8px + env(safe-area-inset-right)); }
/* нижний игровой HUD — над домашним индикатором */
body.screen-game .bottom-hud{ padding-bottom:env(safe-area-inset-bottom); }

/* Mobile identity/status treatment must survive portrait↔landscape rotation. */
@media (pointer:coarse) and (max-width:1100px) {
  body.screen-game .seat-me:not(.seat-top) .me-seat-tag{ display:none !important; }
  body.screen-game .seat-me:not(.seat-top) .chair-wrap{
    border:3px solid rgba(240,212,128,.95) !important;
    box-shadow:0 0 0 1px rgba(232,200,115,.25),0 0 18px rgba(232,200,115,.45),0 8px 16px rgba(0,0,0,.48) !important;
  }
  body.screen-game .action-panel.action-panel--status-only{
    width:70%;
    max-width:70%;
    align-self:center;
    box-sizing:border-box;
  }
}
/* лобби/авторизация — заголовок и переключатель языка не под вырезом */
#screen-auth, #screen-lobby{ padding-top:calc(18px + env(safe-area-inset-top)) !important; }

/* Phone landscape and unfolded foldables sit between the stacked phone lobby
   and the full desktop three-column lobby. Keep all three columns inside the
   viewport while preserving scrollable navigation and table lists. */
@media (pointer:coarse) and (min-width:761px) and (max-width:1100px) {
  #screen-lobby{
    justify-content:flex-start !important;
    gap:8px !important;
    padding:8px !important;
  }
  #lobby-left-col{
    width:170px !important;
    min-width:0 !important;
  }
  #lobby-main-col{
    min-width:0 !important;
    max-width:none !important;
  }
  #lobby-preview-col{
    width:310px !important;
    min-width:0 !important;
  }
  #lobby-main-panel,
  #global-table-preview{
    padding:8px !important;
  }
  #lobby-nav-buttons > button,
  #btn-get-chips{
    min-width:0 !important;
    padding:7px 8px !important;
    font-size:10px !important;
  }
  #lobby-toggle-btn{
    min-width:0 !important;
    margin-top:0 !important;
    padding:10px 8px !important;
    font-size:11px !important;
  }
  #global-subtabs > button{
    padding:6px 8px !important;
    font-size:10px !important;
  }
  #gp-title{ font-size:14px !important; }
  #gp-limits{ font-size:10px !important; }
  body.screen-game .table-wrap{
    max-width:calc(100vw - 96px) !important;
    transform:none !important;
    margin:1vh auto 0 !important;
  }
  body.screen-game .bottom-hud{
    max-width:calc(100vw - 16px) !important;
    transform:none !important;
  }
  #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; }
}
@media (pointer:coarse) and (min-width:761px) and (max-width:1100px) and (orientation:landscape) {
  body.screen-game .table-wrap{
    max-width:calc(100vw - 96px) !important;
  }
}
@media (pointer:coarse) and (min-width:761px) and (max-width:1100px) and (orientation:portrait) {
  body.screen-game #seats-container:not(.desktop-compact) .seat-lefthalf{
    transform:translate(0,-50%) scale(var(--seat-scale, 1)) !important;
    transform-origin:left center !important;
  }
  body.screen-game #seats-container:not(.desktop-compact) .seat-righthalf{
    transform:translate(-100%,-50%) scale(var(--seat-scale, 1)) !important;
    transform-origin:right center !important;
  }
  body.screen-game #chat-panel{
    bottom:calc(158px + env(safe-area-inset-bottom)) !important;
  }
  body.screen-game #chat-toggle-btn{
    bottom:calc(158px + env(safe-area-inset-bottom)) !important;
  }
  body.screen-game #personal-table-invite-btn{
    position:fixed !important;
    top:calc(8px + env(safe-area-inset-top)) !important;
    right:auto !important;
    left:calc(64px + env(safe-area-inset-left)) !important;
    transform:none !important;
  }
  body.screen-game #table-rules-btn{
    top:calc(8px + env(safe-area-inset-top)) !important;
    right:calc(160px + env(safe-area-inset-right)) !important;
    width:44px !important;
    min-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    padding:0 !important;
    overflow:hidden;
    white-space:nowrap;
    font-size:0 !important;
  }
  body.screen-game #table-rules-btn::before{
    content:'\1F4D6';
    font-size:20px;
    line-height:1;
  }
}

/* Final rotated-phone contract. The generic <=760px rules above also serve
   portrait and otherwise win by source order on 726/756px Safari viewports. */
@media (pointer:coarse) and (max-width:1366px) and (orientation:landscape) {
  #screen-game{
    padding:8px !important;
  }
  body.screen-game .table-wrap{
    max-width:calc(100vw - 96px) !important;
    margin:0 auto !important;
    transform:none !important;
  }
  body.screen-game .poker-table{
    padding-bottom:min(62.1%, calc(100dvh - 112px)) !important;
  }
  body.screen-game .bottom-hud{
    max-width:calc(100vw - 16px) !important;
    left:0 !important;
    right:0 !important;
    transform:none !important;
  }
}

/* A rotated phone has desktop-like width but very little height. Keep the
   desktop rail geometry, lift it above the HUD, and compact betting controls. */
@media (pointer:coarse) and (max-width:1366px) and (orientation:landscape) {
  body.screen-game .poker-table{
    padding-bottom:min(62.1%, calc(100vh - 112px)) !important;
  }
  body.screen-game #seats-container:not(.desktop-compact) .seat-lefthalf{
    transform:translate(0,-50%) scale(var(--seat-scale, 1)) !important;
    transform-origin:left center !important;
  }
  body.screen-game #seats-container:not(.desktop-compact) .seat-righthalf{
    transform:translate(-100%,-50%) scale(var(--seat-scale, 1)) !important;
    transform-origin:right center !important;
  }
  body.screen-game .seat:not(.seat-top){
    /* Keep cards inside the compact felt and plaques above the fixed HUD. */
    top:86% !important;
    pointer-events:none !important;
  }
  /* 700-760px landscape viewports (17/17e/17 Pro) fall just below the desktop
     compact-layout media query. Anchor side seats inward instead of centering a
     190px plaque on x=0/x=100%, where half of it is untappable. */
  body.screen-game #seats-container.desktop-compact .seat-lefthalf{
    transform:translate(0,0) scale(var(--seat-scale, 1)) !important;
    transform-origin:left center !important;
  }
  body.screen-game #seats-container.desktop-compact .seat-righthalf{
    transform:translate(-100%,0) scale(var(--seat-scale, 1)) !important;
    transform-origin:right center !important;
  }
  body.screen-game .seat .pf-name,
  body.screen-game .seat button{
    pointer-events:auto !important;
  }
  #screen-game[data-phase="betting"] .seat-top{
    pointer-events:none !important;
  }
  #screen-game[data-phase="betting"] .seat-top .player-field{
    display:none !important;
  }
  #screen-game[data-phase="betting"] .seat-top .chair-wrap{
    display:none !important;
  }
  #screen-game[data-phase="betting"] .seat-top .chair-label,
  #screen-game[data-phase="betting"] .seat-top .seat-status{
    display:none !important;
  }
  #screen-game[data-phase="betting"] #seats-container.desktop-compact .seat:not(.seat-top) .player-field{
    bottom:30px !important;
  }
  #screen-game[data-phase="betting"] #seats-container.desktop-compact .seat-lefthalf .cards-row > button,
  #screen-game[data-phase="betting"] #seats-container.desktop-compact .seat-righthalf .cards-row > button{
    width:100% !important;
    height:44px !important;
    min-height:44px !important;
    padding:2px 4px !important;
  }
  body.screen-game #table-rules-btn{
    top:calc(8px + env(safe-area-inset-top)) !important;
    right:auto !important;
    left:calc(162px + env(safe-area-inset-left)) !important;
    width:44px !important;
    min-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    padding:0 !important;
    overflow:hidden;
    white-space:nowrap;
    font-size:0 !important;
  }
  body.screen-game #table-rules-btn::before{
    content:'\1F4D6';
    font-size:20px;
    line-height:1;
  }
  body.screen-game #personal-table-invite-btn{
    position:fixed !important;
    top:calc(8px + env(safe-area-inset-top)) !important;
    right:auto !important;
    left:calc(112px + env(safe-area-inset-left)) !important;
    transform:none !important;
  }
  body.screen-game #global-leave-btn,
  body.screen-game #personal-leave-seat-btn{
    top:calc(8px + env(safe-area-inset-top)) !important;
    left:calc(62px + env(safe-area-inset-left)) !important;
  }
  body.screen-game #shoe-hud{
    top:8px !important;
    right:170px !important;
    left:auto !important;
    bottom:auto !important;
    transform:scale(.78) !important;
    transform-origin:top right !important;
    pointer-events:none !important;
  }
  body.screen-game .bottom-hud{
    min-height:0 !important;
    padding:3px 8px calc(4px + env(safe-area-inset-bottom)) !important;
  }
  body.screen-game .bottom-hud .action-panel{
    min-height:0 !important;
    padding:4px 6px !important;
    border-radius:8px !important;
  }
  body.screen-game #action-msg{
    min-height:13px !important;
    margin-bottom:2px !important;
    font-size:11px !important;
    line-height:1.1 !important;
  }
  body.screen-game .betting-row{
    flex-wrap:nowrap !important;
    gap:8px !important;
    justify-content:center !important;
  }
  body.screen-game .betting-info{
    display:none !important;
  }
  body.screen-game .betting-controls{
    width:100% !important;
    min-width:0 !important;
    flex:1 1 auto !important;
    flex-direction:row !important;
    justify-content:center !important;
    gap:8px !important;
  }
  body.screen-game .bet-chips-panel{
    flex-wrap:nowrap !important;
    gap:4px !important;
    margin:0 !important;
  }
  body.screen-game .bet-chip-btn{
    width:44px !important;
    height:44px !important;
    font-size:10px !important;
  }
  body.screen-game .action-btns{
    flex-wrap:nowrap !important;
    gap:6px !important;
  }
  body.screen-game .btn-clear-bet,
  body.screen-game .btn-rebet,
  body.screen-game .btn-double-bet{
    width:44px !important;
    height:44px !important;
  }
  body.screen-game .btn-confirm-bet{
    min-height:44px !important;
    padding:8px 16px !important;
    white-space:nowrap !important;
  }
  body.screen-game #chat-toggle-btn{
    right:8px !important;
    bottom:calc(78px + env(safe-area-inset-bottom)) !important;
    width:40px !important;
    height:40px !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; }

  /* строки игроков «создать стол»: 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; }
}

/* Width selects the stacked lobby. Orientation selects the game geometry.
   Keeping both in one query made 720/756px landscape phones inherit the 118%
   portrait table after rotation, pushing every betting control off-screen. */
@media (max-width:760px) and (orientation:portrait) {
  body.screen-game .table-wrap{ max-width:100vw !important; transform:none !important; margin:1vh auto 0 !important; }
  body.screen-game .bottom-hud{ max-width:100vw !important; transform:none !important; left:0 !important; right:0 !important; }
  #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; }
  #screen-game{ justify-content:flex-start !important; padding-top:calc(env(safe-area-inset-top) + 92px) !important; }
  body.screen-game .poker-table{ padding-bottom:118% !important; }
  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 (pointer:coarse) and (max-width:760px) and (orientation:landscape) {
  body.screen-game #chat-toggle-btn{ display:flex !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);
}