/* brain-map.css — Donkey "Brain Map" section. Canon vars only (from shared.css). */
.bm-tabs { display:flex; gap:8px; margin-bottom:10px; flex-wrap:wrap; }
.bm-tab { background:var(--surface-alt); border:1px solid var(--border); color:var(--text-muted);
  padding:7px 15px; font-family:'Lato',sans-serif; font-size:11px; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; border-radius:var(--radius,8px); cursor:pointer; transition:all .15s; }
.bm-tab:hover { color:var(--text); }
.bm-tab.on { background:var(--teal); color:var(--bg); border-color:var(--teal); }
.bm-noterow { display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap; }
.bm-lensnote { font-size:11px; color:var(--text-muted); }
.bm-info { position:relative; font-size:11px; font-weight:700; color:var(--teal); cursor:help; white-space:nowrap; }
.bm-infopop { display:none; position:absolute; top:20px; right:0; z-index:30; width:340px; max-width:78vw;
  background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:12px 14px;
  font-size:12px; font-weight:400; color:var(--text); line-height:1.55; box-shadow:0 8px 24px rgba(0,0,0,.32); }
.bm-info:hover .bm-infopop { display:block; }
.bm-wrap { display:grid; grid-template-columns:1fr 240px; gap:16px; align-items:start; }
.bm-stage { position:relative; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius,8px); overflow:hidden; }
.bm-svg { display:block; width:100%; height:auto; cursor:grab; touch-action:none; }
.bm-svg:active { cursor:grabbing; }
.bm-canvas { display:block; width:100%; cursor:grab; touch-action:none; background:var(--surface); }
.bm-canvas:active { cursor:grabbing; }
.bm-reset { position:absolute; top:8px; right:8px; background:var(--surface-alt); border:1px solid var(--border);
  color:var(--text-muted); font-family:'Lato',sans-serif; font-size:10px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; padding:4px 9px; border-radius:6px; cursor:pointer; z-index:6; }
.bm-reset:hover { color:var(--text); border-color:var(--teal); }
.bm-node, .bm-job { cursor:pointer; transition:fill-opacity .1s; }
.bm-node:hover { fill-opacity:1 !important; }
.bm-job { animation:bmpulse 2.2s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
@keyframes bmpulse { 0%,100% { opacity:1 } 50% { opacity:.5 } }
.bm-hub { font-size:11px; font-weight:700; fill:var(--text); pointer-events:none; }
.bm-tip { position:absolute; pointer-events:none; background:var(--bg); border:1px solid var(--border);
  border-radius:6px; padding:7px 10px; font-size:11px; color:var(--text); box-shadow:0 4px 14px rgba(0,0,0,.3);
  max-width:250px; z-index:5; line-height:1.45; }
.bm-filter { display:flex; gap:7px; align-items:center; margin-bottom:11px; }
.bm-fchip { display:inline-flex; align-items:center; gap:6px; background:var(--surface-alt);
  border:1px solid var(--border); color:var(--text-muted); padding:5px 13px; font-family:'Lato',sans-serif;
  font-size:11px; font-weight:700; letter-spacing:.03em; border-radius:20px; cursor:pointer; transition:all .12s; }
.bm-fchip:hover { color:var(--text); }
.bm-fchip.on { background:var(--teal); color:var(--bg); border-color:var(--teal); }
.bm-fdot { width:9px; height:9px; border-radius:50%; flex:0 0 auto; }
.bm-detail { margin:0 0 14px; background:var(--surface-alt); border:1px solid var(--border);
  border-left:3px solid var(--gold); border-radius:var(--radius,8px); padding:13px 16px;
  height:138px; overflow-y:auto; }   /* fixed height (no map shift) + internal scroll so text never clips */
.bm-dhint { font-size:12.5px; color:var(--text-muted); line-height:1.5; }
.bm-dttl { font-size:15px; font-weight:800; color:var(--text); margin-bottom:1px; }
.bm-dsub { font-size:11px; color:var(--gold); font-weight:700; letter-spacing:.02em; margin-bottom:7px; font-family:ui-monospace,Menlo,monospace; }
.bm-dplain { font-size:13px; color:var(--text); line-height:1.5; margin-bottom:7px; }
.bm-dwhy { font-size:12.5px; color:var(--text-secondary); line-height:1.5; margin-bottom:7px; }
.bm-dwhy span { display:inline-block; font-weight:800; color:var(--teal); text-transform:uppercase;
  letter-spacing:.08em; font-size:9.5px; margin-right:7px; vertical-align:1px; }
.bm-dmeta { font-size:11px; color:var(--text-muted); }
.bm-legend { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius,8px);
  padding:12px 14px; max-height:560px; overflow-y:auto; }
.bm-legh { font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-muted); margin-bottom:10px; }
.bm-lrow { display:flex; align-items:center; gap:8px; padding:5px 8px; margin-bottom:2px; font-size:12px;
  color:var(--text); background:var(--surface-alt); border-radius:5px; transition:background .12s, transform .12s; }
.bm-lrow.wide { font-size:11px; }
.bm-lrow-int { cursor:pointer; }
.bm-lrow-int:hover { background:var(--surface); }
.bm-dot { width:10px; height:10px; border-radius:3px; flex:0 0 auto; }
.bm-llab { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bm-lcnt { margin-left:auto; color:var(--text-muted); font-size:11px; flex:0 0 auto; white-space:nowrap; }
.bm-foot { display:flex; justify-content:space-between; margin-top:10px; font-size:10px;
  color:var(--text-muted); flex-wrap:wrap; gap:6px; }
.bm-empty { padding:16px 0; color:var(--text-muted); font-size:12px; }
@media (max-width:720px) { .bm-wrap { grid-template-columns:1fr; } }