diff --git a/AGENTS.md b/AGENTS.md
index c05f79e..dab4977 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -93,7 +93,7 @@ To add something, copy the front matter of an existing file of the same kind. Th
 
 The navigation is in `_layouts/default.html`. Styles go in `assets/main.scss`, which defines the Sass variables in README's "Brand Colours", or in a partial in `assets/sass/` that it loads with `@use`. A partial can't see those variables (the build fails with "Undefined variable"), so use the `--qe-*` custom properties that `main.scss` sets on `:root`, such as `var(--qe-blue)`, as `_about.scss` does.
 
-`_layouts/default.html` adds a `js` class to `<html>` before first paint. Style states that need JavaScript, such as a collapsed list, under `.js`, and hide controls that need it under `html:not(.js)`: nothing then moves when scripts run, and without JavaScript everything shows. Have the script remove the class if it fails, or what it collapsed stays hidden. The `/activity/` filter and its "N changes" lists work this way.
+`_layouts/default.html` adds a `js` class to `<html>` before first paint. Style states that need JavaScript, such as a collapsed list, under `.js`, and hide controls that need it under `html:not(.js)`: nothing then moves when scripts run, and without JavaScript everything shows. Have the script remove the class if it fails, or what it collapsed stays hidden. The `/activity/` filter and its "N changes" lists, and the `/news/` rail's filter and panel, work this way.
 
 ### News and Activity
 
diff --git a/README.md b/README.md
index e6a9bbf..65ced05 100644
--- a/README.md
+++ b/README.md
@@ -22,7 +22,7 @@ The site has two streams of updates. The rule of thumb: **people write News, the
 
 **Promotion is a human decision.** When a release or a batch of lecture changes deserves wider attention, someone writes a News post that links to it.
 
-These definitions decide which stream an item belongs to, not where it is shown. News posts are stored in `_posts/` and Activity entries in `_data/activity/` (schema below). Which pages display each stream is a design choice: today News appears on `/news/`, the home page and `feed.xml`, and Activity on `/activity/`.
+These definitions decide which stream an item belongs to, not where it is shown. News posts are stored in `_posts/` and Activity entries in `_data/activity/` (schema below). Which pages display each stream is a design choice: today News appears on `/news/`, the home page and `feed.xml`, and Activity on `/activity/` and beside News on `/news/`.
 
 ### Activity data
 
diff --git a/_layouts/news.html b/_layouts/news.html
index eb88252..c711e87 100755
--- a/_layouts/news.html
+++ b/_layouts/news.html
@@ -1,8 +1,80 @@
 ---
 layout: default
 ---
+{% comment %}
+  /news/: the News h1, then the Activity rail and the news. At 1200px and wider they sit in a
+  grid with the rail in the right column; below that the rail is a panel above the news. The
+  rail's <aside> comes first in the source, so the panel needs no reordering, and the hidden
+  "Latest news" heading keeps the posts from being filed under the rail's heading. With no
+  Activity data there is no aside, and the news keeps its column.
 
+  The rail reads site.data.activity_view (the header comment of _plugins/activity_generator.rb
+  documents it): week groups over the latest 6 rows of each type, each row once. The 6 newest
+  rows overall carry data-all; every other row, and every week without one, is rendered hidden,
+  so without JavaScript the rail shows the All view. The includes in _includes/activity/ escape
+  every field, and mathjax_ignore stops MathJax, which loads on every page, from typesetting a
+  "$" in a summary.
+
+  Without JavaScript the filter and the panel's toggle are hidden: the panel is open under a
+  plain heading, and the rail doesn't stick. With it, CSS keyed on the js class that
+  _layouts/default.html sets before first paint shows them and collapses the panel, and the
+  script below adds the behaviour. If the script fails, it removes that class.
+{% endcomment %}
 {{ content }}
