2.5

Data table compact hours 1h, 2h, 3h or 4h. Calc max/min or average

assets/css/table.css

@@ -658,6 +658,39 @@
   background: #e8d8a8;
 }
 
+/* ── HOUR-INTERVAL SELECTOR ──────────────────────────────────────────────
+   Compact 1h/2h/3h/4h segmented control inside the "Hour" header. Buckets
+   the table into multi-hour rows (clock-aligned from midnight). Lives in the
+   header so it stays put while the body scrolls. */
+.hour-interval {
+  display: flex;
+  justify-content: flex-start;
+  gap: 2px;
+  margin-top: 4px;
+}
+.hour-interval-btn {
+  font-family: Manrope, sans-serif;
+  font-size: 10px;
+  font-weight: 700;
+  line-height: 1;
+  padding: 3px 4px;
+  cursor: pointer;
+  border: 1px solid #c9b08a;
+  background: #f5edd6;
+  color: #6b4228;
+  border-radius: 3px;
+  transition: background 0.12s, border-color 0.12s, color 0.12s;
+}
+.hour-interval-btn:hover {
+  border-color: #c8922a;
+  background: #fef3dc;
+}
+.hour-interval-btn.on {
+  background: #c8922a;
+  border-color: #c8922a;
+  color: #fff;
+}
+
 /* ── COLUMN DESCRIPTION POPUP ───────────────────────────────────────────
    Fixed-position card that appears below a clicked column header.
    JS sets left/top via inline style (centred on the clicked th). */