Take colour off the overshooting spatial spring

Four components animated background-color and color on ease-spatial-fast, whose
fast variant peaks at 1.094 — the one thing tokens/motion.css says a colour must
never do. Tailwind cannot emit two springs on one element, so a small unlayered
file gives shape and size the spatial spring and colour and elevation the
effects one in a single property list. Plan step 18, actions.md ACT-19.

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

resources/views/components/group.blade.php

@@ -12,7 +12,8 @@
      default), `filled` or `outlined`, as for toggle buttons. The segments share the row unless
      `inline`. An option with `'disabled' => true` greys its own segment. At `xs` and `sm` a
      segment carries `touch-target` and a 48px minimum width, which M3 asks for by name and tells
-     you never to reduce.
+     you never to reduce. Corners move on the spatial spring and colours on the effects one
+     (`state-transition-fast`).
 
      ReStride's props, kept: `label`, `hint`, `hint-class`, `name` (needed with `x-model`, which
      names no property), `options`, `option-value`, `option-label`; plus `option-icon`, `size`,
@@ -79,7 +80,7 @@
         @foreach ($options as $option)
             <label @class([
                 'state-layer relative flex cursor-pointer select-none items-center justify-center whitespace-nowrap',
-                'transition-[border-radius,background-color,color] duration-(--md-sys-motion-spatial-fast-duration) ease-spatial-fast',
+                'state-transition-fast',
                 'flex-1' => ! $inline,
                 $small ? 'touch-target min-w-12' : 'min-w-0',
                 $segment,