+{%- assign activity = site.data.activity_view %}
+<div class="news-layout">
+{%- if activity.panel %}
+<aside class="activity-rail mathjax_ignore" aria-labelledby="activity-rail-title">
+  <h2 class="activity-rail__title" id="activity-rail-title">Activity</h2>
+  <h2 class="activity-rail__heading">
+    <button type="button" class="activity-rail__toggle" aria-expanded="false" aria-controls="activity-rail-body">
+      <i class="bi bi-activity activity-rail__icon" aria-hidden="true"></i>
+      <span class="activity-rail__label"><strong>Activity</strong> <span class="activity-rail__sep">· </span><span class="activity-rail__summary">{{ activity.panel.text | escape }}</span></span>
+      <i class="bi bi-chevron-down activity-rail__chevron" aria-hidden="true"></i>
+    </button>
+  </h2>
+  <p class="activity-rail__about">Library releases and lecture updates, from GitHub</p>
+  <div class="activity-rail__body" id="activity-rail-body">
+    <p class="activity-rail__subtitle">Library releases and updates to the lectures and their translations, compiled from GitHub.</p>
+    <div class="activity-filters" role="group" aria-label="Filter activity by type">
+      <button type="button" class="activity-filter" data-filter="all" aria-pressed="true">All</button>
+      <button type="button" class="activity-filter" data-filter="release" aria-pressed="false">Releases</button>
+      <button type="button" class="activity-filter" data-filter="lectures" aria-pressed="false">Lectures</button>
+      <button type="button" class="activity-filter" data-filter="translation" aria-pressed="false">Translations</button>
+      <button type="button" class="activity-filter" data-filter="book" aria-pressed="false">Books</button>
+    </div>
+    <div class="activity-rail__panel">
+      <div class="activity-rail__list">
+        <p class="activity-empty" hidden></p>
+        {%- for week in activity.rail %}
+        <div class="activity-week"{% unless week.has_all %} hidden{% endunless %}>
+          <h3 class="activity-week__title"><time datetime="{{ week.datetime | escape }}">{{ week.label | escape }}</time></h3>
+          <ol class="activity-week__rows" role="list">
+            {%- for row in week.rows %}
+            <li class="activity-rail-row" data-type="{{ row.type | escape }}"{% if row.in_all %} data-all{% else %} hidden{% endif %}>
+              <div class="activity-meta">{% include activity/meta.html row=row %}</div>
+              <a class="activity-rail-row__title" href="{{ row.url | escape }}">{% include activity/title.html row=row %}</a>
+              {%- if row.per_edition %}
+              <p class="activity-rail-row__summary">
+                {%- for edition in row.per_edition %}{% if edition.summaries.size > 0 %}{% assign edition_text = edition.summaries | join: " " %} <strong>{{ edition.lang | escape }}:</strong> {% include activity/summary.html text=edition_text %}{% endif %}{% endfor -%}
+              </p>
+              {%- elsif row.summary != "" %}
+              <p class="activity-rail-row__summary">{% include activity/summary.html text=row.summary %}</p>
+              {%- endif %}
+            </li>
+            {%- endfor %}
+          </ol>
+        </div>
+        {%- endfor %}
+        <a class="qe-btn qe-btn--outline-dark activity-rail__all" href="/activity/">View all activity</a>
+      </div>
+    </div>
+  </div>
+  <p class="activity-status visually-hidden" aria-live="polite"></p>
+</aside>
+{%- endif %}
+<div class="news-main">
+<h2 class="visually-hidden">Latest news</h2>
 
 {% assign date_format = site.minima.date_format | default: "%-d %b %Y" %}
 {% assign recent_limit = 20 %}
@@ -86,3 +158,67 @@ <h2 class="accordion-header">
   </div>
 </div>
 {% endif %}
