/*
 * Catalyst-aligned styles for durable hubs, Scene 18 value views, and ROI.
 * Foundations follow docs/CATALYST_DESIGN_REFERENCE.md and the approved home
 * treatment. Editorial photographs, topic identity colours, status meaning,
 * and the different overview/funnel stories remain page-specific.
 */

body[data-scene="structural"] #main,
body[data-scene="18"] #main {
  --hub-ink: #1b1f26;
  --hub-muted: #515c6c;
  --hub-border: #d7dbe0;
  --hub-canvas: #f2f4f7;
  --hub-primary: #008194;
  --hub-primary-hover: #017384;
  --hub-primary-active: #026371;
  --hub-green: #008458;
  --hub-orange: #9f6100;
  color: var(--hub-ink);
  font-family: Arial, sans-serif;
}

/* Structural hubs share the same calm card and control foundations as Home. */
body[data-scene="structural"] #main h1,
body[data-scene="structural"] #main h2,
body[data-scene="structural"] #main h3 {
  color: var(--hub-ink);
  font-weight: 600;
}

body[data-scene="structural"] #main .page-heading,
body[data-scene="structural"] #main .structural-heading {
  align-items: center;
  gap: 20px 24px;
  margin: 0 0 24px;
}

body[data-scene="structural"] #main .page-heading .title,
body[data-scene="structural"] #main .structural-heading .title,
body[data-scene="structural"] #main .newsroom-heading h1,
body[data-scene="structural"] #main .news-article-page h1 {
  margin: 0 0 7px;
  color: var(--hub-ink);
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -.45px;
  line-height: 1.2;
}

body[data-scene="structural"] #main .page-heading .lead,
body[data-scene="structural"] #main .structural-heading .lead {
  max-width: 760px;
  margin: 0;
  color: var(--hub-muted);
  font-size: 15px;
  line-height: 1.5;
}

body[data-scene="structural"] #main .structural-heading-actions {
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

body[data-scene="structural"] #main .card,
body[data-scene="structural"] #main .structural-hero,
body[data-scene="structural"] #main .structural-profile {
  border: 1px solid var(--hub-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(27 31 38 / 6%);
}

body[data-scene="structural"] #main .structural-hero {
  align-items: center;
  gap: 24px;
  margin-bottom: 24px;
  background: #fff;
}

body[data-scene="structural"] #main .structural-hero h2 {
  margin: 6px 0 8px;
  color: var(--hub-ink);
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -.35px;
  line-height: 1.25;
}

body[data-scene="structural"] #main .structural-hero p,
body[data-scene="structural"] #main .structural-list-row p,
body[data-scene="structural"] #main .structural-card .small,
body[data-scene="structural"] #main .structural-section .small,
body[data-scene="structural"] #main .structural-hero .small {
  color: var(--hub-muted);
  line-height: 1.5;
}

body[data-scene="structural"] #main .structural-hero-stat {
  border-color: var(--hub-border);
}

body[data-scene="structural"] #main .structural-hero-stat strong {
  color: var(--hub-primary);
  font-size: 30px;
  font-weight: 600;
  letter-spacing: -.6px;
}

body[data-scene="structural"] #main .structural-hero-stat span {
  color: var(--hub-muted);
  font-size: 13px;
}

body[data-scene="structural"] #main .structural-avatar {
  background: #dceff1;
  color: #145a64;
  font-weight: 600;
}

body[data-scene="structural"] #main .structural-card {
  min-height: 168px;
  justify-content: flex-start;
  gap: 16px;
}

body[data-scene="structural"] #main .structural-card h2,
body[data-scene="structural"] #main .structural-section > .card-header h2,
body[data-scene="structural"] #main .structural-section > h2 {
  margin: 0 0 7px;
  color: var(--hub-ink);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -.25px;
}

body[data-scene="structural"] #main .structural-grid,
body[data-scene="structural"] #main .structural-section,
body[data-scene="structural"] #main .structural-metrics,
body[data-scene="structural"] #main .structural-profile,
body[data-scene="structural"] #main .structural-detail-grid,
body[data-scene="structural"] #main .structural-search,
body[data-scene="structural"] #main .structural-ask {
  margin-bottom: 24px;
}

body[data-scene="structural"] #main .structural-section > h2 { margin-bottom: 16px; }
body[data-scene="structural"] #main .structural-list-row { gap: 16px; }
body[data-scene="structural"] #main .structural-list-row strong { color: var(--hub-ink); }
body[data-scene="structural"] #main .structural-metrics .metric {
  border: 1px solid var(--hub-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: none;
}

body[data-scene="structural"] #main .btn,
body[data-scene="structural"] #main button.btn {
  min-height: 40px;
  border-radius: 8px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  box-shadow: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

body[data-scene="structural"] #main .btn.primary {
  border-color: var(--hub-primary);
  background: var(--hub-primary);
  color: #fff;
}

