/* BIMAS final KPI normalization layer. Loaded after styles.css. */
html[data-auth-ready="app"] #app-content :is([class*="kpi-grid"],[class*="kpis"],[class*="metric-grid"]){
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:.78rem!important;
  align-items:stretch!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi){
  --erp-kpi-tone:var(--bimas-kpi-accent,var(--fgs-tone,var(--dn-tone,var(--drn-tone,var(--sof-tone,var(--kpi-icon-color,var(--tone,#174f91)))))));
  position:relative!important;
  min-width:0!important;
  min-height:88px!important;
  display:grid!important;
  grid-template-columns:2.35rem minmax(0,1fr)!important;
  grid-template-rows:auto auto auto!important;
  align-content:center!important;
  align-items:center!important;
  gap:.08rem .66rem!important;
  padding:.64rem .72rem!important;
  border:1px solid #dbe6f2!important;
  border-top:3px solid var(--erp-kpi-tone)!important;
  border-left:1px solid #dbe6f2!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#000!important;
  overflow:hidden!important;
  box-shadow:0 8px 18px rgba(15,23,42,.055)!important;
  transform:none!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi)::before{
  display:none!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi)::after{
  content:""!important;
  position:absolute!important;
  top:-1.95rem!important;
  right:-1.35rem!important;
  width:5rem!important;
  height:5rem!important;
  border-radius:999px!important;
  background:var(--erp-kpi-tone)!important;
  opacity:.08!important;
  pointer-events:none!important;
  transform:none!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi) :is([class*="kpi-icon"],[class*="metric-icon"],.kicon,.icon,.reports-hub-kpi-icon,.reports-report-kpi-icon,.sales-perf-kpi-icon,.prod-dash-kpi-icon,.bimas-kpi-icon),
html[data-auth-ready="app"] #app-content :is([class*="kpi-icon"],[class*="metric-icon"],.notifications-kpi-icon).material-symbols-outlined{
  grid-column:1!important;
  grid-row:1 / span 3!important;
  width:2.35rem!important;
  height:2.35rem!important;
  min-width:2.35rem!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  border-radius:7px!important;
  background:var(--erp-kpi-tone)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-style:normal!important;
  font-size:1.08rem!important;
  line-height:1!important;
  box-shadow:0 9px 16px color-mix(in srgb,var(--erp-kpi-tone) 24%,transparent)!important;
  z-index:1!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi) :is([class*="kpi-icon"],[class*="metric-icon"],.kicon,.icon,.reports-hub-kpi-icon,.reports-report-kpi-icon,.sales-perf-kpi-icon,.prod-dash-kpi-icon,.bimas-kpi-icon) .material-symbols-outlined{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:1.08rem!important;
  line-height:1!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi) :is([class*="kpi-copy"],[class*="metric-copy"],[class*="kpi-main"],[class*="kpi-body"]){
  grid-column:2!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:.12rem!important;
  z-index:1!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi) :is([class*="kpi-label"],[class*="metric-label"],.kpi-label,.label,small){
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  color:#000!important;
  font-size:.58rem!important;
  font-weight:950!important;
  line-height:1.12!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-shadow:none!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi) :is([class*="kpi-value"],[class*="metric-value"],.kpi-value,.value,strong){
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  color:#000!important;
  font-family:var(--font-display)!important;
  font-size:1.05rem!important;
  font-weight:950!important;
  line-height:1.08!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-shadow:none!important;
}

html[data-auth-ready="app"] #app-content :is([class*="kpi-card"],[class*="metric-card"],.kpi-card,.bimas-kpi,.ops-kpi,.dash-kpi,.ceo-kpi,.reports-hub-kpi,.reports-report-kpi,.sales-perf-kpi,.prod-dash-kpi) :is([class*="kpi-sub"],[class*="metric-sub"],.kpi-sub,.sub,em){
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  color:#000!important;
  font-size:.54rem!important;
  font-style:normal!important;
  font-weight:900!important;
  line-height:1.12!important;
  letter-spacing:0!important;
  opacity:.8!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-shadow:none!important;
}

@media (max-width:1180px){
  html[data-auth-ready="app"] #app-content :is([class*="kpi-grid"],[class*="kpis"],[class*="metric-grid"]){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (max-width:640px){
  html[data-auth-ready="app"] #app-content :is([class*="kpi-grid"],[class*="kpis"],[class*="metric-grid"]){
    grid-template-columns:1fr!important;
  }
}

/* FGS needs six compact cards on desktop, with copy kept readable. */
html[data-auth-ready="app"] body[data-route="fgs"] #app-content .fgs-kpi-grid,
html[data-auth-ready="app"] #app-content .fgs-kpi-grid,
body[data-route="fgs"] #app-content .fgs-kpi-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:.72rem!important;
  align-items:stretch!important;
  margin-bottom:1.2rem!important;
  width:100%!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-card,
body[data-route="fgs"] #app-content .fgs-metric-card{
  --erp-kpi-tone:var(--fgs-tone,#174f91)!important;
  min-height:78px!important;
  display:grid!important;
  grid-template-columns:2.25rem minmax(0,1fr)!important;
  grid-template-rows:auto auto auto!important;
  align-content:center!important;
  align-items:center!important;
  column-gap:.68rem!important;
  row-gap:.04rem!important;
  padding:.62rem .72rem!important;
  border:1px solid #d7e4f2!important;
  border-top:3px solid var(--erp-kpi-tone)!important;
  border-left:1px solid #d7e4f2!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#000!important;
  box-shadow:0 8px 18px rgba(15,23,42,.06)!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-card::before,
body[data-route="fgs"] #app-content .fgs-metric-card::before{
  display:none!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-card::after,
body[data-route="fgs"] #app-content .fgs-metric-card::after{
  content:""!important;
  position:absolute!important;
  top:-1.75rem!important;
  right:-1.1rem!important;
  width:4.7rem!important;
  height:4.7rem!important;
  border-radius:999px!important;
  background:var(--erp-kpi-tone)!important;
  opacity:.065!important;
  pointer-events:none!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-icon,
body[data-route="fgs"] #app-content .fgs-metric-icon{
  grid-column:1!important;
  grid-row:1 / span 3!important;
  width:2.25rem!important;
  height:2.25rem!important;
  min-width:2.25rem!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  border-radius:7px!important;
  background:var(--erp-kpi-tone)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:1.05rem!important;
  line-height:1!important;
  box-shadow:0 9px 16px color-mix(in srgb,var(--erp-kpi-tone) 23%,transparent)!important;
  z-index:1!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-copy,
body[data-route="fgs"] #app-content .fgs-metric-copy{
  grid-column:2!important;
  grid-row:1 / span 3!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:.08rem!important;
  z-index:1!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-label,
html[data-auth-ready="app"] #app-content .fgs-metric-value,
html[data-auth-ready="app"] #app-content .fgs-metric-sub,
body[data-route="fgs"] #app-content .fgs-metric-label,
body[data-route="fgs"] #app-content .fgs-metric-value,
body[data-route="fgs"] #app-content .fgs-metric-sub{
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  color:#000!important;
  letter-spacing:0!important;
  text-shadow:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-label,
body[data-route="fgs"] #app-content .fgs-metric-label{
  font-size:.58rem!important;
  font-weight:950!important;
  line-height:1.12!important;
  text-transform:uppercase!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-value,
body[data-route="fgs"] #app-content .fgs-metric-value{
  font-family:var(--font-display)!important;
  font-size:1.12rem!important;
  font-weight:950!important;
  line-height:1.05!important;
}

html[data-auth-ready="app"] #app-content .fgs-metric-sub,
body[data-route="fgs"] #app-content .fgs-metric-sub{
  font-size:.55rem!important;
  font-weight:900!important;
  line-height:1.12!important;
  opacity:.82!important;
}

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

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

/* ERP-wide KPI system standard. Keep this final so every module inherits one visual language. */
html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-grid,
  .bimas-auto-kpi-strip,
  .dashboard-kpis,
  .dashboard-metric-grid,
  .production-stat-grid,
  .sof-kpi-grid,
  .pfi-kpi-grid,
  .cust-kpi-grid,
  .customers-kpi-grid,
  .inv-overview-kpis,
  .wip-kpi-grid,
  .fgs-kpi-grid,
  .fleet-kpi-grid,
  .drn-kpi-grid,
  .dn-kpi-grid,
  .voucher-kpi-grid,
  .reports-hub-kpis,
  .reports-report-kpis,
  .sales-perf-kpis,
  [class*="-kpi-grid"],
  [class*="-metric-grid"],
  [class*="-stats-grid"],
  [class*="-kpis"]
){
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:.78rem!important;
  align-items:stretch!important;
  width:100%!important;
  margin:0 0 1.2rem!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,
  .dashboard-metric-card,
  .sof-kpi-card,
  .pfi-metric-card,
  .cust-kpi-card,
  .customers-kpi-card,
  .inv-overview-metric-card,
  .wip-metric-card,
  .fgs-metric-card,
  .fleet-kpi-card,
  .drn-kpi-card,
  .dn-kpi-card,
  .voucher-kpi-card,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .prod-dash-kpi,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
){
  --erp-kpi-tone:var(--bimas-kpi-accent,var(--fgs-tone,var(--dn-tone,var(--drn-tone,var(--voucher-tone,var(--sof-tone,var(--kpi-icon-color,var(--tone,#174f91))))))));
  position:relative!important;
  min-width:0!important;
  min-height:84px!important;
  display:grid!important;
  grid-template-columns:2.35rem minmax(0,1fr)!important;
  grid-template-rows:auto auto auto!important;
  align-content:center!important;
  align-items:center!important;
  gap:.08rem .68rem!important;
  padding:.66rem .76rem!important;
  border:1px solid #d9e5f2!important;
  border-top:3px solid var(--erp-kpi-tone)!important;
  border-left:1px solid #d9e5f2!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#000!important;
  overflow:hidden!important;
  box-shadow:0 9px 20px rgba(15,23,42,.06)!important;
  transform:none!important;
  font-family:var(--font-body,Inter,Arial,sans-serif)!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,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
)::before{
  display: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,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
)::after{
  content:""!important;
  position:absolute!important;
  top:-1.85rem!important;
  right:-1.25rem!important;
  width:4.9rem!important;
  height:4.9rem!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"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .dash-kpi,
  .ceo-kpi,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(
  .bimas-kpi-icon,
  .kpi-icon,
  .metric-icon,
  .stat-icon,
  .kicon,
  [class*="-kpi-icon"],
  [class*="-metric-icon"],
  [class*="-stat-icon"]
),
html[data-auth-ready="app"] #app-content :is(.bimas-kpi-icon,.kpi-icon,.metric-icon,.stat-icon,[class*="-kpi-icon"],[class*="-metric-icon"],[class*="-stat-icon"]).material-symbols-outlined{
  grid-column:1!important;
  grid-row:1 / span 3!important;
  width:2.35rem!important;
  height:2.35rem!important;
  min-width:2.35rem!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  border-radius:7px!important;
  background:var(--erp-kpi-tone)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:1.08rem!important;
  line-height:1!important;
  box-shadow:0 9px 16px color-mix(in srgb,var(--erp-kpi-tone) 24%,transparent)!important;
  z-index:1!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,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(.material-symbols-outlined){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:1.08rem!important;
  line-height:1!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,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(
  .bimas-kpi-body,
  .bimas-kpi-copy,
  .kpi-copy,
  .kpi-body,
  .metric-copy,
  .metric-body,
  [class*="-kpi-copy"],
  [class*="-metric-copy"]
){
  grid-column:2!important;
  grid-row:1 / span 3!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:.1rem!important;
  z-index:1!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,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(
  .bimas-kpi-label,
  .kpi-label,
  .metric-label,
  .stat-label,
  [class*="-kpi-label"],
  [class*="-metric-label"],
  [class*="-stat-label"],
  small:first-child
){
  color:#000!important;
  font-family:var(--font-body,Inter,Arial,sans-serif)!important;
  font-size:.58rem!important;
  font-weight:950!important;
  line-height:1.12!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  margin:0!important;
  padding:0!important;
  opacity:1!important;
  text-shadow: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,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(
  .bimas-kpi-value,
  .kpi-value,
  .metric-value,
  .stat-value,
  [class*="-kpi-value"],
  [class*="-metric-value"],
  [class*="-stat-value"],
  strong
){
  color:#000!important;
  font-family:var(--font-display,"Plus Jakarta Sans",Inter,Arial,sans-serif)!important;
  font-size:1.12rem!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;
  margin:0!important;
  padding:0!important;
  opacity:1!important;
  text-shadow: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,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(
  .bimas-kpi-sub,
  .kpi-sub,
  .metric-sub,
  .stat-sub,
  [class*="-kpi-sub"],
  [class*="-metric-sub"],
  [class*="-stat-sub"],
  small:not(:first-child)
){
  color:#000!important;
  font-family:var(--font-body,Inter,Arial,sans-serif)!important;
  font-size:.55rem!important;
  font-weight:900!important;
  line-height:1.12!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  margin:0!important;
  padding:0!important;
  opacity:.82!important;
  text-shadow:none!important;
}

html[data-auth-ready="app"] #app-content .bimas-auto-kpi-strip{
  margin-top:.25rem!important;
}

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

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

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

/* Compact executive KPI pass: one-line desktop strips, no yellow KPI accents. */
html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-grid,
  .bimas-auto-kpi-strip,
  .dashboard-kpis,
  .dashboard-metric-grid,
  .accounts-kpi-grid,
  .production-stat-grid,
  .sof-kpi-grid,
  .pfi-kpi-grid,
  .cust-kpi-grid,
  .customers-kpi-grid,
  .inv-overview-kpis,
  .wip-kpi-grid,
  .fgs-kpi-grid,
  .fleet-kpi-grid,
  .drn-kpi-grid,
  .dn-kpi-grid,
  .voucher-kpi-grid,
  .reports-hub-kpis,
  .reports-report-kpis,
  .sales-perf-kpis,
  [class*="-kpi-grid"],
  [class*="-metric-grid"],
  [class*="-stats-grid"],
  [class*="-kpis"]
){
  grid-template-columns:repeat(auto-fit,minmax(7.75rem,1fr))!important;
  gap:.55rem!important;
  margin:0 0 1rem!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  .dash-kpi,
  .ceo-kpi,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
){
  min-height:68px!important;
  grid-template-columns:2rem minmax(0,1fr)!important;
  gap:.04rem .5rem!important;
  padding:.5rem .58rem!important;
  border-top-width:3px!important;
  box-shadow:0 6px 14px rgba(15,23,42,.052)!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(7n+1){
  --bimas-kpi-accent:#174f91!important;
  --erp-kpi-tone:#174f91!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(7n+2){
  --bimas-kpi-accent:#047857!important;
  --erp-kpi-tone:#047857!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(7n+3){
  --bimas-kpi-accent:#0369a1!important;
  --erp-kpi-tone:#0369a1!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(7n+4){
  --bimas-kpi-accent:#4f46e5!important;
  --erp-kpi-tone:#4f46e5!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(7n+5){
  --bimas-kpi-accent:#0f766e!important;
  --erp-kpi-tone:#0f766e!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(7n+6){
  --bimas-kpi-accent:#4338ca!important;
  --erp-kpi-tone:#4338ca!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(7n){
  --bimas-kpi-accent:#334155!important;
  --erp-kpi-tone:#334155!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
)::after{
  top:-1.45rem!important;
  right:-1rem!important;
  width:4rem!important;
  height:4rem!important;
  opacity:.055!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(
  .bimas-kpi-icon,
  .kpi-icon,
  .accounts-kpi-icon,
  .metric-icon,
  .stat-icon,
  .kicon,
  [class*="-kpi-icon"],
  [class*="-metric-icon"],
  [class*="-stat-icon"]
),
html[data-auth-ready="app"] #app-content :is(.bimas-kpi-icon,.kpi-icon,.accounts-kpi-icon,.metric-icon,.stat-icon,[class*="-kpi-icon"],[class*="-metric-icon"],[class*="-stat-icon"]).material-symbols-outlined{
  width:2rem!important;
  height:2rem!important;
  min-width:2rem!important;
  border-radius:7px!important;
  font-size:.98rem!important;
  box-shadow:0 7px 12px color-mix(in srgb,var(--erp-kpi-tone) 20%,transparent)!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(.material-symbols-outlined){
  display:grid!important;
  place-items:center!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:.98rem!important;
  line-height:1!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
}

html[data-auth-ready="app"] #app-content :is(.accounts-kpi-card,.kpi-card,.bimas-kpi) :is(.accounts-kpi-value,.kpi-value,.bimas-kpi-value,[class*="-kpi-value"],strong){
  font-size:.98rem!important;
}

html[data-auth-ready="app"] #app-content :is(.accounts-kpi-card,.kpi-card,.bimas-kpi) :is(.accounts-kpi-label,.kpi-label,.bimas-kpi-label,[class*="-kpi-label"]){
  font-size:.52rem!important;
}

html[data-auth-ready="app"] #app-content :is(.accounts-kpi-card,.kpi-card,.bimas-kpi) :is(.accounts-kpi-sub,.kpi-sub,.bimas-kpi-sub,[class*="-kpi-sub"]){
  font-size:.5rem!important;
}

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

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

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

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

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

/* Executive KPI finish: refined, readable, compact, and free of yellow/orange card accents. */
html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi-grid,
  .bimas-auto-kpi-strip,
  .dashboard-kpis,
  .dashboard-metric-grid,
  .accounts-kpi-grid,
  .production-stat-grid,
  .sof-kpi-grid,
  .pfi-kpi-grid,
  .cust-kpi-grid,
  .customers-kpi-grid,
  .inv-overview-kpis,
  .wip-kpi-grid,
  .fgs-kpi-grid,
  .fleet-kpi-grid,
  .drn-kpi-grid,
  .dn-kpi-grid,
  .voucher-kpi-grid,
  .reports-hub-kpis,
  .reports-report-kpis,
  .sales-perf-kpis,
  [class*="-kpi-grid"],
  [class*="-metric-grid"],
  [class*="-stats-grid"],
  [class*="-kpis"]
){
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(8.8rem,1fr))!important;
  gap:.68rem!important;
  align-items:stretch!important;
  width:100%!important;
  margin:0 0 1.15rem!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  .dash-kpi,
  .ceo-kpi,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
){
  min-height:76px!important;
  display:grid!important;
  grid-template-columns:2.12rem minmax(0,1fr)!important;
  grid-template-rows:auto auto auto!important;
  align-content:center!important;
  align-items:center!important;
  gap:.08rem .62rem!important;
  padding:.58rem .68rem .58rem .78rem!important;
  border:1px solid #dfe7f1!important;
  border-top:1px solid #dfe7f1!important;
  border-left:1px solid #dfe7f1!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#fff 0%,#f8fbff 100%)!important;
  color:#000!important;
  box-shadow:0 7px 16px rgba(15,23,42,.055)!important;
  overflow:hidden!important;
  transform:none!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(8n+1){
  --bimas-kpi-accent:#174f91!important;
  --erp-kpi-tone:#174f91!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(8n+2){
  --bimas-kpi-accent:#047857!important;
  --erp-kpi-tone:#047857!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(8n+3){
  --bimas-kpi-accent:#0369a1!important;
  --erp-kpi-tone:#0369a1!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(8n+4){
  --bimas-kpi-accent:#4f46e5!important;
  --erp-kpi-tone:#4f46e5!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(8n+5){
  --bimas-kpi-accent:#0f766e!important;
  --erp-kpi-tone:#0f766e!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(8n+6){
  --bimas-kpi-accent:#4338ca!important;
  --erp-kpi-tone:#4338ca!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(8n+7){
  --bimas-kpi-accent:#155e75!important;
  --erp-kpi-tone:#155e75!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],[class*="-kpis"]) > :is(.bimas-kpi,.kpi-card,.stats-card,.stat-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]):nth-child(8n){
  --bimas-kpi-accent:#334155!important;
  --erp-kpi-tone:#334155!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  .dash-kpi,
  .ceo-kpi,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
)::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:0!important;
  top:.58rem!important;
  bottom:.58rem!important;
  width:3px!important;
  border-radius:0 999px 999px 0!important;
  background:var(--erp-kpi-tone)!important;
  opacity:.95!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  .dash-kpi,
  .ceo-kpi,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
)::after{
  display:none!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  .dash-kpi,
  .ceo-kpi,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(
  .bimas-kpi-icon,
  .kpi-icon,
  .accounts-kpi-icon,
  .metric-icon,
  .stat-icon,
  .kicon,
  [class*="-kpi-icon"],
  [class*="-metric-icon"],
  [class*="-stat-icon"]
),
html[data-auth-ready="app"] #app-content :is(.bimas-kpi-icon,.kpi-icon,.accounts-kpi-icon,.metric-icon,.stat-icon,.kicon,[class*="-kpi-icon"],[class*="-metric-icon"],[class*="-stat-icon"]).material-symbols-outlined{
  grid-column:1!important;
  grid-row:1 / span 3!important;
  width:2.12rem!important;
  height:2.12rem!important;
  min-width:2.12rem!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) 78%,#0f172a))!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:1rem!important;
  line-height:1!important;
  box-shadow:0 7px 14px color-mix(in srgb,var(--erp-kpi-tone) 18%,transparent)!important;
  z-index:1!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  .dash-kpi,
  .ceo-kpi,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(.kpi-icon,.accounts-kpi-icon,[class*="-kpi-icon"],[class*="-metric-icon"],[class*="-stat-icon"]) > .material-symbols-outlined{
  display:block!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:1rem!important;
  line-height:1!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

html[data-auth-ready="app"] #app-content :is(
  .bimas-kpi,
  .bimas-auto-kpi-card,
  .kpi-card,
  .stats-card,
  .stat-card,
  .accounts-kpi-card,
  .dash-kpi,
  .ceo-kpi,
  .dashboard-metric-card,
  [class*="-kpi-card"],
  [class*="-metric-card"],
  [class*="-stat-card"]
) :is(
  .bimas-kpi-body,
  .bimas-kpi-copy,
  .kpi-copy,
  .kpi-body,
  .metric-copy,
  .metric-body,
  [class*="-kpi-copy"],
  [class*="-metric-copy"]
){
  grid-column:2!important;
  grid-row:1 / span 3!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:.08rem!important;
  min-width:0!important;
  z-index:1!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi,.bimas-auto-kpi-card,.kpi-card,.stats-card,.stat-card,.accounts-kpi-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]) :is(.bimas-kpi-label,.kpi-label,.metric-label,.stat-label,.accounts-kpi-label,[class*="-kpi-label"],[class*="-metric-label"],[class*="-stat-label"]){
  color:#000!important;
  font-size:.56rem!important;
  font-weight:950!important;
  line-height:1.1!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  margin:0!important;
  padding:0!important;
  opacity:1!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi,.bimas-auto-kpi-card,.kpi-card,.stats-card,.stat-card,.accounts-kpi-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]) :is(.bimas-kpi-value,.kpi-value,.metric-value,.stat-value,.accounts-kpi-value,[class*="-kpi-value"],[class*="-metric-value"],[class*="-stat-value"],strong){
  color:#000!important;
  font-size:1.06rem!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;
  margin:0!important;
  padding:0!important;
  opacity:1!important;
}

html[data-auth-ready="app"] #app-content :is(.bimas-kpi,.bimas-auto-kpi-card,.kpi-card,.stats-card,.stat-card,.accounts-kpi-card,[class*="-kpi-card"],[class*="-metric-card"],[class*="-stat-card"]) :is(.bimas-kpi-sub,.kpi-sub,.metric-sub,.stat-sub,.accounts-kpi-sub,[class*="-kpi-sub"],[class*="-metric-sub"],[class*="-stat-sub"]){
  color:#000!important;
  font-size:.52rem!important;
  font-weight:850!important;
  line-height:1.12!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  margin:0!important;
  padding:0!important;
  opacity:.72!important;
}

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

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

@media (min-width:1200px){
  html[data-auth-ready="app"] #app-content :is(.bimas-auto-kpi-strip,.bimas-kpi-grid):not(.accounts-kpi-grid):not(.fgs-kpi-grid){
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

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

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

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

/* Final KPI cleanup: remove generic auto cards and keep real module KPI strips polished. */
html[data-auth-ready="app"] #app-content .bimas-auto-kpi-strip{
  display:none!important;
}

html[data-auth-ready="app"] #app-content :is(
  .prod-dash-kpis,
  .fgs-kpi-grid,
  .accounts-kpi-grid,
  .fleet-kpi-grid,
  .drn-kpi-grid,
  .dn-kpi-grid,
  .sof-kpi-grid,
  .pfi-kpi-grid,
  .inv-overview-kpis,
  .wip-kpi-grid,
  .voucher-kpi-grid,
  .notifications-kpi-grid,
  .reports-hub-kpis,
  .reports-report-kpis,
  .sales-perf-kpis
){
  display:grid!important;
  gap:.72rem!important;
  align-items:stretch!important;
  margin:0 0 1.15rem!important;
  width:100%!important;
}

html[data-auth-ready="app"] #app-content :is(
  .prod-dash-kpi,
  .fgs-metric-card,
  .accounts-kpi-card,
  .fleet-kpi-card,
  .drn-kpi-card,
  .dn-kpi-card,
  .sof-kpi-card,
  .pfi-metric-card,
  .inv-overview-metric-card,
  .wip-metric-card,
  .voucher-kpi-card,
  .notifications-kpi-card,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi,
  .kpi-card,
  .stats-card,
  .stat-card
){
  min-height:74px!important;
  border-radius:8px!important;
  background:#fff!important;
  border:1px solid #dde7f2!important;
  box-shadow:0 8px 18px rgba(15,23,42,.055)!important;
}

html[data-auth-ready="app"] #app-content :is(
  .prod-dash-kpi,
  .fgs-metric-card,
  .accounts-kpi-card,
  .fleet-kpi-card,
  .drn-kpi-card,
  .dn-kpi-card,
  .sof-kpi-card,
  .pfi-metric-card,
  .inv-overview-metric-card,
  .wip-metric-card,
  .voucher-kpi-card,
  .notifications-kpi-card,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi
) :is(strong,[class*="-value"],.kpi-value,.metric-value){
  font-size:1.04rem!important;
  font-weight:950!important;
  color:#000!important;
  line-height:1.05!important;
  letter-spacing:0!important;
}

html[data-auth-ready="app"] #app-content :is(
  .prod-dash-kpi,
  .fgs-metric-card,
  .accounts-kpi-card,
  .fleet-kpi-card,
  .drn-kpi-card,
  .dn-kpi-card,
  .sof-kpi-card,
  .pfi-metric-card,
  .inv-overview-metric-card,
  .wip-metric-card,
  .voucher-kpi-card,
  .notifications-kpi-card,
  .reports-hub-kpi,
  .reports-report-kpi,
  .sales-perf-kpi
) :is(span:not(.material-symbols-outlined),small,[class*="-label"],[class*="-sub"],.kpi-label,.kpi-sub,.metric-label,.metric-sub){
  color:#000!important;
  letter-spacing:0!important;
  text-shadow:none!important;
}

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

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

  html[data-auth-ready="app"] #app-content :is(.fleet-kpi-grid,.drn-kpi-grid,.dn-kpi-grid,.sof-kpi-grid,.pfi-kpi-grid,.inv-overview-kpis,.wip-kpi-grid,.voucher-kpi-grid,.notifications-kpi-grid,.reports-hub-kpis,.reports-report-kpis,.sales-perf-kpis){
    grid-template-columns:repeat(auto-fit,minmax(8.8rem,1fr))!important;
  }
}

@media (max-width:1179px){
  html[data-auth-ready="app"] #app-content :is(.prod-dash-kpis,.fgs-kpi-grid,.accounts-kpi-grid,.fleet-kpi-grid,.drn-kpi-grid,.dn-kpi-grid,.sof-kpi-grid,.pfi-kpi-grid,.inv-overview-kpis,.wip-kpi-grid,.voucher-kpi-grid,.notifications-kpi-grid,.reports-hub-kpis,.reports-report-kpis,.sales-perf-kpis){
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

@media (max-width:720px){
  html[data-auth-ready="app"] #app-content :is(.prod-dash-kpis,.fgs-kpi-grid,.accounts-kpi-grid,.fleet-kpi-grid,.drn-kpi-grid,.dn-kpi-grid,.sof-kpi-grid,.pfi-kpi-grid,.inv-overview-kpis,.wip-kpi-grid,.voucher-kpi-grid,.notifications-kpi-grid,.reports-hub-kpis,.reports-report-kpis,.sales-perf-kpis){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (max-width:460px){
  html[data-auth-ready="app"] #app-content :is(.prod-dash-kpis,.fgs-kpi-grid,.accounts-kpi-grid,.fleet-kpi-grid,.drn-kpi-grid,.dn-kpi-grid,.sof-kpi-grid,.pfi-kpi-grid,.inv-overview-kpis,.wip-kpi-grid,.voucher-kpi-grid,.notifications-kpi-grid,.reports-hub-kpis,.reports-report-kpis,.sales-perf-kpis){
    grid-template-columns:1fr!important;
  }
}

/* BI and Security Center executive polish */
.bi-live-shell,
.sec-shell{
  display:flex;
  flex-direction:column;
  gap:1rem;
}

.bi-live-hero,
.sec-hero{
  display:flex;
  align-items:stretch;
  justify-content:space-between;
  gap:1rem;
  padding:1rem;
  border-radius:12px;
  background:linear-gradient(135deg,#071a33 0%,#0b4f8f 58%,#0f766e 100%);
  color:#fff;
  box-shadow:0 16px 34px rgba(15,23,42,.16);
  overflow:hidden;
}

.bi-live-copy,
.sec-hero-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:.45rem;
}

.bi-live-eyebrow,
.sec-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  width:max-content;
  max-width:100%;
  color:rgba(255,255,255,.78);
  font-size:.68rem;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.bi-live-eyebrow .material-symbols-outlined,
.sec-eyebrow .material-symbols-outlined{
  font-size:1rem;
}

.bi-live-hero h1,
.sec-hero h1{
  margin:0;
  color:#fff;
  font-family:var(--font-display);
  font-size:clamp(1.45rem, 2.2vw, 2.4rem);
  font-weight:950;
  line-height:1;
  letter-spacing:0;
}

.bi-live-hero p,
.sec-hero p{
  margin:0;
  max-width:48rem;
  color:rgba(255,255,255,.82);
  font-size:.88rem;
  line-height:1.45;
}

.bi-live-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin-top:.15rem;
}

