fix: Share dialog alignment, z-index, access menu colors, shared section

- Dialog right edge aligns with Share button area (right: 72px)
- z-index raised to 999 to prevent being hidden by other layers
- Max-height reduced to 65vh to fit viewport
- Access menu: !important dark background, proper option styling
- Sidebar Shared section now renders shared_pages dynamically
- board.py: shared_pages added to _sidebar_data() return

app/routers/board.py

@@ -196,8 +196,8 @@ def _sidebar_data(request: Request, owner: str = "", repo: str = "") -> dict:
     return {"workspace_name": ws_name, "workspace_initial": ws_name[0].upper() if ws_name else "B",
             "current_page": repo or "Dashboard", "last_edited": "now",
             "recent_pages": recent, "private_pages": private_items,
-            "favorite_pages": favorites, "user": user,
-            "workspace_key": ws_key}
+            "favorite_pages": favorites, "shared_pages": [],
+            "user": user, "workspace_key": ws_key}
 
 
 def _extract_ai_keywords(owner: str, repo: str, labels: list[dict], body: str = ""):

app/templates/base.html

@@ -161,7 +161,14 @@
         </div>
       </div>
       <div class="sidebar-section-items" x-show="sectionsOpen.shared" x-transition>
-        <ul class="sidebar-items"><li class="sidebar-item empty-hint"><span class="page-icon">👥</span><span class="page-name text-dim">No shared pages</span></li></ul>
+        <ul class="sidebar-items" data-section="shared">
+          {% for page in shared_pages %}
+            {{ render_tree_item(page) }}
+          {% endfor %}
+          {% if not shared_pages %}
+          <li class="sidebar-item empty-hint"><span class="page-icon">👥</span><span class="page-name text-dim">No shared pages</span></li>
+          {% endif %}
+        </ul>
       </div>
     </div>
 

static/css/app.css

@@ -2220,11 +2220,11 @@ input, select, textarea { font-family: inherit; color: inherit; }
 
 /* ═══════════ Share / Publish Dialog ═══════════ */
 .share-dialog {
-  position: absolute; top: calc(100% + 8px); right: 0;
-  width: 440px; max-height: 70vh; overflow-y: auto;
+  position: absolute; top: calc(100% + 8px); right: 72px;
+  width: 440px; max-height: 65vh; overflow-y: auto;
   background: #1F1F1F; border: 1px solid rgba(255,255,255,.08);
-  border-radius: 18px; box-shadow: 0 12px 48px rgba(0,0,0,0.6);
-  z-index: 200;
+  border-radius: 18px; box-shadow: 0 12px 48px rgba(0,0,0,0.7);
+  z-index: 999;
 }
 /* Header with tabs */
 .sd-header {
@@ -2300,10 +2300,16 @@ input, select, textarea { font-family: inherit; color: inherit; }
 .sd-access-btn:hover { background: rgba(255,255,255,.08); }
 .sd-access-menu {
   position: absolute; top: calc(100% + 2px); left: 0; right: 0;
-  background: #2A2A2A; border: 1px solid rgba(255,255,255,.08);
-  border-radius: 14px; box-shadow: 0 8px 24px rgba(0,0,0,0.5);
-  z-index: 210; padding: 4px 0;
+  background: #2A2A2A !important; border: 1px solid rgba(255,255,255,.12);
+  border-radius: 14px; box-shadow: 0 8px 24px rgba(0,0,0,0.6);
+  z-index: 999; padding: 4px 0;
 }
+.sd-access-option {
+  padding: 8px 14px; font-size: 13px; color: #fff;
+  cursor: pointer; display: flex; align-items: center; gap: 8px;
+}
+.sd-access-option:hover { background: rgba(255,255,255,.08); }
+.sd-access-option.active { background: rgba(35,131,226,.15); }
 
 /* Permissions */
 .sd-select-sm {