diff --git a/website/src/components/layout/nav.tsx b/website/src/components/layout/nav.tsx
index 80c81df..3d48502 100644
--- a/website/src/components/layout/nav.tsx
+++ b/website/src/components/layout/nav.tsx
@@ -54,7 +54,10 @@ export const Nav = () => (
           rel="noopener noreferrer"
           className="inline-flex h-[38px] items-center gap-1.5 rounded-md border border-hairline px-2.5 font-mono text-xs text-secondary hover:border-line hover:bg-[var(--bg-selection)] hover:text-primary sm:h-8"
         >
-          GitHub <span aria-hidden="true">↗</span>
+          GitHub
+          <span aria-hidden="true" className="text-[0.85em] opacity-60">
+            ↗
+          </span>
         </a>
         <ThemeToggle />
       </div>
diff --git a/website/src/components/ui/button.tsx b/website/src/components/ui/button.tsx
index 94166a9..bae2bd6 100644
--- a/website/src/components/ui/button.tsx
+++ b/website/src/components/ui/button.tsx
@@ -38,6 +38,11 @@ const isExternal = (href: string): boolean => /^https?:\/\//.test(href)
  * rather than a `<button>`. External links open in a new tab and carry
  * `rel="noopener"`; internal ones route through React Router so navigation
  * stays client-side.
+ *
+ * The leaving-the-site mark is drawn by the component, never typed into a
+ * label. Hand-written "GitHub ↗" put the same glyph in thirteen strings and
+ * made it copy — it belongs to the control, so the control renders it, once,
+ * and only when the link actually leaves.
  */
 export const Button = ({ href, variant, size, children, className }: ButtonProps) => {
   const classes = cn(buttonVariants({ variant, size }), className)
@@ -46,6 +51,9 @@ export const Button = ({ href, variant, size, children, className }: ButtonProps
     return (
       <a href={href} target="_blank" rel="noopener noreferrer" className={classes}>
         {children}
+        <span aria-hidden="true" className="text-[0.85em] opacity-60">
+          ↗
+        </span>
       </a>
     )
 
diff --git a/website/src/components/ui/feature-card.tsx b/website/src/components/ui/feature-card.tsx
index 815e8f9..da09d90 100644
--- a/website/src/components/ui/feature-card.tsx
+++ b/website/src/components/ui/feature-card.tsx
@@ -61,15 +61,18 @@ export const FeatureCard = ({
       className,
     )}
   >
-    <div className="flex items-center gap-3">
+    {/* The glyph sits in the line like a prompt marker, not in a chip. A
+        tinted rounded square around an icon is the stock feature-card
+        treatment; here the terminal already gives us a better idiom. */}
+    <div className="flex items-center gap-2.5">
       {glyph !== undefined && (
-        <div
+        <span
           aria-hidden="true"
-          className="flex size-[34px] shrink-0 items-center justify-center rounded-md border border-hairline text-xl leading-none"
+          className="shrink-0 text-lg leading-none"
           style={color !== undefined ? { color } : undefined}
         >
           {glyph}
-        </div>
+        </span>
       )}
       <div className="text-[15px] font-medium text-primary">{title}</div>
     </div>
diff --git a/website/src/components/ui/panel.tsx b/website/src/components/ui/panel.tsx
index 2460e59..da0dac4 100644
--- a/website/src/components/ui/panel.tsx
+++ b/website/src/components/ui/panel.tsx
@@ -37,12 +37,16 @@ interface CalloutProps {
   className?: string
 }
 
-/** An aside with a coloured left rule. `warn` carries the tape amber. */
+/**
+ * An aside. `warn` carries the tape amber.
+ *
+ * The tone lives in the label, not in a coloured left rule — one ribbon per
+ * card is decoration, and the label was already saying the same thing twice.
+ */
 export const Callout = ({ title, tone = 'accent', children, className }: CalloutProps) => (
   <div
     className={cn(
-      'rounded-md border border-hairline border-l-[3px] bg-panel px-[18px] py-5 sm:px-[22px]',
-      tone === 'warn' ? 'border-l-warning' : 'border-l-accent',
+      'rounded-md border border-hairline bg-panel px-[18px] py-5 sm:px-[22px]',
       '[&>p]:leading-[25px] [&>p]:text-secondary',
       className,
     )}
diff --git a/website/src/pages/community.tsx b/website/src/pages/community.tsx
index 6edc532..50e4c99 100644
--- a/website/src/pages/community.tsx
+++ b/website/src/pages/community.tsx
@@ -159,9 +159,9 @@ export const Community = () => {
             </p>
             <div className="mt-1 flex flex-wrap gap-2 sm:gap-3">
               <Button href={LINKS.issues} variant="accent">
-                Open an issue ↗
+                Open an issue
               </Button>
-              <Button href={LINKS.gh}>GitHub ↗</Button>
+              <Button href={LINKS.gh}>GitHub</Button>
             </div>
           </Prose>
           <Terminal
@@ -226,7 +226,7 @@ export const Community = () => {
               <div className="flex flex-wrap gap-2 sm:gap-3">
                 {alt.links.map((link) => (
                   <Button key={link.label} href={link.href}>
-                    {link.label} ↗
+                    {link.label}
                   </Button>
                 ))}
               </div>
@@ -247,7 +247,7 @@ export const Community = () => {
             </p>
             <div className="mt-1 flex flex-wrap gap-2 sm:gap-3">
               <Button href={LINKS.license} variant="accent">
-                Read the license ↗
+                Read the license
               </Button>
             </div>
           </div>
diff --git a/website/src/pages/docs.tsx b/website/src/pages/docs.tsx
index a8bccaf..42dab38 100644
--- a/website/src/pages/docs.tsx
+++ b/website/src/pages/docs.tsx
@@ -187,7 +187,7 @@ export const Docs = () => {
               <Code>portmap</Code> tests whether your router will let peers connect back,
               worth running once.{' '}
               <Link to="/install" className="text-link hover:text-link-hover">
-                More on being reachable →
+                More on being reachable
               </Link>
             </p>
           </Prose>
@@ -214,10 +214,10 @@ export const Docs = () => {
             </Prose>
             <div className="flex flex-wrap gap-2 sm:gap-3">
               <Button href={LINKS.gh} variant="accent">
-                README ↗
+                README
               </Button>
-              <Button href={LINKS.docsrs}>docs.rs ↗</Button>
-              <Button href={LINKS.changelog}>Changelog ↗</Button>
+              <Button href={LINKS.docsrs}>docs.rs</Button>
+              <Button href={LINKS.changelog}>Changelog</Button>
             </div>
           </Cols>
         </Panel>
diff --git a/website/src/pages/home.tsx b/website/src/pages/home.tsx
index 78b74ec..51be5ce 100644
--- a/website/src/pages/home.tsx
+++ b/website/src/pages/home.tsx
@@ -117,8 +117,7 @@ export const Home = () => {
             </div>
             <p className="text-lg leading-[29px] text-pretty text-secondary max-md:hidden">
               Search the network, share your files, browse someone&rsquo;s collection, join
-              a room. It runs over ssh on the machine where your music already lives, and
-              it&rsquo;s blazingly fast Rust 🦀.
+              a room. It runs over ssh on the machine where your music already lives.
             </p>
             <div className="flex flex-wrap items-center justify-between gap-x-5 gap-y-3 sm:gap-y-4">
               <div className="flex flex-wrap items-center gap-2 max-md:w-full max-md:justify-center sm:gap-3">
@@ -126,7 +125,7 @@ export const Home = () => {
                   Install
                 </Button>
                 <Button href="/docs">Read the docs</Button>
-                <Button href={LINKS.gh}>GitHub ↗</Button>
+                <Button href={LINKS.gh}>GitHub</Button>
               </div>
               <CommandPill text="cargo install soulseek-rs" />
             </div>
@@ -206,7 +205,7 @@ export const Home = () => {
                 Reach for <Code>soulseek-rs-lib</Code> to build a custom client or an agent
                 on the protocol directly.{' '}
                 <Link to="/install" className="text-link hover:text-link-hover">
-                  Use the library →
+                  Use the library
                 </Link>
               </p>
             </Callout>
@@ -217,7 +216,7 @@ export const Home = () => {
                 <Code>message</Code>, <Code>portmap</Code>. Point cron, a script, or an
                 agent at them and read the output back. No daemon, no API to stand up.{' '}
                 <Link to="/docs" className="text-link hover:text-link-hover">
-                  See the commands →
+                  See the commands
                 </Link>
               </p>
             </Callout>
@@ -231,14 +230,21 @@ export const Home = () => {
           shell, so the same client works for scripting, cron jobs, and agents driving it
           programmatically.
         </SectionHead>
-        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
-          {FEATURES.map((feature) => (
+        {/*
+          Three up, not four, with search spanning two of them: it's the thing
+          the client is for, and eight cards at identical weight said the
+          opposite. Eight items plus that one double = nine cells, so the grid
+          still comes out square.
+        */}
+        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
+          {FEATURES.map((feature, i) => (
             <FeatureCard
               key={feature.title}
               glyph={feature.glyph}
               color={feature.color}
               title={feature.title}
               cmd={feature.cmd}
+              className={i === 0 ? 'lg:col-span-2' : ''}
             >
               {feature.body}
             </FeatureCard>
diff --git a/website/src/pages/install.tsx b/website/src/pages/install.tsx
index ecf0c95..c5dc603 100644
--- a/website/src/pages/install.tsx
+++ b/website/src/pages/install.tsx
@@ -122,7 +122,7 @@ export const Install = () => {
               opens.
             </p>
             <div className="flex flex-wrap gap-2 sm:gap-3">
-              <Button href={LINKS.releases}>Prebuilt binaries ↗</Button>
+              <Button href={LINKS.releases}>Prebuilt binaries</Button>
             </div>
             <p className="text-[13px] text-muted">
               No Rust toolchain? Grab a prebuilt archive for your platform from the{' '}