feat(mnemosyne): Add connection panel HTML + CSS

- Panel container in index.html after memory-inspect-panel
- Full CSS styles matching Mnemosyne aesthetic
- Slide-in from right, positioned next to inspect panel
- Connected memories list with navigate/remove actions
- Suggested memories with add-connection button
- Hover highlight state for 3D crystal feedback

index.html

@@ -477,6 +477,10 @@ index.html
   <div id="memory-inspect-panel" class="memory-inspect-panel" style="display:none;" aria-label="Memory Inspect Panel">
   </div>
 
+  <!-- Memory Connections Panel (Mnemosyne) -->
+  <div id="memory-connections-panel" class="memory-connections-panel" style="display:none;" aria-label="Memory Connections Panel">
+  </div>
+
 <script>
 // ─── MNEMOSYNE: Memory Filter Panel ───────────────────
 function openMemoryFilter() {

style.css

@@ -1917,3 +1917,163 @@ canvas#nexus-canvas {
   background: rgba(74, 240, 192, 0.18);
   border-color: #4af0c0;
 }
+
+/* ═══ MNEMOSYNE: Memory Connections Panel ═══ */
+.memory-connections-panel {
+  position: fixed;
+  top: 50%;
+  right: 280px;
+  transform: translateY(-50%) translateX(12px);
+  width: 260px;
+  max-height: 70vh;
+  background: rgba(10, 12, 18, 0.92);
+  border: 1px solid rgba(74, 240, 192, 0.15);
+  border-radius: 8px;
+  box-shadow: 0 8px 32px rgba(0,0,0,0.5);
+  z-index: 310;
+  display: flex;
+  flex-direction: column;
+  opacity: 0;
+  transition: opacity 0.2s ease, transform 0.2s ease;
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  font-family: var(--font-mono, monospace);
+}
+.memory-connections-panel.mc-visible {
+  opacity: 1;
+  transform: translateY(-50%) translateX(0);
+}
+
+.mc-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px 14px;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+}
+.mc-title {
+  color: rgba(74, 240, 192, 0.8);
+  font-size: 11px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+.mc-close {
+  background: none;
+  border: none;
+  color: rgba(255, 255, 255, 0.4);
+  font-size: 14px;
+  cursor: pointer;
+  padding: 2px 6px;
+  border-radius: 4px;
+  line-height: 1;
+}
+.mc-close:hover {
+  color: #fff;
+  background: rgba(255, 255, 255, 0.1);
+}
+
+.mc-section {
+  padding: 8px 14px 10px;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
+}
+.mc-section:last-child { border-bottom: none; }
+
+.mc-section-label {
+  color: rgba(74, 240, 192, 0.5);
+  font-size: 9px;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  margin-bottom: 8px;
+}
+
+.mc-conn-list, .mc-suggest-list {
+  max-height: 200px;
+  overflow-y: auto;
+}
+.mc-conn-list::-webkit-scrollbar, .mc-suggest-list::-webkit-scrollbar { width: 3px; }
+.mc-conn-list::-webkit-scrollbar-thumb, .mc-suggest-list::-webkit-scrollbar-thumb {
+  background: rgba(74, 240, 192, 0.15);
+  border-radius: 2px;
+}
+
+.mc-conn-item, .mc-suggest-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 8px;
+  border-radius: 5px;
+  margin-bottom: 4px;
+  transition: background 0.15s ease;
+}
+.mc-conn-item:hover {
+  background: rgba(74, 240, 192, 0.06);
+}
+.mc-suggest-item:hover {
+  background: rgba(123, 92, 255, 0.06);
+}
+
+.mc-conn-info, .mc-suggest-info {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+}
+.mc-conn-label, .mc-suggest-label {
+  display: block;
+  color: var(--color-text, #ccc);
+  font-size: 11px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.mc-conn-meta, .mc-suggest-meta {
+  display: block;
+  color: rgba(255, 255, 255, 0.3);
+  font-size: 9px;
+  margin-top: 1px;
+}
+
+.mc-conn-actions {
+  display: flex;
+  gap: 4px;
+  flex-shrink: 0;
+  margin-left: 8px;
+}
+
+.mc-btn {
+  background: none;
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  color: rgba(255, 255, 255, 0.5);
+  cursor: pointer;
+  border-radius: 4px;
+  font-size: 12px;
+  padding: 2px 6px;
+  line-height: 1;
+  transition: all 0.15s ease;
+}
+.mc-btn-nav:hover {
+  border-color: #4af0c0;
+  color: #4af0c0;
+  background: rgba(74, 240, 192, 0.08);
+}
+.mc-btn-remove:hover {
+  border-color: #ff4466;
+  color: #ff4466;
+  background: rgba(255, 68, 102, 0.08);
+}
+.mc-btn-add {
+  border-color: rgba(123, 92, 255, 0.3);
+  color: rgba(123, 92, 255, 0.7);
+}
+.mc-btn-add:hover {
+  border-color: #7b5cff;
+  color: #7b5cff;
+  background: rgba(123, 92, 255, 0.12);
+}
+
+.mc-empty {
+  color: rgba(255, 255, 255, 0.25);
+  font-size: 11px;
+  font-style: italic;
+  padding: 4px 0;
+}