/* 5.28.561 — UI-04 systematic mobile hardening. Geometry only; theme palettes stay local. */
@media (max-width:700px){
  html,body{max-width:100%;overflow-x:hidden}
  body.has-sitebg main,body.has-sitebg .content,body.has-sitebg .wrap{min-width:0;max-width:100%;box-sizing:border-box}
  .pf-wrap,.ab-wrap,.srv-adm-wrap,.mon-wrap,.wt-workspace,.ta-wrap{max-width:calc(100vw - 16px)!important;box-sizing:border-box!important;margin-left:auto!important;margin-right:auto!important}
  .pf-card,.pf-sec,.ab-card,.admin-card,.mon-card,.wt-workspace>*{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
  .pf-grid,.pf-metrics,.ab-slots,.ab-plans,.ab-consents{min-width:0!important}
  .pf-grid>* ,.pf-metrics>* ,.ab-slots>* ,.ab-plans>* ,.ab-consents>*{min-width:0!important;max-width:100%!important}
  .pf-stat-selectors,.pf-game-stats-sec{overflow:visible!important}
  .pf-stat-selectors .pf-select-half{overflow:visible!important}
  .pf-game-stats-sec .srvpick-list{max-width:calc(100vw - 34px)!important}
  .ab-f input,.ab-f textarea,.ab-f select,.ab-fieldbox input,.ab-fieldbox textarea{max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
  .ab-btn,.tk-btn,.ta-btn,button,input,select,textarea{max-width:100%;box-sizing:border-box}
  .admin-card{overflow-wrap:anywhere}
  .srv-adm-selector-frame,.srv-adm-selector-frame .srvpick-wrap{max-width:100%!important;min-width:0!important}
  .mon-game-frame{max-width:calc(100vw - 12px)!important}
  .mon-game-half .srvpick-list{max-width:calc(100vw - 28px)!important}
}
@media (max-width:520px){
  .pf-grid,.pf-metrics{grid-template-columns:1fr!important}
  .ab-slots,.ab-plans,.ab-consents{grid-template-columns:1fr!important}
  .ab-card{padding-left:14px!important;padding-right:14px!important}
  .pf-card,.pf-sec{padding-left:12px!important;padding-right:12px!important}
}

/* 5.28.562 — mobile pass based on real Monitoring/Cabinet screenshots. */
@media (max-width:700px){
  /* Monitoring must use the whole phone viewport instead of preserving the desktop canvas. */
  body.has-sitebg .mon-game-frame,
  body.has-sitebg .mon-control-panel,
  body.has-sitebg #monList,
  body.has-sitebg .mon-list-settings{
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    margin-left:auto!important;margin-right:auto!important;
    box-sizing:border-box!important;
  }
  body.has-sitebg .mon-control-panel{padding:10px!important}
  body.has-sitebg .mf-row{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  body.has-sitebg .mf-c,body.has-sitebg .mf-c.w50,body.has-sitebg .mf-c.w33{width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important}
  body.has-sitebg .mf input,body.has-sitebg .mf select,body.has-sitebg .mf button,body.has-sitebg .mf .jmi-select{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
  body.has-sitebg .mon-actions{grid-template-columns:1fr!important;max-width:none!important;gap:8px!important}
  body.has-sitebg .mon-sum{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;padding:8px 0 0!important}
  body.has-sitebg .mon-sum .box,body.has-sitebg .mon-sum .box.tm{display:block!important;min-width:0!important;width:auto!important;margin:0!important;padding:10px 6px!important;box-sizing:border-box!important}
  body.has-sitebg .mon-server-group{padding:8px!important;border-radius:15px!important}
  body.has-sitebg .mtop{grid-template-columns:1fr!important;gap:10px!important}
  body.has-sitebg .mtop-i,body.has-sitebg .mtop-i.mtop-premium:not(.free):not(.lot){min-height:0!important;width:100%!important;max-width:100%!important}
  body.has-sitebg .mon-card{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
  body.has-sitebg .mon-head,body.has-sitebg .mon-meta,body.has-sitebg .mon-act,body.has-sitebg .mon-bar{padding-right:0!important;margin-right:0!important}
  body.has-sitebg .mon-corner{position:static!important;width:100%!important;max-width:100%!important;margin:0 0 12px!important;box-sizing:border-box!important}
  body.has-sitebg .mon-list-settings{justify-content:center!important;padding:0!important}

  /* Cabinet game statistics: two selectors become a vertical mobile flow. */
  body.has-sitebg .pf-game-stats-sec{overflow:visible!important;isolation:auto!important}
  body.has-sitebg .pf-stat-selectors{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;overflow:visible!important;padding:8px!important}
  body.has-sitebg .pf-stat-selectors .pf-select-half{width:100%!important;max-width:100%!important;height:126px!important;min-height:126px!important;overflow:visible!important}
  body.has-sitebg .pf-stat-selectors .srvpick-wrap{width:calc(100% - 24px)!important;max-width:none!important;padding:0!important;margin:0 auto!important}
  body.has-sitebg .pf-stat-selectors .srvpick,body.has-sitebg .pf-stat-selectors .srvpick-cur{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
  body.has-sitebg .pf-stat-selectors .srvpick-cur{min-height:48px!important;padding:9px 12px!important}
  body.has-sitebg .pf-stat-selectors .srvpick-cap{top:-22px!important;font-size:9px!important}
  body.has-sitebg .pf-stat-selectors .srvpick-list{left:0!important;right:auto!important;width:100%!important;min-width:100%!important;max-width:100%!important;transform:translateY(-6px)!important;box-sizing:border-box!important;white-space:normal!important}
  body.has-sitebg .pf-stat-selectors .srvpick.open .srvpick-list{transform:translateY(0)!important}
  body.has-sitebg .pf-stat-selectors .srvpick-list a{min-width:0!important;width:100%!important;box-sizing:border-box!important}
}
@media (max-width:430px){
  body.has-sitebg .mon-sum{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.has-sitebg .mon-game-frame{width:calc(100vw - 8px)!important;max-width:calc(100vw - 8px)!important}
  body.has-sitebg .mon-game-half>.srvpick-wrap{width:calc(100% - 16px)!important}
}
/* 5.28.567 — PM dialog action buttons: geometry is identical in both themes. */
html.theme-light .jlc-dlg-act{background:rgba(255,255,255,.62);border-color:rgba(74,91,105,.22);color:#667681}
html.theme-light .jlc-dlg-act:hover{background:rgba(255,255,255,.88);color:#315c6d;border-color:rgba(49,92,109,.42)}
html.theme-light .jlc-dlg-act.muted{color:#9a6500;border-color:rgba(154,101,0,.38)}


/* 5.28.642 — UI-02/UI-03: единая клавиатурная видимость и reduced motion. */
:where(a,button,input,select,textarea,[role="button"],[tabindex]):focus-visible{
  outline:3px solid var(--jmi-accent,#55d7ff)!important;outline-offset:3px!important;
}
html.theme-light :where(a,button,input,select,textarea,[role="button"],[tabindex]):focus-visible{
  outline-color:#176b87!important;box-shadow:0 0 0 2px rgba(255,255,255,.92)!important;
}
@media (prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