body[data-scene="structural"] #main .btn.primary:hover { border-color: var(--hub-primary-hover); background: var(--hub-primary-hover); }
body[data-scene="structural"] #main .btn.primary:active { border-color: var(--hub-primary-active); background: var(--hub-primary-active); }

body[data-scene="structural"] #main .btn:not(.primary) {
  border: 1px solid var(--hub-border);
  background: #fff;
  color: var(--hub-ink);
  text-decoration: none;
}

body[data-scene="structural"] #main .btn:not(.primary):hover {
  border-color: #aab3be;
  background: #f8f9fb;
  color: var(--hub-ink);
}

body[data-scene="structural"] #main .btn.link {
  border-color: transparent;
  background: transparent;
  color: var(--hub-primary);
}

body[data-scene="structural"] #main .btn.link:hover {
  border-color: transparent;
  background: #eaf4f5;
  color: var(--hub-primary-hover);
}

body[data-scene="structural"] #main :is(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid #008194;
  outline-offset: 2px;
}

body[data-scene="structural"] #main :is(input, select, textarea) {
  border: 1px solid var(--hub-border);
  border-radius: 8px;
  background: #fff;
  color: var(--hub-ink);
  font-family: inherit;
  font-size: 15px;
}

body[data-scene="structural"] #main .structural-search,
body[data-scene="structural"] #main .structural-ask {
  border-color: var(--hub-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(27 31 38 / 6%);
}

body[data-scene="structural"] #main .structural-search label { color: var(--hub-ink); }
body[data-scene="structural"] #main .structural-search input,
body[data-scene="structural"] #main .structural-ask textarea { min-height: 42px; padding: 10px 12px; }

/* Knowledge keeps its topic artwork and evidence statuses, while its controls and surfaces align with the shared system. */
body[data-scene="structural"] #main .knowledge-hub {
  max-width: 1480px;
  color: var(--hub-ink);
}

body[data-scene="structural"] #main .kh-overview-heading { gap: 24px; margin: 0 0 24px; }
body[data-scene="structural"] #main .kh-overview-heading .title,
body[data-scene="structural"] #main .kh-summary-body h1 {
  color: var(--hub-ink);
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -.45px;
  line-height: 1.2;
}
body[data-scene="structural"] #main .kh-overview-heading .lead { color: var(--hub-muted); font-size: 15px; line-height: 1.5; }
body[data-scene="structural"] #main .kh-eyebrow { color: var(--hub-muted); font-size: 13px; font-weight: 600; letter-spacing: 0; }

body[data-scene="structural"] #main .kh-overall-health {
  min-height: 112px;
  border: 1px solid var(--hub-border);
  border-radius: 12px;
  background: #fff;
  color: var(--hub-ink);
  box-shadow: 0 1px 3px rgb(27 31 38 / 6%);
}

body[data-scene="structural"] #main .kh-overall-health > span:first-child,
body[data-scene="structural"] #main .kh-overall-health .kh-health-caption { color: var(--hub-muted); opacity: 1; }
body[data-scene="structural"] #main .kh-overall-health strong { color: var(--hub-primary); font-size: 30px; font-weight: 600; }
body[data-scene="structural"] #main .kh-overall-health strong small { color: var(--hub-muted); font-weight: 400; opacity: 1; }
body[data-scene="structural"] #main .kh-health-ring { border-color: var(--hub-border); color: var(--hub-primary); }

body[data-scene="structural"] #main .kh-view-tabs {
  gap: 16px;
  margin-bottom: 18px;
  border-color: var(--hub-border);
}

body[data-scene="structural"] #main .kh-view-tab {
  min-height: 40px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 9px 2px 10px;
  background: transparent;
  color: var(--hub-muted);
  font-size: 14px;
  font-weight: 600;
}

body[data-scene="structural"] #main .kh-view-tab:hover { background: transparent; color: var(--hub-primary-hover); }
body[data-scene="structural"] #main .kh-view-tab.is-active { border-color: var(--hub-primary); background: transparent; color: var(--hub-primary); }

body[data-scene="structural"] #main .kh-discovery {
  min-height: 52px;
  border-color: var(--hub-border);
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}

body[data-scene="structural"] #main .kh-discovery:focus-within {
  border-color: var(--hub-primary);
  outline: 3px solid rgb(0 129 148 / 20%);
  outline-offset: 1px;
}

body[data-scene="structural"] #main .kh-discovery input {
  min-height: 38px;
  border: 0;
  border-radius: 0;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent;
  color: var(--hub-ink);
  font-size: 15px;
}

