/* ===================================================================
 * qc-management.css — Portfolio Health (Phase C) view styles.
 *
 * Scoped under #reportSectionOverview to avoid leaking.
 * Tokens-only: var(--color-*), var(--font-size-*), var(--space-*),
 *              var(--radius-*), var(--chart-*), var(--c-*-*).
 * No raw hex. No raw px font-sizes.
 * =================================================================== */

@layer features {

/* ── Portfolio view layout ─────────────────────────────────────── */

#reportSectionOverview .phv-header-card {
  padding: var(--space-5) var(--space-6);
  margin-bottom: var(--space-4);
  overflow: visible;
}

#reportSectionOverview .phv-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-4);
  margin-bottom: var(--space-4);
}

#reportSectionOverview .phv-bottom-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
  margin-top: var(--space-4);
}

/* ── Header card ───────────────────────────────────────────────── */

#reportSectionOverview .phv-h1 {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-medium);
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--color-text-primary);
}

#reportSectionOverview .phv-sub {
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm);
  margin: var(--space-1) 0 0;
}

/* ── KPI card ──────────────────────────────────────────────────── */

#reportSectionOverview .phv-kpi-card {
  padding: var(--space-5);
  overflow: visible;
}

#reportSectionOverview .phv-kpi-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

#reportSectionOverview .phv-lab {
  font-size: var(--font-size-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  font-weight: var(--font-weight-medium);
  margin: 0;
}

#reportSectionOverview .phv-num {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-medium);
  letter-spacing: -0.02em;
  line-height: 1.05;
  margin: var(--space-2) 0 0;
  color: var(--color-text-primary);
}

#reportSectionOverview .phv-num-sup {
  font-size: var(--font-size-lg);
  color: var(--color-text-muted);
  font-weight: var(--font-weight-regular);
}

#reportSectionOverview .phv-cap {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  margin: var(--space-2) 0 0;
}

#reportSectionOverview .phv-chip-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  margin-top: var(--space-3);
  font-size: var(--font-size-xs);
}

/* ── Icon boxes ────────────────────────────────────────────────── */

#reportSectionOverview .phv-ic {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

#reportSectionOverview .phv-ic svg {
  width: 21px;
  height: 21px;
  stroke-width: 1.8;
}

#reportSectionOverview .phv-ic-brand { background: var(--c-brand-50);         color: var(--c-brand-500); }
#reportSectionOverview .phv-ic-ok    { background: var(--color-success-bg);    color: var(--color-success-text); }
#reportSectionOverview .phv-ic-warn  { background: var(--color-warning-bg);    color: var(--color-warning-text); }
#reportSectionOverview .phv-ic-err   { background: var(--color-danger-bg);     color: var(--color-danger-text); }

/* ── Status chips ──────────────────────────────────────────────── */

#reportSectionOverview .phv-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-regular);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-full);
  white-space: nowrap;
}

#reportSectionOverview .phv-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}

#reportSectionOverview .phv-chip.c-ok   { background: var(--color-success-bg); color: var(--color-success-text); }
#reportSectionOverview .phv-chip.c-warn { background: var(--color-warning-bg); color: var(--color-warning-text); }
#reportSectionOverview .phv-chip.c-err  { background: var(--color-danger-bg);  color: var(--color-danger-text); }
#reportSectionOverview .phv-chip.c-d    { background: var(--c-neutral-100);    color: var(--color-text-secondary); }

/* ── Section icon ──────────────────────────────────────────────── */

#reportSectionOverview .phv-si {
  width: 28px;
  height: 28px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--c-brand-50);
  color: var(--c-brand-500);
  flex-shrink: 0;
}

#reportSectionOverview .phv-si.phv-si-err {
  background: var(--color-danger-bg);
  color: var(--color-danger-text);
}

#reportSectionOverview .phv-si svg {
  width: 16px;
  height: 16px;
  stroke-width: 1.8;
}

/* ── Section header ────────────────────────────────────────────── */

#reportSectionOverview .phv-sec-h {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0 0 var(--space-1);
}

#reportSectionOverview .phv-sec-title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  margin: 0;
  color: var(--color-text-primary);
}

#reportSectionOverview .phv-sec-sub {
  color: var(--color-text-muted);
  font-size: var(--font-size-xs);
  margin: 0 0 var(--space-4) var(--space-10);
}

/* ── Scorecard card ────────────────────────────────────────────── */

#reportSectionOverview .phv-scorecard {
  padding: var(--space-5) var(--space-6);
  overflow: visible;
}

#reportSectionOverview .phv-table-wrap {
  overflow-x: auto;
  margin-top: var(--space-2);
}

/* ── Table shared ──────────────────────────────────────────────── */

#reportSectionOverview .phv-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: var(--font-size-sm);
}

#reportSectionOverview .phv-table th {
  text-align: left;
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
  font-weight: var(--font-weight-medium);
  padding: var(--space-3);
  border-bottom: 1px solid var(--color-border-default);
  white-space: nowrap;
}

