/* NEXAR UX5 Stage 16 — phone/tablet compatibility pass.
 * Covers 320–1023 px using the existing live app DOM. Visual device QA remains pending. */
@media(max-width:1023px){
 .nx4-workspace,.nx4-hub,.nx5-company-hub{max-width:100vw;min-width:0;overflow-x:clip}
 .nx4-workspace .workspace-body,.nx4-workspace .workspace-body main,
 .nx4-hub .hub-content,.nx5-company-hub .hub-content{min-width:0;max-width:100%;box-sizing:border-box}
 .nx4-workspace :is(.panel,.metric,.record-card,.nx5-module-insights,.hr-profile,.hr-record-card),.nx4-hub :is(.app-card,.hub-hero,.nx5-launcher-panel){min-width:0;max-width:100%;box-sizing:border-box}
 .nx4-workspace :is(.table-scroll,.nx4-hr-exchange-table-wrap,.nx4-platform-role-table-wrap,.nx4-demo-table-wrap){
  max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch
 }
 .nx4-workspace :is(.workspace-title h1,.panel-heading h3,.hr-profile-heading h2,.record-card-headline strong,.recent-copy strong,.nx5-module-insights h2){
  overflow-wrap:anywhere;word-break:normal
 }
 .nx4-workspace :is(.records-toolbar,.records-toolbar-main,.records-toolbar-actions,.hr-list-heading,.dialog-actions){min-width:0}
 .nx4-workspace :is(.hr-profile-tabs,.nx4-settings-tabs,.nx4-platform-tabs){max-width:100%;overflow-x:auto;scrollbar-width:thin;overscroll-behavior-x:contain}
 .nx4-workspace :is(.hr-profile-tabs,.nx4-settings-tabs,.nx4-platform-tabs)>button{flex-shrink:0}
 .nx4-workspace :is(.hr-info-grid,.hr-record-card-main,.form-grid,.nx5-insight-figures)>*{min-width:0}
 .nx4-workspace .dialog-backdrop .dialog{max-width:calc(100vw - 20px)}
 .nx4-workspace .dialog-backdrop :is(.form-grid,.nx4-hr-op-grid){min-width:0}
 .nx4-hub .app-card:focus-visible{outline:3px solid var(--app-accent,#387FC9);outline-offset:3px}
}
@media(max-width:767px){
 .nx4-workspace .workspace-body main{padding-inline:clamp(11px,3vw,19px)}
 .nx4-workspace .workspace-title{gap:12px;flex-wrap:wrap;align-items:flex-start}
 .nx4-workspace .workspace-title .workspace-title-details{min-width:0;flex:1 1 230px}
 .nx4-workspace .workspace-actions{width:100%;min-width:0;display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-wrap:wrap}
 .nx4-workspace .workspace-actions>.workspace-live{margin-inline-end:auto}
 .nx4-workspace .records-toolbar{flex-wrap:wrap;gap:9px}
 .nx4-workspace .records-toolbar .records-toolbar-main{flex:1 1 100%}
 .nx4-workspace .records-toolbar .records-toolbar-actions{justify-content:flex-start;flex:1 1 100%}
 .nx4-workspace .records-toolbar .record-select-label{min-width:0;flex:1 1 120px}
 .nx4-workspace .records-toolbar .records-search{min-width:0;flex:1 1 100%}
 .nx4-workspace .records-toolbar :is(select,input){max-width:100%}
 .nx4-workspace .record-card-actions{display:flex;flex-wrap:wrap;gap:6px;max-width:100%}
 .nx4-workspace .hr-profile-hero .hr-profile-identity{min-width:0}
 .nx4-workspace .hr-profile-hero .hr-profile-heading{min-width:0}
 .nx4-workspace .nx4-hr-exchange-grid{grid-template-columns:1fr}
 .nx4-workspace .nx4-hr-op-toolbar{gap:9px}
 .nx4-workspace .nx5-module-insights{padding:14px}
 .nx4-workspace .nx5-insight-figures{grid-template-columns:repeat(2,minmax(0,1fr))}
 .nx4-hub .grid-apps{min-width:0}
}
@media(max-width:620px){
 .nx4-workspace .workspace-body{padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))}
 .nx4-workspace .topbar{gap:8px;min-width:0}
 .nx4-workspace .topbar .left{min-width:0}
 .nx4-workspace .topbar .company-pill{max-width:min(42vw,220px);min-height:42px}
 .nx4-workspace .topbar .company-pill span{display:inline-block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .nx4-workspace .topbar .icon-btn{min-width:40px;min-height:40px}
 .nx4-workspace .nx5-breadcrumb{font-size:11px}
 .nx4-workspace .nx5-breadcrumb span{max-width:100%;overflow-wrap:anywhere}
 .nx4-workspace .record-card{padding:clamp(11px,3vw,15px)}
 .nx4-workspace .record-card-header{min-width:0}
 .nx4-workspace .record-card-headline{min-width:0;flex:1}
 .nx4-workspace .record-card-status{font-size:11px;white-space:normal;text-align:center}
 .nx4-workspace .nx5-insight-head-icon{display:none}
 .nx4-workspace .nx5-insight-figure>strong{font-variant-numeric:tabular-nums}
 .nx4-workspace :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea).input{font-size:16px}
 .nx4-workspace .dialog-backdrop>.dialog{width:100%;max-width:100vw;border-radius:18px 18px 0 0;max-height:95dvh;overflow-y:auto;overscroll-behavior:contain}
 .nx4-workspace .dialog-backdrop .dialog-actions{padding-bottom:max(14px,env(safe-area-inset-bottom,0px))}
 .nx4-workspace .dialog-actions>.button{min-height:46px}
 .nx4-workspace .nx5-hr-timeline{padding:13px}
 .nx4-hub .hub-content{padding-inline:clamp(12px,3vw,18px)}
 .nx4-hub .app-card{touch-action:manipulation}
 .nx4-hub .nx5-launcher-panel button{touch-action:manipulation}
}
@media(max-width:359px){
 .nx4-workspace .workspace-body main{padding-inline:10px}
 .nx4-workspace .workspace-title-icon{display:none}
 .nx4-workspace .workspace-title h1{font-size:21px;line-height:1.4}
 .nx4-workspace .topbar .company-pill{max-width:115px}
 .nx4-workspace .topbar-title small{display:none}
 .nx4-workspace .nx5-insight-figures{grid-template-columns:1fr 1fr;gap:7px}
 .nx4-workspace .nx5-insight-figure{padding:10px}
 .nx4-workspace .nx5-insight-figure>strong{font-size:18px}
 .nx4-workspace .nx5-insight-head h2{font-size:16px}
 .nx4-workspace .record-card-fields{grid-template-columns:1fr}
 .nx4-workspace .hr-profile-hero .hr-profile-avatar{width:43px;height:43px}
 .nx4-workspace .dialog-actions>.button{font-size:12px;padding-inline:9px}
 .nx4-hub .app-card{min-height:145px}
}
@media(min-width:768px) and (max-width:1023px){
 .nx4-workspace .panels{grid-template-columns:repeat(2,minmax(0,1fr))}
 .nx4-workspace .nx5-insight-figures{grid-template-columns:repeat(2,minmax(0,1fr))}
 .nx4-workspace .workspace-body main{padding-inline:19px}
}
@media(orientation:landscape) and (max-height:450px) and (max-width:1000px){
 .nx4-workspace .dialog-backdrop>.dialog{max-height:97dvh}
 .nx5-mobile-nav{min-height:56px;padding-block:4px max(4px,env(safe-area-inset-bottom,0px))}
 .nx5-mobile-nav-item{min-height:42px}
 .nx5-mobile-nav-icon{height:20px}
}
@media(prefers-reduced-motion:reduce){
 .nx4-workspace .record-card,.nx4-hub .app-card{animation:none!important;transition:none!important}
}
