Carry the sunshine to the two awake timers

The list said awake in gold while the big card and the day-bar pill still said
it in purple, which left the app describing one state in two colours. Both move
across, so asleep against awake is night-blue against day-gold everywhere.

Text takes --wake-ink, not --wake. A gold light enough to read as sunshine is
not legible as text on a pale ground: the bright value measures 1.71:1 against
the card it would sit on, where the ink makes 4.96, and 4.71 on the pill's
tint — the same split the pee button has always used, dark ink on the yellow
rather than yellow ink.

Worth noting for later: this now makes awake considerably easier to read than
asleep, whose blue-on-blue pill has been sitting at 2.57:1 since long before
any of this. Untouched, being a separate question about the sleep colour.

src/changelog.json

@@ -1,4 +1,5 @@
 [
+  { "date": "2026-08-31", "text": "The awake timer is sunshine too now — both the big “Awake for” card and the pill in the day bar — so the whole app tells asleep and awake apart by night-blue against day-gold rather than by blue against purple" },
   { "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”" },

src/style.css

@@ -223,7 +223,9 @@ body::before {
 /* Big timer still on screen: keep the pill's slot but show nothing. */
 .bar-clock.standby { visibility: hidden; }
 .bar-clock.asleep { background: color-mix(in srgb, var(--sleep) 18%, var(--surface)); color: var(--sleep); }
-.bar-clock.awake  { background: color-mix(in srgb, var(--accent) 18%, var(--surface)); color: var(--accent); }
+/* Dark text on the yellow, the way the pee button already does it: a gold
+   light enough to read as sunshine is never legible as text on a pale ground. */
+.bar-clock.awake  { background: color-mix(in srgb, var(--wake) 18%, var(--surface)); color: var(--wake-ink); }
 
 .big-clock {
   text-align: center;
@@ -251,8 +253,8 @@ body::before {
 }
 .big-clock.asleep { background: linear-gradient(180deg, var(--surface), color-mix(in srgb, var(--sleep) 10%, var(--surface))); }
 .big-clock.asleep .bc-time { color: var(--sleep); }
-.big-clock.awake  { background: linear-gradient(180deg, var(--surface), color-mix(in srgb, var(--accent) 10%, var(--surface))); }
+.big-clock.awake  { background: linear-gradient(180deg, var(--surface), color-mix(in srgb, var(--wake) 10%, var(--surface))); }
-.big-clock.awake  .bc-time { color: var(--accent); }
+.big-clock.awake  .bc-time { color: var(--wake-ink); }
 
 /* Quick actions: a stack of explicit rows (see index.html) instead of one
    auto-fit grid, so the grouping is the same at every width. Equal columns