refactor(src/shared/styles): replace hardcoded CSS values with design token variables

Introduce consistent design tokens for radii and colors, replacing alpha() and hardcoded values with theme variables for easier theming and maintenance.

- New Features:   - Add CSS variable usage for radii (var(--radius-*)) and color tokens (@border-subtle, @text-main, @accent)
- Enhancements:
  - Replace hardcoded border, radius, and color definitions with variable references
  - Align styling with the project's theme system
- Bug Fixes:
  - No bug fixes included

src/shared/styles/dock.css

@@ -3,8 +3,8 @@
     padding: 4px 4px;
     margin: 4px 4px;
     border: none;
-    border-radius: 16px;
-    transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
+    border-radius: var(--radius-lg);
+    transition: all var(--transition-fast) cubic-bezier(0.165, 0.84, 0.44, 1);
 }
 
 #dock.shown {
@@ -54,13 +54,13 @@
 #dock_item_icon {
     border-radius: 13px;
     opacity: 0.7;
-    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
+    transition: all var(--transition-fast) cubic-bezier(0.25, 0.1, 0.25, 1);
 }
 
 /* #dock_item_indicator { */
 /*   transition: all 0.15s ease-out; */
 /*   min-height: 4px; */
-/*   border-radius: 4px; */
+/*   border-radius: var(--radius-xs); */
 /* } */
 
 #dock_item {
@@ -82,7 +82,7 @@
     min-height: 50px;
     margin: 0px 4px;
     border-radius: 2px;
-    background-color: #2b5ea7;
+    background-color: @accent;
 }
 
 .dock_separator.hidden {