.bi-live-meta span{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.38rem .58rem;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  font-size:.72rem;
  font-weight:800;
}

.bi-live-meta .material-symbols-outlined{
  font-size:.95rem;
}

.bi-live-actions,
.sec-hero-actions{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:flex-end;
  gap:.75rem;
  flex:0 0 auto;
}

.bi-view-switch{
  display:flex;
  gap:.25rem;
  padding:.25rem;
  border-radius:10px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.16);
}

.bi-view-switch button{
  border:0;
  border-radius:8px;
  padding:.48rem .7rem;
  background:transparent;
  color:rgba(255,255,255,.74);
  font-size:.72rem;
  font-weight:900;
  cursor:pointer;
}

.bi-view-switch button.active{
  background:#fff;
  color:#071a33;
  box-shadow:0 8px 18px rgba(0,0,0,.14);
}

.bi-action-row{
  display:flex;
  gap:.5rem;
  justify-content:flex-end;
}

.bi-comparison-grid,
.bi-exec-kpi-grid,
.bi-category-kpis,
.sec-kpi-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.75rem;
  width:100%;
}

.bi-compare-card,
.bi-exec-card,
.bi-category-kpi,
.sec-kpi-card{
  min-width:0;
  background:#fff;
  border:1px solid #dde7f2;
  border-radius:9px;
  box-shadow:0 8px 18px rgba(15,23,42,.055);
}

