Index: src/assets/css/style.css
===================================================================
--- src/assets/css/style.css	(revision 6eeb459d85ce54634d70eafd0c9f7bc5b298d407)
+++ src/assets/css/style.css	(revision 4dcefa15b0246b6ede13ff025c959da6985f7bed)
@@ -2133,6 +2133,6 @@
    Niet op de Archive-pagina: daar is geen "huidige" timeline/grid-keuze, dus beide
    knoppen blijven neutraal (grijs). */
-body[data-feed-view="timeline"]:not(.on-archive) .view-switch-btn[data-view="timeline"],
-body[data-feed-view="grid"]:not(.on-archive) .view-switch-btn[data-view="grid"] {
+body[data-feed-view="timeline"]:not(.on-archive):not(.on-shows):not(.on-downloads) .view-switch-btn[data-view="timeline"],
+body[data-feed-view="grid"]:not(.on-archive):not(.on-shows):not(.on-downloads) .view-switch-btn[data-view="grid"] {
     background: var(--ink);
     color: var(--paper);
Index: src/views/partials/shared-styles.ejs
===================================================================
--- src/views/partials/shared-styles.ejs	(revision 6eeb459d85ce54634d70eafd0c9f7bc5b298d407)
+++ src/views/partials/shared-styles.ejs	(revision 4dcefa15b0246b6ede13ff025c959da6985f7bed)
@@ -50,6 +50,7 @@
 }
 .vs-agenda:hover { color: var(--ink); }
-/* Op de agendapagina = helder/wit (geen pilletje, past bij de losse-link-look). */
-body.on-shows .vs-agenda { color: var(--ink); font-weight: 600; }
+/* Actief (op de agendapagina) = helder/wit. Element-class (in de OOB-gerenderde
+   chrome) i.p.v. body-class-CSS → werkt betrouwbaar ook na htmx-navigatie. */
+.vs-agenda.is-active { color: var(--ink); font-weight: 600; }
 
 .grid-cols-picker {
@@ -97,25 +98,4 @@
 }
 
-/* Op de agenda- én downloads-pagina is ALLES behalve de Agenda-pill neutraal/grijs
-   (je bent daar niet in een feed-weergave). !important + body.on-X (betrouwbaar
-   gezet/gestript via PAGE_CLASSES) → overrult de feed-active-regel ZONDER naar de
-   feed te lekken (de selector matcht alleen op die pagina's). */
-body.on-shows .view-switch-btn,
-body.on-downloads .view-switch-btn {
-  background: transparent !important;
-  color: var(--ink-muted, var(--ink-soft)) !important;
-  border-color: var(--rule) !important;
-}
-body.on-shows .feed-scope-btn.is-active,
-body.on-downloads .feed-scope-btn.is-active {
-  background: transparent !important;
-  color: var(--ink-muted, var(--ink-soft)) !important;
-}
-body.on-shows .grid-cols-btn.is-active,
-body.on-downloads .grid-cols-btn.is-active {
-  background: var(--paper-2) !important;
-  color: var(--ink-muted, var(--ink-soft)) !important;
-  border-color: var(--rule) !important;
-}
 
 /* Spacing between switcher-bar and the page content below.
Index: src/views/partials/view-switcher.ejs
===================================================================
--- src/views/partials/view-switcher.ejs	(revision 6eeb459d85ce54634d70eafd0c9f7bc5b298d407)
+++ src/views/partials/view-switcher.ejs	(revision 4dcefa15b0246b6ede13ff025c959da6985f7bed)
@@ -3,4 +3,12 @@
     handlers are wired in shell.ejs via event-delegation on document so
     HTMX-swapped content keeps working without rebinding. %>
+<%
+  var _bc = (typeof bodyClass === 'string') ? bodyClass : '';
+  var _onShows = _bc.indexOf('on-shows') >= 0;
+  // Pagina's zonder actieve feed-weergave → niets in de pill is 'actief' (Solo/Cirkel
+  // + Tijdlijn/Grid grijs). Alleen Agenda krijgt z'n eigen is-active op de agenda.
+  var _neutral = ['on-shows','on-downloads','on-post','on-epk','on-linkbio','on-newsletter','on-archive']
+                   .some(function(c){ return _bc.indexOf(c) >= 0; });
+%>
 <div class="view-switcher-wrap">
   <div class="container">
@@ -9,5 +17,5 @@
     %>
     <div class="agenda-pill">
-      <a class="vs-agenda" href="<%= _sbA %>/shows" aria-label="Agenda — evenementen">
+      <a class="vs-agenda<%= _onShows ? ' is-active' : '' %>" href="<%= _sbA %>/shows" aria-label="Agenda — evenementen">
         <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="18" rx="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
         <span>Agenda</span>
@@ -20,8 +28,8 @@
     %>
     <div class="feed-scope" role="tablist" aria-label="Solo of cirkel">
-      <a class="feed-scope-btn<%= _onCirkel ? '' : ' is-active' %>" href="<%= _sb %>/"
-         role="tab" aria-selected="<%= _onCirkel ? 'false' : 'true' %>">Solo</a>
-      <a class="feed-scope-btn<%= _onCirkel ? ' is-active' : '' %>" href="<%= _sb %>/cirkel"
-         role="tab" aria-selected="<%= _onCirkel ? 'true' : 'false' %>">Cirkel</a>
+      <a class="feed-scope-btn<%= (!_neutral && !_onCirkel) ? ' is-active' : '' %>" href="<%= _sb %>/"
+         role="tab" aria-selected="<%= (!_neutral && !_onCirkel) ? 'true' : 'false' %>">Solo</a>
+      <a class="feed-scope-btn<%= (!_neutral && _onCirkel) ? ' is-active' : '' %>" href="<%= _sb %>/cirkel"
+         role="tab" aria-selected="<%= (!_neutral && _onCirkel) ? 'true' : 'false' %>">Cirkel</a>
     </div>
     <% } %>
@@ -38,4 +46,5 @@
       </button>
     </div>
+    <% if (!_neutral) { %>
     <div class="grid-cols-picker" aria-label="Aantal kolommen">
       <button type="button" class="grid-cols-btn" data-cols="2" title="2 kolommen">2</button>
@@ -43,4 +52,5 @@
       <button type="button" class="grid-cols-btn" data-cols="4" title="4 kolommen">4</button>
     </div>
+    <% } %>
   </div>
 </div>
Index: src/views/shell.ejs
===================================================================
--- src/views/shell.ejs	(revision 6eeb459d85ce54634d70eafd0c9f7bc5b298d407)
+++ src/views/shell.ejs	(revision 4dcefa15b0246b6ede13ff025c959da6985f7bed)
@@ -163,5 +163,5 @@
 
 <!-- v9 stylesheet (full palette system) -->
-<link rel="stylesheet" href="/assets/css/style.css?v=18">
+<link rel="stylesheet" href="/assets/css/style.css?v=19">
 
 <!-- Audio player styles: loaded on every page so the mini-player works