/* V1.1.118 | shared responsive policy for operations console and H5 chat.
   Loaded AFTER the component CSS layers. No dependency on a JS/UI framework.
   Target: phones (incl. narrow/landscape), tablet, desktop, H5-app safe areas. */
:root { --app-safe-top:env(safe-area-inset-top,0px); --app-safe-right:env(safe-area-inset-right,0px); --app-safe-bottom:env(safe-area-inset-bottom,0px); --app-safe-left:env(safe-area-inset-left,0px); }
html,body { width:100%; max-width:100%; overflow-x:hidden; -webkit-text-size-adjust:100%; }
#app-screen,#member-app { max-width:100%; min-width:0; }
#app-screen .shell-main,#app-screen .workspace,#app-screen .workspace-inner,#app-screen .page-content,
#app-screen .section,#app-screen .group-manager-layout,#app-screen .group-directory,#app-screen .group-detail-panel,
#app-screen .detail-content,#app-screen .table-wrap,
#member-app .list-pane,#member-app .chat-pane,#member-app .chat-info-panel,#member-app .messages { min-width:0; max-width:100%; }
/* Real data tables may scroll INSIDE the table container, never force the page wider. */
#app-screen .table-wrap{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
#app-screen .table-wrap table{max-width:none}
#app-screen .detail-tabs {max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
#app-screen .detail-tab{flex-shrink:0;white-space:nowrap}
#app-screen .form-grid >*,#app-screen .search-toolbar >*,#app-screen .inline >* {min-width:0}
#app-screen .form-grid input,#app-screen .form-grid select,#app-screen .form-grid textarea,
#app-screen .mini-input,#app-screen .toolbar-search {max-width:100%}
#app-screen .admin-operation-dialog,#app-screen .admin-dialog {width:min(100%,600px);max-width:calc(100vw - 22px);max-height:calc(100dvh - 22px - var(--app-safe-bottom));overflow-y:auto;overscroll-behavior:contain}
#member-app .msg-bubble,#member-app .msg-file-info,#member-app .group-library-file-copy{overflow-wrap:anywhere}
#member-app .group-library-panel{height:100dvh;max-height:100dvh}
#member-app .group-library-body{overscroll-behavior-y:contain}
#member-app .group-library-footer{padding-bottom:max(14px,calc(10px + var(--app-safe-bottom)))}
/* Native-feeling interactions: predictable touch feedback, no accidental page-level side scroll. */
@media (hover:none) and (pointer:coarse){
  #app-screen button,#member-app button {touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  #app-screen .gm-picker-item:active,#member-app .group-library-item:active {background:#edf4ff}
}
@media (max-width:1024px){
  #app-screen .page-content >*,#app-screen .workspace-inner >* {min-width:0}
  #app-screen .group-manager-layout{min-width:0}
  #member-app .chat-heading,#member-app .group-info{min-width:0}
}
@media (max-width:800px){
  #app-screen .sidebar{padding-top:var(--app-safe-top);padding-bottom:max(14px,var(--app-safe-bottom));max-height:100dvh}
  #app-screen .workspace {min-width:0;max-width:100%;overscroll-behavior-y:contain}
  #app-screen .group-directory-items{max-height:none}
  #app-screen .menu-toggle {min-width:44px;min-height:44px}
  #app-screen .topbar {padding-right:max(12px,var(--app-safe-right));padding-left:max(10px,var(--app-safe-left))}
  #app-screen .gm-admin-table-heading{min-width:0}
  #member-app .native-group-modal,#member-app .chat-info-panel,#member-app .group-library-panel{overscroll-behavior-y:contain}
}
@media (max-width:600px){
  #app-screen .workspace-heading{max-width:100%;min-width:0}
  #app-screen .workspace-heading h1{overflow-wrap:anywhere}
  #app-screen .topbar-right{min-width:0}
  #app-screen .account{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #app-screen input:not([type=checkbox]):not([type=radio]),#app-screen select,#app-screen textarea,
  #member-app input:not([type=checkbox]):not([type=radio]),#member-app select,#member-app textarea {font-size:16px}
  #app-screen .gm-admin-primary-actions .btn,#app-screen .gm-owner-row .btn{min-height:44px}
  /* Mobile management ledger: continuous table rows, not separate boxes/cards. */
  #app-screen .gm-admin-table .table-wrap {overflow-x:hidden!important;border-left:0!important;border-right:0!important}
  #app-screen .gm-admin-table table {width:100%;min-width:0!important;display:block}
  #app-screen .gm-admin-table thead{display:none}
  #app-screen .gm-admin-table tbody{display:block;width:100%}
  #app-screen .gm-admin-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:13px 11px;align-items:start;width:100%;padding:14px 5px!important;border-bottom:1px solid #e8edf3;background:#fff!important}
  #app-screen .gm-admin-table tbody tr:last-child{border-bottom:0}
  #app-screen .gm-admin-table tbody td{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0;width:100%;padding:0!important;border:0!important;white-space:normal;overflow-wrap:anywhere}
  #app-screen .gm-admin-table tbody td:before{content:attr(data-label);font-size:11px;color:#8695a9;line-height:1.4}
  #app-screen .gm-admin-table tbody td[data-label="账号"],#app-screen .gm-admin-table tbody td[data-label="操作"]{grid-column:1/-1}
  #app-screen .gm-admin-table tbody td[data-label="账号"]{order:-1}
  #app-screen .gm-admin-table tbody td[data-label="操作"]{padding-top:9px!important;border-top:1px solid #f0f2f6!important}
  #app-screen .gm-admin-table tbody td[colspan]{grid-column:1/-1}
  #app-screen .gm-table-link{min-height:42px;text-align:left}
  /* Center on large screens; native bottom-sheet on phones. */
  .gm-picker-mask{align-items:flex-end!important;padding:0!important;padding-top:var(--app-safe-top)!important}
  .gm-picker-dialog{width:100%!important;max-width:none!important;max-height:calc(100dvh - var(--app-safe-top))!important;min-height:min(470px,84dvh)!important;border-radius:16px 16px 0 0!important;padding-bottom:var(--app-safe-bottom);box-shadow:0 -8px 40px #10253e36}
  .gm-picker-heading{padding-top:20px!important}
  .gm-picker-item{min-height:60px}
  .gm-picker-footer{padding-bottom:max(14px,calc(10px + var(--app-safe-bottom)))!important}
  .gm-picker-search input{height:46px!important;font-size:16px!important}
  .gm-picker-close{min-height:44px;min-width:44px;display:grid;place-items:center}
  .gm-picker-actions .btn,.gm-picker-pager-buttons .btn{min-height:44px!important}
  #member-app .group-library-panel {width:100vw!important;max-width:100vw!important}
  #member-app .group-library-header {padding-top:var(--app-safe-top);height:calc(58px + var(--app-safe-top));min-height:calc(58px + var(--app-safe-top))}
  #member-app .group-library-tabs{overflow-x:auto;scrollbar-width:none}
  #member-app .group-library-item{min-width:0}
  #member-app .group-library-upload-actions button{min-height:44px}
  #member-app .native-group-modal .native-modal-content{overscroll-behavior-y:contain}
  #member-app .messages {padding-inline:clamp(10px,3vw,18px)}
  #member-app .msg-content{max-width:min(83%,540px)}
  #member-app .chat-heading{overflow:hidden}
}
@media (max-width:360px){
  #app-screen .topbar{gap:6px}
  #app-screen .topbar-right{gap:4px}
  #app-screen .topbar-right .account{max-width:58px}
  #app-screen .gm-admin-intro{gap:12px}
  #app-screen .gm-admin-table-heading{flex-wrap:wrap;gap:6px}
  .gm-picker-heading p{font-size:11px}
  .gm-picker-item-name small{font-size:11px}
  .gm-picker-footer{gap:9px}
  #member-app .group-library-item{gap:8px;padding-inline:10px}
  #member-app .group-library-file-icon{flex-basis:34px;width:34px;height:34px}
  #member-app .msg-row{gap:6px}
  #member-app .msg-avatar{width:34px;height:34px}
}
@media (max-height:540px) and (max-width:900px){
  /* Landscape phone / on-screen keyboard: keep actions visible and list scrollable. */
  .gm-picker-dialog{min-height:0!important;max-height:calc(100dvh - var(--app-safe-top))!important}
  .gm-picker-heading{padding-top:10px!important;padding-bottom:8px!important}
  .gm-picker-heading p{display:none}
  .gm-picker-search{padding-top:9px!important}
  .gm-picker-item{min-height:50px}
  .gm-picker-footer{padding-top:9px!important;padding-bottom:max(9px,var(--app-safe-bottom))!important}
}
@media (prefers-reduced-motion:reduce){.gm-picker-dialog{scroll-behavior:auto!important}}

/* Public login screens are part of the future WebView experience as well. */
@media (max-width:760px){
  body:has(.wrap > .card) .wrap{max-width:100%;min-width:0;padding-left:max(16px,var(--app-safe-left));padding-right:max(16px,var(--app-safe-right));padding-bottom:max(18px,var(--app-safe-bottom))}
  body:has(.wrap > .card) .card{min-width:0;max-width:100%}
  body:has(.wrap > .card) #form input,#member-login .login-field input{font-size:16px}
  body:has(.wrap > .card) #form button,#member-login button[type=submit]{min-height:44px}
}

/* V1.1.140: ultra-compact embedded WebViews / narrow split-screen windows.
   Never force the document to 320px when the actual CSS viewport is smaller. */
@media (max-width:319px){
  html,body{min-width:0}
  #member-app .chat-info-panel,#member-app .chat-info-panel.manager-open{max-width:100vw}
  #member-app .group-number-inline{gap:5px;max-width:calc(100% - 56px)}
  #member-app .chat-info-row{gap:6px;padding-left:11px;padding-right:11px}
  #member-app .group-number-inline button{padding-left:4px;min-width:32px}
}