/* Shared box + line styles for the web chart and the print pages.
   Layout concept: a government org chart drawn like a records-office exhibit —
   white cards on archival paper, branch color only in the header band and lines. */
:root {
  --paper: #f6f6f2;
  --card: #ffffff;
  --ink: #1d2433;
  --muted: #5b6475;
  --rule: #c9ced8;
  --exec: #234a7d;  --exec-tint: #e3ebf6;
  --leg: #2c6448;   --leg-tint: #e1efe7;
  --jud: #63406b;   --jud-tint: #eee5f0;
  --fed: #3b4252;   --fed-tint: #e7e9ee;
  --prog: #8a5a0b;  --prog-tint: #f6ead2;
  --alleged: #a3322a; --alleged-tint: #f8e3e0;
  --hist: #6b7280;
  --flag: #b4232a;
  --sel: #d9a400;
  --f-body: "IBM Plex Sans Condensed", "Arial Narrow", "Roboto Condensed", Arial, sans-serif;
  --f-display: "Source Serif 4", Georgia, "Times New Roman", serif;
  --f-mono: "IBM Plex Mono", Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #151922; --card: #1e2430; --ink: #e6e9ef; --muted: #a3abbb; --rule: #3a4252;
    --exec: #8fb4ea; --exec-tint: #23324a; --leg: #84c7a3; --leg-tint: #1f3a2d;
    --jud: #c9a2d1; --jud-tint: #362a3b; --fed: #b7bfcf; --fed-tint: #2a303c;
    --prog: #e0b45e; --prog-tint: #3a2f1a; --alleged: #f08a80; --alleged-tint: #3d2422;
    --hist: #9aa3b2; --flag: #ff7a7a; --sel: #f2c230; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --paper: #151922; --card: #1e2430; --ink: #e6e9ef; --muted: #a3abbb; --rule: #3a4252;
  --exec: #8fb4ea; --exec-tint: #23324a; --leg: #84c7a3; --leg-tint: #1f3a2d;
  --jud: #c9a2d1; --jud-tint: #362a3b; --fed: #b7bfcf; --fed-tint: #2a303c;
  --prog: #e0b45e; --prog-tint: #3a2f1a; --alleged: #f08a80; --alleged-tint: #3d2422;
  --hist: #9aa3b2; --flag: #ff7a7a; --sel: #f2c230; color-scheme: dark;
}

.box {
  --c: var(--exec); --t: var(--exec-tint);
  position: absolute; box-sizing: border-box; width: var(--bw, 216px);
  background: var(--card); color: var(--ink);
  border: 1px solid var(--c); border-radius: 2px;
  font-family: var(--f-body); font-size: 10.6px; line-height: 1.28;
}
.box.b-legislative { --c: var(--leg); --t: var(--leg-tint); }
.box.b-judicial { --c: var(--jud); --t: var(--jud-tint); }
.box.b-federal { --c: var(--fed); --t: var(--fed-tint); }
.box.k-program { --c: var(--prog); --t: var(--prog-tint); }
.box.k-alleged { --c: var(--alleged); --t: var(--alleged-tint); border-style: dotted; border-width: 1.5px; }
.box.s-historical { border-style: dashed; }

