要在Angular中的shadow-root内添加样式，可以通过以下步骤实现：

1. 在组件的HTML模板中，使用::ng-deep伪类选择器来穿透组件的封装，并选择shadow-root内的元素。

在上面的示例中，我们使用:host选择器来选择组件的宿主元素，然后使用::ng-deep选择器选择shadow-root内部的.custom-class类，并将其颜色设置为红色。

2. 在组件的CSS文件中，使用/deep/选择器来穿透组件的封装，并选择shadow-root内的元素。

:host /deep/ .custom-class {
  color: red;
}

在这个示例中，我们使用:host选择器来选择组件的宿主元素，然后使用/deep/选择器选择shadow-root内部的.custom-class类，并将其颜色设置为红色。

请注意，::ng-deep和/deep/选择器在Angular 11版本中被视为废弃。官方推荐的替代方案是使用::ng-host选择器来选择组件的宿主元素，并使用CSS变量来影响shadow-root内部的样式。

:host {
  --custom-color: red;
}

:host ::ng-deep .custom-class {
  color: var(--custom-color);
}

在这个示例中，我们定义了一个名为--custom-color的CSS变量，并将其设置为红色。然后，在shadow-root内部的.custom-class类中，我们使用var(--custom-color)来引用该变量，并将颜色设置为变量的值。这样，我们可以在组件的样式中定义和控制变量的值，从而影响shadow-root内部的样式。