/* Khorasia Aambo - Branch outline, detail panel, lineage ribbon, profile block. */

/* ---------- Branch (outline) view ---------- */
.branch-body{padding:6px 8px 20px;max-height:min(72vh,860px);overflow:auto}
.tree,.tree ul{list-style:none;margin:0;padding:0}
.tree ul{margin-left:16px;border-left:1px solid var(--rule-2);padding-left:0}
.node{position:relative}
.tree ul>.node::before{
  content:"";position:absolute;left:0;top:19px;width:13px;height:1px;background:var(--rule-2);
}
.row{
  display:flex;align-items:center;gap:9px;padding:5px 8px 5px 0;margin-left:13px;
  border-radius:2px;cursor:pointer;min-height:32px;
}
.tree>.node>.row{margin-left:0}
.row:hover{background:rgba(178,42,34,.06)}
.row.sel{background:var(--ink);color:var(--paper-2)}
.row.sel .nm-en{color:var(--paper-2)}
.row.sel .nm-gu{color:#E9C9A4}
.row.sel .gen-num{background:rgba(255,255,255,.16);color:#F0C9C2}
.row.sel .count-pill{background:rgba(255,255,255,.12);color:#BFD8BC;border-color:rgba(255,255,255,.18)}
.row.hit{box-shadow:inset 0 0 0 1.5px var(--turmeric)}
.tw{
  flex:none;width:19px;height:19px;display:grid;place-items:center;border:1px solid var(--rule);
  border-radius:2px;background:var(--paper);font-size:11px;line-height:1;color:var(--ink-2);
}
.tw.leaf{border:0;background:none;color:var(--rule)}
.tw.leaf::before{content:"◦";font-size:15px}
.row.sel .tw{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25);color:var(--paper-2)}
.nm{display:flex;align-items:baseline;gap:9px;min-width:0;flex-wrap:wrap}
.nm-en{font-family:var(--serif);font-size:15.5px;font-weight:500;color:var(--ink)}
.nm-gu{font-family:var(--serif);font-size:16px;font-weight:400;color:var(--sindoor)}
.row .meta{margin-left:auto;display:flex;align-items:center;gap:6px;flex:none}
.dot-remark{width:5px;height:5px;border-radius:50%;background:var(--turmeric);flex:none}

/* ---------- Detail / lineage ribbon (signature) ---------- */
.detail{position:sticky;top:104px}
@media(max-width:1080px){.detail{position:static}}
.d-head{padding:18px 18px 15px;border-bottom:1px solid var(--rule-2);background:
  linear-gradient(180deg,rgba(178,42,34,.05),transparent)}
.d-name-gu{font-family:var(--serif);font-size:31px;font-weight:600;color:var(--sindoor);line-height:1.18;margin:0}
.d-name-en{font-family:var(--serif);font-size:19px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin:3px 0 0}
.d-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.d-meta span{
  font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);
  border:1px solid var(--rule-2);padding:3px 8px;border-radius:2px;background:var(--paper);
}
.d-meta span b{color:var(--ink);font-weight:600}
.remark{
  margin:14px 18px 0;padding:11px 13px;border-left:3px solid var(--turmeric);
  background:rgba(156,107,16,.07);font-family:var(--serif);font-size:14.5px;line-height:1.6;color:var(--ink-2);
}
.remark em{display:block;font-family:var(--sans);font-style:normal;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--turmeric);margin-bottom:5px}
.d-sec{padding:16px 18px;border-top:1px solid var(--rule-2)}
.d-sec h3{
  margin:0 0 11px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);
  display:flex;align-items:center;gap:8px;
}
.d-sec h3 .gu{font-family:var(--serif);font-size:14px;letter-spacing:0;text-transform:none;color:var(--sindoor)}
.d-sec h3::after{content:"";flex:1;height:1px;background:var(--rule-2)}

/* the ribbon */
.ribbon{list-style:none;margin:0;padding:0;position:relative}
.ribbon::before{content:"";position:absolute;left:28px;top:8px;bottom:12px;width:1px;background:var(--rule)}
.rb{position:relative;display:flex;align-items:center;gap:12px;padding:4px 0;cursor:pointer;border-radius:2px}
.rb:hover .rb-nm{color:var(--sindoor)}
.rb-g{
  flex:none;width:28px;text-align:right;font-family:var(--serif);font-size:14px;font-weight:600;
  color:var(--sindoor);line-height:1;
}
.rb-dot{
  position:absolute;left:25px;width:7px;height:7px;border-radius:50%;background:var(--paper-2);
  border:1.5px solid var(--rule);
}
.rb.here .rb-dot{background:var(--sindoor);border-color:var(--sindoor);width:11px;height:11px;left:23px}
.rb-nm{margin-left:22px;font-family:var(--serif);font-size:15px;color:var(--ink-2);display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.rb.here .rb-nm{color:var(--ink);font-weight:600}
.rb-nm .g{color:var(--sindoor)}
.rb.here .rb-nm .g{font-weight:600}

.people-lines{display:flex;flex-direction:column;gap:1px}
.pl{
  text-align:left;padding:7px 9px;border-radius:2px;display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;
  border-bottom:1px solid var(--rule-2);
}
.pl:last-child{border-bottom:0}
.pl:hover{background:rgba(178,42,34,.06)}
.pl .nm-en{font-size:14.5px}
.pl .nm-gu{font-size:15px}
.pl .meta{margin-left:auto}
.d-actions{padding:14px 18px 18px;display:flex;gap:7px;flex-wrap:wrap;border-top:1px solid var(--rule-2)}

/* ---------- Profile (photo + contact) ---------- */
.pf-wrap{display:flex;gap:15px;align-items:flex-start}
.pf-photo{
  flex:none;width:84px;height:84px;border-radius:2px;object-fit:cover;border:1px solid var(--rule);
  background:var(--paper-3);display:block;
}
.pf-ph{
  flex:none;width:84px;height:84px;border-radius:2px;border:1px dashed var(--rule);background:var(--paper);
  display:grid;place-items:center;font-family:var(--serif);font-size:30px;color:var(--rule);
}
.pf-list{display:flex;flex-direction:column;gap:0}
.pf-row{display:flex;gap:11px;align-items:baseline;padding:8px 0;border-bottom:1px dotted var(--rule-2)}
.pf-row:last-child{border-bottom:0}
.pf-row .k{flex:none;width:104px;white-space:nowrap;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--sindoor);font-weight:600}
.pf-row .v{font-family:var(--serif);font-size:15px;color:var(--ink);word-break:break-word}
.pf-row .v a{color:var(--sindoor);text-decoration:none;border-bottom:1px solid var(--sindoor-soft)}
.pf-row .v a:hover{border-bottom-color:var(--sindoor)}
.pf-empty{font-family:var(--serif);font-size:14px;color:var(--ink-3)}
.dot-profile{width:5px;height:5px;border-radius:50%;background:var(--leaf);flex:none}
