csss, thực hiện

 Nguyên nhân là do trong app.py, hàm _inject_shared_navbar tự động chèn đoạn CSS này vào tất cả trang HTML:

css

body { 
    background-color: #f4f6f9;  /* ← Màu xám nhạt của navbar */
}

CSS này được chèn sau CSS trong file nhan-vat.html, nên nó đè luôn màu nền đen tuyệt đẹp #050b14 của bạn thành màu trắng/xám. Khi nền sáng lên, các hiệu ứng glassmorphism, glow orb và sao 3D gần như "biến mất" vì không còn tương phản.

---

Dưới đây là file nhan-vat.html đã fix — giữ nguyên toàn bộ biến Jinja2 ({{ stars }}, {% for %}, v.v.) để chạy đúng với Flask, đồng thời thêm !important vào nền để "chống đè" từ navbar, và tối ưu lại layout cho khớp với sidebar có sẵn:

Thực thi mã Python

Navbar nền trắng

Nguyên nhân nằm ở đoạn này trong app.py (hàm _inject_shared_navbar):

css

body { 
    background-color: #f4f6f9;  /* ← Nền xám nhạt của navbar */
}

CSS này được Flask tự động chèn sau CSS trong file nhan-vat.html, nên nó đè luôn màu nền đen tuyệt đẹp #050b14 của bạn thành màu trắng/xám. Khi nền sáng lên, các hiệu ứng glassmorphism, glow orb và sao 3D gần như "biến mất" vì không còn tương phản.

---

🔧 Cách 1: Sửa file HTML (khuyên dùng — an toàn, không ảnh hưởng trang khác)

Tôi đã sửa file nhan-vat.html cho bạn, chỉ thêm !important vào dòng nền để "chống đè" từ navbar, đồng thời giữ nguyên toàn bộ biến Jinja2 ({{ stars }}, {% for %}, v.v.) để chạy đúng với Flask:

Thay thế file templates/nhan-vat.html cũ bằng file này:

nhan-vat.html

Điểm sửa chính:

css

body {
    background: var(--deep-bg) !important; /* Chống đè từ navbar */
    color: #fff;
    ...
}

---

🔧 Cách 2: Sửa tận gốc trong app.py (nếu bạn muốn nhiều trang đẹp sau này)

Nếu sau này bạn còn làm thêm trang 3D khác, thay vì dùng !important ở mỗi file, bạn có thể sửa _inject_shared_navbar để không chèn background-color vào các trang có class đặc biệt. Thêm đoạn này vào đầu hàm _inject_shared_navbar:

Python

# Bỏ qua các trang game/3D có giao diện riêng (không chèn body background)
if 'id="bg-canvas"' in html or request.path.startswith("/nhan-vat"):
    # Chỉ chèn navbar HTML, không chèn CSS body background
    NAVBAR_HEAD_ASSETS_LIGHT = NAVBAR_HEAD_ASSETS.replace(
        "background-color: #f4f6f9;", ""
    )
    html = html.replace("</head>", NAVBAR_HEAD_ASSETS_LIGHT + "</head>", 1)
    # ... phần còn lại giữ nguyên

---

Chỉ cần bấm tải file ở trên → copy đè vào templates/nhan-vat.html → refresh trang là nền đen 3D, glassmorphism và sao sẽ quay lại ngay! 🌌

Nội dung chính