.hbc-bond-entry{display:grid;justify-items:stretch;gap:6px;min-width:0;padding-bottom:9px;border-bottom:1px solid #36514555}.hbc-bond-members{display:grid;grid-template-columns:repeat(3,26px);gap:5px;justify-content:center}.hbc-bond-members .hbc-member-avatar{position:relative;display:block;width:26px;height:26px;min-width:26px;min-height:26px;padding:0;margin:0;border:1px solid #899b92;background:#26382f;border-radius:3px;cursor:pointer;overflow:visible;box-sizing:border-box}.hbc-member-image{display:block;position:absolute;inset:0;overflow:hidden;border-radius:2px;pointer-events:none}.hbc-member-image img{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;left:0;top:0;pointer-events:none}.hbc-member-state{position:absolute;right:-3px;bottom:-3px;z-index:1;display:grid;place-items:center;width:12px;height:12px;line-height:1;font:700 10px/1 system-ui;background:#24332b;color:#e1e8db;border:1px solid #8b9c8c;border-radius:3px;pointer-events:none}.hbc-member-avatar[data-state=deployed]{border:2px solid #95e5a5;box-shadow:0 0 0 1px #527d5266}.hbc-member-avatar[data-state=deployed] .hbc-member-state,.hbc-member-legend>[data-state=deployed]{background:#92dfa5;color:#102a1e;border-color:#bbefc5}.hbc-member-avatar[data-state=owned]{border-color:#d5c498}.hbc-member-avatar[data-state=owned] .hbc-member-state,.hbc-member-legend>[data-state=owned]{color:#f0ddab;border-color:#c6b584;background:#3c3929}.hbc-member-avatar[data-state=missing]{border-style:dashed;border-color:#4b5a53;background:#17221f}.hbc-member-avatar[data-state=missing] img{filter:grayscale(1);opacity:.3}.hbc-member-avatar[data-state=missing] .hbc-member-state,.hbc-member-legend>[data-state=missing]{color:#91a29b;border-color:#4f6258;background:#182821}.hbc-bond-members .hbc-member-avatar:focus-visible{outline:2px solid #f0e6bc;outline-offset:3px;z-index:2}.hbc-bond-members .hbc-member-avatar:hover{border-color:#f6efd5;z-index:2}.hbc-member-legend{display:flex;gap:10px;justify-content:center;padding:3px 0 6px}.hbc-member-legend>span{display:grid;place-items:center;font:700 11px/1 system-ui;width:17px;height:17px;border:1px solid;border-radius:3px;cursor:help}.hbc-member-legend>span:focus-visible{outline:2px solid #f0e6bc;outline-offset:2px}.hi-mode.hbc-preparing .hbc-bonds:has(.hbc-bond-members){display:grid;justify-items:stretch;gap:9px}.hi-mode.hbc-preparing .hbc-bond-entry{justify-items:center;width:100%}.hi-mode.hbc-preparing .hbc-bond-entry>.hbc-bond{margin:0}.hi-mode.hbc-preparing .hbc-member-legend{justify-self:center}
@media(min-width:1101px){body.hi-mode.hbc-preparing .formation-workspace:has(>#prep-synergies .hbc-bond-members){grid-template-columns:108px minmax(0,1fr) clamp(340px,28vw,400px)}}@media(min-width:681px) and (max-width:1100px){body.hi-mode.hbc-preparing .formation-workspace:has(>#prep-synergies .hbc-bond-members){grid-template-columns:104px minmax(0,1fr)}}@media(max-width:680px){.hi-mode.hbc-preparing .hbc-bonds:has(.hbc-bond-members){display:flex;align-items:flex-start;gap:8px}.hi-mode.hbc-preparing .hbc-bond-entry{flex:0 0 94px;width:94px;padding:0 0 7px;border-bottom:0}.hbc-bond-members{grid-template-columns:repeat(3,24px);gap:5px}.hbc-bond-members .hbc-member-avatar{width:24px;min-width:24px;height:24px;min-height:24px}.hi-mode.hbc-preparing .hbc-member-legend{display:grid;flex:none;gap:9px;margin:3px 4px 0}.hi-mode.hbc-preparing .hbc-bond-entry>.hbc-bond{min-height:32px;height:32px;flex-direction:row;width:58px;min-width:58px}.hi-mode.hbc-preparing .hbc-bond-entry>.hbc-bond .hi-symbol{width:19px;height:19px;flex-basis:19px}}

/* Member portraits live inside the hover/tap detail, keeping the rail compact. */
#hi-tooltip.hi-bond-tooltip{width:360px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);box-sizing:border-box;overflow:hidden;white-space:normal;padding:13px 14px}.hbc-bond-detail{color:#d9e7de;text-align:left}.hbc-bond-detail h3{font-size:15px;line-height:1.4;margin:0 0 4px;color:#e8f3df}.hbc-bond-roster-count{display:block;font-size:10px;color:#a1b9aa}.hbc-bond-detail .hbc-bond-members{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;justify-content:stretch;margin:12px 0 14px}.hbc-hover-member{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0}.hbc-bond-detail .hbc-member-avatar{width:34px;height:34px;min-width:34px;min-height:34px;cursor:default}.hbc-hover-member>strong{font-size:11px;line-height:1.35;font-weight:500;color:#d8e7dd;white-space:nowrap;margin-top:3px}.hbc-hover-member>small{font-size:9px;line-height:1.3;white-space:nowrap;color:#8faaa0}.hbc-hover-member[data-state=deployed]>small{color:#a8e8b9}.hbc-hover-member[data-state=owned]>small{color:#e0ca92}.hbc-hover-member[data-state=missing]>strong{color:#8ba094}.hbc-bond-detail .hbc-hover-tier{display:grid;gap:3px;font-size:11px;line-height:1.65;margin:9px 0;padding-top:9px;border-top:1px solid #49645377}.hbc-hover-tier>b{font-weight:600;color:#daca96}.hbc-hover-limit{display:block;margin-top:9px;font-size:10px;line-height:1.6;color:#91a99a}.hbc-help .hbc-bond-detail .hbc-hover-tier{font-size:12px}.hbc-help .hbc-bond-detail{margin-bottom:18px}@media(max-width:380px){.hbc-bond-detail .hbc-bond-members{gap:4px}.hbc-bond-detail .hbc-member-avatar{width:30px;height:30px;min-width:30px;min-height:30px}}

/* Multi-stage progression: current milestone is explicit, full text lives in the tap dialog. */
.hbc-tier-progress,.hbc-tier-open{display:block;font-size:10px;line-height:1.5;color:#a6bcae;margin:5px 0}.hbc-tier-progress{color:#c7e5b5}.hbc-hover-tier[data-state=current]{border-left:2px solid #b2edaa;background:#476b4133;padding:8px 9px}.hbc-hover-tier[data-state=current]>b{color:#c5f8b3}.hbc-hover-tier[data-state=locked]>b{color:#98a69a}
#hi-tooltip.hi-bond-tooltip .hbc-hover-tier{font-size:11px;line-height:1.45;margin:6px 0;padding-top:6px}#hi-tooltip.hi-bond-tooltip .hbc-hover-tier>span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}#hi-tooltip.hi-bond-tooltip .hbc-engine-copy{-webkit-line-clamp:3}#hi-tooltip.hi-bond-tooltip .hbc-hover-limit{display:none}
@media(max-height:600px){#hi-tooltip.hi-bond-tooltip .hbc-hover-tier>span{-webkit-line-clamp:1}#hi-tooltip.hi-bond-tooltip .hbc-bond-members{margin:6px 0}#hi-tooltip.hi-bond-tooltip .hbc-hover-member>small{display:none}}
