diff --git a/backend/app.py b/backend/app.py
index 0322ffc0a..e4826310f 100644
--- a/backend/app.py
+++ b/backend/app.py
@@ -81,16 +81,24 @@
     validate_jwt_secret,
     is_production_mode
 )
+
+
+
+
 from password_reset_service import (
     FORGOT_PASSWORD_MESSAGE,
     request_password_reset,
     reset_password_with_token,
 )
+
+
+
 from email_service import (
     build_password_reset_url,
     is_email_configured,
     send_password_reset_email,
 )
+
 from collections import defaultdict, deque
 from math import ceil
 from time import time
@@ -1711,9 +1719,13 @@ def sync_library(validated_data):
 # immediately responds with an active session ready to go.
 # =========================================================================
 @app.route('/api/v1/register', methods=['POST'])
+
+
+
 @limiter.limit("5 per 10 seconds")
 @validate_schema(RegisterRequest)
 def register(validated_data):
+
     """Register a new user and return JWT token."""
     try:
         
diff --git a/backend/middleware.py b/backend/middleware.py
index c6f08d189..784281da5 100644
--- a/backend/middleware.py
+++ b/backend/middleware.py
@@ -15,6 +15,7 @@
 except ImportError:
     from error_responses import invalid_json_error
     from security_parsers import DEFAULT_ALLOWED_CONTENT_TYPES, validate_content_type as _validate_content_type_header
+   
 
 logger = logging.getLogger(__name__)
 
@@ -177,6 +178,8 @@ def decorated_function(*args, **kwargs):
         return decorated_function
     
     return decorator
