Index: src/views/partials/remote-actor.ejs
===================================================================
--- src/views/partials/remote-actor.ejs	(revision 3ceaef6e9590862b66c5019b361edfac9e1af4fe)
+++ src/views/partials/remote-actor.ejs	(revision ca260d13a940f7563a540fad1f1945ef28e9160c)
@@ -2,28 +2,43 @@
   Een PERSOON van een andere server: wie het is, en de knop om te volgen.
 
-  Zelfde reden als remote-object: de zoekbalk en /authorize_interaction laten
-  hetzelfde zien, dus staat het op één plek. Het volgen zelf gaat naar
-  /authorize_interaction/follow, want daar zit de poort van de guardians
-  (shaer-p729) en die hoort niet twee keer geschreven te worden.
+  Dezelfde kaart als een post (remote-object), zodat een profiel en een post in
+  de zoekbalk er als familie uitzien en niet als twee formulieren. Het volgen
+  zelf gaat naar /authorize_interaction/follow, want daar zit de poort van de
+  guardians (shaer-p729) en die hoort niet twee keer geschreven te worden.
 
-  Verwacht: actor (uit resolveRemoteActor). Optioneel: cancelUrl, siteTitle.
+  Verwacht: actor (uit resolveRemoteActor). Optioneel: compact (de
+  live-preview), siteTitle.
 %>
-<% const _annuleer = (typeof cancelUrl !== 'undefined' && cancelUrl) ? cancelUrl : '/'; %>
-<div class="remote-actor">
-  <% if (actor.actor_icon) { %>
-    <img class="remote-actor-icon" src="<%= actor.actor_icon %>" alt="" loading="lazy" width="48" height="48">
-  <% } %>
-  <p class="auth-interact-meta">
-    <%= t('fedi.follow_intro') %>
-    <a href="<%= actor.actor_url %>" rel="nofollow noopener" target="_blank"><strong><%= actor.actor_name %></strong></a>
-    <span class="fedi-handle"><%= actor.actor_handle %></span>
-  </p>
-</div>
-<form method="post" action="/authorize_interaction/follow" class="auth-interact-form">
-  <input type="hidden" name="uri" value="<%= actor.actor_uri %>">
-  <div class="auth-interact-actions">
-    <button type="submit" class="btn btn-primary"><%= t('fedi.follow_btn') %></button>
-    <a href="<%= _annuleer %>" class="btn"><%= t('comments.cancel') %></a>
-  </div>
-</form>
-<p class="auth-interact-note"><%= t('fedi.remote_as', { site: typeof siteTitle !== 'undefined' ? siteTitle : '' }) %></p>
+<%
+  const _compact = !!locals.compact;
+  const _initial = String(actor.actor_name || actor.actor_handle || '?').replace(/^@/, '').slice(0, 1).toUpperCase();
+%>
+<article class="rp-card rp-profile<%= _compact ? ' rp-compact' : '' %>">
+  <header class="rp-head">
+    <% if (actor.actor_icon) { %>
+      <img class="rp-avatar" src="<%= actor.actor_icon %>" alt="" width="56" height="56" loading="lazy">
+    <% } else { %>
+      <span class="rp-avatar rp-avatar-empty" aria-hidden="true"><%= _initial %></span>
+    <% } %>
+    <div class="rp-who">
+      <a class="rp-name" href="<%= actor.actor_url || actor.actor_uri %>" rel="nofollow noopener" target="_blank"><%= actor.actor_name || actor.actor_handle %></a>
+      <span class="rp-handle"><%= actor.actor_handle %></span>
+    </div>
+  </header>
+  <footer class="rp-actions">
+    <form method="post" action="/authorize_interaction/follow">
+      <input type="hidden" name="uri" value="<%= actor.actor_uri %>">
+      <button type="submit" class="rp-act rp-primary">
+        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><line x1="19" y1="8" x2="19" y2="14"/><line x1="22" y1="11" x2="16" y2="11"/></svg>
+        <span><%= t('fedi.follow_btn') %></span>
+      </button>
+    </form>
+    <a class="rp-act rp-src" href="<%= actor.actor_url || actor.actor_uri %>" target="_blank" rel="nofollow noopener" title="<%= t('fedi.view_profile') %>">
+      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7"/><path d="M7 7h10v10"/></svg>
+      <span class="rp-act-label"><%= t('fedi.profile_short') %></span>
+    </a>
+  </footer>
+</article>
+<% if (!_compact) { %>
+  <p class="rp-as"><%= t('fedi.remote_as', { site: typeof siteTitle !== 'undefined' ? siteTitle : '' }) %></p>
+<% } %>