#reportSectionOverview .phv-table td {
  padding: var(--space-3);
  border-bottom: 1px solid var(--color-border-subtle);
  vertical-align: middle;
}

#reportSectionOverview .phv-table tr:last-child td {
  border-bottom: none;
}

#reportSectionOverview .phv-table tbody tr:hover td {
  background: var(--color-bg-surface-alt);
}

/* ── Scorecard row ─────────────────────────────────────────────── */

#reportSectionOverview .phv-sc-row {
  cursor: pointer;
}

/* ── Link style ────────────────────────────────────────────────── */

#reportSectionOverview .phv-lk {
  color: var(--c-brand-500);
  font-weight: var(--font-weight-regular);
  text-decoration: none;
  cursor: pointer;
}

#reportSectionOverview .phv-lk:hover {
  text-decoration: underline;
}

/* ── Muted text ────────────────────────────────────────────────── */

#reportSectionOverview .phv-mut {
  color: var(--color-text-muted);
}

/* ── Recommended action cell ───────────────────────────────────── */

#reportSectionOverview .phv-rec-text {
  color: var(--color-text-secondary);
  font-size: var(--font-size-xs);
  max-width: 240px;
}

/* ── Capability score + mini-bar cell ──────────────────────────── */

#reportSectionOverview .phv-cap-cell {
  min-width: 64px;
}

#reportSectionOverview .phv-cap-score {
  font-variant-numeric: tabular-nums;
  font-weight: var(--font-weight-medium);
}

#reportSectionOverview .phv-barmini {
  height: 5px;
  border-radius: var(--radius-sm);
  background: var(--c-neutral-100);
  overflow: hidden;
  margin-top: var(--space-1);
  width: 64px;
}

#reportSectionOverview .phv-barmini i {
  display: block;
  height: 100%;
  border-radius: var(--radius-sm);
}

/* ── Sparkline cell (trend column) ────────────────────────────── */

#reportSectionOverview .phv-spark-cell {
  display: inline-block;
  line-height: 0;
  vertical-align: middle;
}

/* ── Bottom panels (risks / attention) ─────────────────────────── */

#reportSectionOverview .phv-bottom-card {
  padding: var(--space-5) var(--space-6);
  overflow: visible;
}

#reportSectionOverview .phv-risk-table {
  margin-top: var(--space-2);
}

/* ── Empty state ───────────────────────────────────────────────── */

#reportSectionOverview .phv-empty {
  text-align: center;
  padding: var(--space-5);
  color: var(--color-text-muted);
  font-size: var(--font-size-xs);
}

/* ── Margin-top utility classes (replaces inline styles in templates) ── */

#reportSectionOverview .phv-mt-2 { margin-top: var(--space-2); }
#reportSectionOverview .phv-mt-3 { margin-top: var(--space-3); }


/* ── Quality Intelligence (drill-down) view ─────────────────────── */

/* Spacing helpers */
#reportSectionOverview .qi-mt  { margin-top: var(--space-4); }
#reportSectionOverview .qi-mt6 { margin-top: var(--space-6); }

/* Layout grids */
#reportSectionOverview .qi-grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}
#reportSectionOverview .qi-grid3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-4);
}
#reportSectionOverview .qi-grid4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-4);
}

/* Row helpers */
#reportSectionOverview .qi-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}

/* ── Project header ────────────────────────────────────────────────── */

#reportSectionOverview .qi-proj-header {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-2);
  padding: var(--space-5) var(--space-6);
  margin-bottom: var(--space-4);
  overflow: visible;
}
/* Back-link sits top-left, out of the centered flow (plain link, no button chrome). */
#reportSectionOverview .qi-proj-header .qi-back {
  position: absolute;
  top: var(--space-4);
  left: var(--space-5);
}
#reportSectionOverview .qi-proj-header > div:not(.qi-hero-gauge) {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
}
#reportSectionOverview .qi-proj-header .qi-role-seg { align-self: center; }

#reportSectionOverview .qi-back {
  color: var(--c-brand-500);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-regular);
  text-decoration: none;
  cursor: pointer;
  border: none;
  background: none;
  padding: 0;
}

#reportSectionOverview .qi-back:hover {
  text-decoration: underline;
}

#reportSectionOverview .qi-proj-name {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-medium);
  letter-spacing: -0.02em;
  margin: var(--space-2) 0 0;
  color: var(--color-text-primary);
}

#reportSectionOverview .qi-proj-sub {
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm);
  margin: var(--space-1) 0 0;
}

#reportSectionOverview .qi-score-big {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-medium);
  letter-spacing: -0.02em;
  line-height: 1.05;
  margin: 0;
  color: var(--color-text-primary);
}

#reportSectionOverview .qi-score-denom {
  font-size: var(--font-size-lg);
  color: var(--color-text-muted);
  font-weight: var(--font-weight-regular);
}

/* ── Executive summary ─────────────────────────────────────────────── */

#reportSectionOverview .qi-exec-card {
  padding: var(--space-5) var(--space-6);
  overflow: visible;
}