body[data-scene="structural"] #main .kh-search-icon { border-radius: 8px; background: #eaf4f5; color: var(--hub-primary); }
body[data-scene="structural"] #main .kh-search-hint { color: var(--hub-muted); font-size: 13px; }
body[data-scene="structural"] #main .kh-prompt-row { gap: 8px; margin: 12px 0 24px; }
body[data-scene="structural"] #main .kh-prompt-chip.btn { min-height: 36px; border-color: var(--hub-border); border-radius: 8px; background: #fff; color: var(--hub-muted); font-size: 13px; }
body[data-scene="structural"] #main .kh-prompt-chip.btn:hover { border-color: var(--hub-primary); background: #f5fafb; color: var(--hub-primary-hover); }

body[data-scene="structural"] #main .kh-catalog-heading h2 { color: var(--hub-ink); font-size: 20px; font-weight: 600; letter-spacing: -.2px; }
body[data-scene="structural"] #main .kh-catalog-heading p,
body[data-scene="structural"] #main .kh-catalog-footer,
body[data-scene="structural"] #main .kh-catalog-kicker { color: var(--hub-muted); }
body[data-scene="structural"] #main .kh-result-count { border-radius: 8px; background: #edf0f3; color: var(--hub-muted); font-size: 12px; }
body[data-scene="structural"] #main .kh-catalog-grid { gap: 16px; }
body[data-scene="structural"] #main .kh-catalog-card {
  border-color: var(--hub-border);
  border-radius: 12px;
  box-shadow: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
body[data-scene="structural"] #main .kh-catalog-card:hover { transform: none; border-color: #aab3be; box-shadow: 0 2px 7px rgb(27 31 38 / 7%); }
body[data-scene="structural"] #main .kh-catalog-art::after,
body[data-scene="structural"] #main .kh-summary-art::after { display: none; }
body[data-scene="structural"] #main .kh-catalog-icon,
body[data-scene="structural"] #main .kh-summary-icon { border-radius: 16px; box-shadow: none; }
body[data-scene="structural"] #main .kh-catalog-body { padding: 16px; }
body[data-scene="structural"] #main .kh-catalog-body h2 { color: var(--hub-ink); font-size: 16px; font-weight: 600; letter-spacing: -.1px; }
body[data-scene="structural"] #main .kh-catalog-body p { color: var(--hub-muted); font-size: 13px; line-height: 1.5; }
body[data-scene="structural"] #main .kh-catalog-footer { margin-top: 14px; padding-top: 11px; border-color: #ebedf0; font-size: 12px; }
body[data-scene="structural"] #main .kh-catalog-footer span:last-child { color: var(--hub-primary); }
body[data-scene="structural"] #main .kh-score-chip { border-color: var(--hub-border); border-radius: 8px; box-shadow: none; color: var(--hub-green); }
body[data-scene="structural"] #main .kh-score-chip.kh-score-warn { border-color: #edd8b2; background: #fff6e8; color: var(--hub-orange); }