.bi-compare-card{
  padding:.8rem .9rem;
}

.bi-compare-card p,
.bi-exec-card p,
.bi-category-kpi p{
  margin:0;
  color:#0f172a!important;
  font-size:.66rem!important;
  font-weight:950!important;
  text-transform:uppercase;
  letter-spacing:0!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.bi-compare-card strong,
.bi-exec-card strong,
.bi-category-kpi strong{
  display:block;
  color:#000!important;
  font-size:1.1rem!important;
  font-weight:950!important;
  line-height:1.05!important;
  margin:.36rem 0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.bi-compare-card div,
.bi-category-kpi div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  min-width:0;
}

.bi-compare-card span,
.bi-category-kpi span{
  min-width:0;
  color:#334155;
  font-size:.67rem;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.bi-compare-card span:last-child,
.bi-category-kpi span:last-child{
  display:inline-flex;
  align-items:center;
  gap:.18rem;
  flex:0 0 auto;
}

.bi-compare-card .material-symbols-outlined,
.bi-category-kpi .material-symbols-outlined{
  font-size:.9rem;
}

.bi-exec-card{
  padding:.95rem;
}

.bi-exec-card > div:first-child{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:.6rem;
  margin-bottom:.7rem;
}

.bi-exec-card > div:first-child > .material-symbols-outlined{
  font-size:1.55rem;
}

.bi-exec-card small{
  display:block;
  color:#334155!important;
  font-size:.68rem!important;
  font-weight:800!important;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.bi-chart-grid,
.bi-action-grid,
.bi-detail-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:1rem;
}

.bi-action-grid{
  grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr);
}

.bi-mini-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.85rem;
  margin-top:1rem;
}

