/* 案1: グループ名と役職を継ぎ目なく一体化した2トーンピル */
.groupRoleHost{display:flex;flex-wrap:wrap;gap:6px;min-width:0;max-width:100%}
.groupRoleCombo{--group-role-color:var(--accent);display:inline-flex;align-items:stretch;min-width:0;max-width:100%;
  margin-top:7px;border-radius:999px;overflow:hidden;font-size:var(--font-xs);font-weight:800;line-height:1}
.hmeta-tags .groupRoleCombo{margin-top:0}
.groupRoleName{flex:0 0 auto;display:inline-flex;align-items:center;padding:6px 11px;
  background:var(--group-role-color);color:var(--group-role-foreground,#101319);white-space:nowrap;text-decoration:none;cursor:pointer;transition:filter .12s}
.groupRoleName:hover{filter:brightness(.94)}
.groupRoleLink{text-decoration:none;cursor:pointer}
.groupRoleText{flex:0 1 auto;display:inline-flex;align-items:center;min-width:0;padding:6px 11px;font-weight:700;
  background:color-mix(in srgb,var(--group-role-color) 20%,var(--panel));color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rtl-memberships{width:100%;min-width:0}
.rtl-memberships .dbMembershipBadges{display:flex;width:100%;max-width:100%;min-width:0;justify-content:center}
.rtl-memberships .groupRoleCombo,.rtl-memberships .groupRoleLink{max-width:100%;overflow:hidden;text-overflow:ellipsis}
@media(max-width:480px){.groupRoleName,.groupRoleText{padding-inline:9px}}