body[data-scene="structural"] #main .kh-back-row { color: var(--hub-muted); font-size: 13px; }
body[data-scene="structural"] #main .kh-back-link.btn { min-height: 36px; color: var(--hub-primary); }
body[data-scene="structural"] #main .kh-collection-layout { gap: 20px; }
body[data-scene="structural"] #main .kh-collection-summary { border-color: var(--hub-border); border-radius: 12px; box-shadow: 0 1px 3px rgb(27 31 38 / 6%); }
body[data-scene="structural"] #main .kh-summary-art { border-radius: 8px; }
body[data-scene="structural"] #main .kh-summary-body { padding: 20px; }
body[data-scene="structural"] #main .kh-summary-body h1 { margin-bottom: 5px; }
body[data-scene="structural"] #main .kh-summary-body > p:first-of-type,
body[data-scene="structural"] #main .kh-summary-description { color: var(--hub-muted); font-size: 13px; line-height: 1.5; }
body[data-scene="structural"] #main .kh-source-chip { min-height: 32px; border-color: var(--hub-border); border-radius: 8px; background: #fff; color: var(--hub-muted); font-size: 12px; }
body[data-scene="structural"] #main .kh-summary-rule { background: var(--hub-border); }
body[data-scene="structural"] #main .kh-health-metrics { gap: 10px; }
body[data-scene="structural"] #main .kh-health-metric { min-height: 78px; border-color: var(--hub-border); border-radius: 10px; text-align: left; padding: 12px; }
body[data-scene="structural"] #main .kh-health-metric strong { color: var(--hub-ink); font-size: 21px; font-weight: 600; }
body[data-scene="structural"] #main .kh-health-metric span { color: var(--hub-muted); font-size: 12px; }
body[data-scene="structural"] #main .kh-health-total { border-left: 3px solid var(--hub-primary); background: #fff; }
body[data-scene="structural"] #main .kh-health-total strong { color: var(--hub-primary); }
body[data-scene="structural"] #main .kh-health-total span { color: var(--hub-muted); }
body[data-scene="structural"] #main .kh-metric-amber strong { color: var(--hub-orange); }
body[data-scene="structural"] #main .kh-metric-coral strong { color: #b43f28; }
body[data-scene="structural"] #main .kh-gaps-panel { border-color: #e7d1a8; border-style: solid; border-radius: 10px; background: #fffaf1; }
body[data-scene="structural"] #main .kh-gap-heading strong,
body[data-scene="structural"] #main .kh-gap-row strong { color: var(--hub-ink); }
body[data-scene="structural"] #main .kh-gaps-intro,
body[data-scene="structural"] #main .kh-gap-row p { color: var(--hub-muted); font-size: 12px; }
body[data-scene="structural"] #main .kh-private-label { border-radius: 8px; background: #edf0f3; color: var(--hub-muted); font-size: 11px; }
body[data-scene="structural"] #main .kh-gap-row { border-color: var(--hub-border); border-radius: 8px; }
body[data-scene="structural"] #main .kh-expert-link.btn,
body[data-scene="structural"] #main .kh-article-link.btn { min-height: 38px; border-radius: 8px; font-size: 13px; }
body[data-scene="structural"] #main .kh-groups-heading { margin: 20px 2px 10px; }
body[data-scene="structural"] #main .kh-groups-heading h2 { color: var(--hub-ink); font-size: 20px; font-weight: 600; }
body[data-scene="structural"] #main .kh-groups-heading p { color: var(--hub-muted); font-size: 13px; }
body[data-scene="structural"] #main .kh-content-group { border-color: var(--hub-border); border-radius: 10px; background: #fff; }
body[data-scene="structural"] #main .kh-content-group > summary { min-height: 48px; color: var(--hub-ink); font-size: 14px; }
body[data-scene="structural"] #main .kh-group-count { color: var(--hub-muted); font-size: 12px; }
body[data-scene="structural"] #main .kh-article-row { border-color: var(--hub-border); border-radius: 8px; }
body[data-scene="structural"] #main .kh-article-title-line h3 { color: var(--hub-ink); font-size: 14px; }
body[data-scene="structural"] #main .kh-article-copy > p { color: var(--hub-muted); font-size: 13px; }
body[data-scene="structural"] #main .kh-article-updated { color: var(--hub-muted); font-size: 12px; }
body[data-scene="structural"] #main .kh-status { border-radius: 6px; font-size: 11px; }
body[data-scene="structural"] #main .kh-status-green { background: #e7f4ee; color: var(--hub-green); }
body[data-scene="structural"] #main .kh-status-orange { background: #fff3df; color: var(--hub-orange); }
body[data-scene="structural"] #main .kh-status-blue { background: #edf0f3; color: var(--hub-muted); }

/* Newsroom keeps its photography and editorial hierarchy, with quieter chrome. */
body[data-scene="structural"] #main .newsroom-page { max-width: 1280px; color: var(--hub-ink); }
body[data-scene="structural"] #main .newsroom-heading { margin-bottom: 22px; }
body[data-scene="structural"] #main .newsroom-heading h1 { font-size: 28px; letter-spacing: -.45px; }
body[data-scene="structural"] #main .newsroom-kicker,
body[data-scene="structural"] #main .newsroom-meta,
body[data-scene="structural"] #main .newsroom-results-status { color: var(--hub-muted); }
body[data-scene="structural"] #main .newsroom-intro { color: var(--hub-muted); font-size: 15px; line-height: 1.5; }
body[data-scene="structural"] #main .newsroom-filter-row { gap: 16px; margin-bottom: 20px; border-color: var(--hub-border); }
body[data-scene="structural"] #main .newsroom-topic-bar { gap: 20px; }
body[data-scene="structural"] #main .newsroom-topic-bar button,
body[data-scene="structural"] #main .newsroom-filter-button {
  min-height: 40px;
  border-radius: 0;
  color: var(--hub-muted);
  font-size: 14px;
  font-weight: 600;
}
body[data-scene="structural"] #main .newsroom-topic-bar button:hover { color: var(--hub-primary-hover); }
body[data-scene="structural"] #main .newsroom-topic-bar button[aria-pressed="true"],
body[data-scene="structural"] #main .newsroom-filter-button.is-active { border-bottom-color: var(--hub-primary); color: var(--hub-primary); }
body[data-scene="structural"] #main .newsroom-topic-bar button:focus-visible,
body[data-scene="structural"] #main .newsroom-results-panel:focus-visible { outline-color: var(--hub-primary); }

body[data-scene="structural"] #main .newsroom-lead-card,
body[data-scene="structural"] #main .newsroom-secondary-card,
body[data-scene="structural"] #main .newsroom-resource-card,
body[data-scene="structural"] #main .news-article-aside-card,
body[data-scene="structural"] #main .news-article-ceo-related-card {
  border: 1px solid var(--hub-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(27 31 38 / 6%);
}

