/* MXERP Minimal UI v4
   Final presentation layer. It intentionally contains no product-specific color
   palette: every workspace resolves through design-tokens.css. */

/* ---------- Global rhythm and interaction ---------- */
html{color-scheme:light;background:var(--color-canvas)}
body{background:var(--color-canvas);color:var(--color-text)}
:where(h1,h2,h3,h4){color:var(--color-text);text-wrap:balance}
:where(h1,h2){letter-spacing:-.015em}
:where(p,small){text-wrap:pretty}
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:none;
  box-shadow:var(--focus-ring);
}
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){
  border-color:var(--input-border);
  border-radius:var(--control-radius);
  background:var(--input-bg);
  color:var(--color-text);
  font-family:inherit;
  transition:var(--transition-interactive);
}
:where(input,textarea)::placeholder{color:var(--color-text-tertiary)}
:where(input,select,textarea):disabled{
  cursor:not-allowed;
  border-color:var(--color-border);
  background:var(--color-surface-muted);
  color:var(--color-text-tertiary);
  opacity:1;
}
:where(button,[role="button"]):disabled{cursor:not-allowed}

*{scrollbar-color:var(--primitive-slate-300) transparent;scrollbar-width:thin}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{border:3px solid transparent;border-radius:var(--primitive-radius-full);background:var(--primitive-slate-300);background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:var(--primitive-slate-400);background-clip:padding-box}

/* ---------- Application shell ---------- */
.content{padding:var(--layout-content-padding)}
.topbar{height:var(--layout-topbar-height);box-shadow:none}
.rail{width:var(--layout-sidebar-width)}
.rail-section{border-radius:var(--card-radius);background:hsl(0 0% 100% / .02)}
.rail-item,.rail-subitem{border-radius:var(--control-radius)}
.rail-ico,.rail-sub-ico,.rail-section-ico{border-radius:var(--control-radius)}
.user-pill{border-radius:var(--control-radius)}

.tabbar{gap:8px;padding-block:0}
.tab{width:128px;min-width:128px;max-width:128px;height:34px;border-radius:10px 10px 0 0;flex:0 0 128px;transition:var(--transition-interactive),transform var(--primitive-duration-fast) ease}
.tab-home{width:128px;min-width:128px;max-width:128px;flex-basis:128px}
.tab.active{border:0;border-radius:10px 10px 0 0;box-shadow:none}
.tab-action{border-radius:var(--primitive-radius-full)}
.tab-add{border-radius:var(--control-radius)}

:where(.tab-menu,.rail-flyout,.notif-pop,.gsearch-pop,.pd-tip,.cmt-pop){
  border:1px solid var(--color-border);
  border-radius:var(--card-radius);
  background:var(--color-surface);
  box-shadow:var(--shadow-overlay);
}
.rail-flyout{padding:var(--primitive-space-2)}
.rail-flyout-head-ico,.rail-flyout-ico,.rail-flyout-go{border-radius:var(--control-radius)}
.rail-flyout-i{border-radius:var(--control-radius)}
.rail-flyout-i:hover{border-color:var(--color-border);background:var(--color-surface-subtle)}
.rail-flyout-i.active,.rail-flyout-i.active:hover{
  border-color:var(--color-primary-border);
  background:var(--color-primary-subtle);
  color:var(--color-primary-hover);
  box-shadow:none;
}
.rail-flyout-i.active .rail-flyout-ico,.rail-flyout-i.active:hover .rail-flyout-ico,
.rail-flyout-i.active .rail-flyout-go,.rail-flyout-i.active:hover .rail-flyout-go{
  border-color:var(--color-primary-border);
  background:var(--color-surface);
  color:var(--color-primary);
}
.rail-flyout-i.active .rail-flyout-desc{color:var(--color-text-secondary)}
.rail-flyout-i.active .nav-cnt,.rail-flyout-i.active:hover .nav-cnt{
  border-color:var(--color-primary-border);
  background:var(--color-surface);
  color:var(--color-primary);
}

/* ---------- Shared components ---------- */
:where(.card,.mcp-card,.img-card,.pc-right){
  border-color:var(--card-border);
  border-radius:var(--card-radius);
  background:var(--card-bg);
  box-shadow:var(--card-shadow);
}
.ct-out{border-color:var(--color-border);border-radius:var(--control-radius);background:var(--color-surface-subtle)}
.btn{border-radius:var(--control-radius);box-shadow:none}
.btn:hover{box-shadow:var(--shadow-minimal)}
.btn.ghost,.btn.gray{background:var(--color-surface)}
.badge,.tag-chip,.pg{border-radius:var(--badge-radius)}
.alert{border-radius:var(--control-radius)}
.modal{border-radius:var(--dialog-radius);box-shadow:var(--dialog-shadow)}
.modal-bg{background:hsl(222 47% 11% / .42)}

:where(.pager,.ops-server-pager,.research-pagination){color:var(--color-text-secondary)}
:where(.pager button,.pager a,.research-pagination button,.research-pagination a){
  border-color:var(--control-border);
  border-radius:var(--control-radius);
  background:var(--color-surface);
}

table{font-variant-numeric:tabular-nums}
th{background:var(--table-header-bg);color:var(--color-text-secondary)}
tbody tr{transition:background-color var(--primitive-duration-fast) ease}
:where(tbody tr:hover,.research-table tbody tr:hover,.ops-table tbody tr:hover,.ads-table-wrap tbody tr:hover,.kr-table tbody tr:hover){
  background:var(--table-row-hover);
}
:where(.research-table-wrap,.ops-table-wrap,.ops-fixed-table,.ops-generic-table,.home-table-wrap,.ads-table-wrap,.kr-table-card){
  background:var(--color-surface);
  scrollbar-gutter:stable;
}

/* ---------- Shared workspace surfaces ---------- */
:where(
  .research-sidebar,.research-query-card,.research-result,
  .ops-overview-head,.ops-panel,.ops-metric,.ops-monitor-card,
  .home-loading,.home-panel,.home-metric,.home-flow-stage,
  .kr-filter-panel,.kr-listbar,.kr-table-card,.kr-state-tab,
  .ads-task-nav,.ads-page-head,.ads-panel,.ads-metric,.ads-manual-nav,
  .ads-manual-content,.ads-stage,.ads-connection-card
){
  border-color:var(--card-border);
  border-radius:var(--card-radius);
  background:var(--card-bg);
  box-shadow:var(--card-shadow);
}

