feat: add dark theme support with CSS custom properties and Naive UI integration

Implement runtime theme switching using CSS custom properties delegated through SCSS variables, with light/dark/system modes, FOUC prevention, sidebar toggle, and settings selector. Add theme-aware video assets for sidebar and chat thinking indicator.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

packages/client/src/components/hermes/usage/DailyTrend.vue

@@ -127,6 +127,10 @@ import { computed } from 'vue'
   border-radius: 2px 2px 0 0;
   min-height: 0;
   transition: height 0.3s ease;
+
+  .dark & {
+    background: #66bb6a;
+  }
 }
 
 .bar-col {
@@ -140,7 +144,7 @@ import { computed } from 'vue'
   left: 50%;
   transform: translateX(-50%);
   background: $text-primary;
-  color: #fff;
+  color: var(--text-on-accent);
   padding: 6px 10px;
   border-radius: $radius-sm;
   font-size: 11px;

packages/client/src/components/hermes/usage/ModelBreakdown.vue

@@ -85,6 +85,10 @@ function formatTokens(n: number): string {
   border-radius: 3px;
   min-width: 2px;
   transition: width 0.3s ease;
+
+  .dark & {
+    background: #66bb6a;
+  }
 }
 
 .model-tokens {