/* Loaded after module styles so the same mobile shell serves every ERP route. */
.mobile-menu-toggle,.mobile-menu-close,.mobile-nav-overlay{display:none}
@media(max-width:820px){
  .app-shell{display:block}
  .workspace{padding:12px max(12px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));min-width:0}
  .sidebar{display:none;position:fixed;inset:0 auto 0 0;width:min(320px,calc(100% - 48px));height:100vh;height:100dvh;z-index:1101;padding:max(16px,env(safe-area-inset-top)) 12px max(20px,env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;box-shadow:8px 0 32px #10203330}
  .mobile-nav-open .sidebar{display:block}
  .mobile-nav-overlay:not([hidden]){display:block;position:fixed;inset:0;background:#10203380;z-index:1100;touch-action:none}
  .mobile-menu-toggle,.mobile-menu-close{display:inline-grid;place-items:center;flex:0 0 44px;width:44px;min-height:44px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--brand);font-size:24px}
  .mobile-menu-close{margin:0 0 6px auto}
  .sidebar .brand{padding:4px 4px 16px}
  .sidebar .brand>div:last-child{min-width:0;overflow-wrap:anywhere}
  .sidebar .nav button{min-height:44px}
  .topbar{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;align-items:stretch;min-width:0}
  .mobile-page-heading{display:flex;align-items:center;gap:10px;min-width:0}
  .mobile-page-heading .eyebrow{display:none}
  .mobile-page-heading h1{font-size:22px;margin:0;min-width:0;overflow-wrap:anywhere;line-height:1.35}
  .top-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;max-width:100%;padding-left:54px}
  .top-actions .icon-btn{width:44px;min-width:44px;height:44px}
  .top-actions .avatar-btn{min-height:44px;min-width:0;max-width:100%}
  .avatar-name{overflow-wrap:anywhere}
  .top-actions .logout-btn{min-height:44px}
  .page,.panel,.panel-head,.content-grid,.split-layout,.form-grid,.filter-row,.filters{min-width:0;max-width:100%}
  .panel{padding:12px}
  .panel-head{gap:10px}
  .form-grid,.modal-form,.ops-form{grid-template-columns:minmax(0,1fr)}
  .form-grid>*,.modal-form>*,.ops-form>*,label{min-width:0;max-width:100%}
  input:not([type=checkbox]):not([type=radio]),select,textarea{max-width:100%;min-width:0;font-size:16px;box-sizing:border-box}
  .filter-row,.filters{flex-wrap:wrap}
  .filter-row>*{min-width:0;max-width:100%}
  .table-wrap{max-width:100%;overflow:auto;overscroll-behavior-x:contain}
  button,.plain-btn,.dark-btn,.outline-btn,.icon-btn{min-height:44px}
  .modal-backdrop{padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
  .modal,.entity-modal{width:100%;max-width:100%;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;padding:16px}
  .modal-head{padding-right:44px;min-width:0}
  .modal-close{width:44px;height:44px}
  #livePage iframe{display:block;width:100%!important;height:calc(100vh - 144px)!important;height:calc(100dvh - 144px)!important;min-height:400px!important;border-radius:12px!important}
  .login-screen{padding:16px}
  .login-card{padding:20px;min-width:0;max-width:100%}
}
@media(max-width:430px){
  .top-actions{padding-left:0}
  .top-actions .avatar-btn{flex:1 1 100px}
}
@media(max-width:820px){.topbar{height:auto;padding:12px;min-height:0}}
@media(max-width:820px){
  .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
  .metric{min-width:0;padding:12px;min-height:0;overflow-wrap:anywhere}
  .metric strong{font-size:22px;line-height:1.3}
}
@media(max-width:820px){.sidebar{background:#f8fcff}}
