/* PEM SySO UX V2 · canonical release visual contract (R14)
   One release owner for cross-route geometry, density, hierarchy and navigation behavior.
   It intentionally supersedes versioned corrective presentation layers in the packaged Preview. */

/* Root sidebar bootstrap stays hidden only until the canonical nav source is complete. */
html.pem-sidebar-initializing .sidebar{visibility:hidden!important}

/* Motion belongs exclusively to PEM_NAV_MOTION, once per navigation. */
html.pem-motion-pending #view,
html.pem-motion-pending body>main,
html.pem-motion-pending .org-shell,
html.pem-motion-pending .doc-shell{visibility:hidden!important}
html.pem-enterprise-ui #view,
html.pem-enterprise-ui body.pem-standalone-shell>main,
html.pem-enterprise-ui body.pem-standalone-shell .org-shell,
html.pem-enterprise-ui body.pem-standalone-shell .doc-shell,
html.pem-enterprise-ui #view>.pem-flagship-view{
  animation:none!important;transition:none!important;
}
html.pem-enterprise-ui [data-pem-motion-host]{animation:none!important;transition:none!important}
html.pem-enterprise-ui body.pem-standalone-shell{transition:none!important}
@media(min-width:901px){
  html.pem-enterprise-ui .sidebar{position:sticky!important;top:0!important;height:100vh!important;align-self:start!important}
}

/* Approved identity. */
html.pem-enterprise-ui .sidebar>.brand .shield,
html.pem-enterprise-ui .pem-global-logo,
html.pem-enterprise-ui .mobile-brand .shield{
  background:#fff url('/static/pem_syso_mark.png') center/contain no-repeat!important;
  color:transparent!important;
  text-indent:-9999px!important;
  overflow:hidden!important;
  border-radius:10px!important;
  box-shadow:0 2px 8px rgba(0,0,0,.14)!important;
}
html.pem-enterprise-ui .sidebar>.brand .shield,
html.pem-enterprise-ui .pem-global-logo{width:64px!important;min-width:64px!important;height:64px!important;min-height:64px!important}
html.pem-enterprise-ui .mobile-brand .shield{width:38px!important;min-width:38px!important;height:38px!important;min-height:38px!important}