#reportSectionOverview .qi-exec-text {
  margin: 0;
  font-size: var(--font-size-sm);
  line-height: 1.65;
  color: var(--color-text-primary);
}

#reportSectionOverview .qi-exec-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-3);
  margin-top: var(--space-3);
}

#reportSectionOverview .qi-loading {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--color-text-muted);
  font-size: var(--font-size-xs);
}

#reportSectionOverview .qi-regen-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  border: 1px solid var(--color-border-default);
  background: var(--color-bg-surface);
  color: var(--color-text-secondary);
  border-radius: var(--radius-md);
  padding: var(--space-1) var(--space-3);
  font-size: var(--font-size-xs);
  cursor: pointer;
  font-family: inherit;
}

#reportSectionOverview .qi-regen-btn:hover {
  background: var(--color-bg-surface-alt);
}

#reportSectionOverview .qi-regen-btn svg {
  width: 13px;
  height: 13px;
  stroke-width: 1.8;
}

/* ── Quality Trend card ────────────────────────────────────────────── */

#reportSectionOverview .qi-trend-card {
  padding: var(--space-5) var(--space-6);
  overflow: visible;
}

/* Small-multiple trend tiles */
#reportSectionOverview .qi-smt {
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4);
}

#reportSectionOverview .qi-smt-lab {
  font-size: var(--font-size-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  font-weight: var(--font-weight-medium);
  margin: 0;
}

#reportSectionOverview .qi-smt-val {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-medium);
  line-height: 1;
  color: var(--color-text-primary);
}

#reportSectionOverview .qi-smt-row {
  display: flex;
  align-items: flex-end;
  gap: var(--space-2);
  margin-top: var(--space-2);
}
/* value takes the left, delta + projection chips sit to the right */
#reportSectionOverview .qi-smt-val { margin-right: auto; }

/* Predictive projection badge on a trend tile ("⌁→48"). */
#reportSectionOverview .qi-smt-proj {
  display: inline-flex;
  align-items: center;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  padding: 2px var(--space-2);
  border-radius: var(--radius-sm);
  color: var(--color-text-secondary);
  background: var(--c-neutral-100);
  border: 1px dashed var(--color-border-default);
  white-space: nowrap;
  cursor: default;
}
#reportSectionOverview .qi-smt-proj--warn {
  color: var(--color-danger-text);
  background: var(--color-danger-bg);
  border-color: var(--color-danger-text);
}

#reportSectionOverview .qi-smt-spark {
  margin-top: var(--space-3);
  line-height: 0;
}

/* ── Capability Model ──────────────────────────────────────────────── */

#reportSectionOverview .qi-cap-lab {
  font-size: var(--font-size-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  font-weight: var(--font-weight-medium);
  margin: var(--space-6) 0 var(--space-3) var(--space-1);
}

#reportSectionOverview .qi-cap-card {
  padding: var(--space-5) var(--space-6);
  overflow: visible;
}

#reportSectionOverview .qi-cap-desc {
  color: var(--color-text-muted);
  font-size: var(--font-size-xs);
  margin: var(--space-2) 0 0 37px;
}

/* Sub-metric bars */
#reportSectionOverview .qi-sm {
  margin-top: var(--space-3);
}

#reportSectionOverview .qi-smr {
  display: flex;
  justify-content: space-between;
  font-size: var(--font-size-xs);
  margin-bottom: var(--space-1);
  color: var(--color-text-secondary);
}

#reportSectionOverview .qi-smr .qi-v {
  color: var(--color-text-primary);
  font-variant-numeric: tabular-nums;
}

#reportSectionOverview .qi-smbar {
  height: 6px;
  border-radius: var(--radius-sm);
  background: var(--c-neutral-100);
  overflow: hidden;
  margin-bottom: var(--space-3);
}

#reportSectionOverview .qi-smbar i {
  display: block;
  height: 100%;
  border-radius: var(--radius-sm);
}

/* Clickable capability metric row — opens the "why this number" drill-down. */
#reportSectionOverview .qi-metric {
  margin: 0 calc(-1 * var(--space-2)) var(--space-2);
  padding: var(--space-2) var(--space-2) var(--space-1);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background 0.12s ease;
}
#reportSectionOverview .qi-metric:hover {
  background: var(--c-neutral-50);
}
#reportSectionOverview .qi-metric:focus-visible {
  background: var(--c-neutral-50);
  outline: none;
  box-shadow: 0 0 0 2px var(--c-brand-200);
}
#reportSectionOverview .qi-metric .qi-smbar {
  margin-bottom: var(--space-1);
}
#reportSectionOverview .qi-smr-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#reportSectionOverview .qi-smr-vt {
  display: inline-flex;
  gap: var(--space-1);
  align-items: baseline;
  white-space: nowrap;
  flex-shrink: 0;
}
#reportSectionOverview .qi-smr-target {
  color: var(--color-text-muted);
}
#reportSectionOverview .qi-smr-cap {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  text-align: right;
}