.bx-h { background: var(--t); padding: 4px 6px 4px; border-bottom: 1px solid var(--c); }
.bx-h .acr { font-weight: 700; font-size: 13px; color: var(--c); letter-spacing: .01em; }
.bx-h .nm { display: block; font-weight: 500; font-size: 10.6px; }
.bx-h .tag {
  float: right; margin-left: 6px; font-size: 8.5px; font-weight: 600; letter-spacing: .06em;
  text-transform: uppercase; color: var(--c); border: 1px solid var(--c); border-radius: 2px; padding: 0 3px;
}
.bx-meta { padding: 3px 6px 0; color: var(--muted); font-style: italic; }
.bx-people { list-style: none; margin: 0; padding: 3px 6px 4px; }
.box.wide { width: calc(var(--bw, 216px) * 2 - 12px); }
.box.wide .bx-people { columns: 2; column-gap: 12px; }
.bx-people li { break-inside: avoid; padding-left: 8px; text-indent: -8px; margin: 1px 0; }
.bx-people li::before { content: "▪ "; color: var(--c); }
.bx-people .pn { font-weight: 600; }
.bx-wit { padding: 0 6px 4px; color: var(--ink); }
.bx-wit b { font-weight: 600; color: var(--muted); }
/* Relationships that are not reporting lines: set apart from the card body and labeled */
.bx-links { padding: 3px 6px 4px; border-top: 1px dashed var(--muted); background: var(--paper); font-size: 9.6px; }
.bx-links .lk-h { font-size: 8.4px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.bx-links .lk { margin: 1px 0; line-height: 1.6; }
.bx-links .lk-l { color: var(--muted); }
/* Connection chips (replace cross-chart lines) */
.tag {
  display: inline-block; font: 600 9.6px/1.35 var(--f-body); padding: 0 4px; border-radius: 3px;
  border: 1px solid var(--exec); color: var(--exec); background: var(--exec-tint); white-space: nowrap;
}
/* Connection-count badge in the card header */
.lc {
  float: right; margin-left: 5px; font: 600 9.5px/1.4 var(--f-mono); padding: 0 5px; border-radius: 8px;
  color: var(--card); background: var(--c); white-space: nowrap;
}
.tag .p { font: 500 8.6px var(--f-mono); opacity: .85; }
.tag.ov { border-color: var(--leg); color: var(--leg); background: var(--leg-tint); }
.tag.hi { border-color: var(--hist); color: var(--hist); background: var(--card); border-style: dashed; }
.tag.al { border-color: var(--alleged); color: var(--alleged); background: var(--alleged-tint); border-style: dotted; }
.flag { color: var(--flag); font-weight: 700; font-size: 1em; vertical-align: super; line-height: 0; margin-left: 1px; }

/* Faded context card: muted colors on an opaque background, so lines never show through */
.box.ctx { --c: color-mix(in srgb, var(--muted) 70%, var(--card)); --t: color-mix(in srgb, var(--paper) 60%, var(--card)); color: var(--muted); }
.box.ctx .bx-h { border-bottom: 0; }
.box.index { width: 300px; }
.bx-index { padding: 4px 6px 5px; }
.bx-index .ix { padding: 3px 0; border-bottom: 1px dotted var(--rule); }
.bx-index .ix:last-child { border-bottom: 0; }
.bx-index .ix b { color: var(--c); }
.bx-index .subs { color: var(--muted); font-size: 9.8px; padding-top: 1px; }
.pg {
  float: right; font-family: var(--f-mono); font-size: 9.5px; font-weight: 600; color: var(--c);
  border: 1px solid var(--c); border-radius: 8px; padding: 0 5px; margin-left: 6px; background: var(--card);
}
.bx-cont { padding: 4px 6px 5px; border-top: 1px solid var(--rule); background: var(--paper); font-size: 9.8px; line-height: 1.6; }
.bx-cont b { color: var(--muted); font-weight: 600; }
.bx-cont .pg { float: none; margin: 0 4px 0 1px; }

/* Legend color swatches (same colors as the box header bands) */
.swatch { --c: var(--exec); --t: var(--exec-tint); display: inline-block; width: 16px; height: 11px; box-sizing: border-box;
  background: var(--t); border: 1.5px solid var(--c); border-radius: 2px; vertical-align: -1px; flex: none; }
.swatch.leg { --c: var(--leg); --t: var(--leg-tint); }
.swatch.jud { --c: var(--jud); --t: var(--jud-tint); }
.swatch.prog { --c: var(--prog); --t: var(--prog-tint); }
.swatch.alleged { --c: var(--alleged); --t: var(--alleged-tint); border-style: dotted; }
.swatch.hist { --c: var(--hist); --t: var(--card); border-style: dashed; }

svg.edges { position: absolute; left: 0; top: 0; overflow: visible; pointer-events: none; }
.e-tree { fill: none; stroke: var(--muted); stroke-width: 1.2; }
