fix(downloads): automatic really is automatic, and a selection downloads all of it

Two bugs in what shipped last, and both were mine.

Automatic mode still opened Save As, because with no folder granted the
code fell through to the file picker — while the documentation said it
would use the browser's own download folder. It does that now. Over
512 MB it still asks, since getting there means holding the file in
memory and a tab will not survive a 40 GB blob; Settings is where to stop
it asking again.

Selecting two files downloaded one. They were started without awaiting,
so each asked the browser for a save dialog at once, and a browser allows
exactly one — the rest were rejected and the errors went nowhere. They
are awaited one at a time now, which serializes the dialogs and not the
transfers: each call returns as soon as its transfer is registered.

Then the adjustments. The transfers widget offers Open on a finished
download that went into a granted folder — the bytes go to a new tab, and
that is the whole of what a page can do: no browser lets one start a
desktop application or show a file manager, so the folder half of that
request cannot be built and the guide says so.

The Files toolbar was four controls of three different heights in a row.
It is three groups now — what you can add, where you are, what you can do
with what is here — on one baseline, with icons from the set and a gap
between the dots and the word Actions. Chat comes first among the tabs
and is the one you land on. The three Discover entries in the sidebar
have icons. And a link in a chat message becomes a link: built as an
element and never as markup, http and https only, so `javascript:` is not
one message away from running here.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

1 files changed, 76 insertions, 7 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/style.css b/packages/meshbay-hub/src/meshbay_hub/static/style.css
index 2296b2d..851c07e 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/style.css
+++ b/packages/meshbay-hub/src/meshbay_hub/static/style.css
@@ -546,14 +546,77 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
 
 /* ── File toolbar ────────────────────────────────────────────────────────── */
 
+/* One bar, three groups: what you can add on the left, where you are in the
+   middle, what you can do with what is here on the right. It used to be four
+   controls of three different heights sitting in a row. */
 .file-toolbar {
   display: flex;
   align-items: center;
-  justify-content: space-between;
-  gap: 12px;
+  gap: 10px;
   margin-bottom: 12px;
+  padding: 8px;
+  background: var(--bg-raised);
+  border: 1px solid var(--border);
+  border-radius: 8px;
   flex-wrap: wrap;
 }
+.toolbar-group { display: flex; align-items: center; gap: 6px; }
+.toolbar-group.right { margin-left: auto; }
+
+.tb-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;               /* the icon and the word are not the same word */
+  height: 32px;
+  padding: 0 11px;
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  background: var(--bg-surface);
+  color: var(--text);
+  font-size: 0.83em;
+  white-space: nowrap;
+  cursor: pointer;
+  transition: border-color 0.12s, color 0.12s, background 0.12s;
+}
+.tb-btn:hover { border-color: var(--accent); color: var(--accent); }
+.tb-btn:disabled { opacity: 0.45; cursor: not-allowed; }
+.tb-btn:disabled:hover { border-color: var(--border); color: var(--text); }
+.tb-btn .icon { width: 15px; height: 15px; }
+.tb-btn.primary {
+  background: var(--accent);
+  border-color: var(--accent);
+  color: var(--accent-text);
+}
+.tb-btn.primary:hover { background: var(--accent-hover); color: var(--accent-text); }
+.tb-btn.active {
+  background: color-mix(in srgb, var(--accent) 12%, var(--bg-surface));
+  border-color: var(--accent);
+  color: var(--accent);
+}
+
+/* The filter is a field, not a button, and should not pretend otherwise. */
+.tb-search {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  height: 32px;
+  padding: 0 10px;
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  background: var(--bg-surface);
+  color: var(--text-dim);
+}
+.tb-search:focus-within { border-color: var(--border-focus); }
+.tb-search .icon { width: 14px; height: 14px; flex-shrink: 0; }
+.tb-search input {
+  border: none;
+  background: none;
+  outline: none;
+  padding: 0;
+  width: 150px;
+  font-size: 0.83em;
+  color: var(--text);
+}
 
 .breadcrumbs {
   display: flex;
@@ -564,6 +627,8 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
   flex-wrap: wrap;
 }
 .crumb {
+  display: inline-flex;
+  align-items: center;
   cursor: pointer;
   color: var(--accent);
   padding: 2px 4px;
@@ -572,11 +637,6 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
 .crumb:hover { background: var(--bg-raised); text-decoration: none; }
 .crumb-sep { color: var(--text-dim); }
 
-.file-search {
-  max-width: 220px;
-  padding: 6px 10px !important;
-  font-size: 0.85em !important;
-}
 
 /* ── File table ──────────────────────────────────────────────────────────── */
 
@@ -1190,6 +1250,15 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
 .settings-choice strong { display: block; font-size: 0.88em; color: var(--text); }
 .settings-choice .settings-hint { display: block; margin-top: 2px; }
 
+/* A pasted address can be longer than the bubble; breaking it is better than
+   a message that scrolls sideways. */
+.chat-link {
+  color: var(--accent);
+  text-decoration: underline;
+  word-break: break-all;
+}
+.chat-bubble-own .chat-link { color: inherit; }
+
 /* ── Transfers widget ────────────────────────────────────────────────────── */
 
 .transfer-wrap { position: relative; display: flex; align-items: center; }