redesign: modern dark dashboard with gradients and animations

- New color system: deep #0a0a0f bg with indigo/violet/emerald accents
- Sidebar redesign: gradient DH badge, improved active state, cleaner typography
- Card system: .card class with colored top-border accents, hover glow
- WeatherWidget: large temperature display, gradient bg, better 7-day grid
- CalendarWidget: gradient today highlight, violet accents, improved events panel
- TasksWidget: priority dots, hover states, max-height scroll
- System page: circular SVG gauges with glow, accent cards, better bars
- Bookmarks page: hover lift effect, colored category headers
- Claude widgets: gradient badge headers, accent borders
- DashboardHeader: live clock, gradient greeting text
- ServicesGrid: pulsing online indicator (animate-ping), card lift on hover
- globals.css: Inter font, custom scrollbar, card/glass-card, gradient-text helper
- tailwind.config.ts: dash colors, gradient BG images, glow/float animations

tailwind.config.ts

@@ -35,6 +35,21 @@ const config: Config = {
           DEFAULT: "hsl(var(--card))",
           foreground: "hsl(var(--card-foreground))",
         },
+        dash: {
+          bg: "#0a0a0f",
+          surface: "#111118",
+          elevated: "#1a1a24",
+          border: "rgba(255,255,255,0.06)",
+        },
+      },
+      backgroundImage: {
+        "gradient-primary": "linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%)",
+        "gradient-blue": "linear-gradient(135deg, #3b82f6 0%, #06b6d4 100%)",
+        "gradient-emerald": "linear-gradient(135deg, #10b981 0%, #06b6d4 100%)",
+        "gradient-amber": "linear-gradient(135deg, #f59e0b 0%, #ef4444 100%)",
+      },
+      fontFamily: {
+        sans: ["Inter", "system-ui", "sans-serif"],
       },
       borderRadius: {
         lg: "var(--radius)",
@@ -50,10 +65,26 @@ const config: Config = {
           from: { height: "var(--radix-accordion-content-height)" },
           to: { height: "0" },
         },
+        glow: {
+          "0%": { boxShadow: "0 0 5px rgba(99,102,241,0.3)" },
+          "100%": { boxShadow: "0 0 20px rgba(99,102,241,0.6)" },
+        },
+        float: {
+          "0%, 100%": { transform: "translateY(0px)" },
+          "50%": { transform: "translateY(-6px)" },
+        },
+        "status-pulse": {
+          "0%, 100%": { opacity: "1", transform: "scale(1)" },
+          "50%": { opacity: "0.4", transform: "scale(1.5)" },
+        },
       },
       animation: {
         "accordion-down": "accordion-down 0.2s ease-out",
         "accordion-up": "accordion-up 0.2s ease-out",
+        "pulse-slow": "pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite",
+        glow: "glow 2s ease-in-out infinite alternate",
+        float: "float 6s ease-in-out infinite",
+        "status-pulse": "status-pulse 2s ease-in-out infinite",
       },
     },
   },