fix(ui): match dark-mode button depth to the regular border

Neutral buttons in dark mode now use a white 8% depth edge so it matches
the regular border. Highlighted buttons keep the accent-mixed edge.
Document the behavior and assert the dark-mode selector in CSS tests.

DESIGN.md

@@ -58,6 +58,8 @@ ## 1. Visual direction
 and focus-visible controls retain the accent ring alongside the depth.
 Highlighted buttons mix the accent equally with black for a pronounced bottom
 edge, so custom theme colors produce a matching edge instead of a generic one.
+Dark mode matches the depth edge of neutral buttons to their regular border
+color. Highlighted buttons keep their dark, color-matched accent edge.
 
 ---
 

resources/css/app.css

@@ -101,6 +101,10 @@ .button[isHighlighted]:not(:disabled) {
     --button-depth-color: color-mix(in oklab, var(--color-coollabs) 52%, black);
 }
 
+.dark .button:not(.button-highlighted):not([isHighlighted]):not(:disabled) {
+    --button-depth-color: rgb(255 255 255 / 0.08);
+}
+
 /* Keep the shared focus indicator when the depth shadow owns box-shadow. */
 .button:not(:disabled):focus-visible {
     box-shadow: var(--button-depth), 0 0 0 1px var(--color-accent);

tests/Feature/ButtonDepthInteractionTest.php

@@ -9,6 +9,9 @@
         ->toContain('--button-depth-hover: 0 3px 0 var(--button-depth-color);')
         ->toContain('.button-highlighted:not(:disabled)')
         ->toContain('--button-depth-color: color-mix(in oklab, var(--color-coollabs) 52%, black);')
+        ->toContain('.dark .button:not(.button-highlighted):not([isHighlighted]):not(:disabled)')
+        ->toContain('--button-depth-color: rgb(255 255 255 / 0.08);')
+        ->not->toContain('.dark .button.button-highlighted:not(:disabled)')
         ->toContain('.button:not(:disabled):hover')
         ->toContain('transform: translateY(-1px);')
         ->toContain('.button:not(:disabled):active')