/* sql_join.css — two small tables with their key columns + a connector on the matching rows. */
.sj-tname { fill: #9fb2c8; font-size: 12px; font-weight: 700; font-family: ui-monospace, Menlo, Consolas, monospace; }
.sj-hd { fill: rgba(104, 130, 176, 0.14); stroke: rgba(104, 130, 176, 0.34); stroke-width: 0.8; }
.sj-keyhd { fill: rgba(251, 191, 36, 0.2); stroke: rgba(251, 191, 36, 0.5); }
.sj-hdt { fill: #a9c0e2; font-size: 11px; font-weight: 700; font-family: ui-monospace, Menlo, Consolas, monospace; }
.sj-cell { fill: rgba(255, 255, 255, 0.03); stroke: rgba(148, 163, 184, 0.2); stroke-width: 0.8; }
.sj-keycell { fill: rgba(251, 191, 36, 0.08); }
.sj-sel { fill: rgba(56, 189, 248, 0.22); stroke: #38bdf8; stroke-width: 1.4; }
.sj-mat { fill: rgba(52, 211, 153, 0.22); stroke: #34d399; stroke-width: 1.4; }
.sj-val { fill: #cbd5e1; font-size: 12px; font-variant-numeric: tabular-nums; font-family: ui-monospace, Menlo, Consolas, monospace; }
.sj-val-on { fill: #f1f5f9; font-weight: 600; }
.sj-link { stroke: #fbbf24; stroke-width: 2; stroke-dasharray: 4 2; }