diff --git a/package.json b/package.json
index 354e898..bbb32c7 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "siteforge",
   "private": true,
-  "version": "2.0.21",
+  "version": "2.0.22",
   "type": "module",
   "scripts": {
     "dev": "vite",
diff --git a/src/App.css b/src/App.css
index 1464201..77f8d75 100644
--- a/src/App.css
+++ b/src/App.css
@@ -9879,22 +9879,15 @@
 .nuggets-platform-links { display: flex; gap: 0.9rem; flex-wrap: wrap; }
 
 .section-nuggets-body { padding: 2.5rem 1.5rem 4rem; }
-.nuggets-body-layout { display: grid; grid-template-columns: minmax(280px, 360px) 1fr; gap: 3rem; align-items: start; }
-.nuggets-body-col { min-width: 0; }
 
-.nuggets-hosts-list { display: flex; flex-direction: column; gap: 1.25rem; margin-top: 1.5rem; }
-.nuggets-host-card { display: flex; flex-direction: column; background: rgba(26, 26, 21, 0.9); border: 1px solid rgba(201, 168, 76, 0.18); border-radius: 12px; padding: 1.25rem 1.5rem; }
-.nuggets-host-card-header { display: flex; align-items: center; gap: 0.9rem; }
-.nuggets-host-card-img { width: 52px; height: 52px; object-fit: cover; border-radius: 50%; flex-shrink: 0; border: 2px solid rgba(201, 168, 76, 0.3); }
-.nuggets-host-card-meta { display: flex; flex-direction: column; }
-.nuggets-host-card-name { font-family: var(--brand-font-heading); font-size: 1.05rem; color: #e8d9b5; margin: 0; }
-.nuggets-host-card-role { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--brand-gold); opacity: 0.85; margin: 0.2rem 0 0; }
-.nuggets-host-card-bio { font-size: 0.875rem; color: var(--brand-muted); line-height: 1.6; margin: 0.875rem 0 0; }
-.nuggets-host-card--link { text-decoration: none; cursor: pointer; transition: border-color 0.18s, box-shadow 0.18s, transform 0.18s; }
-.nuggets-host-card--link:hover { border-color: rgba(201, 168, 76, 0.45); box-shadow: 0 4px 18px rgba(0,0,0,0.28); transform: translateY(-2px); }
-.nuggets-host-card--link .nuggets-host-card-name { color: #e8d9b5; }
-.nuggets-host-card-cta { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--brand-gold); margin: 0.9rem 0 0; opacity: 0.75; transition: opacity 0.15s; }
-.nuggets-host-card--link:hover .nuggets-host-card-cta { opacity: 1; }
+.nuggets-hosts-row-wrap { margin-bottom: 2.5rem; }
+.nuggets-hosts-row { display: flex; flex-wrap: wrap; gap: 1rem; }
+.nuggets-host-pill { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; background: rgba(26, 26, 21, 0.9); border: 1px solid rgba(201, 168, 76, 0.18); border-radius: 40px; padding: 0.45rem 1rem 0.45rem 0.45rem; transition: border-color 0.18s, box-shadow 0.18s, transform 0.15s; }
+.nuggets-host-pill:hover { border-color: rgba(201, 168, 76, 0.45); box-shadow: 0 3px 14px rgba(0,0,0,0.25); transform: translateY(-1px); }
+.nuggets-host-pill-img { width: 40px; height: 40px; object-fit: cover; border-radius: 50%; border: 2px solid rgba(201, 168, 76, 0.3); flex-shrink: 0; }
+.nuggets-host-pill-name { font-family: var(--brand-font-heading); font-size: 0.95rem; color: #e8d9b5; white-space: nowrap; }
+
+.nuggets-episodes-full { margin-top: 0; }
 
 .nuggets-host-detail-layout { display: grid; grid-template-columns: 240px 1fr; gap: 3.5rem; align-items: start; padding-top: 0.5rem; }
 .nuggets-host-detail-photo-col { display: flex; justify-content: center; }
@@ -9916,10 +9909,6 @@
 .nuggets-latest-episode-desc { color: var(--brand-muted); line-height: 1.55; margin: 0 0 1rem; }
 .nuggets-episode-list { margin-top: 2rem; }
 
-@media (max-width: 800px) {
-  .nuggets-body-layout { grid-template-columns: 1fr; }
-}
-
 .breadcrumb {
   font-size: 0.85rem;
   color: var(--brand-muted);
diff --git a/src/App.tsx b/src/App.tsx
index 20ae1f6..3dfde07 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1926,31 +1926,22 @@ function NuggetsPage({ content }: { content: SiteContent }) {
       )}
 
       <section className="section-nuggets-body" aria-label={`${nuggets.title} hosts and episodes`}>
-        <div className="section-inner nuggets-body-layout">
-          <div className="nuggets-body-col nuggets-body-hosts">
-            {activeHosts.length > 0 && (
-              <>
-                <p className="eyebrow">Meet the Hosts</p>
-                <div className="nuggets-hosts-list">
-                  {activeHosts.map(host => (
-                    <Link key={host.id} to={`/nuggets/hosts/${host.id}`} className="nuggets-host-card nuggets-host-card--link">
-                      <div className="nuggets-host-card-header">
-                        {host.imageUrl && <img src={host.imageUrl} alt={host.name} className="nuggets-host-card-img" loading="lazy" />}
-                        <div className="nuggets-host-card-meta">
-                          <h3 className="nuggets-host-card-name">{host.name}</h3>
-                          {host.role && <p className="nuggets-host-card-role">{host.role}</p>}
-                        </div>
-                      </div>
-                      {host.bio && <p className="nuggets-host-card-bio">{host.bio}</p>}
-                      <p className="nuggets-host-card-cta">View Profile →</p>
-                    </Link>
-                  ))}
-                </div>
-              </>
-            )}
-          </div>
+        <div className="section-inner">
+          {activeHosts.length > 0 && (
+            <div className="nuggets-hosts-row-wrap">
+              <p className="eyebrow" style={{ marginBottom: '1rem' }}>Meet the Hosts</p>
+              <div className="nuggets-hosts-row">
+                {activeHosts.map(host => (
+                  <Link key={host.id} to={`/nuggets/hosts/${host.id}`} className="nuggets-host-pill">
+                    {host.imageUrl && <img src={host.imageUrl} alt={host.name} className="nuggets-host-pill-img" loading="lazy" />}
+                    <span className="nuggets-host-pill-name">{host.name}</span>
+                  </Link>
+                ))}
+              </div>
+            </div>
+          )}
 
-          <div className="nuggets-body-col nuggets-body-episodes">
+          <div className="nuggets-episodes-full">
             <p className="eyebrow">Episodes</p>
             {loading ? (
               <p className="nuggets-episodes-note">Loading episodes…</p>