/* BIMAS ERP UI System
   Single visual contract for KPI cards, app typography, colors, and responsive grids.
   Legacy module CSS may remain, but shared UI should be expressed through these classes. */

:root{
  --erp-font-body:"Inter","Plus Jakarta Sans",Arial,sans-serif;
  --erp-font-display:"Plus Jakarta Sans","Inter",Arial,sans-serif;
  --erp-text:#071529;
  --erp-muted:#475569;
  --erp-border:#dbe6f2;
  --erp-surface:#ffffff;
  --erp-surface-soft:#f8fbff;
  --erp-page:#f4f8fc;
  --erp-blue:#174f91;
  --erp-green:#047857;
  --erp-orange:#b45309;
  --erp-purple:#6d28d9;
  --erp-red:#be123c;
  --erp-radius:8px;
  --erp-shadow:0 8px 18px rgba(15,23,42,.06);
  --erp-kpi-gap:.62rem;
  --erp-kpi-height:72px;
  --erp-kpi-icon:2rem;
  --erp-kpi-label:.56rem;
  --erp-kpi-value:.92rem;
  --erp-kpi-sub:.52rem;
}

html[data-auth-ready="app"] body,
html[data-auth-ready="app"] #app-content{
  font-family:var(--erp-font-body)!important;
  color:var(--erp-text)!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] #app-content :is(h1,h2,h3,.ceo-title,.page-title,.module-title){
  font-family:var(--erp-font-display)!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-grid,
  .bimas-auto-kpi-strip,
  .kpi-grid,
  .dash-grid,
  .dash-kpi-grid,
  .bi-kpi-grid,
  .sec-kpi-grid,
  .fgs-kpi-grid,
  .inv-kpi-grid,
  .inv-overview-kpis,
  .wip-kpi-grid,
  .accounts-kpi-grid,
  .sof-kpi-grid,
  .pfi-kpi-grid,
  .cust-kpi-grid,
  .customers-kpi-grid,
  .crm-kpi-grid,
  .products-kpi-grid,
  .production-kpi-grid,
  .fleet-kpi-grid,
  .drn-kpi-grid,
  .dn-kpi-grid,
  .voucher-kpi-grid,
  .notifications-kpi-grid,
  .reports-hub-kpis,
  .reports-report-kpis,
  .sales-perf-kpis,
  .ceo-kpi-grid,
  .ceo-report-grid,
  .ops-manager-kpis,
  .ops-kpis,
  [class*="-kpi-grid"],
  [class*="-metric-grid"],
  [class*="-stats-grid"],
  [class*="-kpis"]
){
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))!important;
  gap:var(--erp-kpi-gap)!important;
  align-items:stretch!important;
  width:100%!important;
  min-width:0!important;
  margin-block:.75rem 1rem!important;
  padding:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content :is(.ceo-kpi-grid,.dash-grid){
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-report-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
){
  --erp-system-tone:var(--erp-blue);
  --erp-kpi-tone:var(--tone,var(--fgs-tone,var(--dn-tone,var(--drn-tone,var(--sof-tone,var(--cust-kpi-color,var(--pfi-tone,var(--inv-overview-tone,var(--wip-metric-tone,var(--accounts-tone,var(--payroll-tone,var(--production-kpi-color,var(--notif-tone,var(--products-kpi-color,var(--reports-tone,var(--sales-tone,var(--invoice-tone,var(--erp-system-tone,var(--global-kpi-tone,var(--erp-blue))))))))))))))))))))!important;
  box-sizing:border-box!important;
  position:relative!important;
  min-width:0!important;
  min-height:var(--erp-kpi-height)!important;
  height:var(--erp-kpi-height)!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:.56rem!important;
  padding:.55rem .68rem!important;
  border:1px solid var(--erp-border)!important;
  border-top:3px solid var(--erp-kpi-tone)!important;
  border-left:1px solid var(--erp-border)!important;
  border-radius:var(--erp-radius)!important;
  background:linear-gradient(180deg,var(--erp-surface) 0%,var(--erp-surface-soft) 100%)!important;
  color:var(--erp-text)!important;
  box-shadow:var(--erp-shadow)!important;
  overflow:hidden!important;
  text-align:left!important;
  transform:none!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
):nth-child(6n+1){--erp-system-tone:#0b5cab!important;}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
):nth-child(6n+2){--erp-system-tone:#047857!important;}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
):nth-child(6n+3){--erp-system-tone:#0369a1!important;}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
):nth-child(6n+4){--erp-system-tone:#4f46e5!important;}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
):nth-child(6n+5){--erp-system-tone:#0f766e!important;}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
):nth-child(6n){--erp-system-tone:#334155!important;}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
)::before{
  content:""!important;
  position:absolute!important;
  inset:0 auto 0 0!important;
  width:3px!important;
  height:auto!important;
  border-radius:var(--erp-radius) 0 0 var(--erp-radius)!important;
  background:var(--erp-kpi-tone)!important;
  opacity:1!important;
  pointer-events:none!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
)::after{
  content:""!important;
  position:absolute!important;
  top:-2.1rem!important;
  right:-1.55rem!important;
  width:5.2rem!important;
  height:5.2rem!important;
  border-radius:999px!important;
  background:var(--erp-kpi-tone)!important;
  opacity:.075!important;
  pointer-events:none!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-icon,
  .kpi-icon,
  .metric-icon,
  .stat-icon,
  .fgs-metric-icon,
  .ceo-kpi-icon,
  .reports-hub-kpi-icon,
  .reports-report-kpi-icon,
  .sales-perf-kpi-icon,
  .prod-dash-kpi-icon,
  .kicon,
  .icon,
  .ceo-report i,
  .ops-manager-kpi i
){
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
  width:var(--erp-kpi-icon)!important;
  height:var(--erp-kpi-icon)!important;
  min-width:var(--erp-kpi-icon)!important;
  flex:0 0 var(--erp-kpi-icon)!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  border-radius:7px!important;
  background:linear-gradient(135deg,var(--erp-kpi-tone),color-mix(in srgb,var(--erp-kpi-tone) 76%,#0f172a))!important;
  color:#fff!important;
  box-shadow:0 8px 14px color-mix(in srgb,var(--erp-kpi-tone) 22%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--erp-kpi-tone) 58%,#fff)!important;
  font-style:normal!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-icon,.kpi-icon,.metric-icon,.stat-icon,.fgs-metric-icon,.ceo-kpi-icon,.kicon,.icon,i) .material-symbols-outlined,
html[data-auth-ready="app"] #app-content .material-symbols-outlined.bimas-kpi-icon{
  font-size:.98rem!important;
  line-height:1!important;
  color:#fff!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-body,
  .bimas-kpi-copy,
  .kpi-body,
  .kpi-main,
  .kpi-copy,
  .metric-copy,
  .stat-copy,
  .fgs-metric-copy,
  .ceo-kpi-copy,
  .ceo-report-copy
){
  position:relative!important;
  z-index:1!important;
  min-width:0!important;
  flex:1 1 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:.06rem!important;
  text-align:left!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-label,
  .kpi-label,
  .metric-label,
  .stat-label,
  .fgs-metric-label,
  .ceo-kpi-label,
  .ceo-report strong,
  .dash-kpi .label
){
  display:block!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  color:var(--erp-text)!important;
  font-family:var(--erp-font-display)!important;
  font-size:var(--erp-kpi-label)!important;
  font-weight:900!important;
  line-height:1.06!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:left!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-value,
  .kpi-value,
  .metric-value,
  .stat-value,
  .fgs-metric-value,
  .ceo-kpi-value,
  .dash-kpi .value
){
  display:block!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  color:#000!important;
  font-family:var(--erp-font-display)!important;
  font-size:var(--erp-kpi-value)!important;
  font-weight:950!important;
  line-height:1.06!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:left!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-sub,
  .kpi-sub,
  .metric-sub,
  .stat-sub,
  .fgs-metric-sub,
  .ceo-kpi-sub,
  .ceo-report span,
  .dash-kpi .sub
){
  display:block!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  color:var(--erp-muted)!important;
  font-size:var(--erp-kpi-sub)!important;
  font-weight:800!important;
  line-height:1.08!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:left!important;
}

html[data-auth-ready="app"] #app-content :is(.ceo-kpi-badge,.ceo-report-action,.dash-spark,.dash-meter){
  display:none!important;
}