/* Empty, loading and error states use one quiet visual language. */
:where(.research-state,.ops-state,.ads-state,.home-empty,.kr-empty){
  border-color:var(--color-border-strong);
  border-radius:var(--card-radius);
  background:var(--color-surface-subtle);
}
:where(.research-state-icon,.ops-state-icon,.ads-state-icon,.home-loading-ico){
  border-radius:var(--control-radius);
  background:var(--color-primary-subtle);
  color:var(--color-primary);
}

/* ---------- Market research ---------- */
.research-workspace{gap:var(--primitive-space-3)}
.research-sidebar{box-shadow:none}
.research-group-tabs{border-color:var(--color-border);border-radius:var(--control-radius);background:var(--color-surface-muted)}
.research-group-tab{border-radius:var(--primitive-radius-4)}
.research-group-tab:hover,.research-group-tab.active,.research-group-tab[aria-selected="true"]{background:var(--color-surface);box-shadow:none}
.research-tool{border-radius:var(--control-radius)}
.research-tool:hover{background:var(--color-surface-subtle)}
.research-tool.active,.research-tool[aria-current="true"]{border-color:var(--color-primary-border);background:var(--color-primary-subtle);box-shadow:inset 2px 0 0 var(--color-primary)}
.research-recent,.research-stats,.research-pagination,.research-wrapper-meta,.research-raw{background:var(--color-surface-subtle)}
.research-history-item:hover{background:var(--color-surface);box-shadow:none}
.research-source,.research-meta-chip{border-radius:var(--badge-radius)}
.research-query-card,.research-result{box-shadow:none}
.research-result-toolbar,.research-table-wrap,.research-sif-result>.mcp-card{background:var(--color-surface)}
.research-table tbody tr:nth-child(even){background:var(--color-surface-subtle)}
.research-table thead th{background:var(--table-header-bg);color:var(--color-text-secondary)}
.research-pagination button:hover,.research-pagination a:hover,.research-pagination .active{border-color:var(--color-primary-border);background:var(--color-primary-subtle)}

/* ---------- Operations cockpit ---------- */
.ops-tabs{border-color:var(--color-border);border-radius:var(--card-radius);background:var(--color-surface-muted)}
.ops-tab{border-radius:var(--control-radius)}
.ops-tab:hover{background:var(--color-surface-subtle)}
.ops-tab.active,.ops-tab[aria-selected="true"]{border-color:var(--color-border);background:var(--color-surface);box-shadow:none}
.ops-tab-icon,.ops-monitor-card>span{border-radius:var(--control-radius)}
.ops-metric::before{display:none}
.ops-toolbar{background:var(--color-surface-subtle)}
.ops-chip,.ops-badge{border-radius:var(--badge-radius)}
.ops-chip.active,.ops-chip[aria-pressed="true"]{border-color:var(--color-primary-border);background:var(--color-primary-subtle)}
.ops-monitor-card:hover,.ops-monitor-card.active{border-color:var(--color-primary-border);background:var(--color-primary-subtle);box-shadow:none}
.ops-table tbody tr:nth-child(even),.ops-fixed-table tbody tr:nth-child(even){background:var(--color-surface-subtle)}

/* ---------- Home workbench ---------- */
.home-workbench{gap:var(--primitive-space-3)}
.home-hero{
  border-color:var(--card-border);
  border-radius:var(--card-radius);
  background:var(--card-bg);
  box-shadow:var(--card-shadow);
}
.home-scope,.home-rate{border-radius:var(--badge-radius)}
.home-priority{border-radius:var(--card-radius);background:var(--home-tone-bg)}
.home-priority-ico,.home-metric-ico,.home-flow-ico{border-radius:var(--control-radius)}
.home-today-grid>div{border:1px solid var(--color-border);border-radius:var(--control-radius);background:var(--color-surface-subtle)}
.home-panel,.home-metric,.home-flow-stage{box-shadow:none}
button.home-metric:hover,.home-flow-stage:hover{border-color:var(--color-primary-border);box-shadow:var(--shadow-minimal);transform:none}
.home-segment{border-radius:var(--control-radius);background:var(--color-surface-muted)}
.home-segment-btn{border-radius:var(--primitive-radius-4)}
.home-segment-btn.active{box-shadow:none}
.home-person:hover{background:var(--color-surface-subtle)}
.home-person.active{background:var(--color-primary-subtle);box-shadow:inset 2px 0 0 var(--color-primary)}
.home-store-track i{background:var(--color-primary)}
.home-table-wrap{border-color:var(--color-border);border-radius:var(--control-radius)}

/* ---------- Automatic recommendations ---------- */
.kr-overview{
  border-color:var(--card-border);
  border-radius:var(--card-radius);
  background:var(--card-bg);
  box-shadow:var(--card-shadow);
}
.kr-overview::after{display:none}
.kr-overview-icon,.kr-state-icon{border-radius:var(--control-radius);box-shadow:none}
.kr-state-tab{box-shadow:none}
.kr-state-tab:hover{border-color:var(--color-primary-border);box-shadow:none}
.kr-state-tab.active{box-shadow:none}
.kr-state-count,.kr-signal,.kr-fulfill{border-radius:var(--badge-radius)}
.kr-filter-head{background:var(--color-surface-subtle)}
.kr-workspace .fchip,.kr-category-filter select,.kr-reset,.kr-filter-toggle,.kr-clear-selection{border-radius:var(--control-radius)}
.kr-table tbody tr:nth-child(even)>td,.kr-table tbody tr:nth-child(even)>td.opcol{background:var(--color-surface-subtle)}
.kr-action-cell{background:var(--color-surface)}

