ui: share view in the shell, icon rail, phone polish

- shared view uses the bar, porthole and status band; outline gets its own
  window on wide screens; j/k, gg/G, Ctrl-d/u scroll with a vim-style ruler
- rail doors are line icons in groups with hover tooltips and keycaps
- phone: number-only space pills, no nested rims, icon dock, toast messages,
  back button and one-line meta in the document header
- keycaps (.kbd) wherever keys are shown, styled scrollbars in Chrome,
  outline tracks position on jumps, breakpoints unified at 767px

web/src/lib/Sidebar.svelte

@@ -67,7 +67,11 @@
       </li>
     {:else}
       <li class="empty muted">
-        {workspace.query ? 'no matches' : 'nothing here yet — o writes, O makes a folder'}
+        {#if workspace.query}
+          no matches
+        {:else}
+          nothing here yet — <span class="kbd">o</span> writes, <span class="kbd">⇧ O</span> makes a folder
+        {/if}
       </li>
     {/each}
   </ul>