/* Mobile layout: preserve desktop styling and all existing module actions. */
@media screen and (max-width: 800px) {
  html,body{width:100%;max-width:100%;margin:0;overflow-x:clip;-webkit-text-size-adjust:100%}
  #appShell,#appShell .main-area{width:100%!important;max-width:100%;min-width:0;margin-left:0!important}
  #appShell #contentArea{padding:12px!important;min-width:0;max-width:100%;box-sizing:border-box}
  #appShell .app-view{min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
  #appShell #dynamicTopbar{position:relative!important;top:auto!important;padding:0!important;min-width:0}
  #appShell #dynamicTopbar .cat-topbar-primary{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:12px!important;min-height:0!important;padding:14px!important}
  #appShell #dynamicTopbar .cat-topbar-left{width:100%;gap:9px!important;min-width:0}
  #appShell #dynamicTopbar .cat-route-copy{flex:1;min-width:0}
  #appShell #dynamicTopbar #pageTitle{font-size:20px!important;overflow-wrap:anywhere}
  #appShell #dynamicTopbar #pageSubtitle{font-size:11px!important;margin:2px 0 0;line-height:1.35!important}
  #appShell #dynamicTopbar .cat-route-kicker{display:none!important}
  #appShell #dynamicTopbar .cat-route-icon{display:none!important}
  #appShell #dynamicTopbar #menuToggle,#appShell #dynamicTopbar #homeShortcut{width:44px!important;height:44px!important;min-width:44px!important}
  #appShell #dynamicTopbar .cat-center-brand{width:100%!important;max-width:100%!important;min-height:68px!important;padding:8px 12px!important;margin:0!important;box-sizing:border-box;justify-self:stretch}
  html body #appShell #dynamicTopbar .medn-header-mark{width:44px!important;height:44px!important;flex-basis:44px!important}
  html body #appShell #dynamicTopbar .medn-header-wordmark{font-size:24px!important;line-height:1.2!important}
  #appShell #dynamicTopbar .cat-topbar-right{display:flex!important;justify-content:space-between!important;gap:6px!important;width:100%;min-width:0;flex-wrap:wrap!important}
  #appShell #dynamicTopbar .cat-digital-clock,#appShell #dynamicTopbar .cat-user-card,#appShell #dynamicTopbar .session-status-button,#appShell #dynamicTopbar #logoutButton{height:46px!important;min-height:46px!important;padding:6px 8px!important;border-radius:9px!important;min-width:0!important}
  #appShell #dynamicTopbar .cat-digital-clock{flex:0 0 88px}
  #appShell #dynamicTopbar .cat-clock-digits{font-size:13px!important;letter-spacing:0!important}
  #appShell #dynamicTopbar .cat-clock-date{font-size:8px!important}
  #appShell #dynamicTopbar .cat-user-card{flex:1 1 100px;gap:7px!important;max-width:100%}
  #appShell #dynamicTopbar .cat-user-avatar{width:30px!important;height:30px!important;flex:0 0 30px;font-size:11px!important}
  #appShell #dynamicTopbar .user-summary{display:flex!important;min-width:0;flex-direction:column}
  #appShell #dynamicTopbar #currentUserName{display:block;font-size:11px!important;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #appShell #dynamicTopbar #currentUserRole{font-size:9px!important}
  #appShell #dynamicTopbar #logoutButton{flex:0 0 auto;font-size:11px!important}
  #appShell #dynamicTopbar .cat-app-fullscreen{display:none!important}
  #appShell #dynamicTopbar .session-status-button{flex:1 1 100%;justify-content:center!important;height:32px!important;min-height:32px!important}
  #appShell #dynamicTopbar .session-status-button>span:last-child{display:flex;gap:8px;align-items:center}
  #appShell #dynamicTopbar .session-status-button strong,#appShell #dynamicTopbar .session-status-button small{font-size:10px!important;margin:0!important}
  #appShell #dynamicTopbar .cat-live-ticker{min-width:0;max-width:100%;gap:6px!important;padding:6px 10px!important}
  #appShell #dynamicTopbar .cat-live-label{font-size:9px!important;white-space:nowrap}
  #appShell #dynamicTopbar .cat-ticker-controls{display:none!important}
  #sidebar{position:fixed!important;top:0!important;bottom:0!important;left:0!important;width:min(310px,86vw)!important;height:100dvh!important;max-height:100dvh!important;z-index:10000!important;overflow-y:auto!important;overscroll-behavior:contain;transform:translateX(-105%)!important;visibility:hidden;transition:transform .2s,visibility .2s;box-shadow:12px 0 36px #00172b44}
  #sidebar.open{transform:translateX(0)!important;visibility:visible}
  #sidebar .nav-item{min-height:48px!important}
  #sidebar .nav-copy strong{font-size:14px!important}
  #contentArea .form-grid,#contentArea .filter-grid,#qaAuditHeaderFields,#poAuditHeaderFields,.admin111-grid{grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
  #contentArea input:not([type=checkbox]):not([type=radio]),#contentArea select,#contentArea textarea,dialog input:not([type=checkbox]):not([type=radio]),dialog select,dialog textarea{font-size:16px!important;max-width:100%;min-width:0;box-sizing:border-box}
  #contentArea input:not([type=checkbox]):not([type=radio]),#contentArea select,dialog input:not([type=checkbox]):not([type=radio]),dialog select{min-height:44px}
  #contentArea button,#contentArea .button,dialog button{min-height:44px;touch-action:manipulation}
  #contentArea .table-wrapper,#contentArea [class*="table-wrap"],#contentArea [class*="table-shell"]{max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  #contentArea table{font-size:12px}
  #contentArea th,#contentArea td{min-width:72px}
  #contentArea .panel,#contentArea .section-card{min-width:0;max-width:100%;box-sizing:border-box}
  #homeRoot .home-shell{padding:0 0 16px!important;min-width:0}
  #homeRoot .home-hero{padding:22px 18px!important;border-radius:18px!important;grid-template-columns:minmax(0,1fr)!important}
  #homeRoot .home-hero h1,#homeRoot .home-hero h2{font-size:26px!important;line-height:1.2!important;overflow-wrap:anywhere}
  #homeRoot .home-section{padding:18px 14px!important;min-width:0}
  #homeRoot .home-section h2{font-size:21px!important;line-height:1.25}
  #homeRoot .home-section-heading{flex-wrap:wrap;gap:12px}
  #homeRoot .home-carousel-controls-bar{max-width:100%;overflow-x:auto}
  #homeRoot .home-metric-grid,#homeRoot .home-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  #homeRoot .home-bottom-grid,#homeRoot .home-spotlight-card{grid-template-columns:minmax(0,1fr)!important}
  dialog[open]{max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 24px)!important;width:calc(100vw - 20px);box-sizing:border-box;overflow:auto!important;overscroll-behavior:contain}
  #admin111Dialog form{padding:18px 14px!important}
  dialog table{min-width:700px}
  .cat-global-credit-bar{position:static!important;inset:auto!important;width:100%!important;min-height:0!important;padding:12px 16px!important;box-sizing:border-box}
  .cat-global-credit-inner{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:5px 10px!important;font-size:9px!important;line-height:1.6!important;text-align:center}
  #compactPrintDock{right:10px!important;bottom:max(10px,env(safe-area-inset-bottom))!important}
  #loginScreen.customer-login{min-height:100dvh!important;padding:28px max(18px,env(safe-area-inset-left)) 36px!important;gap:24px!important;box-sizing:border-box;grid-template-columns:minmax(0,1fr)!important}
  #loginScreen.customer-login .customer-login-intro{max-width:440px}
  #loginScreen.customer-login .customer-monogram{font-size:28px;margin-bottom:12px}
  #loginScreen.customer-login .customer-eyebrow{margin-bottom:12px;font-size:10px}
  #loginScreen.customer-login .customer-login-intro h1{font-size:32px!important;line-height:1.12!important;margin-bottom:12px}
  #loginScreen.customer-login .customer-description{font-size:14px!important;line-height:1.55!important;margin:0}
  #loginScreen.customer-login .customer-intro-line,#loginScreen.customer-login .customer-login-intro>small{display:none}
  #loginScreen.customer-login .login-card{width:100%!important;max-width:440px!important;padding:26px 22px!important;border-radius:22px!important;box-sizing:border-box}
  #loginScreen.customer-login .brand-block h2{font-size:26px!important}
  #loginScreen .medn-login-identity .customer-org-name{font-size:23px!important}
  #loginScreen .medn-login-mark{width:48px!important;height:48px!important;flex-basis:48px!important}
  #loginScreen.customer-login input{font-size:16px!important;min-height:48px!important}
  #loginScreen.customer-login button[type=submit]{min-height:50px!important;font-size:16px!important}
}
@media screen and (max-width:380px){
  #appShell #contentArea{padding:9px!important}
  html body #appShell #dynamicTopbar .medn-header-wordmark{font-size:21px!important}
  #homeRoot .home-metric-grid,#homeRoot .home-link-grid{grid-template-columns:minmax(0,1fr)!important}
  #loginScreen.customer-login .login-card{padding:24px 18px!important}
  #loginScreen .medn-login-identity{gap:10px!important}
  #loginScreen .medn-login-identity .customer-org-name{font-size:20px!important}
}
@media(prefers-reduced-motion:reduce){#sidebar{transition:none!important}}
