mobile: per-view ≤480px rules across the CSS bundle

Adds the @media (max-width: 480px) blocks specified in the design:

- dashboard.css: indicator table hides the 'mobile-hide'-tagged
  columns (Label, Ccy, 1y, anchor, as-of), keeping Symbol / Price /
  1d / 1m. Cell padding + font shrink. Group-tab buttons get a
  bigger touch target.
- panels.css: header padding tightens, scroll-body max-height drops
  to 60vh so log/news stay above the fold in the stacked layout.
- portfolio.css: overall grid keeps 2 cols (already at 640px) with
  tighter gap; action buttons wrap; composer input goes full-width.
- log-chat.css: chat bubbles edge-to-edge, input row stacks, font-
  size:14px on form fields to avoid iOS Safari zoom-on-focus.
- news.css: row collapses to age | (title / source) — source moves
  under the title. Tag filter strip wraps.
- settings.css: form rows stack (label above input). Import picker
  becomes single-column. Buttons full-width.
- auth.css: card padding tightens to free up vertical space when the
  iOS keyboard is up. font-size:14px on inputs.
- public.css: hero headline clamp() lower bound drops to 22px; CTAs
  stack full-width; pricing tier-grid stacks.

indicators.html: tagged the secondary cells with .mobile-hide rather
than relying on positional nth-child — the anchor column is
conditional and would have shifted positions.

336 tests still pass.

app/static/css/log-chat.css

@@ -280,3 +280,46 @@
 }
 .chat-form button:hover:not(:disabled) { background: var(--accent); color: var(--bg); }
 .chat-form button:disabled { opacity: 0.4; cursor: not-allowed; }
+
+
+/* --- Mobile (≤480px) -------------------------------------------------- */
+
+@media (max-width: 480px) {
+  /* Trim horizontal padding so the markdown column uses the screen
+     width. The existing 1100px rule already capped the column at
+     76ch; we just shave the surrounding gutter. */
+  .log-content { padding: 0 4px; font-size: 13.5px; }
+  .log-content h2 { font-size: 16px; }
+  .log-content h3 { font-size: 14px; }
+
+  /* Chat bubbles edge-to-edge so the conversation reads like a
+     mobile messenger thread. */
+  .chat-msg {
+    max-width: 100%;
+    padding: 8px 10px;
+    font-size: 13px;
+  }
+  .chat-msg--user { margin-right: 0; }
+  .chat-msg--assistant { margin-left: 0; }
+
+  /* Chat input row stacks: textarea full-width, button below. */
+  .chat-form {
+    flex-direction: column;
+    gap: 6px;
+    padding: 8px;
+  }
+  .chat-form textarea {
+    width: 100%;
+    min-height: 56px;
+    font-size: 14px;        /* avoids iOS Safari zoom-on-focus */
+  }
+  .chat-form button {
+    width: 100%;
+    padding: 10px;
+    font-size: 12px;
+  }
+
+  .chat-header { padding: 8px 10px; }
+  .chat-title { font-size: 12px; }
+  .chat-hint { font-size: 10px; }
+}