/* Impact network: a dark analytical canvas within the light workspace. */
.impact-panel {
  --network-bg: #0c1828;
  --network-surface: #132237;
  --network-border: #26374c;
  --network-text: #e9f0f8;
  --network-muted: #9aaec5;
  --network-teal: #58dcc6;
  --network-amber: #ecc183;
  --network-factor: #aaa9fa;
  --network-coral: #ff958d;
  color: var(--network-text);
  background: var(--network-bg);
  border: 1px solid #203349;
  border-radius: 17px;
  box-shadow: 0 12px 32px #11223612;
  overflow: hidden;
  margin-bottom: 24px;
  isolation: isolate;
  color-scheme: dark;
}

.impact-panel .graph-header {
  min-height: 76px;
  padding: 21px 25px 17px;
  border-bottom: 1px solid #ffffff0d;
  background: #102034;
}

.impact-panel .section-heading { gap: 11px; }
.impact-panel .section-heading h2 { color: #f0f5fc; font-size: 17px; font-weight: 600; letter-spacing: -.15px; }
.impact-panel .section-heading > i { color: var(--network-teal); }
.network-heading { min-width: 0; }
.network-eyebrow { display: block; color: #95acc4; font-size: 9px; letter-spacing: 1.6px; font-weight: 500; }
.network-heading h2 { margin: 5px 0 5px; color: #f0f5fc; font-size: 27px; line-height: 1.25; font-weight: 550; letter-spacing: -.6px; }
.network-heading-dot { color: var(--network-teal); }
.network-heading p { margin: 0; color: #9db4cb; font-size: 11px; line-height: 1.65; }
.impact-panel .step { color: #8da4be; font-size: 10px; }
.impact-panel .small-badge { color: #85e7d5; background: #58dcc615; border: 1px solid #58dcc62c; font-size: 9px; padding: 3px 7px; }
.impact-panel .small-badge.neutral { color: #b1c0d2; background: #ffffff08; border-color: #ffffff14; }
.impact-panel .graph-tabs { align-self: center; gap: 5px; padding: 4px; border: 1px solid #304258; border-radius: 8px; background: #091827; }
.impact-panel .graph-tabs button { padding: 8px 13px; min-height: 34px; border: 0; border-radius: 5px; color: #a7b8cc; font-size: 11px; transition: color .16s, background .16s; }
.impact-panel .graph-tabs button:hover { color: #fff; background: #24374d; }
.impact-panel .graph-tabs button.active { color: #c4fff3; background: #25463f; }

.network-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 68px;
  padding: 13px 25px;
  border-bottom: 1px solid #ffffff0c;
  background: #0e1c2d;
}

.network-play,
.network-icon-button,
.impact-panel #network-expand,
.impact-panel #network-focus-clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  border: 1px solid #34475e;
  border-radius: 7px;
  padding: 8px 12px;
  color: #c1cedf;
  background: #17283d;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  white-space: nowrap;
  transition: background .16s, border-color .16s, color .16s;
}

.network-play { min-width: 118px; color: #062c2b; background: var(--network-teal); border-color: var(--network-teal); font-weight: 650; }
.network-play:hover { background: #84eedb; border-color: #a6f7e9; }
.network-icon-button { width: 38px; padding: 8px; }
.impact-panel .network-toolbar .icon { width: 16px; height: 16px; }
.network-icon-button:hover,
.impact-panel #network-expand:hover,
.impact-panel #network-focus-clear:hover { background: #233a53; border-color: #55718f; color: #fff; }
.impact-panel #network-expand[aria-pressed="true"],
.impact-panel #network-expand[aria-expanded="true"] { color: #a0f1e1; background: #173c3b; border-color: #437f76; }
.impact-panel #network-focus-clear { font-weight: 400; border-style: dashed; }
.impact-panel button:disabled { cursor: not-allowed; opacity: .4; }
.network-divider { width: 1px; height: 24px; background: #314359; margin: 0 5px; flex-shrink: 0; }
.network-view-control { display: flex; align-items: center; gap: 9px; margin-left: auto; color: #a5b9ce; font-size: 10px; }
.impact-panel #network-portfolio { width: auto; min-width: 175px; max-width: 270px; margin-left: 0; min-height: 38px; border: 1px solid #34475e; color: #d7e2ee; background: #14263a; border-radius: 7px; padding: 8px 30px 8px 11px; font-size: 11px; }
.impact-panel #network-portfolio:hover { border-color: #66839f; }
.impact-panel #network-portfolio option { color: #e8f1fb; background: #14263a; }
.impact-panel button:focus-visible,
.impact-panel select:focus-visible,
.impact-panel input:focus-visible,
.impact-panel [role="button"]:focus-visible { outline: 2px solid #9df7e6; outline-offset: 4px; }

.network-overview {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px 17px;
  padding: 0;
  margin-left: auto;
  color: #9aafc7;
  font-size: 11px;
}

#network-portfolio-label { color: #cad8e9; font-weight: 500; }
#network-return { color: #eaf1fa; font-size: 20px; font-weight: 600; letter-spacing: -.3px; font-variant-numeric: tabular-nums; }
#network-pnl { color: #a9bbcf; font-variant-numeric: tabular-nums; }
.impact-panel .negative { color: var(--network-coral) !important; }
.impact-panel .positive { color: var(--network-teal) !important; }

.network-summary {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 43px;
  padding: 11px 25px;
  color: #bac9dc;
  font-size: 11px;
}

.network-summary > div:first-child { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.network-live-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--network-teal); box-shadow: 0 0 0 4px #58dcc614; margin-right: 2px; flex-shrink: 0; }
#network-stage { color: #d8e6f6; font-weight: 500; }
#network-count { margin-left: 4px; color: #8fa5be; font-size: 10px; font-variant-numeric: tabular-nums; }
.network-motion-note { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 7px 24px; padding: 12px 25px; margin: 0; border-top: 1px solid #263b52; color: #9aafc6; background: #0c1929; font-size: 10px; line-height: 1.7; }
.network-motion-note > span:last-child { color: #b8aa94; }
.impact-panel .graph-subhead { color: #9baec7; background: #102034; border-color: #ffffff0c; padding: 10px 25px; font-size: 10px; }
.impact-panel .graph-subhead > span:first-child { color: #a6becd; }
.impact-panel .teal-dot { background: var(--network-teal); }
.impact-panel .graph-disclaimer { padding: 9px 25px; background: #ecc18308; border-color: #ecc18312; color: #d1b183; font-size: 10px; letter-spacing: .1px; }

.impact-panel #graph-viewport {
  position: relative;
  display: block;
  height: auto;
  max-height: none;
  padding: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #405570 #0c1828;
  background-color: #0c1828;
  background-image: radial-gradient(circle at 1px 1px, #87a6ce1f .8px, transparent .9px);
  background-size: 22px 22px;
}

.impact-panel #graph-viewport::-webkit-scrollbar { width: 8px; height: 8px; }
.impact-panel #graph-viewport::-webkit-scrollbar-track { background: #0c1828; }
.impact-panel #graph-viewport::-webkit-scrollbar-thumb { background: #405570; border: 2px solid #0c1828; border-radius: 8px; }
.impact-panel #graph-viewport::-webkit-scrollbar-corner { background: #0c1828; }
.impact-panel #causal-graph { display: block; width: 100%; min-width: 950px; height: auto; flex-shrink: 0; overflow: visible; transition: none; touch-action: pan-x pan-y; }
.impact-panel.is-expanded #graph-viewport,
.impact-panel.network-expanded #graph-viewport { height: min(76vh, 850px); min-height: 520px; }

/* Node and edge paints are authored in graph.js; these rules add interaction. */
.impact-panel .impact-node { cursor: pointer; }
.impact-panel .impact-node text { font-family: var(--font); pointer-events: none; }
.impact-panel .impact-node-card { transition: stroke-width .15s, stroke .15s; }
.impact-panel .impact-node:hover .impact-node-card { stroke-width: 2.2px; }
.impact-panel .impact-node:focus-visible { outline: none; }
.impact-panel .impact-node:focus-visible .impact-node-card { stroke: #b9fff0; stroke-width: 3px; }
.impact-panel .impact-node.is-focused .impact-node-card { stroke-width: 2.2px; }
.impact-panel .impact-node.is-current .impact-node-card,
.impact-panel .impact-node[data-state="current"] .impact-node-card { stroke-width: 2.4px; }
.impact-panel .impact-node-value { font-variant-numeric: tabular-nums; }
.impact-panel .impact-edge { cursor: pointer; }
.impact-panel .impact-edge-line { transition: stroke-width .15s; }
.impact-panel .impact-edge-hit { fill: none; stroke: transparent; stroke-width: 16px; pointer-events: stroke; }
.impact-panel .impact-edge:hover .impact-edge-line,
.impact-panel .impact-edge.is-focused .impact-edge-line { stroke-width: 2.7px; }
.impact-panel .impact-edge:focus-visible { outline: none; }
.impact-panel .impact-edge:focus-visible .impact-edge-line { stroke: #b9fff0; stroke-width: 3px; }
.impact-panel .impact-edge-particle { pointer-events: none; }
.impact-panel .impact-node.is-muted,
.impact-panel .impact-edge.is-muted { opacity: .25; }
.impact-panel .impact-node.is-muted:hover,
.impact-panel .impact-node.is-muted:focus-visible,
.impact-panel .impact-edge.is-muted:hover,
.impact-panel .impact-edge.is-muted:focus-visible { opacity: .9; }

.network-timeline {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 17px 25px 7px;
  border-top: 1px solid #2a3b51;
  background: #0f1e30;
}

.network-timeline > label { flex-shrink: 0; color: #aebed2; font-size: 10px; font-weight: 500; }
.impact-panel #network-scrubber { display: block; flex: 1; min-width: 60px; width: auto; height: 5px; margin: 10px 0; accent-color: var(--network-teal); cursor: ew-resize; }
#network-progress { min-width: 36px; text-align: right; font-size: 11px; color: #b8eadf; font-variant-numeric: tabular-nums; }
.network-stages { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; padding: 9px 25px 18px; background: #0f1e30; }
.network-stages [data-stage] { display: flex; align-items: center; justify-content: center; gap: 7px; min-width: 0; padding: 6px; color: #849ab5; font-size: 10px; font-weight: 400; line-height: 1.4; border-radius: 5px; }
.network-stages [data-stage]::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #526881; flex-shrink: 0; }
.network-stages [data-stage].is-complete,
.network-stages [data-stage].complete,
.network-stages [data-stage].completed,
.network-stages [data-state="completed"] { color: #aadacc; }
.network-stages [data-stage].is-complete::before,
.network-stages [data-stage].complete::before,
.network-stages [data-stage].completed::before,
.network-stages [data-state="completed"]::before { background: #58c7ad; }
.network-stages [data-stage].is-current,
.network-stages [data-stage].active,
.network-stages [data-state="current"] { color: #b8fff0; background: #58dcc611; }
.network-stages [data-stage].is-current::before,
.network-stages [data-stage].active::before,
.network-stages [data-state="current"]::before { background: var(--network-teal); box-shadow: 0 0 0 3px #58dcc615; }
.network-stages button[data-stage]:hover { color: #dcfff7; background: #ffffff08; }

.impact-panel .graph-footer { border-top: 1px solid #293c52; background: #0d1b2c; padding: 13px 25px; gap: 13px; }
.impact-panel .graph-legend { flex-wrap: wrap; gap: 10px 18px; }
.impact-panel .graph-legend > span { color: #a0b3cb; font-size: 10px; gap: 7px; }
.impact-panel .legend-line { width: 18px; border-color: #ecc183; }
.impact-panel .legend-line.mechanism { border-color: var(--network-amber); border-top-style: dashed; }
.impact-panel .legend-line.mapping { border-color: var(--network-factor); border-top-style: solid; }
.impact-panel .legend-line.exposure { border-color: #85b6ed; border-top-style: solid; }
.impact-panel .legend-line.aggregation { border-color: var(--network-teal); border-top-style: solid; }
.impact-panel .graph-controls { color: #a4b7cd; gap: 5px; }
.impact-panel .graph-controls button { min-width: 30px; min-height: 30px; border: 1px solid #32465e; border-radius: 5px; background: #15273a; }
.impact-panel .graph-controls button:hover { color: #cefff3; background: #244238; border-color: #437f76; }
.impact-panel .graph-controls .icon { width: 14px; height: 14px; }
.impact-panel .graph-controls > span { min-width: 40px; font-size: 10px; }
.impact-panel .trace-view { padding: 25px; min-height: 420px; background: #0e1d2e; }
.impact-panel .trace-number { color: #a0f6e3; background: #20463f; }
.impact-panel .trace-item:not(:last-child)::before { background: #355346; }
.impact-panel .trace-item h3 { color: #e1ebf6; }
.impact-panel .trace-item p { color: #adbed1; }

.network-canvas-wrap { position: relative; min-width: 0; }
.network-inspector {
  position: absolute;
  z-index: 5;
  top: 16px;
  right: 16px;
  width: 300px;
  max-width: calc(100% - 32px);
  max-height: 480px;
  overflow: auto;
  color: #d4e3f2;
  background: #13263b;
  border: 1px solid #3a746f;
  border-radius: 12px;
  box-shadow: 0 15px 45px #030a1680, 0 0 0 1px #0b192e55;
  scrollbar-width: thin;
  scrollbar-color: #4e6983 #13263b;
}

.network-inspector-heading { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 12px 15px; background: #13263b; border-bottom: 1px solid #35516b; }
.network-inspector-heading h3 { margin: 0; color: #e6f3fb; font-size: 12px; line-height: 1.45; font-weight: 600; }
.network-inspector-heading button { display: inline-grid; place-items: center; margin-left: auto; width: 30px; height: 30px; flex-shrink: 0; border: 1px solid #415e77; border-radius: 6px; color: #c3d7e8; background: #1a3249; }
.network-inspector-heading button:hover { color: #eafff9; background: #2a514e; border-color: #6bb6a7; }
.network-inspector-heading .icon { width: 15px; height: 15px; }
#network-detail { padding: 0 16px 17px; }
.network-inspector .evidence-kicker { color: #9bb3cc; font-size: 9px; margin: 17px 0 8px; letter-spacing: .5px; }
.network-inspector .evidence-title { color: #f0f6fc; font-size: 16px; line-height: 1.55; margin: 0 0 12px; }
.network-inspector .evidence-tag { color: #f1cb90; background: #ecc1830f; border-color: #b9935259; font-size: 10px; line-height: 1.5; }
.network-inspector .evidence-body { color: #b2c5d8; font-size: 12px; line-height: 1.8; margin: 13px 0 17px; }
.network-inspector .evidence-section-title { color: #d1e5f1; font-size: 11px; margin: 18px 0 10px; }
.network-inspector .evidence-section-title .icon { color: #88cbbd; }
.network-inspector .evidence-record { background: #0e1e31; border-color: #31485f; padding: 11px; }
.network-inspector .evidence-record-top { color: #a7bbce; font-size: 9px; flex-wrap: wrap; gap: 4px; }
.network-inspector .evidence-record-top > span:first-child { color: #8fd4c3; font-size: 9px; }
.network-inspector .evidence-record strong { color: #d0e1f1; font-size: 11px; }
.network-inspector .evidence-record p { color: #aec2d5; font-size: 11px; line-height: 1.75; }
.network-inspector .evidence-record .record-status { color: #dfbd87; font-size: 9px; }
.network-inspector .assumption-list li { color: #b1c5d9; font-size: 11px; line-height: 1.75; }
.network-inspector .assumption-list li::before { background: #78b9aa; }
.network-inspector .limitation-box { color: #dfc49d; border-color: #c79d5a; background: #ecc18309; font-size: 11px; line-height: 1.75; }
.network-inspector .evidence-reference { color: #9eb5cb; border-color: #365169; font-size: 10px; overflow-wrap: anywhere; }
.network-inspector a { color: #8de4d0; }
.network-inspector a:hover { text-decoration: underline; }
.network-inspector .audit-row { color: #b3c8da; border-color: #365169; }
.network-inspector .audit-pass { color: #8de4d0; }
.network-inspector .audit-missing { color: #e9c285; }

@media (min-width: 1600px) {
  .impact-panel #graph-viewport { height: auto; }
  .impact-panel .graph-header { padding-left: 30px; padding-right: 30px; }
  .network-toolbar, .network-summary, .network-motion-note { padding-left: 30px; padding-right: 30px; }
}

@media (max-width: 1050px) {
  .impact-panel .graph-header { padding: 18px 20px; }
  .network-toolbar { padding: 12px 20px; }
  .network-summary { padding-left: 20px; padding-right: 20px; }
  .impact-panel #network-portfolio { min-width: 150px; max-width: 215px; }
  .network-motion-note { padding-left: 20px; padding-right: 20px; }
  .impact-panel .graph-footer { padding-left: 20px; padding-right: 20px; }
}

@media (max-width: 800px) {
  .impact-panel { border-radius: 13px; margin-bottom: 18px; }
  .impact-panel .graph-header { padding: 17px 16px; gap: 12px; flex-wrap: wrap; }
  .impact-panel .section-heading { flex-wrap: wrap; gap: 8px; }
  .impact-panel .section-heading h2 { font-size: 16px; }
  .network-heading h2 { font-size: 24px; }
  .network-eyebrow { font-size: 8px; letter-spacing: 1.2px; }
  .impact-panel .graph-tabs button { font-size: 10px; padding: 7px 10px; }
  .network-toolbar { gap: 7px; padding: 12px 16px; }
  .network-play { min-width: 112px; }
  .network-icon-button, .network-play, .impact-panel #network-expand, .impact-panel #network-focus-clear { min-height: 40px; }
  .network-icon-button { width: 40px; }
  .network-divider { display: none; }
  .network-view-control { flex: 1 1 230px; margin-left: 0; }
  .impact-panel #network-portfolio { margin-left: 0; flex: 1; max-width: none; min-height: 40px; min-width: 180px; }
  .network-summary { padding: 12px 16px; }
  .network-overview { padding: 0; gap: 5px 13px; }
  .network-motion-note { padding: 12px 16px; font-size: 9px; }
  .impact-panel .graph-subhead, .impact-panel .graph-disclaimer { padding-left: 16px; padding-right: 16px; }
  .impact-panel #graph-viewport { height: 550px; }
  .impact-panel #causal-graph { min-width: 1000px; }
  .network-timeline { gap: 10px; padding: 16px 16px 6px; }
  .network-stages { padding: 8px 12px 15px; gap: 3px; }
  .network-stages [data-stage] { flex-direction: column; gap: 5px; text-align: center; font-size: 9px; padding: 6px 2px; }
  .impact-panel .graph-footer { padding: 12px 16px; }
  .impact-panel .graph-legend { gap: 9px 13px; }
  .impact-panel .graph-legend > span { font-size: 9px; }
  .impact-panel .graph-controls button { min-width: 34px; min-height: 34px; }
  .impact-panel .trace-view { padding: 20px 16px; }
  .network-inspector { position: relative; top: auto; right: auto; width: auto; max-width: none; max-height: 400px; margin: 12px; box-shadow: 0 6px 20px #030a1633; }
}

@media (max-width: 480px) {
  .impact-panel .graph-header { align-items: flex-start; }
  .impact-panel .graph-tabs { width: 100%; }
  .impact-panel .graph-tabs button { flex: 1; }
  .network-toolbar { gap: 7px; }
  .impact-panel #network-expand { flex: 1; }
  .network-view-control { flex-basis: 100%; }
  .network-summary { gap: 12px; }
  .network-overview { width: 100%; margin-left: 0; padding-top: 10px; border-top: 1px solid #263b52; }
  .impact-panel #network-focus-clear { width: 100%; }
  #network-portfolio-label { flex-basis: auto; margin-right: auto; font-size: 10px; }
  #network-return { font-size: 18px; }
  #network-count { margin-left: 0; }
  .impact-panel #graph-viewport::before { content: "Scroll to explore the full network →"; position: sticky; top: 0; left: 0; display: block; width: calc(100vw - 83px); padding: 8px 16px; border-bottom: 1px solid #ffffff0c; color: #a3bacf; background: #112135f5; font-size: 10px; z-index: 1; }
  .network-timeline > label { font-size: 9px; }
  .network-stages [data-stage] { font-size: 8px; }
  .impact-panel .graph-legend { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .impact-panel .graph-controls { margin-left: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .impact-panel *, .impact-panel *::before, .impact-panel *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

.analysis-context{margin:28px 0 16px;display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap}.analysis-context h2{font-size:17px;font-weight:550;margin:0;color:#3a545e}.analysis-context p{margin:0;font-size:10px;color:#81959e;line-height:1.7}
