About to push

app/static/styles.css

@@ -151,6 +151,21 @@ h2 {
   padding: 16px;
 }
 
+.metric-link {
+  color: inherit;
+  text-decoration: none;
+  transition: border-color 0.15s ease, transform 0.15s ease;
+}
+
+.metric-link:hover {
+  border-color: var(--brand);
+  transform: translateY(-1px);
+}
+
+.device-summary {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
 .card-heading {
   display: flex;
   align-items: start;
@@ -243,6 +258,10 @@ h2 {
   margin-bottom: 18px;
 }
 
+.report-form.compact {
+  grid-template-columns: minmax(180px, 240px) auto;
+}
+
 .report-form label {
   display: grid;
   gap: 6px;
@@ -293,6 +312,10 @@ th {
   .report-form {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
+
+  .device-summary {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
 }
 
 @media (max-width: 620px) {
@@ -313,7 +336,9 @@ th {
   }
 
   .cards,
-  .report-form {
+  .report-form,
+  .report-form.compact,
+  .device-summary {
     grid-template-columns: 1fr;
   }