/* Mobile layout layer; tables scroll within their region, not the whole page. */
@media(max-width:768px){
  html{scroll-padding-top:72px}
  body{min-width:0!important}
  *,*::before,*::after{box-sizing:border-box}
  img,video,canvas{max-width:100%;height:auto}
  input,select,textarea{max-width:100%;min-width:0}
  input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{font-size:16px!important}
  pre{max-width:100%;overflow:auto;white-space:pre}
  p,a,dd{overflow-wrap:anywhere}
  body[data-ui=console] .main{margin-left:0!important;width:100%!important;min-width:0}
  body[data-ui=console] :is(.content,.workspace-stage,.workspace-body,.settings-main){min-width:0;max-width:100%}
  body[data-ui=console] .content{padding:16px 12px!important}
  body[data-ui=console] :is(.form2,.frm,.f2,.aw-grid,.ap-grid,.dashboard-layout,.account-layout,.ops-columns,.ops-summary,.desk-grid){grid-template-columns:minmax(0,1fr)!important}
  body[data-ui=console] :is(.form2,.frm,.aw-grid,.ap-grid)>*{min-width:0;grid-column:auto!important}
  body[data-ui=console] .aw-ups{grid-template-columns:minmax(0,1fr)!important;gap:16px}
  body[data-ui=console] :is(.ops-numbers,.ops-shortcuts,.metric-grid,.kpis){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  body#adminWorkspace .desk-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body#adminWorkspace .desk-metric{padding:14px;gap:10px;align-items:flex-start}
  body#adminWorkspace .desk-metric strong{font-size:23px;white-space:nowrap}
  body#adminWorkspace .desk-metric span{white-space:normal}
  body[data-ui=console] :is(.ops-primary,.ops-numbers,.ops-block,.section-panel,.form-section){padding:16px!important;min-width:0}
  body[data-ui=console] :is(.ops-dash,.dashboard-layout){gap:16px!important}
  body[data-ui=console] :is(.top-center,.admin-search){display:none!important}
  body[data-ui=console] .top{padding:0 12px!important;gap:8px}
  body[data-ui=console] .top .menu-btn{display:inline-flex!important;min-width:40px;min-height:40px}
  body[data-ui=console] .side{width:min(280px,86vw)!important;max-height:100dvh;overflow-y:auto}
  body[data-ui=console] :is(.table-wrap,.data-table,div.tbl,.table-scroll){width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  body[data-ui=console] :is(.table-wrap,.data-table,div.tbl,.table-scroll)>table{min-width:640px}
  body[data-ui=console] :is(.filter-panel,.biz-filter,.workspace-actions,.head-actions,.vactions){flex-wrap:wrap;gap:10px!important;min-width:0}
  body[data-ui=console] :is(.filter-panel,.biz-filter)>:is(input,select,label,.field){width:100%!important;min-width:0!important;max-width:100%}
  body[data-ui=console] :is(.btn,button:not(.grp):not(.grp-t):not(.icon-btn)){min-height:40px}
  body[data-ui=console] .settings-body{display:flex!important;flex-direction:column!important}
  body[data-ui=console] .settings-side{width:100%!important;max-width:100%;display:flex;flex-direction:row;flex-wrap:nowrap!important;overflow-x:auto;gap:4px;padding:8px!important}
  body[data-ui=console] .settings-side .ss-grp{display:none}
  body[data-ui=console] .settings-side a{white-space:nowrap;flex:none}
  :is(.modal,.merchant-modal,.agree-panel,.modal-card){width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - 24px);overflow:auto;margin:12px auto!important}
  :is(.modal-body,.merchant-modal-body){padding:16px!important;min-width:0}
  :is(.modal-foot,.merchant-modal-foot){display:flex;flex-wrap:wrap;gap:8px}
  :is(.aw-steps,.ap-steps,.steps){max-width:100%;overflow-x:auto;justify-content:flex-start!important}
  :is(.aw-steps,.ap-steps,.steps)>*{flex-shrink:0}
  .landing .land-nav{padding:16px;gap:12px}
  .landing .land-nav nav{overflow-x:auto;justify-content:flex-start;gap:24px;padding:8px 0;white-space:nowrap}
  .landing .land-hero{padding:32px 16px 24px;min-width:0;overflow:hidden}
  .landing .land-copy h1{font-size:clamp(30px,8.5vw,40px);line-height:1.25}
  .landing .land-copy p{font-size:15px;line-height:1.8}
  .landing .land-actions{display:flex;flex-wrap:wrap;gap:12px}
  .landing .land-actions a{min-height:44px;display:inline-flex;align-items:center}
  .landing .land-tags{display:flex;flex-wrap:wrap;gap:8px;font-size:12px}
  .landing .land-network{height:320px;width:100%;min-width:0}
  .landing .network-node{min-width:0;max-width:45%;padding:8px;font-size:11px}
  .landing .network-core{width:100px;height:100px}
  .landing :is(.land-services,.land-scenarios,.land-developer,.land-faq){padding-left:16px;padding-right:16px;min-width:0}
  .landing :is(.developer-diagram,.scenario-grid,.land-service-grid){min-width:0;max-width:100%}
  .landing .land-footer{gap:20px}
  .knowledge :is(.help-head,.help-nav){padding:20px 16px;flex-wrap:wrap;gap:16px}
  .knowledge :is(.help-wrap,.help-detail){width:100%;max-width:100%;padding:16px}
  .knowledge :is(.help-list,.help-grid){grid-template-columns:minmax(0,1fr)}
  .knowledge .help-search-wrap{width:100%;min-width:0}
  .knowledge .help-tabs{max-width:100%;overflow-x:auto;flex-wrap:nowrap}
  body:not([data-ui=console]) .layout{width:100%;min-width:0}
  body:not([data-ui=console]) .layout .main{width:100%;min-width:0;max-width:100%}
  body:not([data-ui=console]) .tbl{max-width:100%;overflow-x:auto}
  body[data-ui=cashier] .wrap{width:100%;max-width:100%;padding:16px}
  body[data-ui=cashier] .ordrow{flex-wrap:wrap;gap:8px}
  body[data-ui=cashier] .ordrow .val{min-width:0;overflow-wrap:anywhere}
  body[data-ui=auth]{padding:16px!important}
  body[data-ui=auth] :is(.login-wrap,.login-card){width:100%!important;max-width:440px;min-width:0;margin:auto}
  body[data-ui=auth] .login-card{padding:24px 18px!important}
  body[data-ui=auth] .auth-visual{display:none!important}
}
@media(max-width:380px){
  body[data-ui=console] :is(.metric-grid,.kpis,.ops-numbers){grid-template-columns:minmax(0,1fr)!important}
  .landing .land-actions a{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
