/* v4.2-RC3 — L9 reviewer clarity, contextual visibility and contrast correction.
   This stylesheet deliberately owns its complete colour surface to prevent
   inherited black-on-black and low-contrast combinations in both themes. */

:root {
  --l9-accent: #a21caf;
  --l9-accent-strong: #86198f;
  --l9-accent-soft: #fae8ff;
  --l9-border: #d8b4fe;
  --l9-bg: #f3f6fb;
  --l9-panel: #ffffff;
  --l9-panel-2: #f8fafc;
  --l9-text: #172033;
  --l9-muted: #52647a;
  --l9-line: #cbd5e1;
  --l9-shadow: 0 28px 90px rgba(15, 23, 42, .28);
}

body:not(.light) {
  --l9-accent: #e879f9;
  --l9-accent-strong: #f0abfc;
  --l9-accent-soft: #31123a;
  --l9-border: #7e22ce;
  --l9-bg: #09111f;
  --l9-panel: #111c2e;
  --l9-panel-2: #17243a;
  --l9-text: #f8fafc;
  --l9-muted: #c5d1e1;
  --l9-line: #34465f;
  --l9-shadow: 0 32px 100px rgba(0, 0, 0, .66);
}

body.mf-l9-open { overflow: hidden; }

.mf-l9-backdrop {
  position: fixed;
  inset: 0;
  z-index: 420;
  background: rgba(3, 8, 20, .72);
  backdrop-filter: blur(5px);
}

.mf-l9-shell {
  position: fixed;
  inset: 2.5vh 2.2vw;
  z-index: 430;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  overflow: hidden;
  color: var(--l9-text) !important;
  background: var(--l9-bg) !important;
  border: 1px solid var(--l9-border);
  border-radius: 18px;
  box-shadow: var(--l9-shadow);
  color-scheme: light;
}

body:not(.light) .mf-l9-shell { color-scheme: dark; }

.mf-l9-shell *,
.mf-l9-shell *::before,
.mf-l9-shell *::after { box-sizing: border-box; }

.mf-l9-shell button,
.mf-l9-shell input,
.mf-l9-shell select {
  color: var(--l9-text) !important;
  background: var(--l9-panel-2) !important;
  border-color: var(--l9-line) !important;
}

.mf-l9-shell button:hover,
.mf-l9-shell button:focus-visible {
  color: var(--l9-text) !important;
  background: var(--l9-accent-soft) !important;
  border-color: var(--l9-accent) !important;
  outline: 2px solid transparent;
}

.mf-l9-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 82px;
  padding: 14px 18px;
  color: #1f1230 !important;
  background: linear-gradient(115deg, #ffffff 0%, #f8eafe 62%, #ede9fe 100%) !important;
  border-bottom: 1px solid var(--l9-border);
}

