feat: Complete light mode implementation with semantic theme system

- Add comprehensive light/dark mode CSS variables with semantic naming
- Implement theme-aware scrollbars using CSS variables
- Add light mode backgrounds: --bg-base, --bg-elevated, --bg-surface, etc.
- Add theme-aware borders: --border-base, --border-panel, --border-subtle
- Add semantic text colors: --foreground-secondary, --foreground-subtle
- Convert oklch colors to hex for better compatibility
- Add theme awareness to CodeMirror editors
- Update dark mode colors for consistency (background, sidebar, card, muted, input)
- Add Tailwind color mappings for semantic classes

src/ui/desktop/apps/server-stats/widgets/DiskWidget.tsx

@@ -27,10 +27,11 @@ export function DiskWidget({ metrics }: DiskWidgetProps) {
   }, [metrics]);
 
   return (
-    <div className="h-full w-full p-4 rounded-lg bg-dark-bg-darker border border-dark-border/50 hover:bg-dark-bg/70 transition-colors duration-200 flex flex-col overflow-hidden">
+    <div className="h-full w-full p-4 rounded-lg bg-canvas/50 border border-edge/50 hover:bg-canvas/70 transition-colors duration-200 flex flex-col overflow-hidden">
+
       <div className="flex items-center gap-2 flex-shrink-0 mb-3">
         <HardDrive className="h-5 w-5 text-orange-400" />
-        <h3 className="font-semibold text-lg text-white">
+        <h3 className="font-semibold text-lg text-foreground">
           {t("serverStats.diskUsage")}
         </h3>
       </div>
@@ -74,7 +75,7 @@ export function DiskWidget({ metrics }: DiskWidgetProps) {
           </ResponsiveContainer>
         </div>
         <div className="flex-shrink-0 space-y-1 text-center pb-2">
-          <div className="text-xs text-gray-400">
+          <div className="text-xs text-muted-foreground">
             {(() => {
               const used = metrics?.disk?.usedHuman;
               const total = metrics?.disk?.totalHuman;
@@ -84,7 +85,7 @@ export function DiskWidget({ metrics }: DiskWidgetProps) {
               return "N/A";
             })()}
           </div>
-          <div className="text-xs text-gray-500">
+          <div className="text-xs text-foreground-subtle">
             {(() => {
               const available = metrics?.disk?.availableHuman;
               return available