.bi-mini-panel{
  cursor:pointer;
  overflow:hidden;
}

.bi-mini-panel > div:first-child{
  display:flex;
  align-items:center;
  gap:.55rem;
  padding:.78rem .9rem;
  border-bottom:1px solid var(--border);
}

.bi-mini-panel > div:first-child .material-symbols-outlined:first-child{
  color:var(--brand-blue);
}

.bi-mini-panel h3{
  margin:0;
  color:#0f172a;
  font-size:.86rem;
  font-weight:950;
  flex:1;
}

.bi-mini-panel > div:last-child{
  padding:.75rem .9rem;
}

.bi-mini-panel section{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  padding:.55rem 0;
  border-bottom:1px solid #e5edf5;
}

.bi-mini-panel section:last-child{
  border-bottom:0;
}

.bi-mini-panel section > span,
.bi-mini-panel small{
  color:#334155!important;
  font-size:.68rem!important;
  font-weight:800!important;
}

.bi-mini-panel section strong{
  display:block;
  font-size:.86rem!important;
  font-weight:950!important;
  text-align:right;
}

.bi-category-kpi{
  padding:.9rem;
  border-top:4px solid var(--bi-tone);
}

.sec-kpi-card{
  display:grid;
  grid-template-columns:2.4rem minmax(0,1fr);
  align-items:center;
  gap:.7rem;
  min-height:78px;
  padding:.75rem .85rem;
}

