Evaluate border radius for elements within compound components

Purpose

Compound components include components that make use of the default border radius in the same way the parent component does. For example, buttons within a modal and the modal itself use the same radius. This makes nested radius look clunky and unpolished as nested elements should have less radius, not the same (outer radius - padding = inner radius).

Because padding is also a factor, any compound component should be evaluated to determine how to best address nested border radius. It may be that a single design token could be created, or that each needs a unique solution.