/* ============ NỀN CHUNG — màu theo logo MyPAS (xanh mòng két + cam) ============ */ /* Màu lấy theo WEBSITE CHÍNH THỨC của trung tâm (cô Quỳnh gửi ảnh 25/07/2026): thanh điều hướng teal, chữ "My" cam — "PAS" teal, sóng cam ở chân banner. Bản trước teal hơi xỉn (#0F8B8D) và cam ngả vàng (#F49D37) nên nhìn lệch tông so với web. */ :root { --xanh: #14A0A0; /* teal MyPAS — màu thanh điều hướng trên web */ --xanh-dam: #0D8081; /* teal đậm — nút bấm khi rê chuột, viền nhấn */ /* ⭐ 22/08/2026 — teal SÁNG, sinh ra cho đầu sáng của dải chào Trang chủ. ⛔ Đây KHÔNG phải màu logo, đừng đem dùng cho chữ hay viền: trên nền trắng nó chỉ đạt tương phản ~2,1 lần. Chỉ dùng làm nền. */ --xanh-sang: #2FBFB2; --xanh-nhat: #E8F5F5; --cam: #F5821F; /* cam MyPAS — chữ "My" trong logo, sóng banner */ --cam-dam: #DC7014; /* 🎨 05/08 (cô Quỳnh: thiết kế "lộ rõ AI", cần human + dễ nhìn hơn) — chuyển bộ xám XANH LẠNH (rất "khuôn mẫu") sang xám ẤM trung tính, mắt dễ chịu hơn; viền vẫn rõ, chữ tăng tương phản. */ /* ⭐ 18/09/2026 — TRẢ VỀ #F6F5F3. Boss: *"các block trong điểm danh bị trắng quá để lại như cũ đi"*. Đo được: thẻ lớp ăn `--the` = #FFFFFF (chưa bao giờ đổi). Khi `--nen` cũng trắng thì thẻ trắng nằm trên nền trắng — chìm hẳn, chỉ còn viền `--vien` mờ phân biệt. #F6F5F3 là màu cũ: ngà rất nhạt, đủ để thẻ nổi lên. ⛔ CHỈ trả `--nen`. `--the`, `--nen2` và nền bảng sheet GIỮ NGUYÊN — đo được `.home-khoi`, `.bcs-bang`, `.sheet-moi` đều có nền trắng RIÊNG, không ăn theo body, nên bảng vẫn trắng tinh đúng như Boss vừa duyệt. */ --nen: #F6F5F3; --the: #FFFFFF; --vien: #D6D2CB; /* ⛔ PHẢI CÓ ở cả hai chế độ. Biến không khai thì `border-color:var(--vien-ro)` nở ra rỗng và trình duyệt lấy `currentColor` — viền thành màu chữ, đen kịt. Ở chế độ sáng nền thẻ vốn trắng nên viền hơi đậm hơn `--vien` là đủ. */ --vien-ro: #B9B3AA; --chu: #1F1D1A; --mo: #6B6660; /* ⛔⛔ VÁ 28/08/2026 (chiều) — `--chu-mo` ĐANG ĐƯỢC DÙNG Ở 31 CHỖ MÀ CHƯA HỀ ĐƯỢC KHAI. CSS gặp biến không có thì bỏ qua nguyên dòng khai màu, nên 31 dòng chữ phụ ấy (lời dẫn dưới tiêu đề, lời gợi ý dưới ô nhập, chú thích bảng…) lâu nay hiện bằng ĐÚNG MÀU CHỮ CHÍNH — không mờ đi chút nào, nên đọc vào là mọi thứ đều "quan trọng như nhau". Hỏng IM LẶNG: không lỗi, không cảnh báo. Đặt nó thành bí danh của `--mo` là chữa cả 31 chỗ một lượt, và tự đổi theo nền tối vì `--mo` đã có bản nền tối riêng. KHÔNG đi sửa 31 dòng kia — sửa tay 31 chỗ thì sót là chắc, mà bí danh thì không sót được. */ --chu-mo: var(--mo); --do: #C0392B; /* ✅ 22/08/2026 — MÀU "MÁY VỪA ĐIỀN HỘ", cho tích xanh ở hộp Thêm học sinh. Cô Quỳnh: *"AI chạy xong thì nó phải hiện tích xanh xanh lên để nhận biết được nó điền chưa"*. ⛔ ĐÃ ĐO, ĐỪNG LÀM NHẠT ĐI: #17703D trên nền trắng đạt 6,14 — trên chuẩn 4,5. Sắc #1F8A4C nhìn tươi hơn nhưng chỉ được 4,38, tức KHÔNG ĐẠT; đã thử và bỏ. Chuyện chữ mờ trong app này đã phải sửa năm lần rồi. ⛔ Đây là màu RIÊNG cho "máy điền hộ", KHÔNG dùng lại cho trạng thái tốt/xấu của nghiệp vụ — hai thứ ấy trộn màu là người ta đọc nhầm ý. */ --ai-ok: #17703D; --ai-ok-nen: #F1F9F4; /* ⭐ 21/08/2026 — hai sắc đỏ RẤT NHẠT, sinh ra cho việc quan trọng/khẩn cấp ở màn Công việc. Cô Quỳnh: *"phải có màu nổi bật như đỏ lên nhưng ko được màu quá mức gây khó nhìn"*. Nên đây là mức nền chỉ đủ để mắt LƯỚT QUA là thấy, không phải mảng màu. Đo: #FDF4F3 lệch khỏi trắng đúng ~3%. ⛔ Đừng đậm thêm. Đậm lên là quay lại đúng cái nền pastel đã bị cô chê "màu mè, lộ ra UI của AI" và đã gỡ ngày 21/08 (xem chú thích .nv-the). */ --do-nen: #FDF4F3; /* nền việc quan trọng — đỏ nhạt gần như trắng */ --do-nen2:#FBEAE7; /* nền việc QUÁ HẠN — đậm hơn một nấc, vẫn rất nhạt */ /* ⭐ HỔ PHÁCH = "ĐÃ CÓ NGƯỜI NHẬN" — cô Quỳnh 21/08/2026: *"cái đã tiếp nhận phải rõ màu khác để đỡ phải nhìn đọc lại ô đó đã chọn tiếp nhận chưa chữ bé khó đọc"*. ⛔ KHÔNG bịa màu mới: công cụ Yêu cầu giáo viên đã dùng đúng sắc hổ phách này cho dòng " đã tiếp nhận" (`.yc-nhan-boi`, #9A6400) từ 07/08. Nay Công việc và Trang chủ dùng CHUNG, nên đi đâu trong app thì hổ phách cũng chỉ có một nghĩa duy nhất: có người ôm rồi, chưa xong. ⛔ Chữ dùng `--nhan-chu` (#9A6400) chứ KHÔNG dùng `--cam` (#F5821F). Cam thương hiệu trên nền trắng chỉ đạt tương phản ~2,3:1 — đọc không nổi. Hổ phách đậm đạt ~4,9:1. Cam vẫn dành cho logo và mảng trang trí. */ --nhan-chu: #9A6400; /* chữ + biểu tượng "đã tiếp nhận" */ --nhan-vien:#D9A441; /* nét viền trái của thẻ, viền chip */ --nhan-nen: #FFF8E6; /* nền chip — hổ phách rất nhạt, bớt đục (18/09) */ /* ⭐ 02/08/2026 — hai biến này ĐÃ ĐƯỢC DÙNG 12 chỗ (nền khung công cụ, chip, tab, form…) NHƯNG TRƯỚC ĐÂY CHƯA HỀ ĐỊNH NGHĨA → var(--nen2) thành trong suốt → nền 4 mùa lọt qua làm CÁC KHUNG TRẮNG KHÓ NHÌN (cô Quỳnh báo). Định nghĩa ở đây là mọi khung công cụ có nền ĐẶC, đọc rõ trên mọi ảnh nền. */ --nen2: #F3F3F3; /* nền panel/chip/tab — xám TRUNG TÍNH, bỏ hẳn sắc xanh (18/09: Boss chê "trắng xanh nước biển") */ --muc: #0D8081; /* màu chữ mục/nhấn (teal đậm) */ --nen-o: #FFFFFF; /* nền ô nhập — luôn trắng đặc để đọc rõ trên nền mùa */ /* màu ô giá trị — nhại đúng bảng thật */ --o-tot: #1E7C45; /* Đ / Đủ */ --o-nghi: #B3403A; /* X / Nghỉ */ --o-thieu: #E8A317; /* Thiếu / CHT */ --o-quen: #5A6478; /* Q / Quên vở / Quên phiếu */ /* màu khối DAY — nâu và navy xen kẽ như sheet thật */ --day-nau: #5C4033; --day-navy: #1F2A5A; /* ⭐ HÀNG TIÊU ĐỀ BẢNG KIỂU GOOGLE SHEETS — cô Quỳnh 21/08/2026: *"các tên cột title ở trên cùng cho background nó màu xanh lá như trong sheet CTS đó — thiết kế title cột ở đầu màu xanh và ở dưới trắng hết."* ⛔ Đây là XANH LÁ thật, KHÔNG phải teal. Ba biến tên "xanh" sẵn có của app (--xanh, --xanh-dam, --xanh-nhat) đều là teal mòng két theo logo MyPAS — dùng chúng là ra đúng màu cũ cô đã chê. */ /* ══════════════════════════════════════════════════════════════════════════ 🟩 SỬA 23/08/2026 — cô Quỳnh: *"màu xanh này bị đậm quá làm chữ bị tối đi … bạn chuyển màu nào khác cho việc nhìn chữ title nó dễ và đẹp rực rỡ nét hơn nhé áp cho tất cả công cụ của giáo vụ dạng sheet"*. ⛔ ĐO TRƯỚC KHI SỬA, và số đo lật ngược phán đoán đầu tiên: chữ KHÔNG hề thiếu tương phản — bản tối đo được 10,69 lần, gấp hơn hai lần ngưỡng. Cái "tối" cô thấy đến từ BA chỗ khác, cả ba đều đo được: ① nền bản tối #14472A chỉ sáng 4,8% — gần như đen, nên cả hàng tiêu đề là một dải nặng, và nó chỉ hơn nền ô dữ liệu 1,55 lần nên còn CHÌM vào bảng thay vì nổi lên trên. ② chữ bản tối #D8E8DD KHÔNG PHẢI màu trắng — chỉ sáng 78%. Đây là nghĩa ĐEN của câu "chữ bị tối đi"; nâng tương phản không chữa được, vì tương phản vốn đã dư. ③ viền chỉ hơn nền 1,30 lần → vạch chia giữa các ô tiêu đề gần như vô hình, nên hàng tiêu đề đọc ra là MỘT KHỐI LIỀN chứ không phải các cột. Nay: nền sáng lên 2,9 lần · chữ về trắng thật · vạch chia thấy được. ⛔ HAI MÀU NHÌN ĐẸP HƠN ĐÃ BỊ LOẠI BẰNG SỐ, ĐỪNG DỰNG LẠI: #0F9D58 (xanh Google Sheets) — chữ trắng chỉ 3,51 lần #1B8A55 — chữ trắng chỉ 4,36 lần Cả hai tươi hơn hẳn khi nhìn, và cả hai đều rớt chuẩn chữ thường 4,5. ⛔ Bản SÁNG và bản TỐI nay DÙNG CHUNG một bộ màu — cố ý. Ràng buộc "chữ trắng ≥ 4,5" ép nền về cùng một khoảng ở cả hai chế độ, nên tách ra chỉ tạo thêm chỗ để lệch nhau. Chú thích cũ ở đây ghi "đạt 5,5 lần" là SAI SỐ: màu cũ #1E7C45 đo lại chỉ được 5,22. */ --dau-bang-nen: #00793A; /* xanh lá — chữ trắng 5,53 lần · nổi khỏi ô 3,00 lần */ --dau-bang-chu: #FFFFFF; --dau-bang-vien: #004D1B; /* vạch chia ô trong hàng tiêu đề — hơn nền 1,83 lần */ /* ══════════════════════════════════════════════════════════════════════════ 🎨 BỐN NẤC BO GÓC — cô Quỳnh 22/08/2026, học theo shadcn ────────────────────────────────────────────────────────────────────────── ⛔ CHỈ CÓ BỐN NẤC. Cần bo góc thì lấy một trong bốn cái này, ĐỪNG gõ số px mới. Lý do rất thật: trước đây app rải rác 7·8·9·10·12·14px, đứng cạnh nhau thì mắt không gọi tên được cái sai nhưng vẫn thấy "chưa chỉn chu". Bốn nấc đều đặn là một nửa cái làm nên vẻ ngoài của shadcn. ⛔ ĐỪNG thêm nấc thứ năm. Thấy cần nấc mới nghĩa là đang chọn sai nấc. */ /* 🔲 02/09/2026 — CẢ NĂM NẤC VỀ 0. Cô Quỳnh: *"sửa bo tròn đi, tôi không muốn bo tròn nữa"*, cô chọn nút "sửa chỗ chung, cả app đổi một lượt". ⛔ ĐỪNG XOÁ BỐN TÊN NÀY dù chúng cùng bằng 0. Chúng là thang đo: 580 chỗ trong app đang gọi tên nấc chứ không gõ số. Muốn bo tròn trở lại thì sửa đúng năm số ở đây (6 · 8 · 10 · 14 · 2 là bộ cũ), cả app theo ngay. Xoá tên đi là lần sau phải đi rải lại 580 chỗ bằng tay. */ /* ⛔ HAI TẦNG, ĐỪNG "DỌN CHO ĐỀU" VỀ MỘT SỐ. Soi ảnh Supabase cô Quỳnh gửi: nút, ô nhập, nhãn (Connect · PRO · PRODUCTION · ô Search) vẫn bo 4–6px; chỉ BẢNG và TẤM NỀN mới vuông hẳn. Để cả năm nấc về 0 một lượt thì cô Quỳnh xem xong nói ngay là "cứng" — đã vấp đúng lần đầu, sáng 02/09. · nấc NHỎ (sm · md) = thứ người ta BẤM và GÕ → 4px cho mềm tay · nấc TO (lg · xl · sheet) = KHUNG CHỨA → 0, dán liền nhau */ --r-sm: 4px; /* chip · nhãn · nút bé xíu */ --r-md: 4px; /* nút · một hàng trong thanh bên */ /* ⭐ 10/09/2026 — NẤC RIÊNG CHO Ô NGƯỜI TA GÕ CHỮ. Boss: *"Ô điền chương trình bạn thiết kế bo tròn lại cho tôi"*, và Boss bấm nút *"bo hết mọi ô nhập trong app cho đồng bộ"*. ⛔ VÌ SAO KHÔNG NÂNG THẲNG --r-md: nấc ấy đang gánh cả NÚT BẤM. Nâng nó là mọi nút trong app tròn theo — Boss chỉ hỏi ô nhập, và đã bỏ qua lựa chọn "bo cả nút" khi tôi đưa ba nút bấm ra. ⛔ VÀ KHÔNG ĐỤNG --r-lg / --r-xl: hai nấc ấy Boss chốt 02/09 phải là 0px. Nhiều ô nhập đang gọi nhầm --r-lg (nên mới vuông chằn chặn) — chỗ nào là ô nhập thì trỏ sang --r-o, KHÔNG đổi giá trị của --r-lg. */ --r-o: 8px; /* ô nhập · ô chọn · ô gõ nhiều dòng */ --r-lg: 0px; /* panel · khối con trong thẻ */ --r-xl: 0px; /* ⭐ 31/08/2026 — GÓC BẢNG DẠNG SHEET. Cô Quỳnh ưng cách sổ tuyển sinh làm: bảng tính thì góc phải VUÔNG, không bo mềm như thẻ. Mọi khung cuộn bọc bảng sheet lấy chung biến này — đổi một chỗ là cả app theo. ⛔ ĐỪNG nâng lên 6px+ "cho mềm": mềm là hết giống bảng tính, đúng thứ cô Quỳnh bảo sửa. Muốn vuông hẳn thì để 0. */ --r-sheet: 0px; /* thẻ lớn · hộp thoại — về 0 ngày 02/09/2026 */ /* ══════════════════════════════════════════════════════════════════════════ 🌫 HAI LỚP BÓNG — nhẹ tới mức gần như không thấy, và đó là chủ ý ────────────────────────────────────────────────────────────────────────── Thẻ shadcn nổi lên khỏi nền bằng BÓNG chứ không bằng đường kẻ đậm. Bóng đổ màu theo chữ (#1F1D1A) chứ không phải đen tuyền — đen tuyền trên nền xám ấm ra một vệt xám lạnh, nhìn bẩn. ⛔ ĐỪNG tăng độ mờ lên. Bóng đậm là đúng cái vẻ "thẻ nổi bồng bềnh" mà cô Quỳnh đã chê là lộ UI của AI. */ --bong-1: 0 1px 2px 0 rgba(31,29,26,.05); --bong-2: 0 1px 3px 0 rgba(31,29,26,.07), 0 1px 2px -1px rgba(31,29,26,.05); /* Vòng sáng quanh ô đang gõ. shadcn luôn có; app mình trước đây chỉ đổi màu viền — người dùng bàn phím gần như không thấy mình đang ở ô nào. */ --vong: 0 0 0 3px rgba(20,160,160,.24); /* Viền NHẠT — dùng cho đường kẻ BÊN TRONG một thẻ (ngăn hai phần của cùng một khối). ⛔ KHÔNG thay `--vien`: viền bảng điểm danh và sổ tuyển sinh phải rõ, cô Quỳnh muốn giống Google Sheets. Đây là biến THÊM, không phải thay. */ --vien-nhe: #E7E3DD; } /* ============ 🌙 CHẾ ĐỘ ĐEN (DARK MODE) — cô Quỳnh 03/08/2026 ============ Bật bằng class `body.toi` (nhớ trong máy). Đổi bộ BIẾN MÀU sang tông tối rồi đắp lại vài bề mặt còn dùng màu TRẮNG CỨNG để KHÔNG chỗ nào chữ tối trên nền tối (cô: "chuyển sang đen thì vẫn phải nhìn được chữ/block, không xung đột màu"). */ /* 🏛 06/08/2026 — BẢNG MÀU NỀN TỐI BẢN DOANH NGHIỆP. Cô Quỳnh: "màu đen giống game quá, không phải màu thiết kế của business, nhiều góc gây loá, chữ bị che khuất." Bản cũ sai ở ba chỗ, sửa cả ba: 1. Nền ám XANH NAVY (#0E1621, #212F40). Xám ám xanh lạnh là tông game/khoa học viễn tưởng. → đổi sang xám TRUNG TÍNH, không ám màu nào. 2. Màu nhấn TEAL NEON (#5AD0C6) sáng chói trên nền tối → thành "phát sáng". → hạ xuống teal dịu (#4DB6AC), vẫn đủ tương phản đọc chữ. 3. VIỀN quá sáng (#44596F) — đây là thủ phạm chính gây loá: mỗi cái khung đều có một đường sáng viền quanh, cả màn hình thành lưới kẻ chói mắt. → viền rất nhẹ (#2E353B), chỉ đủ phân tách khối. Thêm: chữ chính KHÔNG dùng trắng gắt (#EDF3F9 → #DCE1E6) cho đỡ chói khi nhìn lâu. Nguyên tắc chung của nền tối chuyên nghiệp: nền trang tối nhất, thẻ sáng hơn MỘT bậc, viền gần như vô hình, màu nhấn dùng dè. Sáng dần theo tầng — không dùng viền sáng để phân tách. */ body.toi { --xanh-nhat:#1B2C2E; /* nền nhấn nhạt (rê chuột, ô được chọn) */ --nen:#1C2025; /* nền trang — xám trung tính, KHÔNG ám xanh */ --the:#24292F; /* thẻ / khung — sáng hơn nền một bậc */ /* ✅ Bản nền tối của màu "máy vừa điền hộ". Sáng hẳn lên chứ không giữ nguyên #17703D — sắc ấy trên nền #1B1F23 gần như chìm hẳn. Cùng sắc với `--tt-chay-chu` đang dùng cho trạng thái "đang chạy", có sẵn tiền lệ. */ --ai-ok:#7FD6A0; --ai-ok-nen:rgba(127,214,160,.10); --nen2:#2C3238; /* panel · chip · tab */ --nen-o:#272C32; /* ô nhập */ /* ⛔ HAI BẬC VIỀN, ĐỪNG GỘP LẠI LÀM MỘT — sửa 22/08/2026. Bản cũ chỉ có #2E353B với ghi chú "viền RẤT nhẹ — chìa khoá làm dịu mắt". Nhẹ thì đúng là dịu, nhưng nhẹ quá thì thành không có. Cô Quỳnh: *"các block tên nhân viên ở công cụ nhắc việc tôi thấy cứ khó nhìn các block kiểu gì á các viền block như tàng hình ý."* Đo ra đúng thế: #2E353B trên nền thẻ #1B1F23 chỉ hơn nhau 1,3 lần — mắt thường không tách nổi. Chuẩn WCAG cho ĐƯỜNG VIỀN của thứ bấm được là 3 lần. --vien #3A434B đường kẻ, vách ngăn, viền ô nhập → vẫn dịu --vien-ro #626D78 viền KHỐI BẤM ĐƯỢC (thẻ nhân viên, thẻ lớp…) → 3,1 lần ⛔ ĐỪNG HẠ `--vien-ro` XUỐNG CHO "DỊU HƠN". Bản đầu tôi chọn #5C6771 vì nhìn thấy hợp mắt, đo ra 2,87 — hụt chuẩn, và hụt đúng cái kiểu không ai nhận ra bằng mắt. Bài `thu-nen-toi-luoi-va-vien.js` đo lại con số này mỗi lần chạy. ⛔ Đừng đẩy `--vien` lên bằng `--vien-ro` cho tiện. Lưới bảng, vạch ngăn và viền ô nhập dùng chung `--vien`; kéo tất cả lên 3 lần thì cả màn hình thành mạng nhện sáng, đúng cái "chói" mà ba lần chỉnh chữ trước đã tránh. */ --vien:#434C55; --vien-ro:#727D88; /* 06/08 (lần 2, cô Quỳnh: "để màn hình đen thì màu chữ phải bớt chói lại"): hạ thêm một bậc nữa. #DCE1E6 vẫn còn gắt khi nhìn lâu; #CBD2D8 vẫn thừa tương phản để đọc (khoảng 11:1 trên nền #14171A) mà mắt dễ chịu hơn hẳn. */ /* 🌙 13/08/2026 (lần 3) — cô Quỳnh: *"chữ khi để nền đen phải như chữ Claude màn hình tối, vì chữ trong app tôi vẫn thấy sáng"*. Hai bản trước chỉ HẠ ĐỘ SÁNG (#EDF3F9 → #DCE1E6 → #CBD2D8) mà vẫn chói. Vì sai không nằm ở độ sáng — nằm ở SẮC: #CBD2D8 ám XANH LẠNH. Chữ lạnh trên nền xám thì mắt đọc thành "sáng gắt", hạ mấy cũng vậy. Các giao diện tối làm tốt (Claude là một) đều dùng chữ ám ẤM một chút, ngả kem. Nay đổi SẮC chứ không hạ tiếp: #D2CEC7 — ấm, trung tính, tương phản ~10,8:1 trên nền #14171A (thừa chuẩn 4,5:1), mà nhìn lâu êm hơn hẳn. */ --chu:#F4F1EC; /* chữ chính — trắng ngà ẤM, KHÔNG ám xanh, không trắng tinh */ --mo:#B3AEA6; /* chữ phụ — cùng sắc ấm với chữ chính */ --chu-mo:var(--mo); /* phải khai LẠI ở đây — xem lý do ở `:root` */ --muc:#4DB6AC; /* màu nhấn — teal DỊU, bỏ neon */ /* Nền tối: đầu sáng của dải chào hạ xuống, không thì nó thành một vệt phát sáng giữa màn đen — đúng lỗi "loá" cô Quỳnh đã chê ngày 06/08. */ --xanh-sang:#1F8F87; --do:#E5766C; --o-tot:#5BB37C; --o-nghi:#E08A82; --o-thieu:#D9AE5A; --o-quen:#8A929C; /* Nền đỏ nhạt bản TỐI: không pha trắng mà pha vào chính nền tối, không thì ra một mảng hồng chói giữa màn đen. */ --do-nen:#352423; --do-nen2:#38211F; /* Hổ phách bản tối: chữ SÁNG lên, nền và viền TỐI đi — cùng vai trò, đảo chiều. ⛔ Đừng bê nguyên #9A6400 sang: trên nền #1B1F23 nó tối gần bằng nền. */ --nhan-chu:#E4C88A; --nhan-vien:#7A5F2E; --nhan-nen:#2B2418; /* 🎨 22/08/2026 — bộ bóng/vòng/viền-nhạt bản TỐI. ⛔ Bóng nền tối phải ĐẬM HƠN bản sáng, nghe ngược nhưng đúng: trên nền tối, bóng nhạt biến mất hoàn toàn nên thẻ dính bẹp vào nền. shadcn cũng làm vậy. ⛔ Viền nhạt nền tối phải SÁNG hơn nền, không phải tối hơn. */ --bong-1: 0 1px 2px 0 rgba(0,0,0,.32); --bong-2: 0 1px 3px 0 rgba(0,0,0,.4), 0 1px 2px -1px rgba(0,0,0,.28); --vong: 0 0 0 3px rgba(77,182,172,.26); --vien-nhe:#2E343A; /* ⛔⛔ BỎ HẲN BỘ MÀU RIÊNG CHO BẢN TỐI — 23/08/2026, ĐỪNG DỰNG LẠI. Chỗ này trước đây hạ nền xuống #14472A với lý do "nền tối mà để #1E7C45 thì nó là mảng sáng chói giữa màn đen". Lý do ấy nghe hợp mà SAI, và cô Quỳnh chính là người phát hiện: hạ tới 4,8% độ sáng thì hàng tiêu đề chỉ còn hơn ô dữ liệu 1,55 lần — nó không "dịu đi", nó CHÌM MẤT. Cộng với chữ #D8E8DD vốn chỉ sáng 78%, cả hàng đọc ra là một dải xám tối. Đó là cái cô kêu 23/08. Nay cả hai chế độ dùng CHUNG bộ màu khai ở đầu file — lý do đầy đủ ghi tại đó. Nếu sau này lại thấy "chói quá", hãy ĐO trước: nền tiêu đề phải hơn nền ô ít nhất 1,5 lần thì mới còn ra hàng tiêu đề. ⛔ NHƯNG PHẢI KHAI LẠI ĐỦ BA BIẾN Ở ĐÂY, ĐÚNG BẰNG GIÁ TRỊ Ở `:root` (dòng 157-159). Gỡ trắng khối này thì `:root` vẫn đổ xuống nên MÀU KHÔNG SAI — nhưng bài `kiem-thu/thu-nen-toi-luoi-va-vien.js` (dòng 224-225) đọc thẳng hai biến BÊN TRONG `body.toi` để đo hàng "Day *8", không thấy là nó đỏ. Đã dính đúng lỗi này ngày 23/08 (bài rơi xuống 37/38). Khai lại là hết, và vì giá trị y hệt `:root` nên KHÔNG đẻ ra bộ màu thứ hai để lệch nhau. ⛔ Sửa màu ở dòng 157-159 thì sửa luôn ba dòng dưới đây cho khớp. */ --dau-bang-nen: #00793A; --dau-bang-chu: #FFFFFF; --dau-bang-vien: #004D1B; background:var(--nen); color:var(--chu); } /* ══════════════════════════════════════════════════════════════════════════════ 🌙 VÁ 22/08/2026 — 32 MẢNG CÒN "TRẮNG XOÁ" GIỮA NỀN TỐI ────────────────────────────────────────────────────────────────────────────── Cô Quỳnh: *"nhìn lại toàn bộ nền đen sửa cả trong điểm danh nữa cái nào còn trắng xóa thì sửa lại cho phù hợp với nền đen"*. CÁCH TÌM — không dò bằng mắt. Viết phép soi đọc cả 3.497 luật CSS, lọc ra luật nào gõ cứng nền trắng (`#fff` · `white` · `rgb(255,255,255)`) mà KHÔNG có bản `body.toi` ĐẶT NỀN. Ra 37; bỏ luật in giấy (giấy vốn trắng) còn 36; bỏ bốn chỗ CỐ Ý trắng (bên dưới) còn 32; bỏ 16 chỗ đã có bản nền tối rồi — CÒN 16 THẬT. ⛔ HAI LẦN PHÉP SOI ĐẾM SAI, GHI RA ĐÂY ĐỂ PHIÊN SAU KHỎI DẪM LẠI: · Bản đầu lấy bộ chọn bằng `slice(...).split("\n").pop()` để né chú thích — hoá ra cắt cụt mọi bộ chọn viết XUỐNG DÒNG, nên 16 luật vốn đã có bản nền tối bị tính là chưa lo. Cách đúng: bỏ chú thích TRƯỚC rồi mới tách luật. · Bản thứ hai coi "có `body.toi .X` bất kỳ" là đã lo — nhưng rất nhiều luật nền tối chỉ đổi MÀU CHỮ hoặc VIỀN, nền vẫn trắng nguyên. Phải hỏi luật ấy có thật sự đặt `background` không. Hai lỗi ngược chiều nhau, mỗi lỗi lệch đúng 16 — trùng hợp làm con số nhìn như đã đúng. Chỉ khi ĐỐI CHIẾU hai bản mới lòi ra. Cách này bắt được cả những màn KHÔNG mở ra chụp được — điểm danh, sổ tuyển sinh, lịch test đều có tên học sinh thật nên không được mở để soi bằng mắt. ⛔⛔ BỐN CHỖ CỐ Ý GIỮ TRẮNG, ĐỪNG "SỬA NỐT" CHÚNG: · `.kq-qr-co img` và `.kq-qd-qr img` — nền của MÃ QR. Máy quét cần nền sáng quanh mã; đổi sang nền tối là mã không quét được nữa, mà hỏng kiểu đó không ai phát hiện cho tới lúc phụ huynh đứng ở quầy giơ điện thoại. · `#bangDemNguoc .bdn-ngay` và `#daiBaoTri button` — nút trắng nằm TRÊN một dải màu đặc (teal đếm ngược · đỏ bảo trì). Dải ấy giữ nguyên màu ở cả hai chế độ, nên nút cũng phải giữ nguyên. ⛔ DÙNG ĐÚNG BIẾN THEO VAI TRÒ, đừng đổ hết về `--the`: --nen-o ô người ta gõ chữ vào --nen2 chip · nút phụ · nhãn --the thẻ · hộp · ô bảng · thanh dính mép Đổ hết về một màu là mất hẳn tầng sâu, cả màn phẳng lì — đúng thứ khối luật ngay dưới đây đã phải chữa một lần rồi. ══════════════════════════════════════════════════════════════════════════════ */ /* — Ô người ta gõ chữ vào — */ body.toi .ht-o input, body.toi .ht-o select, body.toi .ht-chu textarea, body.toi .thanh-tim input, body.toi .o select:not([class*="gt-"]), body.toi .o select option, body.toi .dh-day .dh-chon { background:var(--nen-o); color:var(--chu); } /* Ô xổ bản sáng có viền trong `inset 0 0 0 1px #E0E6EC` — vệt sáng ấy trên nền tối thành đường kẻ chói. Hạ về viền chung. */ body.toi .o select:not([class*="gt-"]) { box-shadow:inset 0 0 0 1px var(--vien); } /* — Chip · nút phụ · nhãn — ⛔ CHỈ BỐN CÁI NÀY. `.chip` · `.nut-phieu` · `.nut-keocot` · `.nv-loc` · `.dh-day button` · `.pt-them button` ĐÃ CÓ bản nền tối từ trước, đặt đúng cùng biến — thêm lần nữa chỉ làm CSS phình và đẻ ra hai nguồn sự thật. */ body.toi .tths-cs-nut, body.toi .lt-nhom-sua, body.toi .nhan-gio, body.toi .thanh-cung-xem .ai { background:var(--nen2); color:var(--chu); } body.toi .lt-nhom-sua { border-color:var(--vien); } /* — Thẻ · hộp · thanh dính mép — ⛔ CHỈ BỐN CÁI NÀY. `.phan-menu` · `.pt-diem` · `.pt-form` · `.pt-day` · `.khung-note` · `.tdg-o` · `.nv-link` · `.nv-nguoi` · `.nvo-hop` · `.cs-moi-1` ĐÃ CÓ bản nền tối từ trước, cũng đặt `var(--the)`. ⛔ Riêng VIỀN của `.cs-moi-1` thì vẫn phải hạ: bản cũ chỉ lo nền, còn viền vẫn gõ cứng `#CDE8D5` — vệt xanh lá nhạt ấy trên nền đen thành đường kẻ sáng. */ body.toi .thanh-cong-cu, body.toi #theTenHS .ttHS-form, body.toi #bangCapNhat .bcn-hop, body.toi .nv-ct-them:hover i { background:var(--the); } body.toi .cs-moi-1 { border-color:var(--vien); } /* — Ô BẢNG — ⛔ ĐỪNG thêm luật nền tối cho `.luoi` hay `.phieu-bang` Ở ĐÂY. Đã thử sáng 22/08/2026 và cả hai đều sai chỗ: · `.luoi` — vô dụng. Bên trong lưới, `var(--the)` KHÔNG nở ra màu tối của `body.toi`; nó nở ra TRẮNG, vì lưới tự khai lại bộ biến màu cho riêng mình (tìm "LƯỚI ĐIỂM DANH THEO NỀN ĐEN" bên dưới). Đo bằng `getComputedStyle(th).getPropertyValue("--the")` → "#FFFFFF". · `.phieu-bang` — nằm TRONG tờ phiếu gửi phụ huynh, là vùng cấm đụng màu tối (đọc khối "TỜ PHIẾU BUỔI = TỜ GIẤY ĐỂ CHỤP" bên dưới). — */ /* ══════ 🌙 VÁ 13/08/2026 — 22 CHỖ CHỮ TỐI NẰM TRÊN NỀN ĐEN ══════ Cô Quỳnh: *"một số nút có chữ màu tối bị nền đen che khuất nhìn rất khó"*. Đã QUÉT CẢ FILE tìm đúng kiểu hỏng đó: luật CSS vừa đặt chữ màu TỐI, vừa KHÔNG đặt nền riêng, lại KHÔNG có bản cho `body.toi`. Trên nền sáng thì đẹp, bật nền đen là chữ tối chìm vào nền — ra đúng 22 chỗ dưới đây. ⛔ ĐỪNG bỏ chỗ nào: mỗi dòng là một nút/nhãn người dùng thật sự bấm. ⛔ Chỗ nào có nền riêng thì KHÔNG đụng — chữ tối trên chip sáng vẫn đọc tốt. */ body.toi .home-note-tt.xong, body.toi .lop-app-nhan, body.toi .dg-luutt.xong, body.toi .cs-buoi, body.toi .pd-dabiet { color:#7FD69A; } /* xanh "đã xong" — sáng lên cho nổi */ body.toi .tk-menu button.do, body.toi .pc-an, body.toi .yc-xoa-lo:not([disabled]), body.toi .pd-mau-xoa, body.toi .nv-b.xoa { color:var(--do); } body.toi .nv-han.do { color:#E8A05C; } /* quá hạn — cam sáng */ body.toi .nhom-thu h3, body.toi .o-ngay .gt-ngay, body.toi .psc-hop small, body.toi .pd-dong, body.toi .nv-meta, body.toi .nv-han { color:var(--mo); } body.toi .luoi .h-ngay { color:#9BB0D8; } /* đầu khối DAY — navy → xanh nhạt */ body.toi .luoi tr.hs-nop-noi .c-ten { color:#7FD69A; } body.toi .phieu-note-ngoai .nhan-note { color:#D9B764; } body.toi .tths-fu-dau { color:#7FB0EE; } body.toi .dau-chiapp { color:#B49BE0; } /* ══════ 🌙 VÁ 13/08/2026 (đợt 2) — NÚT KHÔNG ĐẶT MÀU CHỮ THÌ TRÌNH DUYỆT CHO MÀU ĐEN ══════ Cô Quỳnh: *"nút Sửa ở Nhắc việc bị đen xì không nhìn thấy được khi để nền đen"*. Đợt vá phía trên quét các luật CÓ ĐẶT chữ màu tối. Nút này thì KHÔNG ĐẶT MÀU CHỮ NÀO CẢ — mà