.sec-kpi-icon{
  width:2.35rem;
  height:2.35rem;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--sec-tone);
  color:#fff;
  box-shadow:0 8px 16px rgba(15,23,42,.12);
}

.sec-kpi-icon .material-symbols-outlined{
  font-size:1.2rem;
}

.sec-kpi-copy{
  min-width:0;
}

.sec-kpi-copy span,
.sec-kpi-copy small{
  display:block;
  color:#0f172a!important;
  font-size:.62rem!important;
  font-weight:950!important;
  text-transform:uppercase;
  letter-spacing:0!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.sec-kpi-copy strong{
  display:block;
  color:#000!important;
  font-size:1.2rem!important;
  font-weight:950!important;
  line-height:1!important;
}

.sec-kpi-copy small{
  color:#475569!important;
  font-size:.6rem!important;
  text-transform:none;
  opacity:.9;
}

.sec-policy-strip{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.6rem;
}

.sec-policy-pill{
  display:flex;
  align-items:center;
  gap:.55rem;
  min-width:0;
  padding:.7rem .78rem;
  border-radius:9px;
  background:#fff;
  border:1px solid #dde7f2;
}

.sec-policy-pill .material-symbols-outlined{
  color:#0f766e;
  font-size:1.15rem;
}

.sec-policy-pill strong,
.sec-policy-pill small{
  display:block;
  min-width:0;
  color:#0f172a;
  font-weight:950;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.sec-policy-pill small{
  color:#64748b;
  font-size:.68rem;
  font-weight:800;
  margin-top:.14rem;
}

.sec-layout{
  display:grid;
  grid-template-columns:minmax(0,1.7fr) minmax(18rem,.7fr);
  gap:1rem;
}

.sec-card{
  overflow:hidden;
}

.sec-card-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  padding:.9rem 1rem;
  border-bottom:1px solid var(--border);
}

.sec-card-head > div{
  display:flex;
  align-items:center;
  gap:.55rem;
  min-width:0;
}

.sec-card-head h2{
  margin:0;
  color:#0f172a;
  font-size:.98rem;
  font-weight:950;
}

.sec-card-head > span{
  color:#64748b;
  font-size:.72rem;
  font-weight:900;
  white-space:nowrap;
}

.sec-table-wrap{
  width:100%;
  overflow:auto;
}

.sec-table{
  min-width:980px;
}

.sec-table th{
  font-size:.68rem!important;
  font-weight:950!important;
}

.sec-table td{
  vertical-align:middle;
  font-size:.78rem;
  color:#0f172a;
}

.sec-user-cell{
  display:flex;
  align-items:center;
  gap:.55rem;
}

.sec-user-cell > span{
  width:2rem;
  height:2rem;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#0f4c81;
  color:#fff;
  font-size:.68rem;
  font-weight:950;
  flex:0 0 auto;
}

.sec-user-cell strong,
.sec-cell-sub{
  display:block;
}

.sec-user-cell small,
.sec-cell-sub{
  color:#64748b;
  font-size:.66rem;
  font-weight:800;
  margin-top:.1rem;
}

.sec-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:4.5rem;
  border-radius:999px;
  padding:.28rem .55rem;
  font-size:.64rem;
  font-weight:950;
  text-transform:uppercase;
}

.sec-muted{
  color:#94a3b8;
  font-size:.7rem;
  font-weight:800;
}

.sec-side{
  display:flex;
  flex-direction:column;
  gap:1rem;
  min-width:0;
}

.sec-list,
.sec-events{
  padding:.8rem;
  display:flex;
  flex-direction:column;
  gap:.55rem;
}

.sec-list-item,
.sec-event{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  padding:.75rem;
  border-radius:9px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
}

.sec-list-item strong,
.sec-list-item span,
.sec-list-item small,
.sec-event strong,
.sec-event small{
  display:block;
}

.sec-list-item strong,
.sec-event strong{
  color:#0f172a;
  font-size:.78rem;
  font-weight:950;
}

.sec-list-item span,
.sec-list-item small,
.sec-event small{
  color:#64748b;
  font-size:.68rem;
  font-weight:800;
}

.sec-event{
  justify-content:flex-start;
}

.sec-event > .material-symbols-outlined{
  color:#047857;
  font-size:1.2rem;
}

.sec-event.is-warning > .material-symbols-outlined{
  color:#b91c1c;
}

.sec-control-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.65rem;
  padding:.8rem;
}

.sec-control{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.18rem;
  padding:.82rem;
  border:1px solid #dde7f2;
  border-radius:9px;
  background:#fff;
  color:#0f172a;
  cursor:pointer;
  text-align:left;
}

.sec-control .material-symbols-outlined{
  color:#1d4ed8;
  font-size:1.2rem;
}

.sec-control strong{
  font-size:.78rem;
  font-weight:950;
}

.sec-control small,
.sec-empty-mini{
  color:#64748b;
  font-size:.68rem;
  font-weight:800;
}

.sec-empty-mini{
  padding:.9rem;
  text-align:center;
}

