Accept a list of token values in the guard, and quote what was written

A transition-duration or -timing-function listing one token per property
(a spatial spring for scale, an effects spring for opacity) was reported
as literal: blanking each var() left a bare comma, which is not one of
the safe values. Every item of a list is now checked on its own. A
message also quoted the blanked shell, `var(      ), 200ms`; it now
quotes the declaration as written. SealShare's drop zone found it
(plan step 46).

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

tests/Feature/DesignGuardTest.php

@@ -553,6 +553,15 @@ it('finds every literal design value and off-scale media query in the applicatio
     ]);
 });
 
+it('accepts a list of values when every item is a token, and quotes a mixed one as written', function () {
+    // SealShare's drop zone pairs a spatial spring for scale with an effects spring for opacity in one
+    // transition-duration list; blanking both var()s used to leave a bare comma the guard called literal.
+    expect(fixtureRelative(DesignGuard::scan(realpath(GUARD_FIXTURES.'/css-lists/lists.css'))->violations()))->toBe([
+        'css-lists/lists.css:8 literal duration `transition-duration: var(--md-sys-motion-spatial-slow-duration), 200ms` — use `var(--md-sys-motion-…-duration)`, paired with its easing',
+        'css-lists/lists.css:9 literal easing `transition-timing-function: var(--md-sys-motion-spatial-slow), ease-out` — use `var(--md-sys-motion-spatial-*)`/`var(--md-sys-motion-effects-*)`, paired with its `-duration`',
+    ]);
+});
+
 it('leaves a box-shadow ring in a colour role alone, but still reports a blurred or literal-coloured one', function () {
     $violations = fixtureRelative(DesignGuard::scan(realpath(GUARD_FIXTURES.'/shadows/rings.css'))->violations());
 

tests/Fixtures/design-guard/css-lists/lists.css

@@ -0,0 +1,10 @@
+/* A list of values, each from a token, is fine; one literal in the list is not. */
+.fine-list {
+    transition-duration: var(--md-sys-motion-spatial-slow-duration), var(--md-sys-motion-effects-slow-duration);
+    transition-timing-function: var(--md-sys-motion-spatial-slow), var(--md-sys-motion-effects-slow);
+}
+
+.mixed-list {
+    transition-duration: var(--md-sys-motion-spatial-slow-duration), 200ms;
+    transition-timing-function: var(--md-sys-motion-spatial-slow), ease-out;
+}