Paint awake as sunshine, not accent

Awake rows in the sleep & wake list borrowed --accent, which meant purple did
double duty: it was the colour of "awake" and also the colour of "this row is
the one still running", so the two readings overlapped on exactly the row where
both applied. A warm gold takes the first job. Asleep against awake now reads
as night against day, which is the distinction the list exists to draw, and it
agrees with the ☀️ the timer pill already shows.

Two variables rather than one. --wake is the bright gold, for the stripe and
the open row's tint. --wake-ink is that warmth pulled dark, for the small
uppercase label, and it is the value that flips with the theme: a yellow legible
on white is not legible on near-black, and vice versa. Measured on the four
backgrounds it lands on, it clears 4.5:1 in both themes, ordinary rows and the
tinted open one alike — better than the purple it replaces, which only ever made
the large-text bar.

The gold sits near --pee, but the two never share a panel: pee is a dot in the
history log and a bar in the counts chart, awake is a stripe in a list of
windows.

Scoped to the list, as asked. The big timer card and the day-bar pill still
paint awake with the accent.

src/changelog.json

@@ -1,4 +1,5 @@
 [
+  { "date": "2026-08-31", "text": "Awake stretches in the Sleep & wake list are sunshine yellow now instead of the app's purple — the same idea as the ☀️ on the timer pill — so asleep and awake read as night and day down the list rather than as two shades of the same accent" },
   { "date": "2026-08-31", "text": "The Walks list reads newest first as well, so a walk in progress is the top row and every list in the app now runs the same way" },
   { "date": "2026-08-31", "text": "The Walks panel and its two charts have moved down the page, below “Pees, poos & meals”" },
   { "date": "2026-08-31", "text": "Sleep windows and Wake windows are one “Sleep & wake” panel now, with the two interleaved into a single list, newest first — awake since 12:30, asleep 11:40–12:30, awake since 09:15, and so on back through the day. A wake window is just the gap between two sleeps, so the two lists were always halves of the same sequence, and reading them together makes “only a 45-minute nap after two and a half hours up” obvious in a way two separate lists never did. Whatever is happening right now is the first row, as in the history and notes logs. Each row says which it is and carries a stripe in its colour; whichever one is still running keeps the highlight" },

src/style.css

@@ -12,6 +12,11 @@
   --weight: #2bb3a3;
   --training: #b04ecf;
   --walk: #3f9e63;
+  /* Awake = sunshine. The bright gold is for stripes and fills; --wake-ink is
+     the same warmth pulled dark enough for a small uppercase label to be
+     readable, and is the one value that has to flip with the theme. */
+  --wake: #f2b705;
+  --wake-ink: #8f6400;
   --note: #6f7a90;
   --danger: #d64545;
   --gain: #2e9e5b;
@@ -32,6 +37,7 @@
     --muted: #9c9bab;
     --accent: #a690ff;
     --accent-soft: #2a2640;
+    --wake-ink: #f5c451;
     --border: #2c2a3a;
     --shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 4px 16px rgba(0, 0, 0, 0.3);
   }
@@ -43,6 +49,7 @@
   --muted: #9c9bab;
   --accent: #a690ff;
   --accent-soft: #2a2640;
+  --wake-ink: #f5c451;
   --border: #2c2a3a;
   --shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 4px 16px rgba(0, 0, 0, 0.3);
 }
@@ -474,10 +481,10 @@ textarea { resize: vertical; }
 /* A stripe in the row's own colour, so an alternating list reads as alternating
    before you get to the words. */
 .ww.sleep-ww { border-left: 3px solid color-mix(in srgb, var(--sleep) 55%, transparent); }
-.ww.wake-ww  { border-left: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); }
+.ww.wake-ww  { border-left: 3px solid color-mix(in srgb, var(--wake) 75%, transparent); }
 .ww.walk-ww  { border-left: 3px solid color-mix(in srgb, var(--walk) 55%, transparent); }
 .ww.sleep-ww .ww-tag { color: var(--sleep); }
-.ww.wake-ww  .ww-tag { color: var(--accent); }
+.ww.wake-ww  .ww-tag { color: var(--wake-ink); }
 .ww.walk-ww  .ww-tag { color: var(--walk); }
 .ww.ongoing .ww-tag { color: var(--accent); }
 .ww.sleep-ww.ongoing {
@@ -487,11 +494,13 @@ textarea { resize: vertical; }
 .ww.sleep-ww.ongoing .ww-tag { color: var(--sleep); }
 /* Spelled out like the other two: the faded stripe above would otherwise win
    over the generic .ww.ongoing on specificity ties and leave the open awake
-   row without its full-strength edge. */
+   row without its full-strength edge. The tag needs saying too — .ww.wake-ww
+   .ww-tag ties with .ww.ongoing .ww-tag and loses on order. */
 .ww.wake-ww.ongoing {
-  border-color: var(--accent);
+  border-color: var(--wake);
-  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
+  background: color-mix(in srgb, var(--wake) 16%, var(--surface));
 }
+.ww.wake-ww.ongoing .ww-tag { color: var(--wake-ink); }
 .ww.walk-ww.ongoing {
   border-color: var(--walk);
   background: color-mix(in srgb, var(--walk) 14%, var(--surface));