Make day strip draggable and fix sleep bars

assets/css/app.css

@@ -467,6 +467,15 @@ body.page-dashboard .content {
     width: min(100%, 20rem);
     height: 11rem;
     margin-top: 0.95rem;
+    touch-action: pan-y;
+    transform: translateX(var(--day-strip-offset, 0));
+    transition: transform 180ms ease;
+    will-change: transform;
+}
+
+.dashboard-compare-strip.is-dragging {
+    transition: none;
+    cursor: grabbing;
 }
 
 .compare-day {
@@ -915,7 +924,6 @@ body.page-dashboard .content {
 
 .sleep-phase-bar {
     position: relative;
-    display: flex;
     min-height: 2.35rem;
     margin-top: 1.55rem;
     overflow: visible;
@@ -949,20 +957,23 @@ body.page-dashboard .content {
 }
 
 .sleep-phase-bar__segment {
+    box-sizing: border-box;
+    position: absolute;
+    left: var(--sleep-segment-left, 0);
+    top: 0;
+    bottom: 0;
+    width: var(--sleep-segment-width, auto);
     display: inline-flex;
     align-items: center;
     justify-content: center;
     gap: 0.25rem;
     min-width: 0;
-    flex: 0 0 var(--sleep-segment-width, auto);
-    width: var(--sleep-segment-width, auto);
     padding: 0.35rem 0.45rem;
     color: rgba(255, 255, 255, 0.94);
     font-size: 0.82rem;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
-    position: relative;
 }
 
 .sleep-phase-bar__segment.is-compact {