diff --git a/services/web-ui/src/css/components/motion.css b/services/web-ui/src/css/components/motion.css
new file mode 100644
index 0000000..1db814a
--- /dev/null
+++ b/services/web-ui/src/css/components/motion.css
@@ -0,0 +1,46 @@
+/* motion.css ─ keyframes + global reduced-motion override.
+ * Keep keyframes here, not scattered across primitive files,
+ * so a single import disables them under prefers-reduced-motion. */
+
+/* Skeleton shimmer — gradient sweep, NOT opacity pulse */
+@keyframes wd-shimmer {
+  0%   { background-position: -200% 0; }
+  100% { background-position:  200% 0; }
+}
+
+/* "LIVE" tally-light stutter — bright 0.9s / dim 0.3s / bright 0.9s */
+@keyframes wd-stutter {
+  0%, 42%       { opacity: 1; }
+  42.01%, 56%   { opacity: 0.55; }
+  56.01%, 100%  { opacity: 1; }
+}
+
+/* Signal-strip sweep for recording cards */
+@keyframes wd-signal-sweep {
+  0%   { transform: translateX(-100%); }
+  100% { transform: translateX(100%); }
+}
+
+.wd-shimmer {
+  background: linear-gradient(
+    90deg,
+    var(--bg-surface) 0%,
+    var(--bg-hover)   50%,
+    var(--bg-surface) 100%
+  );
+  background-size: 200% 100%;
+  animation: wd-shimmer 1.8s ease-in-out infinite;
+}
+
+.wd-stutter   { animation: wd-stutter      2.1s ease-in-out infinite; }
+.wd-sweep     { animation: wd-signal-sweep 1.8s ease-in-out infinite; }
+
+@media (prefers-reduced-motion: reduce) {
+  .wd-shimmer, .wd-stutter, .wd-sweep {
+    animation: none;
+  }
+  *, *::before, *::after {
+    transition-duration: 0ms !important;
+    animation-duration: 0ms !important;
+  }
+}