/* ---------- Advertising assistant ---------- */
.ads-hero{
  border-color:var(--card-border);
  border-radius:var(--card-radius);
  background:var(--card-bg);
  box-shadow:var(--card-shadow);
}
.ads-hero::after{display:none}
.ads-hero-icon,.ads-page-icon,.ads-nav-icon{border-radius:var(--control-radius);box-shadow:none}
.ads-status-pill,.ads-source-chip,.ads-score{border-radius:var(--badge-radius)}
.ads-nav-item,.ads-manual-nav button,.ads-manual-nav .am-nav{border-radius:var(--control-radius)}
.ads-nav-item:hover{border-color:var(--color-border);background:var(--color-surface-subtle)}
.ads-nav-item.active,.ads-manual-nav button.active,.ads-manual-nav .am-nav.active{
  border-color:var(--color-primary-border);
  background:var(--color-primary-subtle);
  color:var(--color-primary-hover);
  box-shadow:inset 2px 0 0 var(--color-primary);
}
.ads-panel,.ads-page-head,.ads-task-nav,.ads-manual-nav,.ads-manual-content,.ads-stage,.ads-connection-card{box-shadow:none}
.ads-metric::before{display:none}
.ads-table-wrap tbody tr:nth-child(even){background:var(--color-surface-subtle)}
.ads-summary{border-color:var(--color-primary-border);border-radius:var(--card-radius);background:var(--color-primary-subtle);color:var(--color-text-secondary)}
.ads-summary h3,.ads-summary h4{color:var(--color-text)}
.ads-step-list>li{border-radius:var(--control-radius);background:var(--color-surface-subtle)}
.ads-connection-card.is-connected{background:var(--color-success-subtle)}
.ads-connection-card.is-disconnected{background:var(--color-warning-subtle)}

/* ---------- Route-wide legacy page unification ----------
   Every non-workbench route receives this shell from app.js. The selectors are
   intentionally structural so newly added settings/HR/tool pages inherit the
   same visual language without another one-off redesign. */
.page-content{min-width:0}
.legacy-page{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-content:start;
  gap:var(--page-gap);
}
.legacy-page>*{min-width:0}
.unified-page-head{
  display:grid;
  grid-template-columns:var(--page-icon-size) minmax(0,1fr);
  align-items:center;
  gap:var(--primitive-space-3);
  min-height:72px;
  padding:var(--page-header-padding);
  border:1px solid var(--page-header-border);
  border-radius:var(--page-header-radius);
  background:var(--page-header-bg);
  box-shadow:var(--card-shadow);
}
.unified-page-icon{
  display:grid;
  place-items:center;
  width:var(--page-icon-size);
  height:var(--page-icon-size);
  border:1px solid var(--color-primary-border);
  border-radius:var(--control-radius);
  background:var(--color-primary-subtle);
  color:var(--color-primary);
}
.unified-page-copy{min-width:0}
.unified-page-copy h1{
  margin:0;
  color:var(--color-text);
  font-size:var(--primitive-font-18);
  font-weight:700;
  line-height:1.35;
}
.unified-page-copy p{
  margin:3px 0 0;
  color:var(--color-text-secondary);
  font-size:var(--primitive-font-12);
  line-height:1.45;
}

/* Top-level surfaces: page actions, data containers, summaries and states. */
.legacy-page>.flexbar,
.legacy-page>.page-toolbar{
  min-height:56px;
  margin:0!important;
  padding:var(--toolbar-padding-y) var(--toolbar-padding-x);
  border:1px solid var(--toolbar-border);
  border-radius:var(--toolbar-radius);
  background:var(--toolbar-bg);
  box-shadow:var(--card-shadow);
}
.legacy-page>.flexbar:empty{display:none}
.legacy-page>.flexbar>div{min-width:0}
.legacy-page>.flexbar>div:last-child{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:var(--primitive-space-2);
  flex-wrap:wrap;
}
.page-toolbar-stats{display:flex;align-items:center;gap:var(--primitive-space-2);flex-wrap:wrap}
.page-metrics{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:var(--primitive-space-2)!important;
  margin:0!important;
}
.page-metrics>.card{min-width:0!important;margin:0!important;box-shadow:none}
.legacy-page>.card,
.legacy-page>.two-col,
.legacy-page>.grid2,
.legacy-page>.grid3,
.legacy-page>.pay-scroll,
.legacy-page>.alert{
  margin-block:0!important;
}
.legacy-page>.kpis{
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr))!important;
  gap:var(--primitive-space-2);
  margin:0!important;
}
.legacy-page>.kpis .kpi{min-width:0;border-color:var(--section-border);box-shadow:none}
.page-inline-toolbar{
  display:flex;
  align-items:center;
  gap:var(--primitive-space-2);
  min-width:0;
  margin:0!important;
  padding:var(--toolbar-padding-y) var(--toolbar-padding-x);
  overflow-x:auto;
  border:1px solid var(--toolbar-border);
  border-radius:var(--toolbar-radius);
  background:var(--toolbar-bg);
}
.page-inline-toolbar>*{flex:0 0 auto}
.legacy-page>.card,
.legacy-page>.pay-scroll,
.legacy-page>.page-summary-card{
  border-color:var(--section-border);
  border-radius:var(--section-radius);
  background:var(--section-bg);
  box-shadow:var(--card-shadow);
}
.legacy-page>.card:has(>table),
.legacy-page>.page-table-card,
.legacy-page>.pay-scroll{
  overflow:auto;
  border:1px solid var(--table-shell-border);
  border-radius:var(--table-shell-radius);
  background:var(--table-shell-bg);
  scrollbar-gutter:stable;
}
.legacy-page>.card:has(>table){padding:0!important}
.legacy-page>.card>table:last-child tr:last-child>td,
.legacy-page>.page-table-card table tr:last-child>td,
.legacy-page>.pay-scroll table tr:last-child>td{border-bottom:0}
.legacy-page table thead th{
  position:sticky;
  top:0;
  z-index:3;
  background:var(--table-header-bg);
  box-shadow:0 1px 0 var(--color-border);
}
.legacy-page table tbody tr:nth-child(even)>td{background:var(--color-surface-subtle)}
.legacy-page table tbody tr:hover>td{background:var(--table-row-hover)}
.legacy-page table tbody tr{cursor:default}
.legacy-page :where(.opcol,.right){font-variant-numeric:tabular-nums}
.legacy-page :where(.hint,small.hint){color:var(--color-text-tertiary)}

