/* Keep the role explanation visible in the same compact control as its role.
 * The explanation uses the smallest shared type token so all three buttons
 * stay scannable before the action panel is opened. */
.landing-page .landing-role__toggle {
  height: auto;
  min-height: calc(var(--control-height, 44px) + var(--cl-space-2));
  padding: var(--cl-space-1) calc(var(--cl-space-3) + var(--cl-space-1)) var(--cl-space-1) var(--cl-space-2);
  flex-direction: column;
  gap: 0;
}

.landing-page .landing-role__toggle .landing-role__name {
  display: block;
  line-height: var(--cl-leading-control);
}

.landing-page .landing-role__description {
  display: block;
  max-width: 100%;
  color: var(--color-muted);
  font-size: var(--cl-type-2xs);
  font-weight: 400;
  line-height: var(--cl-leading-control);
  text-align: center;
}