@media (max-width:1280px){
  .bi-comparison-grid,
  .bi-exec-kpi-grid,
  .bi-category-kpis,
  .sec-kpi-grid,
  .bi-mini-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .sec-policy-strip{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:980px){
  .bi-live-hero,
  .sec-hero,
  .bi-live-actions,
  .sec-hero-actions{
    align-items:stretch;
    flex-direction:column;
  }

  .bi-view-switch,
  .bi-action-row,
  .sec-hero-actions{
    width:100%;
  }

  .bi-view-switch{
    overflow:auto;
  }

  .bi-view-switch button{
    flex:1 0 auto;
  }

  .bi-action-row{
    justify-content:flex-start;
    flex-wrap:wrap;
  }

  .bi-chart-grid,
  .bi-action-grid,
  .bi-detail-grid,
  .sec-layout{
    grid-template-columns:1fr;
  }
}

@media (max-width:640px){
  .bi-live-hero,
  .sec-hero{
    padding:.85rem;
    border-radius:10px;
  }

  .bi-comparison-grid,
  .bi-exec-kpi-grid,
  .bi-category-kpis,
  .sec-kpi-grid,
  .bi-mini-grid,
  .sec-policy-strip,
  .sec-control-grid{
    grid-template-columns:1fr;
  }

  .bi-compare-card strong,
  .bi-exec-card strong,
  .bi-category-kpi strong,
  .sec-kpi-copy strong{
    font-size:1.05rem!important;
  }
}

/* Final title color lock for BI and Security Center hero titles. */
html[data-auth-ready="app"] #app-content .bi-live-hero :is(h1,.bi-live-eyebrow),
html[data-auth-ready="app"] #app-content .sec-hero :is(h1,.sec-eyebrow){
  color:#fff!important;
  text-shadow:none!important;
}