/* Count-style sub-metric row (chip on right) */
#reportSectionOverview .qi-smr-chip {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--font-size-xs);
  margin-bottom: var(--space-3);
  color: var(--color-text-secondary);
}

/* Deferred / null metric */
#reportSectionOverview .qi-deferred {
  opacity: 0.55;
  font-style: italic;
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

/* Suggested improvement box */
#reportSectionOverview .qi-suggest {
  margin-top: var(--space-3);
  padding: var(--space-3) var(--space-3);
  background: var(--c-brand-50);
  border-radius: var(--radius-md);
  font-size: var(--font-size-xs);
  color: var(--color-text-secondary);
  line-height: 1.5;
}

/* ── Improvement driver items ──────────────────────────────────────── */

#reportSectionOverview .qi-drv {
  display: flex;
  gap: var(--space-3);
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--color-border-subtle);
}

#reportSectionOverview .qi-drv:last-child {
  border: none;
}

#reportSectionOverview .qi-drv-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}

#reportSectionOverview .qi-drv-icon svg {
  width: 13px;
  height: 13px;
  stroke-width: 2.2;
}

#reportSectionOverview .qi-drv-icon.ic-ok {
  background: var(--color-success-bg);
  color: var(--color-success-text);
}

#reportSectionOverview .qi-drv-icon.ic-err {
  background: var(--color-danger-bg);
  color: var(--color-danger-text);
}

#reportSectionOverview .qi-drv-text {
  font-size: var(--font-size-sm);
  line-height: 1.5;
  color: var(--color-text-primary);
}

#reportSectionOverview .qi-drv-text b {
  font-weight: var(--font-weight-medium);
}

#reportSectionOverview .qi-drv-impact {
  color: var(--color-text-muted);
}

/* ── Current risks ─────────────────────────────────────────────────── */

#reportSectionOverview .qi-risk {
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--color-border-subtle);
}

#reportSectionOverview .qi-risk:last-child {
  border: none;
}

#reportSectionOverview .qi-risk-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-2);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
}

#reportSectionOverview .qi-risk-grid {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: var(--space-1) var(--space-3);
  font-size: var(--font-size-xs);
}

#reportSectionOverview .qi-risk-k {
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

/* ── Detailed metrics accordion ────────────────────────────────────── */

#reportSectionOverview .qi-acc {
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-lg);
  background: var(--color-bg-surface);
}

#reportSectionOverview .qi-acc summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-4) var(--space-5);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-sm);
  color: var(--color-text-primary);
}

#reportSectionOverview .qi-acc summary::-webkit-details-marker {
  display: none;
}

#reportSectionOverview .qi-acc-body {
  padding: 0 var(--space-5) var(--space-4);
  border-top: 1px solid var(--color-border-subtle);
}

/* ══ Quality Intelligence redesign (qiv-*) ═══════════════════════════════ */

/* Hero: Quality Confidence headline + pillar tiles */
#reportSectionOverview .qiv-hero {
  display: flex;
  align-items: stretch;
  gap: var(--space-6);
  padding: var(--space-5) var(--space-6);
  margin-bottom: var(--space-4);
}
#reportSectionOverview .qiv-hero-score {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-right: var(--space-6);
  border-right: 1px solid var(--color-border-subtle);
  min-width: 140px;
}
#reportSectionOverview .qiv-hero-num {
  font-size: var(--font-size-3xl, 2rem);
  font-weight: var(--font-weight-semibold);
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--color-text-primary);
  margin-bottom: var(--space-2);
}
#reportSectionOverview .qiv-hero-sup {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-regular);
  color: var(--color-text-secondary);
}
#reportSectionOverview .qiv-hero-side { flex: 1; display: flex; flex-direction: column; justify-content: center; }
#reportSectionOverview .qiv-hero-headline {
  font-size: var(--font-size-base);
  color: var(--color-text-primary);
  margin: 0 0 var(--space-4);
}
#reportSectionOverview .qiv-ptile-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
}
#reportSectionOverview .qiv-ptile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  padding: var(--space-3) var(--space-2) var(--space-4);
  background: var(--c-neutral-50, var(--color-surface-sunken, transparent));
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
}
#reportSectionOverview .qiv-ptile .qi-gauge { max-width: 82px; }
#reportSectionOverview .qiv-ptile-lab {
  font-size: var(--font-size-xs);
  color: var(--color-text-secondary);
  margin: 0;
}
#reportSectionOverview .qiv-ptile-score { margin: 0; }

/* Risk Concentration band */
#reportSectionOverview .qiv-risk-band {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-5);
  margin-bottom: var(--space-4);
  border-left: 3px solid var(--color-danger-text, var(--chart-err));
}
#reportSectionOverview .qiv-risk-ic { flex-shrink: 0; }
#reportSectionOverview .qiv-risk-k {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-secondary);
  margin: 0 0 var(--space-1);
}
#reportSectionOverview .qiv-risk-msg { margin: 0; font-size: var(--font-size-sm); color: var(--color-text-primary); }