+</div>
+</div>
+
+<script>
+  // The rail's type filter, the panel's toggle, and the height that lets a tall rail stick by
+  // its bottom edge. If anything here fails, removing the js class hides the filter and the
+  // toggle, opens the panel and shows the All view.
+  (() => {
+    try {
+      const rail = document.querySelector('.activity-rail');
+      if (!rail) return;
+      const rows = [...rail.querySelectorAll('.activity-rail-row')];
+      const weeks = [...rail.querySelectorAll('.activity-week')];
+      const filters = [...rail.querySelectorAll('.activity-filter')];
+      const toggle = rail.querySelector('.activity-rail__toggle');
+      const list = rail.querySelector('.activity-rail__list');
+      const status = rail.querySelector('.activity-status');
+      const empty = rail.querySelector('.activity-empty');
+      const nouns = {
+        release: ['release', 'releases'],
+        lectures: ['lecture update', 'lecture updates'],
+        translation: ['translation update', 'translation updates'],
+        book: ['book update', 'book updates']
+      };
+      let current = 'all';
+
+      // Shows the 6 newest rows, or one type's rows, hides the weeks left empty, and announces
+      // how many rows show. The choice isn't remembered.
+      const show = type => {
+        current = type;
+        let count = 0;
+        rows.forEach(row => {
+          row.hidden = type === 'all' ? !row.hasAttribute('data-all') : row.dataset.type !== type;
+          if (!row.hidden) count++;
+        });
+        weeks.forEach(week => { week.hidden = !week.querySelector('.activity-rail-row:not([hidden])'); });
+        filters.forEach(button => button.setAttribute('aria-pressed', button.dataset.filter === type));
+        let message;
+        if (type === 'all') message = count === 1 ? 'Showing the latest update' : `Showing the ${count} latest updates`;
+        else if (count === 0) message = `No ${nouns[type][1]} yet`;
+        else message = `Showing ${count} ${nouns[type][count === 1 ? 0 : 1]}`;
+        empty.textContent = message;
+        empty.hidden = count > 0;
+        status.textContent = message;
+      };
+
+      // Focus stays on the button pressed, a filter or the toggle
+      rail.addEventListener('click', event => {
+        const filter = event.target.closest('.activity-filter');
+        if (filter && filter.dataset.filter !== current) show(filter.dataset.filter);
+        if (event.target.closest('.activity-rail__toggle')) {
+          toggle.setAttribute('aria-expanded', rail.classList.toggle('is-open'));
+        }
+      });
+
+      // The list's height, which the sticky rule in main.scss reads: a list taller than the
+      // window sticks by its bottom edge. It changes with the filter, the fonts and the width.
+      new ResizeObserver(() => rail.style.setProperty('--rail-h', `${list.offsetHeight}px`)).observe(list);
+    } catch (error) {
+      document.documentElement.classList.remove('js');
+      console.error(error);
+    }
+  })();
+</script>
diff --git a/assets/main.scss b/assets/main.scss
index ab73df6..952e9c1 100755
--- a/assets/main.scss
+++ b/assets/main.scss
@@ -1321,8 +1321,10 @@ section {
 }
 
 /* Team page contents column */