/* Filters and sub-navigation use one segmented, horizontally scrollable row. */
.page-filter-strip,
.module-tabs{
  display:flex;
  align-items:center;
  gap:var(--primitive-space-2);
  min-width:0;
  margin:0;
  padding:var(--primitive-space-2);
  overflow-x:auto;
  border:1px solid var(--tabs-border);
  border-radius:var(--toolbar-radius);
  background:var(--tabs-bg);
  scrollbar-width:thin;
}
.page-filter-strip>*{flex:0 0 auto}
.page-status-tabs{padding-block:6px}
.page-filter-strip .fchip,
.page-filter-strip .btn{
  min-height:30px;
  border-radius:var(--control-radius);
  box-shadow:none;
}
.page-filter-strip .fchip.on,
.page-filter-strip .fchip[aria-pressed="true"]{
  border-color:var(--tabs-active-border);
  background:var(--tabs-active-bg);
  color:var(--color-primary-hover);
  box-shadow:var(--shadow-minimal);
}
.module-tab{
  appearance:none;
  display:inline-flex;
  flex:0 0 auto;
  min-height:32px;
  padding:0 var(--primitive-space-3);
  border:1px solid transparent;
  border-radius:var(--control-radius);
  background:transparent;
  color:var(--color-text-secondary);
  font:inherit;
  font-size:var(--primitive-font-12);
  font-weight:600;
  text-decoration:none;
  align-items:center;
  justify-content:center;
  transition:var(--transition-interactive);
}
.module-tab:hover{background:var(--color-surface-subtle);color:var(--color-text)}
.module-tab.active,
.module-tab[aria-current="page"]{
  border-color:var(--tabs-active-border);
  background:var(--tabs-active-bg);
  color:var(--color-primary-hover);
  box-shadow:var(--shadow-minimal);
}

/* Controls and pagination on old pages no longer keep their one-off geometry. */
.legacy-page :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select){
  min-height:var(--control-height);
  border-color:var(--input-border)!important;
  border-radius:var(--control-radius)!important;
  background:var(--input-bg)!important;
}
.legacy-page :where(textarea){border-color:var(--input-border)!important;border-radius:var(--control-radius)!important}
.pager{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:var(--primitive-space-2);
  min-width:0;
  margin:0;
  padding:var(--primitive-space-2) var(--primitive-space-3);
  overflow-x:auto;
  border:1px solid var(--toolbar-border);
  border-radius:var(--toolbar-radius);
  background:var(--toolbar-bg);
}
.pager .btn{flex:0 0 auto;min-width:30px;padding-inline:8px}
.pager-size{flex:0 0 auto;height:30px;padding:0 var(--primitive-space-2);cursor:pointer}
.pager-jump{flex:0 0 52px;width:52px;height:30px;padding:0 6px;text-align:center}

/* Detail, sourcing, copy and image workspaces. */
.legacy-page>a.muted:first-of-type{
  justify-self:start;
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 var(--primitive-space-2);
  border:1px solid var(--color-border);
  border-radius:var(--control-radius);
  background:var(--color-surface);
  color:var(--color-text-secondary);
}
.page-sourcing>.card,
.page-copy>.card,
.page-image>.card{padding:var(--section-padding)}
.page-sourcing>.card:has(table),.page-copy>.card:has(table){overflow:auto}
.page-sourcing>.alert{padding:var(--primitive-space-3) var(--primitive-space-4)}
.page-image .img-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--primitive-space-3)}
.page-image .img-card{width:auto;min-width:0;margin:0;box-shadow:none}
.page-image .img-card img{width:100%;aspect-ratio:1;height:auto}
.page-copy .two-col,.page-sourcing .two-col{gap:var(--page-gap)}

/* Product detail is modal-first; keep its dense content calm and scannable. */
.modal:has(.pd-top){padding:var(--primitive-space-4);background:var(--color-canvas)}
.modal:has(.pd-top)>.flexbar:first-of-type{
  position:sticky;
  top:calc(var(--primitive-space-4) * -1);
  z-index:12;
  margin:calc(var(--primitive-space-4) * -1) calc(var(--primitive-space-4) * -1) var(--primitive-space-3);
  padding:var(--primitive-space-3) var(--primitive-space-4);
  border-bottom:1px solid var(--color-border);
  background:var(--color-surface);
}
.modal:has(.pd-top) .pd-top{gap:var(--page-gap);margin-bottom:var(--page-gap)}
.modal:has(.pd-top) .card{border-color:var(--section-border);border-radius:var(--section-radius);box-shadow:none}
.modal:has(.pd-top) .pd-reg,.modal:has(.pd-top) .pd-calc{padding:var(--section-padding)}
.modal:has(.pd-top) .pd-sec h4{color:var(--color-text-secondary)}
.modal:has(.pd-top) .pd-key{border:1px solid var(--color-success-border);background:var(--color-success-subtle)}