/* Confidence Waterfall */
/* .ds-card has NO intrinsic padding in this design system — every Overview card
   must set its own. These two were bare ds-cards, so their content sat flush to
   the edges. */
#reportSectionOverview .qiv-wf-card { padding: var(--space-5) var(--space-6); }
#reportSectionOverview .qi-db-card  { padding: var(--space-5) var(--space-6); }
#reportSectionOverview .qiv-wf { display: flex; flex-direction: column; gap: 2px; }
#reportSectionOverview .qiv-wf-row {
  display: grid;
  grid-template-columns: minmax(150px, 1.1fr) minmax(120px, 2fr) 4ch 3ch;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-2) 0;
  font-size: var(--font-size-sm);
}
#reportSectionOverview .qiv-wf-lab { color: var(--color-text-primary); }
/* running-total bar per step: baseline/final are solid, deductions show the removed segment in red */
#reportSectionOverview .qiv-wf-track {
  position: relative; height: 12px; border-radius: 6px; overflow: hidden;
  background: var(--c-neutral-100, #f1f1ef);
}
#reportSectionOverview .qiv-wf-bar { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px; }
#reportSectionOverview .qiv-wf-bar--base,
#reportSectionOverview .qiv-wf-bar--final { background: var(--chart-status-good, #2e7d32); }
#reportSectionOverview .qiv-wf-bar--run  { background: var(--c-neutral-300, #cfcfca); }
#reportSectionOverview .qiv-wf-drop { position: absolute; top: 0; bottom: 0; background: var(--chart-status-bad, #d32f2f); opacity: 0.75; }
#reportSectionOverview .qiv-wf-delta { font-size: var(--font-size-xs); text-align: right; }
#reportSectionOverview .qiv-wf-delta--down { color: var(--color-danger-text, var(--chart-err)); }
#reportSectionOverview .qiv-wf-delta--base { color: var(--color-text-secondary); }
#reportSectionOverview .qiv-wf-val { text-align: right; font-weight: var(--font-weight-medium); color: var(--color-text-primary); }
#reportSectionOverview .qiv-wf-row--final {
  border-top: 1px solid var(--color-border);
  margin-top: var(--space-1);
  padding-top: var(--space-3);
}
#reportSectionOverview .qiv-wf-row--final .qiv-wf-lab { font-weight: var(--font-weight-semibold); }
#reportSectionOverview .qiv-wf-row--final .qiv-wf-val { font-size: var(--font-size-lg); }

/* Cleared / unknown gate chips */
#reportSectionOverview .qiv-gate-row {
  display: flex; flex-wrap: wrap; gap: var(--space-2);
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border-subtle);
}
#reportSectionOverview .qiv-gate {
  display: inline-flex; align-items: center; gap: var(--space-1);
  font-size: var(--font-size-xs); padding: 2px var(--space-2);
  border-radius: var(--radius-full); color: var(--color-text-secondary);
}
#reportSectionOverview .qiv-gate--pass { background: var(--color-success-bg); color: var(--color-success-text); }
#reportSectionOverview .qiv-gate--unknown { background: var(--c-neutral-100); }
#reportSectionOverview .qiv-gate--pass .phv-dot { background: var(--color-success-text); }

/* Quantified insights */
#reportSectionOverview .qiv-insight {
  display: flex; align-items: baseline; gap: var(--space-3);
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--color-border-subtle);
}
#reportSectionOverview .qiv-insight:last-child { border-bottom: none; }
#reportSectionOverview .qiv-insight-msg { flex: 1; font-size: var(--font-size-sm); color: var(--color-text-primary); }
#reportSectionOverview .qiv-insight-delta {
  font-size: var(--font-size-xs); font-weight: var(--font-weight-medium);
  color: var(--color-success-text); white-space: nowrap;
}

/* Data-provenance badges */
#reportSectionOverview .qiv-badge {
  display: inline-block; font-size: 9px; line-height: 1.4;
  padding: 0 5px; border-radius: var(--radius-full);
  text-transform: uppercase; letter-spacing: 0.03em;
  vertical-align: middle;
}
#reportSectionOverview .qiv-badge--partial { background: var(--color-warning-bg); color: var(--color-warning-text); }
#reportSectionOverview .qiv-badge--roadmap { background: var(--c-neutral-100); color: var(--color-text-secondary); }

/* Static (non-drillable) metric row: no hover affordance */
#reportSectionOverview .qi-metric--static { cursor: default; }
#reportSectionOverview .qi-metric--static:hover { background: none; }

/* ── Detail lens: Executive | Team segmented control ───────────────────── */
#reportSectionOverview .qi-role-seg {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  border-radius: var(--radius-md);
  background: var(--c-neutral-100);
  border: 1px solid var(--color-border-default);
}
#reportSectionOverview .qi-role-opt {
  appearance: none;
  border: none;
  background: transparent;
  cursor: pointer;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-sm);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  line-height: 1.6;
}
#reportSectionOverview .qi-role-opt:hover { color: var(--color-text-primary); }
#reportSectionOverview .qi-role-opt.is-active {
  background: var(--color-surface-default, #fff);
  color: var(--color-text-primary);
  box-shadow: var(--shadow-xs, 0 1px 2px rgba(0,0,0,0.08));
}
/* Team-only depth is hidden in the Executive lens (and vice-versa). Team-only
   content stays hidden until a panel is explicitly in the Team lens, so it is
   also hidden on first paint before the role class is applied. */
