feat: keybar function captions + Ctrl+R/L/D, plus ⌨ shortcut cheat-sheet

keybar:
- add Ctrl+R (搜历史/\x12), Ctrl+L (重绘/\x0c), Ctrl+D (退出/\x04)
- each key now shows a short function caption under the glyph (self-documenting
  on touch where tooltips don't appear); 17 keys total
- test/keybar.test.ts updated to 17 keys

cheat-sheet (new public/shortcuts.ts):
- ⌨ toolbar button opens a grouped reference of common Claude Code shortcuts
  (general / editing / multiline / macOS / prefixes), each labeled with what it
  does; keys also on the bottom bar are tagged 键栏
- Esc / click-outside to close; styled card with sticky header + accent tags

216 tests green; tsc + build clean.

public/style.css

@@ -266,14 +266,18 @@ body {
 }
 #keybar button {
   flex: 1 0 auto;
-  min-width: 46px;
-  height: calc(var(--keybar-h) - 14px);
-  padding: 0 12px;
+  min-width: 50px;
+  height: calc(var(--keybar-h) - 12px);
+  padding: 0 10px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 1px;
   border: 1px solid var(--border);
   background: var(--surface-2);
   color: var(--text);
   font-family: var(--ui-font);
-  font-size: 13px;
   cursor: pointer;
   border-radius: 8px;
   transition:
@@ -283,6 +287,16 @@ body {
   -webkit-user-select: none;
   -webkit-touch-callout: none;
 }
+#keybar .kb-key {
+  font-size: 13px;
+  line-height: 1.1;
+}
+#keybar .kb-cap {
+  font-size: 9px;
+  line-height: 1;
+  color: var(--text-faint);
+  letter-spacing: 0.02em;
+}
 #keybar button:hover {
   background: var(--surface-3);
 }
@@ -300,6 +314,9 @@ body {
 #keybar button.keybar-btn-primary:hover {
   background: rgba(124, 140, 255, 0.26);
 }
+#keybar button.keybar-btn-primary .kb-cap {
+  color: rgba(205, 212, 255, 0.7);
+}
 
 /* ── Shared: overlays, cards, inputs, buttons ────────────────────── */
 .overlay {
@@ -457,9 +474,10 @@ body {
   text-align: center;
 }
 
-/* Dashboard + history share the centered-card look */
+/* Dashboard + history + shortcuts share the centered-card look */
 #dashboard,
-#historymodal {
+#historymodal,
+#shortcutsmodal {
   position: fixed;
   inset: 0;
   z-index: 1200;
@@ -472,7 +490,8 @@ body {
   backdrop-filter: blur(6px);
 }
 .dash-card,
-.hist-card {
+.hist-card,
+.sc-card {
   background: var(--surface-2);
   border: 1px solid var(--border-strong);
   border-radius: var(--radius-lg);
@@ -482,12 +501,60 @@ body {
   overflow-y: auto;
   box-shadow: var(--shadow);
 }
+.sc-card {
+  width: 540px;
+}
 .dash-title,
-.hist-title {
+.hist-title,
+.sc-title {
   padding: 14px 18px;
   font-weight: 600;
   color: #fff;
   border-bottom: 1px solid var(--border);
+  position: sticky;
+  top: 0;
+  background: var(--surface-2);
+}
+
+/* Shortcut cheat-sheet */
+.sc-group {
+  padding: 12px 18px 4px;
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: var(--accent);
+}
+.sc-row {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 6px 18px;
+}
+.sc-key {
+  flex: none;
+  min-width: 110px;
+  font-family: Menlo, Consolas, monospace;
+  font-size: 12px;
+  color: #fff;
+  background: var(--bg);
+  border: 1px solid var(--border-strong);
+  border-radius: 6px;
+  padding: 3px 8px;
+  text-align: center;
+}
+.sc-desc {
+  flex: 1 1 auto;
+  color: var(--text-dim);
+  font-size: 13px;
+}
+.sc-tag {
+  flex: none;
+  font-size: 10px;
+  color: var(--accent);
+  background: var(--accent-soft);
+  border-radius: 5px;
+  padding: 2px 6px;
 }
 .dash-row,
 .hist-row {