+
+
 def csrf_token_required(f):
     """
     =============================================================================
@@ -230,4 +233,4 @@ def decorated_function(*args, **kwargs):
                 "message": "An internal security error occurred."
             }), 500
             
-    return decorated_function
+    return decorated_function
\ No newline at end of file
diff --git a/backend/validators.py b/backend/validators.py
index 879c00a7a..26aff7a0c 100644
--- a/backend/validators.py
+++ b/backend/validators.py
@@ -28,6 +28,46 @@ def validate_google_books_id(google_id: str) -> bool:
     return bool(GOOGLE_BOOKS_ID_PATTERN.fullmatch(str(google_id).strip()))
 
 
+# ─────────────────────────────────────────────────────────────────────────────
+# PASSWORD STRENGTH VALIDATION  (Issue #790)
+# ─────────────────────────────────────────────────────────────────────────────
+
+# Individual rule regexes — kept separate so RegisterRequest's field_validator
+# can also iterate over them to produce per-rule error messages.
+_PASSWORD_RULES: List[Dict[str, Any]] = [
+    {"regex": re.compile(r'.{8,}'),      "msg": "Minimum 8 characters required"},
+    {"regex": re.compile(r'[A-Z]'),      "msg": "At least one uppercase letter (A–Z) required"},
+    {"regex": re.compile(r'[a-z]'),      "msg": "At least one lowercase letter (a–z) required"},
+    {"regex": re.compile(r'\d'),         "msg": "At least one digit (0–9) required"},
+    {"regex": re.compile(r'[@#$!%&*]'), "msg": "At least one special character (@, #, $, !, %, &, *) required"},
+]
+
+
+def validate_password_strength(password: str) -> tuple[bool, list[str]]:
+    """
+    Check password against all strength rules.
+
+    Returns:
+        (is_valid, errors)  — errors is an empty list when is_valid is True.
+
+    Usage (standalone):
+        ok, errors = validate_password_strength("Secure@123")
+    """
+    if not isinstance(password, str):
+        return False, ["Password must be a string"]
+
+    errors = [
+        rule["msg"]
+        for rule in _PASSWORD_RULES
+        if not rule["regex"].search(password)
+    ]
+    return len(errors) == 0, errors
+
+# ─────────────────────────────────────────────────────────────────────────────
+# END PASSWORD STRENGTH VALIDATION
+# ─────────────────────────────────────────────────────────────────────────────
+
+
 class ShelfType(str, Enum):
     """Valid shelf types for library items."""
     WANT = "want"
@@ -203,7 +243,7 @@ class RegisterRequest(BaseModel):
     username: str = Field(..., min_length=3, max_length=50, description="Username (3-50 characters)")
     email: EmailStr = Field(..., description="Valid email address")
     password: str = Field(..., min_length=8, max_length=100, description="Password (minimum 8 characters)")
-    
+
     @field_validator('username')
     @classmethod
     def username_alphanumeric(cls, v: str) -> str:
@@ -213,6 +253,21 @@ def username_alphanumeric(cls, v: str) -> str:
             raise ValueError('Username must contain only letters, numbers, and underscores.')
         return v
 
+    @field_validator('password')
+    @classmethod
+    def password_strong_enough(cls, v: str) -> str:
+        """
+        Enforce strong password policy (Issue #790).
+        Runs validate_password_strength() and raises ValueError
+        with all failed rules so the API response is descriptive.
+        """
+        is_valid, errors = validate_password_strength(v)
+        if not is_valid:
+            # Join all failure reasons into one message so Pydantic surfaces them
+            raise ValueError("Password does not meet requirements: " + " | ".join(errors))
+        return v  # never sanitize / modify passwords — return as-is
+
+
 class LoginRequest(BaseModel):
     """Request schema for POST /api/v1/login endpoint."""
     username: str = Field(..., min_length=1, description="Username or email")
diff --git a/frontend/js/authValidator.js b/frontend/js/authValidator.js
new file mode 100644
index 000000000..465a0b2a7
--- /dev/null
+++ b/frontend/js/authValidator.js
@@ -0,0 +1,162 @@
+/**
+ * authValidator.js  —  Issue #790
+ * Wires up real-time password strength UI for the BiblioDrift auth page.
+ * Depends on passwordValidator.js (imported first in auth.html).
+ */
+
+import { validatePassword, PASSWORD_RULES } from './passwordValidator.js';
+
+// ─── Element references ───────────────────────────────────────────────────────
+const passwordInput  = document.getElementById('password');
+const strengthFill   = document.getElementById('strength-fill');
+const strengthLabel  = document.getElementById('strength-label');
+const submitBtn      = document.getElementById('submitBtn');
+const authForm       = document.getElementById('authForm');
+
+// Map rule id (from passwordValidator.js) → <li> id in auth.html
+const RULE_TO_LI = {
+    'len':  'chk-len',
+    'up':   'chk-up',
+    'low':  'chk-low',
+    'num':  'chk-num',
+    'spec': 'chk-spec',
+};
+
+const STRENGTH_COLORS = {
+    weak:   '#E24B4A',
+    fair:   '#EF9F27',
+    good:   '#EF9F27',
+    strong: '#1D9E75',
+};
+
+// ─── Show / hide checklist based on form mode ─────────────────────────────────
+function isRegisterMode() {
+    return authForm && authForm.dataset.mode === 'register';
+}
+
+function setChecklistVisible(visible) {
+    const bar = document.querySelector('.password-strength-bar');
+    const lbl = strengthLabel;
+    const ul  = document.getElementById('pw-checklist');
+    if (bar) bar.style.display = visible ? '' : 'none';
+    if (lbl) lbl.style.display = visible ? '' : 'none';
+    if (ul)  ul.style.display  = visible ? '' : 'none';
+}
+
+// ─── Core update function ─────────────────────────────────────────────────────
+function updateStrengthUI() {
+    const val = passwordInput ? passwordInput.value : '';
+
+    // Only show strength UI when in register mode
+    if (!isRegisterMode()) {
+        setChecklistVisible(false);
+        return;
+    }
+
+    setChecklistVisible(true);
+
+    if (!val) {
+        // Reset everything when field is empty
+        if (strengthFill)  { strengthFill.style.width = '0%'; strengthFill.style.background = ''; }
+        if (strengthLabel)   strengthLabel.textContent = '';
+        Object.values(RULE_TO_LI).forEach(liId => {
+            const li = document.getElementById(liId);
+            if (li) { li.classList.remove('pass', 'fail'); }
+        });
+        if (submitBtn) { submitBtn.disabled = true; submitBtn.style.opacity = '0.45'; submitBtn.style.cursor = 'not-allowed'; }
+        return;
+    }
+
+    const { isValid, results, strength } = validatePassword(val);
+
+    // Update strength bar
+    const pct = (results.filter(r => r.passed).length / PASSWORD_RULES.length) * 100;
+    if (strengthFill) {
+        strengthFill.style.width      = `${pct}%`;
+        strengthFill.style.background = STRENGTH_COLORS[strength] || '#E24B4A';
+    }
+    if (strengthLabel) {
+        strengthLabel.textContent = strength
+            ? strength.charAt(0).toUpperCase() + strength.slice(1)
+            : '';
+        strengthLabel.style.color = STRENGTH_COLORS[strength] || '#888';
+    }
+
+    // Update checklist items
+    results.forEach(({ id, passed }) => {
+        const liId = RULE_TO_LI[id];
+        if (!liId) return;
+        const li = document.getElementById(liId);
+        if (!li) return;
+        li.classList.toggle('pass', passed);
+        li.classList.toggle('fail', !passed);
+    });
+
+    // Enable / disable submit button
+    if (submitBtn) {
+        submitBtn.disabled      = !isValid;
+        submitBtn.style.opacity = isValid ? '1' : '0.45';
+        submitBtn.style.cursor  = isValid ? 'pointer' : 'not-allowed';
+    }
+}
+
+// ─── Listen to password input ─────────────────────────────────────────────────
+if (passwordInput) {
+    passwordInput.addEventListener('input', updateStrengthUI);
+}
+
+// ─── Reset UI when toggling between login ↔ register ────────────────────────
+// auth.html's inline script toggles authForm.dataset.mode — we observe that.
+if (authForm) {
+    const observer = new MutationObserver(() => {
+        updateStrengthUI();
+        // In login mode, always re-enable submit (no strength requirement)
+        if (!isRegisterMode() && submitBtn) {
+            submitBtn.disabled      = false;
+            submitBtn.style.opacity = '1';
+            submitBtn.style.cursor  = 'pointer';
+        }
+    });
+    observer.observe(authForm, { attributes: true, attributeFilter: ['data-mode'] });
+}
+
+// ─── Block form submission if password is weak (register mode) ───────────────
+if (authForm) {
+    authForm.addEventListener('submit', (e) => {
+        if (!isRegisterMode()) return;   // login — no strength check needed
+
+        const val = passwordInput ? passwordInput.value : '';
+        const { isValid, errors } = validatePassword(val);
+
+        if (!isValid) {
+            e.preventDefault();
+            e.stopImmediatePropagation();
+
+            // Shake the checklist to draw attention
+            const ul = document.getElementById('pw-checklist');
+            if (ul) {
+                ul.style.animation = 'none';
+                ul.offsetHeight;   // reflow
+                ul.style.animation = 'shake 0.4s ease';
+            }
+
+            // Force-update UI so user sees which rules failed
+            updateStrengthUI();
+        }
+    }, true);   // capture phase — runs before handleAuth()
+}
+
+// ─── Simple shake keyframe (injected once) ───────────────────────────────────
+const style = document.createElement('style');
+style.textContent = `
+@keyframes shake {
+  0%,100% { transform: translateX(0); }
+  20%      { transform: translateX(-6px); }
+  40%      { transform: translateX(6px); }
+  60%      { transform: translateX(-4px); }
+  80%      { transform: translateX(4px); }
+}`;
+document.head.appendChild(style);
+
+// ─── Init: hide checklist on page load (starts in login mode) ────────────────
+setChecklistVisible(false);
\ No newline at end of file
diff --git a/frontend/js/passwordValidator.js b/frontend/js/passwordValidator.js
new file mode 100644
index 000000000..fc40be631
--- /dev/null
+++ b/frontend/js/passwordValidator.js
@@ -0,0 +1,19 @@
+// frontend/js/passwordValidator.js
+
+export const PASSWORD_RULES = [
+  { id: 'len',  regex: /.{8,}/,     msg: 'At least 8 characters' },
+  { id: 'up',   regex: /[A-Z]/,     msg: 'One uppercase letter (A–Z)' },
+  { id: 'low',  regex: /[a-z]/,     msg: 'One lowercase letter (a–z)' },
+  { id: 'num',  regex: /[0-9]/,     msg: 'One digit (0–9)' },
+  { id: 'spec', regex: /[@#$!%&*]/, msg: 'One special character (@#$!%&*)' },
+];
+
+export function validatePassword(password) {
+  const results = PASSWORD_RULES.map(rule => ({
+    ...rule,
+    passed: rule.regex.test(password),
+  }));
+  const passedCount = results.filter(r => r.passed).length;
+  const strength = ['', 'weak', 'weak', 'fair', 'good', 'strong'][passedCount];
+  return { isValid: passedCount === 5, results, strength };
+}
\ No newline at end of file
diff --git a/frontend/js/security.js b/frontend/js/security.js
index 9c9691e73..e6508ee94 100644
--- a/frontend/js/security.js
+++ b/frontend/js/security.js
@@ -19,6 +19,134 @@ const SAFE_HREF_PROTOCOLS = ['http:', 'https:', 'mailto:'];
 const SAFE_HREF_PATTERN = /^(?:(?:https?:|mailto:)[^\s]*|#.*|\/(?!\/)[^\s]*|[^:/\s][^:\s]*)$/i;
 let domPurifyHooksRegistered = false;
 
+// ─────────────────────────────────────────────────────────────────────────────
+// PASSWORD VALIDATION  (Issue #790)
+// ─────────────────────────────────────────────────────────────────────────────
+
+/**
+ * Rules that every new password must satisfy.
+ * Each rule has a unique id (used to target the checklist <li>),
+ * a regex to test against, and the human-readable message shown to the user.
+ */
+const PASSWORD_RULES = [
+    { id: 'pw-len',  regex: /.{8,}/,      msg: 'At least 8 characters' },
+    { id: 'pw-up',   regex: /[A-Z]/,      msg: 'One uppercase letter (A–Z)' },
+    { id: 'pw-low',  regex: /[a-z]/,      msg: 'One lowercase letter (a–z)' },
+    { id: 'pw-num',  regex: /[0-9]/,      msg: 'One digit (0–9)' },
+    { id: 'pw-spec', regex: /[@#$!%&*]/,  msg: 'One special character (@, #, $, !, %, &, *)' },
+];
+
+/**
+ * Validate password strength against PASSWORD_RULES.
+ *
+ * @param {string} password - The password to test
+ * @returns {{ isValid: boolean, errors: string[], strength: string, results: Array }}
+ *   - isValid   : true only when ALL rules pass
+ *   - errors    : array of failure messages (empty when valid)
+ *   - strength  : 'weak' | 'fair' | 'good' | 'strong'
+ *   - results   : per-rule objects { id, msg, passed } for building UI checklists
+ */
+function validatePassword(password) {
+    if (typeof password !== 'string') {
+        return { isValid: false, errors: ['Password must be a string'], strength: 'weak', results: [] };
+    }
+
+    const results = PASSWORD_RULES.map(rule => ({
+        id:     rule.id,
+        msg:    rule.msg,
+        passed: rule.regex.test(password),
+    }));
+
+    const passedCount = results.filter(r => r.passed).length;
+    const errors      = results.filter(r => !r.passed).map(r => r.msg);
+
+    // Map 1–5 passed rules to a label; 0 rules = no label yet
+    const strengthMap = { 1: 'weak', 2: 'weak', 3: 'fair', 4: 'good', 5: 'strong' };
+    const strength    = passedCount === 0 ? '' : (strengthMap[passedCount] || 'weak');
+
+    return {
+        isValid: passedCount === PASSWORD_RULES.length,
+        errors,
+        strength,
+        results,
+    };
+}
+
+/**
+ * Wire up real-time password strength UI.
+ *
+ * Expects this HTML structure inside your registration form:
+ *
+ *   <input type="password" id="password" />
+ *
+ *   <div class="password-strength-bar">
+ *     <div id="strength-fill" class="strength-fill"></div>
+ *   </div>
+ *   <p id="strength-label" class="strength-label"></p>
+ *
+ *   <ul class="pw-checklist">
+ *     <li id="pw-len">  At least 8 characters</li>
+ *     <li id="pw-up">   One uppercase letter (A–Z)</li>
+ *     <li id="pw-low">  One lowercase letter (a–z)</li>
+ *     <li id="pw-num">  One digit (0–9)</li>
+ *     <li id="pw-spec"> One special character (@, #, $, !, %, &, *)</li>
+ *   </ul>
+ *
+ * @param {string} inputId    - id of the <input type="password"> element
+ * @param {string} fillId     - id of the strength bar fill <div>
+ * @param {string} labelId    - id of the strength label <p>
+ * @param {string} submitId   - id of the submit/register <button> to enable/disable
+ */
+function initPasswordStrengthUI(inputId, fillId, labelId, submitId) {
+    const inputEl  = document.getElementById(inputId);
+    const fillEl   = document.getElementById(fillId);
+    const labelEl  = document.getElementById(labelId);
+    const submitEl = submitId ? document.getElementById(submitId) : null;
+
+    if (!inputEl || !fillEl || !labelEl) {
+        console.warn('initPasswordStrengthUI: one or more required elements not found.');
+        return;
+    }
+
+    const STRENGTH_COLORS = {
+        weak:   '#E24B4A',
+        fair:   '#EF9F27',
+        good:   '#EF9F27',
+        strong: '#1D9E75',
+    };
+
+    inputEl.addEventListener('input', () => {
+        const { isValid, results, strength } = validatePassword(inputEl.value);
+
+        // Update bar width + color
+        const pct = (results.filter(r => r.passed).length / PASSWORD_RULES.length) * 100;
+        fillEl.style.width      = inputEl.value.length === 0 ? '0%' : `${pct}%`;
+        fillEl.style.background = STRENGTH_COLORS[strength] || '#E24B4A';
+
+        // Update label text
+        labelEl.textContent = inputEl.value.length === 0 ? '' : strength;
+
+        // Update checklist items
+        results.forEach(({ id, passed }) => {
+            const li = document.getElementById(id);
+            if (!li) return;
+            li.classList.toggle('pass', passed);
+            li.classList.toggle('fail', !passed && inputEl.value.length > 0);
+        });
+
+        // Enable / disable submit button
+        if (submitEl) {
+            submitEl.disabled        = !isValid;
+            submitEl.style.opacity   = isValid ? '1' : '0.45';
+            submitEl.style.cursor    = isValid ? 'pointer' : 'not-allowed';
+        }
+    });
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// END PASSWORD VALIDATION
+// ─────────────────────────────────────────────────────────────────────────────
+
 function getDOMPurify() {
     return isDOMPurifyAvailable() ? globalThis.DOMPurify : null;
 }
@@ -156,7 +284,8 @@ function setElementContent(element, content, asHTML = false) {
 }
 
 /**
- * Validate and sanitize user input before sending to server
+ * Validate and sanitize user input before sending to server.
+ * Pass { isPassword: true } in options to also run password-strength checks.
  * 
  * @param {string} input - User input
  * @param {object} options - Validation options
@@ -168,7 +297,8 @@ function validateUserInput(input, options = {}) {
         minLength = 0,
         required = true,
         pattern = null,
-        allowHTML = false
+        allowHTML = false,
+        isPassword = false,   // ← NEW: set true for password fields
     } = options;
 
     const errors = [];
@@ -222,8 +352,20 @@ function validateUserInput(input, options = {}) {
         errors.push('Input contains potentially dangerous content');
     }
 
-    // Sanitize
-    const sanitized = allowHTML ? sanitizeHTML(input) : sanitizeForDisplay(input);
+    // ── Password-strength check (Issue #790) ──────────────────────────────────
+    if (isPassword && input.length > 0) {
+        const pwValidation = validatePassword(input);
+        if (!pwValidation.isValid) {
+            errors.push(...pwValidation.errors);
+        }
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+
+    // For password fields we skip HTML sanitization — passwords are never
+    // rendered as HTML; sanitizing them would corrupt special characters.
+    const sanitized = isPassword
+        ? input
+        : (allowHTML ? sanitizeHTML(input) : sanitizeForDisplay(input));
 
     return {
         isValid: errors.length === 0,
@@ -440,6 +582,10 @@ if (typeof module !== 'undefined' && module.exports) {
         getCSRFToken,
         secureAPIRequest,
         HTML,
-        makeContentEditableSafe
+        makeContentEditableSafe,
+        // ── Issue #790 exports ──────────────────────────────────────────────
+        PASSWORD_RULES,
+        validatePassword,
+        initPasswordStrengthUI,
     };
-}
+}
\ No newline at end of file
diff --git a/frontend/js/vault-author-fix.js b/frontend/js/vault-author-fix.js
new file mode 100644
index 000000000..c1de71a9b
--- /dev/null
+++ b/frontend/js/vault-author-fix.js
@@ -0,0 +1,5 @@
+document.addEventListener('DOMContentLoaded', () => {
+    document.querySelectorAll('.vault-author, [data-author]').forEach(el => {
+        if (el.textContent) el.textContent = el.textContent.trim();
+    });
+});
\ No newline at end of file
diff --git a/frontend/pages/auth.html b/frontend/pages/auth.html
index f735c2982..982f0184c 100644
--- a/frontend/pages/auth.html
+++ b/frontend/pages/auth.html
@@ -655,17 +655,19 @@ <h2 id="authTitle">Welcome Back</h2>
                         </div>
                     </div>
 
-                    <!-- 
-                        =============================================================
-                        SECURITY COMPLIANCE: CSRF TOKEN FIELD
-                        =============================================================
-                        This hidden input is dynamically populated with a one-time 
-                        security token provided by the backend. It protects against
-                        Cross-Site Request Forgery attacks by ensuring that the 
-                        form submission originated from this specific application 
-                        instance.
-                        =============================================================
-                    -->
+                    <!-- PASSWORD STRENGTH UI -->
+                    <div class="password-strength-bar">
+                        <div id="strength-fill" class="strength-fill"></div>
+                    </div>
+                    <p id="strength-label" class="strength-label"></p>
+                    <ul class="pw-checklist" id="pw-checklist">
+                        <li id="chk-len">At least 8 characters</li>
+                        <li id="chk-up">One uppercase letter</li>
+                        <li id="chk-low">One lowercase letter</li>
+                        <li id="chk-num">One digit (0–9)</li>
+                        <li id="chk-spec">One special character</li>
+                    </ul>
+
                     <input type="hidden" id="csrf_token" name="csrf_token" value="">
 
                     <span id="forgotPasswordLink" class="toggle-link" style="display: block; margin: -0.25rem 0 1rem; font-size: 0.85rem;">
@@ -1056,18 +1058,8 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
     </script>
     <script src="../js/pwa.js"></script>
     <script>
-        /**
-         * ==============================================================================
-         * CSRF INITIALIZATION LOGIC
-         * ==============================================================================
-         * On document load, we query the backend's CSRF endpoint to retrieve a 
-         * fresh security token. This token is then stored in the hidden form 
-         * field and utilized in the 'handleAuth' submission headers.
-         * ==============================================================================
-         */
         document.addEventListener('DOMContentLoaded', async () => {
             try {
-                // We use MOOD_API_BASE from config.js
                 const response = await fetch(`${MOOD_API_BASE}/csrf-token`, {
                     method: 'GET',
                     credentials: 'include'
@@ -1094,6 +1086,8 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
     </script>
     <script src="../js/theme-manager.js"></script>
   <script src="../js/ambient.js"></script>
+  <script src="../js/passwordValidator.js" type="module"></script>
+<script src="../js/authValidator.js" type="module"></script>
 </body>
 
 </html>
diff --git a/frontend/pages/author.html b/frontend/pages/author.html
new file mode 100644
index 000000000..350c961e0
--- /dev/null
+++ b/frontend/pages/author.html
@@ -0,0 +1,224 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Author Profile | BiblioDrift</title>
+  <link rel="stylesheet" href="../css/style.css" />
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
+  <link rel="icon" href="../assets/images/biblioDrift_favicon.png" type="image/png">
+  
+  <script src="https://unpkg.com/dexie/dist/dexie.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/dompurify@3.0.6/dist/purify.min.js"></script>
+  
+  <script>
+    (function () {
+      const theme = localStorage.getItem('bibliodrift_theme');
+      if (theme === 'night') {
+        document.documentElement.setAttribute('data-theme', 'night');
+      }
+    })();
+  </script>
+</head>
+<body>
+  <header>
+    <a href="index.html" class="logo">
+      <img style="height: 40px" src="../assets/images/biblioDrift_favicon.png" alt="BiblioDrift Logo"> BiblioDrift
+    </a>
+    <div class="header-controls">
+      <nav class="nav-links">
+        <div class="tooltip"><a href="index.html">Discovery</a></div>
+        <div class="tooltip"><a href="vault.html">My Vault</a></div>
+        <div class="tooltip"><a href="library.html">My Library</a></div>
+      </nav>
+    </div>
+  </header>
+
+  <div class="author-profile-banner" style="width: 100%; height: 260px; background: linear-gradient(135deg, #3d2b24 0%, #1a120f 100%); border-bottom: 1px solid var(--glass-border); position: relative; z-index: 1;">
+    <div style="position: absolute; right: 40px; bottom: 20px; opacity: 0.15; font-size: 5rem; color: var(--accent-gold);">
+      <i class="fa-solid fa-book-open-reader"></i>
+    </div>
+  </div>
+
+  <main class="author-profile-container" style="padding: 0 2rem 4rem 2rem; max-width: 1000px; margin: -100px auto 0 auto; position: relative; z-index: 10;">
+    
+    <div class="author-hero glass-panel" style="background: var(--surface-elevated, #1c1816); border: 1px solid var(--glass-border); padding: 3rem; border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.5); display: flex; flex-direction: column; align-items: flex-start; text-align: left;">
+      
+      <div style="display: flex; gap: 30px; align-items: center; width: 100%; flex-wrap: wrap;">
+        <div style="position: relative; display: inline-block;">
+          <div style="width: 130px; height: 130px; border-radius: 50%; border: 3px solid var(--accent-gold); display: flex; align-items: center; justify-content: center; background: rgba(212, 175, 55, 0.05);">
+            <div style="width: 110px; height: 110px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center; overflow: hidden;">
+              <img id="author-img" src="../assets/images/biblioDrift_favicon.png" alt="Author Avatar" style="width: 100%; height: 100%; object-fit: cover;">
+            </div>
+          </div>
+          <div style="position: absolute; bottom: 8px; right: 8px; width: 16px; height: 16px; background: #2eb85c; border: 2px solid #1c1816; border-radius: 50%;"></div>
+        </div>
+
+        <div style="flex: 1; min-width: 250px;">
+          <h1 style="font-family: 'Playfair Display', serif; font-size: 2.5rem; margin: 0 0 5px 0;">
+            <a id="author-name-link" href="#" style="color: var(--text-main); text-decoration: none; transition: color 0.3s;" onmouseover="this.style.color='var(--accent-gold)'" onmouseout="this.style.color='var(--text-main)'">@loading...</a>
+          </h1>
+          <p id="author-bio" style="color: var(--text-muted); line-height: 1.6; font-size: 1.05rem; margin: 10px 0 0 0; word-wrap: break-word; max-width: 650px;">Fetching dynamic logs...</p>
+        </div>
+      </div>
+      
+      <div class="author-stats-row" style="display: flex; gap: 40px; margin-top: 2rem; padding: 15px 0; border-top: 1px solid rgba(255,255,255,0.05); width: 100%; text-transform: uppercase; font-size: 0.85rem; letter-spacing: 1px;">
+        <div><span style="display:block; font-size:1.6rem; font-family:'Playfair Display', serif; font-weight:bold; color:var(--text-main);" id="stat-works">0</span> Works</div>
+        <div><span style="display:block; font-size:1.6rem; font-family:'Playfair Display', serif; font-weight:bold; color:var(--text-main);" id="stat-followers">0</span> Followers</div>
+        <div><span style="display:block; font-size:1.6rem; font-family:'Playfair Display', serif; font-weight:bold; color:var(--text-main);" id="stat-genres">0</span> Genres</div>
+        <div><span style="display:block; font-size:1.6rem; font-family:'Playfair Display', serif; font-weight:bold; color:var(--text-main);" id="stat-since">2026</span> Since</div>
+      </div>
+
+      <div class="author-meta" style="display: flex; flex-direction: column; gap: 12px; margin-top: 1.5rem; width: 100%;">
+        <div id="author-genres" style="display: flex; gap: 8px; align-items: center; flex-wrap: wrap;"></div>
+        <div id="author-joined" style="display: flex; gap: 15px; font-size: 0.88rem; color: var(--text-muted); margin-top: 5px;"></div>
+      </div>
+    </div>
+
+    <section class="published-content" style="margin-top: 2.5rem;">
+      <h2 class="section-title" style="font-family: 'Playfair Display', serif; margin-bottom: 1.5rem; color: var(--text-main); display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--glass-border); padding-bottom: 10px;">
+        <i class="fa-solid fa-book" style="color: var(--accent-gold); font-size: 1.3rem;"></i> Publications Archive
+      </h2>
+      <div class="genre-books-grid" id="author-works-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 2rem;">
+        </div>
+    </section>
+
+  </main>
+
+  <script>
+    document.addEventListener('DOMContentLoaded', async () => {
+        // Connect directly to vault database
+        const db = new Dexie("BiblioDriftPrivateVault");
+        db.version(7).stores({
+          vaultBooks: "++id, title, author, uploader, genre, desc, privacy, elaraScanStatus, filename, timestamp, coverColor, coverUrl, fileBlob"
+        });
+
+        const urlParams = new URLSearchParams(window.location.search);
+        let authorParam = urlParams.get('author');
+        let uploaderParam = urlParams.get('user');
+        let role = urlParams.get('role') || 'creator';
+
+        // STRICTLY DYNAMIC: Fetch whatever the user typed during login. NO PRE-ASSUMPTIONS.
+        let sessionUser = localStorage.getItem("bibliodrift_username");
+        if (!sessionUser || sessionUser.trim() === "") {
+            sessionUser = "Unknown User"; 
+        }
+
+        let targetLookupName = "";
+
+        // Route logic: resolve exact target name dynamically based on role
+        if (role === 'uploader') {
+            targetLookupName = (uploaderParam && uploaderParam.trim() !== "") ? decodeURIComponent(uploaderParam) : sessionUser;
+        } else {
+            targetLookupName = (authorParam && authorParam.trim() !== "") ? decodeURIComponent(authorParam) : "Unknown Author";
+        }
+
+        let recordsArray = await db.vaultBooks.toArray();
+        let filteredBooks = [];
+        let finalBio = "";
+        let finalBadge = "";
+
+        if (role === 'uploader') {
+            filteredBooks = recordsArray.filter(b => b.uploader && b.uploader.toLowerCase().trim() === targetLookupName.toLowerCase().trim());
+            finalBadge = "BiblioDrift Vault Contributor";
+            finalBio = `${targetLookupName} is an active archivist on BiblioDrift, managing a refined personal sanctuary of ${filteredBooks.length} data assets inside the secure registry stack.`;
+        } else {
+            filteredBooks = recordsArray.filter(b => b.author && b.author.toLowerCase().trim() === targetLookupName.toLowerCase().trim());
+            finalBadge = "BiblioDrift Vault Creator";
+            
+            if (filteredBooks.length > 0 && filteredBooks[0].desc && filteredBooks[0].desc.trim() !== "") {
+                finalBio = filteredBooks[0].desc;
+            } else {
+                finalBio = `This profile showcases the artistic identity of original creator: ${targetLookupName}. Preserved cleanly by community contributors inside the sanctuary vault.`;
+            }
+        }
+
+        let genreSet = new Set();
+        filteredBooks.forEach(b => {
+            if(b.genre) b.genre.split(',').forEach(g => {
+                const cleanedGenre = g.trim();
+                if(cleanedGenre) genreSet.add(cleanedGenre);
+            });
+        });
+        if(genreSet.size === 0 && filteredBooks.length > 0) genreSet.add("Literature");
+
+        // Inject Data securely
+        document.getElementById('stat-works').textContent = filteredBooks.length;
+        document.getElementById('stat-followers').textContent = "0"; 
+        document.getElementById('stat-genres').textContent = genreSet.size;
+
+        const nameLink = document.getElementById('author-name-link');
+        if(nameLink) {
+            nameLink.textContent = targetLookupName.toLowerCase().includes('@') ? targetLookupName : `@${targetLookupName.toLowerCase().replace(/\s+/g, '_')}`;
+            nameLink.href = `?${role === 'uploader' ? 'user' : 'author'}=${encodeURIComponent(targetLookupName)}&role=${role}`;
+        }
+
+        document.getElementById('author-bio').textContent = DOMPurify.sanitize(finalBio);
+        document.getElementById('author-img').src = `https://ui-avatars.com/api/?name=${encodeURIComponent(targetLookupName)}&background=2c2420&color=d4af37&size=110&bold=true`;
+        
+        document.getElementById('author-joined').innerHTML = `
+          <span><i class="fa-solid fa-calendar-days" style="color: var(--accent-gold); margin-right: 5px;"></i> System Session: 2026</span>
+          <span><i class="fa-solid fa-id-card-clip" style="color: var(--accent-gold); margin-right: 5px;"></i> ${finalBadge}</span>
+        `;
+
+        const genreTagsEl = document.getElementById('author-genres');
+        genreTagsEl.innerHTML = '';
+        genreSet.forEach(genre => {
+            const tag = document.createElement('span');
+            tag.style.cssText = 'background: rgba(255,255,255,0.03); border: 1px solid var(--glass-border); padding: 0.3rem 0.8rem; border-radius: 6px; font-size: 0.8rem; color: var(--text-muted); font-family: "Georgia", serif; font-style: italic; margin-right: 6px;';
+            tag.textContent = genre;
+            genreTagsEl.appendChild(tag);
+        });
+
+        const worksGrid = document.getElementById('author-works-grid');
+        worksGrid.innerHTML = '';
+
+        if (filteredBooks.length === 0) {
+            worksGrid.innerHTML = `<div style="grid-column: 1/-1; text-align: center; color: var(--text-muted); font-style: italic; opacity: 0.7; padding: 20px 0;">No active vault tracking elements allocated under this signature entity loop.</div>`;
+            return;
+        }
+
+        filteredBooks.forEach(book => {
+            const card = document.createElement('div');
+            const cardColor = book.coverColor || '#4a2810';
+            const hasCoverImage = book.coverUrl && book.coverUrl.trim() !== "";
+            const coverStyle = hasCoverImage 
+                ? `background-image: url('${encodeURI(book.coverUrl)}'); background-size: cover; background-position: center;` 
+                : `background: ${cardColor};`;
+
+            // GRID BLOWOUT FIX: Strict flex, min-width: 0, and max-width checks
+            card.style.cssText = `
+                background: var(--surface-soft, #1e1a18); 
+                border: 1px solid var(--glass-border); 
+                border-radius: 12px; 
+                padding: 15px; 
+                text-align: center; 
+                box-shadow: var(--shadow-soft); 
+                transition: transform 0.3s; 
+                cursor: pointer; 
+                display: flex; 
+                flex-direction: column; 
+                gap: 12px;
+                min-width: 0; 
+                width: 100%;
+                box-sizing: border-box;
+                overflow: hidden;
+            `;
+            card.onmouseover = () => card.style.transform = 'translateY(-5px)';
+            card.onmouseout = () => card.style.transform = 'translateY(0)';
+            
+            card.innerHTML = `
+                <div style="width: 100%; height: 220px; ${coverStyle} border-radius: 6px; display: flex; flex-direction: column; justify-content: space-between; padding: 15px; box-sizing: border-box; border: 1px solid rgba(0,0,0,0.2); text-align: left; position: relative; box-shadow: inset 3px 0 5px rgba(255,255,255,0.05), 3px 5px 15px rgba(0,0,0,0.3); overflow: hidden;">
+                    ${!hasCoverImage ? `<div style="font-family: 'Playfair Display', serif; font-size: 1.05rem; color: #fff; font-weight: 700; word-break: break-all; overflow-wrap: break-word; line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical;">${DOMPurify.sanitize(book.title)}</div>` : ''}
+                    ${!hasCoverImage ? `<div style="font-size: 0.7rem; color: rgba(255,255,255,0.4); text-transform: uppercase; font-family: sans-serif; letter-spacing: 1px; font-weight: bold; margin-top: auto; padding-top: 10px;">BiblioDrift Archive</div>` : ''}
+                </div>
+                <div style="font-size: 0.95rem; color: var(--text-main); font-weight: 500; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; max-width: 100%; width: 100%; display: block;" title="${DOMPurify.sanitize(book.title)}">
+                    ${DOMPurify.sanitize(book.title)}
+                </div>
+            `;
+            worksGrid.appendChild(card);
+        });
+    });
+  </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/frontend/pages/library.html b/frontend/pages/library.html
index 33be0e459..b62cb7840 100644
--- a/frontend/pages/library.html
+++ b/frontend/pages/library.html
@@ -17,7 +17,6 @@
     <script src="../js/app.js"></script>
     <script src="../js/library-3d.js"></script>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <!-- SEO & Open Graph meta tags -->
     <meta name="description"
         content="My Library on BiblioDrift — View your saved books, track your reading progress, and revisit your personal reading journey all in one place." />
     <meta property="og:type" content="website" />
@@ -39,15 +38,14 @@
         rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
     <link rel="icon" href="../assets/images/biblioDrift_favicon.png" type="image/png">
-    <!-- PWA -->
     <link rel="stylesheet" href="../css/pwa.css">
     <link rel="manifest" href="../manifest.json">
     <meta name="theme-color" content="#2c2420">
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
     <meta name="apple-mobile-web-app-title" content="BiblioDrift">
-    <link rel="apple-touch-icon" href="../assets/images/biblioDrift_favicon.png">
     <script src="https://d3js.org/d3.v7.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/dompurify@3.0.6/dist/purify.min.js"></script>
 </head>
 
 <body class="library-page">
@@ -90,7 +88,6 @@
           <a href="chat.html" >Chat</a>
           <span class="tooltip-text"><i class="fa-solid fa-comments"></i> Chat</span>
         </div>
-        <!-- DYNAMIC AUTH LINK -->
         <div class="tooltip">
           <a href="auth.html" id="navAuthLink" >Sign In</a>
           <span class="tooltip-text" id="navAuthTooltip"><i class="fa-solid fa-key"></i> Access account</span>
@@ -185,29 +182,17 @@ <h2>Reading Streak</h2>
             </div>
         </section>
 
-        <!-- 3D Bookshelf Container -->
         <div class="bookshelf-3d-container" id="library-shelves" role="main" aria-label="3D bookshelf library">
 
-            <!-- Empty State Placeholder (Visible when filter returns no books) -->
             <div id="library-empty-state" class="library-empty-state" hidden>
-                <!-- Animated SVG Illustration -->
                 <div class="empty-state-illustration">
                     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" width="200" height="200" class="empty-shelf-svg">
-                        <!-- Empty bookshelf illustration -->
                         <rect x="20" y="140" width="160" height="8" fill="var(--accent-gold)" opacity="0.3" rx="2"/>
                         <rect x="25" y="148" width="150" height="4" fill="var(--accent-gold)" opacity="0.2" rx="1"/>
-                        
-                        <!-- Open book in center -->
                         <g class="floating-book">
                             <path d="M70 80 L70 120 L100 115 L130 120 L130 80 L100 85 Z" 
-                                  fill="var(--card-bg)" 
-                                  stroke="var(--accent-gold)" 
-                                  stroke-width="2"/>
-                            <line x1="100" y1="85" x2="100" y2="115" 
-                                  stroke="var(--accent-gold)" 
-                                  stroke-width="1.5" 
-                                  opacity="0.5"/>
-                            <!-- Pages -->
+                                  fill="var(--card-bg)" stroke="var(--accent-gold)" stroke-width="2"/>
+                            <line x1="100" y1="85" x2="100" y2="115" stroke="var(--accent-gold)" stroke-width="1.5" opacity="0.5"/>
                             <path d="M75 90 L95 92" stroke="var(--text-muted)" opacity="0.3" stroke-width="1"/>
                             <path d="M75 95 L92 97" stroke="var(--text-muted)" opacity="0.3" stroke-width="1"/>
                             <path d="M75 100 L90 102" stroke="var(--text-muted)" opacity="0.3" stroke-width="1"/>
@@ -215,20 +200,15 @@ <h2>Reading Streak</h2>
                             <path d="M108 97 L125 95" stroke="var(--text-muted)" opacity="0.3" stroke-width="1"/>
                             <path d="M110 102 L125 100" stroke="var(--text-muted)" opacity="0.3" stroke-width="1"/>
                         </g>
-                        
-                        <!-- Sparkles -->
                         <circle cx="50" cy="60" r="2" fill="var(--accent-gold)" class="sparkle sparkle-1"/>
                         <circle cx="150" cy="70" r="2" fill="var(--accent-gold)" class="sparkle sparkle-2"/>
                         <circle cx="100" cy="50" r="1.5" fill="var(--accent-gold)" class="sparkle sparkle-3"/>
                     </svg>
                 </div>
                 
-                <!-- Enhanced Typography -->
                 <div class="empty-state-content">
                     <h2 class="empty-state-title">Your library awaits its first chapter</h2>
-                    <p class="empty-state-description">
-                        No books found here. Start your reading journey by discovering stories that speak to your soul.
-                    </p>
+                    <p class="empty-state-description">No books found here. Start your reading journey by discovering stories that speak to your soul.</p>
                 </div>
                 
                 <!-- Call to Action -->
@@ -237,71 +217,70 @@ <h2 class="empty-state-title">Your library awaits its first chapter</h2>
                 </a>
             </div>
 
-            <!-- Currently Reading Shelf -->
+            <div class="shelf-section-3d" id="public-vault-wrapper" style="display: none; border-bottom: 1px dashed var(--glass-border); padding-bottom: 2rem; margin-bottom: 2rem;">
+                <span class="shelf-label">
+                    <i class="fa-solid fa-globe" style="color: var(--accent-gold); margin-right: 8px;"></i>
+                    Public Community Vault
+                </span>
+                <div class="bookshelf-3d">
+                    <div class="books-row-3d" id="shelf-public-3d" role="list" aria-label="Public community books">
+                        </div>
+                </div>
+            </div>
+
             <div class="shelf-section-3d">
                 <span class="shelf-label">
                     <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
                         stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
                         class="lucide lucide-book-open-icon lucide-book-open">
                         <path d="M12 7v14" />
-                        <path
-                            d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z" />
+                        <path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z" />
                     </svg>
                     Currently Immersed
                 </span>
                 <div class="bookshelf-3d">
                     <div class="books-row-3d" id="shelf-current-3d" role="list" aria-label="Books currently being read">
-                        <!-- Books will be injected via JS -->
-                    </div>
+                        </div>
                 </div>
             </div>
 
-            <!-- Want to Read Shelf -->
             <div class="shelf-section-3d">
                 <span class="shelf-label">
                     <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
                         stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
                         class="lucide lucide-book-marked-icon lucide-book-marked">
                         <path d="M10 2v8l3-3 3 3V2" />
-                        <path
-                            d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20" />
+                        <path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20" />
                     </svg>
                     Anticipated Journeys
                 </span>
                 <div class="bookshelf-3d">
                     <div class="books-row-3d" id="shelf-want-3d" role="list" aria-label="Books to read">
-                        <!-- Books will be injected via JS -->
-                    </div>
+                        </div>
                 </div>
             </div>
 
-            <!-- Finished Reading Shelf -->
             <div class="shelf-section-3d">
                 <span class="shelf-label">
                     <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
                         stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
                         class="lucide lucide-book-check-icon lucide-book-check">
-                        <path
-                            d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20" />
+                        <path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20" />
                         <path d="m9 9.5 2 2 4-4" />
                     </svg>
                     Lifetime Favorites
                 </span>
                 <div class="bookshelf-3d">
                     <div class="books-row-3d" id="shelf-finished-3d" role="list" aria-label="Books already read">
-                        <!-- Books will be injected via JS -->
-                    </div>
+                        </div>
                 </div>
             </div>
 
         </div>
 
-        <!-- Constellation Container (Hidden by default) -->
         <div id="constellation-container" class="constellation-container hidden">
-            <!-- D3 SVG will be injected here -->
-        </div>
+            </div>
 
-        <!-- Custom Collections Container (Hidden by default) -->
         <div id="collections-container" class="collections-container hidden" style="padding: 2rem 0; width: 100%;">
             <div class="collections-header" style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem; flex-wrap: wrap; gap: 1rem;">
                 <h2 style="font-family: 'Playfair Display', serif; color: var(--text-main); margin: 0; display: flex; align-items: center; gap: 10px; font-size: 1.8rem;">
@@ -312,14 +291,11 @@ <h2 style="font-family: 'Playfair Display', serif; color: var(--text-main); marg
                 </button>
             </div>
 
-            <!-- Collections Grid (List View) -->
             <div id="collections-grid-view" style="width: 100%;">
                 <div id="collections-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem;">
-                    <!-- Collections populated via JS -->
-                </div>
+                    </div>
             </div>
 
-            <!-- Selected Collection View (Detail View - Hidden by default) -->
             <div id="collection-detail-view" class="hidden" style="margin-top: 1rem; width: 100%;">
                 <div class="collection-detail-header" style="background: var(--glass-bg); padding: 1.5rem; border-radius: 15px; margin-bottom: 2rem; border: 1px solid var(--glass-border); width: 100%; box-sizing: border-box;">
                     <button id="back-to-collections-btn" class="btn-secondary" style="border-radius: 20px; margin-bottom: 1rem; display: inline-flex; align-items: center; gap: 6px; padding: 0.4rem 1rem;">
@@ -337,22 +313,18 @@ <h1 id="selected-collection-name" style="font-family: 'Playfair Display', serif;
                         </div>
                     </div>
                 </div>
-                <!-- Grid for books inside this collection -->
                 <div class="shelf-section-3d" style="margin-top: 1rem; padding-top: 2rem;">
                     <span class="shelf-label" id="collection-books-shelf-label">
                         <i class="fa-solid fa-book-bookmark" style="color: var(--accent-gold); margin-right: 6px;"></i> Books in Collection
                     </span>
                     <div class="bookshelf-3d">
                         <div class="books-row-3d" id="collection-books-row-3d" role="list" aria-label="Books in this collection">
-                            <!-- 3D Book Spines injected here! -->
-                        </div>
+                            </div>
                     </div>
                 </div>
             </div>
         </div>
 
-
-        <!-- Book Tooltip (positioned dynamically) -->
         <div class="book-tooltip" id="book-tooltip" role="region" aria-label="Book preview tooltip" aria-live="polite">
             <div class="tooltip-header">
                 <img class="tooltip-cover" id="tooltip-cover" src="" alt="Book cover">
@@ -363,7 +335,6 @@ <h1 id="selected-collection-name" style="font-family: 'Playfair Display', serif;
                         <span class="tooltip-stars" id="tooltip-stars">&#9733;&#9733;&#9733;&#9733;&#9734;</span>
                         <span class="tooltip-rating-text" id="tooltip-rating-text">4.2</span>
                     </div>
-                    <!-- Reading progress shown in tooltip for currently-reading books -->
                     <div class="tooltip-progress" id="tooltip-progress" style="display:none;">
                         <div class="tooltip-progress-bar-track">
                             <div class="tooltip-progress-bar-fill" id="tooltip-progress-fill"></div>
@@ -376,41 +347,30 @@ <h1 id="selected-collection-name" style="font-family: 'Playfair Display', serif;
             <div class="tooltip-hint">Click to see full details</div>
         </div>
 
-        <!-- Book Detail Modal -->
         <div class="book-detail-modal" id="book-detail-modal">
             <button class="modal-close-btn" id="modal-close-btn" aria-label="Close details" title="Close details">
                 <i class="fa-solid fa-xmark"></i>
             </button>
             <div class="book-detail-content">
                 <div class="book-expanded-layout">
-                    <!-- Left Column: Interactive 3D Book -->
                     <div class="book-stage">
                         <div class="book-3d-scene">
-                            <!-- Click on the book to flip it -->
                             <div class="book-object" id="book-3d-object" role="button" tabindex="0"
                                 aria-label="Book 3D object. Press Enter or Space to flip the book.">
-                                <!-- Front Face -->
                                 <div class="book-face face-front" aria-hidden="true">
                                     <img id="modal-cover" src="" alt="Book Cover">
                                     <div class="spine-overlay" aria-hidden="true"></div>
                                     <div class="lighting-sheen" aria-hidden="true"></div>
                                 </div>
-
-                                <!-- Spine Face -->
                                 <div class="book-face face-spine"></div>
-
-                                <!-- Back Face -->
                                 <div class="book-face face-back">
                                     <div class="back-paper-texture">
                                         <div class="back-content-scroll" id="modal-back-cover">
-                                            <!-- Description injected here -->
                                             <h3 class="synopsis-title">Synopsis</h3>
                                             <p id="modal-description" class="book-description-text"></p>
                                         </div>
                                     </div>
                                 </div>
-
-                                <!-- Paper Edges -->
                                 <div class="book-face face-right"></div>
                                 <div class="book-face face-top"></div>
                                 <div class="book-face face-bottom"></div>
@@ -421,14 +381,13 @@ <h3 class="synopsis-title">Synopsis</h3>
                         </div>
                     </div>
 
-                    <!-- Right Column: Info & Details -->
                     <div class="book-info-panel">
                         <div class="book-header">
                             <h1 class="book-title-large" id="modal-title"></h1>
-                            <p class="book-author-large" id="modal-author"></p>
+                            <div class="book-author-large" id="modal-author"></div>
                         </div>
 
-                        <div class="book-stats-row">
+                        <div class="book-stats-row" id="modal-stats-row">
                             <div class="stat-item">
                                 <div class="book-rating-large">
                                     <span class="rating-stars-large"
@@ -442,8 +401,7 @@ <h1 class="book-title-large" id="modal-title"></h1>
                             </div>
                         </div>
 
-                        <!-- AI Insight Box -->
-                        <div class="ai-insight-box" style="margin-bottom: 1.5rem;">
+                        <div class="ai-insight-box" id="modal-ai-box" style="margin-bottom: 1.5rem;">
                             <div class="ai-header">
                                 <i class="fa-solid fa-wand-magic-sparkles"></i>
                                 <span>AI Insight</span>
@@ -454,8 +412,7 @@ <h1 class="book-title-large" id="modal-title"></h1>
                             </div>
                         </div>
 
-                        <!-- Where to Buy section -->
-                        <div class="purchase-links-box" style="margin-bottom: 1.5rem;">
+                        <div class="purchase-links-box" id="modal-buy-box" style="margin-bottom: 1.5rem;">
                             <div class="purchase-header">
                                 <i class="fa-solid fa-cart-shopping"></i>
                                 <span>Where to Buy</span>
@@ -467,7 +424,6 @@ <h1 class="book-title-large" id="modal-title"></h1>
 
                         <div class="book-actions-section">
                             <div class="library-actions-group">
-                                <!-- Issue #23: Remove from Library button UI -->
                                 <button class="action-btn-primary remove-from-library library-remove-btn"
                                     id="modal-remove-btn" title="Remove from library">
                                     <i class="fa-solid fa-trash"></i>
@@ -482,23 +438,18 @@ <h1 class="book-title-large" id="modal-title"></h1>
                                 </button>
                             </div>
 
-                            <!-- Reading Progress Tracker -->
                             <div class="reading-progress-tracker" id="modal-progress-section" style="display:none;">
                                 <div class="progress-tracker-header">
                                     <i class="fa-solid fa-book-open-reader"></i>
                                     <span class="progress-tracker-title">Reading Progress</span>
                                     <span class="progress-percent-badge" id="modal-progress-badge">0%</span>
                                 </div>
-
-                                <!-- Mode toggle: percentage vs pages -->
                                 <div class="progress-mode-toggle">
                                     <button class="progress-mode-btn active" id="progress-mode-pct"
                                         data-mode="percent">% Done</button>
                                     <button class="progress-mode-btn" id="progress-mode-pages"
                                         data-mode="pages">Pages</button>
                                 </div>
-
-                                <!-- Percentage mode -->
                                 <div class="progress-input-group" id="progress-pct-group">
                                     <input type="range" min="0" max="100" value="0" class="progress-range-slider"
                                         id="modal-progress-slider" aria-label="Reading progress percentage">
@@ -511,8 +462,6 @@ <h1 class="book-title-large" id="modal-title"></h1>
                                         <span>100%</span>
                                     </div>
                                 </div>
-
-                                <!-- Pages mode -->
                                 <div class="progress-input-group" id="progress-pages-group" style="display:none;">
                                     <div class="pages-input-row">
                                         <div class="pages-field">
@@ -531,13 +480,12 @@ <h1 class="book-title-large" id="modal-title"></h1>
                                         <div class="progress-bar-fill" id="modal-pages-bar"></div>
                                     </div>
                                 </div>
-
                                 <button class="progress-save-btn" id="modal-progress-save">
                                     <i class="fa-solid fa-floppy-disk"></i> Save Progress
                                 </button>
                             </div>
 
-                            <div class="shelf-selection-row" style="margin-top: 10px;">
+                            <div class="shelf-selection-row" id="modal-shelf-row" style="margin-top: 10px;">
                                 <label for="modal-shelf-select" class="library-select-label">Move to Shelf:</label>
                                 <select id="modal-shelf-select" class="shelf-select library-shelf-select"
                                     aria-label="Move book to shelf" title="Move book to shelf">
@@ -546,40 +494,12 @@ <h1 class="book-title-large" id="modal-title"></h1>
                                     <option value="finished">Lifetime Favorites</option>
                                 </select>
                             </div>
-
-                            <!-- Price Tracker UI -->
-                            <div class="price-tracker-section" id="modal-price-tracker-section" style="display:none; margin-top: 15px;">
-                                <div class="price-tracker-header">
-                                    <div>
-                                        <i class="fa-solid fa-tag" style="color: var(--accent-gold);"></i>
-                                        <span style="font-weight: 600; color: var(--text-main); margin-left: 5px;">Watch Price</span>
-                                    </div>
-                                    <div id="modal-price-latest" style="font-size: 0.9rem; font-weight: bold; color: var(--accent-gold);"></div>
-                                </div>
-                                <div id="modal-price-auth-prompt" style="display: none; font-size: 0.85rem; color: var(--text-muted); background: var(--glass-bg); padding: 10px; border-radius: 8px;">
-                                    <a href="auth.html" style="color: var(--accent-gold); text-decoration: underline;">Sign in</a> to set a price alert for this book.
-                                </div>
-                                <div id="modal-price-controls" style="display: none;">
-                                    <div style="display: flex; gap: 10px; margin-bottom: 10px;">
-                                        <div style="position: relative; flex: 1;">
-                                            <span style="position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--text-muted);">$</span>
-                                            <input type="number" id="modal-price-target" min="0.01" step="0.01" placeholder="Target price" aria-label="Target price" style="width: 100%; padding: 8px 8px 8px 20px; border-radius: 4px; border: 1px solid rgba(0,0,0,0.2); background: rgba(255,255,255,0.8); color: var(--text-main);">
-                                        </div>
-                                        <button id="modal-price-set-btn" class="action-btn-secondary" style="white-space: nowrap; padding: 8px 15px;"><i class="fa-solid fa-bell"></i> Set Alert</button>
-                                    </div>
-                                    <div id="modal-price-active-alert" style="display:none; align-items: center; justify-content: space-between; font-size: 0.85rem; background: rgba(76, 175, 80, 0.1); border: 1px solid rgba(76, 175, 80, 0.3); padding: 8px; border-radius: 4px; color: var(--text-main);">
-                                        <div><i class="fa-solid fa-bell" style="color: #4CAF50;"></i> Alert set for <strong id="modal-price-active-target"></strong></div>
-                                        <button id="modal-price-remove-btn" title="Remove alert" style="background: none; border: none; color: #e53935; cursor: pointer;"><i class="fa-solid fa-trash"></i></button>
-                                    </div>
-                                </div>
-                            </div>
                         </div>
 
-                        <div class="book-reviews-section">
+                        <div class="book-reviews-section" id="modal-reviews-section">
                             <h3>Reader Reviews</h3>
                             <div id="modal-reviews" class="reviews-scroll-container">
-                                <!-- Reviews injected via JS -->
-                            </div>
+                                </div>
                         </div>
                     </div>
                 </div>
@@ -609,8 +529,6 @@ <h3>Reader Reviews</h3>
     <script src="../js/footer.js"></script>
     <script src="../script/header-scroll.js"></script>
 
-
-    <!-- Ambient Sanctuary UI -->
     <div class="ambient-sanctuary">
         <button id="ambientToggle" title="Ambient Sanctuary" aria-expanded="false" aria-controls="ambientPanel">
             <i class="fa-solid fa-leaf"></i>
@@ -685,7 +603,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
         </div>
     </div>
 
-    <!-- Collection Create/Edit Modal -->
     <dialog id="collection-modal" class="glass-modal" style="background: rgba(0,0,0,0.85); backdrop-filter: blur(12px); border: 1px solid var(--glass-border); border-radius: 15px; color: var(--text-main); padding: 0;">
       <div class="modal-content" style="max-width: 450px; background: none; border: none; box-shadow: none;">
         <button class="close-modal-btn" id="closeCollectionModalBtn" style="position: absolute; right: 15px; top: 15px; background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: 1.25rem;"><i class="fa-solid fa-xmark"></i></button>
@@ -713,7 +630,6 @@ <h2 id="collection-modal-title" style="margin-bottom: 1.5rem; font-family: 'Play
     <script src="../js/theme-manager.js"></script>
   <script src="../js/ambient.js"></script>
     <script src="../js/pwa.js"></script>
-  <!-- AI Chatbot Widget -->
   <div id="ai-chatbot-widget" class="chatbot-widget">
     <button id="chatbot-toggle-btn" class="chatbot-toggle-btn" title="Chat with Elara">
       <i class="fa-solid fa-robot"></i>
@@ -743,6 +659,110 @@ <h4>Elara</h4>
   <script src="../js/chatbot.js"></script>
     <script src="../js/reading-streak.js"></script>
 
+  <script>
+    document.addEventListener('DOMContentLoaded', async () => {
+        try {
+            // Wait slightly so existing library JS finishes rendering before we inject
+            setTimeout(async () => {
+                const vaultDb = new Dexie("BiblioDriftPrivateVault");
+                vaultDb.version(7).stores({
+                    vaultBooks: "++id, title, author, uploader, genre, desc, privacy, elaraScanStatus, filename, timestamp, coverColor, coverUrl, fileBlob"
+                });
+
+                const publicShelf = document.getElementById('shelf-public-3d');
+                const publicWrapper = document.getElementById('public-vault-wrapper');
+                
+                const allBooks = await vaultDb.vaultBooks.toArray();
+                const publicBooks = allBooks.filter(b => b.privacy === 'public');
+
+                if (publicBooks.length > 0) {
+                    publicWrapper.style.display = 'block'; // Make public shelf visible
+                    publicShelf.innerHTML = '';
+
+                    publicBooks.forEach(book => {
+                        const spine = document.createElement("div");
+                        spine.className = "book-spine-3d"; 
+                        
+                        // Fallback styles matching aesthetic if CSS class is missing
+                        spine.style.cssText = `
+                            width: 48px; height: 230px; 
+                            background: ${book.coverUrl ? `url('${encodeURI(book.coverUrl)}') center/cover` : (book.coverColor || '#4a2810')};
+                            border-radius: 4px 2px 2px 4px;
+                            position: relative; cursor: pointer;
+                            display: flex; align-items: center; justify-content: center;
+                            box-shadow: inset 4px 0 10px rgba(0,0,0,0.4), -5px 5px 15px rgba(0,0,0,0.4);
+                            transition: transform 0.3s; margin: 0 6px; z-index: 2;
+                        `;
+
+                        spine.onmouseover = () => spine.style.transform = 'translateY(-15px) scale(1.05)';
+                        spine.onmouseout = () => spine.style.transform = 'translateY(0) scale(1)';
+
+                        spine.innerHTML = `
+                            <div style="writing-mode: vertical-rl; transform: rotate(180deg); color: #fff; font-family: 'Georgia', serif; font-size: 0.85rem; font-weight: bold; padding: 10px; text-shadow: 1px 1px 3px rgba(0,0,0,0.8); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-height: 200px;">
+                                ${DOMPurify.sanitize(book.title)}
+                            </div>
+                        `;
+
+                        // 🌟 DUAL IDENTITY MODAL LOGIC 🌟
+                        spine.addEventListener('click', () => {
+                            const modal = document.getElementById('book-detail-modal');
+                            if(!modal) return;
+
+                            const sTitle = DOMPurify.sanitize(book.title);
+                            const sAuthor = DOMPurify.sanitize(book.author || "Unknown Author");
+                            const sUploader = DOMPurify.sanitize(book.uploader || "Unknown User");
+                            
+                            document.getElementById('modal-title').textContent = sTitle;
+                            document.getElementById('modal-description').textContent = DOMPurify.sanitize(book.desc || "No description provided in the vault.");
+                            
+                            // Inject strictly clickable profile links
+                            document.getElementById('modal-author').innerHTML = `
+                                <div style="display: flex; flex-direction: column; gap: 8px; margin-top: 15px; background: rgba(255,255,255,0.05); padding: 12px 18px; border-radius: 8px; border: 1px dashed var(--glass-border);">
+                                    <div style="font-size: 1.05rem; color: var(--text-main);">
+                                        <i class="fa-solid fa-pen-nib" style="color: var(--accent-gold); margin-right: 6px;"></i> Creator: 
+                                        <a href="author.html?author=${encodeURIComponent(sAuthor)}&role=creator" style="color: var(--accent-gold); text-decoration: none; font-weight: 600; transition: 0.2s;" onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'">${sAuthor}</a>
+                                    </div>
+                                    <div style="font-size: 0.9rem; color: var(--text-muted);">
+                                        <i class="fa-solid fa-upload" style="margin-right: 6px;"></i> Vault Archiver: 
+                                        <a href="author.html?user=${encodeURIComponent(sUploader)}&role=uploader" style="color: #fff; text-decoration: none; font-weight: 500; transition: 0.2s;" onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'">${sUploader}</a>
+                                    </div>
+                                </div>
+                            `;
+
+                            // Handle Cover Update Safely
+                            const coverFace = document.querySelector('.face-front');
+                            const img = document.getElementById('modal-cover');
+                            if (book.coverUrl) {
+                                img.src = encodeURI(book.coverUrl);
+                                img.style.display = 'block';
+                                if(coverFace) coverFace.style.background = 'transparent';
+                            } else {
+                                img.style.display = 'none';
+                                if(coverFace) {
+                                    coverFace.style.background = book.coverColor || '#4a2810';
+                                    coverFace.innerHTML = `<div style="padding:20px; color:#fff; font-family:'Playfair Display', serif; font-size:1.5rem; font-weight:bold; height:100%; box-sizing:border-box;">${sTitle}</div>`;
+                                }
+                            }
+
+                            // Clean up unneeded UI elements for Public Books
+                            ['modal-progress-section', 'modal-remove-btn', 'modal-stats-row', 'modal-ai-box', 'modal-buy-box', 'modal-shelf-row', 'modal-reviews-section'].forEach(id => {
+                                const el = document.getElementById(id);
+                                if(el) el.style.display = 'none';
+                            });
+
+                            modal.classList.add('active');
+                        });
+
+                        publicShelf.appendChild(spine);
+                    });
+                }
+            }, 500); // 500ms delay to ensure library.js finishes its original rendering
+        } catch (error) {
+            console.error("Public Vault Render Error:", error);
+        }
+    });
+  </script>
+
 </body>
 
 </html>
diff --git a/frontend/pages/vault.html b/frontend/pages/vault.html
index ac74a6bcf..0a3cb0020 100644
--- a/frontend/pages/vault.html
+++ b/frontend/pages/vault.html
@@ -2,6 +2,7 @@
 <html lang="en">
 
 <head>
+  <script src="../js/vault-author-fix.js"></script>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>BiblioDrift-upload your books</title>
@@ -31,33 +32,20 @@
   <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
   <script src="../js/library-3d.js"></script>
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <!-- Added SEO meta description to improve search engine discoverability and click-through rates -->
   <meta name="description" content="BiblioDrift — Discover books by mood, track your reading journey, and get AI-powered recommendations." />
   <title>BiblioDrift | Find yourself in the pages</title>
   <link rel="stylesheet" href="../css/style.css" />
   <link rel="stylesheet" href="../css/keyboard-shortcuts.css" />
   <link rel="manifest" href="/manifest.json">
-  <!-- Fonts -->
   <link rel="preconnect" href="https://fonts.googleapis.com" />
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-  <link
-    href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400&family=Georgia&display=swap"
-    rel="stylesheet" />
+  <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400&family=Georgia&display=swap" rel="stylesheet" />
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
 
-  <!-- Security: DOMPurify for XSS prevention -->
   <script src="https://cdn.jsdelivr.net/npm/dompurify@3.0.6/dist/purify.min.js"></script>
   <link rel="icon" href="../assets/images/biblioDrift_favicon.png" type="image/png">
-  <!-- PWA -->
-  <link rel="manifest" href="/manifest.json">
-  <meta name="theme-color" content="#2c2420">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
-  <meta name="apple-mobile-web-app-title" content="BiblioDrift">
-  <link rel="apple-touch-icon" href="../assets/images/biblioDrift_favicon.png">
 
   <style>
-    /* Map vault-specific variables to app-wide variables for uniformity */
     :root {
       --bg-surface: var(--bg-color);
       --bg-card: var(--input-bg);
@@ -75,12 +63,10 @@
       --shelf-shadow: rgba(0, 0, 0, 0.8);
     }
 
-    /* Remove body, header, footer overrides so style.css takes over */
     header, .main-footer, .hero, section, div, input, textarea, select {
       transition: background-color 0.4s ease, color 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
     }
 
-    /* Form Fields */
     .vault-field {
       background: var(--field-bg);
       border: 1px solid var(--border-color);
@@ -129,7 +115,7 @@
       transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
     }
     .details-revealer-card.active {
-      max-height: 900px;
+      max-height: 1200px; 
       opacity: 1;
       transform: translateY(0);
       margin-top: 25px;
@@ -139,7 +125,6 @@
       padding: 24px;
     }
 
-    /* Shelf Engine Visuals */
     .shelf-container {
       background: var(--shelf-bg);
       border-radius: 8px;
@@ -174,7 +159,6 @@
       padding-bottom: 2px;
     }
 
-    /* Hardbound Spine Precision Styling */
     .spine-spine-node {
       width: 52px;
       height: 240px;
@@ -186,7 +170,6 @@
       display: flex;
       padding: 22px 0;
       justify-content: center;
-      /* Distinct Hardbound Join Crease and Depth Extrusion */
       box-shadow: 
         inset 5px 0 7px rgba(255,255,255,0.08),
         inset -3px 0 5px rgba(0,0,0,0.4),
@@ -229,7 +212,6 @@
       padding-right: 2px;
     }
 
-    /* Traditional Bookbinding Vertical Shoulder Joint Bump Indicator */
     .spine-spine-node::before {
       content: '';
       position: absolute;
@@ -258,7 +240,6 @@
     .native-picker-accent::-webkit-color-swatch-wrapper { padding: 0; }
     .native-picker-accent::-webkit-color-swatch { border: 2px solid rgba(255,255,255,0.2); border-radius: 50%; }
 
-    /* Metadata Shelf Drawer Layout */
     .shelf-isolated-meta-drawer {
       width: 100%;
       background: var(--bg-card);
@@ -276,7 +257,6 @@
       to { opacity: 1; transform: translateY(0); }
     }
 
-    /* Expanded Split Card Transformation Layout System */
     .vault-split-card {
       display: grid;
       grid-template-columns: 280px 1fr;
@@ -290,7 +270,6 @@
       }
     }
 
-    /* Premium Heavy Hardbound Board Design Configuration */
     .vault-cover-preview-canvas {
       border-radius: 6px 12px 12px 6px;
       display: flex;
@@ -300,7 +279,6 @@
       position: relative;
       min-height: 375px;
       overflow: hidden;
-      /* Heavy structural hardback border and shadow framing layers */
       border: 1px solid rgba(0, 0, 0, 0.25);
       border-left: 12px solid rgba(0, 0, 0, 0.35);
       box-shadow: 
@@ -310,7 +288,6 @@
         inset -2px -2px 6px rgba(0,0,0,0.3);
     }
 
-    /* Hardcover Intent Spine Groove Indentation (French Groove Line) */
     .vault-cover-preview-canvas::after {
       content: '';
       position: absolute;
@@ -427,7 +404,6 @@
     .btn-delete-vault { background: rgba(220, 53, 69, 0.05); border-color: rgba(220, 53, 69, 0.15); color: #f26868; }
     .btn-delete-vault:hover { background: rgba(220, 53, 69, 0.15); color: #fff; }
 
-    /* Immersive Genuine Full Screen PDF Viewport Layer Architecture */
     .realistic-book-overlay {
       position: fixed;
       top: 0; left: 0; right: 0; bottom: 0;
@@ -540,7 +516,6 @@
           <a href="chat.html" >Chat</a>
           <span class="tooltip-text"><i class="fa-solid fa-comments"></i> Chat</span>
         </div>
-        <!-- DYNAMIC AUTH LINK -->
         <div class="tooltip">
           <a href="auth.html" id="navAuthLink" >Sign In</a>
           <span class="tooltip-text" id="navAuthTooltip"><i class="fa-solid fa-key"></i> Access account</span>
@@ -593,9 +568,10 @@ <h2>Authentication Required</h2>
                     <option value="public">Public (Synchronized to Cloud Matrix)</option>
                   </select>
                 </div>
+                
                 <div class="vault-input-group">
-                  <label for="vaultBookAuthor">Author</label>
-                  <input type="text" id="vaultBookAuthor" class="vault-field" placeholder="Author Name">
+                  <label for="vaultBookAuthor">Original Author (Creator)</label>
+                  <input type="text" id="vaultBookAuthor" class="vault-field" placeholder="e.g. Unknown Author">
                 </div>
                 
                 <div class="vault-input-group">
@@ -605,14 +581,14 @@ <h2>Authentication Required</h2>
                     <span style="font-size: 0.85rem; color: var(--text-muted);">Click circle to open dynamic spectrum palette</span>
                   </div>
                 </div>
-                <div class="vault-input-group">
+                <div class="vault-input-group full-width-field">
                   <label for="vaultBookCoverUrl">Custom Cover Background Image URL (Optional)</label>
                   <input type="url" id="vaultBookCoverUrl" class="vault-field" placeholder="https://images.unsplash.com/photo-example">
                 </div>
 
                 <div class="vault-input-group full-width-field">
-                  <label for="vaultBookDesc">Description & Personal Annotation Notes</label>
-                  <textarea id="vaultBookDesc" class="vault-field" rows="3" placeholder="Add custom context notes or literary descriptions..."></textarea>
+                  <label for="vaultBookDesc">Original Author Biography & Annotation Context Notes</label>
+                  <textarea id="vaultBookDesc" class="vault-field" rows="3" placeholder="Add custom background information about the creator or personal annotations..."></textarea>
                 </div>
               </div>
 
@@ -641,12 +617,10 @@ <h2 style="font-family: 'Playfair Display', serif; font-size: 1.8rem;">Your Uplo
     </div>
   </main>
 
-  <!-- Back to Top Button -->
   <button id="backToTop" class="btn-icon back-to-top" title="Back to Top" onclick="window.scrollTo({top: 0, behavior: 'smooth'});">
     <i class="fa-solid fa-arrow-up"></i>
   </button>
 
-  <!-- Ambient Sanctuary UI -->
   <div class="ambient-sanctuary">
     <button id="ambientToggle" title="Ambient Sanctuary" aria-expanded="false" aria-controls="ambientPanel">
       <i class="fa-solid fa-leaf"></i>
@@ -692,7 +666,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
     </div>
   </div>
 
-
   <div id="immersiveBookReader" class="realistic-book-overlay">
     <button class="close-reader-trigger" id="closeReaderBtn" title="Close Book Workspace Layout Layer"><i class="fa-solid fa-xmark"></i></button>
     <div class="book-spread-container" id="bookSpreadTarget"></div>
@@ -737,10 +710,9 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
         updateThemeToggleButton(nextTheme);
       });
 
-      // Dexie Storage Sandbox setup
       const db = new Dexie("BiblioDriftPrivateVault");
-      db.version(6).stores({
-        vaultBooks: "++id, title, author, genre, desc, privacy, elaraScanStatus, filename, timestamp, coverColor, coverUrl, fileBlob"
+      db.version(7).stores({
+        vaultBooks: "++id, title, author, uploader, genre, desc, privacy, elaraScanStatus, filename, timestamp, coverColor, coverUrl, fileBlob"
       });
 
       const authBarrier = document.getElementById("authBarrier");
@@ -768,7 +740,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
         secureDeck.style.display = "block";
       }
 
-      // Drag and Drop Interfaces
       const dropZone = document.getElementById("dropZone");
       dropZone.addEventListener("dragover", (e) => { e.preventDefault(); dropZone.style.borderColor = "var(--border-focus)"; });
       dropZone.addEventListener("dragleave", () => { dropZone.style.borderColor = "var(--border-color)"; });
@@ -792,7 +763,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
         }
       }
 
-      // Storage Pipeline Execution
       uploadBtn.addEventListener("click", async () => {
         if (!vaultFileInput.files.length) return;
 
@@ -805,6 +775,10 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
         const coverUrl = DOMPurify.sanitize(document.getElementById("vaultBookCoverUrl").value.trim());
         const selectedColor = document.getElementById("vaultSpineColorPicker").value;
 
+        // FIXED: Hardcode hataya. Ab sirf wahi uthayega jo storage mein hai, warna generic dega.
+        const currentUploader = localStorage.getItem("bibliodrift_username") || "Unknown Uploader";
+        const uploader = DOMPurify.sanitize(currentUploader);
+
         if(!title) { alert("Please provide a book title."); return; }
 
         uploadBtn.disabled = true;
@@ -816,6 +790,7 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
           await db.vaultBooks.add({
             title: title,
             author: author,
+            uploader: uploader,
             genre: rawGenre, 
             desc: desc,
             privacy: privacy,
@@ -827,7 +802,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
             fileBlob: file 
           });
 
-          // Reset inputs cleanly
           document.getElementById("vaultBookTitle").value = "";
           document.getElementById("vaultBookAuthor").value = "";
           document.getElementById("vaultBookGenre").value = "";
@@ -856,7 +830,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
         });
       }
 
-      // Render Virtual Display Shelf UI Engine (With Split-Card Cover Expansion Layout)
       async function renderVaultShelf() {
         shelfRow.innerHTML = "";
         drawerMetaTarget.innerHTML = ""; 
@@ -895,7 +868,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
 
             chunk.forEach((book, idx) => {
               const realIdx = vaultRenderIndex + idx;
-              // Build the book cover spine node - STRICTLY hardbound color fill
               const spineNode = document.createElement("div");
               spineNode.className = "spine-spine-node";
               spineNode.setAttribute("data-id", book.id);
@@ -904,7 +876,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
 
               spineNode.innerHTML = `<div class="spine-vertical-text">${DOMPurify.sanitize(book.title)}</div>`;
 
-              // Manage metadata tags mapping
               const tagsArray = book.genre ? book.genre.split(',').map(t => t.trim()).filter(t => t !== "") : ["Literature"];
               let tagPillsHtml = tagsArray.map(tag => `<span class="tag-bubble"><i class="fa-solid fa-tag" style="font-size:0.65rem; margin-right:4px;"></i>${tag}</span>`).join('');
 
@@ -916,13 +887,14 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
                 ? `<span class="ai-status-badge ai-status-passed"><i class="fa-solid fa-shield-halved"></i> Elara Checked</span>`
                 : `<span class="ai-status-badge ai-status-failed"><i class="fa-solid fa-triangle-exclamation"></i> Flagged Asset</span>`;
 
-              // Background Cover Logic Configuration
               const hasCoverImage = book.coverUrl && book.coverUrl.trim() !== "";
               const dynamicCoverStyle = hasCoverImage 
                 ? `background-image: url('${encodeURI(book.coverUrl)}'); background-size: cover; background-position: center;` 
                 : `background-color: ${book.coverColor || '#4a2810'}; display: flex; flex-direction: column; justify-content: space-between; padding: 25px 20px; box-sizing: border-box; text-align: left;`;
 
-              // Typographic Fallback Block Builder
+              const sAuthor = DOMPurify.sanitize(book.author || "Unknown Author");
+              const sUploader = DOMPurify.sanitize(book.uploader || "Unknown Uploader");
+
               const titleRenderBlock = hasCoverImage 
                 ? `<div class="cover-title-display" id="cover-title-render-${book.id}" style="display: none;">${DOMPurify.sanitize(book.title)}</div>`
                 : `
@@ -930,8 +902,11 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
                     <div class="cover-title-display" id="cover-title-render-${book.id}" style="font-family: 'Playfair Display', serif; font-size: 1.35rem; color: #ffffff; margin-bottom: 6px; font-weight: 700; line-height: 1.3; word-break: break-word;">
                       ${DOMPurify.sanitize(book.title)}
                     </div>
-                    <div class="cover-author-display" id="cover-author-render-${book.id}" style="font-size: 0.9rem; color: rgba(255, 255, 255, 0.85); font-style: italic; word-break: break-word;">
-                      by ${DOMPurify.sanitize(book.author)}
+                    <div style="font-size: 0.85rem; color: rgba(255, 255, 255, 0.9); font-style: italic;">
+                      by <a href="author.html?author=${encodeURIComponent(sAuthor)}&role=creator" style="color: var(--accent-gold); text-decoration: none; font-weight: bold;">${sAuthor}</a>
+                    </div>
+                    <div style="font-size: 0.75rem; color: rgba(255, 255, 255, 0.7); margin-top: 4px;">
+                      Uploaded by: <a href="author.html?user=${encodeURIComponent(sUploader)}&role=uploader" style="color: #fff; text-decoration: underline;">${sUploader}</a>
                     </div>
                   </div>
                   <div style="font-size: 0.65rem; color: rgba(255, 255, 255, 0.4); font-family: sans-serif; letter-spacing: 1.5px; font-weight: bold; text-transform: uppercase; margin-top: auto;">
@@ -939,7 +914,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
                   </div>
                 `;
 
-              // Clean Integrated Front-Cover Split-Form Component Architecture
               metaDrawer.innerHTML = `
                 <div class="vault-split-card">
                   
@@ -962,15 +936,27 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
                           <input type="text" class="editable-input-node inline-edit-title" value="${book.title}" style="font-family:'Playfair Display', serif; font-size:1.25rem; font-weight:600; border-bottom:1px solid var(--border-color);" placeholder="Book Title">
                         </div>
                         <div class="vault-input-group">
-                          <label style="font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;">Author Signature</label>
-                          <input type="text" class="editable-input-node inline-edit-author" value="${book.author}" style="font-size:1.02rem; font-style:italic; color:var(--text-muted);" placeholder="Author Name">
+                          <label style="font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;">Author (Clickable Link)</label>
+                          <div style="display: flex; align-items: center; gap: 8px;">
+                            <input type="text" class="editable-input-node inline-edit-author" value="${sAuthor}" style="font-size:1.02rem; font-style:italic; color:var(--text-muted); flex: 1;" placeholder="Author Name">
+                            <a href="author.html?author=${encodeURIComponent(sAuthor)}&role=creator" title="View Creator Profile" style="color: var(--accent-gold); font-size: 1.1rem;"><i class="fa-solid fa-arrow-up-right-from-square"></i></a>
+                          </div>
                         </div>
-                        <div class="vault-input-group full-width-field">
-                          <label style="font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;">Genre Field Config <span class="requirement-hint">(Commas)</span></label>
+                        
+                        <div class="vault-input-group">
+                          <label style="font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;">Uploaded By (Clickable Link)</label>
+                          <div style="font-size:1.02rem; color:var(--text-muted); padding: 8px 0; display: flex; align-items: center;">
+                            ${sUploader}
+                            <a href="author.html?user=${encodeURIComponent(sUploader)}&role=uploader" title="View Uploader Profile" style="color: var(--text-main); font-size: 1.1rem; margin-left: 10px;"><i class="fa-solid fa-user-gear"></i></a>
+                          </div>
+                        </div>
+
+                        <div class="vault-input-group">
+                          <label style="font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;">Genre Field Config</label>
                           <input type="text" class="editable-input-node inline-edit-genre" value="${book.genre || ''}" style="border-bottom:1px solid var(--border-color); font-size:0.9rem;" placeholder="e.g. Fiction, Cyberpunk">
                         </div>
                         <div class="vault-input-group full-width-field">
-                          <label style="font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;">Annotations & Context Notes</label>
+                          <label style="font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;">Author Biography & Context Notes</label>
                           <textarea class="editable-input-node inline-edit-desc" rows="2" style="line-height:1.5; font-size:0.9rem;" placeholder="Add private contextual details...">${book.desc || ''}</textarea>
                         </div>
                       </div>
@@ -1000,7 +986,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
                 </div>
               `;
 
-              // Handle Drawer Display State Toggles
               spineNode.addEventListener("click", () => {
                 const allDrawers = document.querySelectorAll(".shelf-isolated-meta-drawer");
                 const allSpines = document.querySelectorAll(".spine-spine-node");
@@ -1019,7 +1004,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
                 }
               });
 
-              // Metadata Sync Listeners
               const titleIn = metaDrawer.querySelector(".inline-edit-title");
               const authorIn = metaDrawer.querySelector(".inline-edit-author");
               const genreIn = metaDrawer.querySelector(".inline-edit-genre");
@@ -1033,22 +1017,8 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
 
                 if(t) {
                   await db.vaultBooks.update(book.id, { title: t, author: a, genre: g, desc: d });
-                  
-                  // Synchronize text live across Spine text node
                   spineNode.querySelector(".spine-vertical-text").textContent = t;
-                  
-                  // Synchronize text live inside the typographic canvas container
-                  const coverTitleNode = document.getElementById(`cover-title-render-${book.id}`);
-                  if (coverTitleNode) {
-                    coverTitleNode.textContent = t;
-                  }
-                  const coverAuthorNode = document.getElementById(`cover-author-render-${book.id}`);
-                  if (coverAuthorNode && a) {
-                    coverAuthorNode.textContent = `by ${a}`;
-                  }
-
-                  const updatedTags = g ? g.split(',').map(x => x.trim()).filter(x => x !== "") : ["Literature"];
-                  document.getElementById(`tag-row-target-${book.id}`).innerHTML = updatedTags.map(tag => `<span class="tag-bubble"><i class="fa-solid fa-tag" style="font-size:0.65rem; margin-right:4px;"></i>${tag}</span>`).join('');
+                  await renderVaultShelf();
                 }
               };
 
@@ -1057,7 +1027,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
               genreIn.addEventListener("blur", fireSyncToDB);
               descIn.addEventListener("blur", fireSyncToDB);
 
-              // Privacy Toggle Layer
               metaDrawer.querySelector(".action-privacy-node").addEventListener("click", async () => {
                 const nextPrivacy = book.privacy === "private" ? "public" : "private";
                 await db.vaultBooks.update(book.id, { privacy: nextPrivacy });
@@ -1065,7 +1034,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
                 document.querySelector(`.spine-spine-node[data-id="${book.id}"]`).click();
               });
 
-              // Delete Layer
               metaDrawer.querySelector(".action-delete-node").addEventListener("click", async () => {
                 if(confirm(`Purge "${book.title}" from local encrypted sector loops entirely?`)) {
                   await db.vaultBooks.delete(book.id);
@@ -1073,7 +1041,6 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
                 }
               });
 
-              // Interactive Reader Launch Configuration
               metaDrawer.querySelector(".action-open-reader-node").addEventListener("click", () => {
                 launchRealisticReader(book);
               });
@@ -1094,23 +1061,14 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
         renderChunk();
       }
 
-      // Read Actual Binary Document Stream from Database & Output to Viewer Workspace
       function launchRealisticReader(book) {
         if (!book.fileBlob) {
-          alert("No source binary file was found allocated for this item index inside the IndexedDB sandbox crypt.");
+          alert("No source binary file was found allocated.");
           return;
         }
-
-        if (activePdfObjectUrl) {
-          URL.revokeObjectURL(activePdfObjectUrl);
-        }
-
+        if (activePdfObjectUrl) URL.revokeObjectURL(activePdfObjectUrl);
         activePdfObjectUrl = URL.createObjectURL(book.fileBlob);
-
-        bookSpreadTarget.innerHTML = `
-          <iframe src="${activePdfObjectUrl}#toolbar=1&navpanes=0" class="pdf-render-frame"></iframe>
-        `;
-
+        bookSpreadTarget.innerHTML = `<iframe src="${activePdfObjectUrl}#toolbar=1&navpanes=0" class="pdf-render-frame"></iframe>`;
         immersiveBookReader.style.display = "flex";
         document.body.style.overflow = "hidden";
       }
@@ -1125,10 +1083,9 @@ <h3 style="color: var(--text-main) !important;">Ambient Sanctuary</h3>
         }
       });
 
-      // Launch Initial View Render Configuration
       await renderVaultShelf();
     });
-</script>
+  </script>
 </body>
 </html>
 
diff --git a/tests/test_validation.py b/tests/test_validation.py
index 8e1f3af6a..b67d84e37 100644
--- a/tests/test_validation.py
+++ b/tests/test_validation.py
@@ -8,6 +8,7 @@
 __test__ = False
 from validators import (
     validate_request,
+    validate_password_strength,
     AnalyzeMoodRequest,
     MoodTagsRequest,
     MoodSearchRequest,
@@ -41,6 +42,107 @@ def test_validator(validator_class, test_name, valid_data, invalid_data):
             print(f"   - {error['field']}: {error['message']}")
 
 
+# ─────────────────────────────────────────────────────────────────────────────
+# PASSWORD STRENGTH TESTS  (Issue #790)
+# ─────────────────────────────────────────────────────────────────────────────
+
+def test_password_strength():
+    """
+    Directly test validate_password_strength() for all rule combinations.
+    These run independently of Pydantic so failures are easy to pinpoint.
+    """
+    print("\n=== Testing Password Strength Validation (Issue #790) ===")
+
+    cases = [
+        # (password, expected_valid, description)
+        ("Secure@123",   True,  "All rules pass — strong password"),
+        ("abc",          False, "Too short, missing uppercase/digit/special"),
+        ("password",     False, "Missing uppercase, digit, special char"),
+        ("PASSWORD1@",   False, "Missing lowercase letter"),
+        ("Password123",  False, "Missing special character"),
+        ("Password@",    False, "Missing digit"),
+        ("pass@1A",      True,  "Exactly 8 chars — boundary pass"),
+        ("pass@1",       False, "Only 7 chars — boundary fail"),
+        ("",             False, "Empty string"),
+        ("P@ssw0rd!ExtraLong2025", True, "Long strong password"),
+    ]
+
+    passed = 0
+    failed = 0
+
+    for password, expected_valid, description in cases:
+        is_valid, errors = validate_password_strength(password)
+        status = "✅" if is_valid == expected_valid else "❌"
+        result = "PASS" if is_valid == expected_valid else "FAIL"
+
+        print(f"  {status} [{result}] '{password}' — {description}")
+
+        if is_valid != expected_valid:
+            failed += 1
+            print(f"       Expected valid={expected_valid}, got valid={is_valid}")
+            if errors:
+                for e in errors:
+                    print(f"       Rule failed: {e}")
+        else:
+            passed += 1
+            if not is_valid and errors:
+                # Show which rules failed for educational output
+                print(f"       Failed rules: {'; '.join(errors)}")
+
+    print(f"\n  Password strength results: {passed} passed, {failed} failed")
+    return failed == 0
+
+
+def test_register_password_integration():
+    """
+    Test that RegisterRequest correctly rejects weak passwords
+    and accepts strong ones via the Pydantic field_validator.
+    """
+    print("\n=== Testing RegisterRequest Password Integration (Issue #790) ===")
+
+    base = {"username": "testuser", "email": "test@example.com"}
+
+    register_cases = [
+        # (password, expected_valid, label)
+        ("Secure@123",    True,  "Strong password — should be accepted"),
+        ("weakpass",      False, "No uppercase / digit / special — should be rejected"),
+        ("12345678",      False, "No letters / special — should be rejected"),
+        ("Password1",     False, "No special character — should be rejected"),
+        ("Password@",     False, "No digit — should be rejected"),
+        ("password@1",    False, "No uppercase — should be rejected"),
+        ("SHORT@1A",      True,  "Exactly 8 chars with all rules — should be accepted"),
+        ("123",           False, "Too short — should be rejected"),
+        ("",              False, "Empty — should be rejected"),
+    ]
+
+    passed = 0
+    failed = 0
+
+    for password, expected_valid, label in register_cases:
+        data = {**base, "password": password}
+        is_valid, result = validate_request(RegisterRequest, data)
+        status = "✅" if is_valid == expected_valid else "❌"
+        outcome = "PASS" if is_valid == expected_valid else "FAIL"
+
+        print(f"  {status} [{outcome}] password='{password}' — {label}")
+
+        if is_valid != expected_valid:
+            failed += 1
+            if not is_valid:
+                errors = result.get('validation_errors', [])
+                for err in errors:
+                    print(f"       {err['field']}: {err['message']}")
+        else:
+            passed += 1
+
+    print(f"\n  RegisterRequest results: {passed} passed, {failed} failed")
+    return failed == 0
+
+# ─────────────────────────────────────────────────────────────────────────────
+# END PASSWORD STRENGTH TESTS
+# ─────────────────────────────────────────────────────────────────────────────
+
+
 def main():
     """Run all validation tests."""
     print("🧪 BiblioDrift API Validation Tests")
@@ -130,11 +232,11 @@ def main():
         {"user_id": "not_int", "items": "not_a_list"}
     )
     
-    # Test RegisterRequest
+    # Test RegisterRequest (original basic test kept)
     test_validator(
         RegisterRequest,
         "RegisterRequest",
-        {"username": "testuser", "email": "test@example.com", "password": "Password123!"},
+        {"username": "testuser", "email": "test@example.com", "password": "Secure@123"},
         {"username": "ab", "email": "invalid-email", "password": "123"}
     )
     
@@ -145,11 +247,22 @@ def main():
         {"username": "testuser", "password": "password123"},
         {"username": "", "password": ""}
     )
-    
+
+    # ── Issue #790: Password strength tests ──────────────────────────────────
+    pw_strength_ok    = test_password_strength()
+    pw_register_ok    = test_register_password_integration()
+    # ─────────────────────────────────────────────────────────────────────────
+
     print("\n" + "=" * 50)
     print("✅ All validation tests completed!")
     print("🔒 API endpoints now have robust input validation")
 
+    # ── Issue #790 summary ───────────────────────────────────────────────────
+    print("\n📋 Issue #790 — Password Validation Summary:")
+    print(f"   {'✅' if pw_strength_ok  else '❌'} validate_password_strength() unit tests")
+    print(f"   {'✅' if pw_register_ok  else '❌'} RegisterRequest integration tests")
+    # ─────────────────────────────────────────────────────────────────────────
+
 
 if __name__ == "__main__":
     main()
\ No newline at end of file