html[data-auth-ready="app"] #app-content :is(.pfi-filterbar,.filters,.filterbar){
  gap:.6rem!important;
}

@media (max-width:1200px){
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content :is(.ceo-kpi-grid,.dash-grid){
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

@media (max-width:900px){
  html[data-auth-ready="app"] #app-content :is(
    .bimas-kpi-grid,
    .bimas-auto-kpi-strip,
    .kpi-grid,
    .dash-grid,
    .pfi-kpi-grid,
    .ceo-kpi-grid,
    .ceo-report-grid,
    [class*="-kpi-grid"],
    [class*="-metric-grid"],
    [class*="-stats-grid"],
    [class*="-kpis"]
  ){
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

@media (max-width:640px){
  :root{
    --erp-kpi-gap:.55rem;
    --erp-kpi-height:74px;
    --erp-kpi-icon:1.9rem;
    --erp-kpi-label:.55rem;
    --erp-kpi-value:.86rem;
    --erp-kpi-sub:.5rem;
  }

  html[data-auth-ready="app"] #app-content :is(
    .bimas-kpi-grid,
    .bimas-auto-kpi-strip,
    .kpi-grid,
    .dash-grid,
    .dash-shortcuts,
    .pfi-kpi-grid,
    .ceo-kpi-grid,
    .ceo-report-grid,
    .ops-manager-kpis,
    .ops-kpis,
    [class*="-kpi-grid"],
    [class*="-metric-grid"],
    [class*="-stats-grid"],
    [class*="-kpis"]
  ){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:var(--erp-kpi-gap)!important;
    margin-block:.55rem .8rem!important;
  }

  html[data-auth-ready="app"] #app-content :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,.dash-kpi,.ceo-kpi,.ceo-report,.pfi-metric-card,[class*="kpi-card"],[class*="metric-card"],[class*="stat-card"]){
    height:var(--erp-kpi-height)!important;
    min-height:var(--erp-kpi-height)!important;
    padding:.52rem .58rem!important;
    gap:.48rem!important;
  }
}

@media (max-width:380px){
  :root{
    --erp-kpi-height:70px;
    --erp-kpi-icon:1.75rem;
    --erp-kpi-label:.5rem;
    --erp-kpi-value:.8rem;
    --erp-kpi-sub:.46rem;
  }

  html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-kpis"]){
    gap:.45rem!important;
  }
}