body[data-scene="structural"] #main .newsroom-lead-card { transition: border-color .15s ease, box-shadow .15s ease; }
body[data-scene="structural"] #main .newsroom-lead-card:hover,
body[data-scene="structural"] #main .newsroom-lead-card:focus-within { transform: none; border-color: #aab3be; box-shadow: 0 2px 7px rgb(27 31 38 / 7%); }
body[data-scene="structural"] #main .newsroom-lead-copy h2 { color: var(--hub-ink); font-size: 28px; font-weight: 600; letter-spacing: -.4px; line-height: 1.2; }
body[data-scene="structural"] #main .newsroom-lead-copy > p { color: var(--hub-muted); font-size: 15px; line-height: 1.55; }
body[data-scene="structural"] #main .newsroom-lead-meta span:first-child,
body[data-scene="structural"] #main .newsroom-read-more,
body[data-scene="structural"] #main .newsroom-card-link { color: var(--hub-primary); }
body[data-scene="structural"] #main .newsroom-secondary-body { padding: 18px; }
body[data-scene="structural"] #main .newsroom-secondary-body h3,
body[data-scene="structural"] #main .newsroom-section-heading h2 { color: var(--hub-ink); font-size: 20px; font-weight: 600; letter-spacing: -.2px; }
body[data-scene="structural"] #main .newsroom-secondary-body p,
body[data-scene="structural"] #main .newsroom-resource-card > p { color: var(--hub-muted); font-size: 14px; line-height: 1.5; }
body[data-scene="structural"] #main .newsroom-resource-card { padding: 18px; }
body[data-scene="structural"] #main .newsroom-resource-category { color: var(--hub-primary); font-size: 13px; font-weight: 600; }
body[data-scene="structural"] #main .newsroom-communications-strip {
  border: 1px solid var(--hub-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: none;
}

body[data-scene="structural"] #main .news-article-page { color: var(--hub-ink); }
body[data-scene="structural"] #main .news-article-page h1 { max-width: 900px; }
body[data-scene="structural"] #main .news-article-page h2 { color: var(--hub-ink); font-size: 20px; font-weight: 600; letter-spacing: -.2px; }
body[data-scene="structural"] #main .news-article-topbar,
body[data-scene="structural"] #main .news-article-meta,
body[data-scene="structural"] #main .news-article-byline,
body[data-scene="structural"] #main .news-article-copy { color: var(--hub-muted); }
body[data-scene="structural"] #main .news-article-copy { font-size: 15px; line-height: 1.65; }
body[data-scene="structural"] #main .news-article-copy a,
body[data-scene="structural"] #main .newsroom-page a:not(.newsroom-story-link) { color: var(--hub-primary); }
body[data-scene="structural"] #main .news-article-hero,
body[data-scene="structural"] #main .news-article-ceo-image { border-radius: 16px; overflow: hidden; }
body[data-scene="structural"] #main .news-article-aside-card { padding: 18px; }
body[data-scene="structural"] #main .news-article-callout { border: 1px solid var(--hub-border); border-left: 3px solid var(--hub-primary); border-radius: 8px; background: #fff; }
body[data-scene="structural"] #main .news-article-callout-mint { border-color: #c9e6dc; border-left-color: var(--hub-green); background: #f2faf6; }
body[data-scene="structural"] #main .newsroom-pill { border-radius: 8px; }

/* Scene 18 retains its journey sequence, evidence mapping, and semantic status. */
body[data-scene="18"] #main .value-dashboard {
  --value-ink: #1b1f26;
  --value-muted: #515c6c;
  --value-border: #d7dbe0;
  --value-purple: #008194;
  --value-blue: #426b78;
  --value-green: #008458;
  --value-orange: #9f6100;
  color: var(--hub-ink);
}