-// `clip` keeps the global section clipping but, unlike `hidden`, lets .team-toc stick to the viewport
-.inner-page:has(.team-toc) {
+// `clip` keeps the global section clipping but, unlike `hidden`, lets .team-toc and the /news/
+// Activity rail stick to the viewport. Without :has() or `clip` they stay in place.
+.inner-page:has(.team-toc),
+.inner-page:has(.activity-rail) {
   overflow: clip;
 }
 
@@ -1621,9 +1623,10 @@ section {
 }
 
 // The /activity/ log. Day and month anchors, and keyboard focus, land below the fixed header
-// and the sponsor bar. Scoped to this page: on every page it would add to /team/'s
-// scroll-margin-top.
-html:has(.activity-log) {
+// and the sponsor bar, here and on /news/ with its Activity rail. Scoped to these pages: on
+// every page it would add to /team/'s scroll-margin-top.
+html:has(.activity-log),
+html:has(.activity-rail) {
   scroll-padding-top: calc(84px + var(--sponsor-bar-height, 0px) + 16px);
 }
 
@@ -1888,6 +1891,331 @@ html:not(.js) .activity-changes__toggle {
   }
 }
 
+// The Activity rail on /news/: at 1200px and wider a column beside the news, below that a
+// panel above them, collapsed with JavaScript. One <aside> serves both; the panel's colours are
+// the defaults here, and the rail's are set at 1200px.
+.activity-rail {
+  --rail-surface: #eef4fb;
+  --rail-line: #dbe8f5;
+  --rail-meta: #{$color-text};
+  --rail-dash: #94a3b8;
+  overflow-wrap: anywhere; // a long name wraps rather than widening the page
+  a:focus-visible,
+  button:focus-visible {
+    outline: 2px solid $color-link;
+    outline-offset: 2px;
+  }
+  .activity-filters {
+    column-gap: 18px;
+    border-bottom-color: var(--rail-line);
+  }
+  // A filter with no rows: "No book updates yet"
+  .activity-empty {
+    margin: 0 0 16px;
+    padding: 24px 16px;
+    border: 1px dashed var(--rail-dash);
+    border-radius: 8px;
+    text-align: center;
+    font-size: 14.4px;
+  }
+  .activity-meta {
+    font-size: 12.8px;
+    line-height: 1.35;
+    color: var(--rail-meta);
+  }
+}
+
+.activity-rail__title {
+  margin: 0;
+  font-size: 1.4rem;
+  color: $color-dark;
+}
+
+.activity-rail__subtitle {
+  margin: 6px 0 0;
+  font-size: 14.4px;
+  line-height: 1.5;
+  color: var(--rail-meta);
+}
+
+// The panel's toggle and its second line show only below 1200px, with JavaScript
+.activity-rail__heading,
+.activity-rail__about {
+  display: none;
+}
+
+// A week: its heading, then a timeline of rows. 20px above every week shown after the first.
+.activity-week:not([hidden]) ~ .activity-week {
+  margin-top: 20px;
+}
+
+// The week headings, and the rail's "Activity" label (its content is set at 1200px)
+.activity-week__title,
+.activity-rail__list::before {
+  margin: 0 0 12px;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 1.2;
+  letter-spacing: 0.05em;
+  text-transform: uppercase;
+  color: var(--rail-meta);
+}
+
+.activity-week__rows {
+  margin: 0 0 0 5px;
+  padding: 0;
+  border-left: 2px solid var(--rail-line);
+  list-style: none;
+}
+
+.activity-rail-row {
+  position: relative;
+  padding: 0 0 16px 18px;
+  // The timeline's dot
+  &::before {
+    content: "";
+    position: absolute;
+    left: -7px;
+    top: 3px;
+    width: 12px;
+    height: 12px;
+    border: 2px solid var(--rail-surface);
+    border-radius: 50%;
+    background: $color-link;
+    box-shadow: 0 0 0 2px var(--rail-line);
+  }
+}
+
+.activity-rail-row__title,
+.activity-rail-row__summary {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+}
+
+.activity-rail-row__title {
+  margin-top: 3px;
+  border-radius: 2px; // shapes the focus ring
+  font-size: 15px;
+  font-weight: 700;
+  line-height: 1.35;
+  color: $color-dark;
+  text-underline-offset: 2px;
+}
+
+.activity-rail-row__summary {
+  margin: 3px 0 0;
+  font-size: 14px;
+  line-height: 1.45;
+  strong {
+    color: $color-dark;
+  }
+  code {
+    padding: 0 3px;
+    border: 1px solid $color-border;
+    border-radius: 4px;
+    background: #fff;
+    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+    font-size: 12.5px;
+    color: $color-dark; // not Bootstrap's pink
+  }
+}
+
+.activity-rail__all {
+  display: block;
+  margin-top: 8px;
+  padding: 0.6rem 1rem;
+  font-weight: 700;
+  text-align: center;
+}
+
+// Below 1200px: the panel, under the h1 and above the news
+@media (max-width: 1199.98px) {
+  .activity-rail {
+    margin-bottom: 20px;
+    border: 1px solid var(--rail-line);
+    border-radius: 8px;
+    background: var(--rail-surface);
+  }
+  .js .activity-rail__heading {
+    display: block;
+    margin: 0;
+    font: inherit;
+  }
+  .js .activity-rail__title {
+    display: none;
+  }
+  // Collapsed from the first paint: the toggle and a second line, until it is opened
+  .js .activity-rail:not(.is-open) {
+    .activity-rail__body {
+      display: none;
+    }
+    .activity-rail__about {
+      display: block;
+    }
+  }
+  .activity-rail__toggle {
+    display: grid;
+    grid-template-columns: auto minmax(0, 1fr) auto;
+    align-items: center;
+    gap: 12px;
+    width: 100%;
+    min-height: 60px;
+    padding: 12px 16px;
+    border: 0;
+    border-radius: 7px;
+    background: none;
+    text-align: left;
+    font: inherit;
+    color: $color-text;
+    &:hover {
+      background: #e3edf8;
+    }
+    // The ring goes 6px inside the button: the second line is pulled 6px up into its box, and a
+    // ring outside it, or less far in, would cross or touch that line's first letters
+    .activity-rail &:focus-visible {
+      outline-offset: -6px;
+    }
+  }
+  .activity-rail__icon {
+    font-size: 20px;
+    color: $color-link;
+  }
+  .activity-rail__label,
+  .activity-rail__about {
+    text-wrap: balance; // "latest Sep 27" stays together on phones
+  }
+  .activity-rail__label {
+    font-size: 14.4px;
+    line-height: 1.45;
+    strong {
+      font-size: 16px;
+      color: $color-dark;
+    }
+  }
+  .activity-rail__toggle[aria-expanded="true"] .activity-rail__chevron {
+    transform: rotate(180deg);
+  }
+  .activity-rail__about {
+    margin: -6px 0 0;
+    padding: 0 16px 12px 48px; // under the label, past the icon
+    font-size: 14.4px;
+    line-height: 1.45;
+  }
+  // Without JavaScript, a plain heading over the open panel
+  .activity-rail__title {
+    padding: 14px 16px 0;
+  }
+  .activity-rail__body {
+    padding: 0 16px 16px;
+  }
+  .activity-rail__subtitle {
+    margin: 0;
+  }
+  .activity-rail .activity-filters {
+    margin-top: 8px;
+  }
+  .activity-rail .activity-filter {
+    min-height: 44px;
+    font-size: 14.4px;
+  }
+  .activity-rail__list {
+    padding-top: 16px;
+  }
+  .activity-rail__all {
+    margin-top: 4px;
+    background: #fff;
+  }
+}
+
+// 1200px and wider: the rail, in the news grid's right column
+@media (min-width: 1200px) {
+  .news-layout {
+    display: grid;
+    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
+    column-gap: 3rem;
+  }
+  .news-main {
+    grid-column: 1;
+    grid-row: 1;
+  }
+  // The rail runs the full height of the news column: its tinted panel fills what the head
+  // leaves, and the list inside it sticks
+  .activity-rail,
+  .activity-rail__body {
+    display: flex;
+    flex-direction: column;
+  }
+  .activity-rail {
+    grid-column: 2;
+    grid-row: 1;
+    --rail-surface: #{$color-light};
+    --rail-line: #{$color-border};
+    --rail-meta: #666;
+    --rail-dash: #cbd5e1;
+  }
+  .activity-rail__body,
+  .activity-rail__panel {
+    flex: 1 0 auto;
+  }
+  .activity-rail .activity-filters {
+    margin-top: 14px;
+  }
+  .activity-rail .activity-filter {
+    padding: 10px 0 11px;
+    font-size: 14px;
+  }
+  .activity-rail__panel {
+    margin-top: 16px;
+    border: 1px solid var(--rail-line);
+    border-radius: 8px;
+    background: var(--rail-surface);
+  }
+  .activity-rail__list {
+    padding: 20px 22px;
+    // A small label, as the heading has scrolled away once the list sticks. Screen readers
+    // skip it where the alternative text after "/" is supported.
+    &::before {
+      content: "Activity";
+      content: "Activity" / "";
+      display: block;
+    }
+  }
+  // It sticks 24px below the header when it fits, and otherwise by its bottom edge, 24px above
+  // the window's, so every part of it can be reached. --rail-h is the list's height, which the
+  // layout's script keeps; without JavaScript the list doesn't stick.
+  .js .activity-rail__list {
+    position: sticky;
+    top: min(calc(84px + var(--sponsor-bar-height, 0px) + 24px), calc(100vh - var(--rail-h, 0px) - 24px));
+    // While keyboard focus is inside, the list scrolls with the page, so the browser can bring
+    // the focused row into view; stuck by its bottom edge, its top rows can't be scrolled to. A
+    // click doesn't match :focus-visible, so nothing moves under the pointer.
+    &:has(:focus-visible) {
+      position: static;
+    }
+  }
+}
+
+// Phones: the summary on a line of its own, the filter on one line from a 390px viewport, and
+// each row's title link stretched over the row
+@media (max-width: 575.98px) {
+  .activity-rail__sep {
+    display: none;
+  }
+  .activity-rail__summary {
+    display: block;
+  }
+  .activity-rail .activity-filters {
+    column-gap: 10px;
+  }
+  .activity-rail-row__title::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+  }
+}
+
 /* Individual post article */
 .post-article {
   max-width: 760px;
diff --git a/pages/archives.md b/pages/archives.md
index f36cedb..9b2adf0 100755
--- a/pages/archives.md
+++ b/pages/archives.md
@@ -6,5 +6,3 @@ menu_item: true
 ---
 
 # News
-
-Announcements from QuantEcon: new projects, grants, people and workshops. For library releases and lecture updates, see [Activity](/activity/).