/* HR, organisation, settings and inbox families. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.page-hr :where(.hr-kpi,.hr-panel-link,.hr-profile-back,.hr-name-link):focus-visible{outline:none;box-shadow:var(--focus-ring)}
.hr-dash{display:grid;gap:var(--page-gap)}
.hr-dash-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--primitive-space-4);padding:var(--primitive-space-5);border:1px solid var(--color-border);border-radius:var(--section-radius);background:var(--color-surface)}
.hr-dash-heading h2,.hr-profile-head h2,.pay-flow-head h2{margin:2px 0 4px;font-size:var(--primitive-font-20);line-height:1.25}
.hr-dash-heading p,.hr-profile-head p,.pay-flow-head p{margin:0;color:var(--color-text-secondary);font-size:var(--primitive-font-12)}
.hr-eyebrow,.hr-panel-kicker,.pay-flow-head>div>p{color:var(--color-primary)!important;font-size:var(--primitive-font-10)!important;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.hr-dash-actions,.hr-roster-actions,.pay-main-actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--primitive-space-2);flex-wrap:wrap}
.hr-kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--primitive-space-2)}
.hr-kpi{position:relative;display:grid;grid-template-columns:1fr auto;gap:2px var(--primitive-space-2);min-width:0;padding:var(--primitive-space-4);border:1px solid var(--color-border);border-top:2px solid var(--color-border-strong);border-radius:var(--section-radius);background:var(--color-surface);color:var(--color-text);text-decoration:none;transition:var(--transition-interactive)}
.hr-kpi:hover{border-color:var(--color-primary-border);box-shadow:var(--shadow-minimal)}
.hr-kpi-icon{display:grid;place-items:center;width:30px;height:30px;grid-column:2;grid-row:1 / span 2;border-radius:var(--primitive-radius-8);background:var(--color-surface-muted);color:var(--color-text-secondary)}
.hr-kpi-label{grid-column:1;color:var(--color-text-secondary);font-size:var(--primitive-font-11);font-weight:600}
.hr-kpi>b{grid-column:1;font-size:var(--primitive-font-24);line-height:1.2;font-variant-numeric:tabular-nums}
.hr-kpi>small{grid-column:1 / -1;margin-top:4px;color:var(--color-text-tertiary);font-size:var(--primitive-font-10)}
.hr-tone-primary{border-top-color:var(--color-primary)}.hr-tone-success{border-top-color:var(--color-success)}.hr-tone-warning{border-top-color:var(--color-warning)}.hr-tone-danger{border-top-color:var(--color-danger)}
.hr-tone-primary .hr-kpi-icon{background:var(--color-primary-subtle);color:var(--color-primary)}.hr-tone-success .hr-kpi-icon{background:var(--color-success-subtle);color:var(--color-success)}.hr-tone-warning .hr-kpi-icon{background:var(--color-warning-subtle);color:var(--color-warning)}.hr-tone-danger .hr-kpi-icon{background:var(--color-danger-subtle);color:var(--color-danger)}
.hr-dash-grid{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(420px,1.35fr);gap:var(--page-gap)}
.hr-panel{min-width:0;padding:var(--section-padding);border:1px solid var(--section-border);border-radius:var(--section-radius);background:var(--section-bg);box-shadow:none}
.hr-panel-head,.pay-subhead{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--primitive-space-3);margin-bottom:var(--primitive-space-3)}
.hr-panel-head h3,.pay-subhead h3,.pay-flow-actions h3{margin:2px 0 0;font-size:var(--primitive-font-14)}
.hr-panel-head>small{color:var(--color-text-secondary);font-size:var(--primitive-font-11)}
.hr-pay-numbers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--primitive-space-2);margin:var(--primitive-space-3) 0}
.hr-pay-numbers>div{padding:var(--primitive-space-3);border-radius:var(--primitive-radius-8);background:var(--color-surface-subtle)}
.hr-pay-numbers span,.hr-approval-grid span{display:block;color:var(--color-text-secondary);font-size:var(--primitive-font-11)}
.hr-pay-numbers b{display:block;margin-top:3px;font-size:var(--primitive-font-16);font-variant-numeric:tabular-nums}
.hr-health-row{display:flex;gap:var(--primitive-space-3);flex-wrap:wrap;padding:var(--primitive-space-2) 0;color:var(--color-text-secondary);font-size:var(--primitive-font-11)}
.hr-health-row .bad{color:var(--color-danger)}.hr-health-row .warn{color:var(--color-warning)}.hr-health-row .ok{color:var(--color-success)}
.hr-panel-link{display:flex;justify-content:space-between;margin-top:var(--primitive-space-2);padding-top:var(--primitive-space-3);border-top:1px solid var(--color-border);color:var(--color-primary);font-size:var(--primitive-font-12);font-weight:600;text-decoration:none}
.hr-queue{display:grid;gap:0;margin:0;padding:0;list-style:none}
.hr-queue-item{display:grid;grid-template-columns:8px minmax(0,1fr) auto auto;align-items:center;gap:var(--primitive-space-2);padding:var(--primitive-space-2) 0;border-top:1px solid var(--color-border)}
.hr-queue-item:first-child{border-top:0}.hr-queue-mark{width:7px;height:7px;border-radius:var(--primitive-radius-full);background:var(--color-primary)}
.hr-queue-error .hr-queue-mark,.hr-queue-danger .hr-queue-mark{background:var(--color-danger)}.hr-queue-warning .hr-queue-mark{background:var(--color-warning)}.hr-queue-success .hr-queue-mark{background:var(--color-success)}
.hr-queue-item b{font-size:var(--primitive-font-12)}.hr-queue-item p,.hr-empty p{margin:2px 0 0;color:var(--color-text-secondary);font-size:var(--primitive-font-11)}
.hr-queue-item>a{color:var(--color-primary);font-size:var(--primitive-font-11);font-weight:600;text-decoration:none}.hr-queue-count,.hr-queue-total{min-width:24px;padding:2px 6px;border-radius:var(--primitive-radius-full);background:var(--color-surface-muted);color:var(--color-text-secondary);font-size:var(--primitive-font-10);font-style:normal;text-align:center}
.hr-empty{display:flex;gap:var(--primitive-space-3);align-items:center;padding:var(--primitive-space-5);border:1px dashed var(--color-border-strong);border-radius:var(--primitive-radius-8);background:var(--color-surface-subtle)}.hr-empty>span{color:var(--color-success);font-size:var(--primitive-font-18)}
.hr-approval-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--primitive-space-2)}
.hr-approval-grid>a,.hr-approval-grid>div{padding:var(--primitive-space-3);border:1px solid var(--color-border);border-radius:var(--primitive-radius-8);color:var(--color-text);text-decoration:none}.hr-approval-grid>a:hover{border-color:var(--color-primary-border);background:var(--color-primary-subtle)}.hr-approval-grid>div[aria-disabled="true"]{background:var(--color-surface-subtle)}
.hr-approval-grid b{display:block;margin:3px 0;font-size:var(--primitive-font-20)}.hr-approval-grid small{color:var(--color-text-tertiary);font-size:var(--primitive-font-10)}
.hr-degraded{margin:0}

/* Employee roster and one-person file. */
.hr-roster-toolbar{gap:var(--primitive-space-3)}.hr-roster-filters{display:flex;align-items:center;gap:var(--primitive-space-2);flex-wrap:wrap}.hr-roster-filters input{width:min(360px,48vw);padding-inline:var(--primitive-space-3)}
.hr-roster-table .opcol{min-width:250px}.hr-name-link{display:flex;flex-direction:column;gap:1px;color:var(--color-text);text-decoration:none;white-space:nowrap}.hr-name-link small{color:var(--color-primary);font-size:var(--primitive-font-10);font-weight:500;opacity:0}.hr-name-link:hover small,.hr-name-link:focus-visible small{opacity:1}
.hr-account{display:inline-flex;align-items:center;gap:4px;color:var(--color-primary);font-size:var(--primitive-font-11)}.hr-row-date{display:block;margin-top:2px;color:var(--color-text-tertiary);font-size:var(--primitive-font-10)}
.hr-profile{display:grid;gap:var(--page-gap)}.hr-profile-head{display:grid;grid-template-columns:1fr auto;gap:var(--primitive-space-3);padding:var(--primitive-space-5);border:1px solid var(--color-border);border-radius:var(--section-radius);background:var(--color-surface)}
.hr-profile-back{grid-column:1 / -1;width:max-content;color:var(--color-text-secondary);font-size:var(--primitive-font-11);text-decoration:none}.hr-profile-identity{display:flex;align-items:center;gap:var(--primitive-space-3)}
.hr-avatar{display:grid;place-items:center;width:52px;height:52px;border-radius:var(--primitive-radius-12);background:var(--color-primary-subtle);color:var(--color-primary);font-size:var(--primitive-font-20);font-weight:700}.hr-profile-meta{display:flex;align-items:center;gap:var(--primitive-space-2);flex-wrap:wrap;color:var(--color-text-secondary);font-size:var(--primitive-font-11)}
.hr-profile-head-actions{align-self:center}.hr-profile-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--page-gap)}.hr-profile-pairs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--primitive-space-4)}
.hr-profile-pair{display:flex;justify-content:space-between;gap:var(--primitive-space-3);padding:9px 0;border-top:1px solid var(--color-border);font-size:var(--primitive-font-12)}.hr-profile-pair:nth-child(-n+2){border-top:0}.hr-profile-pair>span{color:var(--color-text-secondary)}.hr-profile-pair>b{text-align:right;font-weight:600;word-break:break-word}
.hr-profile-pii{background:var(--color-surface-subtle)}.hr-profile-pii h3{display:flex;align-items:center;gap:5px}.hr-pii-note,.hr-pii-denied,.hr-edit-pii-note{margin:0 0 var(--primitive-space-2);color:var(--color-text-secondary);font-size:var(--primitive-font-11);line-height:1.5}.hr-pii-denied{padding:var(--primitive-space-2);border-radius:var(--primitive-radius-6);background:var(--color-warning-subtle);color:var(--color-warning)}
.hr-profile-records{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--page-gap)}.hr-mini-table{overflow:auto}.hr-mini-table table{min-width:420px;font-size:var(--primitive-font-11)}.hr-section-empty{padding:var(--primitive-space-4);color:var(--color-text-tertiary);font-size:var(--primitive-font-11);text-align:center}
.hr-timeline{display:grid;gap:0;margin:0;padding:0;list-style:none}.hr-timeline li{position:relative;display:grid;grid-template-columns:14px 1fr;gap:var(--primitive-space-2);padding:0 0 var(--primitive-space-3)}.hr-timeline li:not(:last-child)::before{content:"";position:absolute;left:5px;top:10px;bottom:0;width:1px;background:var(--color-border)}.hr-timeline-dot{position:relative;z-index:1;width:9px;height:9px;margin-top:4px;border:2px solid var(--color-surface);border-radius:var(--primitive-radius-full);background:var(--color-primary);box-shadow:0 0 0 1px var(--color-primary-border)}.hr-timeline b{font-size:var(--primitive-font-12)}.hr-timeline p{margin:2px 0;color:var(--color-text-secondary);font-size:var(--primitive-font-11)}.hr-timeline small{color:var(--color-text-tertiary);font-size:var(--primitive-font-10)}
.hr-profile-loading{display:flex;align-items:center;justify-content:center;gap:var(--primitive-space-2);min-height:180px;color:var(--color-text-secondary)}
.hr-sensitive-create{margin:var(--primitive-space-3) 0;padding:var(--primitive-space-3);border:1px solid var(--color-warning-border);border-radius:var(--primitive-radius-8);background:var(--color-warning-subtle)}.hr-sensitive-create summary{display:flex;align-items:center;gap:6px;color:var(--color-warning);font-size:var(--primitive-font-12);font-weight:600;cursor:pointer}.hr-sensitive-create[open] summary{margin-bottom:var(--primitive-space-3)}
.hr-sensitive-dialog{display:grid;gap:var(--primitive-space-3)}.hr-sensitive-head{display:flex;justify-content:space-between;gap:var(--primitive-space-3);padding-bottom:var(--primitive-space-3);border-bottom:1px solid var(--color-border)}.hr-sensitive-head p{margin:0;color:var(--color-warning);font-size:var(--primitive-font-10);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.hr-sensitive-head h3{margin:3px 0 0}.hr-sensitive-loading{display:flex;align-items:center;justify-content:center;gap:var(--primitive-space-2);min-height:140px;color:var(--color-text-secondary)}
.hr-sensitive-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--primitive-space-2)}.hr-sensitive-values>div{padding:var(--primitive-space-3);border:1px solid var(--color-border);border-radius:var(--primitive-radius-8);background:var(--color-surface-subtle)}.hr-sensitive-values span,.hr-sensitive-form span{display:block;margin-bottom:4px;color:var(--color-text-secondary);font-size:var(--primitive-font-11)}.hr-sensitive-values b{font-size:var(--primitive-font-12);word-break:break-all}.hr-sensitive-form{display:grid;gap:var(--primitive-space-2)}.hr-sensitive-form label{display:block}.hr-sensitive-form input{width:100%;box-sizing:border-box;padding-inline:var(--primitive-space-3)}