body[data-scene="18"] #main .value-dashboard h1,
body[data-scene="18"] #main .value-dashboard h2,
body[data-scene="18"] #main .value-dashboard h3,
body[data-scene="18"] #main .value-dashboard strong { color: var(--hub-ink); }
body[data-scene="18"] #main .value-dashboard p,
body[data-scene="18"] #main .value-dashboard small,
body[data-scene="18"] #main .value-dashboard .muted { color: var(--hub-muted); }
body[data-scene="18"] #main .value-dashboard-heading { align-items: center; gap: 20px 24px; margin-bottom: 14px; }
body[data-scene="18"] #main .value-heading-title h1 { margin-bottom: 6px; color: var(--hub-ink); font-size: 28px; font-weight: 600; letter-spacing: -.45px; }
body[data-scene="18"] #main .value-heading-title + p { color: var(--hub-muted); font-size: 15px; }
body[data-scene="18"] #main .value-heading-controls { gap: 8px; }
body[data-scene="18"] #main .value-date-range { min-height: 40px; border-color: var(--hub-border); border-radius: 8px; color: var(--hub-muted); font-size: 13px; }
body[data-scene="18"] #main .value-heading-controls .btn { min-height: 40px; border-radius: 8px; border-color: var(--hub-border); font-size: 14px; }
body[data-scene="18"] #main .value-provenance { margin-bottom: 18px; color: var(--hub-muted); font-size: 13px; }
body[data-scene="18"] #main .value-kpis { gap: 16px; margin-bottom: 16px; }
body[data-scene="18"] #main .value-kpi,
body[data-scene="18"] #main .value-journey-card,
body[data-scene="18"] #main .value-evidence-card {
  border: 1px solid var(--hub-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(27 31 38 / 6%);
}
body[data-scene="18"] #main .value-kpi { min-height: 112px; padding: 16px; }
body[data-scene="18"] #main .value-kpi-top h2 { color: var(--hub-muted); font-size: 13px; font-weight: 600; }
body[data-scene="18"] #main .value-kpi-number { margin-top: 10px; }
body[data-scene="18"] #main .value-kpi-number strong { color: var(--hub-ink); font-size: 26px; font-weight: 600; }
body[data-scene="18"] #main .value-trend { font-size: 13px; }
body[data-scene="18"] #main .value-content-grid { gap: 16px; }
body[data-scene="18"] #main .value-journey-card,
body[data-scene="18"] #main .value-evidence-card { padding: 20px; }
body[data-scene="18"] #main .value-card-heading { gap: 12px; margin-bottom: 16px; }
body[data-scene="18"] #main .value-card-heading h2 { color: var(--hub-ink); font-size: 20px; font-weight: 600; letter-spacing: -.2px; }
body[data-scene="18"] #main .value-section-kicker { color: var(--hub-muted); font-size: 13px; font-weight: 600; letter-spacing: 0; }
body[data-scene="18"] #main .value-stage-index { background: var(--hub-primary); color: #fff; }
body[data-scene="18"] #main .value-stage:nth-of-type(4n + 2) .value-stage-index { background: var(--hub-orange); }
body[data-scene="18"] #main .value-stage:nth-of-type(4n + 3) .value-stage-index { background: var(--hub-green); }
body[data-scene="18"] #main .value-stage:nth-of-type(4n + 4) .value-stage-index { background: var(--value-blue); }
body[data-scene="18"] #main .value-loop-status { border-radius: 8px; }
body[data-scene="18"] #main .value-loop-status.verified { border-color: #b9ddcf; background: #f2faf6; }
body[data-scene="18"] #main .value-loop-status.pending { border-color: #ecd8b5; background: #fff9ef; }
body[data-scene="18"] #main .value-loop-status.pending .value-status-icon { color: var(--hub-orange); }
body[data-scene="18"] #main .value-evidence-metric { border-color: var(--hub-border); border-radius: 8px; background: #fff; }
body[data-scene="18"] #main .value-evidence-metric > span { color: var(--hub-muted); }
body[data-scene="18"] #main .value-evidence-metric strong { color: var(--hub-ink); font-weight: 600; }
body[data-scene="18"] #main .value-evidence-note { margin-top: 16px; color: var(--hub-muted); font-size: 13px; }

body[data-scene="18"] #main .value-dashboard :is(button, a, input, select, textarea):focus-visible,
body[data-scene="18"] #main .roi-explorer :is(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid #008194;
  outline-offset: 2px;
}

/* ROI is an evidence explorer. Keep the five-area map separate from its detailed six-stage funnel. */
body[data-scene="18"] #main .roi-explorer {
  --roi-ink: #1b1f26;
  --roi-muted: #515c6c;
  --roi-line: #d7dbe0;
  --roi-primary: #008194;
  color: var(--hub-ink);
  font-family: inherit;
}

