diff --git a/src/changelog.json b/src/changelog.json
index 97cea7b..64a282e 100644
--- a/src/changelog.json
+++ b/src/changelog.json
@@ -1,4 +1,5 @@
 [
+  { "date": "2026-09-01", "text": "The 7d / 14d / 30d buttons have moved out of the Sleep panel onto their own “Charts cover” row, just under the Log event buttons. They always set the window for every chart on the page — training, timing, sleep, walks, pees/poos/meals — but sitting inside the Sleep panel made them look like a sleep setting" },
   { "date": "2026-09-01", "text": "Dropped the “Darker = more sessions that day” caption under the training consistency grid. Tapping a cell still opens that day" },
   { "date": "2026-09-01", "text": "Dropped two hint lines: the “Based on N pee gaps…” sentence under the Timing charts, and the “Rule of thumb at this age…” one in the Walks panel. The charts above them already say it. The age-based walking goal is still there, drawn as the goal line on the Walk trend" },
   { "date": "2026-09-01", "text": "On the dark theme the awake timers are a warm near-white now — both “Awake for” at the top and the pill in the day bar — instead of yellow text on a yellow-tinted pill. The light theme keeps its dark gold, where white would disappear into a near-white pill" },
diff --git a/src/index.html b/src/index.html
index afce91c..e70f2a4 100644
--- a/src/index.html
+++ b/src/index.html
@@ -134,6 +134,19 @@
         </div>
       </section>
 
+      <!-- Page-level, not a panel's: every panel below that covers more than
+           one day reads this, so it sits on its own row above them all rather
+           than inside one of them, where it read as that panel's own control
+           (see renderChartWindow). -->
+      <div class="chart-window">
+        <span class="chart-window-label">Charts cover</span>
+        <div class="chart-days-picker" role="group" aria-label="How many days the charts cover">
+          <button type="button" class="ghost" data-days="7">7d</button>
+          <button type="button" class="ghost" data-days="14">14d</button>
+          <button type="button" class="ghost" data-days="30">30d</button>
+        </div>
+      </div>
+
       <section class="training" data-panel="training">
         <h2>Training</h2>
         <ul id="training-list" class="training-list"></ul>
@@ -229,11 +242,6 @@
 
       <section class="patterns" data-panel="sleep-daily">
         <h2>Sleep <span class="muted-note" data-chart-days-label>(last 7 days)</span></h2>
-        <div class="chart-days-picker" role="group" aria-label="How many days the charts cover">
-          <button type="button" class="ghost" data-days="7">7d</button>
-          <button type="button" class="ghost" data-days="14">14d</button>
-          <button type="button" class="ghost" data-days="30">30d</button>
-        </div>
         <div class="chart">
           <div class="chart-title">Hours per day</div>
           <svg id="chart-sleep" class="chart-svg" viewBox="0 0 320 160" role="img" aria-label="Sleep hours per day"></svg>
@@ -315,10 +323,6 @@
         <p class="muted-note">Minutes walked so far at each point of the day, against yesterday and the average over the picked window. The line climbs only while a walk is on, so every step is one walk.</p>
       </section>
 
-      <!-- The day-window picker lives in this panel but governs every
-           day-window chart on the page — the training grid above, both sleep
-           patterns below, the counts panel and the walk chart — so changing it
-           here changes all of them (see renderChartWindow). -->
       <section class="weight" data-panel="weight">
         <h2>Weight</h2>
         <div class="weight-summary">
diff --git a/src/style.css b/src/style.css
index d35fc8c..fbafdef 100644
--- a/src/style.css
+++ b/src/style.css
@@ -721,11 +721,29 @@ dialog menu {
 .time-row input { flex: 1 1 120px; min-width: 0; }
 .time-row button { padding: 8px 12px; }
 
+/* The chart window is a page-level control rather than a panel's, so its row
+   skips the card chrome the sections have: no surface, no shadow, just a label
+   and the buttons sitting on the page background between two cards. */
+.chart-window {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 0 4px;
+}
+.chart-window-label {
+  font-size: 0.75rem;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: var(--muted);
+}
+
 .chart-days-picker {
   display: flex;
   gap: 6px;
   margin: -4px 0 14px;
 }
+/* No heading above it out here, so nothing to pull up under or clear beneath. */
+.chart-window .chart-days-picker { margin: 0; }
 .chart-days-picker button {
   padding: 5px 12px;
   font-size: 0.8rem;