#qaOvPortfolio:not(.qi-role-team) .qi-team-only,
#qaOvSingle:not(.qi-role-team) .qi-team-only { display: none; }
#qaOvPortfolio.qi-role-team .qi-exec-only,
#qaOvSingle.qi-role-team .qi-exec-only { display: none; }

/* ── Executive lens: the Decision brief ────────────────────────────────── */
#reportSectionOverview .qi-db-verdict {
  font-size: var(--font-size-base);
  line-height: 1.55;
  color: var(--color-text-primary);
  margin: 0 0 var(--space-4);
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  flex-wrap: wrap;
}
#reportSectionOverview .qi-db-h {
  font-size: var(--font-size-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  font-weight: var(--font-weight-medium);
  margin: 0 0 var(--space-2);
}
#reportSectionOverview .qi-db-focus { list-style: none; margin: 0 0 var(--space-4); padding: 0; }
#reportSectionOverview .qi-db-focus li {
  padding: var(--space-2) 0 var(--space-2) var(--space-4);
  border-left: 3px solid var(--color-border-strong, var(--color-text-muted));
  margin-bottom: var(--space-2);
}
#reportSectionOverview .qi-db-focus-high { border-left-color: var(--color-danger-text); }
#reportSectionOverview .qi-db-focus-med  { border-left-color: var(--color-warning-text); }
#reportSectionOverview .qi-db-focus-low  { border-left-color: var(--color-border-strong, var(--color-text-muted)); }
#reportSectionOverview .qi-db-driver-lab { display: block; color: var(--color-text-primary); }
#reportSectionOverview .qi-db-none { color: var(--color-success-text); margin: 0 0 var(--space-4); }
#reportSectionOverview .qi-db-bottom {
  margin: 0;
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border-subtle);
  color: var(--color-text-primary);
}
#reportSectionOverview .qi-db-bottom-k {
  display: inline-block;
  font-size: var(--font-size-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  font-weight: var(--font-weight-medium);
  margin-right: var(--space-2);
}

/* Executive pillar orientation strip */
#reportSectionOverview .qi-pstrip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
  margin-top: var(--space-5);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border-subtle);
}
#reportSectionOverview .qi-pstrip-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-1); }
#reportSectionOverview .qi-pstrip-item .qi-gauge { max-width: 82px; }
#reportSectionOverview .qi-pstrip-lab { font-size: var(--font-size-xs); color: var(--color-text-secondary); }

/* ── Chart primitives: radial gauge + bullet meter ─────────────────────── */
#reportSectionOverview .qi-gauge { display: block; width: 100%; height: auto; }
#reportSectionOverview .qi-gauge-val { font-weight: var(--font-weight-semibold); font-family: inherit; letter-spacing: -0.01em; }
#reportSectionOverview .qi-gauge-lab { fill: var(--color-text-muted); font-weight: var(--font-weight-medium); }

/* project-header hero gauge */
#reportSectionOverview .qi-hero-gauge { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); }
#reportSectionOverview .qi-hero-gauge .qi-gauge { max-width: 132px; }
#reportSectionOverview .qiv-hero-score .qi-gauge { max-width: 150px; }

/* Meter: ONE colour signal (the value bar, coloured by status) on a neutral
   track + a "goalpost" target marker. No competing background zones. */
#reportSectionOverview .qi-meter { margin-top: var(--space-2); padding-top: 5px; }
#reportSectionOverview .qi-meter-track {
  position: relative; height: 10px; border-radius: 5px;
  background: var(--c-neutral-100, #efefec);
}
#reportSectionOverview .qi-meter-fill {
  position: absolute; left: 0; top: 0; bottom: 0; border-radius: 5px; min-width: 4px;
}
/* target goalpost: a dark line through the track with a caret above it, ringed in
   the surface colour so it stays visible even when the value bar sits under it. */
#reportSectionOverview .qi-meter-target {
  position: absolute; top: -3px; bottom: -3px; width: 2px; border-radius: 1px;
  background: var(--color-text-secondary, #555);
  box-shadow: 0 0 0 1.5px var(--color-bg-surface, #fff);
}
#reportSectionOverview .qi-meter-target::before {
  content: ""; position: absolute; top: -5px; left: 50%; transform: translateX(-50%);
  border-left: 4px solid transparent; border-right: 4px solid transparent;
  border-top: 5px solid var(--color-text-secondary, #555);
}
/* when the value meets/beats the target, tint the goalpost success-green */
#reportSectionOverview .qi-meter-target--met { background: var(--chart-status-good, #2e7d32); }
#reportSectionOverview .qi-meter-target--met::before { border-top-color: var(--chart-status-good, #2e7d32); }

/* Metric story ⓘ affordance (carries the ds-popover) */
#reportSectionOverview .qi-info {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1px solid var(--color-border-default);
  color: var(--color-text-muted);
  font-size: 10px;
  font-style: italic;
  font-weight: var(--font-weight-medium);
  line-height: 1;
  cursor: help;
  vertical-align: middle;
  flex-shrink: 0;
}
#reportSectionOverview .qi-info:hover { color: var(--color-text-primary); border-color: var(--color-text-secondary); }