/* Payroll close: visible preflight gate and staged approvals. */
.pay-flow-console{padding:var(--primitive-space-4);border:1px solid var(--color-border);border-radius:var(--section-radius);background:var(--color-surface)}.pay-flow-legacy{padding:var(--primitive-space-3);border-color:var(--color-warning-border);background:var(--color-warning-subtle)}.pay-flow-legacy>div{display:flex;align-items:center;gap:var(--primitive-space-2);color:var(--color-warning);font-size:var(--primitive-font-11)}.pay-flow-legacy span{color:var(--color-text-secondary)}
.pay-flow-head{display:flex;justify-content:space-between;gap:var(--primitive-space-3)}.pay-flow-state{display:flex;align-items:center;gap:var(--primitive-space-2)}.pay-flow-state small{color:var(--color-text-tertiary);font-size:var(--primitive-font-10)}
.pay-flow-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--primitive-space-2);margin:var(--primitive-space-4) 0;padding:0;list-style:none}.pay-flow-steps li{display:flex;align-items:center;gap:var(--primitive-space-2);min-width:0;padding:var(--primitive-space-2);border:1px solid var(--color-border);border-radius:var(--primitive-radius-8);color:var(--color-text-tertiary);background:var(--color-surface-subtle)}.pay-flow-steps li>span{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:var(--primitive-radius-full);background:var(--color-surface-muted);font-size:var(--primitive-font-10);font-weight:700}.pay-flow-steps li b{display:block;font-size:var(--primitive-font-11);white-space:nowrap}.pay-flow-steps li small{display:block;color:var(--color-text-tertiary);font-size:var(--primitive-font-10);white-space:nowrap}.pay-flow-steps li.done{border-color:var(--color-success-border);color:var(--color-success);background:var(--color-success-subtle)}.pay-flow-steps li.done>span{background:var(--color-success);color:var(--primitive-white)}.pay-flow-steps li.current{border-color:var(--color-primary-border);color:var(--color-primary);box-shadow:var(--focus-ring)}
.pay-flow-body{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:var(--primitive-space-3)}.pay-preflight,.pay-flow-actions{padding:var(--primitive-space-3);border:1px solid var(--color-border);border-radius:var(--primitive-radius-8);background:var(--color-surface-subtle)}.pay-subhead{margin-bottom:var(--primitive-space-2)}.pay-subhead p,.pay-flow-actions p{margin:2px 0;color:var(--color-text-secondary);font-size:var(--primitive-font-11);line-height:1.5}.pay-preflight ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--primitive-space-2);margin:0;padding:0;list-style:none}.pay-check{display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:var(--primitive-space-2);align-items:start;padding:var(--primitive-space-2);border-radius:var(--primitive-radius-6);background:var(--color-surface)}.pay-check>span{font-weight:800}.pay-check b{font-size:var(--primitive-font-11)}.pay-check p{margin:2px 0;color:var(--color-text-secondary);font-size:var(--primitive-font-10)}.pay-check small{display:block;margin-top:3px;color:var(--color-text-tertiary);font-size:var(--primitive-font-10);line-height:1.4}.pay-check em{font-size:var(--primitive-font-10);font-style:normal}.pay-check.ok>span{color:var(--color-success)}.pay-check.warn>span{color:var(--color-warning)}.pay-check.bad>span{color:var(--color-danger)}
.pay-check-title{display:flex;align-items:center;gap:var(--primitive-space-2);flex-wrap:wrap}.pay-check-level{padding:1px 6px;border-radius:var(--primitive-radius-full);font-size:var(--primitive-font-10);font-style:normal}.pay-check.bad .pay-check-level{color:var(--color-danger);background:var(--color-danger-subtle)}.pay-check.warn .pay-check-level{color:var(--color-warning);background:var(--color-warning-subtle)}.pay-check>strong{font-size:var(--primitive-font-11);white-space:nowrap}.pay-check-action{color:var(--color-text-secondary)!important}.pay-check-passed{margin-top:var(--primitive-space-2);padding:var(--primitive-space-2);border:1px solid var(--color-success-border);border-radius:var(--primitive-radius-6);background:var(--color-success-subtle)}.pay-check-passed summary{display:flex;align-items:center;gap:var(--primitive-space-2);color:var(--color-success);cursor:pointer}.pay-check-passed summary span{margin-left:auto;color:var(--color-text-secondary);font-size:var(--primitive-font-10)}.pay-check-passed>div{display:flex;gap:var(--primitive-space-2);flex-wrap:wrap;padding-top:var(--primitive-space-2)}.pay-check-passed>div>span{display:inline-flex;align-items:center;gap:4px;padding:3px 7px;border-radius:var(--primitive-radius-full);color:var(--color-success);background:var(--color-surface);font-size:var(--primitive-font-10)}.pay-preflight-all-passed{display:flex;align-items:center;gap:var(--primitive-space-3);padding:var(--primitive-space-3);border:1px solid var(--color-success-border);border-radius:var(--primitive-radius-8);color:var(--color-success);background:var(--color-success-subtle)}.pay-preflight-all-passed p,.pay-preflight-empty p{margin:2px 0 0}.pay-preflight-empty{padding:var(--primitive-space-3);border-radius:var(--primitive-radius-8);background:var(--color-surface)}
.pay-flow-actions{display:flex;flex-direction:column;align-items:stretch;gap:var(--primitive-space-2)}.pay-flow-actions h3{margin-bottom:2px}.pay-flow-actions small{color:var(--color-text-tertiary);font-size:var(--primitive-font-10)}.pay-flow-gate{margin-top:var(--primitive-space-3);padding:var(--primitive-space-2) var(--primitive-space-3);border:1px solid var(--color-warning-border);border-radius:var(--primitive-radius-6);background:var(--color-warning-subtle);color:var(--color-warning);font-size:var(--primitive-font-11)}.pay-main-actions{max-width:100%}.pay-archive-badge{display:inline-flex;align-items:center;gap:4px;align-self:center}.pay-table-note{display:flex;align-items:center;gap:5px;margin:4px 2px 6px;color:var(--color-text-secondary);font-size:var(--primitive-font-11)}.pay-table-note.locked{color:var(--color-warning)}
.page-hr>.pay-scroll{max-height:calc(100vh - 250px)}
.page-hr .pay-toolbar{border-radius:var(--control-radius);background:var(--color-surface-subtle)}
.page-hr>.pay-toolbar{margin:0!important}
.legacy-page>div.muted{margin-block:0!important}
.page-hr .pay-table thead th{background:var(--table-header-bg)}
.page-hr .pay-table tbody tr:nth-child(even)>td{background:var(--color-surface-subtle)}
.page-hr .pay-table tbody tr:hover>td{background:var(--table-row-hover)}
/* 工资表是动态高度双层表头：整块 thead 吸顶，避免按固定 28px 分别吸顶时
   在缩放、换行或横向滚动下出现员工行穿透两层表头。separate 也规避 Chrome
   对 border-collapse + sticky table-cell 的偶发重绘残影。 */
