/* ONE VLU v1.2 — BẢNG MÀU BẢN SẮC (gói UI2 · KWV-378). Nạp ĐẦU TIÊN ở mọi trang (index · phone · bang · luyen · print/*).
   Một nguồn duy nhất: token cũ của từng tệp (--navy-* · --cap-* · --bd-* · --surface …) đều ÁNH XẠ vào --vlu-* bên dưới → mã UI không phải đổi.
   Mã màu THẬT của VLU (✅ đọc từ CSS chạy thật của vlu.edu.vn — gói R3, `_vlu-research/KIEN-TRUC-co-so-VLU.md` §6): đỏ #d72134 · đỏ đậm
   #b50315 / #a11927 · navy chữ #1f2251 / #101129 · vàng nhấn #febd25 · xám nền #e2e4e9 / #f2f5ff / #f5f6fc. Chỉ dùng MÀU, không logo thật.
   Toàn là HẰNG (không đổi theo theme): bộ sáng = --vlu-l-*, bộ tối «xám than đỏ» = --vlu-d-* → khối :root / [data-theme="light"] của từng tệp
   chọn bộ phù hợp (khối «luôn tối» như Thẻ Đen vẫn dùng được --vlu-d-*). Bỏ hẳn navy-đen + vàng đồng của Capella.
   Đo WCAG (docs/UI-VLU.md §9): chữ chính ≥ 11,7:1 · chữ phụ ≥ 5,1:1 · chữ đỏ (--vlu-red-ink) ≥ 6,1:1 trên mọi mặt sáng · chữ trắng trên đỏ 5,05:1.
   ⚠ Đỏ #d72134 làm CHỮ chỉ đạt trên nền TRẮNG (5,05:1) — trên mặt xám dùng --vlu-red-ink. */
