The icon is not wired up yet; /search still works by URL. Also tightens the bottom padding and widens the user hover.

Assisted-by: Claude Opus 5.5 via Claude Code

diff --git a/assets/docket.css b/assets/docket.css
index 05fe7f2..f1439ba 100644
--- a/assets/docket.css
+++ b/assets/docket.css
@@ -31,15 +31,18 @@ button { font: inherit; color: inherit; }
 .badge.success { color: var(--gl-color-success); }
 
 /* ── mailboxes ── */
-.side { padding: var(--gl-space-m) var(--gl-space-s); display: flex; flex-direction: column; gap: var(--gl-space-m); min-height: 0; overflow-y: auto; }
+.side { padding: var(--gl-space-m) var(--gl-space-s) var(--gl-space-2xs); display: flex; flex-direction: column; gap: var(--gl-space-m); min-height: 0; overflow-y: auto; }
+.brand-row { display: flex; justify-content: space-between; align-items: center; }
+.search-btn { all: unset; display: flex; cursor: pointer; color: var(--gl-color-text-tertiary); transition: color var(--gl-dur-fast) var(--gl-ease); }
+.search-btn:hover { color: var(--gl-color-text-primary); }
+.search-btn:focus-visible { outline: 2px solid var(--gl-color-accent); outline-offset: 2px; border-radius: 2px; }
 .brand { font: 600 var(--gl-step-0)/1.2 var(--gl-font-text); letter-spacing: -.01em; padding: 0 2px; }
 .nav { display: flex; flex-direction: column; gap: 2px; }
 .nav-item { display: flex; justify-content: space-between; align-items: baseline; padding: 7px 8px; margin: 0 -8px; border-radius: var(--gl-radius); color: inherit; text-decoration: none; transition: background var(--gl-dur-fast) var(--gl-ease); }
 .nav-item:hover { background: var(--gl-color-surface-fill-2); color: inherit; }
 .nav-item.on { background: var(--gl-color-surface-card); font-weight: 600; }
-.who { display: flex; flex-direction: column; gap: 3px; padding: 0 2px; }
-.who.ctrl { padding: 0; }
-.who-btn { all: unset; cursor: pointer; display: flex; flex-direction: column; gap: 3px; padding: 4px 2px; border-radius: var(--gl-radius); }
+.who { display: flex; flex-direction: column; gap: 3px; }
+.who-btn { all: unset; cursor: pointer; display: flex; flex-direction: column; gap: 3px; padding: 7px 8px; margin: 0 -8px; border-radius: var(--gl-radius); }
 .who-btn:hover { background: var(--gl-color-surface-fill-2); }
 .who-name { font-weight: 600; }
 .who-login { text-transform: none; letter-spacing: 0; color: var(--gl-color-text-tertiary); }
diff --git a/src/views.rs b/src/views.rs
index 7775b1a..71205cc 100644
--- a/src/views.rs
+++ b/src/views.rs
@@ -82,6 +82,9 @@ fn assignee_label(store: &Store, values: &Values) -> Option<String> {
     })
 }
 
+/// Lucide's search, at Gloss's icon weight.
+const SEARCH_ICON: &str = r#"<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>"#;
+
 /// Lucide's external-link, at Gloss's icon weight.
 const EXTERNAL_ICON: &str = r#"<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M15 3h6v6"/><path d="M10 14 21 3"/><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/></svg>"#;
 
@@ -116,16 +119,12 @@ fn back(here: &str) -> Markup {
 }
 
 fn sidebar(p: &Page<'_>) -> Markup {
-    let query = match p.view {
-        View::Search(q) => q.as_str(),
-        _ => "",
-    };
     let views = std::iter::once(View::ForMe).chain(State::LANES.map(View::Lane));
     html! {
         nav.side {
-            span.brand { "Docket" }
-            form action="/search" method="get" {
-                input.field type="search" name="q" placeholder="Search mail" value=(query) aria-label="Search mail";
+            div.brand-row {
+                span.brand { "Docket" }
+                button.search-btn type="button" aria-label="Search mail" { (PreEscaped(SEARCH_ICON)) }
             }
             div.nav {
                 @for view in views {