/* CEO dashboard: executive one-line KPI strip on desktop. */
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:.58rem!important;
  width:100%!important;
  align-items:stretch!important;
  margin:0!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi{
  min-width:0!important;
  min-height:78px!important;
  height:78px!important;
  display:grid!important;
  grid-template-columns:2.1rem minmax(0,1fr)!important;
  grid-template-rows:auto auto auto!important;
  align-content:center!important;
  align-items:center!important;
  column-gap:.56rem!important;
  row-gap:.04rem!important;
  padding:.56rem .62rem!important;
  border-radius:8px!important;
  border:1px solid #dbe7f4!important;
  border-top:3px solid var(--tone)!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
  box-shadow:0 8px 18px rgba(15,23,42,.052)!important;
  overflow:hidden!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-row{
  display:contents!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-icon{
  grid-column:1!important;
  grid-row:1 / span 3!important;
  width:2.1rem!important;
  height:2.1rem!important;
  border-radius:7px!important;
  align-self:center!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-icon .material-symbols-outlined{
  font-size:1.06rem!important;
  line-height:1!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-row > span{
  grid-column:2!important;
  grid-row:1!important;
  position:static!important;
  display:block!important;
  max-width:100%!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#000!important;
  font-size:.5rem!important;
  font-weight:950!important;
  line-height:1.05!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi > span:not(.ceo-kpi-row),
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi > strong,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi > small{
  grid-column:2!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  color:#000!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi > span:not(.ceo-kpi-row){
  font-size:.54rem!important;
  font-weight:950!important;
  line-height:1.05!important;
  text-transform:uppercase!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi > strong{
  font-size:.92rem!important;
  font-weight:950!important;
  line-height:1.04!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi > small{
  font-size:.5rem!important;
  font-weight:850!important;
  line-height:1.08!important;
  opacity:.78!important;
}

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

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

@media (max-width:460px){
  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-grid{
    grid-template-columns:1fr!important;
  }
}

/* CEO dashboard final redesign: premium compact cards, no inherited KPI blobs. */
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:.5rem!important;
  align-items:stretch!important;
  width:100%!important;
  margin:0!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi{
  position:relative!important;
  isolation:isolate!important;
  display:grid!important;
  grid-template-columns:1.85rem minmax(0,1fr)!important;
  align-items:center!important;
  gap:.48rem!important;
  min-width:0!important;
  min-height:72px!important;
  height:72px!important;
  padding:.48rem .55rem!important;
  border:1px solid #d9e6f2!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)!important;
  box-shadow:0 8px 18px rgba(15,23,42,.055)!important;
  overflow:hidden!important;
  color:#061636!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi::before{
  content:""!important;
  position:absolute!important;
  inset:0 auto 0 0!important;
  width:3px!important;
  height:auto!important;
  border-radius:8px 0 0 8px!important;
  background:var(--tone)!important;
  z-index:0!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi::after{
  content:none!important;
  display:none!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi > *{
  position:relative!important;
  z-index:1!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-icon{
  grid-column:1!important;
  width:1.85rem!important;
  height:1.85rem!important;
  min-width:1.85rem!important;
  border-radius:7px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(135deg,var(--tone),color-mix(in srgb,var(--tone) 76%,#0f172a))!important;
  color:#fff!important;
  box-shadow:0 8px 14px color-mix(in srgb,var(--tone) 22%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--tone) 64%,#ffffff)!important;
  align-self:center!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-icon .material-symbols-outlined{
  display:block!important;
  width:1em!important;
  height:1em!important;
  color:#fff!important;
  font-size:.98rem!important;
  line-height:1!important;
  text-align:center!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-copy{
  grid-column:2!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:.06rem!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell :is(.ceo-kpi-label,.ceo-kpi-value,.ceo-kpi-sub){
  display:block!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-label{
  color:#64748b!important;
  font-size:.5rem!important;
  font-weight:950!important;
  line-height:1.08!important;
  text-transform:uppercase!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-value{
  color:#020617!important;
  font-family:var(--font-display,Inter,Arial,sans-serif)!important;
  font-size:.84rem!important;
  font-weight:950!important;
  line-height:1.06!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-sub{
  color:#475569!important;
  font-size:.48rem!important;
  font-weight:850!important;
  line-height:1.08!important;
  opacity:.9!important;
}

html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-badge{
  position:absolute!important;
  top:.34rem!important;
  right:.4rem!important;
  max-width:3.2rem!important;
  padding:.11rem .3rem!important;
  border-radius:999px!important;
  background:var(--soft)!important;
  color:var(--tone)!important;
  border:1px solid color-mix(in srgb,var(--tone) 20%,transparent)!important;
  font-size:.46rem!important;
  font-weight:950!important;
  line-height:1!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

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

@media (max-width:460px){
  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-grid{
    grid-template-columns:1fr!important;
  }
}

/* CEO desktop KPI lock: keep the executive strip in one line on desktop. */
@media (min-width:768px){
  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-kpi-grid,
  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-grid,
  #app-content .ceo-shell .ceo-kpi-grid{
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:.42rem!important;
    align-items:stretch!important;
    width:100%!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-kpi,
  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi,
  #app-content .ceo-shell .ceo-kpi{
    height:66px!important;
    min-height:66px!important;
    grid-template-columns:1.72rem minmax(0,1fr)!important;
    gap:.42rem!important;
    padding:.4rem .48rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-kpi-icon,
  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-icon,
  #app-content .ceo-shell .ceo-kpi-icon{
    width:1.72rem!important;
    height:1.72rem!important;
    min-width:1.72rem!important;
  }

  html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-kpi-icon .material-symbols-outlined,
  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-icon .material-symbols-outlined,
  #app-content .ceo-shell .ceo-kpi-icon .material-symbols-outlined{
    font-size:.9rem!important;
  }

  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-label{font-size:.46rem!important;}
  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-value{font-size:.78rem!important;}
  html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-sub{font-size:.44rem!important;}
}

/* CEO KPI hard reset: no floating icons, no empty icon placeholder. */
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell .ceo-kpi,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi,
#app-content .ceo-shell .ceo-kpi{
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:.42rem!important;
  text-align:left!important;
  border:1px solid #dbe6f2!important;
  border-top:3px solid var(--tone,#174f91)!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
  color:#000!important;
  overflow:hidden!important;
  box-shadow:0 8px 18px rgba(15,23,42,.055)!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell .ceo-kpi::before,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi::before,
#app-content .ceo-shell .ceo-kpi::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0 auto 0 0!important;
  width:3px!important;
  height:auto!important;
  border-radius:8px 0 0 8px!important;
  background:var(--tone,#174f91)!important;
  opacity:1!important;
  pointer-events:none!important;
  z-index:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell .ceo-kpi::after,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi::after,
#app-content .ceo-shell .ceo-kpi::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  top:-1.8rem!important;
  right:-1.35rem!important;
  width:4.9rem!important;
  height:4.9rem!important;
  border-radius:999px!important;
  background:var(--tone,#174f91)!important;
  opacity:.075!important;
  pointer-events:none!important;
  z-index:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-shell .ceo-kpi-icon,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-kpi-icon,
#app-content .ceo-shell .ceo-kpi-icon{
  position:static!important;
  inset:auto!important;
  transform:none!important;
  grid-column:auto!important;
  grid-row:auto!important;
  width:1.78rem!important;
  height:1.78rem!important;
  min-width:1.78rem!important;
  flex:0 0 1.78rem!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  justify-self:start!important;
  border-radius:7px!important;
  background:linear-gradient(135deg,var(--tone,#174f91),color-mix(in srgb,var(--tone,#174f91) 76%,#0f172a))!important;
  color:#fff!important;
  box-shadow:0 8px 14px color-mix(in srgb,var(--tone,#174f91) 22%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--tone,#174f91) 64%,#ffffff)!important;
  z-index:1!important;
}

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

/* CEO reports download cards use the same global KPI rail pattern. */
html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-report-grid,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-report-grid,
#app-content .ceo-shell .ceo-report-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:.55rem!important;
  padding:.75rem!important;
  align-items:stretch!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-report,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-report,
#app-content .ceo-shell .ceo-report{
  position:relative!important;
  min-height:68px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:.5rem!important;
  padding:.46rem .55rem!important;
  text-align:left!important;
  border:1px solid #dbe6f2!important;
  border-top:3px solid var(--tone,#174f91)!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
  color:#000!important;
  overflow:hidden!important;
  box-shadow:0 8px 18px rgba(15,23,42,.055)!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-report::before,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-report::before,
#app-content .ceo-shell .ceo-report::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0 auto 0 0!important;
  width:3px!important;
  height:auto!important;
  border-radius:8px 0 0 8px!important;
  background:var(--tone,#174f91)!important;
  z-index:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-report::after,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-report::after,
#app-content .ceo-shell .ceo-report::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  top:-1.8rem!important;
  right:-1.35rem!important;
  width:4.9rem!important;
  height:4.9rem!important;
  border-radius:999px!important;
  background:var(--tone,#174f91)!important;
  opacity:.075!important;
  pointer-events:none!important;
  z-index:0!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-report i,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-report i,
#app-content .ceo-shell .ceo-report i{
  position:static!important;
  width:1.9rem!important;
  height:1.9rem!important;
  min-width:1.9rem!important;
  flex:0 0 1.9rem!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:7px!important;
  background:linear-gradient(135deg,var(--tone,#174f91),color-mix(in srgb,var(--tone,#174f91) 76%,#0f172a))!important;
  color:#fff!important;
  box-shadow:0 8px 14px color-mix(in srgb,var(--tone,#174f91) 22%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--tone,#174f91) 64%,#fff)!important;
  font-style:normal!important;
  z-index:1!important;
}

html[data-auth-ready="app"] body[data-route="dashboard"] #app-content .ceo-report-copy,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-report-copy,
#app-content .ceo-shell .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"] body[data-route="dashboard"] #app-content .ceo-report-action,
html[data-auth-ready="app"] #app-content .ceo-shell .ceo-report-action,
#app-content .ceo-shell .ceo-report-action{
  position:relative!important;
  z-index:1!important;
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:1.6rem!important;
  height:1.6rem!important;
  border-radius:7px!important;
  background:var(--soft)!important;
  color:var(--tone)!important;
}

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

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

/* Mobile app KPI rail: compact four-column cards instead of one-column stacks. */
@media (max-width:767px){
  html[data-auth-ready="app"] #app-content :is(
    [class*="kpi-grid"],
    [class*="kpis"],
    [class*="metric-grid"],
    .bimas-auto-kpi-strip,
    .ceo-report-grid,
    .dash-grid,
    .dash-shortcuts,
    .ceo-command-strip
  ){
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:.36rem!important;
    align-items:stretch!important;
  }

  html[data-auth-ready="app"] #app-content :is(
    [class*="kpi-card"],
    [class*="metric-card"],
    .kpi-card,
    .bimas-kpi,
    .ops-kpi,
    .dash-kpi,
    .ceo-kpi,
    .reports-hub-kpi,
    .reports-report-kpi,
    .sales-perf-kpi,
    .prod-dash-kpi,
    .fgs-metric-card
  ){
    min-height:58px!important;
    height:58px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:.24rem!important;
    padding:.3rem .32rem!important;
    border-radius:8px!important;
    overflow:hidden!important;
  }

  html[data-auth-ready="app"] #app-content :is(
    [class*="kpi-card"],
    [class*="metric-card"],
    .kpi-card,
    .bimas-kpi,
    .ops-kpi,
    .dash-kpi,
    .ceo-kpi,
    .reports-hub-kpi,
    .reports-report-kpi,
    .sales-perf-kpi,
    .prod-dash-kpi,
    .fgs-metric-card
  ) :is([class*="kpi-icon"],[class*="metric-icon"],.kicon,.icon,.bimas-kpi-icon,.fgs-metric-icon){
    position:static!important;
    width:1.28rem!important;
    height:1.28rem!important;
    min-width:1.28rem!important;
    flex:0 0 1.28rem!important;
    border-radius:6px!important;
    font-size:.72rem!important;
  }

  html[data-auth-ready="app"] #app-content :is(
    [class*="kpi-card"],
    [class*="metric-card"],
    .kpi-card,
    .bimas-kpi,
    .ops-kpi,
    .dash-kpi,
    .ceo-kpi,
    .reports-hub-kpi,
    .reports-report-kpi,
    .sales-perf-kpi,
    .prod-dash-kpi,
    .fgs-metric-card
  ) :is([class*="kpi-icon"],[class*="metric-icon"],.kicon,.icon,.bimas-kpi-icon,.fgs-metric-icon) .material-symbols-outlined{
    font-size:.72rem!important;
  }

  html[data-auth-ready="app"] #app-content :is([class*="kpi-copy"],[class*="metric-copy"],[class*="kpi-main"],[class*="kpi-body"],.fgs-metric-copy){
    min-width:0!important;
    flex:1 1 auto!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:.03rem!important;
  }

  html[data-auth-ready="app"] #app-content :is([class*="kpi-label"],[class*="metric-label"],.kpi-label,.label,.fgs-metric-label){
    font-size:.38rem!important;
    line-height:1.03!important;
  }

  html[data-auth-ready="app"] #app-content :is([class*="kpi-value"],[class*="metric-value"],.kpi-value,.value,.fgs-metric-value){
    font-size:.56rem!important;
    line-height:1.04!important;
  }

  html[data-auth-ready="app"] #app-content :is([class*="kpi-sub"],[class*="metric-sub"],.kpi-sub,.sub,.fgs-metric-sub){
    font-size:.34rem!important;
    line-height:1.04!important;
    opacity:.78!important;
  }

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

/* Users & Portal Users administration */
.usr-shell,
.portal-shell{
  display:flex;
  flex-direction:column;
  gap:1rem;
}

.usr-hero{
  background:linear-gradient(135deg,#1e1b4b 0%,#3730a3 52%,#0b5cab 100%)!important;
}

.portal-hero{
  background:linear-gradient(135deg,#064e3b 0%,#0f766e 54%,#0b5cab 100%)!important;
}

.usr-sync-pill{
  display:inline-flex;
  align-items:center;
  padding:.42rem .72rem;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.2);
  color:#fff;
  font-size:.72rem;
  font-weight:800;
}

.usr-hero-btn-row{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  justify-content:flex-end;
}

.usr-guide-strip{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.65rem;
}

.usr-guide-card{
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  padding:.78rem .85rem;
  border-radius:9px;
  background:#fff;
  border:1px solid #dde7f2;
  box-shadow:0 8px 18px rgba(15,23,42,.045);
}

.usr-guide-card .material-symbols-outlined{
  color:#3730a3;
  font-size:1.2rem;
}

.usr-guide-card strong{
  display:block;
  color:#0f172a;
  font-size:.78rem;
  font-weight:950;
}

.usr-guide-card small{
  display:block;
  color:#64748b;
  font-size:.7rem;
  font-weight:700;
  line-height:1.35;
  margin-top:.15rem;
}

.usr-tabs{
  display:flex;
  gap:.35rem;
  padding:.28rem;
  border-radius:10px;
  background:#eef2f7;
  border:1px solid #dde7f2;
  width:max-content;
  max-width:100%;
}

.usr-tab{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  border:0;
  border-radius:8px;
  padding:.55rem .85rem;
  background:transparent;
  color:#475569;
  font-size:.78rem;
  font-weight:900;
  cursor:pointer;
}

.usr-tab.active{
  background:#fff;
  color:#1e1b4b;
  box-shadow:0 8px 18px rgba(15,23,42,.08);
}

.usr-tab .material-symbols-outlined{
  font-size:1rem;
}

.usr-tab-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:1.35rem;
  height:1.35rem;
  padding:0 .35rem;
  border-radius:999px;
  background:#e2e8f0;
  font-size:.65rem;
}

.usr-tab.active .usr-tab-count{
  background:#ede9fe;
  color:#5b21b6;
}

.usr-card{
  overflow:hidden;
}

.usr-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  padding:1rem 1.05rem;
  border-bottom:1px solid var(--border);
}

.usr-card-head > div:first-child{
  display:flex;
  align-items:center;
  gap:.55rem;
}

.usr-card-head h2{
  margin:0;
  font-size:.95rem;
  font-weight:950;
  color:#0f172a;
}

.usr-card-head .material-symbols-outlined{
  color:var(--primary);
}

.usr-toolbar{
  display:flex;
  align-items:center;
  gap:.55rem;
  flex-wrap:wrap;
}

.usr-filter{
  min-width:11rem;
  max-width:14rem;
}

.usr-search-wrap{
  position:relative;
  min-width:14rem;
}

.usr-search-wrap .material-symbols-outlined{
  position:absolute;
  left:.65rem;
  top:50%;
  transform:translateY(-50%);
  font-size:1rem;
  color:#94a3b8;
  pointer-events:none;
}

.usr-search-wrap .form-input{
  padding-left:2.15rem;
  min-width:14rem;
}

.usr-table-wrap{
  overflow:auto;
}

.usr-table tbody tr:hover{
  background:rgba(55,48,163,.03);
}

.usr-user-cell{
  display:flex;
  align-items:center;
  gap:.75rem;
  min-width:0;
}

.usr-user-cell strong{
  display:block;
  font-size:.84rem;
}

.usr-user-cell small{
  display:block;
  color:#64748b;
  font-size:.72rem;
}

.usr-avatar{
  width:2.35rem;
  height:2.35rem;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  background:color-mix(in srgb, var(--usr-avatar-tone, #64748b) 14%, #fff);
  color:var(--usr-avatar-tone, #64748b);
  font-weight:900;
  font-size:.78rem;
}

.usr-code{
  font-size:.78rem;
  padding:.18rem .42rem;
  border-radius:6px;
  background:#f1f5f9;
}

.usr-role-badge{
  display:inline-flex;
  align-items:center;
  gap:.32rem;
  max-width:100%;
  padding:.28rem .58rem;
  border-radius:999px;
  background:color-mix(in srgb, var(--usr-role-tone, #64748b) 12%, #fff);
  color:var(--usr-role-tone, #64748b);
  border:1px solid color-mix(in srgb, var(--usr-role-tone, #64748b) 22%, #fff);
  font-size:.68rem;
  font-weight:900;
  white-space:nowrap;
}

.usr-role-badge .material-symbols-outlined{
  font-size:.9rem;
}

.usr-dept-pill{
  display:inline-flex;
  padding:.22rem .5rem;
  border-radius:999px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
  font-size:.72rem;
  font-weight:800;
  color:#334155;
}

.usr-company{
  text-transform:capitalize;
  font-size:.82rem;
}

.usr-actions{
  display:flex;
  gap:.2rem;
  justify-content:flex-end;
  flex-wrap:wrap;
}

.usr-danger,
.usr-danger-text{
  color:var(--error)!important;
}

.usr-empty-row{
  text-align:center;
  padding:2rem!important;
  color:#94a3b8!important;
}

.usr-role-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(18rem,1fr));
  gap:.85rem;
  padding:1rem;
}

.usr-role-card{
  display:flex;
  flex-direction:column;
  gap:.65rem;
  padding:1rem;
  border-radius:10px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
}

.usr-role-card--bdm{
  background:linear-gradient(180deg,#eff6ff 0%,#f8fafc 100%);
  border-color:#bfdbfe;
  box-shadow:0 10px 24px rgba(37,99,235,.08);
}

.usr-role-card-head{
  display:flex;
  align-items:flex-start;
  gap:.65rem;
}

.usr-role-icon{
  width:2.4rem;
  height:2.4rem;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--usr-role-tone, #64748b);
  color:#fff;
  flex-shrink:0;
}

.usr-role-icon .material-symbols-outlined{
  font-size:1.15rem;
}

.usr-role-title{
  flex:1;
  min-width:0;
}

.usr-role-title strong{
  display:block;
  font-size:.86rem;
  color:#0f172a;
}

.usr-role-title span{
  display:block;
  font-size:.68rem;
  color:#64748b;
  font-weight:800;
  margin-top:.15rem;
}

.usr-role-actions{
  display:flex;
  gap:.15rem;
}

.usr-role-stats{
  display:flex;
  gap:.75rem;
  font-size:.72rem;
  color:#475569;
  font-weight:800;
}

.usr-role-note{
  margin:0;
  padding:.55rem .65rem;
  border-radius:8px;
  background:rgba(37,99,235,.08);
  border:1px solid rgba(37,99,235,.14);
  color:#1d4ed8;
  font-size:.72rem;
  line-height:1.45;
  font-weight:700;
}

.usr-perm-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:.28rem;
}

.usr-perm-list li{
  display:flex;
  align-items:center;
  gap:.35rem;
  font-size:.72rem;
  color:#475569;
  font-weight:700;
}

.usr-perm-list .material-symbols-outlined{
  font-size:.95rem;
  color:#16a34a;
}

.usr-perm-more{
  color:#64748b!important;
  font-style:italic;
}

.usr-role-view{
  align-self:flex-start;
}

.usr-role-summary{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr));
  gap:.55rem;
}

.usr-role-chip{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.2rem;
  padding:.75rem .55rem;
  border-radius:10px;
  border:1px solid color-mix(in srgb, var(--usr-role-tone, #64748b) 20%, #fff);
  background:#fff;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease;
}

.usr-role-chip:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(15,23,42,.08);
}

.usr-role-chip .material-symbols-outlined{
  color:var(--usr-role-tone, #64748b);
  font-size:1.2rem;
}

.usr-role-chip span:nth-child(2){
  font-size:1.2rem;
  font-weight:950;
  color:#0f172a;
}

.usr-role-chip small{
  font-size:.62rem;
  font-weight:800;
  color:#64748b;
  text-align:center;
  line-height:1.2;
}

@media (max-width: 960px){
  .usr-guide-strip,
  .usr-kpi-grid,
  .sec-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .usr-toolbar{
    width:100%;
  }

  .usr-search-wrap,
  .usr-search-wrap .form-input,
  .usr-filter{
    width:100%;
    max-width:none;
    min-width:0;
  }
}

@media (max-width: 640px){
  .usr-guide-strip,
  .usr-kpi-grid{
    grid-template-columns:1fr!important;
  }

  .usr-tabs{
    width:100%;
  }

  .usr-tab{
    flex:1;
    justify-content:center;
  }
}