/* "Supporting detail" divider — demoted diagnostic metrics inside a pillar card */
#reportSectionOverview .qi-sm-divider {
  font-size: var(--font-size-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin: var(--space-3) 0 var(--space-2);
  padding-top: var(--space-2);
  border-top: 1px dashed var(--color-border-subtle);
}

/* ══ P0 exec-polish: elevation · delta chips · headline · risk alert ══════ */
#reportSectionOverview .qi-elevated { box-shadow: var(--shadow-lg); }

/* Period-over-period delta chip */
#reportSectionOverview .qi-delta {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold);
  padding: 1px 7px; border-radius: var(--radius-full); line-height: 1.5; white-space: nowrap;
}
#reportSectionOverview .qi-delta--good { color: var(--color-success-text); background: var(--color-success-bg); }
#reportSectionOverview .qi-delta--bad  { color: var(--color-danger-text);  background: var(--color-danger-bg); }
#reportSectionOverview .qi-delta--flat { color: var(--color-text-muted);   background: var(--c-neutral-100); }
#reportSectionOverview .qiv-hero-word { display: inline-flex; align-items: center; gap: var(--space-2); }
#reportSectionOverview .phv-health-cell { display: inline-flex; align-items: center; gap: var(--space-2); }
#reportSectionOverview .qiv-ptile .qi-delta,
#reportSectionOverview .qi-pstrip-item .qi-delta { margin-top: 2px; }

/* "Today's headline" banner */
#reportSectionOverview .qi-headline {
  display: flex; flex-direction: row; align-items: center; gap: var(--space-4);
  padding: var(--space-4) var(--space-5); margin-bottom: var(--space-4);
  border-left: 4px solid var(--c-brand-500); box-shadow: var(--shadow-md);
}
#reportSectionOverview .qi-headline--green { border-left-color: var(--color-success-text); }
#reportSectionOverview .qi-headline--amber { border-left-color: var(--color-warning-text); }
#reportSectionOverview .qi-headline--red   { border-left-color: var(--color-danger-text); }
#reportSectionOverview .qi-headline-ic {
  flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--c-brand-50); color: var(--c-brand-500);
}
#reportSectionOverview .qi-headline--green .qi-headline-ic { background: var(--color-success-bg); color: var(--color-success-text); }
#reportSectionOverview .qi-headline--amber .qi-headline-ic { background: var(--color-warning-bg); color: var(--color-warning-text); }
#reportSectionOverview .qi-headline--red   .qi-headline-ic { background: var(--color-danger-bg); color: var(--color-danger-text); }
#reportSectionOverview .qi-headline-ic svg { width: 18px; height: 18px; }
#reportSectionOverview .qi-headline-txt {
  margin: 0; font-size: var(--font-size-base); line-height: 1.5;
  color: var(--color-text-primary); font-weight: var(--font-weight-medium);
}

/* Risk alert card (promoted from the footnote band) */
#reportSectionOverview .qi-risk-alert {
  display: flex; flex-direction: row; align-items: flex-start; gap: var(--space-4);
  padding: var(--space-4) var(--space-5); margin-bottom: var(--space-4);
  border-left: 4px solid var(--color-danger-text); box-shadow: var(--shadow-md);
}
#reportSectionOverview .qi-risk-alert-ic {
  flex-shrink: 0; width: 38px; height: 38px; border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  background: var(--color-danger-bg); color: var(--color-danger-text);
}
#reportSectionOverview .qi-risk-alert-ic svg { width: 20px; height: 20px; }
#reportSectionOverview .qi-risk-alert-k {
  margin: 0 0 3px; font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold);
  text-transform: uppercase; letter-spacing: .05em; color: var(--color-danger-text);
}
#reportSectionOverview .qi-risk-alert-msg { margin: 0; font-size: var(--font-size-sm); color: var(--color-text-primary); line-height: 1.5; }
#reportSectionOverview .qi-risk-alert-pct { font-size: var(--font-size-lg); font-weight: var(--font-weight-bold); color: var(--color-danger-text); }
#reportSectionOverview .qi-risk-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
#reportSectionOverview .qi-risk-chip {
  font-size: var(--font-size-xs); padding: 2px 10px; border-radius: var(--radius-full);
  background: var(--c-neutral-100); color: var(--color-text-secondary); border: 1px solid var(--color-border-subtle);
}

/* ══ P1: leaderboard · rich tiles · what-changed · hero trend ═════════════ */

