v2.0.8 — oumta timeline: continuous fading line, multi-select filter

- Connector: moved from per-entry pseudo-elements to a single
  linear-gradient line on the body. Fades in/out 28px at each end
  and no longer has gaps at entry boundaries. Dots and the date
  rect's solid background sit naturally on top; everything else
  stays transparent so the line threads through cleanly.
- Layout: entry is now a 2-row grid. The optional date rect lives
  in row 1 (justify-self:start, left-aligned), while the dot-row
  and the events column both pin to row 2 so the time label always
  lines up with the first event of the cluster — even when a date
  rect sits above. Time+dot `align-self: start` keeps them at the
  top of the event section instead of vertically centred through
  the whole cluster.
- Filters: state.timelineFilter is a Set now, so clicking multiple
  workload pills (or the overflow entries) stacks them as an
  any-of filter. "all" clears the set. The overflow dropdown stays
  open on pick so several can be toggled without reopening it each
  time. Scope label shows "filtered · N" with the active count.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

public/plugins/oumta-dashboard/oumta-dashboard.css

@@ -254,24 +254,57 @@
 
 /* Timeline body: two-column layout (left = date badge + time + dot, right
  * = event list). Clusters of events that fired within the same tolerance
- * window get a single row with all sub-events listed in the right column. */
+ * window get a single row with all sub-events listed in the right column.
+ *
+ * The decorative connector line is drawn ONCE on the body, not per entry —
+ * that's the only way to guarantee it's truly continuous (per-entry
+ * pseudo-elements collapse into gaps the moment an entry has a shorter
+ * left column than right). */
 .oumta-timeline-body {
     display: flex; flex-direction: column;
+    gap: 20px;
+    position: relative;
+}
+.oumta-timeline-body::before {
+    content: "";
+    position: absolute;
+    left: 79px;       /* right edge of the 80px left column */
+    top: 24px;        /* begin a bit below the first dot */
+    bottom: 24px;     /* end a bit above the last dot */
+    width: 2px;
+    /* Soft fade at both ends so the line feels like it eases into the
+     * timeline rather than being clipped. The middle stays fully opaque. */
+    background: linear-gradient(
+        to bottom,
+        transparent 0,
+        var(--t-border) 28px,
+        var(--t-border) calc(100% - 28px),
+        transparent 100%
+    );
+    z-index: 0;
+    pointer-events: none;
 }
 .oumta-timeline-entry {
     display: grid;
-    grid-template-columns: 64px 1fr;
-    gap: 14px;
-    padding: 10px 0 14px;
+    grid-template-columns: 80px 1fr;
+    grid-template-rows: auto auto;    /* optional date row on top, dot-row + events below */
+    gap: 0 14px;
     position: relative;
-    align-items: flex-start;
 }
-.oumta-timeline-entry + .oumta-timeline-entry { border-top: 1px solid var(--t-border); }
-.oumta-tl-left {
-    display: flex; flex-direction: column;
+.oumta-timeline-entry > * { position: relative; z-index: 1; }
+/* Time + dot share a horizontal row so clusters without a date badge
+ * show the time label LEFT of the dot, not stacked underneath. The row
+ * lives in grid row 2 so events in the right column (also row 2) stay
+ * vertically aligned with it — regardless of whether a date badge
+ * occupies row 1 above. */
+.oumta-tl-row {
+    display: flex;
     align-items: center;
-    gap: 6px;
-    min-height: 40px;
+    gap: 8px;
+    grid-column: 1;
+    grid-row: 2;
+    justify-self: end;   /* hug the connector line on the right */
+    align-self: start;   /* don't stretch to the events column's full height — stay at the top */
 }
 .oumta-tl-date {
     display: flex; flex-direction: column;
@@ -281,7 +314,11 @@
     border-radius: var(--ui-radius-card);
     padding: 4px 0 5px;
     width: 44px;
-    background: var(--t-bg);
+    background: var(--t-bg);   /* solid, so the connector line behind doesn't strike through the text */
+    grid-column: 1;
+    grid-row: 1;
+    justify-self: start;       /* badge hugs the left edge of the column */
+    margin-bottom: 8px;        /* spacing before the dot-row below */
 }
 .oumta-tl-date .day {
     font-family: var(--font-content, monospace);
@@ -306,7 +343,12 @@
 .oumta-tl-dot {
     width: 10px; height: 10px;
     border-radius: 50%;
-    margin-top: 2px;
+    /* Dot sits at the right end of the time+dot row, which align-items:
+     * flex-end of the left column pushes to the right edge (x=80).
+     * Translate by half the dot width so its centre lines up exactly with
+     * the connector line (also at x=80). */
+    transform: translateX(5px);
+    flex-shrink: 0;
     box-shadow: 0 0 0 3px color-mix(in srgb, var(--oumta-dot-color) 22%, transparent);
     background: var(--oumta-dot-color);
 }
@@ -318,8 +360,10 @@
 
 .oumta-tl-right {
     display: flex; flex-direction: column;
-    gap: 8px;
+    gap: 23px;
     min-width: 0;
+    grid-column: 2;
+    grid-row: 2;             /* pinned to the same row as .oumta-tl-row so events line up with the dot */
 }
 .oumta-tl-event {
     display: flex; flex-direction: column;