body[data-scene="18"] #main .roi-explorer h1,
body[data-scene="18"] #main .roi-explorer h2,
body[data-scene="18"] #main .roi-explorer h3,
body[data-scene="18"] #main .roi-explorer strong { color: var(--hub-ink); }
body[data-scene="18"] #main .roi-explorer p { color: var(--hub-muted); }
body[data-scene="18"] #main .roi-page-heading { align-items: center; gap: 20px 24px; margin-bottom: 24px; }
body[data-scene="18"] #main .roi-page-heading h1 { margin: 0 0 6px; color: var(--hub-ink); font-size: 28px; font-weight: 600; letter-spacing: -.45px; }
body[data-scene="18"] #main .roi-page-heading p { color: var(--hub-muted); font-size: 15px; }
body[data-scene="18"] #main .roi-breadcrumb { color: var(--hub-muted); }
body[data-scene="18"] #main .roi-shell { gap: 24px; }
body[data-scene="18"] #main .roi-rail { border-color: var(--hub-border); }
body[data-scene="18"] #main .roi-rail-heading > span { color: var(--hub-muted); font-size: 13px; }
body[data-scene="18"] #main .roi-nav-list { gap: 4px; }
body[data-scene="18"] #main .roi-nav-item {
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--hub-muted);
  font-size: 14px;
  font-weight: 600;
}
body[data-scene="18"] #main .roi-nav-item:hover { background: #f2f6f7; color: var(--hub-primary-hover); }
body[data-scene="18"] #main .roi-nav-item.active { border-color: #c4dfe3; background: #eaf4f5; color: var(--hub-primary); }
body[data-scene="18"] #main .roi-panel { gap: 20px; }
body[data-scene="18"] #main .roi-panel-intro h2 { color: var(--hub-ink); font-size: 20px; font-weight: 600; letter-spacing: -.2px; }
body[data-scene="18"] #main .roi-panel-intro p { color: var(--hub-muted); font-size: 15px; line-height: 1.5; }
body[data-scene="18"] #main .roi-primary-card,
body[data-scene="18"] #main .roi-overview-example,
body[data-scene="18"] #main .roi-overview-map,
body[data-scene="18"] #main .roi-secondary-card {
  border: 1px solid var(--hub-border);
  border-radius: 12px;
  padding: 20px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(27 31 38 / 6%);
}
body[data-scene="18"] #main .roi-overview-map { min-width: 0; }
body[data-scene="18"] #main .roi-card-heading h2,
body[data-scene="18"] #main .roi-overview-map h3,
body[data-scene="18"] #main .roi-overview-example h3 { color: var(--hub-ink); font-size: 18px; font-weight: 600; }
body[data-scene="18"] #main .roi-overview-area { border-color: var(--hub-border); padding: 14px 2px; }
body[data-scene="18"] #main .roi-overview-area strong { color: var(--hub-ink); font-size: 14px; }
body[data-scene="18"] #main .roi-overview-area span { color: var(--hub-muted); font-size: 14px; }
body[data-scene="18"] #main .roi-overview-ring-fill { stroke: var(--hub-primary); }
body[data-scene="18"] #main .roi-method-note { gap: 18px; border-color: var(--hub-border); border-radius: 8px; padding: 16px; background: #fff; }
body[data-scene="18"] #main .roi-method-note h3 { color: var(--hub-ink); font-size: 16px; font-weight: 600; }
body[data-scene="18"] #main .roi-method-note p { color: var(--hub-muted); font-size: 14px; }
body[data-scene="18"] #main .roi-text-action { min-height: 40px; color: var(--hub-primary); font-size: 14px; font-weight: 600; }
body[data-scene="18"] #main .roi-text-action:hover { color: var(--hub-primary-hover); }
body[data-scene="18"] #main .roi-detail { border-color: var(--hub-border); }
body[data-scene="18"] #main .roi-detail > summary { min-height: 44px; color: var(--hub-ink); }
body[data-scene="18"] #main .roi-detail-summary { color: var(--hub-muted); }
body[data-scene="18"] #main .roi-caveat { border-color: #ecd8b5; border-radius: 8px; background: #fff9ef; }
body[data-scene="18"] #main .roi-hours-callout,
body[data-scene="18"] #main .roi-optional-mark { border-color: var(--hub-border); border-radius: 8px; background: #f8f9fb; }
body[data-scene="18"] #main .roi-page-actions .btn { min-height: 40px; border-radius: 8px; font-size: 14px; }
body[data-scene="18"] #main .roi-tabs button { min-height: 40px; border-radius: 8px; font-size: 14px; }

