Swap "Ketchup" for 🍅 and the username for 👤 to save horizontal
space on narrow viewports. Both links retain aria-labels for
accessibility. Simplify related CSS now that the items are icons.

https://claude.ai/code/session_01TfeEX8ySJ9sRCi4gyXQzkb

diff --git a/lib/ketchup/views/layout.rb b/lib/ketchup/views/layout.rb
index 134c379..f67cbda 100644
--- a/lib/ketchup/views/layout.rb
+++ b/lib/ketchup/views/layout.rb
@@ -51,14 +51,14 @@ module Views
         end
         body do
           header(class: "site-header") do
-            a(href: "/", class: "site-name") { "Ketchup" }
+            a(href: "/", class: "site-name", aria_label: "Ketchup home") { "🍅" }
             nav(class: "site-nav") do
               a(
                 href: "/series/new",
                 class: ["header-action", ("header-action--active" if @active_view == :new)]
               ) { "+New" }
             end
-            a(href: "/users/#{@current_user[:id]}", class: "header-user") { @current_user[:login] }
+            a(href: "/users/#{@current_user[:id]}", class: "header-user", aria_label: @current_user[:login]) { "👤" }
           end
           yield
           render_footer
diff --git a/public/css/app.css b/public/css/app.css
index e71d42a..de678ae 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -42,7 +42,7 @@ h2 { font-size: var(--step-0); font-weight: 600; }
 
 .site-header {
   display: flex;
-  align-items: baseline;
+  align-items: center;
   gap: var(--space-s);
   padding: var(--space-xs) var(--space-l);
   font-size: var(--step--1);
@@ -50,9 +50,6 @@ h2 { font-size: var(--step-0); font-weight: 600; }
 }
 
 .site-name {
-  font-weight: 600;
-  font-size: var(--step--1);
-  letter-spacing: 0.03em;
   text-decoration: none;
 }
 
@@ -60,7 +57,7 @@ h2 { font-size: var(--step-0); font-weight: 600; }
   flex: 1;
   display: flex;
   justify-content: center;
-  align-items: baseline;
+  align-items: center;
   gap: var(--space-s);
 }
 
@@ -81,14 +78,7 @@ h2 { font-size: var(--step-0); font-weight: 600; }
 }
 
 .header-user {
-  color: #888;
   text-decoration: none;
-  letter-spacing: 0.03em;
-}
-
-.header-user:hover {
-  color: #222;
-  font-weight: 600;
 }
 
 /* -------------------- */