body:not(.light) .mf-l9-head {
  color: #ffffff !important;
  background: linear-gradient(115deg, #1a1430 0%, #32143c 62%, #241741 100%) !important;
}

.mf-l9-head h2 {
  margin: 2px 0 4px;
  color: inherit !important;
  font-size: 20px;
  line-height: 1.2;
}

.mf-l9-head p {
  margin: 0;
  color: #5c486d !important;
  font-size: 12px;
}

body:not(.light) .mf-l9-head p { color: #e8d9f0 !important; }

.mf-l9-kicker {
  color: #9d174d !important;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
}

body:not(.light) .mf-l9-kicker { color: #f5b7fb !important; }

.mf-l9-head-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}

.mf-l9-authority {
  display: inline-flex;
  align-items: center;
  max-width: 260px;
  padding: 6px 10px;
  color: #6b145f !important;
  background: #ffffff !important;
  border: 1px solid #c084fc;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
  text-align: center;
}

body:not(.light) .mf-l9-authority {
  color: #ffffff !important;
  background: #3b1644 !important;
  border-color: #d946ef;
}

.mf-l9-close {
  width: 38px;
  height: 38px;
  padding: 0 !important;
  color: #172033 !important;
  background: #ffffff !important;
  border: 1px solid #b6c2d2 !important;
  font-size: 19px;
  line-height: 1;
}

body:not(.light) .mf-l9-close {
  color: #ffffff !important;
  background: #17243a !important;
  border-color: #64748b !important;
}

.mf-l9-clarity-strip {
  padding: 10px 18px;
  color: #37304a !important;
  background: #fefce8 !important;
  border-bottom: 1px solid #f3d568;
  font-size: 12px;
  line-height: 1.45;
}

body:not(.light) .mf-l9-clarity-strip {
  color: #fff7d1 !important;
  background: #352c13 !important;
  border-color: #8a6d1c;
}

.mf-l9-body {
  min-height: 0;
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  color: var(--l9-text) !important;
  background: var(--l9-bg) !important;
}

.mf-l9-list-panel {
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  color: var(--l9-text) !important;
  background: var(--l9-panel) !important;
  border-right: 1px solid var(--l9-line);
}

.mf-l9-filters {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 12px;
  background: var(--l9-panel) !important;
  border-bottom: 1px solid var(--l9-line);
}

.mf-l9-filters input,
.mf-l9-filters select {
  width: 100%;
  height: 38px;
  min-width: 0;
  padding: 0 10px;
  color: var(--l9-text) !important;
  background: var(--l9-panel-2) !important;
  border: 1px solid var(--l9-line) !important;
  border-radius: 9px;
}

.mf-l9-filters input::placeholder { color: var(--l9-muted) !important; opacity: 1; }

.mf-l9-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 10px 12px;
  background: var(--l9-panel) !important;
  border-bottom: 1px solid var(--l9-line);
}

.mf-l9-summary span {
  display: grid;
  place-items: center;
  min-height: 47px;
  padding: 6px;
  color: var(--l9-muted) !important;
  background: var(--l9-panel-2) !important;
  border: 1px solid var(--l9-line);
  border-radius: 9px;
  font-size: 9px;
  text-align: center;
}

.mf-l9-summary b { display: block; color: var(--l9-text) !important; font-size: 15px; }

.mf-l9-list { min-height: 0; overflow: auto; background: var(--l9-panel) !important; }

.mf-l9-group-title {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  color: #34445a !important;
  background: #e9eff7 !important;
  border-block: 1px solid #c8d4e3;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

body:not(.light) .mf-l9-group-title {
  color: #e7eef8 !important;
  background: #1a2a42 !important;
  border-color: #3b506d;
}

.mf-l9-item {
  display: block;
  width: 100%;
  min-height: 83px;
  padding: 10px 12px !important;
  color: var(--l9-text) !important;
  background: var(--l9-panel) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--l9-line) !important;
  border-radius: 0 !important;
  text-align: left;
}

.mf-l9-item:hover { transform: none !important; background: var(--l9-panel-2) !important; }
.mf-l9-item.active {
  color: #23112b !important;
  background: #f5e8fb !important;
  border-left: 4px solid #a21caf !important;
}

body:not(.light) .mf-l9-item.active {
  color: #ffffff !important;
  background: #3a1945 !important;
  border-left-color: #e879f9 !important;
}

.mf-l9-item strong { display: block; color: inherit !important; font-size: 12px; }
.mf-l9-item small { display: block; margin-top: 3px; color: var(--l9-muted) !important; font-size: 9px; }
.mf-l9-item.active small { color: #5d4966 !important; }
body:not(.light) .mf-l9-item.active small { color: #eadcf0 !important; }
.mf-l9-item em { display: block; margin-top: 6px; color: var(--l9-muted) !important; font-size: 9px; font-style: normal; line-height: 1.25; }
.mf-l9-item.active em { color: #4b3b55 !important; }
body:not(.light) .mf-l9-item.active em { color: #f0e6f4 !important; }

.mf-l9-item-tags,
.mf-l9-targets { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }

.mf-l9-tag,
.mf-l9-target-chip {
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  padding: 2px 7px;
  color: #293244 !important;
  background: #f8fafc !important;
  border: 1px solid #94a3b8;
  border-radius: 999px;
  font-size: 8px;
  font-weight: 900;
  line-height: 1.2;
}

body:not(.light) .mf-l9-tag,
body:not(.light) .mf-l9-target-chip { color: #f8fafc !important; background: #1e293b !important; }

.mf-l9-tag.semantic, .mf-l9-banner.semantic { color: #15467b !important; background: #e8f3ff !important; border-color: #60a5fa; }
.mf-l9-tag.kernel, .mf-l9-banner.kernel { color: #075f57 !important; background: #e5fbf6 !important; border-color: #2dd4bf; }
.mf-l9-tag.external, .mf-l9-banner.external { color: #405269 !important; background: #edf2f7 !important; border-color: #94a3b8; }
.mf-l9-tag.reuse, .mf-l9-banner.reuse { color: #0c603a !important; background: #e8faef !important; border-color: #34d399; }
.mf-l9-tag.review, .mf-l9-banner.review { color: #7a4300 !important; background: #fff6dd !important; border-color: #f59e0b; }
.mf-l9-tag.handoff, .mf-l9-banner.handoff { color: #5b2a86 !important; background: #f4eaff !important; border-color: #a78bfa; }
.mf-l9-tag.projection, .mf-l9-banner.projection { color: #7c3d00 !important; background: #fff0df !important; border-color: #fb923c; }
.mf-l9-tag.snapshot, .mf-l9-banner.snapshot { color: #84203b !important; background: #ffe9ef !important; border-color: #fb7185; }

body:not(.light) .mf-l9-tag.semantic, body:not(.light) .mf-l9-banner.semantic { color: #dbeeff !important; background: #17375b !important; border-color: #60a5fa; }
body:not(.light) .mf-l9-tag.kernel, body:not(.light) .mf-l9-banner.kernel { color: #d7fff7 !important; background: #12433e !important; border-color: #2dd4bf; }
body:not(.light) .mf-l9-tag.external, body:not(.light) .mf-l9-banner.external { color: #eef4fb !important; background: #2d3b4f !important; border-color: #94a3b8; }
body:not(.light) .mf-l9-tag.reuse, body:not(.light) .mf-l9-banner.reuse { color: #d9ffea !important; background: #16442e !important; border-color: #34d399; }
body:not(.light) .mf-l9-tag.review, body:not(.light) .mf-l9-banner.review { color: #fff2c5 !important; background: #4b3410 !important; border-color: #f59e0b; }
body:not(.light) .mf-l9-tag.handoff, body:not(.light) .mf-l9-banner.handoff { color: #f1e7ff !important; background: #392457 !important; border-color: #a78bfa; }
body:not(.light) .mf-l9-tag.projection, body:not(.light) .mf-l9-banner.projection { color: #ffead7 !important; background: #4a2c12 !important; border-color: #fb923c; }
body:not(.light) .mf-l9-tag.snapshot, body:not(.light) .mf-l9-banner.snapshot { color: #ffe5ec !important; background: #4b1e2b !important; border-color: #fb7185; }

.mf-l9-detail {
  min-width: 0;
  overflow: auto;
  padding: 18px 20px 60px;
  color: var(--l9-text) !important;
  background: var(--l9-bg) !important;
}

.mf-l9-hero {
  padding: 17px 18px;
  color: var(--l9-text) !important;
  background: var(--l9-panel) !important;
  border: 1px solid var(--l9-border);
  border-radius: 15px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
}

.mf-l9-hero-top { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.mf-l9-hero h1 { margin: 8px 0 4px; color: var(--l9-text) !important; font-size: 24px; line-height: 1.2; }
.mf-l9-qualified { color: var(--l9-muted) !important; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.mf-l9-qualified code { color: inherit !important; }

.mf-l9-banner {
  margin-top: 12px;
  padding: 10px 12px;
  color: var(--l9-text) !important;
  background: var(--l9-accent-soft) !important;
  border: 1px solid var(--l9-border);
  border-radius: 10px;
  font-size: 11px;
  line-height: 1.45;
}

.mf-l9-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 13px;
}

.mf-l9-metric {
  min-width: 0;
  padding: 9px;
  color: var(--l9-text) !important;
  background: var(--l9-panel-2) !important;
  border: 1px solid var(--l9-line);
  border-radius: 10px;
}

.mf-l9-metric b { display: block; overflow: hidden; color: var(--l9-text) !important; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.mf-l9-metric span { color: var(--l9-muted) !important; font-size: 9px; }

.mf-l9-tabs {
  position: sticky;
  top: -18px;
  z-index: 4;
  display: flex;
  gap: 4px;
  margin: 14px 0 12px;
  padding: 8px 0;
  overflow: auto;
  background: var(--l9-bg) !important;
  border-bottom: 1px solid var(--l9-line);
}

.mf-l9-tabs button { white-space: nowrap; }
.mf-l9-tabs button.active {
  color: #ffffff !important;
  background: #9d174d !important;
  border-color: #9d174d !important;
}

body:not(.light) .mf-l9-tabs button.active { color: #1b1020 !important; background: #f0abfc !important; border-color: #f0abfc !important; }

.mf-l9-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }

.mf-l9-card {
  min-width: 0;
  padding: 15px;
  color: var(--l9-text) !important;
  background: var(--l9-panel) !important;
  border: 1px solid var(--l9-line);
  border-radius: 13px;
}

.mf-l9-card h3,
.mf-l9-section-heading { margin: 0 0 8px; color: var(--l9-text) !important; font-size: 14px; }
.mf-l9-section-heading { margin-top: 18px; }
.mf-l9-card p { margin: 0; color: var(--l9-muted) !important; line-height: 1.55; }
.mf-l9-card p b { color: var(--l9-text) !important; }
.mf-l9-decision-card { border-left: 4px solid #22c55e; }
.mf-l9-next-card { border-left: 4px solid #f59e0b; }

.mf-l9-review-answer {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.mf-l9-review-answer > div {
  min-width: 0;
  padding: 12px;
  color: var(--l9-text) !important;
  background: var(--l9-panel) !important;
  border: 1px solid var(--l9-line);
  border-radius: 11px;
}

.mf-l9-review-answer span { display: block; color: var(--l9-muted) !important; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.mf-l9-review-answer b { display: block; margin-top: 5px; color: var(--l9-text) !important; font-size: 13px; line-height: 1.35; }

.mf-l9-dl,
.mf-l9-compact-dl {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  overflow: hidden;
  color: var(--l9-text) !important;
  background: var(--l9-panel) !important;
  border: 1px solid var(--l9-line);
  border-radius: 11px;
}

.mf-l9-dl dt,
.mf-l9-dl dd,
.mf-l9-compact-dl dt,
.mf-l9-compact-dl dd {
  margin: 0;
  padding: 9px 11px;
  border-bottom: 1px solid var(--l9-line);
}

.mf-l9-dl dt,
.mf-l9-compact-dl dt { color: var(--l9-muted) !important; background: var(--l9-panel-2) !important; font-size: 10px; font-weight: 850; }
.mf-l9-dl dd,
.mf-l9-compact-dl dd { color: var(--l9-text) !important; background: var(--l9-panel) !important; font-size: 12px; line-height: 1.45; }
.mf-l9-margin-top { margin-top: 12px; }

.mf-l9-column-warning {
  margin: 14px 0 10px;
  padding: 11px 13px;
  color: #663b00 !important;
  background: #fff7db !important;
  border: 1px solid #eab308;
  border-radius: 10px;
  font-size: 11px;
  line-height: 1.45;
}

body:not(.light) .mf-l9-column-warning { color: #fff2c2 !important; background: #3b2e0e !important; border-color: #ca8a04; }

.mf-l9-table-wrap { margin-top: 12px; overflow: auto; border-radius: 11px; }
.mf-l9-table { width: 100%; border-collapse: separate; border-spacing: 0; color: var(--l9-text) !important; background: var(--l9-panel) !important; border: 1px solid var(--l9-line); border-radius: 11px; overflow: hidden; }
.mf-l9-table th { position: sticky; top: 0; padding: 8px; color: #34445a !important; background: #eaf0f7 !important; font-size: 9px; text-align: left; text-transform: uppercase; }
body:not(.light) .mf-l9-table th { color: #edf4ff !important; background: #21314a !important; }
.mf-l9-table td { padding: 8px; color: var(--l9-text) !important; background: var(--l9-panel) !important; border-top: 1px solid var(--l9-line); font-size: 11px; line-height: 1.4; vertical-align: top; }
.mf-l9-table code { color: #1d4ed8 !important; }
body:not(.light) .mf-l9-table code { color: #93c5fd !important; }

.mf-l9-owner-link {
  min-height: 30px;
  color: #075f3b !important;
  background: #ecfdf3 !important;
  border-color: #34d399 !important;
  font-size: 10px;
  font-weight: 800;
}
body:not(.light) .mf-l9-owner-link { color: #d9ffeb !important; background: #16442e !important; }

.mf-l9-empty { display: grid; place-items: center; min-height: 220px; padding: 20px; color: var(--l9-muted) !important; text-align: center; }

/* ERD overlay */
.mf-l9-erd-shell .mf-l9-body { grid-template-columns: minmax(0, 1fr) 390px; }
.mf-l9-erd-canvas { min-width: 0; overflow: hidden; color: var(--l9-text) !important; background: var(--l9-bg) !important; }
.mf-l9-erd-toolbar { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 9px 12px; color: var(--l9-text) !important; background: var(--l9-panel) !important; border-bottom: 1px solid var(--l9-line); }
.mf-l9-erd-toolbar label { display: inline-flex; align-items: center; gap: 6px; color: var(--l9-text) !important; font-size: 11px; }
.mf-l9-erd-toolbar span { color: var(--l9-muted) !important; font-size: 10px; }
.mf-l9-erd-toolbar button { margin-left: auto; }
.mf-l9-erd-scroll { height: calc(100% - 52px); overflow: auto; padding: 18px; background: var(--l9-bg) !important; }
.mf-l9-erd-svg { display: block; min-width: 1220px; min-height: 960px; }
.mf-l9-lane { fill: #eef2f7; stroke: #b8c5d5; stroke-width: 1; }
.mf-l9-lane.reuse { fill: #eaf9f0; stroke: #34d399; }
.mf-l9-lane.review { fill: #fff7e2; stroke: #f59e0b; }
.mf-l9-lane.handoff { fill: #f4edff; stroke: #a78bfa; }
body:not(.light) .mf-l9-lane { fill: #132033; stroke: #52657e; }
body:not(.light) .mf-l9-lane.reuse { fill: #123526; stroke: #34d399; }
body:not(.light) .mf-l9-lane.review { fill: #392b11; stroke: #f59e0b; }
body:not(.light) .mf-l9-lane.handoff { fill: #302043; stroke: #a78bfa; }
.mf-l9-lane-title { fill: #172033; font-size: 15px; font-weight: 900; }
body:not(.light) .mf-l9-lane-title { fill: #f8fafc; }
.mf-l9-node rect { fill: #ffffff; stroke: #94a3b8; stroke-width: 1.5; rx: 10; }
.mf-l9-node.reuse rect { fill: #f3fff7; stroke: #16a34a; }
.mf-l9-node.review rect { fill: #fffbeb; stroke: #d97706; }
.mf-l9-node.handoff rect { fill: #faf5ff; stroke: #8b5cf6; }
body:not(.light) .mf-l9-node rect { fill: #17243a; stroke: #64748b; }
body:not(.light) .mf-l9-node.reuse rect { fill: #173c2a; stroke: #34d399; }
body:not(.light) .mf-l9-node.review rect { fill: #453313; stroke: #fbbf24; }
body:not(.light) .mf-l9-node.handoff rect { fill: #39254f; stroke: #c4b5fd; }
.mf-l9-node:hover rect,
.mf-l9-node.selected rect { stroke: #be185d; stroke-width: 3; }
.mf-l9-node text { fill: #172033; font-size: 10px; }
.mf-l9-node .title { font-size: 11px; font-weight: 850; }
.mf-l9-node .sub { fill: #53647a; font-size: 8px; }
body:not(.light) .mf-l9-node text { fill: #f8fafc; }
body:not(.light) .mf-l9-node .sub { fill: #d0dae8; }
.mf-l9-edge { fill: none; stroke: #be185d; stroke-width: 1.6; stroke-dasharray: 5 4; opacity: .66; }
.mf-l9-edge.provisional { stroke: #64748b; }
.mf-l9-erd-inspector { overflow: auto; padding: 14px; color: var(--l9-text) !important; background: var(--l9-panel) !important; border-left: 1px solid var(--l9-line); }
.mf-l9-erd-inspector h2 { color: var(--l9-text) !important; }

/* Statistics contextual controls and content */
#statsLayerPicker .mf-l9-layer-filter,
.mf-l9-layer-filter {
  color: #6b145f !important;
  background: #fae8ff !important;
  border-color: #c026d3 !important;
  font-weight: 850 !important;
}
#statsLayerPicker .mf-l9-layer-filter.active,
.mf-l9-layer-filter.active {
  color: #ffffff !important;
  background: #a21caf !important;
  border-color: #a21caf !important;
}
body:not(.light) #statsLayerPicker .mf-l9-layer-filter,
body:not(.light) .mf-l9-layer-filter { color: #f5d5fa !important; background: #32143c !important; border-color: #d946ef !important; }
body:not(.light) #statsLayerPicker .mf-l9-layer-filter.active,
body:not(.light) .mf-l9-layer-filter.active { color: #1b1020 !important; background: #f0abfc !important; border-color: #f0abfc !important; }

.mf-l9-stats-tab { color: #6b145f !important; border-color: #c026d3 !important; }
.mf-l9-stats-tab.active { color: #ffffff !important; background: #a21caf !important; border-color: #a21caf !important; }
body:not(.light) .mf-l9-stats-tab { color: #f5d5fa !important; }
body:not(.light) .mf-l9-stats-tab.active { color: #1b1020 !important; background: #f0abfc !important; }
.mf-l9-stats { padding: 18px 20px 50px; color: var(--l9-text) !important; background: var(--l9-bg) !important; }
.mf-l9-stats-banner { margin-bottom: 14px; padding: 13px 15px; color: #4b174d !important; background: #fae8ff !important; border: 1px solid #c084fc; border-radius: 12px; line-height: 1.5; }
body:not(.light) .mf-l9-stats-banner { color: #f8e9fb !important; background: #32143c !important; border-color: #d946ef; }
.mf-l9-stat-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.mf-l9-stat-card { min-width: 0; padding: 13px; color: var(--l9-text) !important; background: var(--l9-panel) !important; border: 1px solid var(--l9-line); border-radius: 12px; }
.mf-l9-stat-card b { display: block; color: var(--l9-text) !important; font-size: 24px; }
.mf-l9-stat-card span { display: block; color: var(--l9-muted) !important; font-size: 10px; line-height: 1.35; }
.mf-l9-stat-section { margin-top: 16px; padding: 15px; color: var(--l9-text) !important; background: var(--l9-panel) !important; border: 1px solid var(--l9-line); border-radius: 13px; }
.mf-l9-stat-section h3 { margin: 0 0 12px; color: var(--l9-text) !important; }
.mf-l9-stat-section p { color: var(--l9-muted) !important; line-height: 1.55; }
.mf-l9-bar { display: grid; grid-template-columns: minmax(220px, 340px) minmax(140px, 1fr) 52px; gap: 10px; align-items: center; margin: 9px 0; color: var(--l9-text) !important; font-size: 11px; }
.mf-l9-bar-track { height: 11px; overflow: hidden; background: #dbe4ef !important; border-radius: 999px; }
body:not(.light) .mf-l9-bar-track { background: #263850 !important; }
.mf-l9-bar-fill { height: 100%; background: linear-gradient(90deg, #a21caf, #7c3aed) !important; border-radius: inherit; }

/* Storybook contextual L9 filter state: L9 is not shown as an always-on toolbar action. */
.mf-l9-launch {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #6b145f !important;
  background: #fae8ff !important;
  border-color: #c026d3 !important;
  font-weight: 850;
}
.mf-l9-launch .mf-l9-count { display: inline-grid; place-items: center; min-width: 24px; height: 20px; padding: 0 6px; color: #ffffff !important; background: #a21caf !important; border-radius: 999px; font-size: 10px; }
body:not(.light) .mf-l9-launch { color: #f9e8fc !important; background: #32143c !important; border-color: #d946ef !important; }
body:not(.light) .mf-l9-launch .mf-l9-count { color: #1b1020 !important; background: #f0abfc !important; }

body.mf-l9-story-filter-active .filters { grid-template-columns: 1fr !important; }
body.mf-l9-story-filter-active .filters #type,
body.mf-l9-story-filter-active .filters #schema { display: none !important; }
body.mf-l9-story-filter-active #tree { background: var(--panel) !important; }

.mf-l9-repository-card {
  margin: 14px;
  padding: 16px;
  color: #172033 !important;
  background: #ffffff !important;
  border: 1px solid #c084fc;
  border-radius: 13px;
  box-shadow: 0 8px 22px rgba(82, 35, 103, .12);
}
.mf-l9-repository-card h3 { margin: 9px 0 7px; color: #172033 !important; font-size: 14px; }
.mf-l9-repository-card p { margin: 0 0 12px; color: #52647a !important; font-size: 11px; line-height: 1.5; }
.mf-l9-repository-card button { color: #ffffff !important; background: #a21caf !important; border-color: #a21caf !important; }
body:not(.light) .mf-l9-repository-card { color: #f8fafc !important; background: #17243a !important; border-color: #d946ef; }
body:not(.light) .mf-l9-repository-card h3 { color: #f8fafc !important; }
body:not(.light) .mf-l9-repository-card p { color: #cbd5e1 !important; }

@media (max-width: 1100px) {
  .mf-l9-shell { inset: 1.5vh 1.5vw; }
  .mf-l9-body { grid-template-columns: 280px minmax(0, 1fr); }
  .mf-l9-grid { grid-template-columns: 1fr; }
  .mf-l9-metrics, .mf-l9-stat-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mf-l9-review-answer { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .mf-l9-shell { inset: 0; border-radius: 0; }
  .mf-l9-head { align-items: flex-start; padding: 11px 12px; }
  .mf-l9-head-actions .mf-l9-authority { display: none; }
  .mf-l9-body { grid-template-columns: 1fr; }
  .mf-l9-list-panel { max-height: 43vh; border-right: 0; border-bottom: 1px solid var(--l9-line); }
  .mf-l9-detail { padding: 12px; }
  .mf-l9-metrics, .mf-l9-stat-cards { grid-template-columns: 1fr 1fr; }
  .mf-l9-erd-shell .mf-l9-body { grid-template-columns: 1fr; }
  .mf-l9-erd-inspector { display: none; }
  .mf-l9-bar { grid-template-columns: 1fr 70px 36px; }
  .mf-l9-dl, .mf-l9-compact-dl { grid-template-columns: 1fr; }
}

/* RC3 reviewer orientation: visible only while the Storybook L9 filter is selected. */
.mf-l9-context-banner {
  margin: 18px;
  padding: 0;
  color: var(--l9-text) !important;
  background: var(--l9-panel) !important;
  border: 1px solid var(--l9-border) !important;
  border-radius: 16px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .14);
}
.mf-l9-context-banner .mf-l9-repository-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  margin: 0;
  padding: 22px;
  color: var(--l9-text) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.mf-l9-context-copy { min-width: 0; }
.mf-l9-context-banner .mf-l9-repository-card h3 {
  margin: 10px 0 8px;
  color: var(--l9-text) !important;
  font-size: 20px;
  line-height: 1.28;
}
.mf-l9-context-banner .mf-l9-repository-card p {
  margin: 0;
  max-width: 1050px;
  color: var(--l9-muted) !important;
  font-size: 13px;
  line-height: 1.55;
}
.mf-l9-context-banner .mf-l9-repository-card p b { color: var(--l9-text) !important; }
.mf-l9-context-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin: 15px 0;
}
.mf-l9-context-metrics span {
  min-width: 0;
  padding: 11px 12px;
  color: var(--l9-muted) !important;
  background: var(--l9-panel-2) !important;
  border: 1px solid var(--l9-line);
  border-radius: 10px;
  font-size: 11px;
  line-height: 1.4;
}
.mf-l9-context-metrics b {
  display: block;
  margin-bottom: 2px;
  color: var(--l9-text) !important;
  font-size: 20px;
}
.mf-l9-context-disposition {
  padding: 11px 13px;
  color: var(--l9-text) !important;
  background: var(--l9-accent-soft) !important;
  border-left: 4px solid var(--l9-accent);
  border-radius: 0 9px 9px 0;
}
.mf-l9-context-banner #mfL9RepositoryOpen {
  min-width: 210px;
  min-height: 46px;
  padding: 10px 16px;
  color: #ffffff !important;
  background: #86198f !important;
  border: 1px solid #86198f !important;
  border-radius: 10px;
  font-weight: 850;
  line-height: 1.25;
}
body:not(.light) .mf-l9-context-banner #mfL9RepositoryOpen {
  color: #1b1020 !important;
  background: #f0abfc !important;
  border-color: #f0abfc !important;
}
.mf-l9-context-banner #mfL9RepositoryOpen:hover,
.mf-l9-context-banner #mfL9RepositoryOpen:focus-visible {
  filter: brightness(1.04);
  outline: 3px solid color-mix(in srgb, var(--l9-accent) 45%, transparent);
  outline-offset: 2px;
}

.mf-l9-nav-note {
  display: grid;
  gap: 5px;
  margin: 12px;
  padding: 14px;
  color: var(--l9-text) !important;
  background: var(--l9-panel-2) !important;
  border: 1px solid var(--l9-border);
  border-radius: 12px;
}
.mf-l9-nav-note b { color: var(--l9-text) !important; font-size: 13px; }
.mf-l9-nav-note span { color: var(--l9-text) !important; font-size: 11px; }
.mf-l9-nav-note small { color: var(--l9-muted) !important; font-size: 10px; line-height: 1.4; }

/* When L9 is selected, suppress the stale L1–L8 physical-table story and
   relationship compass.  The prior table remains in application state for a
   lossless return, but it is not visually misrepresented as an L9 table. */
body.mf-l9-story-filter-active #app {
  grid-template-columns: 300px minmax(0, 1fr) !important;
}
body.mf-l9-story-filter-active .topbar { grid-column: 1 / 3 !important; }
body.mf-l9-story-filter-active #app > .context,
body.mf-l9-story-filter-active #rightPanelRestore { display: none !important; }
body.mf-l9-story-filter-active .story > :not(#mfL9ContextBanner) { display: none !important; }
body.mf-l9-story-filter-active .story {
  display: block !important;
  overflow: auto !important;
  background: var(--bg) !important;
}
body.mf-l9-story-filter-active .nav #tree,
body.mf-l9-story-filter-active .nav .mf-story-advanced-filters,
body.mf-l9-story-filter-active .nav .mf-unresolved-nav { display: none !important; }
body.mf-l9-story-filter-active .filters { grid-template-columns: 1fr !important; }
body.mf-l9-story-filter-active .filters #type,
body.mf-l9-story-filter-active .filters #schema { display: none !important; }

/* Defensive native-control and state contrast. */
.mf-l9-shell option {
  color: var(--l9-text) !important;
  background: var(--l9-panel) !important;
}
.mf-l9-shell button:disabled,
.mf-l9-shell input:disabled,
.mf-l9-shell select:disabled {
  color: var(--l9-muted) !important;
  background: var(--l9-panel-2) !important;
  opacity: .72;
}
.mf-l9-shell :focus-visible {
  outline: 3px solid color-mix(in srgb, var(--l9-accent) 55%, transparent) !important;
  outline-offset: 2px;
}

@media (max-width: 1100px) {
  .mf-l9-context-banner .mf-l9-repository-card { grid-template-columns: 1fr; }
  .mf-l9-context-banner #mfL9RepositoryOpen { width: 100%; }
  .mf-l9-context-metrics { grid-template-columns: 1fr; }
}
@media (max-width: 800px) {
  body.mf-l9-story-filter-active #app { display: block !important; }
  body.mf-l9-story-filter-active .topbar { grid-column: auto !important; }
  .mf-l9-context-banner { margin: 10px; }
  .mf-l9-context-banner .mf-l9-repository-card { padding: 16px; }
}