.page-hr .payroll-table{border-collapse:separate;border-spacing:0}
.page-hr .payroll-table>thead{
  position:sticky;
  top:0;
  z-index:8;
  isolation:isolate;
  background:var(--table-header-bg);
  box-shadow:0 1px 0 var(--color-border);
}
.page-hr .payroll-table>thead>tr>th{
  position:relative;
  top:auto;
  z-index:1;
  background-clip:padding-box;
  box-shadow:none;
}
.page-hr .payroll-table>thead>tr.pay-cats>th.opcol{
  position:sticky;
  top:auto;
  right:0;
  z-index:2;
}
.page-hr .payroll-table>thead>tr.pay-cats>th.pay-cat-b{background:var(--color-surface-subtle);color:var(--color-text-secondary)}
.page-hr .payroll-table>thead>tr.pay-cats>th.pay-cat-e{background:var(--color-success-subtle);color:var(--color-success)}
.page-hr .payroll-table>thead>tr.pay-cats>th.pay-cat-a{background:var(--color-warning-subtle);color:var(--color-warning)}
.page-hr .payroll-table>thead>tr.pay-cats>th.pay-cat-s{background:var(--color-primary-subtle);color:var(--color-primary-hover)}
.page-hr .payroll-table>thead>tr.pay-cats>th.pay-cat-o{background:var(--color-surface);color:var(--color-text)}
.page-org>.card{padding:var(--section-padding)}
.page-org>.card>.flexbar{padding-bottom:var(--primitive-space-3);border-bottom:1px solid var(--color-border)}
.page-org>.card table{margin-top:var(--primitive-space-2)}
.page-params>.card,.page-fx>.card,.page-brands>.card,.page-roles>.card,.page-usage>.card,.page-loginlog>.card{margin:0!important}
.page-messages>h4{
  margin:var(--primitive-space-1) 0 0!important;
  color:var(--color-text-secondary);
  font-size:var(--primitive-font-12);
  font-weight:700;
  letter-spacing:.04em;
}
.page-messages>.card{margin:0!important;box-shadow:none}
.page-messages>.card:hover{border-color:var(--color-primary-border);background:var(--color-primary-subtle)}