/* System lock: keeps legacy module <style> blocks from changing shared KPI behavior. */
html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-grid,
  .bimas-auto-kpi-strip,
  .pfi-kpi-grid,
  .ceo-kpi-grid,
  .ceo-report-grid,
  .dash-grid,
  [class*="-kpi-grid"],
  [class*="-metric-grid"],
  [class*="-stats-grid"],
  [class*="-kpis"]
){
  display:grid!important;
  gap:var(--erp-kpi-gap)!important;
  align-items:stretch!important;
  min-width:0!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
){
  --erp-system-tone:var(--erp-blue);
  --erp-kpi-tone:var(--tone,var(--fgs-tone,var(--dn-tone,var(--drn-tone,var(--sof-tone,var(--cust-kpi-color,var(--pfi-tone,var(--inv-overview-tone,var(--wip-metric-tone,var(--accounts-tone,var(--payroll-tone,var(--production-kpi-color,var(--notif-tone,var(--products-kpi-color,var(--reports-tone,var(--sales-tone,var(--invoice-tone,var(--erp-system-tone,var(--global-kpi-tone,var(--erp-blue))))))))))))))))))))!important;
  min-height:var(--erp-kpi-height)!important;
  height:var(--erp-kpi-height)!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:.56rem!important;
  padding:.55rem .68rem!important;
  border:1px solid var(--erp-border)!important;
  border-top:3px solid var(--erp-kpi-tone)!important;
  border-radius:var(--erp-radius)!important;
  background:linear-gradient(180deg,var(--erp-surface) 0%,var(--erp-surface-soft) 100%)!important;
  color:var(--erp-text)!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .pfi-metric-card,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
) :is(
  .bimas-kpi-icon,
  .kpi-icon,
  .metric-icon,
  .stat-icon,
  .fgs-metric-icon,
  .ceo-kpi-icon,
  .reports-hub-kpi-icon,
  .reports-report-kpi-icon,
  .sales-perf-kpi-icon,
  .prod-dash-kpi-icon,
  .kicon,
  .icon,
  .ceo-report i,
  .ops-manager-kpi i
){
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
  width:var(--erp-kpi-icon)!important;
  height:var(--erp-kpi-icon)!important;
  min-width:var(--erp-kpi-icon)!important;
  flex:0 0 var(--erp-kpi-icon)!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  border-radius:7px!important;
  background:linear-gradient(135deg,var(--erp-kpi-tone),color-mix(in srgb,var(--erp-kpi-tone) 76%,#0f172a))!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  box-shadow:0 8px 14px color-mix(in srgb,var(--erp-kpi-tone) 22%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--erp-kpi-tone) 58%,#fff)!important;
  font-style:normal!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-label,
  .kpi-label,
  .metric-label,
  .stat-label,
  .fgs-metric-label,
  .ceo-kpi-label,
  .ceo-report strong,
  .dash-kpi .label
){
  font-family:var(--erp-font-display)!important;
  font-size:var(--erp-kpi-label)!important;
  font-weight:900!important;
  line-height:1.06!important;
  letter-spacing:0!important;
  color:var(--erp-text)!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-value,
  .kpi-value,
  .metric-value,
  .stat-value,
  .fgs-metric-value,
  .ceo-kpi-value,
  .dash-kpi .value
){
  font-family:var(--erp-font-display)!important;
  font-size:var(--erp-kpi-value)!important;
  font-weight:950!important;
  line-height:1.06!important;
  letter-spacing:0!important;
  color:#000!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-sub,
  .kpi-sub,
  .metric-sub,
  .stat-sub,
  .fgs-metric-sub,
  .ceo-kpi-sub,
  .ceo-report span,
  .dash-kpi .sub
){
  font-size:var(--erp-kpi-sub)!important;
  font-weight:800!important;
  line-height:1.08!important;
  letter-spacing:0!important;
  color:var(--erp-muted)!important;
  text-transform:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

@media (max-width:640px){
  html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
    .bimas-kpi-grid,
    .bimas-auto-kpi-strip,
    .pfi-kpi-grid,
    .ceo-kpi-grid,
    .ceo-report-grid,
    .dash-grid,
    .dash-shortcuts,
    [class*="-kpi-grid"],
    [class*="-metric-grid"],
    [class*="-stats-grid"],
    [class*="-kpis"]
  ){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* Module repair layer: wins over legacy injected module styles without moving behavior. */
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell{
  gap:.9rem!important;
  overflow-x:hidden!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-hero{
  box-sizing:border-box!important;
  position:relative!important;
  min-height:auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(18rem,.95fr)!important;
  align-items:stretch!important;
  gap:.9rem!important;
  padding:1rem!important;
  border:1px solid rgba(255,255,255,.24)!important;
  border-radius:8px!important;
  background:linear-gradient(135deg,#061636 0%,#0a3a78 48%,#066456 100%)!important;
  color:#fff!important;
  box-shadow:0 18px 40px rgba(7,27,70,.22)!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.08) 0 1px,transparent 1px 100%),
    linear-gradient(0deg,rgba(255,255,255,.055) 0 1px,transparent 1px 100%)!important;
  background-size:42px 42px!important;
  opacity:.42!important;
  pointer-events:none!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-hero::after{
  content:""!important;
  position:absolute!important;
  inset:auto 0 0 0!important;
  height:4px!important;
  background:linear-gradient(90deg,#f59e0b,#22c55e,#38bdf8,#2563eb)!important;
  pointer-events:none!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-hero > *{
  min-width:0!important;
  position:relative!important;
  z-index:1!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-title{
  max-width:100%!important;
  margin:.35rem 0 0!important;
  font-family:var(--erp-font-display)!important;
  font-size:clamp(1.55rem,2.1vw,2.05rem)!important;
  font-weight:950!important;
  line-height:1.06!important;
  letter-spacing:0!important;
  color:#fff!important;
  overflow-wrap:normal!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-subline{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:.45rem!important;
  margin-top:.72rem!important;
  min-width:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-eyebrow{
  color:#dff7ff!important;
  font-size:.68rem!important;
  font-weight:950!important;
  line-height:1.1!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-role-chip{
  max-width:100%!important;
  min-width:0!important;
  min-height:1.7rem!important;
  padding:.28rem .58rem!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:.32rem!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:.66rem!important;
  line-height:1!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:.55rem!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief-card{
  min-width:0!important;
  min-height:4.4rem!important;
  padding:.62rem!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief-card span,
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief-card strong{
  max-width:100%!important;
  color:#fff!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief-card span{
  font-size:.56rem!important;
  font-weight:950!important;
  line-height:1.08!important;
  text-transform:uppercase!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief-card strong{
  margin:.24rem 0 0!important;
  font-size:1.08rem!important;
  font-weight:950!important;
  line-height:1.05!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:.52rem!important;
  margin-block:.72rem .95rem!important;
  padding:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi{
  --erp-kpi-height:76px;
  box-sizing:border-box!important;
  min-width:0!important;
  min-height:var(--erp-kpi-height)!important;
  height:var(--erp-kpi-height)!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:.52rem!important;
  padding:.56rem .62rem!important;
  text-align:left!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-icon{
  position:relative!important;
  width:1.82rem!important;
  height:1.82rem!important;
  min-width:1.82rem!important;
  flex:0 0 1.82rem!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-copy{
  min-width:0!important;
  flex:1 1 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:.05rem!important;
  text-align:left!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell :is(.ceo-kpi-label,.ceo-kpi-value,.ceo-kpi-sub){
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  color:#000!important;
  letter-spacing:0!important;
  text-align:left!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-label{
  font-size:.52rem!important;
  font-weight:950!important;
  line-height:1.08!important;
  text-transform:uppercase!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-value{
  font-family:var(--erp-font-display)!important;
  font-size:.84rem!important;
  font-weight:950!important;
  line-height:1.05!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-sub{
  color:var(--erp-muted)!important;
  font-size:.48rem!important;
  font-weight:850!important;
  line-height:1.08!important;
}

html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-kpi-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:.72rem!important;
  margin-block:.75rem 1.1rem!important;
  padding:0!important;
}

html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card{
  --erp-kpi-height:84px;
  min-height:var(--erp-kpi-height)!important;
  height:var(--erp-kpi-height)!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:.62rem!important;
  padding:.62rem .75rem!important;
}

html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card .bimas-kpi-icon{
  width:2.05rem!important;
  height:2.05rem!important;
  min-width:2.05rem!important;
  flex:0 0 2.05rem!important;
}

html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card .bimas-kpi-body{
  min-width:0!important;
  flex:1 1 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:.05rem!important;
}

html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card :is(.bimas-kpi-label,.bimas-kpi-value,.bimas-kpi-sub){
  max-width:100%!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcuts{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr))!important;
  gap:.72rem!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut{
  --shortcut-system-tone:#0b5cab;
  min-width:0!important;
  border:1px solid var(--erp-border)!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
  color:#000!important;
  box-shadow:var(--erp-shadow)!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut:nth-child(6n+1){--shortcut-system-tone:#0b5cab;}
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut:nth-child(6n+2){--shortcut-system-tone:#047857;}
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut:nth-child(6n+3){--shortcut-system-tone:#b45309;}
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut:nth-child(6n+4){--shortcut-system-tone:#6d28d9;}
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut:nth-child(6n+5){--shortcut-system-tone:#be123c;}
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut:nth-child(6n){--shortcut-system-tone:#334155;}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut .ico{
  display:grid!important;
  place-items:center!important;
  border-radius:7px!important;
  background:linear-gradient(135deg,var(--shortcut-system-tone),color-mix(in srgb,var(--shortcut-system-tone) 76%,#0f172a))!important;
  color:#fff!important;
  box-shadow:0 8px 14px color-mix(in srgb,var(--shortcut-system-tone) 20%,transparent)!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut .material-symbols-outlined{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut > span:nth-child(2) > span:first-child{
  color:#000!important;
  font-weight:950!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut-detail{
  color:var(--erp-muted)!important;
  font-weight:800!important;
}

@media (max-width:1180px){
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-hero{
    grid-template-columns:1fr!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (max-width:700px){
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell{
    margin:-.75rem!important;
    padding:.75rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-hero{
    display:block!important;
    padding:.85rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-eyebrow{
    font-size:.62rem!important;
    line-height:1.1!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-title{
    margin:.32rem 0 0!important;
    font-size:1.55rem!important;
    line-height:1.08!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-subline{
    margin-top:.55rem!important;
    gap:.36rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-role-chip{
    max-width:100%!important;
    min-height:1.45rem!important;
    padding:.22rem .46rem!important;
    font-size:.56rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:.42rem!important;
    margin-top:.7rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief-card{
    min-height:3.7rem!important;
    padding:.48rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief-card span{
    font-size:.44rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-brief-card strong{
    font-size:.92rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-grid,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:.55rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card{
    --erp-kpi-height:82px;
    padding:.54rem .58rem!important;
    gap:.5rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcuts{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:.48rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut{
    min-height:5.65rem!important;
    height:5.65rem!important;
    padding:.52rem .36rem!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:.36rem!important;
    text-align:center!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut .ico{
    width:2.25rem!important;
    height:2.25rem!important;
    min-width:2.25rem!important;
    margin:0!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut > span:nth-child(2){
    min-width:0!important;
    width:100%!important;
    text-align:center!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut > span:nth-child(2) > span:first-child{
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    color:#000!important;
    font-size:.56rem!important;
    font-weight:950!important;
    line-height:1.08!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut-detail,
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut .chev{
    display:none!important;
  }
}

@media (max-width:380px){
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card{
    --erp-kpi-height:76px;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-icon,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card .bimas-kpi-icon{
    width:1.7rem!important;
    height:1.7rem!important;
    min-width:1.7rem!important;
    flex-basis:1.7rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-label,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card .bimas-kpi-label{
    font-size:.48rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-value,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card .bimas-kpi-value{
    font-size:.74rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .dash-shortcut{
    min-height:5.15rem!important;
    height:5.15rem!important;
    padding:.45rem .28rem!important;
  }
}

/* Settings and final KPI contract: one compact language across every module. */
html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-grid,
  .bimas-auto-kpi-strip,
  .kpi-grid,
  .dash-grid,
  .dash-kpi-grid,
  .bi-kpi-grid,
  .sec-kpi-grid,
  .fgs-kpi-grid,
  .inv-kpi-grid,
  .inv-overview-kpis,
  .wip-kpi-grid,
  .accounts-kpi-grid,
  .sof-kpi-grid,
  .pfi-kpi-grid,
  .cust-kpi-grid,
  .customers-kpi-grid,
  .crm-kpi-grid,
  .products-kpi-grid,
  .production-kpi-grid,
  .fleet-kpi-grid,
  .drn-kpi-grid,
  .dn-kpi-grid,
  .voucher-kpi-grid,
  .notifications-kpi-grid,
  .reports-hub-kpis,
  .reports-report-kpis,
  .sales-perf-kpis,
  .ceo-kpi-grid,
  .ceo-report-grid,
  .ops-manager-kpis,
  .ops-kpis,
  .settings-summary-grid,
  .settings-readiness-grid,
  .settings-mobile-grid,
  [class*="-kpi-grid"],
  [class*="-metric-grid"],
  [class*="-stats-grid"],
  [class*="-kpis"]
){
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(9.5rem,1fr))!important;
  gap:.62rem!important;
  align-items:stretch!important;
  width:100%!important;
  min-width:0!important;
  margin-block:.72rem 1rem!important;
  padding:0!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  .settings-summary-card,
  .settings-readiness-card,
  .settings-mobile-stat,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
){
  --erp-system-tone:var(--erp-blue);
  --erp-kpi-tone:var(--settings-accent,var(--settings-tone,var(--mobile-stat,var(--tone,var(--global-kpi-tone,var(--accounts-tone,var(--pfi-tone,var(--fgs-tone,var(--erp-system-tone)))))))))!important;
  box-sizing:border-box!important;
  position:relative!important;
  min-width:0!important;
  min-height:76px!important;
  height:76px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:.56rem!important;
  padding:.55rem .68rem!important;
  border:1px solid var(--erp-border)!important;
  border-top:3px solid var(--erp-kpi-tone)!important;
  border-radius:var(--erp-radius)!important;
  background:linear-gradient(180deg,var(--erp-surface) 0%,var(--erp-surface-soft) 100%)!important;
  color:#000!important;
  box-shadow:var(--erp-shadow)!important;
  overflow:hidden!important;
  text-align:left!important;
  transform:none!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .ceo-report,
  .ops-kpi,
  .ops-manager-kpi,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  .fgs-metric-card,
  .pfi-metric-card,
  .settings-summary-card,
  .settings-readiness-card,
  .settings-mobile-stat,
  [class*="kpi-card"],
  [class*="metric-card"],
  [class*="stat-card"]
)::after{
  content:""!important;
  position:absolute!important;
  top:-2.1rem!important;
  right:-1.55rem!important;
  width:5.2rem!important;
  height:5.2rem!important;
  border-radius:999px!important;
  background:var(--erp-kpi-tone)!important;
  opacity:.07!important;
  pointer-events:none!important;
  transform:none!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-icon,
  .kpi-icon,
  .metric-icon,
  .stat-icon,
  .fgs-metric-icon,
  .ceo-kpi-icon,
  .reports-hub-kpi-icon,
  .reports-report-kpi-icon,
  .sales-perf-kpi-icon,
  .prod-dash-kpi-icon,
  .settings-summary-card > .material-symbols-outlined,
  .settings-readiness-card > .material-symbols-outlined,
  .settings-mobile-stat > .material-symbols-outlined,
  .kicon,
  .icon
){
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  z-index:1!important;
  width:2rem!important;
  height:2rem!important;
  min-width:2rem!important;
  flex:0 0 2rem!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  border-radius:7px!important;
  background:linear-gradient(135deg,var(--erp-kpi-tone),color-mix(in srgb,var(--erp-kpi-tone) 76%,#0f172a))!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  box-shadow:0 8px 14px color-mix(in srgb,var(--erp-kpi-tone) 22%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--erp-kpi-tone) 58%,#fff)!important;
  font-style:normal!important;
  font-size:1rem!important;
  line-height:1!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-label,
  .kpi-label,
  .metric-label,
  .stat-label,
  .fgs-metric-label,
  .ceo-kpi-label,
  .dash-kpi .label,
  .settings-summary-card p,
  .settings-readiness-card p,
  .settings-mobile-stat p
){
  display:block!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  color:var(--erp-text)!important;
  font-family:var(--erp-font-display)!important;
  font-size:.54rem!important;
  font-weight:950!important;
  line-height:1.08!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:left!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-value,
  .kpi-value,
  .metric-value,
  .stat-value,
  .fgs-metric-value,
  .ceo-kpi-value,
  .dash-kpi .value,
  .settings-summary-card strong,
  .settings-readiness-card strong,
  .settings-mobile-stat strong
){
  display:block!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  color:#000!important;
  font-family:var(--erp-font-display)!important;
  font-size:.9rem!important;
  font-weight:950!important;
  line-height:1.05!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:left!important;
}

html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
  .bimas-kpi-sub,
  .kpi-sub,
  .metric-sub,
  .stat-sub,
  .fgs-metric-sub,
  .ceo-kpi-sub,
  .dash-kpi .sub,
  .settings-readiness-card small
){
  display:block!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  color:var(--erp-muted)!important;
  font-size:.5rem!important;
  font-weight:850!important;
  line-height:1.08!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:left!important;
}

html[data-auth-ready="app"] body[data-route="settings"] #app-content#app-content .settings-quick-nav{
  position:sticky!important;
  top:calc(var(--topbar-h,4rem) + .55rem)!important;
  z-index:45!important;
  display:grid!important;
  grid-template-columns:repeat(9,minmax(0,1fr))!important;
  gap:.5rem!important;
  padding:.55rem!important;
  margin:.9rem 0 1rem!important;
  border:1px solid var(--erp-border)!important;
  border-radius:var(--erp-radius)!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 12px 28px rgba(15,23,42,.08)!important;
  backdrop-filter:blur(14px)!important;
}

html[data-auth-ready="app"] body[data-route="settings"] #app-content#app-content .settings-quick-nav a{
  min-width:0!important;
  min-height:2.75rem!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.42rem!important;
  padding:.48rem .52rem!important;
  border:1px solid transparent!important;
  border-radius:7px!important;
  color:var(--erp-text)!important;
  font-size:.72rem!important;
  font-weight:900!important;
  line-height:1.12!important;
  text-decoration:none!important;
  white-space:normal!important;
  text-align:center!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] body[data-route="settings"] #app-content#app-content .settings-quick-nav .material-symbols-outlined{
  color:var(--erp-blue)!important;
  -webkit-text-fill-color:var(--erp-blue)!important;
  font-size:1.05rem!important;
  flex:0 0 auto!important;
}

html[data-auth-ready="app"] body[data-route="settings"] #app-content#app-content .settings-quick-nav a:hover,
html[data-auth-ready="app"] body[data-route="settings"] #app-content#app-content .settings-quick-nav a:focus-visible{
  background:#eff6ff!important;
  border-color:#bdd7f6!important;
  color:var(--erp-blue)!important;
  transform:translateY(-1px)!important;
}

@media (max-width:1180px){
  html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(.settings-summary-grid,.settings-readiness-grid,.settings-mobile-grid){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (max-width:700px){
  html[data-auth-ready="app"] body[data-route] #app-content#app-content .page-container :is(
    .bimas-kpi-grid,
    .bimas-auto-kpi-strip,
    .kpi-grid,
    .dash-grid,
    .pfi-kpi-grid,
    .ceo-kpi-grid,
    .settings-summary-grid,
    .settings-readiness-grid,
    .settings-mobile-grid,
    [class*="-kpi-grid"],
    [class*="-metric-grid"],
    [class*="-stats-grid"],
    [class*="-kpis"]
  ){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:.55rem!important;
  }

  html[data-auth-ready="app"] body[data-route="settings"] #app-content#app-content .settings-quick-nav{
    position:relative!important;
    top:auto!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:.42rem!important;
    padding:.45rem!important;
    margin:.65rem 0 .8rem!important;
  }

  html[data-auth-ready="app"] body[data-route="settings"] #app-content#app-content .settings-quick-nav a{
    min-height:3rem!important;
    padding:.42rem .32rem!important;
    flex-direction:column!important;
    gap:.22rem!important;
    font-size:.62rem!important;
  }
}

/* BIMAS ERP UX excellence layer: shell, modules, forms, tables, and mobile app polish. */
:root{
  --erp-shell-bg:#eef4fb;
  --erp-shell-band:#f8fbff;
  --erp-topbar-bg:rgba(255,255,255,.94);
  --erp-soft-border:#d7e3f0;
  --erp-focus:rgba(23,79,145,.18);
  --erp-card-shadow:0 10px 28px rgba(15,23,42,.07);
  --erp-card-shadow-hover:0 14px 34px rgba(15,23,42,.095);
}

html[data-auth-ready="app"] body{
  background:
    linear-gradient(180deg,var(--erp-shell-band) 0%,var(--erp-shell-bg) 42%,#f7fafc 100%)!important;
  font-family:var(--erp-font-body)!important;
  text-rendering:geometricPrecision;
}

html[data-auth-ready="app"] body[data-route] #app-content{
  background:
    linear-gradient(90deg,rgba(23,79,145,.035) 0 1px,transparent 1px 100%),
    linear-gradient(0deg,rgba(23,79,145,.026) 0 1px,transparent 1px 100%),
    linear-gradient(180deg,rgba(255,255,255,.38),rgba(255,255,255,0))!important;
  background-size:48px 48px,48px 48px,100% 100%!important;
  color:var(--erp-text)!important;
}

html[data-auth-ready="app"] body[data-route] #app-content > .page-container{
  width:100%!important;
  max-width:min(1480px,100%)!important;
  margin-inline:auto!important;
}

html[data-auth-ready="app"] #app-topbar{
  height:64px!important;
  padding:0 .95rem!important;
  border-bottom:1px solid rgba(215,227,240,.88)!important;
  background:var(--erp-topbar-bg)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  box-shadow:0 10px 28px rgba(15,23,42,.065)!important;
}

html[data-auth-ready="app"] #app-topbar::after{
  height:3px!important;
  background:linear-gradient(90deg,#174f91 0%,#047857 38%,#b45309 72%,#6d28d9 100%)!important;
}

html[data-auth-ready="app"] #app-topbar :is(.icon-btn,.topbar-search-trigger,.company-pill){
  min-height:42px!important;
  border:1px solid rgba(215,227,240,.9)!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#fff 0%,#f8fbff 100%)!important;
  color:var(--erp-text)!important;
  box-shadow:0 4px 12px rgba(15,23,42,.045)!important;
}

html[data-auth-ready="app"] #app-topbar :is(.icon-btn,.topbar-search-trigger,.company-pill):hover{
  border-color:#b7cde5!important;
  color:var(--erp-blue)!important;
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(23,79,145,.11)!important;
}

html[data-auth-ready="app"] #app-topbar .topbar-search-trigger{
  min-width:min(24vw,17rem)!important;
  justify-content:flex-start!important;
  padding-inline:.78rem!important;
  color:var(--erp-muted)!important;
}

html[data-auth-ready="app"] #company-name{
  color:#10213a!important;
  font-family:var(--erp-font-display)!important;
  font-size:1.05rem!important;
  font-weight:950!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] .topbar-badge{
  min-width:1.1rem!important;
  height:1.1rem!important;
  border:2px solid #fff!important;
  background:#e11d48!important;
  color:#fff!important;
  font-size:.62rem!important;
  font-weight:950!important;
}

html[data-auth-ready="app"] #app-sidebar.sidebar-modern{
  background:
    linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,transparent 1px 100%),
    linear-gradient(180deg,#07172f 0%,#0a1d39 48%,#071427 100%)!important;
  background-size:42px 42px,100% 100%!important;
  border-right:1px solid rgba(148,163,184,.18)!important;
  box-shadow:12px 0 34px rgba(2,8,23,.25)!important;
}

html[data-auth-ready="app"] .sidebar-modern .sidebar-brand{
  border-radius:8px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.11),rgba(255,255,255,.055))!important;
  box-shadow:0 12px 26px rgba(2,8,23,.22)!important;
}

html[data-auth-ready="app"] .sidebar-modern .sidebar-search{
  border-radius:8px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.075)!important;
}

html[data-auth-ready="app"] .sidebar-modern :is(.nav-group-header,.nav-item){
  border-radius:8px!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] .sidebar-modern .nav-group-header{
  min-height:2.45rem!important;
  color:rgba(255,255,255,.72)!important;
}

html[data-auth-ready="app"] .sidebar-modern .nav-item{
  min-height:2.42rem!important;
  margin:.1rem .48rem!important;
  padding:.44rem .52rem!important;
  border:1px solid transparent!important;
  background:transparent!important;
  box-shadow:none!important;
  color:rgba(255,255,255,.82)!important;
}

html[data-auth-ready="app"] .sidebar-modern .nav-item:hover{
  background:rgba(255,255,255,.08)!important;
  border-color:rgba(255,255,255,.12)!important;
  color:#fff!important;
}

html[data-auth-ready="app"] .sidebar-modern .nav-item.active{
  background:linear-gradient(90deg,rgba(59,130,246,.32),rgba(20,184,166,.16))!important;
  border-color:rgba(147,197,253,.36)!important;
  color:#fff!important;
  box-shadow:0 10px 22px rgba(23,79,145,.24)!important;
}

html[data-auth-ready="app"] .sidebar-modern .nav-item .material-symbols-outlined,
html[data-auth-ready="app"] .sidebar-modern .nav-item > span:first-child{
  width:1.75rem!important;
  height:1.75rem!important;
  min-width:1.75rem!important;
  border-radius:7px!important;
}

html[data-auth-ready="app"] .sidebar-modern .nav-label{
  font-size:.76rem!important;
  font-weight:800!important;
  line-height:1.12!important;
}

html[data-auth-ready="app"] body[data-route] #app-content :is(.page-header,.module-header,.section-title-bar){
  position:relative!important;
  min-width:0!important;
  padding:1rem 1.1rem!important;
  margin:0 0 1rem!important;
  border:1px solid rgba(255,255,255,.22)!important;
  border-radius:8px!important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.075) 0 1px,transparent 1px 100%),
    linear-gradient(135deg,#071a3a 0%,#0b4c89 56%,#08796d 100%)!important;
  background-size:42px 42px,100% 100%!important;
  color:#fff!important;
  box-shadow:0 16px 36px rgba(7,26,58,.18)!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] body[data-route] #app-content :is(.page-header,.module-header) :is(h1,h2,.page-title,.module-title){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-family:var(--erp-font-display)!important;
  font-size:clamp(1.35rem,2vw,1.85rem)!important;
  font-weight:950!important;
  line-height:1.05!important;
  letter-spacing:0!important;
  margin:0!important;
  text-shadow:0 2px 14px rgba(0,0,0,.2)!important;
}

html[data-auth-ready="app"] body[data-route] #app-content :is(.page-header,.module-header) :is(p,.breadcrumb,.subtitle){
  color:rgba(255,255,255,.82)!important;
}

html[data-auth-ready="app"] body[data-route] #app-content :is(.page-header,.module-header) :is(.btn,.icon-btn,button){
  border-color:rgba(255,255,255,.22)!important;
}

html[data-auth-ready="app"] body[data-route] #app-content :is(.card,.panel,.section-card,.settings-section-card,.dashboard-focus-card,.filter-card,[class*="-card"]):not(.bimas-kpi):not([class*="kpi-card"]):not([class*="metric-card"]):not([class*="stat-card"]){
  border-radius:8px!important;
  border:1px solid var(--erp-soft-border)!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
  box-shadow:var(--erp-card-shadow)!important;
}

html[data-auth-ready="app"] body[data-route] #app-content :is(.card,.panel,.section-card,.settings-section-card,.dashboard-focus-card,[class*="-card"]):not(.bimas-kpi):not([class*="kpi-card"]):not([class*="metric-card"]):not([class*="stat-card"]):hover{
  box-shadow:var(--erp-card-shadow-hover)!important;
}

html[data-auth-ready="app"] #app-content :is(.section-header,.card-header,.panel-header,.table-header){
  min-width:0!important;
  gap:.62rem!important;
  padding-bottom:.72rem!important;
  margin-bottom:.85rem!important;
  border-bottom:1px solid rgba(215,227,240,.72)!important;
}

html[data-auth-ready="app"] #app-content :is(.section-header,.card-header,.panel-header,.table-header) :is(h2,h3,h4){
  color:var(--erp-text)!important;
  font-family:var(--erp-font-display)!important;
  font-size:clamp(.95rem,1.25vw,1.08rem)!important;
  font-weight:950!important;
  letter-spacing:0!important;
  line-height:1.12!important;
}

html[data-auth-ready="app"] #app-content .section-header > .material-symbols-outlined{
  width:2rem!important;
  height:2rem!important;
  min-width:2rem!important;
  display:grid!important;
  place-items:center!important;
  border-radius:7px!important;
  background:#eef6ff!important;
  color:var(--erp-blue)!important;
}

html[data-auth-ready="app"] :is(.btn,button.btn,.table-btn,.page-btn){
  min-height:2.35rem!important;
  border-radius:8px!important;
  font-family:var(--erp-font-display)!important;
  font-weight:850!important;
  letter-spacing:0!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease!important;
}

html[data-auth-ready="app"] :is(.btn,button.btn,.table-btn,.page-btn):hover{
  transform:translateY(-1px);
}

html[data-auth-ready="app"] :is(.btn-primary,.btn.btn-primary){
  border-color:#174f91!important;
  background:linear-gradient(135deg,#174f91,#0b5cab)!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(23,79,145,.2)!important;
}

html[data-auth-ready="app"] :is(.btn-secondary,.btn.btn-secondary,.btn-ghost,.btn.btn-ghost){
  border:1px solid var(--erp-soft-border)!important;
  background:linear-gradient(180deg,#fff,#f8fbff)!important;
  color:#12325a!important;
}

html[data-auth-ready="app"] :is(.btn-danger,.btn.btn-danger){
  border-color:#b91c1c!important;
  background:linear-gradient(135deg,#be123c,#991b1b)!important;
  color:#fff!important;
}

html[data-auth-ready="app"] #app-content :is(.form-input,.form-select,textarea,input:not([type="checkbox"]):not([type="radio"]),select){
  min-height:2.5rem!important;
  border-radius:8px!important;
  border:1px solid var(--erp-soft-border)!important;
  background:#fff!important;
  color:var(--erp-text)!important;
  box-shadow:0 1px 2px rgba(15,23,42,.035)!important;
}

html[data-auth-ready="app"] #app-content :is(.form-input,.form-select,textarea,input:not([type="checkbox"]):not([type="radio"]),select):focus{
  border-color:#174f91!important;
  box-shadow:0 0 0 3px var(--erp-focus)!important;
  outline:none!important;
}

html[data-auth-ready="app"] #app-content :is(.form-label,label){
  color:#263a56!important;
  font-size:.72rem!important;
  font-weight:850!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] #app-content :is(.filters,.filterbar,.filter-bar,.toolbar,.actionbar,.module-actions,.page-actions){
  gap:.55rem!important;
  align-items:center!important;
}

html[data-auth-ready="app"] #app-content :is(.filters,.filterbar,.filter-bar,.toolbar){
  padding:.65rem!important;
  border:1px solid var(--erp-soft-border)!important;
  border-radius:8px!important;
  background:rgba(255,255,255,.86)!important;
  box-shadow:0 8px 18px rgba(15,23,42,.045)!important;
}

html[data-auth-ready="app"] #app-content :is(.data-table-wrap,.table-wrap,.table-responsive){
  border:1px solid var(--erp-soft-border)!important;
  border-radius:8px!important;
  overflow:auto!important;
  background:#fff!important;
  box-shadow:var(--erp-card-shadow)!important;
}

html[data-auth-ready="app"] #app-content :is(table,.data-table,.data-table-premium){
  width:100%!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}

html[data-auth-ready="app"] #app-content :is(.data-table,.data-table-premium) thead tr,
html[data-auth-ready="app"] #app-content table thead tr{
  background:linear-gradient(180deg,#f7fbff,#eef5ff)!important;
}

html[data-auth-ready="app"] #app-content :is(.data-table,.data-table-premium,table) th{
  color:#334155!important;
  font-family:var(--erp-font-display)!important;
  font-size:.66rem!important;
  font-weight:950!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  border-bottom:1px solid var(--erp-soft-border)!important;
}

html[data-auth-ready="app"] #app-content :is(.data-table,.data-table-premium,table) td{
  color:#172033!important;
  border-bottom:1px solid #e8eef6!important;
}

html[data-auth-ready="app"] #app-content :is(.data-table,.data-table-premium,table) tbody tr:hover{
  background:#f4f9ff!important;
  transform:none!important;
}

html[data-auth-ready="app"] :is(.modal-content,#notification-center,.search-box){
  border-radius:8px!important;
  border:1px solid var(--erp-soft-border)!important;
  background:#fff!important;
  box-shadow:0 28px 80px rgba(15,23,42,.22)!important;
}

html[data-auth-ready="app"] #app-bottomnav{
  height:4.55rem!important;
  display:none;
  padding:.45rem .55rem calc(.45rem + env(safe-area-inset-bottom,0px))!important;
  border-top:1px solid rgba(215,227,240,.95)!important;
  background:rgba(255,255,255,.96)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  box-shadow:0 -14px 34px rgba(15,23,42,.12)!important;
}

html[data-auth-ready="app"] #app-bottomnav .bottomnav-item{
  min-width:0!important;
  height:3.55rem!important;
  border-radius:8px!important;
  color:#64748b!important;
  font-size:.68rem!important;
  font-weight:900!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] #app-bottomnav .bottomnav-item .material-symbols-outlined{
  font-size:1.35rem!important;
}

html[data-auth-ready="app"] #app-bottomnav .bottomnav-item.active{
  background:#eefdf5!important;
  color:#0f6b50!important;
}

@media (max-width:1024px){
  html[data-auth-ready="app"] #app-topbar .topbar-search-trigger{
    min-width:2.65rem!important;
    width:2.65rem!important;
    padding-inline:0!important;
    justify-content:center!important;
  }

  html[data-auth-ready="app"] #app-topbar .topbar-search-trigger > span:not(.material-symbols-outlined){
    display:none!important;
  }

  html[data-auth-ready="app"] #app-content{
    margin-left:0!important;
    padding:calc(64px + .85rem) .85rem calc(5.3rem + env(safe-area-inset-bottom,0px))!important;
  }

  html[data-auth-ready="app"] #app-sidebar.sidebar-modern{
    width:min(19rem,88vw)!important;
    z-index:220!important;
  }

  html[data-auth-ready="app"] #app-bottomnav{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
}

@media (max-width:700px){
  html[data-auth-ready="app"] #app-topbar{
    height:64px!important;
    padding:0 .55rem!important;
  }

  html[data-auth-ready="app"] #company-name{
    max-width:8.6rem!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:1rem!important;
  }

  html[data-auth-ready="app"] #company-logo-img,
  html[data-auth-ready="app"] #company-logo-fallback{
    width:2rem!important;
    height:2rem!important;
  }

  html[data-auth-ready="app"] #app-topbar :is(.icon-btn,.company-pill,.topbar-search-trigger){
    width:2.55rem!important;
    min-width:2.55rem!important;
    min-height:2.55rem!important;
    padding:0!important;
  }

  html[data-auth-ready="app"] #app-topbar :is(.company-pill span:not(.material-symbols-outlined),.topbar-portal-btn,#install-app-btn,#theme-btn){
    display:none!important;
  }

  html[data-auth-ready="app"] body[data-route] #app-content > .page-container{
    max-width:100%!important;
  }

  html[data-auth-ready="app"] body[data-route] #app-content :is(.page-header,.module-header,.section-title-bar){
    padding:.82rem .86rem!important;
    margin-bottom:.75rem!important;
  }

  html[data-auth-ready="app"] body[data-route] #app-content :is(.page-header,.module-header) :is(h1,h2,.page-title,.module-title){
    font-size:1.18rem!important;
    line-height:1.08!important;
  }

  html[data-auth-ready="app"] body[data-route] #app-content :is(.card,.panel,.section-card,.settings-section-card,.dashboard-focus-card,[class*="-card"]):not(.bimas-kpi):not([class*="kpi-card"]):not([class*="metric-card"]):not([class*="stat-card"]){
    padding:.82rem!important;
  }

  html[data-auth-ready="app"] #app-content :is(.filters,.filterbar,.filter-bar,.toolbar,.actionbar,.module-actions,.page-actions){
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:stretch!important;
  }

  html[data-auth-ready="app"] #app-content :is(.filters,.filterbar,.filter-bar,.toolbar,.actionbar,.module-actions,.page-actions) :is(.btn,button,.form-input,.form-select,select,input){
    flex:1 1 9rem!important;
    min-width:0!important;
  }

  html[data-auth-ready="app"] #app-content :is(.data-table-wrap,.table-wrap,.table-responsive){
    box-shadow:0 8px 20px rgba(15,23,42,.055)!important;
  }

  html[data-auth-ready="app"] #app-content :is(.data-table,.data-table-premium) tr{
    border-radius:8px!important;
    box-shadow:0 6px 16px rgba(15,23,42,.04)!important;
  }
}

