diff --git a/webui/static/style.css b/webui/static/style.css
index 78c02561..b4cba9e0 100644
--- a/webui/static/style.css
+++ b/webui/static/style.css
@@ -89,7 +89,7 @@ body {
 .sidebar-header {
     height: 95px;
     background: linear-gradient(180deg,
-            rgba(29, 185, 84, 0.12) 0%,
+            rgba(29, 185, 84, 0.14) 0%,
             rgba(29, 185, 84, 0.08) 30%,
             rgba(29, 185, 84, 0.03) 70%,
             transparent 100%);
@@ -101,53 +101,89 @@ body {
     justify-content: center;
     gap: 6px;
     position: relative;
+    overflow: hidden;
 
     /* Subtle inner glow */
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
 }
 
+/* Ambient light sweep across header */
+.sidebar-header::after {
+    content: '';
+    position: absolute;
+    top: -50%;
+    left: -100%;
+    width: 60%;
+    height: 200%;
+    background: linear-gradient(
+        90deg,
+        transparent 0%,
+        rgba(29, 185, 84, 0.06) 40%,
+        rgba(29, 185, 84, 0.12) 50%,
+        rgba(29, 185, 84, 0.06) 60%,
+        transparent 100%
+    );
+    animation: sidebar-header-sweep 8s ease-in-out infinite;
+    pointer-events: none;
+}
+
+@keyframes sidebar-header-sweep {
+    0%, 100% { left: -100%; opacity: 0; }
+    10% { opacity: 1; }
+    50% { left: 140%; opacity: 1; }
+    60% { opacity: 0; }
+}
+
 .app-name {
     font-family: 'SF Pro Display', -apple-system, sans-serif;
     font-size: 20px;
     font-weight: 700;
     background: linear-gradient(90deg, #ffffff 0%, #1ed760 60%, #1db954 100%);
+    background-size: 200% 100%;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     letter-spacing: -0.8px;
     margin: 0;
+    animation: sidebar-logo-shimmer 6s ease-in-out infinite;
+}
+
+@keyframes sidebar-logo-shimmer {
+    0%, 100% { background-position: 0% 50%; }
+    50% { background-position: 100% 50%; }
 }
 
 .app-subtitle {
     font-family: 'SF Pro Text', -apple-system, sans-serif;
     font-size: 10px;
     font-weight: 500;
-    color: rgba(255, 255, 255, 0.65);
-    letter-spacing: 0.2px;
+    color: rgba(255, 255, 255, 0.5);
+    letter-spacing: 1.5px;
+    text-transform: uppercase;
     margin: 0;
     margin-top: 2px;
 }
 
 /* Navigation Buttons */
 .sidebar-nav {
-    padding: 25px 12px;
+    padding: 20px 12px;
     display: flex;
     flex-direction: column;
-    gap: 8px;
+    gap: 4px;
 }
 
 .nav-button {
-    height: 52px;
+    height: 44px;
     width: 216px;
     background: transparent;
     border: 1px solid transparent;
-    border-radius: 16px;
+    border-radius: 12px;
     cursor: pointer;
     display: flex;
     align-items: center;
-    gap: 16px;
-    padding: 0 18px;
-    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    gap: 14px;
+    padding: 0 16px;
+    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
     font-family: 'SF Pro Text', -apple-system, sans-serif;
     font-size: 12px;
     font-weight: 500;
@@ -155,43 +191,60 @@ body {
     overflow: hidden;
 }
 
+/* Active indicator bar - left edge glow */
+.nav-button::before {
+    content: '';
+    position: absolute;
+    left: 0;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 3px;
+    height: 0;
+    border-radius: 0 3px 3px 0;
+    background: linear-gradient(180deg, #1ed760, #1db954);
+    box-shadow: 0 0 8px rgba(29, 185, 84, 0.6);
+    transition: height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.nav-button.active::before {
+    height: 60%;
+}
+
 .nav-button:hover {
     background: linear-gradient(135deg,
             rgba(255, 255, 255, 0.06) 0%,
             rgba(255, 255, 255, 0.03) 100%);
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    border: 1px solid rgba(255, 255, 255, 0.08);
     transform: translateX(4px);
     box-shadow:
         0 4px 12px rgba(0, 0, 0, 0.2),
-        inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        inset 0 1px 0 rgba(255, 255, 255, 0.06);
 }
 
 .nav-button.active {
     background: linear-gradient(135deg,
-            rgba(29, 185, 84, 0.16) 0%,
-            rgba(29, 185, 84, 0.12) 50%,
-            rgba(29, 185, 84, 0.08) 100%);
-    border: 1px solid rgba(29, 185, 84, 0.25);
+            rgba(29, 185, 84, 0.14) 0%,
+            rgba(29, 185, 84, 0.10) 50%,
+            rgba(29, 185, 84, 0.06) 100%);
+    border: 1px solid rgba(29, 185, 84, 0.2);
     transform: translateX(6px);
     box-shadow:
-        0 4px 16px rgba(29, 185, 84, 0.25),
+        0 4px 16px rgba(29, 185, 84, 0.2),
         0 2px 8px rgba(0, 0, 0, 0.2),
-        inset 0 1px 0 rgba(255, 255, 255, 0.12),
-        inset -1px 0 0 rgba(29, 185, 84, 0.6);
+        inset 0 1px 0 rgba(255, 255, 255, 0.1);
 }
 
 .nav-button.active:hover {
     background: linear-gradient(135deg,
-            rgba(29, 185, 84, 0.22) 0%,
-            rgba(29, 185, 84, 0.18) 50%,
-            rgba(29, 185, 84, 0.12) 100%);
-    border: 1px solid rgba(29, 185, 84, 0.35);
+            rgba(29, 185, 84, 0.20) 0%,
+            rgba(29, 185, 84, 0.16) 50%,
+            rgba(29, 185, 84, 0.10) 100%);
+    border: 1px solid rgba(29, 185, 84, 0.3);
     transform: translateX(8px);
     box-shadow:
-        0 6px 20px rgba(29, 185, 84, 0.3),
+        0 6px 20px rgba(29, 185, 84, 0.25),
         0 3px 10px rgba(0, 0, 0, 0.2),
-        inset 0 1px 0 rgba(255, 255, 255, 0.15),
-        inset -1px 0 0 rgba(29, 185, 84, 0.7);
+        inset 0 1px 0 rgba(255, 255, 255, 0.12);
 }
 
 .nav-icon {
@@ -200,36 +253,49 @@ body {
     display: flex;
     align-items: center;
     justify-content: center;
-    font-size: 16px;
+    font-size: 15px;
     font-weight: 600;
-    border-radius: 10px;
+    border-radius: 8px;
     background: linear-gradient(135deg,
-            rgba(255, 255, 255, 0.08) 0%,
-            rgba(255, 255, 255, 0.04) 100%);
-    border: 1px solid rgba(255, 255, 255, 0.06);
-    color: rgba(255, 255, 255, 0.8);
-    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+            rgba(255, 255, 255, 0.07) 0%,
+            rgba(255, 255, 255, 0.03) 100%);
+    border: 1px solid rgba(255, 255, 255, 0.05);
+    color: rgba(255, 255, 255, 0.7);
+    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
     box-shadow:
         0 2px 4px rgba(0, 0, 0, 0.15),
-        inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        inset 0 1px 0 rgba(255, 255, 255, 0.06);
+}
+
+.nav-button:hover .nav-icon {
+    color: rgba(255, 255, 255, 0.95);
+    background: linear-gradient(135deg,
+            rgba(255, 255, 255, 0.12) 0%,
+            rgba(255, 255, 255, 0.06) 100%);
+    border: 1px solid rgba(255, 255, 255, 0.1);
 }
 
 .nav-button.active .nav-icon {
     color: #1ed760;
     background: linear-gradient(135deg,
             rgba(29, 185, 84, 0.25) 0%,
-            rgba(30, 215, 96, 0.20) 100%);
+            rgba(30, 215, 96, 0.18) 100%);
     border: 1px solid rgba(29, 185, 84, 0.3);
     font-weight: 700;
     box-shadow:
-        0 3px 8px rgba(29, 185, 84, 0.3),
-        0 1px 4px rgba(29, 185, 84, 0.2),
-        inset 0 1px 0 rgba(255, 255, 255, 0.15);
+        0 0 12px rgba(29, 185, 84, 0.3),
+        0 2px 6px rgba(29, 185, 84, 0.2),
+        inset 0 1px 0 rgba(255, 255, 255, 0.12);
 }
 
 .nav-text {
-    color: rgba(255, 255, 255, 0.8);
-    letter-spacing: 0.1px;
+    color: rgba(255, 255, 255, 0.65);
+    letter-spacing: 0.2px;
+    transition: all 0.25s ease;
+}
+
+.nav-button:hover .nav-text {
+    color: rgba(255, 255, 255, 0.95);
 }
 
 .nav-button.active .nav-text {
@@ -240,6 +306,24 @@ body {
 /* Sidebar Spacer */
 .sidebar-spacer {
     flex: 1;
+    min-height: 12px;
+    position: relative;
+}
+
+/* Fade divider between nav and bottom content */
+.sidebar-spacer::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 24px;
+    right: 24px;
+    height: 1px;
+    background: linear-gradient(90deg,
+        transparent 0%,
+        rgba(255, 255, 255, 0.06) 30%,
+        rgba(255, 255, 255, 0.06) 70%,
+        transparent 100%
+    );
 }
 
 /* Media Player Section - Premium Glassmorphic Design */
@@ -249,32 +333,32 @@ body {
             rgba(20, 20, 20, 0.98) 50%,
             rgba(14, 14, 14, 1.0) 100%);
     backdrop-filter: blur(12px) saturate(1.1);
-    border: 1px solid rgba(255, 255, 255, 0.08);
-    border-top: 1px solid rgba(255, 255, 255, 0.12);
+    border: 1px solid rgba(255, 255, 255, 0.06);
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
     border-radius: 16px;
-    margin: 12px 14px;
-    padding: 20px;
+    margin: 8px 14px;
+    padding: 18px;
     min-height: 150px;
     transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
     box-shadow:
         0 8px 24px rgba(0, 0, 0, 0.4),
         0 4px 12px rgba(0, 0, 0, 0.3),
-        inset 0 1px 0 rgba(255, 255, 255, 0.1);
+        inset 0 1px 0 rgba(255, 255, 255, 0.08);
 }
 
 .media-player:hover {
-    border: 1px solid rgba(29, 185, 84, 0.25);
-    border-top: 1px solid rgba(29, 185, 84, 0.3);
+    border: 1px solid rgba(29, 185, 84, 0.2);
+    border-top: 1px solid rgba(29, 185, 84, 0.25);
     background: linear-gradient(180deg,
-            rgba(29, 185, 84, 0.10) 0%,
+            rgba(29, 185, 84, 0.08) 0%,
             rgba(28, 28, 28, 0.95) 40%,
             rgba(20, 20, 20, 0.98) 70%,
             rgba(14, 14, 14, 1.0) 100%);
     box-shadow:
         0 12px 32px rgba(0, 0, 0, 0.5),
-        0 6px 16px rgba(29, 185, 84, 0.2),
+        0 6px 16px rgba(29, 185, 84, 0.15),
         0 4px 12px rgba(0, 0, 0, 0.3),
-        inset 0 1px 0 rgba(255, 255, 255, 0.15);
+        inset 0 1px 0 rgba(255, 255, 255, 0.12);
 }
 
 .loading-animation {
@@ -647,56 +731,47 @@ body {
 }
 
 .no-track-message {
-    color: #888888;
-    font-size: 13px;
+    color: rgba(255, 255, 255, 0.25);
+    font-size: 11px;
     font-weight: 500;
     text-align: center;
     padding: 24px 20px;
-    letter-spacing: 0.1px;
-    font-family: 'Spotify Circular', -apple-system, sans-serif;
+    letter-spacing: 0.3px;
+    font-family: 'SF Pro Text', -apple-system, sans-serif;
     line-height: 1.5;
-    opacity: 0.85;
 }
 
-/* Crypto Donation Section - Premium Glassmorphic Design */
+/* Crypto Donation Section */
 .crypto-donation {
-    background: linear-gradient(180deg,
-            rgba(18, 18, 18, 0.95) 0%,
-            rgba(22, 22, 22, 0.98) 50%,
-            rgba(16, 16, 16, 1.0) 100%);
-    backdrop-filter: blur(8px) saturate(1.1);
-    border-top: 1px solid rgba(255, 255, 255, 0.12);
-    border-radius: 12px;
-    margin: 8px 14px;
-    padding: 18px 20px;
-    box-shadow:
-        0 4px 16px rgba(0, 0, 0, 0.3),
-        0 2px 8px rgba(0, 0, 0, 0.2),
-        inset 0 1px 0 rgba(255, 255, 255, 0.08);
+    background: transparent;
+    border-top: 1px solid rgba(255, 255, 255, 0.04);
+    margin: 4px 14px;
+    padding: 12px 6px;
 }
 
 .donation-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: 0 20px 8px 20px;
+    padding: 0 14px 6px 14px;
 }
 
 .donation-title {
     font-family: 'SF Pro Text', -apple-system, sans-serif;
-    font-size: 10px;
+    font-size: 9px;
     font-weight: 600;
-    color: rgba(255, 255, 255, 0.9);
-    letter-spacing: 0.2px;
+    color: rgba(255, 255, 255, 0.3);
+    letter-spacing: 1px;
+    text-transform: uppercase;
 }
 
 .toggle-button {
     width: 40px;
-    height: 20px;
-    background: rgba(255, 255, 255, 0.1);
-    border: 1px solid rgba(255, 255, 255, 0.2);
+    height: 18px;
+    background: rgba(255, 255, 255, 0.06);
+    border: 1px solid rgba(255, 255, 255, 0.1);
     border-radius: 10px;
-    color: rgba(255, 255, 255, 0.7);
+    color: rgba(255, 255, 255, 0.5);
     font-size: 8px;
     font-weight: 500;
     cursor: pointer;
@@ -704,94 +779,86 @@ body {
 }
 
 .toggle-button:hover {
-    background: rgba(255, 255, 255, 0.15);
-    border: 1px solid rgba(255, 255, 255, 0.3);
-    color: rgba(255, 255, 255, 0.9);
+    background: rgba(255, 255, 255, 0.1);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    color: rgba(255, 255, 255, 0.8);
 }
 
 .donation-addresses {
-    padding: 0 12px;
+    padding: 4px 8px 0 8px;
 }
 
 .donation-item {
-    height: 32px;
+    height: 30px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 4px 12px;
-    margin: 0 0 4px 0;
+    margin: 0 0 2px 0;
     border-radius: 8px;
+    border: 1px solid transparent;
     cursor: pointer;
     transition: all 0.2s ease;
 }
 
 .donation-item:hover {
-    background: rgba(255, 255, 255, 0.06);
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: rgba(255, 255, 255, 0.04);
+    border: 1px solid rgba(255, 255, 255, 0.06);
 }
 
 .donation-name {
     font-family: 'SF Pro Text', -apple-system, sans-serif;
     font-size: 9px;
     font-weight: 500;
-    color: rgba(255, 255, 255, 0.8);
+    color: rgba(255, 255, 255, 0.6);
 }
 
 .donation-address,
 .donation-link {
-    font-family: 'Courier New', monospace;
+    font-family: 'SF Mono', 'Fira Code', monospace;
     font-size: 8px;
-    color: rgba(255, 255, 255, 0.5);
+    color: rgba(255, 255, 255, 0.3);
 }
 
 .donation-link {
     font-family: 'SF Pro Text', -apple-system, sans-serif;
     font-style: italic;
+    color: rgba(29, 185, 84, 0.5);
 }
 
-/* Version Section - Premium Glassmorphic Design */
+/* Version Section */
 .version-section {
-    height: 45px;
-    background: linear-gradient(180deg,
-            rgba(18, 18, 18, 0.95) 0%,
-            rgba(14, 14, 14, 0.98) 100%);
-    backdrop-filter: blur(8px) saturate(1.1);
-    border-top: 1px solid rgba(255, 255, 255, 0.08);
-    border-radius: 12px;
-    margin: 8px 14px;
     display: flex;
     align-items: center;
     justify-content: center;
-    padding: 12px 20px;
-    box-shadow:
-        0 3px 12px rgba(0, 0, 0, 0.25),
-        0 1px 6px rgba(0, 0, 0, 0.15),
-        inset 0 1px 0 rgba(255, 255, 255, 0.06);
+    padding: 4px 14px;
+    margin: 0 14px;
 }
 
 .version-button {
     background: transparent;
-    border: none;
-    color: rgba(255, 255, 255, 0.6);
-    font-family: 'SF Pro Text', -apple-system, sans-serif;
-    font-size: 10px;
+    border: 1px solid rgba(255, 255, 255, 0.06);
+    color: rgba(255, 255, 255, 0.35);
+    font-family: 'SF Mono', 'Fira Code', monospace;
+    font-size: 9px;
     font-weight: 500;
-    letter-spacing: 0.1px;
-    padding: 2px 8px;
-    border-radius: 4px;
+    letter-spacing: 1px;
+    padding: 4px 12px;
+    border-radius: 20px;
     cursor: pointer;
-    transition: all 0.2s ease;
-    border: 1px solid transparent;
+    transition: all 0.3s ease;
 }
 
 .version-button:hover {
     color: #1ed760;
-    background: rgba(29, 185, 84, 0.1);
+    background: rgba(29, 185, 84, 0.08);
     border: 1px solid rgba(29, 185, 84, 0.2);
+    box-shadow: 0 0 12px rgba(29, 185, 84, 0.15);
 }
 
 .version-button:active {
-    background: rgba(29, 185, 84, 0.15);
+    background: rgba(29, 185, 84, 0.12);
+    transform: scale(0.97);
 }
 
 /* Status Section - Premium Glassmorphic Design */
@@ -801,81 +868,112 @@ body {
             rgba(18, 18, 18, 0.95) 0%,
             rgba(14, 14, 14, 0.98) 100%);
     backdrop-filter: blur(8px) saturate(1.1);
-    border-top: 1px solid rgba(255, 255, 255, 0.08);
+    border-top: 1px solid rgba(255, 255, 255, 0.06);
     border-bottom-right-radius: 20px;
     border-radius: 12px;
-    margin: 8px 14px 0 14px;
-    padding: 24px 0;
+    margin: 8px 14px 14px 14px;
+    padding: 16px 0 12px 0;
     box-shadow:
         0 4px 16px rgba(0, 0, 0, 0.3),
         0 2px 8px rgba(0, 0, 0, 0.2),
-        inset 0 1px 0 rgba(255, 255, 255, 0.08);
+        inset 0 1px 0 rgba(255, 255, 255, 0.06);
 }
 
 .status-title {
     font-family: 'SF Pro Text', -apple-system, sans-serif;
-    font-size: 11px;
+    font-size: 9px;
     font-weight: 600;
-    color: rgba(255, 255, 255, 0.9);
-    letter-spacing: 0.2px;
-    padding: 0 20px 8px 20px;
-    margin-bottom: 8px;
+    color: rgba(255, 255, 255, 0.4);
+    letter-spacing: 1.5px;
+    text-transform: uppercase;
+    padding: 0 20px 10px 20px;
+    margin-bottom: 4px;
 }
 
 .status-indicator {
-    height: 38px;
+    height: 34px;
     display: flex;
     align-items: center;
-    gap: 14px;
-    padding: 8px 20px;
+    gap: 12px;
+    padding: 6px 20px;
+    border-radius: 8px;
+    margin: 0 8px;
+    transition: background 0.2s ease;
+}
+
+.status-indicator:hover {
+    background: rgba(255, 255, 255, 0.03);
 }
 
 .status-dot {
-    width: 18px;
-    height: 18px;
-    border-radius: 9px;
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    width: 10px;
+    height: 10px;
+    border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
-    font-size: 10px;
-    font-weight: 700;
+    font-size: 0;
+    position: relative;
+    flex-shrink: 0;
 }
 
 .status-dot.connected {
-    color: #1ed760;
-    background: linear-gradient(135deg, rgba(29, 185, 84, 0.2) 0%, rgba(30, 215, 96, 0.15) 100%);
-    border: 1px solid rgba(29, 185, 84, 0.3);
+    background: #1ed760;
+    border: none;
+    box-shadow:
+        0 0 6px rgba(29, 185, 84, 0.6),
+        0 0 12px rgba(29, 185, 84, 0.3);
+    animation: status-pulse-green 3s ease-in-out infinite;
 }
 
 .status-dot.connected::before {
-    content: "●";
+    content: '';
+    position: absolute;
+    inset: -3px;
+    border-radius: 50%;
+    border: 1.5px solid rgba(29, 185, 84, 0.3);
+    animation: status-ring-pulse 3s ease-in-out infinite;
+}
+
+@keyframes status-pulse-green {
+    0%, 100% {
+        box-shadow: 0 0 6px rgba(29, 185, 84, 0.6), 0 0 12px rgba(29, 185, 84, 0.3);
+    }
+    50% {
+        box-shadow: 0 0 8px rgba(29, 185, 84, 0.8), 0 0 20px rgba(29, 185, 84, 0.4);
+    }
+}
+
+@keyframes status-ring-pulse {
+    0%, 100% { opacity: 0.6; transform: scale(1); }
+    50% { opacity: 1; transform: scale(1.15); }
 }
 
 .status-dot.disconnected {
-    color: #ff6b6b;
-    background: linear-gradient(135deg, rgba(255, 107, 107, 0.15) 0%, rgba(255, 107, 107, 0.1) 100%);
-    border: 1px solid rgba(255, 107, 107, 0.2);
+    background: rgba(255, 80, 80, 0.7);
+    border: none;
+    box-shadow: 0 0 4px rgba(255, 80, 80, 0.3);
 }
 
 .status-dot.disconnected::before {
-    content: "●";
+    content: '';
 }
 
 .status-name {
     font-family: 'SF Pro Text', -apple-system, sans-serif;
-    font-size: 10px;
-    letter-spacing: 0.1px;
+    font-size: 11px;
+    letter-spacing: 0.2px;
     min-width: 85px;
+    transition: color 0.2s ease;
 }
 
 .status-indicator:has(.connected) .status-name {
-    color: rgba(255, 255, 255, 0.95);
+    color: rgba(255, 255, 255, 0.9);
     font-weight: 500;
 }
 
 .status-indicator:has(.disconnected) .status-name {
-    color: rgba(255, 255, 255, 0.5);
+    color: rgba(255, 255, 255, 0.35);
     font-weight: 400;
 }