/* Authentication uses the same tokens and control states as the application. */
.login-wrap{background:var(--color-canvas)}
.login-box{border-color:var(--card-border);border-radius:var(--dialog-radius);box-shadow:var(--shadow-overlay)}
.login-box .btn{min-height:var(--control-height-lg)}

/* ---------- Responsive consistency ---------- */
@media (max-width:1100px){
  .legacy-page>.flexbar{align-items:flex-start;flex-direction:column}
  .legacy-page>.flexbar>div:last-child{width:100%;justify-content:flex-start}
  .hr-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hr-dash-grid,.hr-profile-grid{grid-template-columns:minmax(0,1fr)}
  .hr-profile-records{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pay-flow-body{grid-template-columns:minmax(0,1fr)}
  .pay-flow-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.pay-flow-actions h3,.pay-flow-actions p,.pay-flow-actions small{grid-column:1 / -1}
  .modal:has(.pd-top) .pd-top{display:grid;grid-template-columns:minmax(0,1fr)}
  .modal:has(.pd-top) .pd-reg,.modal:has(.pd-top) .pd-calc{min-width:0}
}

@media (max-width:760px){
  :root{--layout-content-padding:var(--primitive-space-3)}
  .rail{width:var(--layout-sidebar-compact-width)}
  .topbar{height:var(--layout-topbar-height);min-height:var(--layout-topbar-height);align-items:stretch;flex-wrap:nowrap}
  .tabbar{order:initial;flex:1 1 auto;flex-basis:auto;min-height:0}
  .gsearch-wrap{display:none}
  .topbar .user{order:initial;margin-left:0;padding:0;align-self:center}
  .content{padding:var(--layout-content-padding)}
  :where(.home-hero,.research-query-card,.ads-panel,.ads-hero,.ads-manual-content){padding:var(--primitive-space-3)}
  .legacy-page{gap:var(--primitive-space-2)}
  .unified-page-head{min-height:64px;padding:var(--primitive-space-3)}
  .unified-page-copy h1{font-size:var(--primitive-font-16)}
  .unified-page-copy p{white-space:normal}
  .legacy-page>.flexbar,.legacy-page>.page-toolbar{padding:var(--primitive-space-3)}
  .legacy-page>.flexbar>div:last-child>*{max-width:100%}
  .legacy-page>.flexbar>div:last-child>input,
  .legacy-page>.flexbar>div:last-child>select{flex:1 1 180px;width:auto!important}
  .hr-dash-heading{flex-direction:column;padding:var(--primitive-space-3)}
  .hr-dash-actions,.hr-roster-actions,.pay-main-actions{justify-content:flex-start}
  .hr-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hr-kpi{padding:var(--primitive-space-3)}
  .hr-pay-numbers,.hr-approval-grid,.hr-profile-records,.hr-profile-pairs,.hr-sensitive-values{grid-template-columns:minmax(0,1fr)}
  .hr-profile-pair:nth-child(2){border-top:1px solid var(--color-border)}
  .hr-profile-head{grid-template-columns:minmax(0,1fr);padding:var(--primitive-space-3)}
  .hr-profile-head-actions{justify-self:start}
  .hr-roster-filters{width:100%}.hr-roster-filters input{flex:1 1 100%;width:100%}
  .pay-flow-console{padding:var(--primitive-space-3);overflow:hidden}.pay-flow-steps{overflow-x:auto;grid-template-columns:repeat(6,minmax(116px,1fr));padding-bottom:var(--primitive-space-2)}
  .pay-preflight ul,.pay-flow-actions{grid-template-columns:minmax(0,1fr)}
  .legacy-page :where(.grid2,.grid3){grid-template-columns:minmax(0,1fr)}
  .legacy-page :where(button,.btn,.module-tab){min-height:40px}
  .legacy-page :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){font-size:16px}
  .page-product-list table.resizable,
  .page-hr table,
  .page-org table,
  .page-roles table,
  .page-publish-jobs table,
  .page-usage table,
  .page-loginlog table{min-width:680px}
  .page-filter-strip,.module-tabs{scroll-snap-type:x proximity}
  .page-filter-strip>*,.module-tabs>*{scroll-snap-align:start}
  .pager{justify-content:flex-start}
  .page-image .img-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .page-copy .two-col-cell{flex-basis:100%!important;min-width:0!important}
  .page-inline-toolbar{scroll-snap-type:x proximity}
  .page-inline-toolbar>*{scroll-snap-align:start}
  .modal:has(.pd-top){padding:var(--primitive-space-3)}
  .modal:has(.pd-top)>.flexbar:first-of-type{top:calc(var(--primitive-space-3) * -1);margin:calc(var(--primitive-space-3) * -1) calc(var(--primitive-space-3) * -1) var(--primitive-space-2);padding:var(--primitive-space-3)}
  .modal:has(.pd-top) .grid2,.modal:has(.pd-top) .grid3{grid-template-columns:minmax(0,1fr)}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}