/* Uploaded-screen module polish pass
   Keeps older inline modules aligned with the shared BIMAS KPI and shell system. */

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container,
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container,
html[data-auth-ready="app"] body[data-route="reports"] #app-content .page-container,
html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module,
html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-shell,
html[data-auth-ready="app"] body[data-route="users"] #app-content .usr-shell,
html[data-auth-ready="app"] body[data-route="portal-users"] #app-content .portal-shell,
html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-shell{
  max-width:1480px!important;
  margin-inline:auto!important;
  width:100%!important;
}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:first-child,
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:first-child,
html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-page-header,
html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-page-header,
html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-hero,
html[data-auth-ready="app"] body[data-route="users"] #app-content .usr-hero,
html[data-auth-ready="app"] body[data-route="portal-users"] #app-content .portal-hero,
html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-hero{
  border-radius:8px!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:0 16px 34px rgba(15,23,42,.14)!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:first-child{
  margin-bottom:.85rem!important;
  padding:1.05rem 1.12rem!important;
  background:linear-gradient(135deg,#047857 0%,#0f9f74 56%,#0b5cab 100%)!important;
}

html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:first-child{
  margin-bottom:.85rem!important;
  padding:1.05rem 1.12rem!important;
  background:linear-gradient(135deg,#312e81 0%,#4f46e5 56%,#0b5cab 100%)!important;
}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:first-child :is(h1,p,span),
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:first-child :is(h1,p,span),
html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-page-header :is(h1,p,span,.reports-eyebrow),
html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-hero :is(h1,p,span),
html[data-auth-ready="app"] body[data-route="users"] #app-content .usr-hero :is(h1,p,span),
html[data-auth-ready="app"] body[data-route="portal-users"] #app-content .portal-hero :is(h1,p,span),
html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-hero :is(h1,p,span,strong){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2),
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3){
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:.62rem!important;
  margin:.75rem 0 1rem!important;
  width:100%!important;
}

html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3){
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div,
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div{
  --erp-kpi-tone:var(--erp-blue);
  position:relative!important;
  min-width:0!important;
  min-height:72px!important;
  height:72px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:.08rem!important;
  padding:.58rem .72rem!important;
  border:1px solid var(--erp-border)!important;
  border-top:3px solid var(--erp-kpi-tone)!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
  color:#000!important;
  box-shadow:var(--erp-shadow)!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div:nth-child(2),
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div:nth-child(2){--erp-kpi-tone:#047857;}
html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div:nth-child(3),
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div:nth-child(3){--erp-kpi-tone:#0369a1;}
html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div:nth-child(4),
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div:nth-child(4){--erp-kpi-tone:#6d28d9;}
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div:nth-child(5){--erp-kpi-tone:#be123c;}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div::after,
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div::after{
  content:""!important;
  position:absolute!important;
  top:-2.2rem!important;
  right:-1.4rem!important;
  width:5.3rem!important;
  height:5.3rem!important;
  border-radius:999px!important;
  background:var(--erp-kpi-tone)!important;
  opacity:.07!important;
}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div > div:first-child,
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div > div:first-child{
  position:relative!important;
  z-index:1!important;
  color:#000!important;
  font-family:var(--erp-font-display)!important;
  font-size:1.02rem!important;
  font-weight:950!important;
  line-height:1.04!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div > div:last-child,
html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div > div:last-child{
  position:relative!important;
  z-index:1!important;
  color:#475569!important;
  font-size:.54rem!important;
  font-weight:900!important;
  line-height:1.08!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > .card:nth-child(2){
  margin-bottom:.85rem!important;
  padding:.78rem!important;
}

html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > .card:nth-child(2) .card-body{
  padding:0!important;
}

html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > .card:nth-child(2) .card-body > div:first-child{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:.72rem!important;
}

html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > .card:nth-child(2) .card-body > div:last-child{
  gap:.62rem!important;
  margin-top:.7rem!important;
}

html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-header-main{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:1rem!important;
  align-items:end!important;
}

html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpis{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:.58rem!important;
  margin-block:.72rem 1rem!important;
}

html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi{
  min-height:76px!important;
  height:76px!important;
  padding:.52rem .62rem!important;
  gap:.5rem!important;
}

html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-icon{
  width:1.82rem!important;
  height:1.82rem!important;
  min-width:1.82rem!important;
}

html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-value{
  color:#000!important;
  font-size:.78rem!important;
  font-weight:950!important;
  line-height:1.05!important;
}

html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-label{
  color:#000!important;
  font-size:.48rem!important;
  font-weight:950!important;
  line-height:1.06!important;
}

html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-sub{
  color:#475569!important;
  font-size:.43rem!important;
  font-weight:850!important;
  line-height:1.06!important;
}

html[data-auth-ready="app"] body[data-route="reports"] #app-content :is(.reports-source-grid,.reports-tabs,.reports-filter-grid){
  gap:.62rem!important;
}

html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-grid{
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  gap:.5rem!important;
  margin-bottom:.95rem!important;
}

html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-card{
  min-height:70px!important;
  height:70px!important;
  padding:.46rem .56rem!important;
}

html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module > .animate-in.d3 > .card:first-child{
  background:linear-gradient(135deg,#08235d 0%,#0b5cab 62%,#047857 100%)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.18)!important;
  box-shadow:0 16px 34px rgba(15,23,42,.14)!important;
}

html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module > .animate-in.d3 > .card:first-child :is(h2,p,span){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
}

html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module > .animate-in.d3 > .card:first-child p[style*="color"]{
  color:#dff7ff!important;
  -webkit-text-fill-color:#dff7ff!important;
}

html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module > .animate-in.d3 > .card:first-child p[style*="#4ade80"]{
  color:#4ade80!important;
  -webkit-text-fill-color:#4ade80!important;
}

html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module > .animate-in.d3 > div[style*="grid-template-columns:1fr 1fr"]{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:1rem!important;
}

html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-kpis{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:.58rem!important;
}

html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-kpi{
  min-height:76px!important;
  height:76px!important;
  padding:.52rem .64rem!important;
}

html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-approval-grid{
  grid-template-columns:repeat(3,minmax(16rem,1fr))!important;
  gap:.82rem!important;
}

html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-card{
  min-height:14.4rem!important;
  display:flex!important;
  flex-direction:column!important;
}

html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-card > div:last-child{
  margin-top:auto!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(18rem,.34fr)!important;
  gap:.92rem!important;
  align-items:start!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-kpi-grid,
html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-policy-strip{
  gap:.58rem!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-table-wrap{
  width:100%!important;
  overflow:auto!important;
  border-radius:8px!important;
  border:1px solid var(--erp-border)!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-table{
  min-width:980px!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-table :is(th,td){
  vertical-align:middle!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-user-cell{
  display:flex!important;
  align-items:center!important;
  gap:.62rem!important;
  min-width:13rem!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-user-cell > span{
  width:2.15rem!important;
  height:2.15rem!important;
  min-width:2.15rem!important;
  display:grid!important;
  place-items:center!important;
  border-radius:999px!important;
  background:#0b5cab!important;
  color:#fff!important;
  font-weight:950!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-user-cell > div{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:.1rem!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-user-cell strong{
  display:block!important;
  color:#071529!important;
  font-size:.78rem!important;
  font-weight:950!important;
  line-height:1.12!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-user-cell small,
html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-cell-sub{
  display:block!important;
  color:#64748b!important;
  font-size:.66rem!important;
  font-weight:800!important;
  line-height:1.18!important;
}

html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-kpi-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:.58rem!important;
  margin-block:.65rem .95rem!important;
  padding:.05rem!important;
  overflow:visible!important;
}

html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-metric-card{
  min-height:76px!important;
  height:76px!important;
  padding:.52rem .64rem!important;
  gap:.54rem!important;
}

html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-metric-card .bimas-kpi-icon{
  width:1.82rem!important;
  height:1.82rem!important;
  min-width:1.82rem!important;
  flex:0 0 1.82rem!important;
  margin:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell .ceo-brief-card{
  background:rgba(255,255,255,.16)!important;
  border:1px solid rgba(255,255,255,.24)!important;
  color:#fff!important;
}

@media (max-width:1180px){
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-approval-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpis{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

@media (max-width:900px){
  html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-layout,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module > .animate-in.d3 > div[style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr!important;
  }

  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-header-main{
    grid-template-columns:1fr!important;
    align-items:start!important;
  }

  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-header-actions{
    justify-content:flex-start!important;
  }
}

@media (max-width:700px){
  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2),
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3),
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpis,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-grid,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-kpis,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-kpi-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:.42rem!important;
  }

  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div,
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-card,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-kpi,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-metric-card{
    min-height:70px!important;
    height:70px!important;
    padding:.38rem .34rem!important;
    gap:.32rem!important;
  }

  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div > div:first-child,
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div > div:first-child,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-value,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-value{
    font-size:.56rem!important;
  }

  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div > div:last-child,
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div > div:last-child,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content :is(.reports-hub-kpi-label,.reports-hub-kpi-sub),
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content :is(.accounts-kpi-label,.accounts-kpi-sub){
    font-size:.34rem!important;
    line-height:1.05!important;
  }

  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:first-child,
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:first-child,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-page-header,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-page-header,
  html[data-auth-ready="app"] body[data-route="security-center"] #app-content .sec-hero,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-hero{
    padding:.82rem!important;
    margin-bottom:.72rem!important;
  }

  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > .card:nth-child(2) .card-body > div:first-child{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:.52rem!important;
  }

  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-approval-grid{
    grid-template-columns:1fr!important;
  }
}

/* Absolute final mobile KPI contract. This intentionally beats legacy
   #app-content .page-container selectors from older module skins. */
@media (max-width:700px){
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .page-container .ceo-shell .ceo-kpi-grid,
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell .ceo-kpi-grid,
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .page-container .ceo-shell .ceo-report-grid,
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell .ceo-report-grid,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .page-container .pfi-kpi-grid,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-kpi-grid,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .page-container .reports-hub-kpis,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpis,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module .accounts-kpi-grid,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-grid,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-shell .ops-kpis,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-kpis,
  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2),
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3){
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:.42rem!important;
    width:100%!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .page-container .ceo-shell :is(.ceo-kpi,.ceo-report),
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell :is(.ceo-kpi,.ceo-report),
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .page-container .pfi-metric-card,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-metric-card,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .page-container .reports-hub-kpi,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module .accounts-kpi-card,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-card,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-shell .ops-kpi,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-kpi,
  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content .page-container > div:nth-child(2) > div,
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content .page-container > div:nth-child(3) > div{
    min-width:0!important;
    min-height:70px!important;
    height:70px!important;
    padding:.38rem .34rem!important;
    gap:.32rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .page-container .ceo-shell :is(.ceo-kpi-icon,.ceo-report i),
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell :is(.ceo-kpi-icon,.ceo-report i),
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .page-container .pfi-metric-card .bimas-kpi-icon,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-metric-card .bimas-kpi-icon,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .page-container .reports-hub-kpi-icon,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-icon,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module .accounts-kpi-icon,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-icon,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-shell .ops-kpi .icon,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content .ops-kpi .icon{
    width:1.42rem!important;
    height:1.42rem!important;
    min-width:1.42rem!important;
    flex:0 0 1.42rem!important;
    border-radius:6px!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .page-container .ceo-shell :is(.ceo-kpi-label,.ceo-report-copy strong),
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell :is(.ceo-kpi-label,.ceo-report-copy strong),
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .page-container .pfi-metric-card .bimas-kpi-label,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-metric-card .bimas-kpi-label,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .page-container .reports-hub-kpi-label,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-label,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module .accounts-kpi-label,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-label{
    font-size:.38rem!important;
    line-height:1.05!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .page-container .ceo-shell .ceo-kpi-value,
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell .ceo-kpi-value,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .page-container .pfi-metric-card .bimas-kpi-value,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-metric-card .bimas-kpi-value,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .page-container .reports-hub-kpi-value,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-value,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module .accounts-kpi-value,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-value{
    font-size:.56rem!important;
    line-height:1.05!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .page-container .ceo-shell :is(.ceo-kpi-sub,.ceo-report-copy span),
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell :is(.ceo-kpi-sub,.ceo-report-copy span),
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .page-container .pfi-metric-card .bimas-kpi-sub,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content .pfi-metric-card .bimas-kpi-sub,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .page-container .reports-hub-kpi-sub,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content .reports-hub-kpi-sub,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-module .accounts-kpi-sub,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content .accounts-kpi-sub{
    font-size:.34rem!important;
    line-height:1.05!important;
  }
}

@media (max-width:700px){
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-kpi-grid,
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell .ceo-report-grid,
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-kpi-grid,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content#app-content .page-container .reports-hub-kpis,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content#app-content .accounts-module .accounts-kpi-grid,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content#app-content .page-container .accounts-kpi-grid,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content#app-content .ops-shell .ops-kpis,
  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content#app-content .page-container > div:nth-child(2),
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content#app-content .page-container > div:nth-child(3){
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:.42rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content#app-content .page-container .ceo-shell :is(.ceo-kpi,.ceo-report),
  html[data-auth-ready="app"] body[data-route="pfi"] #app-content#app-content .page-container .pfi-metric-card,
  html[data-auth-ready="app"] body[data-route="reports"] #app-content#app-content .page-container .reports-hub-kpi,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content#app-content .accounts-module .accounts-kpi-card,
  html[data-auth-ready="app"] body[data-route="accounts"] #app-content#app-content .page-container .accounts-kpi-card,
  html[data-auth-ready="app"] body[data-route="operations-center"] #app-content#app-content .ops-shell .ops-kpi,
  html[data-auth-ready="app"] body[data-route="backup-recovery"] #app-content#app-content .page-container > div:nth-child(2) > div,
  html[data-auth-ready="app"] body[data-route="audit-trail"] #app-content#app-content .page-container > div:nth-child(3) > div{
    min-height:70px!important;
    height:70px!important;
    padding:.38rem .34rem!important;
    gap:.32rem!important;
  }
}

/* BIMAS UI polish layer — canonical button contract (Jun 2026) */
html[data-auth-ready="app"] #app-content .btn {
  border-radius: var(--r-lg, 0.75rem);
  font-weight: 600;
  letter-spacing: -0.005em;
}

html[data-auth-ready="app"] #app-content .btn-primary {
  background: linear-gradient(135deg, var(--brand-blue, #0057ff), var(--brand-blue-mid, #0036b3));
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(0, 87, 255, 0.24);
}

html[data-auth-ready="app"] #app-content .btn-secondary {
  background: var(--surface-0, #fff);
  color: var(--text-primary);
  border: 1.5px solid var(--border, #e2e6f0);
}

html[data-auth-ready="app"] #app-content .btn:focus-visible,
html[data-auth-ready="app"] #app-topbar .icon-btn:focus-visible,
html[data-auth-ready="app"] #app-sidebar .nav-item:focus-visible {
  outline: 2px solid var(--brand-blue, #0057ff);
  outline-offset: 2px;
}