#mobileMenuClose {display:none;}
/* CAT phone and tablet layout; desktop report styling is preserved. */
@media screen and (max-width: 767px) {
  html, body {width:100%;max-width:100%;}
  #appShell, #appShell .main-area, #appShell #contentArea {width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box;}
  #appShell #contentArea {padding:12px!important;}
  #appShell #dynamicTopbar {position:relative!important;min-height:0!important;width:100%!important;}
  #dynamicTopbar .cat-topbar-primary {display:flex!important;flex-direction:column;align-items:stretch;gap:10px;padding:12px!important;min-width:0;}
  #dynamicTopbar .cat-topbar-left {width:100%!important;max-width:100%!important;min-width:0;gap:10px;}
  #dynamicTopbar .cat-route-copy {min-width:0;flex:1;}
  #dynamicTopbar .cat-route-kicker {white-space:normal!important;flex-wrap:wrap;font-size:9px!important;}
  #dynamicTopbar #pageTitle {font-size:20px!important;line-height:1.3;overflow-wrap:anywhere;}
  #dynamicTopbar #pageSubtitle {font-size:11px!important;white-space:normal!important;line-height:1.5;}
  #dynamicTopbar .cat-route-icon {display:none;}
  #dynamicTopbar #menuToggle {flex:none;width:44px!important;height:44px!important;}
  #dynamicTopbar .cat-center-brand {order:0!important;align-self:center;margin:0!important;min-width:0!important;width:auto!important;padding:6px 14px!important;}
  #dynamicTopbar .cat-center-brand img {width:180px!important;max-width:100%!important;max-height:40px!important;}
  #dynamicTopbar .cat-topbar-right {display:flex!important;flex-wrap:wrap!important;justify-content:center;gap:8px;width:100%!important;min-width:0;}
  #dynamicTopbar .cat-user-card {max-width:100%;min-width:0!important;padding:7px!important;flex:1 1 140px;}
  #dynamicTopbar .user-summary {display:block!important;min-width:0;text-align:left;}
  #dynamicTopbar #currentUserName {font-size:11px!important;white-space:normal!important;overflow-wrap:anywhere;}
  #dynamicTopbar #currentUserRole {font-size:9px!important;}
  #dynamicTopbar .cat-user-avatar {width:30px!important;height:30px!important;flex:none;}
  #dynamicTopbar .session-status-button {min-width:0!important;padding:7px!important;font-size:10px!important;}
  #dynamicTopbar .cat-logout-button {padding:8px!important;min-height:40px;}
  #dynamicTopbar .cat-digital-clock {flex:0 0 auto;}
  #dynamicTopbar .cat-live-ticker {padding:0 8px;min-width:0;}
  #sidebar #mobileMenuClose {display:block;width:calc(100% - 24px);margin:0 12px 12px;padding:12px;border:1px solid #d5b45d;border-radius:8px;background:#151515;color:#ffe29a;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;}
  #sidebar {top:0!important;bottom:0!important;max-height:100dvh!important;width:min(300px,85vw)!important;padding-top:12px!important;overflow-y:auto!important;z-index:130!important;}
  #appShell .form-grid, #appShell .filter-grid, #appShell .cat-form-grid,
  #appShell .dashboard-grid, #appShell .two-column-grid, #appShell .metric-grid,
  #appShell #cat-call-agent-layout {grid-template-columns:minmax(0,1fr)!important;min-width:0!important;gap:12px!important;}
  #appShell #cat-qa-form .cat-wide, #appShell #cat-qa-form .cat-layout-full-row {grid-column:1/-1!important;}
  #appShell #cat-qa-form .cat-form-card {padding:14px!important;min-width:0;max-width:100%;box-sizing:border-box;}
  #appShell #cat-qa-form :is(input:not([type=radio]):not([type=checkbox]),select,textarea) {font-size:16px!important;max-width:100%;box-sizing:border-box;}
  #appShell #cat-qa-form :is(.cat-field,.cat-form-field) {min-width:0!important;}
  #appShell .lqa-grid, #appShell .lqa-preview {grid-template-columns:minmax(0,1fr)!important;}
  #appShell .lqa-tools {align-items:stretch;}
  #appShell .lqa-tools select, #appShell .lqa-upload input {max-width:100%!important;}
  #appShell .section-heading, #appShell .panel-header {flex-wrap:wrap;gap:10px;}
  #appShell .panel, #appShell .app-view {min-width:0!important;max-width:100%;box-sizing:border-box;}
  #appShell :is(.table-wrapper,.cat-table-wrap,.vi-table-wrap,.dr-table-wrap) {max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;}
  /* Each wide table scrolls independently; the page itself stays phone-width. */
  #appShell table, .modal-dialog table, .v49-modal-card table {display:block!important;max-width:100%!important;min-width:0!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;}
  #appShell table :is(th,td) {font-size:12px!important;line-height:1.5!important;}
  #appShell .cat-rating-table :is(th,td) {min-width:90px;}
  #appShell .cat-rating-table :is(th,td):nth-child(2) {min-width:180px;}
  #appShell .cat-rating-table :is(select,textarea) {min-width:120px;}
  .modal-dialog, .v49-modal-card {width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important;max-height:90dvh!important;}
  body .cat-global-credit-bar {position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;width:100%!important;}
  body .cat-global-credit-inner {justify-content:center;text-align:center;padding:10px!important;font-size:9px!important;}
  body .content-area {padding-bottom:16px!important;}
  .login-screen {padding:16px!important;box-sizing:border-box;}
  .login-card {width:100%!important;max-width:420px!important;box-sizing:border-box;}
  .login-card input {font-size:16px!important;}
  .cat-welcome-flash {top:20px!important;max-height:80dvh;overflow:auto;}
}
@media screen and (min-width:768px) and (max-width:1024px) {
  #appShell #cat-call-agent-layout, #appShell .form-grid {grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #appShell #contentArea {padding:16px!important;}
}
@media (prefers-reduced-motion:reduce) {
  #menuToggle {animation:none!important;}
}