diff --git a/core/accessibility.css b/core/accessibility.css
index 5f99c3fe..8bc7f319 100644
--- a/core/accessibility.css
+++ b/core/accessibility.css
@@ -108,8 +108,8 @@
     select,
     summary,
     a {
-      min-height: 44px;
-      min-width:  44px;
+      min-height: var(--sf-touch-target);
+      min-width:  var(--sf-touch-target);
     }
   }
 
diff --git a/core/base.css b/core/base.css
index f9a115e9..f20b6364 100644
--- a/core/base.css
+++ b/core/base.css
@@ -100,7 +100,7 @@
 
   code {
     font-family:      var(--sf-font-mono);
-    font-size:        0.875em;
+    font-size:        var(--sf-code-font-size);
     padding:          0.125em 0.3em;
     border-radius:    var(--sf-radius-xs);
     background-color: var(--sf-color-code-bg);
@@ -155,7 +155,7 @@
   }
 
   input, textarea {
-    caret-color: var(--sf-color-action);
+    caret-color: var(--sf-caret-color);
   }
 
   input, progress {
diff --git a/core/layout.css b/core/layout.css
index 37637e69..db518852 100644
--- a/core/layout.css
+++ b/core/layout.css
@@ -295,6 +295,7 @@
 
   .sf-reel {
     display:               flex;
+    block-size:            var(--sf-reel-height);
     gap:                   var(--sf-reel-gap);
     overflow-x:            auto;
     scroll-snap-type:      x mandatory;
diff --git a/core/states.css b/core/states.css
index d6b362a5..8d6caf96 100644
--- a/core/states.css
+++ b/core/states.css
@@ -71,13 +71,13 @@
     height:        1em;
     margin-block-start:  -0.5em;
     margin-inline-start: -0.5em;
-    border:        2px solid var(--sf-color-border--strong);
+    border:        var(--sf-border-width-2) solid var(--sf-color-border--strong);
     border-block-start-color: var(--sf-color-action);
     border-radius: var(--sf-radius-full);
     /* Reduced-motion: accessibility.css kills animation-duration via
        !important on *, *::before, *::after — so this spinner stops
        even without a local reduced-motion wrapper. */
-    animation:     sf-spin 0.6s linear infinite;
+    animation:     sf-spin var(--sf-duration-slower) linear infinite;
   }
 
   .is-busy {
@@ -100,7 +100,7 @@
                        var(--sf-color-well) 75%
                      );
     background-size: 200% 100%;
-    animation:       sf-shimmer 1.5s ease-in-out infinite;
+    animation:       sf-shimmer calc(1.5s * var(--sf-motion-scale)) ease-in-out infinite;
     border-radius:   var(--sf-radius-s);
     pointer-events:  none;
     user-select:     none;
@@ -270,8 +270,8 @@
   }
 
   .is-drop-target {
-    outline:        2px dashed var(--sf-color-action);
-    outline-offset: 2px;
+    outline:        var(--sf-focus-ring-width) dashed var(--sf-color-action);
+    outline-offset: var(--sf-focus-ring-offset);
   }
 
   .is-draggable {
diff --git a/core/tokens.css b/core/tokens.css
index bef98b30..0babe1b0 100644
--- a/core/tokens.css
+++ b/core/tokens.css
@@ -764,6 +764,8 @@
     --sf-body-strong-weight: var(--sf-font-weight-bold);
     --sf-body-em-style:      italic;
 
+    --sf-code-font-size:     0.875em;
+
     --sf-heading-font-family: var(--sf-font-heading);
     --sf-heading-color:       var(--sf-color-heading);
     --sf-heading-text-wrap:   balance;