:root {
  /* thương hiệu VLU ✅ */
  --vlu-red: #d72134;        /* nền nút chính · dải băng · gạch nhấn (chữ trắng 5,05:1) */
  --vlu-red-deep: #b50315;   /* rê chuột nút đỏ · bóng dải băng (chữ trắng 7,0:1) */
  --vlu-red-ink: #a11927;    /* chữ đỏ trên mặt sáng (≥ 6,1:1) */
  --vlu-red-glow: #ff8a98;   /* chữ / viền đỏ trên mặt tối (≥ 5,2:1) */
  --vlu-red-glow-2: #ffb3bd; /* chữ nhấn phụ trên mặt tối */
  --vlu-red-soft: #fcedef;   /* nền đỏ rất nhạt: dòng đang ở · ô TOP · đang chọn (theme sáng) */
  --vlu-red-tint: #f6ced2;   /* nền đỏ nhạt có chữ navy (10,4:1) */
  --vlu-red-mid: #efa6ae;    /* nền đỏ vừa có chữ navy (7,6:1) */
  --vlu-red-line: #e8a1aa;   /* viền đỏ nhạt */
  --vlu-navy: #1f2251;       /* navy chữ VLU: chữ chính · «mực» · nút phụ (theme sáng) */
  --vlu-navy-2: #3e4266;
  --vlu-navy-3: #575b7a;
  --vlu-night: #101129;
  --vlu-gold: #febd25;       /* vàng nhấn VLU: nền khối SỐ LIỆU (chữ navy 8,9:1) — dùng ít */
  /* trung tính (xám lạnh của VLU) */
  --vlu-paper: #ffffff;      /* «giấy» tự chứa (The One Page, thẻ, toast) ở cả 2 theme */
  --vlu-mist: #f5f6fc;       /* trắng xám lạnh (mặt phụ) */
  --vlu-mist-2: #eceef4;
  --vlu-mist-3: #e2e4e9;
  --vlu-paper-line: #d3d6de;
  --vlu-charcoal: #1f252d;   /* xám than: khung theme tối · Thẻ Đen */
  --vlu-concrete: #8c8f94;   /* xám bê tông: kẻ / viền / gạch nối — KHÔNG làm chữ */
  /* trạng thái */
  --vlu-stone: #1b6f6a;      /* xanh đá: tốt · đã xong · đứng vững (chữ trắng 5,95:1) */
  --vlu-stone-deep: #145753;
  --vlu-stone-soft: #e2f1ef;
  --vlu-stone-ink: #0f3f3b;
  --vlu-stone-glow: #6cc7bc;
  --vlu-earth: #b5541b;      /* cam đất: cảnh báo (chữ trắng 4,9:1) */
  --vlu-earth-ink: #6b300b;
  --vlu-earth-soft: #fbeee4;
  --vlu-earth-line: #d98a4e;
  --vlu-earth-glow: #f0a35e;
  --vlu-amber: #e8914a;      /* nền cảnh báo có chữ tối (6,3:1) */
  /* 5 đơn vị VLU Group ✅ (R3 §6.5) — chỉ tô HÌNH (ô màu, viền, cờ). Chữ trên PDU / UTS phải là chữ TỐI (§6.2) */
  --unit-vlu: #d72134; --unit-pdu: #00a86b; --unit-betu: #005bff; --unit-vlsc: #db1f32; --unit-vlsc-navy: #273376; --unit-uts: #ff8302;
  /* bộ SÁNG «học đường ban ngày» (MẶC ĐỊNH) — trắng + xám lạnh VLU, chữ navy */
  --vlu-l-bar: #ffffff; --vlu-l-bg: #f2f5ff; --vlu-l-card: #ffffff; --vlu-l-sub: #f5f6fc; --vlu-l-btn: #ffffff; --vlu-l-chip: #e2e4e9;
  --vlu-l-line: #d9dce4; --vlu-l-line-2: #b3b7c2;
  --vlu-l-text: #1f2251; --vlu-l-text-2: #3e4266; --vlu-l-text-3: #575b7a; --vlu-l-accent: #a11927;
  --vlu-l-sky: #ffffff; --vlu-l-sky-2: #eef1fb; --vlu-l-sky-3: #d6dae6;   /* trời sau canvas 3D (CSS .stage) — gói 3D đọc để chọn màu sàn */
  --vlu-l-shadow: 0 1px 2px rgba(31, 34, 81, .08), 0 8px 20px rgba(31, 34, 81, .10);
  --vlu-l-scrim: rgba(31, 34, 81, .38);
  /* bộ TỐI «xám than đỏ» */
  --vlu-d-bar: #0f1216; --vlu-d-bg: #15191f; --vlu-d-card: #1c2128; --vlu-d-sub: #232931; --vlu-d-btn: #262c35; --vlu-d-chip: #313842;
  --vlu-d-line: #363d47; --vlu-d-line-2: #4f5762;
  --vlu-d-text: #f2f3f7; --vlu-d-text-2: #c9cbd0; --vlu-d-text-3: #aeb1b8; --vlu-d-accent: #ff8a98;
  --vlu-d-sky: #2a3039; --vlu-d-sky-2: #181c22; --vlu-d-sky-3: #0f1216;
  --vlu-d-shadow: 0 2px 4px rgba(0, 0, 0, .30), 0 12px 28px rgba(0, 0, 0, .38);
  --vlu-d-scrim: rgba(10, 12, 15, .78);
  /* chữ · hình khối · chuyển động */
  --vlu-font: "Avenir Next", "Helvetica Neue", "Segoe UI", Roboto, system-ui, sans-serif;
  --vlu-r: 4px;              /* góc mặc định (Capella 10–14 px) */
  --vlu-r-lg: 6px;           /* góc khối lớn: bảng, lớp phủ, thẻ */
  --vlu-bar: 3px;            /* gạch đỏ nhấn trên tiêu đề khối */
  --vlu-dur: 160ms;
  --vlu-ease: cubic-bezier(.2, .7, .2, 1);
}
