Keep a connected group's inner corners round

Connected segments and split halves wrote their full corners as
--md-sys-shape-corner-full, 9999px, beside 8px inner corners on the same
element. A box whose radii add up to more than its side has every radius
scaled by one factor, so the inner corners shrank to a hundredth of a pixel
and drew square. Full is now half the size's height (--group-full), which no
side can overflow. A browser test fails on any radius in a group or split
button larger than half its height.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RHoXZSHc8gGpZjFmA5fPc2

tests/Browser/ActionsTest.php

@@ -218,7 +218,7 @@ it('moves a connected group\'s choice with the arrow keys', function () {
 
     $page->keys(':focus', 'ArrowLeft')
         ->assertScript($checked('dark'))
-        ->assertScript("getComputedStyle(document.querySelector('#buttons input[value=\"dark\"]').parentElement).borderTopLeftRadius === '9999px'");
+        ->assertScript("(el => getComputedStyle(el).borderTopLeftRadius === (el.offsetHeight / 2) + 'px')(document.querySelector('#buttons input[value=\"dark\"]').parentElement)");
 });
 
 it('rounds a split button\'s trailing half while its menu is open', function () {
@@ -227,7 +227,16 @@ it('rounds a split button\'s trailing half while its menu is open', function ()
     showcase()
         ->click('[data-split="trailing"] >> nth=0')
         ->assertScript("{$trailing}.getAttribute('aria-expanded') === 'true'")
-        ->assertScript("getComputedStyle({$trailing}).borderTopLeftRadius === '9999px'");
+        ->assertScript("getComputedStyle({$trailing}).borderTopLeftRadius === ({$trailing}.offsetHeight / 2) + 'px'");
+});
+
+it('keeps a connected segment\'s small inner corners, which a 9999px outer corner would scale away', function () {
+    // When a box's radii add up to more than a side, CSS shrinks every radius by the same
+    // factor: a full corner written as 9999px drew the 8px inner corners square. Every radius
+    // in a connected group or a split button stays within half its height, so none is scaled.
+    showcase()
+        ->assertScript("[...document.querySelectorAll('[data-button-group=\"connected\"] > *, [data-split]')].every((el) => { const cs = getComputedStyle(el); const half = el.offsetHeight / 2 + 0.5; return el.offsetHeight === 0 || ['borderTopLeftRadius', 'borderTopRightRadius', 'borderBottomLeftRadius', 'borderBottomRightRadius'].every((corner) => parseFloat(cs[corner]) <= half); })")
+        ->assertScript("(el => getComputedStyle(el).borderTopRightRadius === '8px')(document.querySelector('#buttons input[name=\"showcase-theme\"][value=\"light\"]').parentElement)");
 });
 
 it('turns the FAB into a close button while its menu is open', function () {