Make entire UI mobile-friendly with responsive breakpoints

Add media queries at 480px/768px across all components: single-column
dashboard cards on phones, progressive table column hiding, smaller
typography, reduced padding, full-width toggle buttons, and compact
header. Desktop layout unchanged.

ui/src/lib/UserDetailPage.svelte

@@ -435,4 +435,27 @@
   tr.idle td {
     color: var(--fg-dim);
   }
+
+  /* Mobile: hide Hardware, Status, Diff, Best(session) columns */
+  @media (max-width: 768px) {
+    table :global(th:nth-child(2)),
+    table :global(td:nth-child(2)),
+    table :global(th:nth-child(3)),
+    table :global(td:nth-child(3)),
+    table :global(th:nth-child(6)),
+    table :global(td:nth-child(6)) {
+      display: none;
+    }
+  }
+  @media (max-width: 480px) {
+    table :global(th:nth-child(5)),
+    table :global(td:nth-child(5)),
+    table :global(th:nth-child(7)),
+    table :global(td:nth-child(7)) {
+      display: none;
+    }
+    .addr {
+      font-size: 1rem;
+    }
+  }
 </style>