/* Canonical page header: category + title on the first useful row, support text below. */
html.pem-enterprise-ui body.pem-standalone-shell main.shell{padding-top:10px!important}
html.pem-enterprise-ui body:not(.pem-standalone-shell) #view{padding-top:10px!important}
html.pem-enterprise-ui .pem-release-page-header{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  margin:0 0 10px!important;
  padding:0 0 9px!important;
  border-bottom:1px solid var(--pem-color-border,#dfe7f0)!important;
  background:transparent!important;
  box-shadow:none!important;
}
html.pem-enterprise-ui .pem-release-page-header-main{
  min-width:0!important;
  max-width:1080px!important;
  flex:1 1 auto!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:baseline!important;
  column-gap:10px!important;
  row-gap:2px!important;
}
html.pem-enterprise-ui .pem-release-page-header h1{
  grid-column:2!important;
  margin:0!important;
  color:#10233f!important;
  font-size:27px!important;
  font-weight:820!important;
  line-height:1.08!important;
  letter-spacing:-.02em!important;
}
html.pem-enterprise-ui .pem-release-page-header p{
  grid-column:1/-1!important;
  margin:2px 0 0!important;
  max-width:960px!important;
  color:#65778d!important;
  font-size:13px!important;
  line-height:1.35!important;
}
html.pem-enterprise-ui .pem-release-eyebrow{
  grid-column:1!important;
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:14px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#456789!important;
  font-size:11px!important;
  font-weight:820!important;
  line-height:1.15!important;
  letter-spacing:.075em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
html.pem-enterprise-ui .pem-release-page-header .actions,
html.pem-enterprise-ui .pem-release-page-header .pem-page-header-actions,
html.pem-enterprise-ui .pem-release-page-header .pem-demo-page-header-actions,
html.pem-enterprise-ui .pem-release-page-header>.context-pills,
html.pem-enterprise-ui .pem-release-page-header>.context-controls{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  flex:0 0 auto!important;
}
html.pem-enterprise-ui body.pem-release-has-breadcrumb main.shell>.pem-breadcrumb{
  display:flex!important;align-items:center!important;min-height:14px!important;margin:0 0 3px!important;padding:0!important;color:#5d7490!important;font-size:12px!important;line-height:14px!important
}
html.pem-enterprise-ui body.pem-release-has-breadcrumb .pem-release-page-header-main{grid-template-columns:1fr!important}
html.pem-enterprise-ui body.pem-release-has-breadcrumb .pem-release-page-header h1{grid-column:1!important}
html.pem-enterprise-ui body.pem-release-has-breadcrumb .pem-release-page-header .pem-release-eyebrow{display:none!important}

/* Canonical group navigation. Group headers never disappear after a SPA render. */
html.pem-enterprise-ui .pem-release-nav-group{display:block!important;margin:2px 0!important}
html.pem-enterprise-ui .pem-release-nav-group-toggle{
  width:100%!important;min-height:40px!important;padding:8px 10px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;border:0!important;border-radius:9px!important;background:transparent!important;color:#b9cbe0!important;font:inherit!important;font-size:12px!important;font-weight:820!important;letter-spacing:.035em!important;text-transform:uppercase!important;text-align:left!important;cursor:pointer!important
}
html.pem-enterprise-ui .pem-release-nav-group-toggle:hover,
html.pem-enterprise-ui .pem-release-nav-group-toggle:focus-visible{background:rgba(255,255,255,.055)!important;color:#fff!important;outline:none!important}
html.pem-enterprise-ui .pem-release-nav-chevron{font-size:18px!important;line-height:1!important;flex:0 0 auto!important}
html.pem-enterprise-ui .pem-release-nav-group-items[hidden]{display:none!important}
html.pem-enterprise-ui .pem-release-nav-group-items{display:grid!important;gap:2px!important}

/* Native selects must visibly communicate that they open. */
html.pem-enterprise-ui .pem-dashboard-filter-bar select,
html.pem-enterprise-ui .period-control select,
html.pem-enterprise-ui .filters select,
html.pem-enterprise-ui .context-controls select,
html.pem-enterprise-ui .demo-context select{
  appearance:auto!important;
  -webkit-appearance:menulist!important;
  background-image:none!important;
  padding-right:30px!important;
  text-overflow:ellipsis!important;
  cursor:pointer!important;
}
html.pem-enterprise-ui .pem-dashboard-filter-bar label{min-width:0!important}
html.pem-enterprise-ui .pem-dashboard-filter-bar select{min-width:190px!important;width:100%!important;box-sizing:border-box!important}

/* Compact summary cards across operational surfaces. */
html.pem-enterprise-ui .pem-record-summary{
  display:grid!important;grid-template-columns:none!important;grid-auto-flow:column!important;grid-auto-columns:174px!important;justify-content:start!important;align-items:stretch!important;gap:8px!important;width:max-content!important;max-width:100%!important;margin:0!important;overflow:visible!important
}
html.pem-enterprise-ui .pem-summary-metric{
  box-sizing:border-box!important;width:174px!important;min-width:174px!important;max-width:174px!important;min-height:76px!important;height:76px!important;padding:8px 10px 7px!important;display:grid!important;grid-template-rows:auto 1fr auto!important;gap:2px!important
}
html.pem-enterprise-ui .pem-summary-metric>span{font-size:11px!important;line-height:1.15!important;font-weight:760!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html.pem-enterprise-ui .pem-summary-metric>b{margin:0!important;display:grid!important;place-items:center!important;font-size:25px!important;line-height:1!important}
html.pem-enterprise-ui .pem-summary-metric>small{align-self:end!important;margin:0!important;font-size:11px!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html.pem-enterprise-ui body.pem-route-plan #summary.kpis{display:grid!important;grid-template-columns:repeat(10,minmax(0,1fr))!important;justify-content:stretch!important;gap:7px!important;width:100%!important;max-width:100%!important;margin:8px 0 10px!important}
html.pem-enterprise-ui body.pem-route-plan #summary.kpis .kpi{box-sizing:border-box!important;width:auto!important;min-width:0!important;max-width:none!important;height:76px!important;min-height:76px!important;padding:7px 8px!important;display:grid!important;grid-template-rows:minmax(28px,auto) 1fr!important;align-content:stretch!important;gap:2px!important}
html.pem-enterprise-ui body.pem-route-plan #summary.kpis .kpi>span{display:flex!important;align-items:flex-start!important;gap:4px!important;min-height:28px!important;line-height:1.12!important;font-size:11px!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
html.pem-enterprise-ui body.pem-route-plan #summary.kpis .kpi>b{margin:0!important;display:grid!important;place-items:center!important;font-size:24px!important;line-height:1!important}
html.pem-enterprise-ui body.pem-route-plan #summary.kpis .kpi>small{display:none!important}

/* Dashboard R14: 10 KPI (5x2) + preventive pyramid, no consequence panel in this band. */
html.pem-enterprise-ui .pem-release-dashboard-band{display:grid!important;grid-template-columns:max-content minmax(330px,390px)!important;justify-content:start!important;align-items:stretch!important;gap:12px!important;margin:0 0 10px!important}
html.pem-enterprise-ui .pem-dashboard-kpis .pem-release-kpi-grid{display:grid!important;grid-template-columns:repeat(5,174px)!important;justify-content:start!important;align-items:stretch!important;gap:8px!important;width:max-content!important;max-width:100%!important;margin:0!important}
html.pem-enterprise-ui .pem-dashboard-kpis .pem-release-kpi-grid>.kpi{box-sizing:border-box!important;width:174px!important;min-width:174px!important;max-width:174px!important;height:76px!important;min-height:76px!important;padding:7px 9px 6px!important;display:grid!important;grid-template-rows:auto 1fr auto!important;align-items:stretch!important}
html.pem-enterprise-ui .pem-dashboard-kpis .kpi .label{min-width:0!important;align-items:center!important;gap:5px!important;font-size:11px!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html.pem-enterprise-ui .pem-dashboard-kpis .kpi .label>span:first-child{width:26px!important;height:26px!important}
html.pem-enterprise-ui .pem-dashboard-kpis .kpi .value{min-height:24px!important;margin:0!important;display:grid!important;place-items:center!important;text-align:center!important;font-size:25px!important;line-height:1!important}
html.pem-enterprise-ui .pem-dashboard-kpis .kpi small{margin:0!important;align-self:end!important;font-size:10.5px!important;line-height:1.05!important}
html.pem-enterprise-ui .pem-release-pyramid-card{box-sizing:border-box!important;width:100%!important;min-width:330px!important;max-width:390px!important;height:176px!important;min-height:160px!important;padding:9px 11px!important;overflow:visible!important}
html.pem-enterprise-ui .pem-release-pyramid-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:8px!important;margin-bottom:5px!important}
html.pem-enterprise-ui .pem-release-pyramid-head h2{margin:0!important;font-size:14px!important;line-height:1.15!important}
html.pem-enterprise-ui .pem-release-pyramid-sub{display:block!important;margin-top:2px!important;color:#65778d!important;font-size:9.5px!important;line-height:1.15!important}
html.pem-enterprise-ui .pem-release-pyramid-period{color:#53708e!important;font-size:9px!important;font-weight:750!important;white-space:nowrap!important}
html.pem-enterprise-ui .pem-release-pyramid{display:flex!important;flex-direction:column!important;align-items:center!important;gap:3px!important;margin:0!important}
html.pem-enterprise-ui .pem-release-pyramid-tier{box-sizing:border-box!important;min-height:21px!important;padding:3px 8px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;border:1px solid #dce5ef!important;border-radius:6px!important;background:#f7f9fc!important;color:#10233f!important;text-decoration:none!important}
html.pem-enterprise-ui .pem-release-pyramid-tier:nth-child(1){width:38%!important;background:#fdf0ef!important;border-color:#f0cecb!important}
html.pem-enterprise-ui .pem-release-pyramid-tier:nth-child(2){width:52%!important;background:#fff6e8!important;border-color:#ecd9b9!important}
html.pem-enterprise-ui .pem-release-pyramid-tier:nth-child(3){width:66%!important;background:#f4f8fc!important}
html.pem-enterprise-ui .pem-release-pyramid-tier:nth-child(4){width:83%!important;background:#eef6ff!important}
html.pem-enterprise-ui .pem-release-pyramid-tier:nth-child(5){width:100%!important;background:#eaf4ff!important}
html.pem-enterprise-ui .pem-release-pyramid-tier span{min-width:0!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important;line-height:1.05!important;font-size:9.5px!important;font-weight:730!important}
html.pem-enterprise-ui .pem-release-pyramid-tier b{flex:0 0 auto!important;font-size:12px!important;line-height:1!important}
html.pem-enterprise-ui .pem-release-pyramid-state{min-height:112px!important;display:grid!important;place-items:center!important;color:#65778d!important;font-size:11px!important;text-align:center!important}
html.pem-enterprise-ui .pem-dashboard-priority-grid{display:grid!important;grid-template-columns:minmax(430px,560px) minmax(360px,1fr)!important;align-items:start!important;gap:12px!important}
html.pem-enterprise-ui .pem-release-top-risks{width:100%!important;max-width:560px!important;min-height:0!important}
html.pem-enterprise-ui .pem-release-top-risks .row{min-height:0!important;padding:6px 0!important;gap:8px!important}
html.pem-enterprise-ui .pem-release-top-risks .row-title{font-size:12px!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html.pem-enterprise-ui .pem-release-top-risks .row-sub{font-size:10.5px!important;line-height:1.15!important}
html.pem-enterprise-ui .pem-dashboard-view>.security-note{margin:0 0 6px!important;padding:6px 9px!important;font-size:11.5px!important;line-height:1.25!important}
html.pem-enterprise-ui .pem-dashboard-filter-bar{margin:0 0 8px!important;padding:7px 9px!important;min-height:0!important}

/* Long primary navigation labels must remain readable rather than truncated. */
html.pem-enterprise-ui [data-pem-module="audits"]{white-space:normal!important;line-height:1.15!important;min-height:48px!important;align-items:flex-start!important}
html.pem-enterprise-ui [data-pem-module="audits"] .pem-nav-label{white-space:normal!important;overflow:visible!important;text-overflow:clip!important}

/* Risks / actions remain one useful vertical flow. */
html.pem-enterprise-ui body.pem-route-risks #riskSection,
html.pem-enterprise-ui body.pem-route-actions #capaSection{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;align-items:start!important}
html.pem-enterprise-ui body.pem-route-risks #riskSection>.card,
html.pem-enterprise-ui body.pem-route-risks #riskSection>details,
html.pem-enterprise-ui body.pem-route-actions #capaSection>.card,
html.pem-enterprise-ui body.pem-route-actions #capaSection>details{width:100%!important;max-width:none!important;margin-top:0!important}
html.pem-enterprise-ui #riskPreview{max-width:500px!important;color:#65778d!important;font-size:12px!important;font-weight:650!important;line-height:1.3!important;text-align:right!important}

/* Inspections belong to the same page system. */
html.pem-enterprise-ui body.pem-route-inspections #app.pem-release-inspection-shell{padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
html.pem-enterprise-ui body.pem-route-inspections #app>.inspection-summary{margin-bottom:10px!important}
html.pem-enterprise-ui body.pem-route-inspections .inspection-toolbar{margin:0 0 10px!important}
html.pem-enterprise-ui body.pem-route-inspections .inspection-point-grid{gap:10px!important}
html.pem-enterprise-ui body.pem-route-inspections .uat-inspection-card{min-height:138px!important;margin:0!important}

/* Investigation analysis fields keep real working room. */
html.pem-enterprise-ui body.pem-route-investigations textarea[name='problem_statement'],
html.pem-enterprise-ui body:has(main.shell .pem-breadcrumb) #newInvestigation textarea[name='problem_statement']{min-height:124px!important;height:auto!important;resize:vertical!important;line-height:1.4!important}

/* Reports, Cause/Actions and Findings use compact metric clusters instead of stretched tiles. */
html.pem-enterprise-ui body.pem-route-reports #metrics.metrics,
html.pem-enterprise-ui body.pem-route-cause .metrics,
html.pem-enterprise-ui body.pem-route-findings #summary.grid{
  display:grid!important;grid-template-columns:repeat(auto-fit,174px)!important;justify-content:start!important;gap:8px!important;width:max-content!important;max-width:100%!important
}
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric,
html.pem-enterprise-ui body.pem-route-cause .metrics>.metric,
html.pem-enterprise-ui body.pem-route-findings #summary>.metric{
  box-sizing:border-box!important;width:174px!important;min-width:174px!important;max-width:174px!important;min-height:76px!important;height:76px!important;padding:8px 10px!important;display:grid!important;align-content:center!important
}
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric b,
html.pem-enterprise-ui body.pem-route-cause .metrics>.metric b,
html.pem-enterprise-ui body.pem-route-findings #summary>.metric b{font-size:25px!important;line-height:1!important;margin-top:4px!important}

/* Organization / QR: use the canvas. Multiple sites and sectors can coexist on desktop. */
html.pem-enterprise-ui body.pem-route-organization .org-shell{max-width:1720px!important}
html.pem-enterprise-ui body.pem-route-organization .org-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(620px,1fr))!important;gap:12px!important;align-items:start!important}
html.pem-enterprise-ui body.pem-route-organization .site-card{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;padding:14px!important}
html.pem-enterprise-ui body.pem-route-organization .site-card>.site-head{grid-column:1/-1!important}
html.pem-enterprise-ui body.pem-route-organization .site-card>.sector{margin-top:0!important;min-width:0!important;padding:12px!important}
html.pem-enterprise-ui body.pem-route-organization .area{padding:10px!important;margin-top:8px!important}
html.pem-enterprise-ui body.pem-route-organization .points{grid-template-columns:1fr!important;gap:8px!important;margin-top:8px!important}
html.pem-enterprise-ui body.pem-route-organization .point{display:grid!important;grid-template-columns:minmax(0,1fr) 96px!important;grid-template-rows:auto auto auto auto!important;column-gap:10px!important;row-gap:6px!important;padding:10px!important;align-items:start!important}
html.pem-enterprise-ui body.pem-route-organization .point>.point-row{grid-column:1!important;grid-row:1!important}
html.pem-enterprise-ui body.pem-route-organization .point>img.qr-thumb{grid-column:2!important;grid-row:1/5!important;width:88px!important;height:88px!important;padding:4px!important;margin:0!important;justify-self:end!important;align-self:start!important}
html.pem-enterprise-ui body.pem-route-organization .point>.muted{grid-column:1!important;margin:0!important}
html.pem-enterprise-ui body.pem-route-organization .point>.point-actions{grid-column:1!important;margin:2px 0 0!important}
html.pem-enterprise-ui body.pem-route-organization .point>.public-note{grid-column:1/-1!important;margin-top:2px!important;padding:6px 8px!important;font-size:10.5px!important;line-height:1.25!important}
html.pem-enterprise-ui body.pem-route-organization .notice,
html.pem-enterprise-ui body.pem-route-organization .warning{padding:9px 11px!important;margin-bottom:9px!important;font-size:11.5px!important;line-height:1.35!important}

/* Indicators: the reading is analysis, never a sixth pyramid tier. */
html.pem-enterprise-ui body.pem-route-indicators .reading,
html.pem-enterprise-ui body.pem-route-indicators .pem-release-reading{
  margin:14px 0 0!important;padding:9px 11px 9px 13px!important;border:0!important;border-top:1px solid #dfe7f0!important;border-left:3px solid #6ca7df!important;border-radius:0!important;background:transparent!important;color:#315875!important
}
html.pem-enterprise-ui body.pem-route-indicators .reading b,
html.pem-enterprise-ui body.pem-route-indicators .pem-release-reading b{color:#103b69!important;margin-bottom:3px!important}
html.pem-enterprise-ui body.pem-route-indicators .metric-label .metric-help~.metric-help{display:none!important}

/* Cause/Actions headline should not dominate the screen. */
html.pem-enterprise-ui body.pem-route-cause .pem-release-page-header h1{max-width:680px!important}

@media(max-width:1450px) and (min-width:901px){
  html.pem-enterprise-ui .pem-release-dashboard-band{grid-template-columns:1fr!important}
  html.pem-enterprise-ui .pem-release-pyramid-card{min-width:0!important;max-width:900px!important;width:100%!important;height:auto!important;min-height:160px!important}
}
@media(max-width:1180px){
  html.pem-enterprise-ui body.pem-route-organization .org-grid{grid-template-columns:1fr!important}
  html.pem-enterprise-ui body.pem-route-organization .site-card{grid-template-columns:1fr!important}
  html.pem-enterprise-ui body.pem-route-organization .site-card>.site-head{grid-column:1!important}
  html.pem-enterprise-ui .pem-dashboard-priority-grid{grid-template-columns:1fr!important}
  html.pem-enterprise-ui .pem-release-top-risks{max-width:none!important}
}
@media(max-width:900px){
  html.pem-enterprise-ui .pem-release-page-header{align-items:flex-start!important;flex-direction:column!important}
  html.pem-enterprise-ui .pem-release-page-header-main{grid-template-columns:1fr!important}
  html.pem-enterprise-ui .pem-release-page-header h1{grid-column:1!important;font-size:24px!important}
  html.pem-enterprise-ui .pem-release-eyebrow{grid-column:1!important}
  html.pem-enterprise-ui .pem-dashboard-kpis .pem-release-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}
  html.pem-enterprise-ui .pem-dashboard-kpis .pem-release-kpi-grid>.kpi{width:auto!important;min-width:0!important;max-width:none!important}
  html.pem-enterprise-ui .pem-release-pyramid-card{min-width:0!important;max-width:none!important;width:100%!important;height:auto!important}
  html.pem-enterprise-ui .pem-release-pyramid-tier:nth-child(n){width:100%!important}
  html.pem-enterprise-ui .pem-record-summary{grid-auto-flow:row!important;grid-template-columns:repeat(2,minmax(0,174px))!important;width:100%!important}
}
@media(max-width:620px){
  html.pem-enterprise-ui .pem-dashboard-kpis .pem-release-kpi-grid{grid-template-columns:1fr!important}
  html.pem-enterprise-ui .pem-record-summary{grid-template-columns:1fr!important}
  html.pem-enterprise-ui .pem-summary-metric{width:100%!important;min-width:0!important;max-width:none!important}
  html.pem-enterprise-ui .pem-dashboard-filter-bar select{min-width:0!important}
}

/* Final responsive closure: compact record summaries must wrap instead of widening the page. */
@media(max-width:1180px) and (min-width:901px){
  html.pem-enterprise-ui .pem-record-summary{
    grid-auto-flow:row!important;
    grid-auto-columns:auto!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:100%!important;
    max-width:100%!important;
  }
  html.pem-enterprise-ui .pem-record-summary>.pem-summary-metric{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
  }
}

/* Standard 768px viewport must enter the mobile navigation/list contract. */
@media(max-width:800px){
  html.pem-enterprise-ui body:not(.pem-standalone-shell){padding-bottom:72px!important}
  html.pem-enterprise-ui .mobile-nav{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    position:fixed!important;
    z-index:50!important;
    bottom:0!important;left:0!important;right:0!important;
    width:100vw!important;max-width:100vw!important;height:68px!important;
    background:#fff!important;border-top:1px solid var(--pem-color-border,#dfe7f0)!important;
  }
  html.pem-enterprise-ui .mobile-nav .nav-btn{
    min-width:0!important;width:100%!important;padding:6px 2px!important;
    display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;
    gap:2px!important;border-radius:0!important;font-size:11px!important;text-align:center!important;
  }
  html.pem-enterprise-ui .pem-cases-view .pem-master-detail{display:block!important}
  html.pem-enterprise-ui .pem-cases-view .pem-master-panel{display:none!important}
  html.pem-enterprise-ui .pem-cases-view .table-wrap{overflow:visible!important;border:0!important;background:transparent!important;box-shadow:none!important}
  html.pem-enterprise-ui .pem-cases-view table{display:block!important;min-width:0!important;width:100%!important}
  html.pem-enterprise-ui .pem-cases-view thead{display:none!important}
  html.pem-enterprise-ui .pem-cases-view tbody{display:grid!important;gap:10px!important}
  html.pem-enterprise-ui .pem-cases-view tbody tr{display:grid!important;grid-template-columns:1fr auto!important;gap:7px 12px!important;width:100%!important;padding:14px!important}
  html.pem-enterprise-ui .pem-cases-view tbody td{display:grid!important;grid-template-columns:106px minmax(0,1fr)!important;gap:8px!important;padding:0!important;border:0!important;min-width:0!important}
  html.pem-enterprise-ui .pem-cases-view tbody td:before{content:attr(data-label);font-size:12px;font-weight:700;color:#5b6f84}
  html.pem-enterprise-ui .pem-cases-view tbody td:nth-child(1),
  html.pem-enterprise-ui .pem-cases-view tbody td:nth-child(3){grid-column:1/-1}
  html.pem-enterprise-ui .pem-cases-view tbody td:nth-child(4),
  html.pem-enterprise-ui .pem-cases-view tbody td:nth-child(5),
  html.pem-enterprise-ui .pem-cases-view tbody td:nth-child(6),
  html.pem-enterprise-ui .pem-cases-view tbody td:nth-child(8),
  html.pem-enterprise-ui .pem-cases-view tbody td:nth-child(9),
  html.pem-enterprise-ui .pem-cases-view tbody td:nth-child(10){display:none!important}
}


/* BRAND HOTFIX: canonical full PEM SySO lockup on expanded desktop shells. */
@media (min-width:901px){
  html.pem-enterprise-ui:not(.pem-sidebar-collapsed) .sidebar>.brand,
  html.pem-enterprise-ui:not(.pem-sidebar-collapsed) .pem-global-brand{
    justify-content:center!important;
    min-height:72px!important;
    padding:10px 12px!important;
  }
  html.pem-enterprise-ui:not(.pem-sidebar-collapsed) .sidebar>.brand .shield,
  html.pem-enterprise-ui:not(.pem-sidebar-collapsed) .pem-global-logo{
    width:190px!important;
    min-width:190px!important;
    max-width:190px!important;
    height:52px!important;
    min-height:52px!important;
    max-height:52px!important;
    flex:0 0 190px!important;
    background:#fff url('/static/pem_syso_logo.png') center/contain no-repeat!important;
    border-radius:10px!important;
  }
  html.pem-enterprise-ui:not(.pem-sidebar-collapsed) .sidebar>.brand>div:last-child,
  html.pem-enterprise-ui:not(.pem-sidebar-collapsed) .pem-global-brand-copy{
    display:none!important;
  }
  html.pem-enterprise-ui.pem-sidebar-collapsed .sidebar>.brand .shield,
  html.pem-enterprise-ui.pem-sidebar-collapsed .pem-global-logo{
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    height:40px!important;
    min-height:40px!important;
    max-height:40px!important;
    flex:0 0 40px!important;
    background:#fff url('/static/pem_syso_mark.png') center/contain no-repeat!important;
  }
}

/* Canonical dashboard KPI links: visually identical to non-link KPI cards. */
html.pem-enterprise-ui .pem-dashboard-kpis a.pem-release-extra-kpi,
html.pem-enterprise-ui .pem-dashboard-kpis a.pem-release-extra-kpi:hover,
html.pem-enterprise-ui .pem-dashboard-kpis a.pem-release-extra-kpi:focus,
html.pem-enterprise-ui .pem-dashboard-kpis a.pem-release-extra-kpi *{
  text-decoration:none!important;
}


/* Canonical reports KPI strip: single-row desktop, semantic dashboard tones, no help glyphs. */
html.pem-enterprise-ui body.pem-route-reports #metrics .pem-approved-info,
html.pem-enterprise-ui body.pem-route-reports #metrics .metric-help,
html.pem-enterprise-ui body.pem-route-reports #metrics .pem-help-trigger{display:none!important}
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-red>b{color:#b3261e!important}
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-amber>b{color:#9a6a00!important}
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-green>b{color:#176b3a!important}
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-blue>b{color:#245c98!important}
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-neutral>b{color:#5f6f80!important}
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-red,
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-amber,
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-green,
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-blue,
html.pem-enterprise-ui body.pem-route-reports #metrics>.metric.pem-report-neutral{background:#fff!important;border-color:#e0e7ef!important}
@media(min-width:1181px){
  html.pem-enterprise-ui body.pem-route-reports #metrics.metrics{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;width:100%!important;max-width:100%!important;gap:8px!important}
  html.pem-enterprise-ui body.pem-route-reports #metrics>.metric{box-sizing:border-box!important;width:auto!important;min-width:0!important;max-width:none!important;height:76px!important;min-height:76px!important;padding:8px 9px!important;display:grid!important;grid-template-rows:minmax(24px,auto) 1fr!important;align-content:stretch!important}
  html.pem-enterprise-ui body.pem-route-reports #metrics>.metric>span{font-size:10.5px!important;line-height:1.1!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
  html.pem-enterprise-ui body.pem-route-reports #metrics>.metric>b{margin:0!important;display:grid!important;place-items:center!important;text-align:center!important;font-size:23px!important;line-height:1!important;white-space:nowrap!important}
}


/* Canonical Legal/Competencies semantic KPI number tones. */
html.pem-enterprise-ui body.pem-route-legal .metric.pem-legal-red>b,
html.pem-enterprise-ui body.pem-route-legal .pem-summary-metric.pem-legal-red>b{color:#b3261e!important}
html.pem-enterprise-ui body.pem-route-legal .metric.pem-legal-amber>b,
html.pem-enterprise-ui body.pem-route-legal .pem-summary-metric.pem-legal-amber>b{color:#9a6a00!important}
html.pem-enterprise-ui body.pem-route-legal .metric.pem-legal-green>b,
html.pem-enterprise-ui body.pem-route-legal .pem-summary-metric.pem-legal-green>b{color:#176b3a!important}
html.pem-enterprise-ui body.pem-route-legal .metric.pem-legal-blue>b,
html.pem-enterprise-ui body.pem-route-legal .pem-summary-metric.pem-legal-blue>b{color:#245c98!important}
html.pem-enterprise-ui body.pem-route-legal .metric.pem-legal-neutral>b,
html.pem-enterprise-ui body.pem-route-legal .pem-summary-metric.pem-legal-neutral>b{color:#5f6f80!important}


/* Canonical dashboard entry: hide intermediate base render until release normalization is complete. */
html.pem-enterprise-ui #view.pem-dashboard-settling .pem-dashboard-view{
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

html.pem-enterprise-ui body.pem-route-indicators .indicator-layout>aside.side-stack>.card{margin:0!important;min-height:0!important}
html.pem-enterprise-ui body.pem-route-indicators .indicator-layout>aside.side-stack>.card:first-child{margin-top:0!important}

/* Presentation-only semantic tones and Spanish native upload overlay. */
html.pem-enterprise-ui .pem-summary-metric.tone-orange>b{color:#9a6a00!important}
html.pem-enterprise-ui .indicator-summary .metric.pem-motion-neutral>b{color:#5f6f80!important}
.pem-file-control{position:relative;display:flex;align-items:center;gap:12px;min-height:40px;border:1px solid #cbd5df;border-radius:9px;padding:6px;background:#fff}
.pem-file-select{display:inline-flex;padding:7px 12px;border-radius:6px;background:#eef5ff;color:#173d67;font-weight:700;white-space:nowrap}
.pem-file-name{color:#607080;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pem-file-control>input[type=file]{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;cursor:pointer}
.pem-file-control:focus-within{outline:2px solid #1266bd;outline-offset:2px}

html.pem-enterprise-ui body.pem-route-plan #summary>.kpi:first-child b{color:#245c98!important}
html.pem-enterprise-ui body.pem-route-ppe .kpi .pem-approved-info,
html.pem-enterprise-ui body.pem-route-ppe .metric .pem-approved-info,
html.pem-enterprise-ui body.pem-route-ppe .kpi .metric-help,
html.pem-enterprise-ui body.pem-route-ppe .metric .metric-help{display:none!important}
.pem-validity-loading{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px 0;min-height:92px}
.pem-validity-loading>span{display:block;border:1px solid #e1e7ef;border-radius:10px;background:linear-gradient(#f8fafc,#eef3f7)}

/* A tab hidden by its controller must stay out of layout. */
html.pem-enterprise-ui body #riskSection[hidden],
html.pem-enterprise-ui body #capaSection[hidden]{display:none!important}

html.pem-enterprise-ui body #uatGate[hidden],
html.pem-enterprise-ui body #uatWorkspace[hidden]{display:none!important}
html.pem-enterprise-ui body #uatWorkspace .hero h1,
html.pem-enterprise-ui body #uatGate .hero h1{color:#fff!important}