feat(dashboard): add status filter pills and dim stopped services

- Add All/Running/Stopped filter pills with live counts in toolbar
- Dim stopped service cards (55% opacity, red left border)
- Cards brighten on hover for easy interaction

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

server/static/style.css

@@ -344,6 +344,54 @@ body {
     border-radius: 10px;
 }
 
+.toolbar-filters {
+    display: flex;
+    gap: 4px;
+}
+
+.filter-pill {
+    display: inline-flex;
+    align-items: center;
+    gap: 5px;
+    padding: 4px 12px;
+    font-size: 12px;
+    font-weight: 500;
+    border: 1px solid var(--border);
+    border-radius: 20px;
+    cursor: pointer;
+    background: transparent;
+    color: var(--text-secondary);
+    transition: all var(--transition);
+}
+
+.filter-pill:hover {
+    background: var(--bg-tertiary);
+    color: var(--text-primary);
+}
+
+.filter-pill.active {
+    background: rgba(88, 166, 255, 0.15);
+    color: var(--accent);
+    border-color: rgba(88, 166, 255, 0.3);
+}
+
+.filter-pill[data-filter="stopped"].active {
+    background: rgba(248, 81, 73, 0.12);
+    color: var(--danger);
+    border-color: rgba(248, 81, 73, 0.3);
+}
+
+.filter-pill[data-filter="running"].active {
+    background: rgba(63, 185, 80, 0.12);
+    color: var(--success);
+    border-color: rgba(63, 185, 80, 0.3);
+}
+
+.filter-count {
+    font-size: 11px;
+    font-weight: 600;
+}
+
 .toolbar-center {
     display: flex;
     gap: 8px;
@@ -394,6 +442,15 @@ body {
     box-shadow: 0 0 0 1px rgba(88, 166, 255, 0.15);
 }
 
+.service-card.stopped {
+    opacity: 0.55;
+    border-left: 3px solid var(--danger);
+}
+
+.service-card.stopped:hover {
+    opacity: 0.85;
+}
+
 .card-header {
     display: flex;
     align-items: flex-start;