@media (max-width: 760px) {
  body[data-scene="structural"] #main .structural-heading,
  body[data-scene="structural"] #main .value-dashboard-heading { align-items: flex-start; }
  body[data-scene="structural"] #main .structural-heading-actions { justify-content: flex-start; }
  body[data-scene="structural"] #main .structural-hero,
  body[data-scene="structural"] #main .structural-profile { align-items: flex-start; flex-direction: column; }
  body[data-scene="structural"] #main .structural-hero-stat { width: 100%; padding: 12px 0 0; border-top: 1px solid var(--hub-border); border-left: 0; text-align: left; }
  body[data-scene="structural"] #main .structural-hero-stat strong { margin-right: 7px; font-size: 25px; }
  body[data-scene="structural"] #main .structural-hero-stat span { display: inline; }
  body[data-scene="structural"] #main .structural-avatar { align-self: flex-start; }
  body[data-scene="structural"] #main .structural-profile { gap: 16px; }
  body[data-scene="structural"] #main .newsroom-filter-row { align-items: flex-start; flex-direction: column; gap: 5px; }
  body[data-scene="structural"] #main .newsroom-topic-bar { width: 100%; gap: 16px; }
  body[data-scene="structural"] #main .newsroom-lead-card { grid-template-columns: minmax(0, 1fr); height: auto; min-height: 0; }
  body[data-scene="structural"] #main .newsroom-lead-copy { min-height: 260px; padding: 24px; }
  body[data-scene="structural"] #main .newsroom-lead-copy h2 { font-size: 24px; }
  body[data-scene="structural"] #main .newsroom-lead-media { min-height: 200px; }
  body[data-scene="structural"] #main .news-article-page h1 { font-size: 26px; }
  body[data-scene="18"] #main .value-dashboard-heading { flex-direction: column; }
  body[data-scene="18"] #main .value-heading-controls { justify-content: flex-start; }
  body[data-scene="18"] #main .roi-shell { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  body[data-scene="18"] #main .roi-rail { border-right: 0; border-bottom: 1px solid var(--hub-border); padding: 0 0 12px; }
  body[data-scene="18"] #main .roi-nav-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  body[data-scene="structural"] #main .structural-card { min-height: 0; }
  body[data-scene="structural"] #main .kh-overview-heading { gap: 16px; }
  body[data-scene="structural"] #main .kh-overview-heading .title { font-size: 28px; }
  body[data-scene="structural"] #main .kh-overall-health { min-width: 0; min-height: 92px; }
  body[data-scene="structural"] #main .kh-view-tabs { gap: 12px; }
  body[data-scene="structural"] #main .kh-view-tab { flex: 1 1 auto; padding-inline: 0; text-align: left; }
  body[data-scene="structural"] #main .kh-discovery { gap: 8px; padding-inline: 10px; }
  body[data-scene="structural"] #main .kh-search-hint { display: none; }
  body[data-scene="structural"] #main .kh-catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body[data-scene="structural"] #main .kh-catalog-art { min-height: 112px; }
  body[data-scene="structural"] #main .kh-catalog-icon { width: 58px; height: 58px; border-radius: 14px; }
  body[data-scene="structural"] #main .kh-catalog-icon svg { width: 31px; height: 31px; }
  body[data-scene="structural"] #main .kh-catalog-body { padding: 12px; }
  body[data-scene="structural"] #main .kh-catalog-body h2 { font-size: 14px; }
  body[data-scene="structural"] #main .kh-catalog-body p { min-height: 0; font-size: 12px; }
  body[data-scene="structural"] #main .kh-catalog-footer { gap: 6px; margin-top: 10px; padding-top: 8px; font-size: 11px; }
  body[data-scene="structural"] #main .kh-collection-summary { display: block; }
  body[data-scene="structural"] #main .kh-summary-art { min-height: 145px; margin: 12px; }
  body[data-scene="structural"] #main .kh-summary-body { padding: 8px 16px 16px; }
  body[data-scene="structural"] #main .kh-health-metrics,
  body[data-scene="structural"] #main .kh-health-metrics-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  body[data-scene="structural"] #main .kh-health-metric,
  body[data-scene="structural"] #main .kh-health-metrics-compact .kh-health-metric { min-height: 72px; padding: 10px; }
  body[data-scene="structural"] #main .kh-health-metric strong { font-size: 20px; }
  body[data-scene="structural"] #main .kh-health-metric span { margin-top: 5px; font-size: 12px; }
  body[data-scene="structural"] #main .kh-groups-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
  body[data-scene="structural"] #main .kh-article-row { align-items: flex-start; flex-direction: column; padding: 14px; }
  body[data-scene="structural"] #main .kh-article-link.btn { align-self: flex-start; }
  body[data-scene="structural"] #main .newsroom-heading h1 { font-size: 28px; }
  body[data-scene="structural"] #main .newsroom-lead-copy { min-height: 0; padding: 20px; }
  body[data-scene="structural"] #main .newsroom-lead-media { min-height: 170px; }
  body[data-scene="18"] #main .value-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body[data-scene="18"] #main .value-kpi { min-height: 98px; padding: 12px; }
  body[data-scene="18"] #main .value-kpi-number { flex-wrap: wrap; gap: 4px 7px; }
  body[data-scene="18"] #main .value-kpi-number strong { font-size: 23px; }
  body[data-scene="18"] #main .value-content-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-scene="18"] #main .value-journey-card,
  body[data-scene="18"] #main .value-evidence-card { padding: 16px; }
  body[data-scene="18"] #main .roi-primary-card,
  body[data-scene="18"] #main .roi-overview-example,
  body[data-scene="18"] #main .roi-overview-map,
  body[data-scene="18"] #main .roi-secondary-card { padding: 16px; }
  body[data-scene="18"] #main .roi-overview-layout { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  body[data-scene="18"] #main .roi-overview-area { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  body[data-scene="18"] #main .roi-method-note { flex-direction: column; }
  body[data-scene="18"] #main .roi-nav-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-scene="18"] #main .roi-nav-item { padding: 8px; font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-scene="structural"] #main *,
  body[data-scene="18"] #main * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}