/* "What changed" — two labelled groups in one card */
#reportSectionOverview .qi-wc-grid { gap: var(--space-6); }
#reportSectionOverview .qi-wc-lab {
  display: flex; align-items: center; gap: 6px; margin: 0 0 var(--space-3);
  font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold);
  text-transform: uppercase; letter-spacing: .05em;
}
#reportSectionOverview .qi-wc-lab svg { width: 15px; height: 15px; stroke-width: 2.5; }
#reportSectionOverview .qi-wc-lab--up   { color: var(--color-success-text); }
#reportSectionOverview .qi-wc-lab--down { color: var(--color-danger-text); }

/* Hero Quality-Health trend chart */
#reportSectionOverview .qi-hero-trend { margin-top: var(--space-4); min-height: 150px; }
#reportSectionOverview .qi-hero-trend svg { width: 100%; height: auto; display: block; max-height: 190px; }
#reportSectionOverview .qi-trend-sub {
  margin: var(--space-4) 0 0; font-size: var(--font-size-xs); letter-spacing: .05em;
  text-transform: uppercase; color: var(--color-text-muted); font-weight: var(--font-weight-medium);
}

/* Pillar-tile / strip mini-trend */
#reportSectionOverview .qiv-ptile-spark,
#reportSectionOverview .qi-pstrip-spark { display: block; margin-top: var(--space-1); line-height: 0; min-height: 20px; }
#reportSectionOverview .qiv-ptile-spark svg,
#reportSectionOverview .qi-pstrip-spark svg { margin: 0 auto; }

/* Scorecard leaderboard: heatmap-tinted cells + hover + trend sparkline */
#reportSectionOverview .phv-heat--red   { background: color-mix(in srgb, var(--color-danger-text) 9%, transparent); }
#reportSectionOverview .phv-heat--amber { background: color-mix(in srgb, var(--color-warning-text) 10%, transparent); }
#reportSectionOverview .phv-heat--green { background: color-mix(in srgb, var(--chart-status-good, #2e7d32) 6%, transparent); }
#reportSectionOverview .phv-sc-row { cursor: pointer; transition: background .12s ease; }
#reportSectionOverview .phv-sc-row:hover td { filter: brightness(0.96); }
#reportSectionOverview .phv-sc-row:hover .phv-lk { color: var(--c-brand-600); text-decoration: underline; }
#reportSectionOverview .phv-sc-spark { display: inline-block; line-height: 0; min-width: 80px; }

/* ══ P2 polish: restrained motion (honours reduced-motion) + sticky header ══ */
@keyframes qiRise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  #reportSectionOverview .qi-headline,
  #reportSectionOverview .qiv-hero,
  #reportSectionOverview .qi-proj-header { animation: qiRise .42s cubic-bezier(.2,.7,.3,1) both; }
  #reportSectionOverview .qi-risk-alert  { animation: qiRise .42s cubic-bezier(.2,.7,.3,1) .07s both; }
  /* hover-lift — cards feel like objects you can pick up */
  #reportSectionOverview .qi-cap-card,
  #reportSectionOverview .qiv-ptile,
  #reportSectionOverview .qi-pstrip-item { transition: transform .15s ease, box-shadow .15s ease; }
  #reportSectionOverview .qi-cap-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
  #reportSectionOverview .qiv-ptile:hover,
  #reportSectionOverview .qi-pstrip-item:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }
}
/* gauge count-up wrapper — invisible to layout so the hero centering is unchanged */
#reportSectionOverview .qi-gauge-anim { display: contents; }

/* sticky scorecard header (background covers rows scrolling under it) */
#reportSectionOverview .phv-scorecard .phv-table thead th {
  position: sticky; top: 0; z-index: 1; background: var(--color-bg-surface, #ffffff);
}

/* Responsive: collapse the pillar tiles + hero on narrow viewports */
@media (max-width: 900px) {
  #reportSectionOverview .qi-headline { align-items: flex-start; }
  #reportSectionOverview .qiv-hero { flex-direction: column; gap: var(--space-4); }
  #reportSectionOverview .qiv-hero-score { border-right: none; border-bottom: 1px solid var(--color-border-subtle); padding-right: 0; padding-bottom: var(--space-4); }
  #reportSectionOverview .qiv-ptile-grid { grid-template-columns: repeat(2, 1fr); }
  #reportSectionOverview .qi-pstrip { grid-template-columns: repeat(2, 1fr); }
}

/* Index Settings: authoritative project → primary-team registry. */
.qcis-scope-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}

.qcis-scope-rows {
  display: grid;
  gap: var(--space-2);
  margin-top: var(--space-3);
}

.qcis-scope-row {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) minmax(14rem, 1fr) auto;
  align-items: end;
  gap: var(--space-2);
}

.qcis-scope-row label {
  display: grid;
  gap: var(--space-1);
  color: var(--color-text-secondary);
  font-size: var(--font-size-xs);
}

@media (max-width: 760px) {
  .qcis-scope-row { grid-template-columns: 1fr; }
}

} /* end @layer features */