Refine balance scoring and dashboard views

assets/css/app.css

@@ -547,6 +547,34 @@ body.page-dashboard .content {
 .compare-day__line.score-2 .compare-day__marker { top: 12%; }
 .compare-day__line.score-empty .compare-day__marker { top: 50%; }
 
+.score-scale {
+    position: absolute;
+    inset: 0 auto 0 0;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    width: 2.2rem;
+    padding-block: 0.25rem;
+    color: rgba(239, 247, 255, 0.52);
+    font-size: 0.66rem;
+    line-height: 1;
+    pointer-events: none;
+}
+
+.score-scale--day {
+    left: calc(50% - 9.8rem);
+}
+
+.score-scale--range {
+    left: 0.35rem;
+    top: 1rem;
+    bottom: 2rem;
+}
+
+.score-scale--month {
+    bottom: 1rem;
+}
+
 .tone-neg2 { background: #ff8f8f !important; border-color: rgba(255, 143, 143, 0.6) !important; }
 .tone-neg1 { background: #ffbf8d !important; border-color: rgba(255, 191, 141, 0.6) !important; }
 .tone-zero { background: #8be4ff !important; border-color: rgba(139, 228, 255, 0.6) !important; }
@@ -1559,6 +1587,7 @@ body.page-dashboard .content {
 }
 
 .range-score-strip {
+    position: relative;
     display: grid;
     gap: 0.55rem;
     align-items: stretch;
@@ -1569,13 +1598,14 @@ body.page-dashboard .content {
 
 .range-score-strip--week {
     grid-template-columns: repeat(7, minmax(0, 1fr));
+    padding-left: 2.45rem;
 }
 
 .range-score-strip--month {
     display: flex;
     gap: 0.18rem;
     overflow: visible;
-    padding-inline: 0.8rem;
+    padding-inline: 2.45rem 0.8rem;
 }
 
 .range-score-day {
@@ -1635,11 +1665,15 @@ body.page-dashboard .content {
     display: flex;
     flex-direction: column;
     gap: 1rem;
-    max-height: min(68vh, 56rem);
-    overflow: auto;
+    overflow: visible;
     padding-right: 0.15rem;
 }
 
+.range-day-list--month {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
+}
+
 .range-day-card {
     display: block;
     overflow: hidden;
@@ -1713,6 +1747,18 @@ body.page-dashboard .content {
     line-height: 1.45;
 }
 
+.range-day-card__score {
+    display: inline-flex;
+    width: fit-content;
+    margin: 0 0 0.5rem;
+    padding: 0.34rem 0.62rem;
+    border-radius: 999px;
+    background: rgba(255, 255, 255, 0.1);
+    color: rgba(239, 247, 255, 0.82);
+    font-size: 0.82rem;
+    font-weight: 700;
+}
+
 .range-day-card--summary-only .range-day-card__summary {
     font-size: clamp(1rem, 2.2vw, 1.25rem);
 }
@@ -1739,6 +1785,15 @@ body.page-dashboard .content {
     display: block;
 }
 
+.signal-scale {
+    display: grid;
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+    width: min(100%, 13rem);
+    color: rgba(239, 247, 255, 0.52);
+    font-size: 0.68rem;
+    text-align: center;
+}
+
 .range-moment-list__item span span {
     margin-top: 0.16rem;
     color: rgba(239, 247, 255, 0.64);
@@ -2248,6 +2303,15 @@ body.page-dashboard .content {
         padding: 0.95rem;
     }
 
+    .range-score-strip--week,
+    .range-score-strip--month {
+        padding-left: 2.35rem;
+    }
+
+    .range-day-list--month {
+        grid-template-columns: 1fr;
+    }
+
     .dashboard-topbar {
         position: relative;
         top: auto;